/* Шрифты лежат в проекте (public/fonts, лицензия SIL OFL 1.1) */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/manrope-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/manrope-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/unbounded-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/unbounded-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ===== Дневная тема ===== */
:root{
 --bg:#f6f3ff;--paper:#ffffff;--paper-2:#f8f6ff;--ink:#16141f;--muted:#6f6b80;--line:#e8e4f4;--soft:#f0edfa;
 --brand:#6d5dfc;--brand-2:#9b6bff;--lime:#d6f45b;--coral:#ff7a59;
 --green:var(--brand);--accent:var(--lime);
 --grad:linear-gradient(135deg,#6d5dfc 0%,#9b6bff 55%,#ff8ab3 100%);
 --hero-orb:#d6f45b;--hero-glow:#d6f45b88;
 --shadow:0 1px 2px #1b14400a,0 8px 30px #1b14400f;--shadow-lg:0 30px 80px #1b144033;
 --glass:#ffffffb8;--r:22px;
 --sky:radial-gradient(900px 600px at 105% -10%,#ffd7b866,transparent 60%),radial-gradient(800px 600px at 60% -20%,#c9bcff66,transparent 60%),radial-gradient(700px 500px at -10% 110%,#e6f9a466,transparent 60%);
 --head:'Unbounded','Manrope',system-ui,sans-serif;
 font-family:'Manrope',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none;color-scheme:light;
}
/* ===== Ночная тема ===== */
:root[data-theme=dark]{
 --bg:#0b0a1a;--paper:#15132a;--paper-2:#1b1834;--ink:#f1efff;--muted:#a19cc0;--line:#2a2648;--soft:#221f3d;
 --brand:#8f82ff;--brand-2:#b794ff;--lime:#c8f05a;--coral:#ff8f73;
 --grad:linear-gradient(135deg,#2b1f7a 0%,#5a3fd1 50%,#a24fd0 100%);
 --hero-orb:#f4f1d6;--hero-glow:#fff6c255;
 --shadow:0 1px 2px #0008,0 10px 30px #0006;--shadow-lg:0 30px 90px #000c;
 --glass:#15132ac4;
 --sky:radial-gradient(1.2px 1.2px at 12% 18%,#fff9,transparent),radial-gradient(1px 1px at 27% 62%,#fff7,transparent),radial-gradient(1.4px 1.4px at 46% 12%,#fffa,transparent),radial-gradient(1px 1px at 63% 44%,#fff6,transparent),radial-gradient(1.3px 1.3px at 78% 22%,#fff9,transparent),radial-gradient(1px 1px at 88% 70%,#fff6,transparent),radial-gradient(1.2px 1.2px at 35% 88%,#fff7,transparent),radial-gradient(1px 1px at 92% 92%,#fff5,transparent),radial-gradient(900px 600px at 100% -10%,#5a3fd155,transparent 60%),radial-gradient(800px 600px at -10% 110%,#1e6b8a44,transparent 60%);
 color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--sky),var(--bg);background-attachment:fixed}
.theme-anim,.theme-anim *{transition:background-color .4s,color .4s,border-color .4s,box-shadow .4s!important}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;border:0;transition:background .18s,color .18s,transform .18s,box-shadow .18s,border-color .18s}
button:active:not(:disabled){transform:scale(.97)}
button:disabled{cursor:wait;opacity:.55}
button:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 60%,transparent);outline-offset:3px}
a{color:var(--brand)}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* layout */
.layout{min-height:100vh;display:grid;grid-template-columns:250px 1fr;gap:0}
.sidebar{margin:16px 0 16px 16px;padding:26px 18px 18px;border:1px solid var(--line);border-radius:28px;display:flex;flex-direction:column;background:var(--glass);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);position:sticky;top:16px;height:calc(100vh - 32px);box-shadow:var(--shadow)}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--head);font-size:20px;font-weight:700;letter-spacing:-.6px}
.brand-icon{width:40px;height:40px;border-radius:14px;background:var(--grad);color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px color-mix(in srgb,var(--brand) 45%,transparent)}
.brand-icon svg{width:22px;height:22px}
.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;text-transform:uppercase;color:var(--muted)}
.family-label{margin:38px 12px 12px}
.nav{display:grid;gap:4px}
.nav button{background:transparent;display:flex;gap:12px;align-items:center;text-align:left;padding:12px 14px;border-radius:14px;color:var(--muted);font-size:14px;font-weight:600}
.nav button:hover{background:var(--soft);color:var(--ink)}
.nav button.active{background:var(--ink);color:var(--bg);box-shadow:var(--shadow)}
.sidebar-note{margin-top:auto;background:var(--grad);border-radius:20px;padding:18px 16px;font-size:12px;line-height:1.6;color:#ffffffd9;position:relative;overflow:hidden}
.sidebar-note::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:var(--lime);opacity:.35;right:-50px;top:-50px;filter:blur(6px)}
.sidebar-note strong{display:block;color:#fff;font-size:14px;margin:8px 0;font-family:var(--head);font-weight:600;letter-spacing:-.3px}
.sidebar-note .eyebrow{color:#ffffffb3}
.profile{border-top:1px solid var(--line);margin-top:18px;padding-top:16px;display:flex;align-items:center;gap:10px}
.avatar{width:38px;height:38px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:13px;font-weight:700;flex:none;box-shadow:0 0 0 3px var(--paper)}
.profile small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.profile strong{font-size:13px}
.main{padding:30px 40px 44px;max-width:1600px;width:100%;margin:auto}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:15px}
.breadcrumb{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:9px;font-weight:500}
.pill{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--line);border-radius:99px;font-size:11px;font-weight:600;color:var(--muted);background:var(--glass);backdrop-filter:blur(10px)}
.pill .dot{width:7px;height:7px;background:#22c55e;box-shadow:0 0 0 3px #22c55e33}
.demo{padding:11px 16px;margin-bottom:24px;background:color-mix(in srgb,var(--lime) 35%,var(--paper));border:1px solid color-mix(in srgb,var(--lime) 70%,var(--line));border-radius:16px;font-size:12px;font-weight:500;color:var(--ink);display:flex;gap:10px;align-items:center;justify-content:space-between}
.demo button{background:var(--ink);color:var(--bg);font-size:11px;font-weight:600;padding:6px 12px;border-radius:99px}

/* typography & buttons */
.headline{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
h1{font-family:var(--head);font-size:40px;line-height:1.08;letter-spacing:-1.8px;font-weight:700;margin:0 0 10px}
h2{font-family:var(--head);font-weight:600;letter-spacing:-.6px;font-size:20px;margin:0}
p{line-height:1.6}
.subtitle{font-size:14px;color:var(--muted);margin:0}
.primary{display:inline-flex;justify-content:center;align-items:center;gap:9px;background:var(--ink);color:var(--bg);border-radius:99px;padding:13px 22px;font-size:14px;font-weight:700;min-height:48px;white-space:nowrap;box-shadow:0 10px 24px #16141f2e}
.primary:hover{background:var(--brand);color:#fff;box-shadow:0 12px 28px color-mix(in srgb,var(--brand) 45%,transparent)}
.secondary{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:99px;padding:10px 16px;color:var(--ink);font-size:13px;font-weight:600;min-height:42px}
.secondary:hover{border-color:var(--brand);color:var(--brand)}

/* hero */
.hero{display:flex;justify-content:space-between;align-items:center;overflow:hidden;background:var(--grad);color:#fff;padding:28px 32px;border-radius:var(--r);margin-bottom:22px;position:relative;box-shadow:0 20px 50px color-mix(in srgb,var(--brand) 30%,transparent)}
.hero .eyebrow{color:#ffffffb8}
.hero h2{font-size:26px;margin:8px 0 6px;letter-spacing:-.8px}
.hero p{margin:0;color:#ffffffd0;font-size:13px}
.hero-art{width:170px;height:100px;position:relative;flex:none}
.orb{position:absolute;width:86px;height:86px;border-radius:50%;top:6px;left:14px;background:var(--hero-orb);box-shadow:0 0 50px var(--hero-glow)}
.orb.two{left:70px;top:14px;background:#ffffff40;backdrop-filter:blur(8px);border:1px solid #ffffff66;box-shadow:none}
.hero-art .leaf{position:absolute;width:14px;height:14px;border-radius:50%;background:#fff;left:150px;top:4px}
.hero-art .leaf.two{left:6px;top:78px;width:9px;height:9px;background:var(--coral)}

/* calendar */
.calendar-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.calendar-top{padding:22px 24px 16px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.month-controls{display:flex;align-items:center;gap:12px}
.month-controls h2{text-transform:capitalize;font-size:22px;min-width:180px}
.arrows{display:flex;gap:6px}
.icon-button{width:38px;height:38px;display:inline-grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--ink)}
.icon-button:hover{background:var(--ink);color:var(--bg)}
.icon-button svg{width:18px;height:18px}
.switch{display:flex;gap:3px;padding:4px;background:var(--soft);border-radius:99px}
.switch button{background:transparent;color:var(--muted);padding:8px 14px;border-radius:99px;font-size:12px;font-weight:600}
.switch button.active{background:var(--paper);box-shadow:var(--shadow);color:var(--ink)}
.calendar-sub{padding:0 24px 18px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.members-legend{display:flex;gap:8px;flex-wrap:wrap}
.legend{display:inline-flex;gap:6px;align-items:center;font-size:12px;color:var(--muted)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}
.today-button{font-size:12px;font-weight:700;color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,transparent);padding:8px 14px;border-radius:99px}
.today-button:hover{background:var(--brand);color:#fff}
.weekdays,.grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.weekdays{padding:0 14px}
.weekdays span{text-align:center;padding:10px 0;font-size:10px;font-weight:700;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.grid{padding:2px 14px 14px;gap:4px}
.day{min-height:96px;border-radius:16px;padding:8px 5px 5px;background:var(--paper-2);text-align:left;color:var(--ink);position:relative;overflow:hidden;border:1px solid transparent}
.day:hover{border-color:color-mix(in srgb,var(--brand) 40%,transparent);background:var(--paper)}
.day.selected{background:color-mix(in srgb,var(--brand) 10%,var(--paper));border-color:var(--brand)}
.day.outside{opacity:.35}
.daynum{display:grid;place-items:center;font-size:13px;font-weight:700;margin:0 auto 6px;width:28px;height:28px;border-radius:50%}
.day.today .daynum{background:var(--lime);color:#16141f;box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 35%,transparent)}
.event-chip{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;background:color-mix(in srgb,var(--event) 16%,var(--paper));color:color-mix(in srgb,var(--event) 80%,var(--ink));padding:4px 7px;margin-bottom:3px;border-radius:99px;font-weight:700}
.event-chip::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--event);margin-right:5px;vertical-align:1px}
.more{font-size:10px;font-weight:600;color:var(--muted);display:block;padding-left:6px}
.calendar-footer{padding:14px 24px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);display:flex;justify-content:space-between;align-items:center;gap:8px}
.calendar-footer svg{width:14px;height:14px}
.calendar-footer span{display:flex;align-items:center;gap:6px}

/* agenda */
.agenda{padding:24px 20px}
.agenda-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.agenda-head h2{font-size:20px}
.count{background:var(--ink);color:var(--bg);border-radius:99px;padding:3px 10px;font-size:12px;font-weight:700}
.date-sub{color:var(--muted);font-size:12px;margin:2px 0 20px}.date-sub::first-letter{text-transform:uppercase}
.agenda-item{width:100%;text-align:left;background:var(--paper-2);border:1px solid var(--line);border-radius:18px;padding:14px 14px 12px 18px;margin:0 0 10px;color:var(--ink);position:relative;overflow:hidden}
.agenda-item::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:0 4px 4px 0;background:var(--event)}
.agenda-item:hover{border-color:var(--event);transform:translateY(-1px);box-shadow:var(--shadow)}
.event-time{display:inline-block;color:color-mix(in srgb,var(--event) 85%,var(--ink));background:color-mix(in srgb,var(--event) 14%,transparent);font-size:11px;font-weight:800;padding:3px 9px;border-radius:99px;margin-bottom:8px}
.event-title{font-size:15px;line-height:1.35;font-weight:700;display:block;margin-bottom:6px}
.event-meta{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px;margin-bottom:4px}
.event-meta svg{width:13px;height:13px}
.people{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.person-tag{font-size:11px;font-weight:600;border-radius:99px;padding:3px 9px;background:var(--soft);color:var(--muted)}
.agenda-add{margin-top:14px;width:100%;border:1.5px dashed var(--line);border-radius:16px;background:transparent;color:var(--muted);padding:13px;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}
.agenda-add:hover{border-color:var(--brand);color:var(--brand);background:color-mix(in srgb,var(--brand) 6%,transparent)}
.agenda-add svg{width:15px}
.note-card{padding:22px;margin-top:16px;background:var(--ink);color:var(--bg);border-radius:var(--r);position:relative;overflow:hidden;box-shadow:var(--shadow)}
.note-card::after{content:"";position:absolute;width:140px;height:140px;border-radius:50%;background:var(--grad);right:-60px;bottom:-70px;opacity:.9;filter:blur(2px)}
.note-card h3{font-family:var(--head);font-size:15px;font-weight:600;letter-spacing:-.3px;display:flex;align-items:center;gap:8px;margin:0 0 8px;position:relative;z-index:1}
.note-card p{font-size:12px;opacity:.7;margin:0;line-height:1.7;position:relative;z-index:1}
.note-card button{position:relative;z-index:1;padding:8px 14px;background:var(--lime);color:#16141f;border-radius:99px;font-size:12px;font-weight:700;margin-top:14px}
.empty{padding:26px 0;color:var(--muted);font-size:13px;line-height:1.8;text-align:center}
.empty svg{width:34px;height:34px;display:block;margin:0 auto 10px;color:var(--brand);opacity:.5}
.bottom-note{margin:28px 0 0;text-align:center;color:var(--muted);font-size:11px;letter-spacing:.2px;opacity:.8}

/* family & settings */
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.setting-card{padding:26px}
.setting-card h2{margin-bottom:10px;font-size:19px}
.setting-card p{font-size:14px;color:var(--muted)}
.member-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.member-row:last-child{border:0}
.member-row .details{flex:1}
.member-row strong{display:block;font-size:14px}
.member-row small{font-size:12px;color:var(--muted)}
.danger{color:#e5484d;background:transparent;padding:10px 14px;font-size:13px;font-weight:600;border-radius:99px}
.danger:hover{background:#e5484d14}
.muted{color:var(--muted);font-size:13px}

/* login & loading */
.loading{padding:15vh 24px;text-align:center;font-family:var(--head);font-weight:700;letter-spacing:-1px;font-size:34px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.loading span{display:block;font-family:'Manrope',system-ui,sans-serif;font-weight:500;letter-spacing:0;font-size:14px;color:var(--muted);-webkit-text-fill-color:var(--muted);margin-top:12px}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:25px}
.login-card{width:100%;max-width:440px;background:var(--glass);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1px solid var(--line);border-radius:32px;padding:40px;box-shadow:var(--shadow-lg)}
.login-card .brand{margin-bottom:40px}
.login-card h1{font-size:30px}
.login-card p{font-size:14px;color:var(--muted)}
.login-card .primary{width:100%;margin-top:12px}

/* forms */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label.field{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-top:16px}
input,select,textarea{display:block;width:100%;border:1.5px solid var(--line);border-radius:14px;background:var(--paper-2);color:var(--ink);padding:12px 14px;margin-top:7px;min-width:0;outline:none;font-size:14px;font-weight:500;transition:border-color .15s,box-shadow .15s,background .15s}
input:focus,select:focus,textarea:focus{border-color:var(--brand);background:var(--paper);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 18%,transparent)}
textarea{resize:vertical;min-height:80px}
input[type=checkbox]{width:18px;height:18px;display:inline-block;margin:0;accent-color:var(--brand)}
.check{display:flex;gap:8px;align-items:center;font-size:13px;font-weight:600;margin-top:16px}
.checks{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.checks label{display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);padding:8px 14px 8px 10px;border-radius:99px;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;transition:.15s}
.checks label:has(input:checked){border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent)}
dialog{border:1px solid var(--line);border-radius:28px;width:calc(100% - 30px);max-width:540px;padding:0;color:var(--ink);background:var(--paper);max-height:90dvh;box-shadow:var(--shadow-lg)}
dialog[open]{animation:pop .22s cubic-bezier(.2,.9,.3,1.2)}
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
dialog::backdrop{background:#0e0b2a59;backdrop-filter:blur(6px)}
.modal-head{padding:26px 26px 10px;display:flex;align-items:center;justify-content:space-between}
.modal-head h2{font-size:22px}
.modal-body{padding:0 26px 26px;overflow:auto}
.modal-footer{display:flex;justify-content:space-between;gap:10px;margin-top:24px}
.form-error{color:#e5484d;font-size:12px;font-weight:600;line-height:1.5;margin-top:12px;min-height:0}
.hint{font-size:12px;color:var(--muted);line-height:1.6;margin-top:11px}
.install-list{font-size:14px;line-height:1.8;padding-left:22px}
.install-list li{padding:5px}
.week-mode .day{min-height:220px}
#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%) translateY(100px);opacity:0;transition:.25s cubic-bezier(.2,.9,.3,1.2);background:var(--ink);color:var(--bg);padding:13px 22px;border-radius:99px;z-index:10;font-size:13px;font-weight:600;max-width:90vw;box-shadow:var(--shadow-lg)}
#toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.mobile-brand{display:none}
.connection{background:#e5484d14;color:#e5484d;padding:11px 16px;border-radius:14px;font-size:12px;font-weight:600;margin-bottom:16px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* member filters */
.member-filters{gap:6px;flex:1}
.member-filter{display:inline-flex;align-items:center;gap:7px;padding:8px 14px 8px 11px;min-height:36px;border:1.5px solid var(--line);border-radius:99px;background:transparent;color:var(--muted);font-size:12px;font-weight:600}
.member-filter:hover{border-color:var(--ink);color:var(--ink)}
.member-filter.active{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.member-filter.active .dot{box-shadow:0 0 0 2px var(--ink),0 0 0 3px #fff8}
.calendar-sub .today-button{min-height:36px;flex:none}

@media(min-width:1500px){.day{min-height:112px}.main{padding:36px 56px}.calendar-layout{grid-template-columns:minmax(0,1fr) 350px}.event-chip{font-size:11px}}
@media(max-width:1150px){.layout{grid-template-columns:210px 1fr}.sidebar{padding:24px 14px}.main{padding:28px 24px}.calendar-layout{grid-template-columns:minmax(0,1fr) 270px;gap:16px}.calendar-top{padding:18px 16px}.calendar-sub{padding:0 16px 16px}.month-controls{gap:6px}.month-controls h2{font-size:19px;min-width:150px}.agenda{padding:20px 16px}.grid{padding:2px 10px 10px;gap:3px}.weekdays{padding:0 10px}}
@media(max-width:950px){.layout{grid-template-columns:180px 1fr}.sidebar{padding:22px 10px;margin:12px 0 12px 12px;height:calc(100vh - 24px);top:12px}.brand{font-size:17px;gap:8px}.brand-icon{width:34px;height:34px}.calendar-layout{grid-template-columns:1fr}.right-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}.note-card{margin:0;align-self:start}.agenda{min-height:200px}.hero-art{width:130px}.day{min-height:86px}.cards{grid-template-columns:1fr}}
@media(max-width:650px){
 .layout{display:block}
 .sidebar{height:auto;position:fixed;top:auto;bottom:calc(10px + env(safe-area-inset-bottom));left:12px;right:12px;margin:0;border-radius:99px;z-index:5;padding:6px;box-shadow:var(--shadow-lg)}
 .sidebar>.brand,.family-label,.sidebar-note,.profile{display:none}
 .nav{display:flex;justify-content:space-between;gap:4px}
 .nav button{flex:1;flex-direction:column;gap:3px;padding:8px 6px;font-size:10px;border-radius:99px;min-width:0}
 .nav button svg{width:21px;height:21px}
 .main{padding:20px 14px 110px}
 .top{margin-bottom:18px}.breadcrumb{display:none}.mobile-brand{display:flex;font-size:18px}.mobile-brand .brand-icon{width:34px;height:34px;border-radius:12px}
 .top .pill{font-size:10px;padding:6px 10px}
 .headline{align-items:center;margin-bottom:18px;gap:10px}
 h1{font-size:28px;letter-spacing:-1.2px;margin-bottom:6px}.subtitle{font-size:12px}
 .headline>.primary{font-size:0;width:52px;height:52px;padding:0;border-radius:18px;flex:none;background:var(--grad);color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 45%,transparent)}
 .headline>.primary svg{width:24px;height:24px}
 .demo{font-size:11px;line-height:1.5;padding:9px 12px;margin-bottom:16px;border-radius:14px}.demo button{font-size:10px}
 .hero{padding:20px;margin-bottom:16px;border-radius:20px}.hero h2{font-size:19px;line-height:1.3}.hero p{font-size:12px;max-width:210px}.hero .eyebrow{font-size:9px;letter-spacing:1.4px}
 .hero-art{width:70px;transform:scale(.65);transform-origin:left center}
 .calendar-top{padding:16px 12px 10px;gap:8px}.month-controls h2{font-size:18px;min-width:130px}.month-controls{gap:4px}.icon-button{width:34px;height:34px}
 .switch button{padding:7px 11px;font-size:11px}
 .calendar-sub{padding:0 12px 12px}.legend{font-size:11px}
 .grid{padding:2px 6px 8px;gap:3px}.day{min-height:68px;padding:5px 2px 3px;border-radius:12px}.daynum{font-size:12px;width:24px;height:24px;margin-bottom:4px}
 .event-chip{font-size:8px;padding:2px 3px;border-radius:6px}.event-chip::before{display:none}
 .weekdays{padding:0 6px}.weekdays span{font-size:9px;padding:8px 0}
 .calendar-footer{padding:12px 14px;font-size:10px}.calendar-footer>span:last-child{display:none}
 .right-column{display:block}.agenda{padding:20px 16px}.note-card{margin-top:16px}
 .agenda-head h2{font-size:19px}.event-title{font-size:15px}.event-time{font-size:12px}.event-meta,.person-tag{font-size:11px}
 .week-mode .day{min-height:140px}.bottom-note{margin-top:20px}
 .setting-card{padding:22px}.modal-head{padding:22px 20px 8px}.modal-body{padding:0 20px 24px}
 dialog{max-height:92dvh;margin-bottom:0;width:100%;max-width:none;border-radius:28px 28px 0 0}
 dialog[open]{animation:sheet .28s cubic-bezier(.2,.9,.3,1)}
 input,select,textarea{font-size:16px}.login-card{padding:28px;border-radius:28px}#toast{bottom:100px}.form-row{gap:10px}
 .member-filter{font-size:12px;min-height:40px;padding:8px 13px 8px 10px}
}
@keyframes sheet{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
[hidden]{display:none!important}

/* переключатель темы */
.top-tools{display:flex;align-items:center;gap:10px}
.theme-switch{display:flex;gap:2px;padding:4px;border:1px solid var(--line);border-radius:99px;background:var(--glass);backdrop-filter:blur(10px)}
.theme-switch button{display:inline-flex;align-items:center;gap:6px;background:transparent;color:var(--muted);padding:6px 11px;border-radius:99px;font-size:11px;font-weight:700}
.theme-switch button svg{width:15px;height:15px}
.theme-switch button:hover{color:var(--ink)}
:root[data-theme-pref=light] [data-theme-set=light],:root[data-theme-pref=dark] [data-theme-set=dark],:root[data-theme-pref=auto] [data-theme-set=auto]{background:var(--ink);color:var(--bg)}
:root[data-theme-pref=light] [data-theme-set=light] svg{color:#ffb020}
:root[data-theme=dark] .demo{background:color-mix(in srgb,var(--lime) 10%,var(--paper));border-color:color-mix(in srgb,var(--lime) 30%,var(--line))}
:root[data-theme=dark] .day.today .daynum{background:var(--lime);color:#0b0a1a}
:root[data-theme=dark] .orb{background:transparent;box-shadow:inset -20px 10px 0 0 var(--hero-orb),0 0 40px -6px var(--hero-glow);transform:rotate(-15deg);left:40px}:root[data-theme=dark] .orb.two{display:none}
:root[data-theme=dark] .hero-art .leaf{background:#fff;box-shadow:0 0 8px #fff}
:root[data-theme=dark] .note-card{background:linear-gradient(160deg,#221f3d,#15132a);color:var(--ink);border:1px solid var(--line)}
:root[data-theme=dark] .primary{box-shadow:0 10px 24px #0008}
@media(max-width:650px){.top-tools{gap:6px}.top .pill{display:none}.theme-switch button span{display:none}.theme-switch button{padding:7px 9px}}
/* вход через Telegram */
.tg-login{margin-top:22px}
.tg-button{width:100%;background:linear-gradient(135deg,#2aabee,#229ed9);color:#fff;box-shadow:0 10px 24px #229ed940;text-decoration:none}
.tg-button:hover{background:linear-gradient(135deg,#229ed9,#1c8cc4);box-shadow:0 12px 28px #229ed955}
.tg-login .hint{text-align:center}
.code-input{font-family:var(--head);font-size:26px!important;letter-spacing:8px;text-align:center;padding:14px;font-variant-numeric:tabular-nums}
.code-input::placeholder{color:var(--line);letter-spacing:8px}
.alt-login{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.alt-login summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--muted);list-style:none;text-align:center}
.alt-login summary::-webkit-details-marker{display:none}
.alt-login summary:hover{color:var(--brand)}
#invite-link{font-size:13px;margin-top:14px;color:var(--brand);font-weight:600}
.member-row .secondary{min-height:36px;padding:8px 12px;font-size:12px}
/* выполненные задачи */
.agenda-item{display:flex;gap:12px;align-items:flex-start;cursor:default}
.agenda-open{flex:1;min-width:0;background:transparent;padding:0;text-align:left;color:inherit}
.agenda-open:active:not(:disabled){transform:none}
.done-toggle{flex:none;width:28px;height:28px;margin-top:1px;border-radius:50%;border:2px solid color-mix(in srgb,var(--event) 70%,var(--line));background:var(--paper);color:transparent;display:grid;place-items:center;padding:0}
.done-toggle svg{width:15px;height:15px;stroke-width:3}
.done-toggle:hover{background:color-mix(in srgb,var(--event) 14%,var(--paper));color:color-mix(in srgb,var(--event) 60%,transparent)}
.done-toggle[aria-pressed=true]{background:var(--event);border-color:var(--event);color:#fff;animation:tick .3s cubic-bezier(.2,.9,.3,1.4)}
@keyframes tick{from{transform:scale(.7)}to{transform:scale(1)}}
.agenda-item.is-done{opacity:.62}
.agenda-item.is-done .event-title{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:color-mix(in srgb,var(--event) 60%,transparent)}
.agenda-item.is-done:hover{opacity:.85}
.done-by{display:inline-flex;align-items:center;gap:5px;margin-top:8px;font-size:11px;font-weight:700;color:color-mix(in srgb,var(--event) 85%,var(--ink))}
.done-by svg{width:13px;height:13px;stroke-width:2.6}
.event-chip.done{opacity:.45;text-decoration:line-through}
/* повторения в форме */
.repeat-box{margin-top:14px;padding:4px 16px 16px;border:1px solid var(--line);border-radius:18px;background:var(--paper-2)}
label.field.inline-field{display:flex;align-items:center;gap:10px}
.inline-field input{width:76px;margin-top:0;text-align:center}
.inline-field span{font-weight:700;color:var(--ink)}
.field-label{font-size:12px;font-weight:700;color:var(--muted);margin-top:16px}
.weekday-picks{gap:6px}
.weekday-picks label{padding:7px 11px 7px 8px}
.quick-picks{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.quick-picks button{background:transparent;border:1px dashed var(--line);color:var(--muted);border-radius:99px;padding:6px 12px;font-size:12px;font-weight:700}
.quick-picks button:hover{border-color:var(--brand);color:var(--brand)}
.repeat-summary{margin:14px 0 0;font-size:13px;font-weight:700;color:var(--brand)}
.repeat-summary::before{content:"↻ "}
/* настройки уведомлений */
.toggle-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.toggle-row:last-of-type{border-bottom:0}
.toggle-text{flex:1;min-width:0}
.toggle-text strong{display:block;font-size:14px}
.toggle-text small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.switch-toggle{position:relative;flex:none;width:44px;height:26px;cursor:pointer}
.switch-toggle input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.switch-toggle .track{position:absolute;inset:0;border-radius:99px;background:var(--line);transition:background .2s}
.switch-toggle .track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}
.switch-toggle input:checked+.track{background:var(--brand)}
.switch-toggle input:checked+.track::after{transform:translateX(18px)}
.switch-toggle input:focus-visible+.track{outline:3px solid color-mix(in srgb,var(--brand) 50%,transparent);outline-offset:2px}
.brief-time{width:112px;flex:none;margin-top:0;padding:8px 10px}