.ghostbtn svg{width:16px;height:16px}
@media (max-width:720px){.checkout{grid-template-columns:1fr}
.grid,.grid.goals{grid-template-columns:repeat(2,1fr)}
.grid.wide{grid-template-columns:1fr}
.pick{min-height:114px}
#goalGrid.nota-open .pick{display:none}
.screen[data-screen="goal"] .pick{min-height:0}
.screen[data-screen="goal"] .pick-cta{margin-top:8px}
.seg-labels{display:none}
.track{height:16px}
.node b{width:clamp(9px,3vw,13px);height:clamp(9px,3vw,13px)}
.node.active b{box-shadow:inset 0 0 0 2px var(--klein),0 0 0 clamp(3px,1vw,5px) rgba(36,56,230,.14)}}
@media (max-width:400px){.pick-lbl{font-size:15px}}
.statusbar{margin-top:clamp(20px,3.4vw,26px);padding-top:16px;border-top:1px solid var(--edge);opacity:0;animation:rise .7s var(--ease) .18s both}
.hint{font-size:12.5px;font-weight:500;color:var(--muted);margin:0 0 12px;display:flex;align-items:center;gap:8px;min-height:16px;transition:color .2s ease}
.hint-lead{display:flex;align-items:center;gap:8px;min-width:0;flex:0 1 auto}
.hint .ok{width:15px;height:15px;flex:0 0 auto;color:var(--klein-text);display:none}
.hint.ready{color:var(--klein-text);font-weight:600}
.hint.ready .ok{display:block}
#hintText{flex:0 0 auto}
.praise{display:none;font-size:12.5px;font-weight:600;color:#d7263d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.hint-lead.praised .ok,.hint-lead.praised #hintText,
  .hint-lead.praised .chaos-track{display:none!important}
.hint-lead.praised .praise{display:block;margin-left:auto;animation:praiseIn .5s var(--ease) .4s both}
@keyframes praiseIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.hint-lead.praised .praise{animation:none}}
.chaos-track{display:none}
.chaosbtn{display:none;appearance:none;-webkit-appearance:none;border:0;background:transparent;cursor:pointer;flex:0 0 auto;
    flex-direction:column;align-items:center;gap:4px;padding:2px 6px;opacity:.8;transition:opacity .35s ease}
.chaosbtn:hover{opacity:1}
.chaosbtn:focus-visible{opacity:1;outline:2px solid var(--klein-text);outline-offset:3px;border-radius:10px}
.rig-mount{position:relative;width:48px;height:48px}
.rig-collar{position:absolute;inset:0;border-radius:9px;
    background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 30%,rgba(0,0,0,.2)),
      repeating-linear-gradient(-45deg,#eebd2b 0 6px,#2f2c28 6px 12px);
    box-shadow:0 5px 10px -4px rgba(20,18,20,.6),inset 0 1px 2px rgba(255,255,255,.4),inset 0 -2px 3px rgba(0,0,0,.35)}
.rig-socket{position:absolute;inset:7px;border-radius:50%;
    background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.09),transparent 58%),
      conic-gradient(from 200deg,#46464e,#2b2b31 20%,#4a4a53 40%,#2c2c32 60%,#50505a 80%,#46464e);
    box-shadow:inset 0 2px 5px rgba(0,0,0,.7),inset 0 -1px 2px rgba(255,255,255,.12)}
.rig-dome{position:absolute;inset:12px;border-radius:50%;
    background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.5) 0%,rgba(255,255,255,.1) 16%,transparent 30%),
      radial-gradient(circle at 68% 84%,rgba(255,120,130,.3) 0%,transparent 42%),
      radial-gradient(circle at 50% 45%,#e73349 0%,#d7263d 52%,#99101f 100%);
    box-shadow:0 3px 6px -1px rgba(0,0,0,.55),inset 0 -3px 5px rgba(0,0,0,.35),inset 0 1px 2px rgba(255,255,255,.25);
    transition:transform .12s ease,box-shadow .12s ease,background .12s ease}
.rig-dome::after{content:"";position:absolute;inset:2px;border-radius:50%;opacity:0;
    background:repeating-radial-gradient(circle at 50% 50%,rgba(0,0,0,.25) 0 1px,transparent 1px 4px);
    transition:opacity .12s ease}
