.page{max-width:900px; margin:0 auto; padding:24px 16px 64px}

.brand{margin:0 0 10px; font-weight:700; letter-spacing:.06em; color:var(--dim);
  font-size:.9rem}
.hero{background:var(--panel); border:1px solid var(--line); border-radius:16px;
  padding:28px 24px; margin:0 0 16px}
.hero h1{font-size:1.6rem; margin:0 0 8px; color:var(--ink)}
.hero p.lead{font-size:1.05rem; margin:0 0 16px}
.entry-board{max-width:680px;margin:0 auto}
.product-strip{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:14px 16px;
  border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 10px 30px rgba(30,64,175,.08)}
.product-mark{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:13px;
  color:#fff;background:linear-gradient(145deg,#32c5ff,#155eef 72%);font-weight:900;letter-spacing:.03em;
  box-shadow:0 9px 18px rgba(21,94,239,.28)}
.product-copy{min-width:0;flex:1}.product-copy strong{display:block;font-size:1.08rem;color:var(--ink)}
.product-copy span{display:block;margin-top:2px;color:var(--dim);font-size:.84rem}
.product-chips{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.product-chip{display:inline-flex;align-items:center;min-height:34px;padding:0 11px;border:1px solid var(--line);
  border-radius:10px;color:var(--dim);font-size:.78rem;font-weight:700;background:var(--panel)}
.trial-banner{--glow:21,94,239;margin:0 0 14px;padding:20px 18px;border:1px solid rgba(56,189,248,.9);
  border-radius:17px;color:#fff;background:linear-gradient(160deg,#398cff 0%,#1764e8 55%,#0b45b5 100%);
  box-shadow:inset 0 -2px 0 rgba(4,35,105,.45),0 12px 26px rgba(21,94,239,.22)}
.trial-banner .brand{color:#dbeafe}.trial-banner h1{margin:0 0 7px;color:#fff;font-size:1.35rem}
.trial-banner p.lead{margin:0;color:#eaf2ff;font-size:.92rem}.trial-banner .cta{margin-top:16px}
.trial-banner .cta a{background:#fff;color:#1049ba}.trial-banner .cta a.ghost{border-color:rgba(255,255,255,.65);
  background:rgba(255,255,255,.12);color:#fff}
.cta{display:flex; gap:10px; flex-wrap:wrap; margin:18px 0 0}

.cta a,.cta button{display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--tap); padding:0 18px; text-decoration:none; font-weight:700; border:0;
  background:var(--accent); color:var(--accent-ink); cursor:pointer;
  border-radius:var(--r-pill)}
.cta a.ghost,.cta button.ghost{background:var(--panel); color:var(--ink);
  border:1px solid var(--line)}
.grid2{display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:720px){ .grid2{grid-template-columns:minmax(0,1fr)} }
.box{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px}
.box h3{margin:0 0 6px; font-size:1rem}
.box p,.box li{color:var(--dim); font-size:.92rem}
.box ul{margin:6px 0 0; padding-inline-start:18px}
.setup-list{list-style:none;margin:14px 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.setup-step{display:flex;min-height:142px;flex-direction:column;align-items:stretch;gap:8px;
  background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:16px;
  box-shadow:0 9px 25px rgba(30,64,175,.06)}
.setup-step h2{font-size:1rem;margin:0 0 5px}.setup-no{display:block;width:auto;height:auto;
  color:#9aadd1;background:transparent;font-size:.72rem;font-weight:700}
.setup-state{font-size:.88rem;color:var(--dim)}.setup-state.done{color:var(--good)}
.setup-step>a{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:38px;
  margin-top:auto;padding:0 13px;border:1px solid var(--line);border-radius:999px;text-decoration:none;
  color:var(--ink);font-size:.86rem;font-weight:700}
@media(max-width:640px){.entry-board{max-width:100%}.product-strip{align-items:flex-start}.product-chips{display:none}
  .setup-list{grid-template-columns:1fr}.setup-step{min-height:126px}}
.setup-step.done{opacity:.72}.setup-step.done>a{background:transparent;color:var(--dim)}
.setup-measure{margin:22px 0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.setup-measure h2{margin:0 0 8px;font-size:1.05rem}.setup-measure ol{margin:12px 0 0;padding-inline-start:24px}
.setup-measure li{padding:5px 0}.setup-measure output{font-weight:700;color:var(--accent)}
.foot{display:flex; gap:14px; flex-wrap:wrap; margin:22px 0 0; color:var(--dim);
  font-size:.88rem}
.foot a{color:var(--dim)}

.langs{display:flex; gap:10px; flex-wrap:wrap; flex-basis:100%}
.engines .engrow{margin:14px 0}
.engines .engrow b{display:block; margin-bottom:6px}
.engpick{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px}
.engchip{display:flex; align-items:flex-start; gap:8px; min-height:44px; padding:12px 14px;
  border:1px solid var(--line); border-radius:14px; cursor:pointer; background:var(--panel)}
.engchip input{margin:3px 0 0}
.engbody{display:flex; flex-direction:column; gap:6px; min-width:0}
.engname{font-weight:600}
.engname em{font-style:normal; color:var(--dim); font-weight:400; font-size:.85em}
.engtags{display:flex; flex-wrap:wrap; gap:4px}
.tg{font-size:.7rem; padding:2px 8px; border-radius:var(--r-pill); background:var(--bg);
  color:var(--dim); border:1px solid var(--line)}
.engchip.on{border-color:var(--accent); color:var(--accent)}
.engchip.on .tg{border-color:var(--accent)}
.engchip.off{opacity:.55; cursor:not-allowed}

.langs a[aria-current]{color:var(--ink); font-weight:700; text-decoration:none}
.undecided{background:var(--act-bg); color:var(--act); border-radius:10px; padding:12px 14px;
  font-weight:600}

.optional{background:var(--panel); color:var(--dim); border:1px solid var(--line);
  border-radius:10px; padding:12px 14px; font-weight:600}

.note{background:var(--panel); color:var(--dim); border:1px solid var(--line);
  border-radius:10px; padding:12px 14px}
.form{display:grid; gap:12px; max-width:420px}
.form label{font-size:.9rem; color:var(--dim)}
.form input{width:100%}
.form .row{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.form button{min-height:var(--tap); padding:0 18px; border:0;
  background:var(--accent); color:var(--accent-ink); font-weight:700; cursor:pointer;
  border-radius:var(--r-pill)}
.form a{min-height:var(--tap); display:inline-flex; align-items:center; padding:0 14px;
  border-radius:10px; border:1px solid var(--line); text-decoration:none; color:inherit}
.doc{background:var(--panel); border:1px solid var(--line); border-radius:14px;
  padding:20px 22px; overflow-wrap:anywhere}
.doc h1{font-size:1.35rem} .doc h2{font-size:1rem; text-transform:none; letter-spacing:0;
  color:var(--ink); margin:18px 0 6px}
.doc table{border-collapse:collapse; width:100%; margin:8px 0; font-size:.9rem}
.doc th,.doc td{border:1px solid var(--line); padding:6px 8px; text-align:start}
.doc blockquote{border-inline-start:3px solid var(--act); background:var(--act-bg); color:var(--act);
  margin:10px 0; padding:8px 12px; border-radius:0 8px 8px 0}
.doc code{background:var(--bg); padding:1px 4px; border-radius:4px}

.rows2{display:grid; grid-template-columns:auto 1fr; gap:6px 14px; margin:0}
.rows2 dt{color:var(--dim); font-size:.9rem}
.rows2 dd{margin:0; overflow-wrap:anywhere}
.rows3{border-collapse:collapse; width:100%; font-size:.92rem; margin:0 0 12px}
.rows3 th,.rows3 td{border-bottom:1px solid var(--line); padding:8px 6px; text-align:start}
.rows3 th{color:var(--dim); font-weight:600; font-size:.85rem}
.inline{display:flex; gap:6px; flex-wrap:wrap; margin:0}
.inline button,.pn button{min-height:36px; padding:0 12px; border-radius:8px; border:0;
  background:var(--accent); color:var(--accent-ink); font-weight:600; cursor:pointer}
.inline button.ghost,.pn button.ghost{background:var(--panel); color:var(--ink);
  border:1px solid var(--line)}

.form button.danger{background:var(--bad); color:#fff}
.wk{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.wk .name{font-weight:700}
.err{background:var(--bad-bg); color:var(--bad); border-radius:10px; padding:10px 12px}
.okmsg{background:var(--done-bg); color:var(--done); border-radius:10px; padding:10px 12px}

.guide-page{max-width:760px}
.guide-page h1{font-size:1.4rem; margin:0 0 6px}
.guide-page .lead{color:var(--dim); margin:0 0 26px}
.guide-page section{margin:0 0 30px}
.guide-page h2{font-size:1rem; margin:0 0 12px}
.guide-page ol{margin:0; padding:0; list-style:none; counter-reset:s; display:grid; gap:16px}
.guide-page ol li{counter-increment:s; position:relative; padding-inline-start:32px}
.guide-page ol li::before{content:counter(s); position:absolute; inset-inline-start:0; top:0;
  inline-size:23px; block-size:23px; border-radius:999px; background:var(--accent);
  color:var(--accent-ink); font-size:.78rem; font-weight:700;
  display:grid; place-items:center}
.guide-page .why{margin:0 0 7px}
.guide-page .cmd{margin:0; background:var(--mute-bg); color:var(--ink);
  border-radius:10px; padding:11px 13px; overflow-x:auto}
.guide-page .cmd code{font-family:var(--mono,ui-monospace,Consolas,monospace); font-size:.86rem}
.guide-page .need{display:grid; gap:10px; margin:0; padding:0; list-style:none}
.guide-page .need li{display:grid; gap:2px}
.guide-page .need b{font-size:.94rem}
.guide-page .need span{color:var(--dim); font-size:.88rem}
.guide-page .tr{border-block-start:1px solid var(--line); padding:13px 0 0; margin:0 0 13px}
.guide-page .q{margin:0 0 4px; font-weight:700; font-size:.94rem}
.guide-page .a{margin:0; color:var(--dim); font-size:.9rem}
.guide-page .none{background:var(--act-bg); color:var(--act); border-radius:10px;
  padding:12px 14px; font-weight:600}

.cta a.ghost,.cta button.ghost,.inline button.ghost,.pn button.ghost{
  transition:border-color var(--t) var(--glow-ease),
             box-shadow var(--t) var(--glow-ease),
             background-color var(--t) var(--glow-ease)}
.cta a.ghost:hover,.cta button.ghost:hover,
.inline button.ghost:hover,.pn button.ghost:hover{
  border-color:rgb(var(--glow-run));
  background-color:rgba(var(--glow-run),.05);
  box-shadow:0 0 0 1px rgba(var(--glow-run),.55),
             0 0 18px 3px rgba(var(--glow-run),.22),
             0 0 30px 6px rgba(var(--glow-run),.10),
             0 8px 22px -6px rgba(var(--glow-run),.28)}

.box,.doc{--glow:var(--glow-run)}
.engchip{--glow:108,92,231}
.engchip.on{--glow:var(--glow-run)}
.box,.doc,.engchip,.setup-step,.product-strip,.trial-banner,button,.mic{transition:border-color var(--t) var(--glow-ease),
  box-shadow var(--t) var(--glow-ease),background-color var(--t) var(--glow-ease)}
@media (hover:hover) and (pointer:fine){
  .box:hover,.doc:hover,.setup-step:hover,.product-strip:hover,.trial-banner:hover,
  .engchip:not(.off):hover,.engchip:not(.off):focus-within,
  button:hover,.mic:hover{
    border-color:rgb(var(--glow));
    background-color:rgba(var(--glow),.04);
    box-shadow:0 0 0 1px rgba(var(--glow),.5),
               0 0 18px 3px rgba(var(--glow),.20),
               0 0 30px 6px rgba(var(--glow),.10),
               0 8px 22px -6px rgba(var(--glow),.26)}
}

.hero a,.hero button,.foot a,.hub a,.hub .langs a,.box a,.box button,.items a,
.box,.need li,.faq,.dl,.pn button,.form button,.form input,.form select{
  transition:border-color var(--t) var(--glow-ease),
             box-shadow var(--t) var(--glow-ease),
             background-color var(--t) var(--glow-ease)}
.hero a:hover,.hero button:hover,.foot a:hover,.hub a:hover,
.box a:hover,.box button:hover,.items a:hover,
.box:hover,.need li:hover,.faq:hover,.dl:hover,
.pn button:hover,.form button:hover,
.form input:focus,.form select:focus,.hero a:focus-visible,
.hero button:focus-visible,.foot a:focus-visible,.hub a:focus-visible,.skip:focus{
  border-color:rgb(var(--glow-run));
  box-shadow:0 0 0 1px rgba(var(--glow-run),.55),
             0 0 18px 3px rgba(var(--glow-run),.22),
             0 0 30px 6px rgba(var(--glow-run),.10),
             0 8px 22px -6px rgba(var(--glow-run),.28)}

.setup-step:nth-child(4n+1),.box:nth-of-type(4n+1){--glow:21,94,239}
.setup-step:nth-child(4n+2),.box:nth-of-type(4n+2){--glow:124,58,237}
.setup-step:nth-child(4n+3),.box:nth-of-type(4n+3){--glow:13,148,136}
.setup-step:nth-child(4n),.box:nth-of-type(4n){--glow:234,88,12}
.product-strip{--glow:124,58,237}.trial-banner{--glow:21,94,239}

.hub .langs a[aria-current="true"],.foot .lang-now{box-shadow:none}