:root{--warm-paper:#f7f3f2;--warm-ink:#171414;--warm-slate:#565151;--cool-paper:#dde1e6;--cool-ink:#121619;--cool-slate:#4d5358;--lens:#ffd23f;--violet:#8a3ffc;--ink:var(--warm-ink);--slate:var(--warm-slate);--mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}html[data-side="without"]{--ink:var(--cool-ink);--slate:var(--cool-slate)}*{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:clip}body{font-family:var(--sans);font-weight:400;color:var(--ink);background:var(--warm-paper);min-height:100dvh;-webkit-font-smoothing:antialiased;position:relative}.ground{position:fixed;inset:0;z-index:-1;transition:opacity .36s ease}.ground-with{background:var(--warm-paper)}.ground-without{background:var(--cool-paper);opacity:0}html[data-side="without"] .ground-without{opacity:1}.shell{min-height:100dvh;display:grid;grid-template-columns:minmax(0,1fr);gap:1.5rem;align-content:start;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));max-width:1160px;margin:0 auto}.copy{display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;min-width:0}.brand{display:flex;align-items:center;gap:.75rem}.brand img{width:56px;height:56px;display:block;border-radius:14px}.brand span{font-family:var(--mono);font-weight:500;font-size:clamp(.8rem,.76rem + .2vw,.9rem);letter-spacing:.04em;color:var(--slate)}h1{font-family:var(--mono);font-weight:500;font-size:clamp(1.55rem,1.05rem + 2.5vw,3.1rem);line-height:1.12;letter-spacing:-.02em;max-width:17ch}.lead{font-size:clamp(.95rem,.9rem + .25vw,1.125rem);line-height:1.5;color:var(--slate);max-width:44ch}.cta-wrap{display:flex;flex-direction:column;gap:.5rem;margin-top:.25rem}.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:2.5rem;min-height:48px;padding:0 1rem 0 1.1rem;background:var(--lens);color:var(--warm-ink);font-family:var(--sans);font-weight:500;font-size:clamp(1rem,.96rem + .2vw,1.0625rem);text-decoration:none;-webkit-tap-highlight-color:transparent;transition:transform .15s ease}.cta svg{width:20px;height:20px;flex:none}.cta:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.cta:active{transform:translateY(1px)}@media (hover: hover) and (pointer: fine){.cta:hover{transform:translateX(2px)}}.under{font-size:clamp(.82rem,.8rem + .1vw,.9rem);line-height:1.45;color:var(--slate);max-width:40ch}.stage{min-width:0;width:100%;max-width:460px;justify-self:center}.switch{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ink);border-bottom:0;background:transparent}.switch button{min-height:48px;font-family:var(--mono);font-weight:500;font-size:clamp(.82rem,.78rem + .2vw,.92rem);letter-spacing:.02em;border:0;background:transparent;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent}.switch button+button{border-left:1px solid var(--ink)}.switch button[aria-pressed="true"]{background:var(--ink);color:#ffffff}.switch button:focus-visible{outline:2px solid var(--violet);outline-offset:-4px}@media (hover: hover) and (pointer: fine){.switch button[aria-pressed="false"]:hover{background:rgba(23,20,20,.06)}}.nudge{animation:nudge .6s ease .9s 1 both}@keyframes nudge{0%,100%{transform:translateX(0)}35%{transform:translateX(-5px)}70%{transform:translateX(3px)}}.card{perspective:1400px}.turn{display:grid;transform-style:preserve-3d;transition:transform .38s cubic-bezier(.3,.1,.2,1)}html[data-side="without"] .turn{transform:rotateY(180deg)}.face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid var(--ink);padding:1rem 1rem .5rem}.face[hidden]{display:none}.face-with{background:#ffffff;color:var(--warm-ink)}.face-without{background:#f2f4f8;color:var(--cool-ink);transform:rotateY(180deg)}.face-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:.75rem;border-bottom:1px solid currentColor}.kicker{font-family:var(--mono);font-weight:500;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}.face-with .kicker{color:var(--violet)}.face-without .kicker{color:var(--cool-slate)}.handle{font-family:var(--mono);font-weight:500;font-size:clamp(.9rem,.85rem + .25vw,1.05rem);overflow-wrap:anywhere}.rows{list-style:none}.rows li{display:grid;grid-template-columns:2rem 1fr 28px;align-items:center;gap:.5rem;min-height:44px;padding:.5rem 0;border-bottom:1px solid #e0dcdb}.face-without .rows li{border-bottom-color:#c1c7cd}.rows li:last-child{border-bottom:0}.n{font-family:var(--mono);font-weight:500;font-size:.75rem}.face-with .n{color:var(--warm-slate)}.face-without .n{color:var(--cool-slate)}.lbl{font-size:clamp(.9rem,.87rem + .15vw,1rem);line-height:1.3}.face-with .lbl{font-weight:500}.mark{width:28px;height:28px;display:grid;place-items:center}.face-with .mark{background:var(--violet);color:#ffffff}.face-with .mark svg{width:16px;height:16px}.face-without .mark{border:1px solid var(--cool-slate);color:var(--cool-slate);font-family:var(--mono);font-weight:500;font-size:.9rem}footer{grid-column:1/-1;font-size:.8rem;line-height:1.5;color:var(--slate);padding-top:.5rem}@media (min-width: 880px){.shell{grid-template-columns:minmax(0,1fr) 440px;column-gap:clamp(2.5rem,1rem + 4vw,5.5rem);row-gap:1rem;align-content:center;padding:2.5rem 2rem}.brand img{width:96px;height:96px;border-radius:22px}.copy{gap:1.1rem}.stage{justify-self:end;align-self:center}.face{padding:1.25rem 1.25rem .5rem}.rows li{min-height:52px}}@media (prefers-reduced-motion: reduce){.turn,.ground,.cta{transition:none}.nudge{animation:none}}