html,body{margin:0;padding:0}[hidden]:not([hidden=until-found i]){display:none!important}img{max-width:100%}

/* Layout: dark streaming-style catalog — billboard guide on top, category rows that scroll sideways, a preview sheet per guide. Deliberately single dark theme. */
:root{
  color-scheme:dark;
  --bg:#0b100e; --bg2:#111815; --card:#161f1b; --line:#24302b; --ink:#eeeae0; --muted:#9aa7a0; --dim:#6e7b74;
  --brass:#d9ad5b; --brass-ink:#17120a; --ok:#6fcf9a; --warn:#f0925f;
  --c-raha:linear-gradient(135deg,#0f4a3c 0%,#13695a 55%,#1f8a72 100%);
  --c-vir:linear-gradient(135deg,#14284a 0%,#23447a 60%,#3b62a3 100%);
  --c-koti:linear-gradient(135deg,#4a1e10 0%,#8a3d1a 55%,#c0702a 100%);
  --c-taito:linear-gradient(135deg,#3a1636 0%,#6d2a5a 55%,#a4467d 100%);
  --c-tyo:linear-gradient(135deg,#1c2228 0%,#34434f 55%,#567080 100%);
  --display:"Gloock", Georgia, "Times New Roman", serif;
  --body:"Hanken Grotesk", "Segoe UI", system-ui, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}
a{color:inherit}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.wrap{max-width:1320px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.demo{background:#1a1408;color:var(--brass);font-size:.8rem;text-align:center;padding-block:7px;border-bottom:1px solid #2c2210}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.06;letter-spacing:-.01em;margin:0;text-wrap:balance}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.muted{color:var(--muted)}

.ms{font-family:"Material Symbols Rounded";font-weight:300;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-variation-settings:"FILL" 0,"wght" 250,"GRAD" 0,"opsz" 48;overflow:hidden}
.tile .art{position:absolute;right:-6px;bottom:-14px;font-size:6.5rem;color:#fff;opacity:.14}
.tile .glow{display:none}
.cover-art{position:absolute;right:20px;top:8px;font-size:9rem;color:#fff;opacity:.14;pointer-events:none}
.experts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.experts > div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center;min-width:0}
.experts .av{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:1.7rem;color:#fff}
.experts b{display:block}
.experts span{font-size:.88rem;color:var(--muted)}
.reviewed{display:inline-flex;align-items:center;gap:6px;color:var(--ok);font-size:.88rem}
@media (max-width:980px){.experts{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.experts{grid-template-columns:1fr}}
/* header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(11,16,14,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:21;background:var(--bg)}
header.top .wrap{display:flex;align-items:center;gap:24px;padding-block:14px}
.logo{font-family:var(--display);font-size:1.45rem;text-decoration:none;white-space:nowrap}
.logo em{font-style:normal;color:var(--brass)}
nav.nav{display:flex;gap:20px;font-size:.92rem;flex:1;min-width:0}
nav.nav a{text-decoration:none;color:var(--muted);white-space:nowrap}
nav.nav a:hover{color:var(--ink)}
.hsearch{display:flex;align-items:center;gap:8px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:6px 10px;min-width:0;width:280px}
.hsearch input{background:transparent;border:0;color:var(--ink);font:500 .92rem var(--body);width:100%;min-width:0}
.hsearch input:focus{outline:none}
.hsearch svg{flex:none;color:var(--dim)}
.join{background:var(--brass);color:var(--brass-ink);text-decoration:none;font-weight:700;font-size:.9rem;border-radius:10px;padding:9px 16px;white-space:nowrap}

/* billboard */
.bill{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.bill-bg{position:absolute;inset:0;background:var(--c-raha);opacity:.9}
.bill-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 8%,rgba(11,16,14,.82) 42%,rgba(11,16,14,.15) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 40%)}
.bill-art{position:absolute;right:-2%;top:50%;transform:translateY(-50%);font-family:var(--display);font-size:clamp(9rem,26vw,22rem);line-height:.8;color:rgba(255,255,255,.08);user-select:none;pointer-events:none}
.bill .wrap{position:relative;padding-block:72px 64px;display:grid;gap:18px;max-width:1320px}
.bill h1{font-size:clamp(2.6rem,6vw,4.8rem);max-width:13ch}
.bill p{font-size:1.15rem;color:#d5d9d3;max-width:52ch;margin:0}
.bill .meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.9rem;color:#c9cfc8}
.bill .meta b{color:var(--ok);font-weight:700}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:10px;padding:13px 22px;font:700 1rem var(--body);cursor:pointer;text-decoration:none;text-align:center}
.btn.primary{background:var(--ink);color:var(--bg)}
.btn.brass{background:var(--brass);color:var(--brass-ink)}
.btn.ghost{background:rgba(238,234,224,.14);color:var(--ink)}
.btn.ghost:hover{background:rgba(238,234,224,.22)}
.btn.full{width:100%}

/* search band */
.find{padding-block:36px 8px}
.find form{display:flex;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:8px;max-width:820px}
.find input{flex:1;min-width:0;background:transparent;border:0;color:var(--ink);font:500 1.1rem var(--body);padding:10px 12px}
.find input:focus{outline:none}
.find button{background:var(--brass);color:var(--brass-ink);border:0;border-radius:10px;padding:0 22px;font:700 1rem var(--body);cursor:pointer;white-space:nowrap}
.find h2{font-size:1.6rem;margin-bottom:14px}
.results{margin-top:10px;max-width:820px;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.results button{display:flex;justify-content:space-between;gap:12px;align-items:center;width:100%;padding:14px 16px;background:none;border:0;border-bottom:1px solid var(--line);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.results button:last-child{border-bottom:0}
.results button:hover{background:var(--bg2)}
.results .req{color:var(--brass);font-weight:700}
.tag{font-family:var(--mono);font-size:.72rem;color:var(--dim);white-space:nowrap}

/* rows */
.row{padding-block:22px}
.row-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.row-head h2{font-family:var(--body);font-weight:700;font-size:1.25rem;letter-spacing:0}
.row-head .count{font-family:var(--mono);font-size:.75rem;color:var(--dim)}
.rail-wrap{position:relative}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(220px,22vw,290px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.tile{scroll-snap-align:start;position:relative;aspect-ratio:16/10;border-radius:10px;overflow:hidden;cursor:pointer;border:0;padding:0;text-align:left;color:#fff;background:var(--c-raha);transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s}
.tile:hover,.tile:focus-visible{transform:scale(1.04);box-shadow:0 18px 40px -16px rgba(0,0,0,.8);z-index:2}
.tile .cn{position:absolute;top:10px;left:12px;font-family:var(--mono);font-size:.68rem;opacity:.8}
.tile .lk{position:absolute;top:9px;right:10px;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:99px;background:rgba(0,0,0,.4)}
.tile .lk.free{background:var(--ok);color:#06140c}
.tile .big{position:absolute;right:-6px;bottom:-22px;font-family:var(--display);font-size:6.5rem;line-height:1;opacity:.12}
.tile .tt{position:absolute;left:12px;right:12px;bottom:12px}
.tile .tt h3{font-size:1.25rem;line-height:1.1}
.tile .tt span{display:block;font-size:.78rem;opacity:.85;margin-top:4px}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 60%);pointer-events:none}
.tile > *{position:relative;z-index:1}
.tile .cn,.tile .lk,.tile .big,.tile .tt{position:absolute}
.arrow{position:absolute;top:0;bottom:10px;width:44px;border:0;background:linear-gradient(90deg,var(--bg),transparent);color:var(--ink);font-size:1.6rem;cursor:pointer;z-index:3;opacity:0;transition:opacity .2s}
.arrow.r{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
.arrow.l{left:0}
.rail-wrap:hover .arrow{opacity:1}
@media (hover:none){.arrow{display:none}}

/* value strip */
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-block:40px}
.strip > div{background:var(--bg2);padding:22px;min-width:0}
.strip .n{font-family:var(--display);font-size:2.2rem;color:var(--brass);line-height:1}
.strip p{margin:6px 0 0;color:var(--muted);font-size:.92rem}

/* pricing */
section.price{padding-block:56px;border-top:1px solid var(--line)}
.plans{display:grid;grid-template-columns:1fr 1.35fr;gap:18px;margin-top:24px}
.plans > *{min-width:0}
.plan{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:14px}
.plan.main{border:1.5px solid var(--brass);background:linear-gradient(160deg,#1c1a12,#141a17 55%)}
.plan .p{font-family:var(--display);font-size:3.1rem;line-height:1}
.plan .then{font-family:var(--display);font-size:1.5rem}
.plan ul{margin:0;padding-left:0;list-style:none;display:grid;gap:8px}
.plan li{display:flex;gap:10px}
.plan li::before{content:"\2713";flex:none;color:var(--ok);font-weight:800}
.plan:not(.main) li::before{color:var(--dim)}
.keyline{margin:0;font-size:.95rem}
.terms{font-size:.88rem;border-top:1px solid var(--line);padding-top:10px}
.terms summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--brass)}
.terms summary::-webkit-details-marker{display:none}
.terms summary::after{content:"+";font-family:var(--mono)}
.terms[open] summary::after{content:"\2212"}
.terms ul{margin:10px 0 0;padding-left:18px;color:var(--muted)}
.terms li{margin-bottom:4px}

/* preview sheet */
.sheet-bg{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:50;display:flex;justify-content:center;align-items:flex-start;overflow-y:auto;padding:max(28px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}
.sheet{width:100%;max-width:820px;background:var(--bg2);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -30px #000}
.sheet-cover{position:relative;height:240px;background:var(--c-raha);display:flex;align-items:flex-end;padding:24px}
.sheet-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg2),transparent 70%)}
.sheet-cover h2{position:relative;z-index:1;font-size:clamp(1.9rem,4vw,2.8rem);max-width:18ch}
.sheet-cover .big{position:absolute;right:20px;top:4px;font-family:var(--display);font-size:9rem;opacity:.14;line-height:1}
.close{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:1.2rem;cursor:pointer}
.sheet-body{padding:8px 24px 28px;display:grid;grid-template-columns:1.4fr 1fr;gap:28px}
.sheet-body > *{min-width:0}
.facts{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.88rem;color:var(--muted);margin-bottom:12px}
.facts b{color:var(--ink)}
.outline{list-style:none;padding:0;margin:0;counter-reset:o}
.outline li{counter-increment:o;display:grid;grid-template-columns:28px 1fr auto;gap:10px;padding-block:10px;border-bottom:1px solid var(--line);font-size:.95rem}
.outline li::before{content:counter(o);font-family:var(--display);color:var(--brass);font-size:1.2rem;line-height:1.2}
.outline li.locked{color:var(--dim)}
.outline .ic{font-size:.75rem;color:var(--dim)}
.outline .first{grid-column:2 / 4;color:var(--muted);font-size:.9rem;margin-top:2px}

/* guide view */
.guide{display:grid;grid-template-columns:1fr 300px;gap:48px;padding-block:36px 64px}
.guide > *{min-width:0}
.gcover{border-radius:14px;padding:28px;background:var(--c-raha);margin-bottom:24px;position:relative;overflow:hidden}
.gcover h1{font-size:clamp(2rem,4.6vw,3.3rem);position:relative}
.gcover .big{position:absolute;right:10px;bottom:-30px;font-family:var(--display);font-size:10rem;opacity:.12;line-height:1}
.back{display:inline-block;color:var(--muted);text-decoration:none;font-size:.9rem;margin-bottom:16px}
.intro{font-size:1.12rem;color:#d3d7d1;max-width:62ch}
.gfacts{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:.9rem;color:var(--muted);padding-block:14px;border-block:1px solid var(--line);margin:20px 0}
.gfacts b{color:var(--ink)}
ol.gsteps{list-style:none;padding:0;margin:0;counter-reset:g}
ol.gsteps li{counter-increment:g;display:grid;grid-template-columns:50px 1fr;gap:12px;padding-block:18px;border-bottom:1px solid var(--line)}
ol.gsteps li::before{content:counter(g);font-family:var(--display);font-size:1.9rem;color:var(--brass);line-height:1}
ol.gsteps h3{font-family:var(--body);font-weight:700;font-size:1.06rem;margin-bottom:4px}
ol.gsteps p{margin:0;max-width:64ch;color:#d3d7d1}
.done{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:.86rem;color:var(--muted)}
.done input{width:17px;height:17px;accent-color:var(--brass)}
.box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
.box h3{font-family:var(--body);font-weight:700;font-size:.92rem;margin-bottom:8px}
.box ul{margin:0;padding-left:18px;font-size:.94rem;color:#d3d7d1}
.aside{position:sticky;top:90px;align-self:start;display:grid;gap:14px}
.promptbox{background:#1a1610;border:1px solid #3a2f1a;border-radius:14px;padding:18px;margin-top:24px}
.promptbox pre{white-space:pre-wrap;font-family:var(--mono);font-size:.86rem;margin:8px 0 12px;color:#e8dcc2}
.copy{background:var(--brass);color:var(--brass-ink);border:0;border-radius:8px;padding:8px 14px;font-weight:700;cursor:pointer}
.warnbox{border-left:3px solid var(--warn);background:var(--card);padding:14px 16px;border-radius:0 10px 10px 0;margin-top:20px}
.badge{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;border:1px solid currentColor;border-radius:99px;padding:2px 9px}
.badge.ai{color:var(--warn)} .badge.ok{color:var(--ok)}
.gen{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:.85rem;color:var(--muted);margin-top:20px;flex-wrap:wrap}
.dot{width:10px;height:10px;border-radius:50%;background:var(--brass);animation:pulse 1.2s infinite}
@keyframes pulse{50%{opacity:.25}}
.stop{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:6px 12px;cursor:pointer}
footer{border-top:1px solid var(--line);padding-block:36px;font-size:.86rem;color:var(--dim);margin-top:24px}
footer .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}
footer .wrap > *{min-width:0}
.ph{color:var(--brass)}
@media (max-width:980px){
  nav.nav{display:none}
  .hsearch{flex:1;width:auto}
  .guide,.plans,.sheet-body{grid-template-columns:1fr}
  .aside{position:static}
  .strip{grid-template-columns:1fr 1fr}
  footer .wrap{grid-template-columns:1fr}
}
@media (max-width:560px){
  header.top .wrap{flex-wrap:wrap;gap:12px}
  .hsearch{order:3;width:100%;flex:none}
  .find form{flex-direction:column}.find button{padding:12px}
  .bill .wrap{padding-block:48px 40px}
  .strip{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.tile,.arrow{transition:none}.dot{animation:none}}


.langsel{display:flex;align-items:center;gap:6px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:5px 8px;color:var(--muted)}
.langsel select{background:transparent;border:0;color:var(--ink);font:600 .88rem var(--body);cursor:pointer}
.langsel select option{background:var(--bg2);color:var(--ink)}
.langsel .ms{font-size:1.1rem}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.trust > div{min-width:0;padding-top:14px;border-top:1px solid rgba(217,173,91,.45)}
.trust b{display:block;margin:0 0 6px;font-family:var(--display);font-weight:400;font-size:1.25rem;color:var(--ink)}
.trust p{margin:0;color:var(--muted);font-size:.92rem}
.trnote{font-size:.85rem;color:var(--muted);margin:0 0 12px}
@media (max-width:980px){.trust{grid-template-columns:1fr}}
.tile{border:1px solid rgba(217,173,91,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.tile::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.07),transparent 38%),radial-gradient(120% 90% at 100% 0%,rgba(217,173,91,.10),transparent 55%);pointer-events:none;z-index:0}
.tile::after{background:linear-gradient(0deg,rgba(6,9,8,.78),rgba(6,9,8,.15) 62%,transparent)}
.tile:hover,.tile:focus-visible{transform:translateY(-4px);border-color:rgba(217,173,91,.55);box-shadow:0 22px 44px -20px rgba(0,0,0,.9),0 0 0 1px rgba(217,173,91,.25)}
.tile .medal{position:absolute;top:12px;left:12px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(217,173,91,.55);display:grid;place-items:center;background:rgba(10,12,11,.35);backdrop-filter:blur(2px)}
.tile .medal .ms{font-size:1.4rem;color:var(--brass);font-variation-settings:"FILL" 0,"wght" 200,"GRAD" 0,"opsz" 24}
.tile .wm{position:absolute;right:-10px;bottom:22px;font-size:7rem;color:var(--brass);opacity:.07;font-variation-settings:"FILL" 0,"wght" 100,"GRAD" 0,"opsz" 48}
.tile .lk{top:0;right:0;display:block;font-family:var(--body);font-size:.66rem;font-weight:800;letter-spacing:.16em;line-height:1;padding:7px 11px 6px;border:0;border-radius:0 0 0 8px;background:#d9ad5b;color:#17120a;filter:none;text-shadow:none}
.tile .lk.free{background:#4fbf82;color:#06140c}
[dir="rtl"] .tile .lk{right:auto;left:0;border-radius:0 0 8px 0}
.tile .tt h3{font-size:1.18rem;color:#f2eee4}
.tile .tt span{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;opacity:.7;margin-top:6px}
.tile .rule{display:block;width:28px;height:1px;background:var(--brass);opacity:.8;margin-bottom:8px}
.cover-art{color:var(--brass);opacity:.16;font-variation-settings:"FILL" 0,"wght" 100,"GRAD" 0,"opsz" 48}
[dir="rtl"] .tile .medal{left:auto;right:12px}
[dir="rtl"] .tile .wm{right:auto;left:-10px}
[dir="rtl"] body{font-family:"IBM Plex Sans Arabic",var(--body)}
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] .p,[dir="rtl"] .then,[dir="rtl"] .n{font-family:"Noto Kufi Arabic","IBM Plex Sans Arabic",var(--body);letter-spacing:0}
[dir="rtl"] .eyebrow{letter-spacing:0}
[dir="rtl"] .bill-bg::after{background:linear-gradient(270deg,var(--bg) 8%,rgba(11,16,14,.82) 42%,rgba(11,16,14,.15) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 40%)}
[dir="rtl"] .bill-art{right:auto;left:-2%}
[dir="rtl"] .cover-art{right:auto;left:20px}
[dir="rtl"] .sheet-cover .close{right:auto;left:14px}
[dir="rtl"] .warnbox{border-left:0;border-right:3px solid var(--warn);border-radius:10px 0 0 10px}
.outline .blur{filter:blur(5px);user-select:none;-webkit-user-select:none;pointer-events:none;opacity:.75}
.outline li.locked{color:var(--muted)}
.outline .ic .ms{font-size:1rem;color:var(--brass);vertical-align:-3px}
.lockline{display:flex;align-items:center;gap:8px;margin-top:12px;color:var(--brass);font-size:.88rem;font-weight:600}
.lockline .ms{font-size:1.1rem}


/* Topic wheel (3D ring), category page, bottom tab bar, mobile layout */
.wheel{padding-block:34px 6px;overflow:hidden;position:relative}
.whead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.whead h2{font-size:clamp(1.6rem,3.4vw,2.4rem);margin-top:6px}
.whead p{margin:6px 0 0;font-size:.95rem}
.wctrl{display:flex;gap:8px;flex:none}
.wbtn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--bg2);color:var(--ink);cursor:pointer;display:grid;place-items:center;padding:0}
.wbtn:hover{border-color:var(--brass);color:var(--brass)}
.wbtn .ms{font-size:1.6rem}
.stage{--cw:172px;--ch:214px;position:relative;height:calc(var(--ch) + 64px);perspective:1100px;perspective-origin:50% 35%;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;margin-top:6px;outline:none;animation:stageIn .9s cubic-bezier(.2,.8,.2,1) both}
.stage:focus-visible{outline:2px solid var(--brass);outline-offset:-2px;border-radius:14px}
.stage.dragging{cursor:grabbing}
.stage::after{content:"";position:absolute;left:50%;bottom:6px;width:min(720px,90%);height:46px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(217,173,91,.18),transparent);pointer-events:none}
.ring{position:absolute;left:50%;top:26px;width:var(--cw);height:var(--ch);margin-left:calc(var(--cw) / -2);transform-style:preserve-3d;will-change:transform}
.wcard{position:absolute;inset:0;border-radius:16px;border:1px solid rgba(217,173,91,.22);color:#fff;padding:16px 14px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;text-align:left;gap:4px;cursor:pointer;overflow:hidden;box-shadow:0 20px 40px -22px #000;backface-visibility:hidden;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;font:inherit}
.wcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,9,8,.8),rgba(6,9,8,.1) 65%,transparent);pointer-events:none}
.wcard > *{position:relative;z-index:1}
.wcard .wic{position:absolute;overflow:hidden;top:14px;left:14px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(217,173,91,.6);display:grid;place-items:center;font-size:1.5rem;color:var(--brass);background:rgba(10,12,11,.35);font-variation-settings:"FILL" 0,"wght" 250,"GRAD" 0,"opsz" 24}
.wname{font-family:var(--display);font-size:1.25rem;line-height:1.08;text-wrap:balance}
.wcount{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;opacity:.75;text-transform:uppercase}
.wcard.front{border-color:rgba(217,173,91,.85);box-shadow:0 26px 50px -20px #000,0 0 0 1px rgba(217,173,91,.35)}
.wcard.front .wcount::after{content:" ›";color:var(--brass)}
@keyframes stageIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
[dir="rtl"] .wcard{text-align:right;align-items:flex-end}
[dir="rtl"] .wcard .wic{left:auto;right:14px}

.catpage{padding-block:24px 64px}
.catnav{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:16px;scrollbar-width:none}
.catnav::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line);background:var(--bg2);color:var(--muted);border-radius:99px;padding:9px 14px;font:600 .88rem var(--body);white-space:nowrap;text-decoration:none;flex:none}
.chip:hover{color:var(--ink)}
.chip[aria-current="page"]{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.catcover{border-radius:16px;padding:30px 28px;position:relative;overflow:hidden;margin-bottom:16px}
.catcover::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,9,8,.55),transparent 70%);pointer-events:none}
.catcover > *{position:relative;z-index:1}
.catcover h1{font-size:clamp(2rem,4.6vw,3.2rem);margin-top:6px}
.catcover .cbig{position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:8rem;color:var(--brass);opacity:.18;z-index:0}
.catfilter{width:100%;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px 14px;color:var(--ink);font:500 1rem var(--body);margin-bottom:16px}
.catfilter:focus{outline:2px solid var(--brass);outline-offset:1px}
.catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.catgrid .tile{aspect-ratio:16/11}
.catnone{color:var(--muted);padding:20px 0}
.row-head a.all{text-decoration:none;color:var(--brass);font-family:var(--body);font-weight:700;font-size:.85rem;white-space:nowrap}

.memban{position:relative;display:flex;align-items:center;gap:16px;margin:16px 24px 4px;padding:16px 18px;border-radius:16px;background:radial-gradient(120% 140% at 0% 0%,rgba(217,173,91,.18),transparent 55%),linear-gradient(135deg,#2a2210,#161a15 70%);border:1px solid rgba(217,173,91,.55);box-shadow:0 18px 40px -24px #000,inset 0 1px 0 rgba(255,255,255,.06);animation:mbIn .45s cubic-bezier(.2,.8,.2,1) both}
.memban.ing{margin:18px 0 6px}
.memban .mblock{position:relative;flex:none;width:46px;height:46px;border-radius:50%;border:1px solid transparent;background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box;font-size:1.4rem}
.memban .mblock::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font-family:"Material Symbols Rounded";font-feature-settings:"liga";-webkit-font-feature-settings:"liga";line-height:1;overflow:hidden;border-radius:50%;background:linear-gradient(160deg,#fff1cc,#e7bf6d 45%,#b0823a);-webkit-background-clip:text;background-clip:text;color:transparent;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}
.memban .mbtext{flex:1;min-width:0;display:grid;gap:2px}
.memban strong{font-family:var(--display);font-weight:400;font-size:1.3rem;line-height:1.15;color:#f2eee4}
.memban span{color:#d8d4c8;font-size:.95rem}
.memban small{color:var(--muted);font-size:.78rem}
.memban .btn{flex:none;padding:12px 20px}
@keyframes mbIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:700px){.memban{flex-wrap:wrap;margin:12px 16px 4px;padding:14px}.memban.ing{margin:14px 0 4px}.memban .mblock{width:38px;height:38px;font-size:1.15rem}.memban strong{font-size:1.12rem}.memban .btn{width:100%}}
@media (prefers-reduced-motion:reduce){.memban{animation:none}}
.bnav{display:none}
.tagband{border-top:1px solid var(--line);padding-block:40px 34px;background:radial-gradient(60% 120% at 50% 100%,rgba(217,173,91,.08),transparent 70%)}
.tagband .wrap{display:flex;align-items:center;justify-content:center;gap:18px;text-align:center}
.tagband .tagline{margin:0;font-size:clamp(1.25rem,2.6vw,1.9rem)}
.tagband .langline{margin:10px 0 0;color:var(--muted);font-size:.95rem;letter-spacing:.01em}
.tagrule{flex:1;max-width:120px;height:1px;background:linear-gradient(90deg,transparent,rgba(217,173,91,.6))}
.tagrule:last-child{background:linear-gradient(270deg,transparent,rgba(217,173,91,.6))}
@media (max-width:700px){.tagband{padding-block:28px 24px}.tagrule{max-width:36px}}
.eyebrow.tagline{font-family:var(--display);text-transform:none;letter-spacing:0;font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.25;color:var(--brass);background:linear-gradient(90deg,#f6dc9c,#d9ad5b 55%,#b0823a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.strip > a.sjoin{display:block;background:linear-gradient(160deg,#2a2210,#171a14);padding:22px;min-width:0;text-decoration:none;transition:background .2s}
.strip > a.sjoin:hover{background:linear-gradient(160deg,#3a2e14,#1c2018)}
.strip > a.sjoin .n{font-size:1.7rem;letter-spacing:.04em}
.strip > a.sjoin p{color:var(--ink)}
@media (max-width:700px){.strip > a.sjoin{padding:14px}.strip > a.sjoin .n{font-size:1.2rem}}
@media (hover:none){.tile:hover{transform:none}}

@media (max-width:700px){
  body{font-size:15px}
  .wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .demo{font-size:.68rem;padding:4px 12px;line-height:1.35}
  header.top .wrap{flex-wrap:nowrap;gap:8px;padding-block:9px}
  .hsearch{display:none}
  .logo{font-size:1.18rem;flex:1;min-width:0}
  .join{padding:8px 11px;font-size:.8rem;flex:none}
  .join .jl{display:none}
  .join .js{display:inline}
  .logo{overflow:hidden;text-overflow:ellipsis}
  .langsel{padding:5px 6px}
  .langsel select{max-width:4.4em;font-size:.82rem}

  .bill .wrap{padding-block:26px 24px;gap:11px}
  .bill h1{font-size:1.95rem}
  .bill p{font-size:.95rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .bill .meta{font-size:.78rem;gap:10px}
  .bill .actions .btn{flex:1;padding:12px 10px;font-size:.92rem}
  .bill-art{font-size:9rem}

  .wheel{padding-block:22px 0}
  .whead p{font-size:.85rem}
  .whead .wctrl{display:none}
  .whead h2{font-size:1.45rem}
  .stage{--cw:134px;--ch:170px;perspective:760px;height:calc(var(--ch) + 46px)}
  .ring{top:16px}
  .wname{font-size:1.02rem}
  .wcard{padding:12px 11px;border-radius:14px}
  .wcard .wic{top:10px;left:10px;width:38px;height:38px;font-size:1.2rem}

  .find{padding-block:18px 2px}
  .find h2{font-size:1.25rem;margin-bottom:10px}
  .find form{flex-direction:row;padding:6px}
  .find input{font-size:16px;padding:8px 6px 8px 8px}
  .find button{padding:0 12px;font-size:.92rem}

  .row{padding-block:10px}
  .row-head{margin-bottom:8px}
  .row-head h2{font-size:1.04rem}
  .rail{grid-auto-columns:43vw;gap:10px;margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px}
  .tile{aspect-ratio:4/5}
  .tile .medal{width:32px;height:32px;top:9px;left:9px}
  .tile .medal .ms{font-size:1.05rem}
  .tile .lk{font-size:.56rem;padding:6px 7px 5px;letter-spacing:.1em}
  .tile .wm{font-size:4.8rem;bottom:30px}
  .tile .tt{left:10px;right:10px;bottom:10px}
  .tile .tt h3{font-size:.98rem;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  .tile .tt span{font-size:.58rem;margin-top:4px}
  .tile .rule{margin-bottom:6px}

  .strip{grid-template-columns:1fr 1fr!important;margin-block:22px}
  .strip > div{padding:14px}
  .strip .n{font-size:1.45rem}
  .strip p{font-size:.78rem}
  #ihmiset{padding-block:6px 26px!important}
  #ihmiset h2{font-size:1.5rem!important}
  section.price{padding-block:30px}
  .plan{padding:18px}
  .plan .p{font-size:2.3rem}
  .plan .then{font-size:1.25rem}

  .sheet-bg{align-items:flex-end;padding:0}
  .sheet{border-radius:20px 20px 0 0;max-height:94vh;overflow-y:auto;border-bottom:0;animation:sheetUp .28s cubic-bezier(.2,.8,.2,1)}
  .sheet-cover{height:148px;padding:16px}
  .sheet-cover h2{font-size:1.5rem}
  .sheet-cover::before{content:"";position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(255,255,255,.45);z-index:2}
  .sheet-body{padding:4px 16px calc(22px + env(safe-area-inset-bottom,0px));gap:16px}
  .cover-art{font-size:6rem}
  .outline li{padding-block:8px;font-size:.9rem}

  .guide{padding-block:12px 28px;gap:20px}
  .gcover{padding:20px 18px;border-radius:12px;margin-bottom:16px}
  .gcover h1{font-size:1.6rem}
  .intro{font-size:1rem}
  .gfacts{gap:6px 14px;font-size:.8rem;margin:14px 0}
  ol.gsteps li{grid-template-columns:34px 1fr;gap:8px;padding-block:14px}
  ol.gsteps li::before{font-size:1.4rem}
  ol.gsteps h3{font-size:1rem}
  ol.gsteps p{font-size:.95rem}
  .done{padding:6px 0}
  .done input{width:20px;height:20px}
  .promptbox,.box{padding:14px}

  .catpage{padding-block:12px 28px}
  .catcover{padding:20px 18px}
  .catcover h1{font-size:1.75rem}
  .catcover .cbig{font-size:5.5rem}
  .catgrid{grid-template-columns:1fr 1fr;gap:10px}
  .catgrid .tile{aspect-ratio:4/5}
  footer{padding-block:22px}

  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(11,16,14,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .bnav button{background:none;border:0;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:7px 0 6px;font:600 .66rem var(--body);min-height:56px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .bnav .ms{font-size:1.5rem;width:1.5rem;height:1.5rem;display:block}
  .bnav span:not(.ms){white-space:nowrap}
  .bnav button.on{color:var(--brass)}
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom,0px))}
}
@keyframes sheetUp{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.stage,.sheet{animation:none}}


/* Refined icon badges: gilded ring, inner hairline, gradient-gold glyph */
.tile .medal,.wcard .wic{border:1px solid transparent!important;background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box!important;box-shadow:0 8px 18px -8px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.tile .medal::after,.wcard .wic::after{content:"";position:absolute;inset:3px;border-radius:50%;border:1px solid rgba(217,173,91,.22);pointer-events:none}
.tile .medal{overflow:hidden}
.tile .medal .ms{background-image:linear-gradient(160deg,#fff1cc 0%,#e7bf6d 45%,#b0823a 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24!important}
.wcard .wic{color:transparent!important;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24!important}
.wcard .wic{background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box!important}
.wcard .wic::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font-family:"Material Symbols Rounded";font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:inherit;line-height:1;background:linear-gradient(160deg,#fff1cc 0%,#e7bf6d 45%,#b0823a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}
.wcard.front .wic{box-shadow:0 0 0 4px rgba(217,173,91,.12),0 10px 22px -8px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.18)}
.tile:hover .medal,.tile:focus-visible .medal{box-shadow:0 0 0 4px rgba(217,173,91,.12),0 10px 22px -8px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.18)}
.tile .wm,.cover-art,.catcover .cbig{background:linear-gradient(170deg,#f3d58f,#8a6528);-webkit-background-clip:text;background-clip:text;color:transparent!important;opacity:.13!important;font-variation-settings:"FILL" 0,"wght" 100,"GRAD" 0,"opsz" 48!important}
.bnav .ms{font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}
.bnav button.on .ms{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}
.bnav button.on{position:relative}
.bnav button.on::before{content:"";position:absolute;top:0;left:30%;right:30%;height:2px;border-radius:0 0 2px 2px;background:linear-gradient(90deg,#a57a34,#f1d08a,#a57a34)}
.wbtn{background:radial-gradient(circle at 32% 24%,#242219,#111513 62%) padding-box,linear-gradient(145deg,#6b5326,#2a2418 50%,#6b5326) border-box;border:1px solid transparent}
.wbtn .ms{font-variation-settings:"FILL" 0,"wght" 250,"GRAD" 0,"opsz" 24}


/* Collapsible category rows */
.row.cat{padding-block:0}
.row.cat + .row.cat .crow{border-top:0}
.crow{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.chead{list-style:none;display:flex;align-items:center;gap:14px;padding:14px 4px;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:12px;transition:background .2s}
.chead::-webkit-details-marker{display:none}
.chead:hover{background:rgba(238,234,224,.04)}
.chead .cbadge{position:relative;flex:none;width:40px;height:40px;border-radius:50%;border:1px solid transparent;background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box;box-shadow:0 6px 14px -8px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.14);font-size:1.25rem}
.chead .cbadge::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font-family:"Material Symbols Rounded";font-feature-settings:"liga";-webkit-font-feature-settings:"liga";line-height:1;overflow:hidden;border-radius:50%;background:linear-gradient(160deg,#fff1cc 0%,#e7bf6d 45%,#b0823a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}
.chead .ctext{flex:1;min-width:0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.chead h2{font-family:var(--body);font-weight:700;font-size:1.15rem;letter-spacing:0}
.chead .count{font-family:var(--mono);font-size:.72rem;color:var(--dim)}
.chead .all{text-decoration:none;color:var(--brass);font-weight:700;font-size:.85rem;white-space:nowrap;opacity:0;transition:opacity .2s}
.crow[open] .chead .all,.chead:hover .all{opacity:1}
.chead .chev{flex:none;font-size:1.6rem;width:1.6rem;height:1.6rem;overflow:hidden;color:var(--muted);transition:transform .3s cubic-bezier(.2,.8,.2,1),color .2s}
.crow[open] .chev{transform:rotate(180deg);color:var(--brass)}
.crow[open] .cbadge{box-shadow:0 0 0 4px rgba(217,173,91,.12),0 6px 14px -8px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.18)}
.crow-body{padding-bottom:16px}
.crow[open] .crow-body{animation:crowIn .35s cubic-bezier(.2,.8,.2,1)}
@keyframes crowIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (hover:none){.chead .all{opacity:1}}
@media (max-width:700px){
  .chead{gap:11px;padding:11px 2px}
  .chead .cbadge{width:34px;height:34px;font-size:1.05rem}
  .chead h2{font-size:1rem}
  .chead .ctext{gap:2px 10px}
  .chead .count{font-size:.64rem}
  .chead .all{font-size:.78rem}
  .crow-body{padding-bottom:12px}
}
@media (prefers-reduced-motion:reduce){.crow[open] .crow-body{animation:none}}

.join .js{display:none}@media (max-width:700px){.join .jl{display:none}.join .js{display:inline}}
.results .sfix{border-bottom:1px solid var(--line)}.results .sfix strong{color:var(--brass)}.results .scats{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 16px;border-top:1px solid var(--line);font-size:.86rem}.results .scats .chip{text-decoration:none}

.langsel{position:relative;cursor:pointer;gap:7px;padding:6px 10px;min-height:38px}
.langsel select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;max-width:none!important;font-size:16px!important;appearance:none;-webkit-appearance:none}
.langsel .lcode{display:flex;align-items:baseline;gap:6px;color:var(--ink);font:600 .86rem var(--body);white-space:nowrap;line-height:1}
.langsel .lcode b{font-weight:700;letter-spacing:.04em}
.langsel .lname{color:var(--muted);font-weight:500}
.langsel .lchev{font-size:1.05rem;color:var(--muted);margin-inline-start:-2px}
.langsel:focus-within{outline:2px solid var(--brass);outline-offset:2px}
@media (max-width:700px){.langsel{padding:6px 8px;gap:5px}.langsel .lname{display:none}.langsel .ms:first-child{font-size:1.05rem}}


h1,h2,h3,.tagline,.langline,.bill p,.tile .t,.wcard .wt,.memban h3{text-wrap:balance}
p,li{text-wrap:pretty}
.row-head .count{white-space:nowrap;flex:none}
#foot .fy,#foot .ph{white-space:nowrap}
@media (max-width:700px){
  .row-head{align-items:flex-end}
  .chead .ctext{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
  .chead .ctext h2{line-height:1.2}
  #foot .fsep{display:none}
  #foot .ph{display:block;margin-top:2px}
  .join,.btn,button{overflow-wrap:normal}
}


#foot a.flink{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
#foot a.flink:hover,#foot a.flink:focus-visible{color:var(--ink);border-bottom-color:var(--brass)}
.docpage{max-width:760px;padding-block:28px 64px}
.docpage h1{font-family:var(--display);font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.15;margin:4px 0 6px}
.docpage .dmeta{color:var(--dim);font-family:var(--mono);font-size:.78rem;margin:0 0 26px}
.docpage .dsec{margin:0 0 22px}
.docpage .dsec h2{font-family:var(--body);font-weight:700;font-size:1.08rem;margin:0 0 8px;color:var(--ink)}
.docpage .dsec p,.docpage .dsec li{color:var(--muted);line-height:1.65;font-size:.98rem;margin:0 0 10px}
.docpage .dsec ul{padding-inline-start:20px;margin:0 0 10px}
.docpage .dmail{color:var(--brass)}
.docpage mark.dmiss{background:rgba(217,173,91,.16);color:var(--brass);border:1px dashed rgba(217,173,91,.6);border-radius:6px;padding:0 5px;font-size:.92em}
.docpage .dform{border:1px solid var(--line);background:var(--card);border-radius:14px;padding:18px 18px 8px;margin-top:10px}
.docpage .dform p{color:var(--ink);font-size:.94rem}
.docpage .dfrm{display:grid;gap:8px;border:1px solid var(--line);background:var(--card);border-radius:16px;padding:20px;margin:6px 0 26px}
.docpage .dfrm label{font-size:.86rem;color:var(--muted);margin-top:6px}
.docpage .dfrm input,.docpage .dfrm textarea{background:var(--bg2);border:1px solid var(--line);border-radius:10px;color:var(--ink);font:16px var(--body);padding:12px 13px;width:100%;box-sizing:border-box}
.docpage .dfrm input:focus,.docpage .dfrm textarea:focus{outline:2px solid var(--brass);outline-offset:1px}
.docpage .dfrm .btn{margin-top:12px}
.docpage .dmsg{margin:6px 0 0;font-size:.9rem;line-height:1.5}
.docpage .dmsg.ok{color:#8fd19e}.docpage .dmsg.err{color:#f0a08a}
.docpage .dlang{font-family:var(--body);font-size:.85rem;margin:-6px 0 18px}
.terms .tlinks{font-size:.86rem;margin:10px 0 0;color:var(--dim)}.terms .tlinks a{color:inherit;text-decoration:underline;text-decoration-color:rgba(238,234,224,.25);text-underline-offset:2px}
.docpage .dnav{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);padding-top:20px;margin-top:10px}
@media (max-width:700px){.docpage{padding-block:18px 96px}.docpage .dsec p,.docpage .dsec li{font-size:.95rem}.docpage .dnav .chip{white-space:normal}}


.login{display:inline-flex;align-items:center;gap:7px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.9rem;border:1px solid var(--line);border-radius:10px;padding:8px 12px;white-space:nowrap;background:transparent}
.login .ms{font-size:1.15rem;color:var(--brass)}
#foot a.flogin{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.9rem;border:1px solid rgba(217,173,91,.45);border-radius:10px;padding:9px 14px}
#foot a.flogin .ms{color:var(--brass);font-size:1.15rem}
#foot a.flogin:hover,#foot a.flogin:focus-visible{background:rgba(217,173,91,.08);border-color:var(--brass)}
.login:hover,.login:focus-visible{border-color:rgba(217,173,91,.55)}
@media (max-width:700px){.login{padding:0;width:38px;height:38px;justify-content:center;flex:none}.login .lgt{display:none}.login .ms{font-size:1.3rem}}
.mbact{display:flex;flex-direction:column;align-items:stretch;gap:8px;flex:none}
.mblogin{color:var(--brass);font-size:.84rem;text-align:center;text-decoration:none}
.mblogin:hover{text-decoration:underline}
.loginpage{max-width:520px;padding-block:28px 96px}
.lgcard{border:1px solid var(--line);background:var(--card);border-radius:18px;padding:28px 24px;text-align:center}
.lgcard .lgicon{position:relative;display:inline-block;width:56px;height:56px;border-radius:50%;border:1px solid transparent;background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box;font-size:1.8rem;margin-bottom:10px}
.lgcard .lgicon::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font-family:"Material Symbols Rounded";font-feature-settings:"liga";-webkit-font-feature-settings:"liga";line-height:1;overflow:hidden;border-radius:50%;background:linear-gradient(160deg,#fff1cc 0%,#e7bf6d 45%,#b0823a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}
.lgcard h1{font-family:var(--display);font-size:1.9rem;margin:0 0 8px}
.lgcard p.muted{margin:0 0 18px;line-height:1.55}
.lgcard form{display:grid;gap:8px;text-align:start}
.lgcard label{font-size:.86rem;color:var(--muted)}
.lgcard input{background:var(--bg2);border:1px solid var(--line);border-radius:10px;color:var(--ink);font:16px var(--body);padding:13px;width:100%;box-sizing:border-box}
.lgcard input:focus{outline:2px solid var(--brass);outline-offset:1px}
.lgcard input.lgcode{font-family:var(--mono);font-size:1.5rem;letter-spacing:.5em;text-align:center}
.lgcard .btn{margin-top:8px}
.lgcard .dmsg{margin:6px 0 0;font-size:.9rem;line-height:1.5}.lgcard .dmsg.ok{color:#8fd19e}.lgcard .dmsg.err{color:#f0a08a}
.lgcard .lgno{margin:18px 0 0;font-size:.9rem;color:var(--muted)}
.lgcard .lgjoin{color:var(--brass);font-weight:700;text-decoration:none}
.lgcard .lglink{background:none;border:0;color:var(--brass);font:600 .88rem var(--body);cursor:pointer;margin-top:10px}
.lghow{margin-top:26px}
.lghow h2{font-family:var(--body);font-size:1.02rem;font-weight:700;margin:0 0 8px}
.lghow ol{margin:0;padding-inline-start:20px;color:var(--muted);line-height:1.6}
.lghow li{margin-bottom:6px}
@media (max-width:700px){.memban .mbact{width:100%}}


.acctpage{max-width:640px;padding-block:28px 96px}
.acctpage h1{font-family:var(--display);font-size:2rem;margin:4px 0 6px}
.acctpage .acdemo{color:var(--dim);font-size:.85rem;margin:0 0 18px}
.accard{border:1px solid var(--line);background:var(--card);border-radius:16px;padding:18px 20px;margin-bottom:14px}
.accard h2{font-family:var(--body);font-weight:700;font-size:1.05rem;margin:0 0 8px}
.accard p.muted{margin:0 0 12px;line-height:1.55}
.accard dl{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin:0}
.accard dt{color:var(--muted);font-size:.9rem}.accard dd{margin:0;text-align:end;font-weight:600;font-size:.92rem;white-space:nowrap}
.acctpage .lglink{background:none;border:0;color:var(--brass);font:600 .9rem var(--body);cursor:pointer;padding:8px 0}


.results button.rel{padding-block:10px;background:rgba(217,173,91,.03)}
.results button.rel strong{font-weight:600}
.find .qwrap{position:relative;flex:1;min-width:0;display:flex}
.find .qwrap input{flex:1;min-width:0;width:100%}
.find .qph{position:absolute;inset:0;display:flex;align-items:center;gap:.4em;pointer-events:none;overflow:hidden;white-space:nowrap;color:var(--dim);transition:opacity .2s}
.find .qph.off{opacity:0}
.find .qpre{flex:none;color:var(--muted);opacity:.7}
.find .qtxt{display:block;overflow:hidden;text-overflow:ellipsis;min-width:0;color:var(--muted);will-change:opacity,transform,filter}
.find .qtxt.out{animation:qOut .38s cubic-bezier(.55,0,.9,.4) forwards}
.find .qtxt.in{animation:qIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes qOut{to{opacity:0;transform:translateX(36px);filter:blur(2px)}}
@keyframes qIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes qOutL{to{opacity:0;transform:translateX(-36px);filter:blur(2px)}}
@keyframes qInL{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
[dir=rtl] .find .qtxt.out{animation-name:qOutL}[dir=rtl] .find .qtxt.in{animation-name:qInL}
@media (prefers-reduced-motion:reduce){.find .qtxt.out{animation:qOutR .26s forwards}.find .qtxt.in{animation:qInR .4s}@keyframes qOutR{to{opacity:0}}@keyframes qInR{from{opacity:0}}}

@media (max-width:380px){.langsel .lchev{display:none}}.ring{will-change:transform}.wcard{-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:opacity}.stage{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}

.gen.thinking .dot{animation:thinkPulse 1s ease-in-out infinite}
@keyframes thinkPulse{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1.15);opacity:1}}
.hups{margin-top:22px;border:1px solid rgba(217,173,91,.45);background:linear-gradient(160deg,rgba(217,173,91,.10),rgba(217,173,91,.02) 60%),var(--card);border-radius:18px;padding:26px 22px;text-align:center;animation:hupsIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes hupsIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.hups h2{font-family:var(--display);font-size:2rem;letter-spacing:.04em;color:var(--brass);margin:6px 0 6px}
.hups p{color:var(--ink);font-size:1.02rem;line-height:1.55;margin:0 auto 18px;max-width:440px}
.hups .hupsbtn{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.hups .hupsic{position:relative;display:inline-block;width:52px;height:52px;border-radius:50%;border:1px solid transparent;background:radial-gradient(circle at 32% 24%,#2f2b20 0%,#141713 58%,#0b0e0c 100%) padding-box,linear-gradient(145deg,#f6dc9c 0%,#a57a34 38%,#f1d08a 62%,#6f5020 100%) border-box;font-size:1.6rem}
.hups .hupsic::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font-family:"Material Symbols Rounded";font-feature-settings:"liga";-webkit-font-feature-settings:"liga";line-height:1;overflow:hidden;border-radius:50%;background:linear-gradient(160deg,#fff1cc 0%,#e7bf6d 45%,#b0823a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:700px){.hups .hupsbtn .btn{flex:1 1 140px}}
@media (prefers-reduced-motion:reduce){.hups,.gen.thinking .dot{animation:none}}

.gsteps li.locked h3{filter:blur(4px);user-select:none;-webkit-user-select:none;color:var(--muted)}
.gsteps li.locked .lockp{display:flex;align-items:center;gap:6px;color:var(--brass);font-size:.86rem;margin:2px 0 0}
.gsteps li.locked .lockp .ms{font-size:1rem}
body.busy{cursor:progress}
label.consent{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;line-height:1.45;color:var(--muted);margin:12px 0;cursor:pointer;text-align:start}
label.consent a{color:var(--brass)}label.consent span{min-width:0;overflow-wrap:anywhere}label.consent .cbx{width:20px;height:20px;flex:none;margin:1px 0 0;accent-color:#d9ad5b}
ul.myg{margin:6px 0 0;padding-inline-start:18px}ul.myg li{margin:6px 0}ul.myg a{color:var(--brass)}
label.consent.need{color:#f0c27a;outline:1px solid #d9ad5b;outline-offset:6px;border-radius:6px}
@media print{header.top,.bnav,.demo,footer,.memban,.aside .btn,.promptbox .copy,.done,#sheetBg{display:none!important}body{background:#fff;color:#000}.gcover{background:none!important;color:#000;padding:0}.gcover .cover-art{display:none}ol.gsteps p,.intro{color:#000}.guide{display:block}}

/* mobile header: full logo always visible */
@media (max-width:700px){
 header.top .wrap{gap:6px}
 header.top .logout{display:none!important}
 header.top .logo{flex:1 1 auto;min-width:0;overflow:visible;text-overflow:clip;white-space:nowrap;font-size:clamp(1.02rem,4.9vw,1.25rem)}
 header.top .langsel{padding:6px 7px;gap:4px}
 header.top .langsel>.ms:first-child{display:none}
}
@media (max-width:360px){header.top .logo{font-size:.98rem}header.top .langsel .lchev{display:none}}

.tile,.wcard{background:linear-gradient(158deg,#2e3130 0%,#202322 42%,#141615 100%)!important;border:1px solid rgba(255,255,255,.08)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 14px 30px -18px rgba(0,0,0,.9)}
.tile:nth-child(3n+2),.wcard:nth-child(3n+2){background:linear-gradient(158deg,#2a2c2c 0%,#1d1f1f 45%,#121413 100%)!important}
.tile:nth-child(3n),.wcard:nth-child(3n){background:linear-gradient(158deg,#313332 0%,#232525 40%,#161817 100%)!important}
.tile::before,.wcard::before{content:"";position:absolute;inset:0;background:radial-gradient(110% 80% at 100% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(160deg,rgba(255,255,255,.05),transparent 40%);pointer-events:none;z-index:0}
.tile::after{background:linear-gradient(0deg,rgba(8,9,9,.82),rgba(8,9,9,.2) 62%,transparent)!important}
.wcard::after{background:linear-gradient(0deg,rgba(8,9,9,.85),rgba(8,9,9,.15) 65%,transparent)!important}
.tile .wm{background:linear-gradient(170deg,#d6d9d7,#6c716e)!important;-webkit-background-clip:text!important;background-clip:text!important;opacity:.09!important}
.tile .rule{background:linear-gradient(90deg,#a57a34,#f1d08a)}
.tile .tt h3,.wname{color:#efede8}
.tile .tt span,.wcount{color:#a9aeab}
.tile:hover,.tile:focus-visible{border-color:rgba(217,173,91,.55)!important;box-shadow:0 22px 44px -20px rgba(0,0,0,.95),0 0 0 1px rgba(217,173,91,.25)!important}
.wcard.front{border-color:rgba(217,173,91,.75)!important;box-shadow:0 26px 50px -20px #000,0 0 0 1px rgba(217,173,91,.3)!important}
/* compact "Viikon nosto" so the topic wheel is visible on the first screen */
.bill .wrap{padding-block:40px 36px;gap:14px}
.bill h1{font-size:clamp(2.3rem,4vw,3.4rem);max-width:34ch;line-height:1.04}
.bill p{font-size:1.06rem;max-width:62ch}
.bill-art{font-size:clamp(8rem,19vw,16rem)}
.wheel{padding-block:24px 4px}
/* warm golden light behind the wheel cards */
.stage::before{content:"";position:absolute;left:50%;top:-64px;width:min(1500px,150%);height:calc(100% + 84px);transform:translateX(-50%);background:radial-gradient(52% 50% at 50% 56%,rgba(222,178,96,.46),rgba(217,173,91,.22) 36%,rgba(217,173,91,.08) 60%,transparent 80%);pointer-events:none;animation:wglow 7s ease-in-out infinite}
.stage::after{background:radial-gradient(closest-side,rgba(217,173,91,.24),transparent)!important}
@keyframes wglow{0%,100%{opacity:.78}50%{opacity:1}}
/* header search: wider, with the same rotating example topics */
header.top .ms{display:inline-block;width:1em;max-width:1em;overflow:hidden;white-space:nowrap;flex:none}
nav.nav{flex:none}header.top .wrap{gap:20px}.langsel,.login,.join{flex:none}
.hsearch{flex:1 1 auto;width:auto;min-width:170px;max-width:440px}
@media (max-width:1180px){nav.nav{display:none}}
@media (max-width:1320px){.langsel .lname{display:none}}
@media (min-width:701px) and (max-width:900px){.login .lgt{display:none}.login{padding:0;width:38px;height:38px;justify-content:center}.join .jl{display:none}.join .js{display:inline}.hsearch{min-width:120px}header.top .wrap{gap:12px}}
.hsearch .qwrap,.find .qwrap{position:relative;flex:1;min-width:0;display:flex}
.hsearch .qwrap input{flex:1;min-width:0;width:100%}
.hsearch .qph{position:absolute;inset:0;display:flex;align-items:center;gap:.4em;pointer-events:none;overflow:hidden;white-space:nowrap;color:var(--dim);transition:opacity .2s}
.hsearch .qph.off{opacity:0}
.hsearch .qtxt{display:block;overflow:hidden;text-overflow:ellipsis;min-width:0;color:var(--muted);will-change:opacity,transform,filter}
.hsearch .qtxt.out{animation:qOut .38s cubic-bezier(.55,0,.9,.4) forwards}
.hsearch .qtxt.in{animation:qIn .5s cubic-bezier(.2,.8,.2,1)}
[dir=rtl] .hsearch .qtxt.out{animation-name:qOutL}[dir=rtl] .hsearch .qtxt.in{animation-name:qInL}
@media (max-width:980px){.hsearch{max-width:none}}
@media (min-width:701px) and (max-height:800px){.bill .wrap{padding-block:26px 24px;gap:10px}.bill h1{font-size:clamp(2rem,3.4vw,2.9rem)}.bill p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:72ch}.wheel{padding-block:14px 0}.stage{--cw:158px;--ch:196px}}
@media (max-width:700px){
  .hsearch{display:none}
  .bill .wrap{padding-block:16px 16px;gap:8px}
  .bill h1{font-size:1.6rem;max-width:none;line-height:1.08}
  .bill p{font-size:.9rem;line-height:1.42;-webkit-line-clamp:3}
  .bill .meta{font-size:.76rem}
  .bill-art{font-size:7rem}
  .wheel{padding-block:16px 0}
  .stage::before{width:170%;top:-34px;height:calc(100% + 46px)}
}
/* category search: custom-guide order card and matches from other categories */
.cxbox{margin:0 0 16px}.cxbox.end{margin:22px 0 0;display:grid;gap:14px}.cxbox.end .cxother{margin-top:0}
.cxorder{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:16px;border:1px solid rgba(217,173,91,.45);background:radial-gradient(120% 140% at 0% 0%,rgba(217,173,91,.14),transparent 55%),linear-gradient(135deg,#221d12,#151917 70%)}
.cxorder.big{border-color:rgba(217,173,91,.8);padding:20px 22px;box-shadow:0 18px 40px -24px #000}
.cxorder .cxic{flex:none;width:44px!important;height:44px;border-radius:50%;display:grid!important;place-items:center;font-size:1.5rem;color:var(--brass);border:1px solid rgba(217,173,91,.55);background:rgba(10,12,11,.4)}
.cxorder .cxtxt{flex:1;min-width:0}
.cxorder .cxtxt strong{display:block;font-size:1.02rem;color:var(--ink)}
.cxorder.big .cxtxt strong{font-family:var(--display);font-weight:400;font-size:1.35rem;line-height:1.2}
.cxorder .cxtxt p{margin:4px 0 0;color:var(--muted);font-size:.9rem;line-height:1.45}
.cxorder .btn{flex:none;max-width:42%;white-space:normal;line-height:1.25;overflow-wrap:anywhere}
.cxorder.hot{position:relative;border-color:rgba(217,173,91,.85);box-shadow:0 0 0 1px rgba(217,173,91,.25),0 14px 40px -18px rgba(217,173,91,.45);animation:cxglow 2.8s ease-in-out infinite}
@keyframes cxglow{0%,100%{box-shadow:0 0 0 1px rgba(217,173,91,.25),0 14px 40px -18px rgba(217,173,91,.35)}50%{box-shadow:0 0 0 2px rgba(217,173,91,.55),0 16px 48px -14px rgba(217,173,91,.6)}}
.cxorder .cxbadge{display:inline-block;margin-bottom:6px;padding:3px 10px;border-radius:999px;background:rgba(217,173,91,.16);border:1px solid rgba(217,173,91,.5);color:var(--brass);font:600 .72rem var(--body);letter-spacing:.08em;text-transform:uppercase}
.cxorder .btn.cxgo{gap:8px;padding:14px 22px;font-size:1.02rem;box-shadow:0 8px 24px -10px rgba(217,173,91,.8);transition:transform .15s,box-shadow .15s}
.cxorder .btn.cxgo:hover{transform:translateY(-1px);box-shadow:0 12px 30px -10px rgba(217,173,91,.95)}
.cxorder .btn.cxgo .ms{font-size:1.2rem;transition:transform .15s}.cxorder .btn.cxgo:hover .ms{transform:translateX(3px)}
.results .cxorder{margin:12px;border-radius:14px}
.results .cxorder .btn.cxgo{width:auto;display:inline-flex;justify-content:center;border:0;background:var(--brass);color:var(--brass-ink);padding:14px 22px;font-weight:700;text-align:center}
.results .cxorder .btn.cxgo:hover{background:var(--brass)}
@media (max-width:700px){.results .cxorder{margin:10px}.results .cxorder .btn.cxgo{width:100%}}
@media (prefers-reduced-motion:reduce){.cxorder.hot{animation:none}}
.cxother{margin-top:14px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.cxother .eyebrow{padding:12px 16px 6px}
.cxrow{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:11px 16px;background:transparent;border:0;border-top:1px solid var(--line);color:var(--ink);font:inherit;text-align:start;cursor:pointer}
.cxrow:hover{background:rgba(217,173,91,.06)}
.cxrow > span:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.cxrow .muted{font-size:.84rem}
.cxrow .tag{flex:none;max-width:42%;text-align:end}
@media (max-width:700px){.cxrow{flex-direction:column;align-items:flex-start;gap:4px}.cxrow .tag{max-width:none;text-align:start;white-space:normal}.cxorder{flex-wrap:wrap;gap:12px;padding:14px}.cxorder.big{padding:16px}.cxorder .btn{max-width:none;width:100%}.cxorder .cxic{width:38px!important;height:38px;font-size:1.25rem}.cxorder.big .cxtxt strong{font-size:1.15rem}}
button.login,button.flogin{font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;color:var(--ink)}
button.flogin{background:transparent}
@media (max-width:1320px){header .logout .lgt{display:none}header .logout{padding:0;width:38px;height:38px;justify-content:center}}
/* bottom tab bar */
.bnav{background:linear-gradient(180deg,rgba(16,20,18,.82),rgba(8,10,9,.97))!important;backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);border-top:0!important;box-shadow:0 -10px 30px -18px #000}
.bnav::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(217,173,91,.45) 30%,rgba(241,208,138,.6) 50%,rgba(217,173,91,.45) 70%,transparent)}
.bnav button{gap:4px!important;padding:8px 0 7px!important;color:#9aa09c!important;font:600 .64rem var(--body)!important;letter-spacing:.02em;transition:color .2s}
.bnav button.on::before{display:none!important}
.bnav .bi{position:relative;display:grid;place-items:center;width:46px;height:30px;border-radius:15px;transition:background .25s,box-shadow .25s,transform .15s}
.bnav .bi .ms{font-size:1.38rem!important;width:1em!important;height:1em!important;overflow:hidden;line-height:1;font-variation-settings:"FILL" 0,"wght" 250,"GRAD" 0,"opsz" 24!important;transition:font-variation-settings .25s}
.bnav button:active .bi{transform:scale(.92)}
.bnav button.on{color:#f1d08a!important}
.bnav button.on .bi{background:linear-gradient(180deg,rgba(217,173,91,.24),rgba(217,173,91,.1));box-shadow:inset 0 0 0 1px rgba(217,173,91,.45),0 6px 18px -8px rgba(217,173,91,.55)}
.bnav button.on .bi .ms{color:#f6dc9c;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24!important}
@media (prefers-reduced-motion:reduce){.bnav .bi,.bnav button{transition:none}}
/* pricing: on phones the member plan comes first and fits on one screen after tapping "Liity" */
.price{scroll-margin-top:72px}
@media (max-width:700px){
  .price{padding-block:14px 26px;scroll-margin-top:58px}
  .price > .wrap > .eyebrow{font-size:.66rem}
  .price > .wrap > h2{font-size:1.32rem!important;margin-top:4px!important;line-height:1.15}
  .plans{margin-top:12px;gap:12px}
  .plan.main{order:-1}
  .plan{padding:15px 16px;gap:9px}
  .plan .p{font-size:2rem}
  .plan .then{font-size:1.08rem}
  .plan ul{gap:4px;font-size:.9rem}
  .plan .keyline{font-size:.84rem}
  .plan label.consent{font-size:.76rem;line-height:1.35;margin:2px 0;gap:8px}
  .plan label.consent .cbx{width:18px;height:18px}
  .plan .btn.brass{padding:11px 12px;font-size:.9rem;line-height:1.25}
  .plan .terms{padding-top:6px;font-size:.84rem}
}
@media (max-width:700px){
  .price{padding-block:8px 22px}
  .price > .wrap > h2{font-size:1.12rem!important;margin-top:2px!important;line-height:1.18}
  .plans{margin-top:8px;gap:8px}
  .plan.main{padding:11px 14px;gap:6px}
  .plan.main .p{font-size:1.7rem}
  .plan.main .then{font-size:.98rem;margin-top:-2px}
  .plan.main ul{font-size:.85rem;gap:2px;line-height:1.35}
  .plan.main .keyline{font-size:.79rem}
  .plan.main label.consent{font-size:.7rem;line-height:1.3;margin:0}
  .plan.main .btn.brass{padding:8px 10px;font-size:.85rem;line-height:1.22}
  .plan.main .terms{padding-top:4px;font-size:.79rem}
  /* free plan as a compact strip */
  .plan:not(.main){display:grid;grid-template-columns:1fr auto;column-gap:12px;row-gap:5px;align-items:center;padding:9px 14px}
  .plan:not(.main) > .eyebrow{grid-column:1;grid-row:1}
  .plan:not(.main) > .p{grid-column:2;grid-row:1;font-size:1.35rem}
  .plan:not(.main) > ul{grid-column:1 / -1;display:block;font-size:.78rem;line-height:1.38}
  .plan:not(.main) > ul li{display:inline}
  .plan:not(.main) > ul li::before{margin-inline-end:4px;font-size:.9em}
  .plan:not(.main) > ul li:not(:last-child)::after{content:" · ";color:var(--dim)}
  .plan:not(.main) > .btn{grid-column:1 / -1;padding:7px 10px;font-size:.85rem}
}
}
@media (max-width:700px) and (max-height:700px){.bill .wrap{padding-block:12px 14px;gap:7px}.bill h1{font-size:1.42rem}.bill p{-webkit-line-clamp:2}.bill .actions .btn{padding:10px}.wheel{padding-block:12px 0}}
@media (prefers-reduced-motion:reduce){.stage::before{animation:none;opacity:.9}.hsearch .qtxt.out{animation:qOutR .26s forwards}.hsearch .qtxt.in{animation:qInR .4s}}