:root{
  --ink:#152029; --soft:#4a5b68; --faint:#7d8d99;
  --line:rgba(20,40,55,.12); --line2:rgba(20,40,55,.07);
  --glass:rgba(255,255,255,.58); --glass2:rgba(255,255,255,.80); --solid:#fff;
  --acc:#0e7c86; --acc2:#0b5f68; --sun:#e08a2c; --warn:#c2401f; --ok:#2f8f6b;
  --bg1:#dff0f2; --bg2:#f6f2e8;
  --lift:0 1px 2px rgba(18,42,58,.06), 0 6px 18px rgba(18,42,58,.09);
  --lift2:0 2px 4px rgba(18,42,58,.07), 0 16px 40px rgba(18,42,58,.15);
  --inset:inset 0 1px 0 rgba(255,255,255,.85);
  --r:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{
  font-family:Heebo,system-ui,sans-serif;color:var(--ink);line-height:1.55;min-height:100vh;
  background:
    radial-gradient(900px 420px at 88% -8%, rgba(224,138,44,.16), transparent 62%),
    radial-gradient(760px 420px at 4% 4%, rgba(14,124,134,.14), transparent 60%),
    linear-gradient(162deg, var(--bg1), var(--bg2));
  background-attachment:fixed;
}
.mono{font-family:'Space Mono',ui-monospace,monospace}
a{color:var(--acc2)}
::selection{background:rgba(14,124,134,.18)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(14,124,134,.35);outline-offset:2px
}

/* ---------- header ---------- */
header{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.66), rgba(255,255,255,.32));
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset, 0 10px 30px rgba(18,42,58,.06);
}
.hin{width:100%;max-width:1500px;margin:0 auto;padding:18px 20px;overflow:hidden}
.brand,.userbar{max-width:100%;min-width:0}
.brand span,.userbar .who{overflow-wrap:anywhere}
.brand{display:block}
.brand h1{
  font-size:1.6rem;font-weight:900;letter-spacing:-.02em;
  background:linear-gradient(120deg,var(--acc2),var(--acc) 55%,var(--sun));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brand span{display:block;color:var(--soft);font-size:.92rem;margin-top:2px;line-height:1.45}

/* ---------- progress board ---------- */
.board{display:block;margin-top:16px;max-width:100%}
.navgroups{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;position:relative;z-index:2;padding-inline:12px}
.ngroup{
  min-width:0;cursor:pointer;font:inherit;color:var(--ink);text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  background:rgba(255,255,255,.46);border:1px solid var(--line);border-radius:14px 14px 0 0;padding:10px 8px 12px;
  box-shadow:var(--inset);transition:transform .16s ease,background .16s ease,box-shadow .16s ease;
}
.ngroup:hover{transform:translateY(-2px);background:rgba(255,255,255,.68)}
.ngroup:focus-visible,.ntab:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}
.ngroup .ngname{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0}
.ngroup b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ngroup small{font-size:9.5px;color:var(--faint);white-space:nowrap}
.ngroup.on{color:var(--acc2);background:var(--glass2);border-bottom-color:transparent;
  box-shadow:0 -4px 18px rgba(18,42,58,.07),var(--inset)}
.navlayer{position:relative;z-index:1;margin-top:-1px;padding:12px 14px 14px;background:var(--glass2);
  border:1px solid var(--line);border-radius:16px;box-shadow:var(--lift2),var(--inset);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.navlayer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;color:var(--soft)}