.chaosbtn:active .rig-dome,.chaosbtn.raging .rig-dome{transform:scale(.86);
    background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.26) 0%,transparent 20%),
      radial-gradient(circle at 68% 84%,rgba(255,120,130,.18) 0%,transparent 42%),
      radial-gradient(circle at 50% 45%,#c11e33 0%,#a91527 55%,#7c0d1a 100%);
    box-shadow:0 1px 2px -1px rgba(0,0,0,.4),inset 0 3px 7px rgba(0,0,0,.45),0 0 16px rgba(215,38,61,.75)}
.chaosbtn:active .rig-dome::after,.chaosbtn.raging .rig-dome::after{opacity:.65}
.rig-wave{position:absolute;inset:-5px;border-radius:50%;pointer-events:none;opacity:0;
    border:2px solid rgba(215,38,61,.7)}
.rig-wave::after{content:"";position:absolute;inset:-2px;border-radius:50%;opacity:0;
    border:1.5px solid rgba(215,38,61,.5)}
.chaosbtn.raging .rig-wave{animation:rigwave .6s ease-out both}
.chaosbtn.raging .rig-wave::after{animation:rigwave .6s ease-out .14s both}
@keyframes rigwave{0%{opacity:.95;transform:scale(.55)}100%{opacity:0;transform:scale(1.6)}}
.rig-lid{position:absolute;inset:4px;border-radius:50%;
    background:linear-gradient(135deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.08) 30%,transparent 48%,rgba(255,255,255,.1) 72%,rgba(255,255,255,.26) 100%),
      radial-gradient(circle at 50% 55%,rgba(170,205,255,.12),rgba(170,205,255,.28));
    border:1.5px solid rgba(95,125,200,.55);box-shadow:inset 0 1px 3px rgba(255,255,255,.7),0 2px 5px -2px rgba(20,18,20,.35);
    transform-origin:50% 0%;transition:transform .45s var(--spring)}
