/* Корвин — приложение в Telegram. Тёмное цветное стекло: живые пятна цвета под полупрозрачными карточками.
   Стилей в HTML нет (CSP style-src 'self'): всё здесь, размеры столбиков ставит app.js через el.style. */
*,*::before,*::after{box-sizing:border-box;margin:0}
html,body{height:100%;-webkit-text-size-adjust:100%;background:#150d46}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,sans-serif;color:#fff;font-size:15px;line-height:1.38;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit;touch-action:manipulation}
button:disabled{cursor:default;opacity:.45}
input,textarea{font:inherit;color:inherit;background:none;border:0;outline:0;width:100%}
ul,ol{list-style:none;padding:0}
h1,h2,h3{font:inherit}
[hidden]{display:none!important}
:root{--spring:cubic-bezier(.32,.72,0,1);--out:cubic-bezier(.23,1,.32,1);--t2:rgba(255,255,255,.88);--t3:rgba(255,255,255,.7);
  --line:rgba(255,255,255,.14);--good:#8dffbd;--bad:#ffa3b8;--warn:#ffd3a6;--ink:#1b1250;
  --top:env(safe-area-inset-top,0px);--bot:env(safe-area-inset-bottom,0px)}
:focus-visible{outline:2px solid #fff;outline-offset:2px}
.ic{display:inline-flex;flex:none;line-height:0}
.ic svg{display:block}
.ic.fill svg{fill:currentColor}
.noscript{padding:40px 24px;font-size:17px}

/* Обои: сочный цвет под стеклом */
.wall{position:fixed;inset:0;z-index:0;background:#150d46;overflow:hidden;pointer-events:none}
.wall i{position:absolute;display:block;border-radius:50%;filter:blur(80px);will-change:transform}
.wall .a{width:70vmax;height:58vmax;left:-24vmax;top:-22vmax;background:#ff4f7b;opacity:.85;animation:dr1 38s ease-in-out infinite alternate}
.wall .b{width:64vmax;height:54vmax;right:-26vmax;top:-16vmax;background:#6a4bff;animation:dr2 44s ease-in-out infinite alternate}
.wall .c{width:64vmax;height:52vmax;right:-22vmax;bottom:-28vmax;background:#00bfd8;opacity:.85;animation:dr3 50s ease-in-out infinite alternate}
.wall .d{width:58vmax;height:46vmax;left:-20vmax;bottom:-28vmax;background:#ff9a3d;opacity:.8;animation:dr2 42s ease-in-out infinite alternate-reverse}
.wall .e{width:46vmax;height:40vmax;left:18%;top:26%;background:#2a1a8c;opacity:.95;animation:dr1 56s ease-in-out infinite alternate-reverse}
.wall::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,13,70,.18),rgba(21,13,70,.42))}
@keyframes dr1{to{transform:translate(9vmax,6vmax) scale(1.08)}}
@keyframes dr2{to{transform:translate(-8vmax,7vmax) scale(.94)}}
@keyframes dr3{to{transform:translate(-6vmax,-7vmax) scale(1.1)}}

/* Стекло */
.gl{position:relative;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06) 46%),rgba(20,12,66,.52);-webkit-backdrop-filter:blur(26px) saturate(165%);backdrop-filter:blur(26px) saturate(165%);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 0 0 1px rgba(255,255,255,.1),0 20px 44px -24px rgba(8,2,40,.7)}

/* Страница */
.page{position:fixed;inset:0;z-index:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:calc(var(--top) + 18px) 14px calc(var(--bot) + 112px);outline:0}
.page::-webkit-scrollbar{display:none}
.in{max-width:640px;margin:0 auto}
.in.fade{animation:fadein .2s ease-out}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}}

/* Шапка */
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:4px 4px 14px}
.head h1{font-size:40px;line-height:1.02;font-weight:700;letter-spacing:-.035em;text-shadow:0 2px 24px rgba(20,8,70,.3);overflow-wrap:anywhere}
.head h1.mid{font-size:32px}
.backl{display:inline-flex;align-items:center;gap:2px;min-height:40px;margin:0 0 4px -6px;padding:0 10px 0 2px;border-radius:20px;font-size:15.5px;font-weight:600;color:var(--t2)}
.backl:active{background:rgba(255,255,255,.1)}
.head .sub{display:block;font-size:19px;font-weight:650;letter-spacing:-.02em;margin-top:3px;color:var(--t2)}
.acts{display:flex;gap:8px;flex:none}
.round{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;transition:transform .16s var(--out)}
.round:active{transform:scale(.92)}
.nav3{display:flex;align-items:center;gap:8px;margin:0 4px 14px}
.nav3 .round{width:44px;height:44px}
.nav3 b{flex:1;text-align:center;font-size:17px;font-weight:650}

