 :root{
  --paper:#f7f0e3;--ink:#24211e;--muted:#7d7468;--line:#d7cbb8;
  --green:#59b54a;--green-dark:#398d32;--white:#fffdf8;
  --girl:#e978a8;--boy:#4d91d8;--purple:#8d6bd1;
  --shadow:0 10px 25px rgba(65,47,28,.13);
}
*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:"Trebuchet MS",Arial,sans-serif;background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.9),transparent 30%),linear-gradient(135deg,#efe1c9,#f8f2e8 48%,#e8d8bd);min-height:100vh}
button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}
.app{width:min(1180px,100%);margin:auto;padding:clamp(10px,2.5vw,22px)}
.header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.logo{font-size:clamp(35px,5.6vw,58px);font-weight:1000;letter-spacing:-3px;text-shadow:2px 3px 0 #fff;white-space:nowrap}
.logo span{color:var(--green)}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;border:2px solid #cdbfa9;background:#fffaf1;color:var(--ink);border-radius:13px;padding:10px 14px;font-weight:900;box-shadow:0 3px 0 #cdbfa9;min-height:44px}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #cdbfa9}
.btn.green{background:var(--green);color:#fff;border-color:var(--green-dark);box-shadow:0 3px 0 var(--green-dark)}
.pipette{font-size:1.2em;line-height:1}
.date-panel{max-width:850px;margin:10px auto 22px;padding:12px 14px 14px;border:2px solid rgba(215,203,184,.85);border-radius:22px;background:rgba(255,253,248,.68);box-shadow:var(--shadow)}
.date-topline{display:grid;grid-template-columns:56px minmax(0,1fr) 56px;gap:clamp(8px,2vw,20px);align-items:center}
.day-arrow{width:52px;height:52px;border:0;border-radius:16px;font-size:42px;line-height:1;background:#fffdf9;color:#171411;box-shadow:0 5px 18px rgba(0,0,0,.10);touch-action:manipulation}
.day-arrow:active{transform:scale(.96)}
.date-current{text-align:center;min-width:0}
.day-name{font-size:clamp(28px,5.5vw,48px);font-weight:1000;letter-spacing:.035em;line-height:1.05}
.day-date{font-size:clamp(14px,2vw,18px);font-weight:800;margin-top:6px;color:#61584d}
.week-label{font-size:12px;color:var(--muted);margin-top:4px}
.week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:14px}
.week-day{min-width:0;border:1px solid #d9cbb7;background:#fffaf1;border-radius:12px;padding:7px 3px 6px;text-align:center;color:var(--ink);display:flex;flex-direction:column;align-items:center;gap:4px}
.week-day .wd-name{font-size:11px;font-weight:900;color:#71685d}
.week-day .wd-num{font-size:16px;font-weight:1000}
.week-day .wd-checks{display:grid;grid-template-columns:repeat(5,5px);gap:2px;justify-content:center;min-height:5px}
.wd-checks i{width:5px;height:5px;border-radius:2px;background:#e5dac9;display:block}
.wd-checks i.checked{background:var(--green-dark);box-shadow:0 0 0 1px rgba(57,141,50,.12)}
.week-day.selected{border:2px solid var(--green-dark);padding:6px 2px 5px;background:#edf8e9}
.week-day.today:not(.selected){box-shadow:inset 0 0 0 1px #e3c78c}
.week-controls{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.btn-small{min-height:36px;padding:7px 10px;font-size:12px;box-shadow:none;border-width:1px;border-radius:10px}
.kids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.board{--accent:var(--green);min-width:0;background:var(--white);border:3px solid #d8ccb8;border-radius:23px;overflow:hidden;box-shadow:0 14px 30px rgba(65,47,28,.16)}
.board.girl{--accent:var(--girl)}.board.boy{--accent:var(--boy)}.board.space{--accent:var(--purple)}
.board-head{position:relative;padding:15px 16px 12px;text-align:center;background:linear-gradient(180deg,#fffefb,#f0e8da);border-bottom:3px solid #ded2bf}
.board-head:after{content:"";position:absolute;left:8%;right:8%;bottom:-7px;height:10px;background:var(--accent);border-radius:50%;opacity:.22}
.avatar{width:66px;height:66px;border-radius:50%;margin:0 auto 5px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:38px;border:5px solid white;box-shadow:0 4px 10px rgba(0,0,0,.15);overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover}
.kid-name{font-size:clamp(23px,2.6vw,30px);font-weight:1000;text-transform:uppercase;letter-spacing:-1px;overflow-wrap:anywhere}
.progress{margin:8px auto 0;max-width:300px;height:14px;border-radius:20px;background:#e5ddcf;border:2px solid #d3c5af;overflow:hidden}
.progress i{display:block;height:100%;background:var(--accent);width:0%;transition:width .2s}
.money{font-size:clamp(12px,1.3vw,15px);font-weight:900;margin-top:7px;color:#62594e}
.tasks{padding:10px 12px 14px}
.task{display:grid;grid-template-columns:52px minmax(0,1fr) 56px;gap:8px;align-items:center;min-height:66px;border-bottom:1px dashed #e4dbcc}
.task:last-child{border-bottom:0}
.task-icon{width:48px;height:48px;border-radius:14px;background:#f4eee3;border:2px solid #d9cdbb;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:27px;box-shadow:inset 0 2px 0 #fff}
.task-icon img{width:100%;height:100%;object-fit:cover}
.task-text{min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;line-height:1.12;overflow-wrap:anywhere;padding:3px;font-size:clamp(14px,1.65vw,19px)}
.switch{justify-self:end;width:53px;height:35px;border-radius:25px;border:2px solid #aaa;background:#e9e9e9;position:relative;padding:0;transition:.18s;box-shadow:inset 0 3px 5px rgba(0,0,0,.14)}
.switch:before{content:"";position:absolute;left:3px;top:3px;width:23px;height:23px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #999;transition:.18s}
.switch.on{background:var(--accent);border-color:var(--accent)}
.switch.on:before{left:23px}
.switch.on:after{content:"✓";position:absolute;left:7px;top:5px;color:white;font-size:14px;font-weight:1000}
.switch:disabled{opacity:.35;cursor:not-allowed}
.done .task-text{opacity:.45;text-decoration:line-through}.done .task-icon{opacity:.6;filter:grayscale(.3)}.empty-slot{opacity:.42}
.admin{display:none;margin-top:22px;background:#fffdf8;border:3px solid #d7cbb8;border-radius:20px;padding:18px;box-shadow:var(--shadow)}
.admin.show{display:block}.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field{display:flex;flex-direction:column;gap:5px}.field label{font-size:12px;font-weight:1000;color:#71685d;text-transform:uppercase}
.field input,.field select{width:100%;padding:10px;border:2px solid #d5c8b5;border-radius:10px;background:#fff;min-width:0}
.editor{margin-top:16px;padding:13px;border:2px solid #eadfce;border-radius:15px}
.editor-row{display:grid;grid-template-columns:42px minmax(0,1fr) 38px 38px 38px;gap:5px;align-items:center;margin:7px 0}
.editor-row input{width:100%;min-width:0;padding:8px;border:2px solid #ddd2c1;border-radius:9px}
.note{text-align:center;color:#81776a;font-size:12px;margin:14px 4px 5px}
.modal{position:fixed;inset:0;background:rgba(20,15,10,.6);display:none;align-items:center;justify-content:center;padding:18px;z-index:50}
.modal.show{display:flex}.modal-card{width:100%;max-width:350px;background:#fffdf8;border-radius:20px;padding:22px;box-shadow:0 20px 50px rgba(0,0,0,.3)}
.pin{width:100%;padding:13px;text-align:center;font-size:30px;letter-spacing:8px;border:3px solid #d3c6b3;border-radius:13px}.error-message{height:24px;color:#c33;font-weight:900;margin-top:6px}
@media(max-width:780px){
 .app{padding:10px}
 .header{gap:10px}.logo{font-size:clamp(34px,9vw,48px)}
 .kids{grid-template-columns:minmax(0,1fr);gap:14px}
 .board{border-width:3px;border-radius:20px}
 .board-head{padding:12px 12px 10px}.avatar{width:58px;height:58px;font-size:33px}
 .kid-name{font-size:25px}
 .task{grid-template-columns:54px minmax(0,1fr) 58px;min-height:67px;gap:7px}
 .task-icon{width:48px;height:48px}.task-text{font-size:clamp(16px,4.5vw,21px);min-height:48px}
 .switch{width:55px;height:37px}.switch:before{width:25px;height:25px}.switch.on:before{left:23px}
 .admin-grid{grid-template-columns:minmax(0,1fr)}
 .date-panel{padding:10px;border-radius:18px;margin-bottom:15px}
 .date-topline{grid-template-columns:44px minmax(0,1fr) 44px;gap:5px}
 .day-arrow{width:42px;height:46px;font-size:37px;border-radius:13px}
 .day-name{font-size:clamp(25px,7vw,38px)}
 .day-date{font-size:14px}
 .week-strip{gap:3px;margin-top:11px}
 .week-day{border-radius:9px;padding:6px 1px}
 .week-day .wd-name{font-size:9px}.week-day .wd-num{font-size:14px}
 .week-day .wd-checks{grid-template-columns:repeat(5,4px);gap:2px}
 .wd-checks i{width:4px;height:4px}
 .week-day.selected{padding:5px 0}
 .week-controls{gap:5px}.btn-small{font-size:11px;padding:6px 8px}
}
@media(min-width:781px) and (max-width:1000px){.kids{gap:12px}.task{grid-template-columns:45px minmax(0,1fr) 48px;gap:5px}.task-icon{width:42px;height:42px;font-size:24px}.switch{width:46px}.switch.on:before{left:17px}.task-text{font-size:15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.hidden{display:none!important}
.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:18px}
.login-card{width:min(100%,420px);background:#fffdf8;border:3px solid #d8ccb8;border-radius:26px;padding:clamp(22px,5vw,34px);box-shadow:0 18px 45px rgba(65,47,28,.2);text-align:center}
.login-card h1{font-size:clamp(23px,6vw,31px);margin:8px 0}
.login-card p{color:#74695b;margin:0 0 22px}
.login-label{display:block;text-align:left;font-weight:900;font-size:13px;margin:14px 0 6px;color:#62594e}
.login-input{display:block;width:100%;min-height:52px;border:2px solid #d5c8b5;border-radius:13px;background:#fff;padding:12px 14px;font-size:18px}
.pin-input{text-align:center;letter-spacing:8px}
.full{width:100%;margin-top:8px;min-height:52px;font-size:17px}
.text-button{border:0;background:transparent;text-decoration:underline;color:#62594e;font-weight:800;padding:16px 10px 0}
.user-pill{font-weight:900;background:#edf8e9;border:1px solid #c9e3c0;border-radius:12px;padding:10px 12px}
@media(max-width:780px){.header{align-items:flex-start}.header .actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.header .user-pill{grid-column:1/-1;text-align:center}.header .btn{width:100%;padding:10px 8px}.kids{grid-template-columns:minmax(0,1fr)}}
