:root{--bg:#f2f2f7;--card:#fff;--text:#1c1c1e;--sub:#8e8e93;--sep:rgba(60,60,67,.12);--accent:#0a84ff;--red:#ff3b30;--orange:#ff9500;--green:#34c759;--bar:rgba(242,242,247,.72);--shadow:0 0 0 .5px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.04);--ease:cubic-bezier(.23,1,.32,1)}
@media (prefers-color-scheme:dark){:root{--bg:#000;--card:#1c1c1e;--text:#f2f2f7;--sub:#8e8e93;--sep:rgba(84,84,88,.45);--bar:rgba(18,18,20,.72);--shadow:0 0 0 .5px rgba(255,255,255,.06)}}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.35 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;letter-spacing:-.01em;min-height:100dvh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.bar{position:sticky;top:0;z-index:5;background:var(--bar);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);padding-top:env(safe-area-inset-top)}
.bar-in{max-width:760px;margin:0 auto;display:flex;align-items:flex-end;justify-content:space-between;padding:14px 20px 10px}
h1{font-size:32px;font-weight:700;letter-spacing:-.02em;margin:0;line-height:1.1}
.icon-btn{width:36px;height:36px;border-radius:18px;background:var(--card);box-shadow:var(--shadow);font-size:19px;color:var(--accent);transition:transform 120ms var(--ease)}
.icon-btn:active{transform:scale(.92)} .spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
main{max-width:760px;margin:0 auto;padding:6px 16px 24px}
.sec{font-size:13px;text-transform:uppercase;letter-spacing:.02em;color:var(--sub);margin:22px 16px 7px;display:flex;justify-content:space-between}
.group{background:var(--card);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.row{display:flex;align-items:flex-start;gap:12px;padding:11px 16px;position:relative;min-height:44px}
.row+.row::before{content:"";position:absolute;top:0;left:52px;right:0;border-top:.5px solid var(--sep)}
.row.plain+.row.plain::before{left:16px}
.chk{flex:none;width:24px;height:24px;margin-top:-1px;border-radius:12px;border:1.5px solid #c7c7cc;display:grid;place-items:center;transition:background 160ms var(--ease),border-color 160ms var(--ease),transform 120ms var(--ease)}
.chk:active{transform:scale(.88)} .chk svg{width:14px;height:14px;opacity:0;transform:scale(.6);transition:opacity 140ms var(--ease),transform 200ms var(--ease)}
.done .chk{background:var(--accent);border-color:var(--accent)} .done .chk svg{opacity:1;transform:none}
.txt{flex:1;min-width:0;word-break:break-word;font-size:16px;transition:color 200ms}
.done .txt{color:var(--sub)} .txt code{font:13px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg);padding:1px 5px;border-radius:5px}
.meta{font-size:13px;color:var(--sub);margin-top:2px}
.pill{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:10px;margin-left:6px;vertical-align:1px}
.p-red{background:rgba(255,59,48,.14);color:var(--red)}.p-orange{background:rgba(255,149,0,.16);color:#c26a00}.p-green{background:rgba(52,199,89,.16);color:#1f8a3b}.p-gray{background:var(--bg);color:var(--sub)}
@media (prefers-color-scheme:dark){.p-orange{color:var(--orange)}.p-green{color:var(--green)}}
.empty{padding:16px;color:var(--sub);text-align:center;font-size:15px}
.composer{display:flex;flex-direction:column;gap:8px;padding:12px 16px}
.composer input,.composer select,.search input{font-size:16px;padding:10px 12px;border-radius:10px;border:0;background:var(--bg);color:var(--text);width:100%}
.composer .line{display:flex;gap:8px}.composer .line>*{flex:1}
.primary{background:var(--accent);color:#fff;font-weight:600;border-radius:12px;padding:12px 16px;transition:transform 120ms var(--ease),opacity 120ms}
.primary:active{transform:scale(.97);opacity:.9}
a{color:var(--accent);text-decoration:none}
@media (hover:hover) and (pointer:fine){a:hover{text-decoration:underline}.row.click:hover{background:var(--bg)}}
.row.click{cursor:pointer}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:5;display:flex;justify-content:space-around;background:var(--bar);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-top:.5px solid var(--sep);padding:6px 0 calc(6px + env(safe-area-inset-bottom))}
.tabs button{display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11px;color:var(--sub);min-width:72px;padding:2px 0;transition:color 120ms}
.tabs .ti{font-size:21px;line-height:1.1}.tabs .on{color:var(--accent)}
.search{padding:10px 0}
.toast{position:fixed;left:50%;bottom:calc(86px + env(safe-area-inset-bottom));transform:translate(-50%,8px);opacity:0;background:rgba(30,30,32,.92);color:#fff;font-size:14px;padding:10px 16px;border-radius:20px;pointer-events:none;transition:opacity 180ms var(--ease),transform 220ms var(--ease);white-space:nowrap}
.toast.show{opacity:1;transform:translate(-50%,0)}
.md table{border-collapse:collapse;width:100%;font-size:14px}.md td,.md th{padding:9px 16px;text-align:left;vertical-align:top;border-top:.5px solid var(--sep)}.md th{color:var(--sub);font-weight:500;font-size:12px;text-transform:uppercase;border:0}
.md p,.md li{font-size:15px;padding:0 16px}.md h3{font-size:13px;text-transform:uppercase;color:var(--sub);margin:22px 16px 7px}
.view-enter{animation:enter 220ms var(--ease)}@keyframes enter{from{opacity:0;transform:translateY(6px)}}
.edit{width:100%;font:inherit;font-size:16px;border:0;background:var(--bg);color:var(--text);border-radius:8px;padding:6px 8px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
body.login{display:grid;place-items:center;padding:24px}
.login-card{width:100%;max-width:360px;text-align:center}.logo{width:72px;height:72px;border-radius:16px;box-shadow:0 8px 24px rgba(10,132,255,.25)}
.login-card h1{margin:16px 0 4px}.sub{color:var(--sub);margin:0 0 24px;font-size:15px}
.login-card form{display:flex;flex-direction:column;gap:12px;text-align:left}
.field{display:block;background:var(--card);border-radius:12px;padding:8px 14px;box-shadow:var(--shadow)}.field span{font-size:12px;color:var(--sub)}
.field input{display:block;width:100%;border:0;background:none;color:var(--text);font-size:17px;padding:3px 0;outline:none}
.check{display:flex;gap:10px;align-items:center;font-size:15px;padding:4px 2px}.check input{width:20px;height:20px;accent-color:var(--accent)}
.err{background:rgba(255,59,48,.12);color:var(--red);padding:10px;border-radius:10px;font-size:14px}
/* ===== v3: liquid glass + адаптив ===== */
:root{--glass:rgba(255,255,255,.55);--glass-brd:rgba(255,255,255,.65);--glass-hi:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -1px 0 rgba(255,255,255,.15);--glass-sh:0 8px 32px rgba(15,23,42,.12),0 1px 2px rgba(15,23,42,.06);--card:rgba(255,255,255,.72)}
@media (prefers-color-scheme:dark){:root{--glass:rgba(40,40,46,.5);--glass-brd:rgba(255,255,255,.12);--glass-hi:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.2);--glass-sh:0 8px 32px rgba(0,0,0,.45);--card:rgba(30,30,34,.66)}}
.bg{position:fixed;inset:-20%;z-index:-1;background:radial-gradient(40% 35% at 15% 10%,rgba(10,132,255,.22),transparent 70%),radial-gradient(35% 30% at 85% 20%,rgba(94,92,230,.2),transparent 70%),radial-gradient(45% 40% at 60% 90%,rgba(52,199,89,.12),transparent 70%),var(--bg)}
.glass{background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0) 60%),var(--glass);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:.5px solid var(--glass-brd);box-shadow:var(--glass-hi),var(--glass-sh)}
.group{background:var(--card);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:.5px solid var(--glass-brd);box-shadow:var(--glass-hi),0 2px 12px rgba(15,23,42,.05);border-radius:16px}
.bar{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.bar.scrolled{background:var(--bar);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.icon-btn{border-radius:50%}
.brand,.logout{display:none}
/* Телефон: плавающая капсула */
.tabs{left:50%;right:auto;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(440px,calc(100% - 24px));border-radius:28px;padding:6px;border-top:0;justify-content:space-between}
.tabs button{flex:1;min-width:0;border-radius:22px;padding:6px 0;transition:background 160ms var(--ease),color 160ms var(--ease),transform 120ms var(--ease)}
.tabs button:active{transform:scale(.94)}
.tabs button.on{background:rgba(10,132,255,.14)}
body{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.toast{bottom:calc(100px + env(safe-area-inset-bottom))}
/* Telegram: сегменты сверху, низ свободен */
html.tg body{padding-bottom:24px}
html.tg .tabs{position:sticky;top:8px;bottom:auto;left:auto;transform:none;margin:8px auto 0;z-index:6}
html.tg .tabs .ti{display:none} html.tg .tabs button{font-size:14px;padding:8px 0}
html.tg .bar{position:static} html.tg .bar-in{padding-top:12px} html.tg h1{font-size:26px}
html.tg .toast{bottom:24px}
/* Компьютер: боковая панель */
@media (min-width:900px){
 body{padding:0} html.tg body{padding:0}
 .tabs,html.tg .tabs{position:fixed;top:16px;bottom:16px;left:16px;right:auto;transform:none;margin:0;width:232px;flex-direction:column;justify-content:flex-start;gap:2px;padding:14px 10px;border-radius:22px}
 .tabs button{flex:none;flex-direction:row;justify-content:flex-start;gap:12px;font-size:15px;color:var(--text);padding:9px 12px;border-radius:12px}
 html.tg .tabs .ti{display:inline}
 .tabs .ti{font-size:17px;width:22px;text-align:center;color:var(--accent)} .tabs button.on{background:rgba(10,132,255,.14);color:var(--accent);font-weight:600}
 @media (hover:hover){.tabs button:not(.on):hover{background:rgba(120,120,128,.12)}}
 .brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;padding:4px 10px 16px}.brand img{width:30px;height:30px;border-radius:8px}
 .logout{display:block;margin-top:auto}.logout button{font-size:14px;color:var(--sub);padding:8px 12px}
 .shell{margin-left:264px}
 .bar-in,main{max-width:1040px} .bar-in{padding-top:28px}
 .today-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;align-items:start}
 .toast{bottom:28px;left:calc(50% + 132px)}
}
@media (prefers-reduced-transparency:reduce){.glass,.group,.bar.scrolled{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg)}.group{background:var(--card)}}

/* ===== v4: iOS tab bar везде (вкл. Telegram), свайпы, карточки ===== */
html.tg body{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
html.tg .tabs{position:fixed;top:auto;bottom:calc(10px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);margin:0}
html.tg .tabs .ti{display:block} html.tg .tabs button{font-size:11px;padding:6px 0}
html.tg .bar{position:sticky} html.tg .toast{bottom:calc(100px + env(safe-area-inset-bottom))}
.tabs{position:fixed}
.tabs button{position:relative;z-index:1;background:none!important}
.tab-pill{position:absolute;z-index:0;top:6px;bottom:6px;left:0;width:0;border-radius:22px;background:rgba(10,132,255,.15);transition:transform 380ms cubic-bezier(.32,.72,0,1),width 380ms cubic-bezier(.32,.72,0,1);will-change:transform}
.tabs button.on .ti{transform:scale(1.08)} .tabs .ti{transition:transform 260ms cubic-bezier(.32,.72,0,1)}
html,body,#view{touch-action:pan-y}#view{will-change:transform;min-height:calc(100dvh - 180px)}
#view.drag{transition:none}
#view.settle{transition:transform 320ms cubic-bezier(.32,.72,0,1),opacity 320ms cubic-bezier(.32,.72,0,1)}
@keyframes inR{from{transform:translateX(36px);opacity:0}} @keyframes inL{from{transform:translateX(-36px);opacity:0}}
.in-r{animation:inR 340ms cubic-bezier(.32,.72,0,1)} .in-l{animation:inL 340ms cubic-bezier(.32,.72,0,1)}
.view-enter{animation:none}
.rcard{padding:14px 16px}.rcard+.rcard{border-top:.5px solid var(--sep)}
.rcard .rt{font-size:16px;font-weight:600;line-height:1.3}
.rcard .rm{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rcard .chip{font-size:12.5px;padding:3px 9px;border-radius:999px;background:rgba(120,120,128,.12);color:var(--text);max-width:100%;overflow-wrap:anywhere}
.rcard .chip b{color:var(--sub);font-weight:500;margin-right:4px}
.rnote{font-size:14px;color:var(--sub);padding:0 16px;margin:6px 0}
@media (min-width:900px){
 html.tg body{padding:0}
 .tabs,html.tg .tabs{position:fixed;top:16px;bottom:16px;left:16px;transform:none}
 html.tg .tabs button{font-size:15px;padding:9px 12px}
 .tab-pill{display:none} .tabs button.on{background:rgba(10,132,255,.14)!important}
}
@media (prefers-reduced-motion:reduce){.tab-pill,#view.settle{transition:none}.in-r,.in-l{animation:none}}