.rig-hinge{position:absolute;top:-4px;left:50%;width:16px;height:5px;margin-left:-8px;border-radius:3px;
    background:#8e99b3;box-shadow:0 1px 1px rgba(0,0,0,.3)}
.chaosbtn:hover .rig-lid,.chaosbtn:focus-visible .rig-lid,.chaosbtn.raging .rig-lid{
    transform:perspective(300px) rotateX(108deg)}
.rig-lbl{font:600 11px var(--sans);letter-spacing:.14em;color:var(--muted);white-space:nowrap;transition:color .3s ease}
.chaosbtn:hover .rig-lbl,.chaosbtn.raging .rig-lbl{color:#d7263d}
.hint-sig{display:none}
.statusbar.at-fork .hint-sig{display:inline-flex;align-items:center;gap:10px;flex:0 1 auto;min-width:0;margin-right:auto}
.hint-mark{display:none}
.statusbar.at-fork .hint-mark{display:block;height:40px;width:auto;flex:0 0 auto;opacity:.9}
.hint-sigline{font:500 14px/1.3 var(--sans);color:var(--ink);letter-spacing:-.005em;white-space:nowrap}
@media (max-width:700px){.statusbar.at-fork .hint-sigline{display:none}
.statusbar.at-fork .hint-sig{min-width:auto}
.statusbar.at-fork .hint-mark{height:28px}}
.statusbar.at-fork .chaos-track{display:flex;align-items:center;flex:0 0 auto;width:58px;height:15px;overflow:visible;color:var(--muted);opacity:.5}
.statusbar.at-fork .hint-lead{flex:1 1 auto;width:auto;min-width:0}
.statusbar.at-fork #hintText{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto;font-size:14px;margin-left:auto}
.statusbar.at-fork .chaosbtn{display:inline-flex}
.chaos-arrow{flex:0 0 auto;display:block;overflow:visible;color:var(--muted)}
@keyframes chaosStretch{0%{clip-path:inset(0 100% 0 0);opacity:0}55%{opacity:.5}100%{clip-path:inset(0 0 0 0);opacity:.5}}
.statusbar.at-fork .chaos-track.stretch{animation:chaosStretch .5s var(--ease) both}
@media (max-width:560px){.chaos-track,.statusbar.at-fork .chaos-track{display:none!important}
.statusbar.at-fork .hint-lead{flex:0 1 auto;width:auto}
.statusbar.at-fork #hintText{white-space:normal;flex:0 1 auto}
.statusbar.at-fork .hint{justify-content:space-between}
.hint-lead.praised .praise{margin-left:0;white-space:normal;overflow:visible;text-overflow:clip}
.hint-lead.praised{align-items:center}
.hint-lead.praised .hint-mark{display:none}}
.navrow{display:flex;align-items:center;gap:10px}
.btn{
    -webkit-appearance:none;appearance:none;font-family:inherit;cursor:pointer;
    display:inline-flex;align-items:center;gap:8px;border-radius:var(--r-btn);
    font-size:14px;font-weight:600;padding:12px 18px;transition:all .2s ease,transform .3s var(--spring);
  }
.btn:focus-visible{outline:2px solid var(--klein-text);outline-offset:2px}
.btn svg{width:16px;height:16px;display:block}
.btn-back{background:#fff;border:1.5px solid var(--edge);color:var(--ink)}
.btn-back:not(:disabled):hover{border-color:var(--klein-text);color:var(--klein-text)}
.btn-back:disabled{opacity:.45;cursor:not-allowed}
.btn-next{margin-left:auto;background:var(--klein);border:1.5px solid var(--klein);color:#fff;cursor:not-allowed;opacity:.4}
.btn-next.ready{
    background:var(--klein);border-color:var(--klein);color:#fff;cursor:pointer;opacity:1;
    box-shadow:0 8px 20px -10px rgba(36,56,230,.55);
    transition:box-shadow .25s ease,background .25s ease,border-color .25s ease,transform .15s var(--flow)}
.btn-next .chev-n{transition:transform .4s var(--flow)}
.btn-next.ready:hover{background:var(--klein-lift);border-color:var(--klein-lift);
    box-shadow:0 12px 26px -10px rgba(36,56,230,.6);transform:translateY(-1px)}
.btn-next.ready:hover .chev-n{transform:translateX(3px)}
.btn-next.ready:active{transform:translateY(1px);box-shadow:0 6px 14px -10px rgba(36,56,230,.5)}
#aboutGrid{position:relative;--cardW:clamp(222px,50vw,280px);--cardH:calc(var(--cardW)*1.36);display:block;margin:clamp(22px,4.5vh,56px) auto 0;max-width:100%;user-select:none}
#aboutGrid .cf-stage{position:relative;width:100%;height:calc(var(--cardH) + 8px);perspective:1650px;perspective-origin:50% 47%}
#aboutGrid .cf-track{position:absolute;inset:0;transform-style:preserve-3d;transition:opacity .35s var(--flow)}
#aboutGrid .cf-card{position:absolute;left:50%;top:0;width:var(--cardW);height:var(--cardH);
    margin-left:calc(var(--cardW) / -2);transform-origin:center center;backface-visibility:hidden;
    cursor:pointer;border:0;padding:0;background:none;font-family:inherit;text-align:left;-webkit-appearance:none;appearance:none;
    transition:transform .5s var(--flow),opacity .5s var(--flow),filter .5s var(--flow)}
#aboutGrid.driving .cf-card{transition:none}
#aboutGrid .cf-card:focus-visible{outline:none}
#aboutGrid .cf-card:focus-visible .cf-ring{box-shadow:inset 0 0 0 2.5px var(--klein-text)}
#aboutGrid .cf-in{position:relative;display:block;width:100%;height:100%;border-radius:20px;overflow:hidden;
    background:#14110e;box-shadow:0 22px 44px -24px rgba(20,18,20,.46),0 5px 14px -8px rgba(20,18,20,.28);
    transition:box-shadow .4s var(--flow)}
#aboutGrid .cf-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;
    filter:saturate(.42) contrast(.97) brightness(1.05);transform:scale(1.02);
    transition:transform .6s var(--ease),filter .55s var(--ease)}
#aboutGrid .cf-scrim{position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(20,17,14,.04) 0%,rgba(20,17,14,0) 32%,rgba(20,17,14,.52) 74%,rgba(20,17,14,.86) 100%)}
#aboutGrid .cf-glare{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s var(--flow);
    background:linear-gradient(105deg,rgba(255,255,255,.15),rgba(255,255,255,0) 42%)}
