.codepage{background:var(--shell);min-height:100vh;color:var(--ink);font-family:var(--body);flex-direction:column;display:flex}.codepage a{color:inherit}.codepage-bar{background:var(--ink);padding:clamp(14px,2.4vh,20px) 0}.codepage-bar-inner{max-width:1040px;padding:0 var(--gutter);justify-content:space-between;align-items:center;gap:16px;margin:0 auto;display:flex}.codepage-bar .mark--lockup{width:clamp(110px,24vw,150px);color:var(--clay)}.codepage-bar nav a{color:var(--shell);padding:8px 2px;font-size:14px;font-weight:700;text-decoration:none}.codepage-bar nav{gap:18px;display:flex}.codepage-bar nav a:hover{color:var(--clay)}.codepage-hero{background:var(--ink);color:var(--shell);text-align:center;padding:clamp(40px, 10vh, 96px) var(--gutter) clamp(72px, 14vh, 128px);flex:1 0 auto;position:relative;overflow:hidden}.codepage-hero>*{z-index:1;position:relative}.codepage-eyebrow{letter-spacing:.2em;text-transform:uppercase;color:var(--clay);margin-bottom:18px;font-size:11px;font-weight:700}.codepage-hero h1{font-family:var(--display);letter-spacing:-.02em;max-width:14ch;margin:0 auto 18px;font-size:clamp(38px,10vw,72px);font-weight:500;line-height:1.04}.codepage-hero h1 em{color:var(--clay);font-style:normal}.codepage-lede{color:#fbf7f2c7;max-width:34ch;margin:0 auto clamp(28px,6vh,44px);font-size:clamp(16px,4vw,19px);line-height:1.55}.codepage-hint{color:#fbf7f28c;margin-top:22px;font-size:13px}.codepage-hint code{color:var(--clay);font-family:inherit}.codepage-doodle{color:var(--clay);opacity:.09;pointer-events:none;animation:7s ease-in-out infinite codepage-bob;z-index:0!important;position:absolute!important}.codepage-doodle--a{width:clamp(54px,11vw,96px);top:12%;left:6%;rotate:-16deg}.codepage-doodle--b{width:clamp(44px,9vw,78px);animation-delay:-3s;bottom:14%;right:7%;rotate:24deg}@keyframes codepage-bob{0%,to{translate:0}50%{translate:0 -12px}}.codeentry{flex-direction:column;align-items:center;gap:12px;display:flex}.codeentry-boxes{justify-content:center;gap:clamp(10px,3vw,18px);display:flex}.codeentry .codeentry-box{background:var(--shell);width:clamp(66px,20vw,96px);height:clamp(88px,26vw,124px);color:var(--ink);font-family:var(--display);font-variant-numeric:lining-nums;text-align:center;caret-color:var(--clay);transition:transform .22s var(--spring), border-color .18s var(--ease), box-shadow .22s var(--ease);appearance:none;border:2px solid #0000;border-radius:20px;margin:0;padding:0;font-size:clamp(46px,13vw,70px);font-weight:500;line-height:1;box-shadow:0 14px 22px -8px #0006}.codeentry .codeentry-box:focus{border-color:var(--clay);outline:none;transform:translateY(-4px);box-shadow:0 0 0 5px #e8b8a852,0 20px 28px -10px #00000073}.codeentry .codeentry-box:disabled{opacity:.55}.codeentry-status{color:#fbf7f2b3;min-height:22px;margin:0;font-size:14px}.codeentry-go{cursor:pointer;background:var(--clay);color:var(--ink);font:700 15px/1 var(--body);border:0;border-radius:999px;padding:13px 34px;display:none}html:not(.js) .codeentry-go,.codeentry-go--always{display:inline-block}.codedigits{gap:10px;margin:0 auto 26px;display:inline-flex}.codedigits span{width:clamp(48px,13vw,62px);height:clamp(62px,17vw,80px);color:var(--shell);font-family:var(--display);font-variant-numeric:lining-nums;border:2px solid #e8b8a873;border-radius:14px;place-items:center;font-size:clamp(30px,8.5vw,40px);font-weight:500;display:grid}.codepage-retry{margin-top:clamp(28px,6vh,44px)}.codepage-retry>p{color:#fbf7f29e;margin-bottom:14px;font-size:14px}.codepage-note{color:#fbf7f29e;margin-top:26px;font-size:14px}.codepage-note a{color:var(--shell);text-underline-offset:3px}.codepage-how{background:var(--sand);text-align:center;padding:clamp(40px, 8vh, 72px) var(--gutter) clamp(36px, 7vh, 60px)}.codepage-how h2{font-family:var(--display);letter-spacing:-.015em;margin-bottom:28px;font-size:clamp(24px,5.5vw,32px);font-weight:500}.codepage-steps{text-align:left;grid-template-columns:repeat(3,1fr);gap:22px;max-width:880px;margin:0 auto;padding:0;list-style:none;display:grid}.codepage-steps li{background:var(--shell);border-radius:18px;padding:22px 22px 24px}.codepage-step-n{background:var(--ink);width:30px;height:30px;color:var(--clay);font:700 13px/1 var(--body);border-radius:50%;place-items:center;margin-bottom:14px;display:grid}.codepage-steps h3{font-family:var(--display);letter-spacing:-.01em;margin-bottom:8px;font-size:20px;font-weight:500}.codepage-steps p{color:var(--ink-soft);margin:0;font-size:15px;line-height:1.55}.codepage-sample{color:var(--ink-soft);margin:28px 0 0;font-size:14px}.codepage-sample a{font-family:var(--display);letter-spacing:.08em;font-variant-numeric:lining-nums;color:var(--ink);text-underline-offset:3px;font-size:17px;font-weight:500}@media (max-width:760px){.codepage-steps{grid-template-columns:1fr;max-width:460px}}.codepage-after{text-align:center;padding:clamp(40px, 8vh, 72px) var(--gutter) clamp(48px, 9vh, 80px)}.codepage-after h2{font-family:var(--display);letter-spacing:-.015em;margin-bottom:10px;font-size:clamp(24px,5.5vw,32px);font-weight:500}.codepage-after p{color:var(--ink-soft);max-width:44ch;margin:0 auto 24px;font-size:16px;line-height:1.6}.codepage-btn{background:var(--ink);font:700 15px/1 var(--body);transition:transform .2s var(--ease), background .2s var(--ease);border-radius:999px;align-items:center;gap:8px;padding:14px 26px;text-decoration:none;display:inline-flex;color:var(--shell)!important}.codepage-btn:hover{background:var(--ink-deep);transform:translateY(-1px)}.codepage-foot{padding:22px var(--gutter) 28px;text-align:center;color:var(--ink-soft);font-size:13px}.codepage-foot a{text-underline-offset:3px}@media (prefers-reduced-motion:reduce){.codepage-doodle{animation:none}.codeentry .codeentry-box{transition:none}}.codepage-sample span{white-space:nowrap}