/* Пилюля ворона */
.ravenp{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px 0 10px;border-radius:999px;margin:0 4px 14px;font-weight:590;font-size:15px}
.raven{display:block}
.raven.clean{filter:drop-shadow(0 0 6px rgba(255,255,255,.35))}

/* Карточки */
.card{padding:16px 14px 12px;margin-bottom:12px}
.card>h2,.card>.h2{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:0 4px 8px;font-size:20px;font-weight:700;letter-spacing:-.025em}
.card>h2 em,.card>.h2 em{font-style:normal;font-size:14px;font-weight:560;color:var(--t2);letter-spacing:-.004em;white-space:nowrap}
.card .note{padding:2px 4px 6px;font-size:13.5px;color:var(--t3)}
.card.warn{background:linear-gradient(180deg,rgba(255,211,166,.2),rgba(255,211,166,.08)),rgba(40,18,60,.55)}
.card.warn p{padding:3px 4px;font-size:14.5px}
.big{font-size:44px;line-height:1;font-weight:690;letter-spacing:-.04em;font-variant-numeric:tabular-nums;padding:2px 4px 8px}
.big small{font-size:15px;font-weight:560;letter-spacing:-.004em;color:var(--t2);margin-left:8px}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.good{color:var(--good)}
.bad{color:var(--bad)}
.late{color:var(--warn);font-weight:590}
.dim{color:var(--t3)}
.empty{padding:6px 4px 10px;color:var(--t2);font-size:14.5px}