#aboutGrid .cf-ic{position:absolute;top:13px;left:13px;width:36px;height:36px;border-radius:11px;
    display:grid;place-items:center;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.26);
    opacity:.42;transform:translateY(1px) scale(.92);transform-origin:top left;
    transition:transform .45s var(--spring),opacity .4s var(--flow),background .3s var(--flow),box-shadow .35s var(--flow),border-color .3s var(--flow)}
#aboutGrid .cf-ic svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--spring)}
#aboutGrid .cf-card.is-active .cf-ic{opacity:1;transform:translateY(0) scale(1);background:rgba(255,255,255,.22);
    border-color:rgba(255,255,255,.4);box-shadow:0 8px 18px -9px rgba(0,0,0,.5)}
#aboutGrid .cf-card.is-sel .cf-ic{background:rgba(51,70,255,.34);border-color:rgba(255,255,255,.55);
    box-shadow:0 10px 22px -9px rgba(20,26,120,.6)}
@media (hover:hover){#aboutGrid .cf-card.cf-hover .cf-ic{opacity:1;background:rgba(255,255,255,.3);border-color:rgba(255,255,255,.55);
      transform:perspective(240px) translateY(-4px) rotateX(15deg) rotateZ(-4deg) scale(1.07);
      box-shadow:0 13px 26px -8px rgba(0,0,0,.55)}
#aboutGrid .cf-card.cf-hover .cf-ic svg{transform:scale(1.06)}}
#aboutGrid .cf-txt{position:absolute;left:18px;right:18px;bottom:18px;color:#fff}
#aboutGrid .cf-lbl{display:block;font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.12;
    letter-spacing:-.012em;text-shadow:0 1px 14px rgba(0,0,0,.5)}
#aboutGrid .cf-net{display:block;margin-top:6px;font-size:12.5px;line-height:1.34;color:rgba(255,255,255,.86);
    height:2.68em;opacity:0;overflow:hidden;transition:opacity .45s var(--flow);text-shadow:0 1px 10px rgba(0,0,0,.4)}
#aboutGrid .cf-card.is-active .cf-net{opacity:1}
#aboutGrid .cf-card.is-active .cf-glare{opacity:1}
#aboutGrid .cf-card.is-active .cf-in{box-shadow:0 34px 64px -26px rgba(20,18,20,.62),0 8px 22px -8px rgba(20,18,20,.36),0 0 0 1px rgba(255,255,255,.1)}
#aboutGrid .cf-card.is-active .cf-img{filter:saturate(1.04) contrast(1) brightness(1);transform:scale(1.03)}
#aboutGrid .cf-ring{position:absolute;inset:0;border-radius:20px;pointer-events:none;z-index:6;transition:box-shadow .4s var(--flow)}
#aboutGrid .cf-card.is-sel .cf-in{box-shadow:0 0 0 2.5px var(--klein),0 0 0 6px rgba(51,70,255,.16),0 0 26px 0 rgba(51,70,255,.38),0 20px 40px -22px rgba(20,18,20,.36)}
#aboutGrid .cf-card.is-sel .cf-img{filter:saturate(1.18) contrast(1.02) brightness(1.08);transform:scale(1.045)}
@media (hover:hover){#aboutGrid .cf-card.cf-hover .cf-img{filter:saturate(1.08) contrast(1.02) brightness(1.05);transform:scale(1.06)}
#aboutGrid .cf-card.cf-hover:not(.is-active) .cf-in{box-shadow:0 26px 50px -24px rgba(20,18,20,.5),0 8px 20px -10px rgba(20,18,20,.32)}}
#aboutGrid.typing .cf-track{opacity:0;pointer-events:none}
#aboutGrid .cf-own-panel{position:absolute;inset:0;z-index:120;display:flex;flex-direction:column;gap:9px;
    padding:16px;border-radius:20px;opacity:0;pointer-events:none;transform:scale(.985);
    background:linear-gradient(158deg,#fdfbf7 0%,#eef1fc 100%);
    border:1.5px solid color-mix(in srgb,var(--klein) 20%,var(--edge));
    box-shadow:0 28px 52px -30px rgba(36,56,230,.3),0 6px 16px -10px rgba(20,18,20,.2);
    transition:opacity .4s var(--flow),transform .4s var(--flow)}
#aboutGrid.typing .cf-own-panel{opacity:1;pointer-events:auto;transform:none}
#aboutGrid .cf-own-k{font:700 11.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--klein-text)}
#aboutGrid .cf-own-panel textarea{flex:1;width:100%;border:1.5px solid var(--edge);border-radius:14px;padding:13px 14px;
    font:500 15px/1.45 var(--sans);color:var(--ink);background:#fff;resize:none;outline:none;
    transition:border-color .2s var(--flow),box-shadow .2s var(--flow)}
