
:root{
  --bg:#f3f3f8; --card:#ffffff; --soft:#f5f5fa; --soft2:#ececf4; --line:#e9e9f1;
  --ink:#141428; --ink2:#5b5b73; --ink3:#9494a8;
  --p:#5d5fef; --p2:#4a4ce0; --p-soft:#eeeefe; --p-ink:#ffffff;
  --blue:#3b82f6; --blue2:#60a5fa; --green:#22b573; --green2:#4ad693; --green-soft:#e8f8ef;
  --orange:#f97316; --orange2:#fdba74; --pink:#ec4899; --gold:#f5b431; --gold-soft:#fff5dc;
  --bad:#e5484d; --bad-soft:#fdecec;
  --shadow:0 12px 32px rgba(58,58,120,.12); --shadow-s:0 2px 10px rgba(58,58,120,.06);
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0f0f1a; --card:#18182a; --soft:#1f1f33; --soft2:#26263c; --line:#2b2b42;
    --ink:#f2f2fa; --ink2:#b4b4cc; --ink3:#7d7d99;
    --p:#7b7dff; --p2:#6b6dff; --p-soft:#26264a; --p-ink:#ffffff;
    --green-soft:#153826; --gold-soft:#3a2f14; --bad-soft:#3d1c1c;
    --shadow:0 12px 32px rgba(0,0,0,.45); --shadow-s:0 2px 10px rgba(0,0,0,.3);
  }
}
:root[data-theme="dark"]{
  --bg:#0f0f1a; --card:#18182a; --soft:#1f1f33; --soft2:#26263c; --line:#2b2b42;
  --ink:#f2f2fa; --ink2:#b4b4cc; --ink3:#7d7d99;
  --p:#7b7dff; --p2:#6b6dff; --p-soft:#26264a; --p-ink:#ffffff;
  --green-soft:#153826; --gold-soft:#3a2f14; --bad-soft:#3d1c1c;
  --shadow:0 12px 32px rgba(0,0,0,.45); --shadow-s:0 2px 10px rgba(0,0,0,.3);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;padding-inline:16px;padding-block:0 32px;-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;text-wrap:balance;letter-spacing:-.01em}