.navlayer-head b{font-size:12px;color:var(--acc2)}
.navlayer-head span{font-size:10.5px;color:var(--faint)}
.navtabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ntabwrap{position:relative;min-width:0}
.ntab{
  width:100%;height:100%;min-width:0;cursor:pointer;font:inherit;color:var(--ink);text-align:start;
  display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;padding-inline-end:40px;
  background:linear-gradient(180deg,#fff,#f3f6f6);border:1px solid var(--line);border-radius:11px;
  box-shadow:0 1px 2px rgba(18,42,58,.07),var(--inset);
  transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;
}
.ntab:hover{transform:translateY(-1px);border-color:rgba(14,124,134,.42);box-shadow:0 4px 13px rgba(18,42,58,.12),var(--inset)}
.ntab b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ntab i{font-style:normal;font-family:'Space Mono',monospace;font-size:9.5px;color:var(--faint);white-space:nowrap}
.ntab.ok i{color:var(--ok)}
.ntab.warn i{color:var(--sun)}
.ntab.on{color:#fff;border-color:transparent;background:linear-gradient(180deg,#12909b,var(--acc) 60%,var(--acc2));
  box-shadow:0 5px 16px rgba(11,95,104,.28),inset 0 1px 0 rgba(255,255,255,.28)}
.ntab.on i{color:rgba(255,255,255,.78)}
.tabinfo{position:absolute;z-index:2;inset-inline-end:8px;top:50%;transform:translateY(-50%);width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(14,124,134,.30);
  background:rgba(255,255,255,.76);color:var(--acc2);font:700 12px 'Space Mono',monospace;cursor:help;
  box-shadow:0 1px 4px rgba(18,42,58,.12);transition:transform .14s ease,background .14s ease,box-shadow .14s ease}
.tabinfo:hover,.tabinfo:focus-visible,.tabinfo[aria-expanded=true]{transform:translateY(-50%) scale(1.08);background:#fff;
  box-shadow:0 3px 10px rgba(11,95,104,.22);outline:2px solid rgba(14,124,134,.18);outline-offset:1px}
.tabhelp{position:relative;margin-top:10px;padding:12px 14px;padding-inline-end:42px;border:1px solid rgba(14,124,134,.25);
  border-radius:12px;background:linear-gradient(135deg,rgba(14,124,134,.08),rgba(224,138,44,.06));
  box-shadow:var(--inset);color:var(--soft);animation:helpin .16s ease}
.tabhelp[hidden]{display:none}.tabhelp b{display:block;color:var(--acc2);font-size:12.5px;margin-bottom:3px}
.tabhelp span{display:block;font-size:12px;line-height:1.6}.tabhelp-close{position:absolute;inset-inline-end:9px;top:8px;
  width:25px;height:25px;border:0;border-radius:50%;background:rgba(255,255,255,.72);color:var(--soft);cursor:pointer;font-size:17px}
@keyframes helpin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.navempty{grid-column:1/-1;padding:11px 13px;border:1px dashed rgba(47,143,107,.38);border-radius:11px;
  background:rgba(47,143,107,.055);color:var(--ok);font-size:12px;text-align:center}
.prodbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:var(--glass2);border:1px solid var(--line);border-radius:15px;padding:11px 13px;margin-bottom:14px;
  box-shadow:var(--lift),var(--inset)}
.prodbar .pstate{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12px;color:var(--soft)}
.prodbar .meter{width:150px;height:8px;background:rgba(20,40,55,.09);border-radius:99px;overflow:hidden}
.prodbar .meter i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--sun));border-radius:99px}

/* ---------- layout ---------- */
main{max-width:1500px;margin:0 auto;padding:20px 20px 80px;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:20px;align-items:start}
@media(max-width:1120px){ main{grid-template-columns:1fr} .side{position:static!important} }
@media(max-width:700px){
  main{padding:14px 12px 80px}.hin{padding:14px 12px}
  .board{margin-top:13px}
  .navgroups{display:flex;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:thin;scroll-snap-type:x proximity}
  .ngroup{flex:0 0 116px;border-radius:12px;padding:8px 7px;scroll-snap-align:start}
  .ngroup.on{border-bottom-color:var(--line);box-shadow:0 0 0 2px rgba(14,124,134,.11),var(--lift),var(--inset)}
  .ngroup small{font-size:9px}
  .navlayer{margin-top:5px;padding:10px;border-radius:14px}
  .navlayer-head{margin-bottom:7px}.navlayer-head span{display:none}
  .navtabs{display:flex;overflow-x:auto;gap:7px;padding-bottom:3px;scrollbar-width:thin;scroll-snap-type:x proximity}
  .ntabwrap{flex:0 0 176px;scroll-snap-align:start}.ntab{min-height:50px}
  .tabhelp{padding-inline-start:12px;margin-top:8px}
  .btn{min-height:42px}.tile .ta .btn{flex:1}.prodbar .bar{width:100%}
}