#aboutGrid .cf-own-panel textarea:focus{border-color:var(--klein);box-shadow:0 0 0 3px rgba(36,56,230,.12)}
#aboutGrid .cf-own-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
#aboutGrid .cf-own-count{font:600 12px var(--sans);color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.02em}
#aboutGrid .cf-own-count.near{color:var(--klein-text)}
#aboutGrid .cf-oback{align-self:flex-start;background:none;border:0;color:var(--muted);font:600 12.5px var(--sans);
    cursor:pointer;padding:3px 2px;display:inline-flex;align-items:center;gap:5px}
#aboutGrid .cf-oback:hover{color:var(--klein-text)}
#aboutGrid .cf-oback svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
#aboutGrid .cf-bar{display:flex;align-items:center;justify-content:center;gap:11px;margin:9px auto 0;flex-wrap:wrap}
#aboutGrid .cf-bar .cf-own{order:1}
#aboutGrid .cf-bar .cf-viewall{order:3}
#aboutGrid .cf-controls{display:flex;align-items:center;justify-content:space-between;gap:4px;margin:0;
    padding:0 8px;border-radius:12px;background:var(--surface);border:1px solid var(--edge);
    box-shadow:0 10px 26px -16px rgba(20,18,20,.4)}
#aboutGrid .cf-bar .cf-pill{flex:0 0 168px;width:168px;height:48px;box-sizing:border-box;margin:0}
#aboutGrid .cf-viewall{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:12px;
    border:1px solid var(--edge);background:var(--surface);color:var(--muted);font:600 13px var(--sans);cursor:pointer;
    box-shadow:0 10px 26px -16px rgba(20,18,20,.4);transition:background .2s var(--flow),color .2s var(--flow),border-color .2s var(--flow),box-shadow .2s var(--flow)}
#aboutGrid .cf-viewall:hover{color:var(--klein-text);border-color:color-mix(in srgb,var(--klein) 45%,var(--edge))}
#aboutGrid.fanned .cf-viewall{background:var(--klein);border-color:var(--klein);color:#fff;box-shadow:0 12px 26px -10px rgba(36,56,230,.5)}
#aboutGrid .cf-viewall svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8}
#aboutGrid .cf-bar .cf-controls{order:2;max-width:168px;transition:max-width .42s var(--spring),opacity .24s var(--flow),transform .42s var(--spring),margin .42s var(--spring),padding .42s var(--spring)}
#aboutGrid.fanned .cf-bar .cf-controls{max-width:0;flex-basis:0;opacity:0;transform:scale(.86);
    margin-left:-11px;padding-left:0;padding-right:0;border-width:0;overflow:hidden;pointer-events:none}
@media (max-width:640px){#aboutGrid .cf-bar .cf-pill{flex:1 1 128px;width:auto}}
#aboutGrid .cf-own{justify-content:center;display:inline-flex;align-items:center;gap:7px;height:48px;padding:0 16px;border-radius:12px;border:1px solid var(--edge);background:var(--surface);color:var(--muted);font:600 13px var(--sans);cursor:pointer;box-shadow:0 10px 26px -16px rgba(20,18,20,.4);transition:background .2s var(--flow),color .2s var(--flow),border-color .2s var(--flow),box-shadow .2s var(--flow)}
#aboutGrid .cf-own:hover{color:var(--klein-text);border-color:color-mix(in srgb,var(--klein) 45%,var(--edge))}
#aboutGrid .cf-own.on{background:var(--klein);border-color:var(--klein);color:#fff;box-shadow:0 12px 26px -10px rgba(36,56,230,.5)}