button{font:inherit;cursor:pointer;color:inherit}
button:focus-visible{outline:2px solid var(--p);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
svg.i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- PHONE ---------- */
.stage{display:flex;justify-content:center}
.phone{width:100%;max-width:400px;background:var(--card);border-radius:34px;box-shadow:var(--shadow);overflow:hidden;position:relative;border:1px solid var(--line)}
@media (max-width:480px){.phone{border-radius:20px}}
.status{display:flex;justify-content:space-between;padding:12px 22px 0;font-size:13px;font-weight:600}
.ph-body{padding:10px 16px 96px;display:flex;flex-direction:column;gap:14px;min-height:640px}
.ph-body.short{min-height:0;padding-bottom:20px}
.hdr{display:flex;align-items:center;gap:10px}
.ava{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#f9a8d4,#c4b5fd);display:grid;place-items:center;font-weight:700;color:#3b2a6e;flex:none}
.hdr .who small{display:block;font-size:12px;color:var(--ink3)}
.hdr .who b{font-size:16px;font-weight:700}
.hdr .icons{margin-left:auto;display:flex;gap:8px}
.ico{width:38px;height:38px;border-radius:50%;background:var(--soft);display:grid;place-items:center;color:var(--p);border:0;position:relative}
.ico .dot{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--bad);border:2px solid var(--card)}
.ico.gold{color:var(--gold)}
.sec{display:flex;align-items:baseline;justify-content:space-between}
.sec h3{font-size:17px;font-weight:700}
.sec a{font-size:13px;color:var(--p);font-weight:600;text-decoration:none}
/* day strip */
.days{display:flex;gap:8px;overflow-x:auto;margin:0 -16px;padding:2px 16px 6px;scrollbar-width:none}
.days::-webkit-scrollbar{display:none}
.dayc{flex:none;width:76px;height:96px;border-radius:16px;padding:10px 10px 8px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;position:relative;overflow:hidden;background:var(--soft2);color:var(--ink3)}
.dayc small{font-size:11px;font-weight:600;opacity:.9}
.dayc b{font-size:22px;font-weight:800;line-height:1}
.dayc .chk{position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--green);display:grid;place-items:center;font-size:11px;font-weight:800}
.dayc.done{background:linear-gradient(160deg,#34d399,#059669);color:#fff}
.dayc.today{background:linear-gradient(160deg,#7c7fff,#5d5fef);color:#fff;box-shadow:0 8px 18px rgba(93,95,239,.35);transform:translateY(-2px)}
.dayc.today::after{content:"";position:absolute;right:-18px;bottom:-18px;width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.18)}
.dayc.live{background:linear-gradient(160deg,#fb923c,#f43f5e);color:#fff}
.dayc .lock{position:absolute;top:8px;right:8px;opacity:.7}
/* tiles */
.grid2{display:grid;grid-template-columns:1.15fr 1fr;gap:10px}
.col{display:flex;flex-direction:column;gap:10px}
.tile{border-radius:20px;padding:16px;color:#fff;position:relative;overflow:hidden;border:0;text-align:left;width:100%;display:flex;flex-direction:column;justify-content:flex-end;min-height:118px}
.tile .blob{position:absolute;right:-30px;top:-30px;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.16)}
.tile .blob2{position:absolute;right:20px;bottom:-50px;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.10)}
.tile .ic{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.22);display:grid;place-items:center;margin-bottom:auto}
.tile b{font-size:15px;font-weight:700;line-height:1.2;display:block;margin-top:10px}
.tile span{font-size:12px;opacity:.85;display:block;margin-top:3px}
.tile.violet{background:linear-gradient(150deg,#7577ff 0%,#5d5fef 60%,#4d4fd8 100%);min-height:246px;box-shadow:0 10px 24px rgba(93,95,239,.28)}
.tile.blue{background:linear-gradient(150deg,#60a5fa,#2563eb)}
.tile.green{background:linear-gradient(150deg,#4ade80,#16a34a)}
.tile.orange{background:linear-gradient(150deg,#fdba74,#f97316)}
.tile.pink{background:linear-gradient(150deg,#f9a8d4,#ec4899)}
.tile .play{width:48px;height:48px;border-radius:50%;background:#fff;color:var(--p);display:grid;place-items:center;font-size:16px;font-weight:800;box-shadow:0 6px 16px rgba(0,0,0,.18);margin-bottom:auto}
.tile .big{font-size:30px;font-weight:800;line-height:1}
.quick{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.q{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;text-align:left;box-shadow:var(--shadow-s)}
.q .qi{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none}
.q .qi.v{background:var(--p-soft);color:var(--p)}.q .qi.g{background:var(--green-soft);color:var(--green)}.q .qi.b{background:#e8f0fe;color:var(--blue)}.q .qi.o{background:#fff1e6;color:var(--orange)}
.q b{display:block;font-size:14px;font-weight:700}.q span{font-size:12px;color:var(--ink3)}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:var(--shadow-s)}
.card.soft{background:var(--soft);border:0;box-shadow:none}
.card.vsoft{background:var(--p-soft);border:0;box-shadow:none}
.lvl-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink2);margin-bottom:8px}
.lvl-row b{color:var(--ink);font-size:15px}
.pbar{height:10px;border-radius:99px;background:var(--soft2);overflow:hidden}
.pbar i{display:block;height:100%;width:43%;border-radius:99px;background:linear-gradient(90deg,var(--p),#a78bfa);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.lvls{display:flex;gap:6px;margin-top:10px}
.lvl{flex:1;border-radius:12px;padding:8px;text-align:center;font-size:11px;color:var(--ink3);background:var(--soft)}
.lvl b{display:block;font-size:16px;font-weight:800;color:var(--ink)}
.lvl.me{background:var(--p-soft);color:var(--p)}.lvl.me b{color:var(--p)}
.lvl.core{background:var(--gold-soft);color:#a16207}
.viplist{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.vipitem{display:flex;align-items:center;gap:10px;font-size:14px}
.vipitem .ava{width:34px;height:34px;font-size:13px}
.vipitem b{display:block;font-size:14px}.vipitem span{font-size:12px;color:var(--ink3)}
.vipitem .pill{margin-left:auto}
.pill{font-size:11px;font-weight:700;padding:3px 9px;border-radius:99px;background:var(--p-soft);color:var(--p);white-space:nowrap}
.pill.gold{background:var(--gold-soft);color:#a16207}.pill.green{background:var(--green-soft);color:var(--green)}.pill.grey{background:var(--soft2);color:var(--ink2)}.pill.bad{background:var(--bad-soft);color:var(--bad)}
.live{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--green);font-weight:700}
.live i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(34,181,115,.5);animation:pulse 1.6s infinite}
@keyframes pulse{to{box-shadow:0 0 0 8px rgba(34,181,115,0)}}
@media (prefers-reduced-motion:reduce){.live i,.confetti{animation:none}}
.banner{border-radius:20px;padding:16px;background:linear-gradient(135deg,#eef2ff,#fdf2f8);color:var(--ink);position:relative;overflow:hidden}
.banner p{margin:0;font-size:14px;color:var(--ink2)}
.banner b{color:var(--ink)}
/* buttons */
.btn{width:100%;border:0;background:var(--p);color:#fff;font-weight:700;font-size:16px;padding:16px;border-radius:16px;box-shadow:0 8px 20px rgba(93,95,239,.3);transition:transform .1s}
.btn:active{transform:scale(.98)}
.btn.soft{background:var(--p-soft);color:var(--p);box-shadow:none}
.btn.green{background:var(--green);box-shadow:0 8px 20px rgba(34,181,115,.3)}
.btn.done{background:var(--green-soft);color:var(--green);box-shadow:none}
.btn.ghost{background:transparent;color:var(--ink2);box-shadow:none;padding:12px;font-size:14px;font-weight:600}
/* tabs */
.tabs{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);background:var(--card);border-top:1px solid var(--line);padding:10px 8px calc(14px + env(safe-area-inset-bottom,0px))}
.tabs button{border:0;background:transparent;color:var(--ink3);font-size:11px;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 0;border-radius:10px}
.tabs button[aria-pressed="true"]{color:var(--p)}
.home-ind{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);width:120px;height:5px;border-radius:99px;background:var(--ink);opacity:.9}
/* sheet */
.sheet{position:absolute;left:0;right:0;bottom:0;background:var(--card);border-radius:28px 28px 0 0;padding:10px 18px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 40px rgba(20,20,40,.18);z-index:6;max-height:92%;overflow:auto;transform:translateY(100%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.sheet.open{transform:none}
.sheet .handle{width:40px;height:5px;border-radius:99px;background:var(--soft2);margin:0 auto 12px}
.sheet h3{font-size:19px;font-weight:800}
.sheet .sub{font-size:13px;color:var(--ink3);margin:2px 0 14px}
.scrim{position:absolute;inset:0;background:rgba(20,20,40,.35);z-index:5;opacity:0;pointer-events:none;transition:opacity .3s}
.scrim.on{opacity:1;pointer-events:auto}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}
.field label{font-weight:600;font-size:14px;display:flex;justify-content:space-between}
.field label span{color:var(--ink3);font-weight:500;font-size:12px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{border:1px solid var(--line);background:var(--card);color:var(--ink2);border-radius:999px;padding:8px 13px;font-weight:600;font-size:14px;min-width:44px}
.chips button[aria-pressed="true"]{background:var(--p);color:#fff;border-color:var(--p)}
.chips.faces button{font-size:18px;padding:6px 10px}
.photo{border:2px dashed var(--line);border-radius:16px;padding:14px;text-align:center;color:var(--ink3);font-size:13px;background:var(--soft);width:100%}
.photo.on{border-style:solid;border-color:var(--green);color:var(--green);background:var(--green-soft)}
.toast{position:absolute;left:16px;right:16px;top:14px;background:var(--ink);color:#fff;border-radius:16px;padding:12px 16px;font-weight:600;box-shadow:var(--shadow);transform:translateY(-140%);transition:transform .4s cubic-bezier(.2,.8,.2,1);z-index:8;display:flex;gap:10px;align-items:center}
.toast .em{width:34px;height:34px;border-radius:10px;background:var(--green);display:grid;place-items:center;flex:none}
.toast.show{transform:none}
.toast:not(.show),.admin-toast:not(.show){visibility:hidden}
.confetti{position:absolute;inset:0;pointer-events:none;z-index:7}
/* rating */
.podium{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:end;margin-top:4px}
.pod{text-align:center;background:var(--soft);border-radius:18px;padding:12px 6px 10px}
.pod .ava{margin:0 auto 6px;width:48px;height:48px;font-size:16px}
.pod b{display:block;font-size:13px}.pod span{font-size:11px;color:var(--ink3)}
.pod .pts{font-weight:800;color:var(--p);font-size:15px;margin-top:4px}
.pod.first{background:var(--gold-soft);padding-top:18px}.pod.first .ava{width:58px;height:58px;font-size:19px;box-shadow:0 0 0 3px var(--gold)}
.pod .medal{font-size:14px}
.rank{display:flex;align-items:center;gap:10px;padding:10px 6px;border-radius:14px}
.rank.me{background:var(--p-soft)}
.rank .pos{width:22px;text-align:center;font-weight:800;color:var(--ink3);font-size:13px}
.rank .ava{width:38px;height:38px;font-size:14px}
.rank .who{flex:1;min-width:0}
.rank .who b{display:block;font-size:14px}
.rank .who span{font-size:12px;color:var(--ink3)}
.rank .pts{font-weight:800;color:var(--p)}
.rank .streak{font-size:12px;color:var(--orange);font-weight:600}
/* feed */
.post{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-s)}
.post .ph{display:flex;align-items:center;gap:10px;padding:12px 14px}
.post .ph .ava{width:36px;height:36px;font-size:13px}
.post .ph b{font-size:14px;display:block}
.post .ph span{font-size:12px;color:var(--ink3)}
.post .img{height:160px;display:grid;place-items:center;color:#fff;font-size:13px;position:relative;font-weight:600}
.post .img::after{content:"MedLit";position:absolute;right:12px;bottom:10px;font-size:11px;opacity:.7}
.post .txt{padding:12px 14px 6px;font-size:14px;color:var(--ink2)}
.post .act{display:flex;gap:14px;padding:4px 14px 12px;font-size:13px;color:var(--ink3);align-items:center}
.post .act button{border:0;background:var(--soft);color:var(--ink2);font-weight:600;padding:6px 12px;border-radius:99px}
.post .act button.on{background:#fde7f0;color:var(--pink)}
/* vip */
.vipcard{border-radius:24px;padding:22px 18px;background:linear-gradient(150deg,#4d4fd8,#7c3aed 60%,#a855f7);color:#fff;position:relative;overflow:hidden}
.vipcard .blob{position:absolute;right:-40px;top:-40px;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.14)}
.vipcard .lockic{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;margin-bottom:12px}
.vipcard h3{font-size:20px;font-weight:800}
.vipcard p{margin:8px 0 0;font-size:14px;opacity:.9}
.dyn{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dyn div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:var(--shadow-s)}
.dyn small{display:block;color:var(--ink3);font-size:11px;margin-bottom:2px}
.dyn b{font-size:15px}
.dyn i{font-style:normal;color:var(--green);font-weight:700;font-size:12px;display:block}
.price{display:flex;gap:10px}
.price button{flex:1;border:2px solid var(--line);border-radius:18px;padding:14px 12px;background:var(--card);text-align:left}
.price button[aria-pressed="true"]{border-color:var(--p);background:var(--p-soft)}
.price b{display:block;font-size:17px;font-weight:800}
.price small{color:var(--ink3);font-size:12px;line-height:1.35;display:block;margin-top:2px}
.price .tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--p);display:block;margin-bottom:4px}
.small{font-size:12px;color:var(--ink3)}
/* landing */
.hero{padding:6px 0 0}
.hero .kicker{display:inline-flex;align-items:center;gap:6px;background:var(--p-soft);color:var(--p);font-size:12px;font-weight:700;padding:5px 11px;border-radius:99px}
.hero h1{font-size:27px;font-weight:800;line-height:1.15;margin-top:12px}
.hero h1 em{font-style:normal;color:var(--p)}
.hero p{margin:10px 0 0;font-size:15px;color:var(--ink2)}
.doc{display:flex;align-items:center;gap:12px;background:var(--soft);border-radius:18px;padding:12px}
.doc .ava{width:52px;height:52px;background:linear-gradient(135deg,#a5b4fc,#5d5fef);color:#fff;font-size:18px}
.doc b{display:block;font-size:15px}.doc span{font-size:12px;color:var(--ink3)}
.count{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink2)}
.count b{color:var(--ink);font-weight:800}
.ava-row{display:flex}
.ava-row i{width:28px;height:28px;border-radius:50%;font-style:normal;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid var(--card);margin-left:-9px;color:#fff}
.ava-row i:first-child{margin-left:0}
.ava-row i:nth-child(1){background:#f472b6}.ava-row i:nth-child(2){background:#60a5fa}.ava-row i:nth-child(3){background:#34d399}.ava-row i:nth-child(4){background:#fbbf24}
.gets{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gets .tile{min-height:120px;padding:14px}
.gets .tile b{font-size:14px}
.pricebox{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow-s)}
.pricebox b{font-size:26px;font-weight:800;letter-spacing:-.02em}
.pricebox s{color:var(--ink3);font-size:14px;margin-left:6px;font-weight:500}
.pricebox span{font-size:12px;color:var(--ink3);display:block}
.pricebox .pill{font-size:12px}
.inp{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.inp label{font-size:12px;color:var(--ink3);font-weight:600}
.inp input,.inp select{font:inherit;border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;background:var(--soft);color:var(--ink);width:100%}
.inp input:focus,.inp select:focus{outline:none;border-color:var(--p);background:var(--card)}
.finik{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center;box-shadow:var(--shadow-s)}
.finik .flogo{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.finik .flogo i{width:28px;height:28px;border-radius:9px;background:#0d1b36;color:#fff;font-style:normal;display:grid;place-items:center;font-size:14px}
.qr{width:160px;height:160px;border-radius:16px;position:relative;border:8px solid var(--card);outline:1px solid var(--line);background:
  repeating-linear-gradient(90deg,var(--ink) 0 8px,transparent 8px 16px),repeating-linear-gradient(0deg,var(--ink) 0 8px,transparent 8px 16px);background-blend-mode:multiply;opacity:.85}
.qr::after{content:"";position:absolute;inset:38%;background:var(--card);border-radius:8px;display:grid}
.finik p{margin:0;font-size:13px;color:var(--ink2)}
.banks{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.banks span{font-size:11px;border:1px solid var(--line);border-radius:99px;padding:4px 9px;color:var(--ink2);background:var(--soft)}
.fstatus{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink3);justify-content:center}
.spin{width:12px;height:12px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--p);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.steps{display:flex;gap:6px;justify-content:center}
.steps i{width:28px;height:4px;border-radius:99px;background:var(--soft2)}.steps i.on{background:var(--p)}


/* ---- app-specific ---- */
html,body{height:100%}
body{padding:0;background:var(--bg)}
.phone{max-width:430px;margin:0 auto;min-height:100%;border-radius:0;border:0;box-shadow:none;background:var(--card)}
@media (min-width:480px){.phone{border-left:1px solid var(--line);border-right:1px solid var(--line)}}
.ph-body{padding-top:calc(14px + env(safe-area-inset-top,0px))}
.screen{min-height:100%}
.center{display:grid;place-items:center;min-height:60vh}
.spin.big{width:28px;height:28px;border-width:3px}
.small.center{display:block;min-height:0;text-align:center;margin-top:12px;line-height:1.5}
.muted{color:var(--ink3);margin:0;font-size:14px}
.link{border:0;background:transparent;color:var(--p);font-weight:700;font-size:14px;margin-left:auto}
.logo{display:flex;align-items:center;gap:10px}
.logo .mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--p),#8b5cf6);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px}
.logo b{font-weight:800;font-size:16px;display:block;line-height:1.1}
.logo small{display:block;color:var(--ink3);font-size:12px}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink2);margin:6px 0 10px}
.chk input{margin-top:3px}
.err{background:var(--bad-soft);color:var(--bad);border-radius:12px;padding:10px 12px;font-size:13px;margin-bottom:10px}
textarea{font:inherit;border:1.5px solid var(--line);border-radius:14px;padding:12px;background:var(--soft);color:var(--ink);width:100%;resize:vertical}
.tile .lbl{margin:0;opacity:.8}
.tile .ic{font-size:18px}
.q .qi{font-size:16px}
.tabs button{font-size:20px}.tabs button span{font-size:11px;display:block}
.ico{font-size:18px}
.list{display:flex;flex-direction:column;gap:2px}.list.gap{gap:12px}
.photo{display:block;cursor:pointer}
.post .img img,.post .img video{width:100%;height:100%;object-fit:cover;display:block}
.post .img{height:220px;background:var(--soft2)}
.post .img.novideo{height:0}
.btn[disabled]{opacity:.6}
.btn.done{pointer-events:none}
a{color:var(--p)}
/* fixed overlays */
.sheet{bottom:0;position:fixed;left:50%;right:auto;width:100%;max-width:430px;max-height:88vh;transform:translate(-50%,100%);visibility:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s .35s}
.sheet.open{transform:translate(-50%,0);visibility:visible;transition:transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s}
.scrim{position:fixed;inset:0}
.tabs{position:fixed;left:50%;right:auto;width:100%;max-width:430px;transform:translateX(-50%);z-index:4}
.toast{position:fixed;left:50%;width:calc(100% - 32px);max-width:398px;transform:translate(-50%,-140%)}.toast.show{transform:translate(-50%,0)}