/* Строки */
.row{display:flex;align-items:center;gap:12px;width:100%;padding:11px 8px;border-radius:18px;position:relative;text-align:left;transition:background .16s,opacity .26s,transform .3s var(--spring)}
.row:active{background:rgba(255,255,255,.1)}
.row+.row{box-shadow:0 -1px 0 var(--line)}
.row.going{opacity:0;transform:translateX(24px)}
.rtext{flex:1;min-width:0}
.rtext b{display:block;font-size:15.5px;font-weight:590;letter-spacing:-.012em;line-height:1.28;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rtext b.one{-webkit-line-clamp:1}
.rmeta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-top:3px;font-size:13px;color:var(--t2)}
.rmeta .tag{padding:1px 8px;border-radius:999px;background:rgba(255,255,255,.14);font-size:12px;font-weight:600}
.rmeta .tag.new{background:#ff4f7b;color:#fff}
.rmeta .tag.ok{background:rgba(141,255,189,.2);color:var(--good)}
.rright{flex:none;text-align:right;font-size:14.5px;font-weight:620}
.tick{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:50%;margin:-6px -4px -6px -6px}
.tick i{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(255,255,255,.62);display:grid;place-items:center;color:transparent;transition:background .18s,box-shadow .18s,transform .16s var(--out)}
.tick:active i{transform:scale(.86);background:#fff;color:var(--ink)}
.starb{width:44px;height:44px;flex:none;display:grid;place-items:center;margin:-6px -4px -6px -6px;color:rgba(255,255,255,.5)}
.starb.on{color:#ffd76a}
.chev{color:rgba(255,255,255,.45)}
.more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:46px;margin-top:6px;border-radius:999px;font-weight:600;font-size:15px;background:rgba(255,255,255,.1);transition:transform .16s var(--out)}
.more:active{transform:scale(.97)}

/* Группы «сделано» */
.note.subh{margin-top:18px;font-weight:650;color:var(--t2)}
.grp{padding:8px 4px}
.grp+.grp{box-shadow:0 -1px 0 var(--line)}
.grp h3{display:flex;justify-content:space-between;gap:8px;font-size:15px;font-weight:650}
.grp h3 span{color:var(--t2);font-weight:560;font-size:13.5px}
.grp li{font-size:14px;color:var(--t2);padding:3px 0 0 12px;position:relative;overflow-wrap:anywhere}
.grp li::before{content:"";position:absolute;left:1px;top:11px;width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.55)}
.grp .min{color:var(--t3);white-space:nowrap}

/* Плитки */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.tile{padding:16px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-height:96px;text-align:left;transition:transform .2s var(--out)}
.tile:active{transform:scale(.97)}
.tile b{font-size:16px;font-weight:650}
.tile span{font-size:13px;color:var(--t2)}

/* Кнопки */
.btns{display:flex;flex-wrap:wrap;gap:8px;padding:8px 0 4px}
.pillb{min-height:46px;padding:0 18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:620;font-size:15px;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:transform .16s var(--out),background .16s}
.pillb:active{transform:scale(.96)}
.pillb.solid{background:#fff;color:var(--ink);box-shadow:0 8px 24px -10px rgba(10,0,50,.6)}
.pillb.wide{width:100%}
.pillb.sm{min-height:38px;padding:0 14px;font-size:14px}
.pillb.danger{color:var(--bad)}

/* Фильтр мест */
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -14px 12px;padding:0 18px}
.chips::-webkit-scrollbar{display:none}
.chips.wrap{flex-wrap:wrap;overflow:visible;margin:16px 0 0;padding:0}
.chip{flex:none;height:38px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:600;background:rgba(255,255,255,.12);white-space:nowrap}
.chip.on{background:#fff;color:var(--ink)}

/* Цифры денег */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 4px 10px}
.stat span{display:block;font-size:13px;color:var(--t2)}
.stat b{display:block;font-size:19px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bars{display:flex;align-items:flex-end;gap:8px;height:150px;padding:8px 4px 0}
.bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;min-width:0}
.bar .pair{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:3px}
.bar .pair i{display:block;width:40%;max-width:16px;min-height:2px;border-radius:6px 6px 3px 3px}
.bar .pair .inc{background:linear-gradient(180deg,#a8ffd0,#4fd690)}
.bar .pair .exp{background:linear-gradient(180deg,#ffb3c6,#ff5f87)}
.bar .pair .one{background:linear-gradient(180deg,#d9d2ff,#8f7bff);width:70%;max-width:22px}
.bar span{font-size:11.5px;color:var(--t2);white-space:nowrap}
.bar.cur span{color:#fff;font-weight:700}
.bar.part .pair{opacity:.6}
.legend{display:flex;gap:14px;padding:8px 4px 2px;font-size:12.5px;color:var(--t2)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.legend .inc{background:#4fd690}
.legend .exp{background:#ff5f87}

/* Неделя */
.day{display:flex;gap:12px;padding:10px 4px;align-items:flex-start}
.day+.day{box-shadow:0 -1px 0 var(--line)}
.day .dw{width:52px;flex:none}
.day .dw b{display:block;font-size:16px;font-weight:700}
.day .dw span{font-size:12.5px;color:var(--t2)}
.day.future{opacity:.45}
.day.today .dw b{color:#ffd76a}
.day ul{flex:1;min-width:0}
.day li{font-size:13.5px;color:var(--t2);overflow-wrap:anywhere}
.day li b{color:#fff;font-weight:600}
.mdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:1px}
.mdot.ok{background:var(--good)}
.mdot.empty{background:#ffd76a}
.mdot.fail{background:#ff5f87}
.mdot.none{background:rgba(255,255,255,.3)}

/* Поиск */
.search{display:flex;align-items:center;gap:10px;height:52px;padding:0 16px;border-radius:999px;margin-bottom:12px}
.search input{font-size:17px;height:100%}
.search input::placeholder{color:rgba(255,255,255,.6)}

/* Панель снизу */
.dock{position:fixed;left:10px;right:10px;bottom:calc(var(--bot) + 10px);z-index:5;display:flex;justify-content:center}
.tabs{display:flex;padding:5px;border-radius:999px;position:relative;width:100%;max-width:560px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.04) 46%),rgba(16,9,56,.78)}
.tabs button{position:relative;z-index:1;flex:1;min-width:0;height:58px;border-radius:999px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-weight:600;font-size:11.5px;letter-spacing:-.01em;color:#fff;transition:color .2s,transform .16s var(--out)}
.tabs button:active{transform:scale(.94)}
.tabs button.on{color:var(--ink)}
.tabs button span.t{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}
.tabs .lens{position:absolute;top:5px;bottom:5px;left:0;width:0;background:#fff;border-radius:999px;box-shadow:0 6px 20px -6px rgba(10,0,50,.55);transition:transform .42s var(--spring),width .42s var(--spring)}
.bdg{position:absolute;top:4px;left:calc(50% + 6px);min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ff4f7b;color:#fff;font-size:11.5px;font-weight:700;line-height:19px;text-align:center;font-variant-numeric:tabular-nums}

/* Лист снизу */
.scrim{position:fixed;inset:0;z-index:20;background:rgba(10,4,44,.46);animation:fade .22s ease-out}
@keyframes fade{from{opacity:0}}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:21;max-height:88vh;overflow-y:auto;border-radius:30px 30px 0 0;padding:10px 18px calc(var(--bot) + 20px);background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.05) 40%),rgba(24,14,74,.92);animation:up .34s var(--spring);overscroll-behavior:contain;max-width:640px;margin:0 auto}
@keyframes up{from{transform:translateY(100%)}}
.sheet .grab{width:40px;height:5px;border-radius:3px;background:rgba(255,255,255,.35);margin:0 auto 12px}
.sheet h2{font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.25;overflow-wrap:anywhere;padding-right:40px}
.sheet .x{position:absolute;right:12px;top:12px;width:44px;height:44px}
.sheet .meta{margin-top:6px;font-size:14px;color:var(--t2)}
.sheet .full{margin-top:10px;font-size:16px;line-height:1.42;white-space:pre-wrap;overflow-wrap:anywhere}
.sheet .acts2{display:grid;gap:10px;margin-top:16px}
.sheet .hint{margin-top:10px;font-size:13px;color:var(--t3)}
.field{display:block;margin-top:14px;padding:12px 14px;border-radius:18px;background:rgba(0,0,0,.24);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.field:focus-within{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.field textarea:focus-visible,.field input:focus-visible{outline:0}
.field textarea{min-height:110px;resize:vertical;font-size:16px;line-height:1.4}
.field input{font-size:22px;font-weight:650;font-variant-numeric:tabular-nums}
.field+.cnt{font-size:12.5px;color:var(--t3);text-align:right;margin-top:4px}
.err{color:var(--bad);font-size:14px;margin-top:8px}
.wingl li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;box-shadow:0 -1px 0 var(--line)}
.wingl li:first-child{box-shadow:none}
.fdot{width:14px;height:14px;border-radius:50%;flex:none;margin-top:3px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.fdot.grey{background:#bdb6d6}
.fdot.graphite{background:#6c648e}
.fdot.black{background:#17132b}

/* Тост */
.toast{position:fixed;left:14px;right:14px;bottom:calc(var(--bot) + 88px);z-index:30;max-width:560px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:12px 12px 12px 18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.05)),rgba(16,9,56,.94);font-size:14.5px;font-weight:560;animation:up2 .3s var(--spring)}
.toast span{flex:1;min-width:0}
.toast.err{box-shadow:inset 0 0 0 1px rgba(255,95,135,.6)}
@keyframes up2{from{transform:translateY(16px);opacity:0}}

/* Загрузка и ошибки */
.skel{height:64px;border-radius:22px;margin-bottom:12px;background:linear-gradient(90deg,rgba(255,255,255,.07),rgba(255,255,255,.16),rgba(255,255,255,.07));background-size:200% 100%;animation:shim 1.2s linear infinite}
.skel.big{height:96px;width:70%}
.skel.sm{height:20px;width:45%;border-radius:10px}
@keyframes shim{to{background-position:-200% 0}}
.boot{padding-top:10px}
.oops{padding:28px 20px;text-align:center}
.oops h2{display:block;font-size:22px;font-weight:700;margin-bottom:8px}
.oops p{color:var(--t2);font-size:15px;margin-bottom:14px}
.foot{padding:6px 8px 18px;font-size:12.5px;color:var(--t3);text-align:center}

@media (min-width:700px){
  .head h1{font-size:52px}
  .page{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}