/* ---------- sections ---------- */
.sec{
  background:var(--glass2);border:1px solid var(--line);border-radius:var(--r);margin-bottom:14px;
  overflow:hidden;box-shadow:var(--lift),var(--inset);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transition:box-shadow .2s ease,transform .2s ease;
}
.sec.open{box-shadow:var(--lift2),var(--inset)}
.sec>h2{
  font-size:1rem;font-weight:700;padding:14px 17px;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
}
.sec>h2:hover{color:var(--acc2)}
.sec>h2 em{font-style:normal;font-size:10.5px;color:var(--faint);font-family:'Space Mono',monospace;
  border:1px solid var(--line);border-radius:999px;padding:2px 9px;background:var(--glass)}
.sbody{padding:0 17px 18px;display:none}
.sec.open .sbody{display:block}
.hint{color:var(--soft);font-size:12.5px;margin:2px 0 12px;line-height:1.6}

/* ---------- fields ---------- */
label{display:block;font-size:12px;color:var(--faint);margin:11px 0 5px;font-weight:500}
input,select,textarea{
  width:100%;font:inherit;font-size:14px;padding:10px 12px;color:var(--ink);
  background:var(--solid);border:1px solid var(--line);border-radius:11px;
  box-shadow:inset 0 1px 3px rgba(18,42,58,.05);
  transition:border-color .15s ease, box-shadow .15s ease;
}
input::placeholder,textarea::placeholder{color:#a9b6bf}
input:hover,select:hover,textarea:hover{border-color:rgba(20,40,55,.22)}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--acc);
  box-shadow:0 0 0 3px rgba(14,124,134,.15), inset 0 1px 3px rgba(18,42,58,.04);
}
textarea{min-height:66px;resize:vertical}
input[type=checkbox]{width:auto;box-shadow:none;accent-color:var(--acc)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
@media(max-width:560px){.g2,.g3{grid-template-columns:1fr}}

/* ---------- buttons ---------- */
.btn{
  font:inherit;font-size:13px;font-weight:500;cursor:pointer;color:var(--ink);text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border-radius:11px;
  background:linear-gradient(180deg,#fff,#f3f6f6);border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(18,42,58,.08), var(--inset);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(18,42,58,.14), var(--inset);
  border-color:rgba(20,40,55,.2)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 2px 5px rgba(18,42,58,.16)}
.btn:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}
.btn.pri{
  color:#fff;border-color:transparent;
  background:linear-gradient(180deg,#12909b,var(--acc) 60%,var(--acc2));
  box-shadow:0 2px 5px rgba(11,95,104,.30), inset 0 1px 0 rgba(255,255,255,.28);
}
.btn.pri:hover{box-shadow:0 8px 22px rgba(11,95,104,.34), inset 0 1px 0 rgba(255,255,255,.3)}
.btn.gh{color:#fff;border-color:transparent;
  background:linear-gradient(180deg,#3aa07a,#2f8f6b 60%,#26765a);
  box-shadow:0 2px 5px rgba(38,118,90,.3), inset 0 1px 0 rgba(255,255,255,.25)}
.btn.sm{padding:6px 11px;font-size:12px;border-radius:9px}
.btn.del{color:var(--warn)}
.bar{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}

/* ---------- repeating items ---------- */
.item{
  background:var(--glass);border:1px solid var(--line2);border-radius:13px;padding:13px;margin-top:11px;
  box-shadow:0 1px 2px rgba(18,42,58,.05), var(--inset);
}
.item .ih{display:flex;justify-content:space-between;align-items:center;gap:9px;flex-wrap:wrap}
.item .ih b{font-size:.96rem}
.filebox{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;
  border:1px dashed rgba(14,124,134,.34);border-radius:12px;background:rgba(14,124,134,.045)}
.filebox .fname{flex:1;min-width:150px;font-size:12px;color:var(--soft);overflow-wrap:anywhere}
.filebox input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.tagrow{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tg{
  border:1px solid var(--line);border-radius:999px;padding:4px 11px;font-size:11.5px;cursor:pointer;
  background:var(--solid);color:var(--soft);
  box-shadow:0 1px 2px rgba(18,42,58,.06);transition:transform .13s ease,box-shadow .13s ease
}
.tg:hover{transform:translateY(-1px);box-shadow:0 3px 9px rgba(18,42,58,.12)}
.tg.on{background:linear-gradient(180deg,#12909b,var(--acc2));color:#fff;border-color:transparent;
  box-shadow:0 2px 6px rgba(11,95,104,.28), inset 0 1px 0 rgba(255,255,255,.25)}

/* ---------- preview ---------- */
.side{position:sticky;top:20px}
.pv{
  background:var(--glass2);border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:var(--lift2),var(--inset);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.pvh{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 15px;
  border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.6),transparent)}
.pvh b{font-size:.92rem}
.pvh span{display:flex;gap:8px}
iframe{width:100%;height:min(74vh,900px);border:0;background:#fff;display:block}

/* ---------- messages & steps ---------- */
.msg{margin-top:13px;padding:12px 14px;border-radius:12px;font-size:13px;white-space:pre-wrap;
  background:var(--solid);border:1px solid var(--line);box-shadow:0 1px 2px rgba(18,42,58,.06);line-height:1.65}
.msg.ok{border-color:rgba(47,143,107,.45);background:linear-gradient(180deg,rgba(47,143,107,.07),#fff)}
.msg.bad{border-color:rgba(194,64,31,.45);background:linear-gradient(180deg,rgba(194,64,31,.06),#fff)}
.steps{counter-reset:s;margin:10px 0 0;padding:0;list-style:none}
.steps li{position:relative;padding:7px 30px 7px 0;font-size:13px;color:var(--soft)}
.steps li:before{
  counter-increment:s;content:counter(s);position:absolute;inset-inline-start:0;top:7px;
  width:20px;height:20px;border-radius:50%;font-family:'Space Mono',monospace;font-size:10px;
  display:flex;align-items:center;justify-content:center;color:#fff;
  background:linear-gradient(180deg,#12909b,var(--acc2));box-shadow:0 2px 5px rgba(11,95,104,.3)
}
code{background:rgba(14,124,134,.09);color:var(--acc2);padding:2px 7px;border-radius:7px;
  font-family:'Space Mono',monospace;font-size:12px}

/* ---------- screens ---------- */
.screen{display:none}
.screen.on{display:block}
#scr-setup,#scr-auth,#scr-dash{max-width:1500px;margin:0 auto;padding:24px 20px 80px}
.panelbox{
  background:var(--glass2);border:1px solid var(--line);border-radius:20px;padding:22px 24px;max-width:720px;
  box-shadow:var(--lift2),var(--inset);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.panelbox.narrow{max-width:430px;margin:7vh auto 0}
.panelbox h2{font-size:1.2rem;margin-bottom:5px;font-weight:900}
.welcome{margin-bottom:20px;text-align:center}
.welcome .eyebrow{display:inline-block;margin-bottom:8px;padding:4px 10px;border-radius:999px;
  background:rgba(14,124,134,.09);color:var(--acc2);font-size:11px;font-weight:800}
.welcome h2{font-size:1.65rem;line-height:1.2;margin:0 0 8px;color:var(--ink)}
.welcome p{margin:0;color:var(--soft);font-size:13.5px;line-height:1.65}
.welcome .benefits{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:12px}
.welcome .benefits span{font-size:10.5px;font-weight:700;color:var(--acc2);background:var(--glass);
  border:1px solid var(--line);border-radius:999px;padding:4px 8px}
.welcome .start{margin-top:13px;font-size:12px;font-weight:700;color:var(--ink)}
.feedback{position:relative;overflow:hidden;margin-top:18px;padding:16px 17px;border:1px solid rgba(14,124,134,.18);
  border-radius:16px;background:linear-gradient(135deg,rgba(14,124,134,.09),rgba(224,138,44,.08));
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.feedback:after{content:'✦';position:absolute;inset-inline-end:14px;top:-13px;font-size:54px;color:rgba(14,124,134,.08);pointer-events:none}
.feedback .ftxt{position:relative;z-index:1;display:flex;flex-direction:column;gap:2px}
.feedback .ftxt b{font-size:.95rem}.feedback .ftxt span{font-size:12px;color:var(--soft)}
.feedback .fmail{font-family:'Space Mono',monospace;font-size:10.5px;color:var(--faint)}
.authtabs{display:flex;gap:7px;margin-bottom:10px}
.atab{
  flex:1;font:inherit;font-size:13.5px;cursor:pointer;padding:10px;border-radius:11px;color:var(--soft);
  background:linear-gradient(180deg,#fff,#f2f5f5);border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(18,42,58,.06), var(--inset);transition:all .15s ease
}
.atab:hover{transform:translateY(-1px)}
.atab.on{background:linear-gradient(180deg,#12909b,var(--acc2));color:#fff;border-color:transparent;
  font-weight:700;box-shadow:0 4px 14px rgba(11,95,104,.3), inset 0 1px 0 rgba(255,255,255,.25)}

.userbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:13px}
.userbar .who{font-family:'Space Mono',monospace;font-size:11.5px;color:var(--faint);
  background:var(--glass);border:1px solid var(--line2);border-radius:999px;padding:4px 11px}

/* ---------- dashboard ---------- */
.dashhead{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.dashhead h2{font-size:1.45rem;font-weight:900}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.tile{
  background:var(--glass2);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;text-align:start;
  box-shadow:var(--lift),var(--inset);
  transition:transform .2s cubic-bezier(.2,.7,.3,1), box-shadow .2s ease;
}
.tile:hover{transform:translateY(-4px) scale(1.012);box-shadow:var(--lift2),var(--inset)}
.tile .shot{aspect-ratio:16/10;background:linear-gradient(150deg,#cfe3e6,#eee8dc) center/cover;position:relative}
.tile .shot:after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 45%,rgba(10,25,32,.42))}
.tile .shot span{position:absolute;inset-inline-start:11px;bottom:9px;z-index:1;
  font-family:'Space Mono',monospace;font-size:11px;color:#fff;
  background:rgba(10,25,32,.45);border:1px solid rgba(255,255,255,.22);
  padding:3px 10px;border-radius:999px;backdrop-filter:blur(6px)}
.tile .tb{padding:13px 14px 6px;display:flex;flex-direction:column;gap:3px;flex:1}
.tile .tb b{font-size:1rem}
.tile .tb i{font-style:normal;font-size:12px;color:var(--faint);font-family:'Space Mono',monospace}
.tile .ta{display:flex;gap:7px;padding:0 14px 14px;flex-wrap:wrap}
.tile.new{
  border-style:dashed;border-color:rgba(14,124,134,.4);background:var(--glass);
  align-items:center;justify-content:center;min-height:200px;cursor:pointer;
  color:var(--acc2);font-size:.95rem;gap:6px;box-shadow:none
}
.tile.new:hover{background:rgba(255,255,255,.72)}
.tile.new b{font-size:2.2rem;font-weight:400;line-height:1;color:var(--acc)}
.tile.new.demo{
  border-style:solid;border-color:rgba(224,138,44,.36);
  background:linear-gradient(145deg,rgba(14,124,134,.11),rgba(224,138,44,.13));
  color:var(--ink);text-align:center;padding:22px
}
.tile.new.demo b{font-size:2rem}.tile.new.demo span{font-weight:900;color:var(--acc2)}
.tile.new.demo small{max-width:210px;color:var(--soft);font-size:11.5px;line-height:1.55}
.tile.new.demo:hover{background:linear-gradient(145deg,rgba(14,124,134,.16),rgba(224,138,44,.18))}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
  .btn:hover,.tile:hover,.bcell:hover,.tg:hover,.atab:hover{transform:none}
}


.fld{margin:0 0 13px}
.fld>label{display:block;font-size:12.5px;color:var(--ink);font-weight:700;margin:0 0 5px}
.fld .why{font-size:11.5px;color:var(--faint);margin:5px 0 0;line-height:1.5}
.grp{margin:18px 0 10px;padding-top:14px;border-top:1px solid var(--line2);
  font-size:12px;font-weight:700;color:var(--acc2);letter-spacing:.02em}
.grp:first-child{border-top:0;padding-top:0;margin-top:4px}
.kv{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 4px}
.kv span{background:var(--glass);border:1px solid var(--line2);border-radius:999px;
  padding:5px 12px;font-size:12px;color:var(--soft)}
.kv span b{color:var(--ink);font-weight:700}
.seek{display:flex;gap:8px}
.seek input{flex:1}

.prow{display:flex;align-items:center;gap:11px;padding:9px 11px;margin-top:8px;cursor:pointer;
  background:var(--glass);border:1px solid var(--line2);border-radius:12px;
  box-shadow:0 1px 2px rgba(18,42,58,.05);transition:transform .14s ease,box-shadow .14s ease}
.prow:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(18,42,58,.12)}
.prow.on{border-color:var(--acc);box-shadow:0 0 0 3px rgba(14,124,134,.12)}
.pthumb{width:44px;height:44px;flex:0 0 44px;border-radius:10px;background:#e6eeef center/cover;
  display:flex;align-items:center;justify-content:center;font-size:19px}
.pmain{flex:1;min-width:0;display:flex;flex-direction:column}
.pmain b{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmain span{font-size:11.5px;color:var(--faint)}
.pedit{border:1px solid var(--acc);border-top:0;border-radius:0 0 12px 12px;padding:13px;
  background:var(--glass2);margin-top:-6px}
.dchips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.dchip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 11px;
  font-size:11.5px;cursor:pointer;color:var(--soft)}
.dchip.on{background:linear-gradient(180deg,#12909b,var(--acc2));color:#fff;border-color:transparent}
.chain{font-size:11.5px;color:var(--faint);margin-top:8px;font-family:'Space Mono',monospace}

.sw{display:flex;gap:9px;flex-wrap:wrap}
.sw button{border:2px solid transparent;border-radius:13px;padding:0;cursor:pointer;background:none;
  box-shadow:0 1px 3px rgba(18,42,58,.14);overflow:hidden;width:104px}
.sw button .bar2{height:34px;display:block}
.sw button .nm{display:block;font:inherit;font-size:11.5px;padding:5px 0;background:#fff;color:var(--soft)}
.sw button.on{border-color:var(--acc);box-shadow:0 0 0 3px rgba(14,124,134,.16)}

.esimgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin:12px 0}
.esimcard{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:15px;border:1px solid var(--line);
  border-radius:15px;background:var(--glass);box-shadow:var(--lift),var(--inset)}
.esimcard>span{font-size:25px}.esimcard>b{font-size:1rem}.esimcard p{font-size:12px;color:var(--soft);min-height:38px}
.esimcard .btn{width:100%;text-align:center;margin-top:auto}
.esimplan{border-inline-start:4px solid var(--acc);margin-top:12px}.esimplan .ih b{color:var(--acc2)}
.secretline{display:flex;gap:7px;align-items:center}.secretline input{flex:1;min-width:0}.secretline .btn{flex:0 0 auto}
.planlimits{margin-top:12px!important}.planbox{display:flex;gap:8px 18px;align-items:center;flex-wrap:wrap;margin:0 0 16px}.planbox span{font-size:12px;color:var(--soft)}
@media(max-width:760px){.esimgrid{grid-template-columns:1fr}.esimcard p{min-height:0}}

.prog{margin:12px 0 4px}
.prog .track{height:9px;border-radius:999px;background:rgba(20,40,55,.09);overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(18,42,58,.10)}
.prog .fill{height:100%;width:0;border-radius:999px;
  background:linear-gradient(90deg,var(--acc2),var(--acc) 60%,var(--sun));
  transition:width .45s cubic-bezier(.2,.7,.3,1)}
.prog .lab{display:flex;justify-content:space-between;gap:10px;margin-top:6px;
  font-size:11.5px;color:var(--faint);font-family:'Space Mono',monospace}
.prog.done .fill{background:linear-gradient(90deg,#2f8f6b,#46c79a)}

.sthumb{width:74px;height:56px;flex:0 0 74px;border-radius:10px;background:#e6eeef center/cover;
  box-shadow:0 1px 3px rgba(18,42,58,.16)}

.sthumb.ismap{opacity:.75;filter:saturate(.8)}
.sthumb.ismap:after{content:'\05de\05e4\05d4';position:absolute}

.sthumb.ismap{position:relative;opacity:.9;filter:saturate(.85)}
.sthumb.ismap i{position:absolute;inset-inline-start:50%;top:50%;width:11px;height:11px;margin:-5px 0 0 -5px;
  border-radius:50%;background:var(--warn);border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.sthumb.ismap:before{content:'\05de\05e4\05d4';position:absolute;bottom:2px;inset-inline-start:4px;
  font-size:9px;color:#fff;background:rgba(10,25,32,.6);border-radius:5px;padding:0 4px}

.sthumb.none{display:flex;align-items:center;justify-content:center;font-size:24px;
  background:linear-gradient(150deg,#e8f0f1,#f4efe4);color:var(--acc2);
  border:1px dashed var(--line)}

.sthumb.area{position:relative}
.sthumb.area:after{content:'\05de\05d4\05d0\05d6\05d5\05e8';position:absolute;inset-inline-start:0;bottom:0;
  font-size:9px;color:#fff;background:rgba(10,25,32,.66);padding:1px 5px;border-start-end-radius:6px}

#lb{border:0;border-radius:18px;padding:0;max-width:760px;width:calc(100% - 26px);
  background:var(--glass2);color:var(--ink)}
#lb::backdrop{background:rgba(8,20,28,.55)}
#lbb{padding:0 0 16px}
#lbb img{width:100%;max-height:62vh;object-fit:contain;background:#0a1015;
  border-start-start-radius:18px;border-start-end-radius:18px;display:block}
#lbb .lbi{padding:14px 18px}
#lbb h3{font-size:1.1rem;margin-bottom:4px}
#lbb .lbm{font-size:12px;color:var(--faint);margin-bottom:10px}
#lbb .lbl{display:flex;gap:8px;flex-wrap:wrap}
.lbx{position:absolute;inset-inline-end:10px;top:8px;z-index:2;border:0;background:rgba(8,20,28,.6);
  color:#fff;width:32px;height:32px;border-radius:50%;font-size:19px;cursor:pointer}
.sthumb{cursor:zoom-in}

#hovprev{display:none;position:fixed;z-index:90;width:330px;border-radius:14px;overflow:hidden;
  background:var(--glass2);border:1px solid var(--line);box-shadow:var(--lift2);
  backdrop-filter:blur(10px);pointer-events:none}
#hovprev img{width:100%;height:210px;object-fit:cover;display:block;background:#e6eeef}
#hovprev .hovi{padding:8px 11px;display:flex;flex-direction:column;gap:2px}
#hovprev .hovi b{font-size:.92rem}
#hovprev .hovi span{font-size:11px;color:var(--faint)}
.sthumb[data-zoom]{cursor:zoom-in}
.legal-links{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:14px;font-size:12px}
.legal-links button{border:0;background:none;color:var(--acc2);text-decoration:underline;cursor:pointer;font:inherit}
#legal{border:1px solid rgba(20,40,55,.14);border-radius:20px;padding:0;max-width:860px;width:calc(100% - 24px);max-height:90vh;background:#fffdf9;color:var(--ink);box-shadow:0 28px 80px rgba(8,20,28,.38);opacity:1}
#legal[open]{display:block}
#legal::backdrop{background:rgba(8,20,28,.70);backdrop-filter:blur(3px)}
.legal-body{padding:24px 28px 34px;max-height:86vh;overflow-y:auto;overscroll-behavior:contain;background:#fffdf9}
.legal-body h2{font-size:1.5rem;margin:0 0 4px}.legal-body h3{font-size:1.02rem;margin:22px 0 7px;color:var(--acc2)}
.legal-body p,.legal-body li{font-size:13px;line-height:1.75;color:#40515e}.legal-body ul{padding-inline-start:22px}
.legal-body a{color:var(--acc2);font-weight:700}.legal-close{position:sticky;top:0;float:left;z-index:2;background:#fff;border-color:rgba(20,40,55,.18)}
.acceptline{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:12px;color:var(--soft)}
.linkbtn,.legal-top{border:0;background:none;color:var(--acc2);text-decoration:underline;cursor:pointer;font:inherit}.legal-top{font-size:11px;margin-top:8px}
