:root {
  --ink:#12111a;
  --cream:#fff0d2;
  --white:#fff;
  --orange:#ff5b35;
  --lime:#99ee36;
  --purple:#bd58e6;
  --yellow:#ffd84b;
  --green:#164d3c;
  --red:#a92e2d;
  --mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --display:"Bowlby One SC",Impact,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.5;overflow-x:hidden}
a{color:inherit}
button,textarea,input{font:inherit}
button{cursor:pointer}
img{max-width:100%}
:focus-visible{outline:4px solid var(--lime);outline-offset:4px}

.skip-link{position:fixed;z-index:100;left:1rem;top:-5rem;padding:.8rem 1rem;background:var(--lime);font-weight:800}
.skip-link:focus{top:1rem}
.site-header{position:relative;z-index:20;min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:0 clamp(1rem,4vw,4.5rem);background:var(--ink);color:var(--white);border-bottom:4px solid var(--orange)}
.wordmark{display:flex;align-items:center;gap:.8rem;text-decoration:none}
.wordmark>span:last-child{display:grid;gap:.05rem}
.wordmark strong{font-size:.84rem;letter-spacing:.11em}
.wordmark small{color:#b9b5c8;font:500 .55rem var(--mono);letter-spacing:.13em}
.mark{display:grid;place-items:center;width:42px;height:42px;background:var(--orange);color:var(--ink);font:500 1.1rem var(--mono);box-shadow:5px 5px 0 var(--purple)}
nav{display:flex;align-items:center;gap:clamp(.8rem,2.5vw,2rem)}
nav a{font:500 .72rem var(--mono);letter-spacing:.08em;text-decoration:none;text-transform:uppercase}
nav a:hover{color:var(--lime)}
.nav-button{padding:.75rem 1rem;border:2px solid var(--cream);box-shadow:4px 4px 0 var(--orange)}

.hero{min-height:760px;display:grid;grid-template-columns:minmax(360px,.9fr) minmax(560px,1.1fr);background:var(--orange);border-bottom:8px solid var(--ink);overflow:hidden}
.hero-copy{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:center;padding:clamp(4rem,7vw,8rem) clamp(1.25rem,5vw,5rem)}
.eyebrow{margin:0 0 1.1rem;color:var(--lime);font:500 .72rem var(--mono);letter-spacing:.14em}
.eyebrow.dark{color:#8f2e20}
.eyebrow.paper{color:#f2cf8e}
.hero h1{margin:0 0 1.8rem;font:400 clamp(4.1rem,8.1vw,9rem)/.82 var(--display);letter-spacing:-.055em;text-transform:uppercase}
.lede{max-width:650px;margin:0 0 2.2rem;font-size:clamp(1rem,1.5vw,1.25rem);font-weight:700}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem}
.primary-link,.black-link{display:inline-flex;align-items:center;gap:1rem;padding:1rem 1.2rem;background:var(--ink);color:var(--white);font-weight:800;text-decoration:none;box-shadow:6px 6px 0 var(--lime)}
.primary-link:hover,.black-link:hover{background:var(--purple)}
.text-link{font-weight:800;text-underline-offset:.35rem;text-decoration-thickness:3px}
.hero-arcade{position:relative;min-height:760px;background:var(--ink);overflow:hidden}
.hero-arcade::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:36px 36px}
.hero-screen{position:absolute;display:block;overflow:hidden;border:8px solid var(--cream);background:var(--ink);color:var(--white);text-decoration:none;box-shadow:14px 14px 0 rgba(0,0,0,.3);transition:transform .25s ease}
.hero-screen:hover{z-index:5;transform:rotate(0) scale(1.025)}
.hero-screen img{width:100%;height:100%;display:block;object-fit:cover}
.hero-screen span{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:.7rem .8rem;background:var(--ink);font:500 .66rem var(--mono);letter-spacing:.1em;text-align:center}
.screen-checkout span,.screen-maze span{top:0;bottom:auto}
.screen-checkout{width:56%;height:45%;left:7%;top:10%;transform:rotate(-4deg)}
.screen-maze{width:48%;height:39%;right:4%;top:18%;transform:rotate(5deg)}
.screen-midnight{width:58%;height:46%;left:25%;bottom:6%;transform:rotate(-1.5deg)}
.screen-midnight img{object-position:center 57%}
.hero-stamp{position:absolute;z-index:8;right:4%;bottom:5%;display:flex;align-items:center;gap:.7rem;padding:.65rem .9rem;background:var(--lime);border:5px solid var(--ink);transform:rotate(4deg)}
.hero-stamp strong{font:400 2.9rem/.8 var(--display)}
.hero-stamp span{font:500 .63rem/1.25 var(--mono);letter-spacing:.08em}

.ticker{overflow:hidden;border-bottom:6px solid var(--ink);background:var(--lime);white-space:nowrap}
.ticker div{width:max-content;padding:.75rem 0;font:500 .78rem var(--mono);letter-spacing:.1em;animation:ticker 24s linear infinite}
@keyframes ticker{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker div{animation:none}.hero-screen{transition:none}}

.offerings,.live-games,.lab,.manifesto{padding:clamp(4rem,8vw,8rem) clamp(1rem,5vw,5rem)}
.offerings{background:var(--ink);color:var(--white);border-bottom:8px solid var(--purple)}
.offerings-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:1rem 3rem;align-items:end;margin-bottom:2.5rem}
.offerings-head .eyebrow{grid-column:1/-1;margin:0}
.offerings-head h2{margin:0;font:400 clamp(3.3rem,7vw,7rem)/.88 var(--display);letter-spacing:-.045em;text-transform:uppercase}
.offerings-head>p:last-child{max-width:600px;margin:0;color:#ccc8d9;font-weight:700}
.division-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:1.5rem}
.division-card{position:relative;display:flex;flex-direction:column;min-height:650px;overflow:hidden;border:6px solid var(--cream)}
.division-label{position:absolute;z-index:5;top:1rem;left:1rem;display:flex;align-items:center;gap:.7rem;padding:.55rem .75rem;background:var(--ink);border:2px solid currentColor;font:500 .68rem var(--mono);letter-spacing:.12em}
.division-label span{color:var(--yellow)}
.division-copy{position:relative;z-index:3;margin-top:auto;padding:clamp(1.4rem,3.5vw,3rem)}
.division-copy>p:first-child{margin:0 0 .8rem;color:var(--yellow);font:500 .68rem var(--mono);letter-spacing:.12em}
.division-copy h3{margin:0 0 1rem;font:400 clamp(2.8rem,5vw,5.6rem)/.86 var(--display);letter-spacing:-.04em;text-transform:uppercase}
.division-copy>p:nth-of-type(2){max-width:620px;font-weight:700}
.division-copy a{display:inline-block;margin-top:1rem;padding:.85rem 1rem;background:var(--cream);color:var(--ink);font-weight:800;text-decoration:none;box-shadow:5px 5px 0 var(--orange)}
.software-card{background:#f4efe7;color:var(--ink);box-shadow:10px 10px 0 var(--orange)}
.software-card .division-label{color:var(--white)}
.software-card .division-copy{background:linear-gradient(transparent,rgba(244,239,231,.96) 20%)}
.software-card .division-copy>p:first-child{color:#8f2e20}
.write-preview{position:absolute;inset:0 0 38%;padding:5.5rem 2rem 2rem;background:linear-gradient(135deg,#d7dce5,#f6f3ee)}
.write-preview-bar{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 1rem;background:#201d2b;color:#fff;box-shadow:8px 8px 0 var(--purple);font:500 .63rem var(--mono);letter-spacing:.06em}
.write-preview-bar b{font:800 1.15rem var(--sans)}
.write-preview-page{width:min(76%,560px);height:260px;margin:1.7rem auto 0;padding:2.3rem;background:#fff;box-shadow:0 12px 30px rgba(18,17,26,.2)}
.write-preview-page i{display:block;height:9px;margin-bottom:1rem;background:#d7d5dc}
.write-preview-page i:nth-child(2){width:88%}.write-preview-page i:nth-child(3){width:94%}.write-preview-page i:nth-child(4){width:72%}.write-preview-page i:nth-child(5){width:83%}
.games-card{background:var(--purple);box-shadow:10px 10px 0 var(--lime)}
.games-card::after{content:"";position:absolute;inset:25% 0 0;background:linear-gradient(transparent,rgba(18,17,26,.98))}
.games-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.live-games{background:var(--cream)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2.2rem}
.section-head h2,.lab-head h2,.cipher-title-block h2,.manifesto h2{margin:0;font:400 clamp(3.3rem,7vw,7rem)/.9 var(--display);letter-spacing:-.045em;text-transform:uppercase}
.black-link{flex:0 0 auto;margin-bottom:.4rem;box-shadow:6px 6px 0 var(--orange)}
.game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.game-tile{position:relative;isolation:isolate;min-height:560px;overflow:hidden;background:var(--ink);color:var(--white);text-decoration:none;border:6px solid var(--ink);box-shadow:9px 9px 0 var(--purple)}
.tile-checkout{grid-column:1/-1;min-height:720px;box-shadow:9px 9px 0 var(--orange)}
.game-tile::after{content:"";position:absolute;z-index:1;inset:25% 0 0;background:linear-gradient(transparent,rgba(18,17,26,.97));pointer-events:none}
.game-tile img{position:absolute;z-index:0;inset:0;width:100%;height:100%;display:block;object-fit:cover;transition:transform .4s ease}
.game-tile:hover img{transform:scale(1.025)}
.tile-midnight img{object-position:center 58%}
.tile-cipher img,.tile-mine img{object-position:center}
.tile-petal{grid-column:1/-1;min-height:680px;box-shadow:9px 9px 0 #ef7f9c}.tile-petal img{object-position:center}.tile-petal .game-number{background:#f5ca67}
.tile-mahjong{grid-column:1/-1;min-height:680px;box-shadow:9px 9px 0 #44cbe0}.tile-mahjong img{object-position:center}.tile-mahjong .game-number{background:#f5ca67}
.tile-solitaire{grid-column:1/-1;min-height:680px;box-shadow:9px 9px 0 #d5a334}.tile-solitaire img{object-position:center}.tile-solitaire .game-number{background:#f5ca67}
.game-number{position:absolute;z-index:2;top:1rem;right:1rem;display:grid;place-items:center;width:58px;height:58px;background:var(--lime);color:var(--ink);border:4px solid var(--ink);font:500 1rem var(--mono)}
.game-info{position:absolute;z-index:3;left:clamp(1.2rem,3vw,2.7rem);right:clamp(1.2rem,3vw,2.7rem);bottom:clamp(1.2rem,3vw,2.7rem);display:grid;justify-items:center;gap:.4rem;text-align:center}
.game-info small{color:var(--yellow);font:500 .7rem var(--mono);letter-spacing:.12em}
.game-info strong{display:block;max-width:100%;font:400 clamp(2.7rem,6vw,6.8rem)/.88 var(--display);letter-spacing:-.04em;text-align:center;text-transform:uppercase}
.game-info em{margin-top:.5rem;font-style:normal;font-weight:800}
@media(min-width:761px){
  .tile-maze .game-info strong,.tile-midnight .game-info strong,.tile-cipher .game-info strong,.tile-mine .game-info strong{font-size:clamp(2.5rem,5vw,5.2rem)}
  .tile-mine .game-info{bottom:clamp(1rem,2vw,1.8rem);gap:.25rem}
  .tile-mine .game-info strong{font-size:clamp(2.2rem,3.8vw,3.9rem);line-height:.9}
}

.lab{background:var(--ink);color:var(--white);border-top:8px solid var(--purple)}
.lab-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:2rem;align-items:end;margin-bottom:2.5rem}
.lab-head .eyebrow{grid-column:1/-1;margin:0}
.lab-head>p:last-child{max-width:600px;margin:0;color:#ccc8d9;font-weight:700}
.build-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}
.build-card{position:relative;min-height:660px;overflow:hidden;border:6px solid var(--cream);isolation:isolate}
.build-card::after{content:"";position:absolute;z-index:1;inset:24% 0 0;background:linear-gradient(transparent,rgba(18,17,26,.96))}
.build-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.build-card:hover .build-art{transform:scale(1.02)}
.build-copy{position:absolute;z-index:3;left:0;right:0;bottom:0;width:100%;padding:clamp(1.5rem,4vw,3.5rem)}
.build-copy>p:first-child{margin:0 0 1rem;font:500 .7rem var(--mono);letter-spacing:.12em}
.build-copy h3{margin:0 0 1.3rem;font:400 clamp(2.7rem,5vw,5rem)/.86 var(--display);letter-spacing:-.045em;text-transform:uppercase}
.build-copy>p:nth-of-type(2){max-width:620px;font-weight:700}
.build-copy a{display:inline-block;margin-top:1rem;padding:.8rem 1rem;background:var(--cream);color:var(--ink);font-weight:800;text-decoration:none;box-shadow:5px 5px 0 var(--orange)}
.detective-card{background:#143e32;color:#fff;box-shadow:10px 10px 0 var(--red)}
.patrol-card{background:var(--purple);color:#fff;box-shadow:10px 10px 0 var(--lime)}
.patrol-card .build-copy>p:first-child{color:var(--lime)}
.petal-card{grid-column:1/-1;background:#7656a5;color:#fff;box-shadow:10px 10px 0 #ef7f9c}.petal-card .build-copy>p:first-child{color:#f5ca67}.petal-card .build-art{object-position:center}.petal-card .build-copy a{box-shadow:5px 5px 0 #f5ca67}

.cipher{background:#143e32;color:var(--cream);border-top:8px solid #e2b957}
.cipher-title-block{position:relative;max-width:1000px;margin:0 auto 2.5rem;padding:clamp(2rem,5vw,4rem);background:#e9d7a7;color:#181510;border:6px solid #181510;box-shadow:12px 12px 0 #9a2929}
.cipher-title-block::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 37px,rgba(75,49,21,.08) 38px 39px)}
.cipher-title-block>*{position:relative;z-index:2}
.file-tab{position:absolute;top:-24px;left:2rem;padding:.55rem .85rem;background:#9a2929;color:#fff;font:500 .62rem var(--mono);letter-spacing:.1em}
.cipher-title-block .eyebrow{color:#9a2929}
.cipher-title-block h2{max-width:900px;font-size:clamp(3rem,6.5vw,6.3rem)}
.cipher-title-block>p:last-child{max-width:680px;font-weight:700}
.cipher-shell,.puzzle-shell{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border:5px solid #181510;box-shadow:12px 12px 0 #9a2929}
.cipher-shell{background:#e9d7a7;color:#181510}
.cipher-controls,.cipher-result,.puzzle-code,.puzzle-answer{padding:clamp(1.3rem,4vw,3.2rem)}
.cipher-controls{border-right:5px solid #181510}
label,.result-label,.alphabet span{display:block;margin-bottom:.65rem;font:500 .68rem var(--mono);letter-spacing:.11em;text-transform:uppercase}
textarea{width:100%;resize:vertical;padding:1rem;border:3px solid #181510;background:#fff8e8;color:#181510;font:500 1rem/1.6 var(--mono)}
.shift-row{display:flex;justify-content:space-between;margin-top:1.4rem}.shift-row output{color:#9a2929;font:500 1.2rem var(--mono)}
input[type="range"]{width:100%;accent-color:#9a2929}
.button-row{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem}
.button-row button,.copy-button{padding:.75rem 1rem;border:3px solid #181510;background:transparent;color:inherit;font-weight:800}
.button-row button.active{background:#181510;color:#fff}
.cipher-result{display:flex;flex-direction:column;min-height:330px;background:#181510;color:#fff}
.cipher-result #result{margin:auto 0;color:#e2b957;font:500 clamp(1.45rem,3vw,3rem)/1.35 var(--mono);overflow-wrap:anywhere}
.copy-button{align-self:flex-start;border-color:#e9d7a7;color:#e9d7a7}
.alphabet{grid-column:1/-1;padding:1.2rem clamp(1.3rem,4vw,3.2rem);overflow-x:auto;border-top:5px solid #181510}
.alphabet div{display:grid;grid-template-columns:80px 1fr;gap:1rem;align-items:baseline}.alphabet span{color:#765c38}.alphabet code{white-space:nowrap;font:500 clamp(.62rem,1.4vw,.95rem) var(--mono);letter-spacing:.15em}
.puzzle-shell{margin-top:2rem;background:#fff8e8;color:#181510}
.puzzle-code{background:#181510;color:#fff;border-right:5px solid #181510}.puzzle-code code{display:block;margin:2.5rem 0;color:#e2b957;font:500 clamp(1.35rem,2.8vw,2.7rem)/1.5 var(--mono);overflow-wrap:anywhere}.puzzle-code>p:last-child{color:#c9c1b0}
.puzzle-answer input{width:100%;padding:1rem;border:3px solid #181510;background:#fff;color:#181510}
.puzzle-feedback{min-height:3rem;margin:1.5rem 0 0;padding:1rem;border-left:6px solid #9a2929;background:#ead9b8;font-weight:700}.puzzle-feedback.solved{border-color:#27704f;background:#d7eadc}

.manifesto{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(2rem,6vw,6rem);align-items:end;background:var(--orange);border-top:8px solid var(--ink)}
.manifesto .eyebrow{grid-column:1/-1;margin:0;color:var(--ink)}
.manifesto h2{font-size:clamp(3.4rem,7vw,7.4rem)}
.manifesto>div{font-size:1.08rem;font-weight:700}

footer{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem 2rem;align-items:center;padding:2.5rem clamp(1rem,5vw,5rem);background:var(--ink);color:var(--white);border-top:6px solid var(--lime)}
.footer-mark{display:flex;align-items:center;gap:1rem}.footer-mark strong{letter-spacing:.1em}.footer-mark .mark{width:36px;height:36px}
footer p{margin:0;color:#b9b5c8}footer a{font-weight:800;text-underline-offset:.3rem}footer small{grid-column:1/-1;color:#777387;font:500 .62rem var(--mono)}

@media(max-width:1050px){
  .hero{grid-template-columns:1fr}.hero-copy{min-height:650px}.hero-arcade{min-height:680px}
  .offerings-head{grid-template-columns:1fr}.division-grid{grid-template-columns:1fr}.division-card{min-height:620px}
  .lab-head{grid-template-columns:1fr}.build-grid{grid-template-columns:1fr}.build-card{min-height:560px}
  .manifesto{grid-template-columns:1fr}
}
@media(max-width:760px){
  .site-header{min-height:72px}.wordmark small{display:none}nav>a:not(.nav-button){display:none}
  .hero-copy{min-height:auto;padding-top:4.5rem;padding-bottom:4.5rem}.hero h1{font-size:clamp(3.8rem,18vw,6.3rem)}.hero-arcade{min-height:510px}
  .hero-screen{border-width:5px}.screen-checkout{width:68%;height:43%;left:3%;top:8%}.screen-maze{width:57%;height:36%;right:1%;top:23%}.screen-midnight{width:72%;height:43%;left:13%;bottom:3%}
  .section-head{align-items:start;flex-direction:column}.black-link{margin:0}.game-grid{grid-template-columns:1fr}.tile-checkout{grid-column:auto}.game-tile,.tile-checkout{min-height:520px}.game-info strong{font-size:clamp(2.9rem,13vw,5rem)}
  .build-card{min-height:570px}
  .cipher-shell,.puzzle-shell{grid-template-columns:1fr}.cipher-controls,.puzzle-code{border-right:0;border-bottom:5px solid #181510}.alphabet{font-size:.8rem}
  footer{grid-template-columns:1fr auto}footer p{grid-column:1/-1}
}
@media(max-width:480px){
  .site-header{padding-inline:.8rem}.wordmark strong{font-size:.72rem}.nav-button{padding:.65rem .75rem}
  .hero h1{font-size:3.6rem}.lede{font-size:1rem}.hero-arcade{min-height:430px}.hero-stamp{right:1%;bottom:1%;transform:scale(.8) rotate(4deg)}
  .offerings,.live-games,.lab,.manifesto{padding-inline:.8rem}.offerings-head h2,.section-head h2,.lab-head h2,.manifesto h2{font-size:3.05rem}
  .division-card{min-height:560px}.write-preview{padding-inline:.8rem}.write-preview-bar span{display:none}.write-preview-page{width:92%;height:220px}
  .game-tile,.tile-checkout{min-height:430px}.game-number{width:48px;height:48px}.game-info strong{font-size:2.75rem}.tile-mine .game-info{bottom:1rem}.tile-mine .game-info strong{font-size:clamp(2.15rem,10vw,2.8rem);line-height:.9}
  .build-card{min-height:540px}.build-copy{padding:1.3rem}.build-copy h3{font-size:2.65rem}
  .cipher-title-block{padding:2.2rem 1.1rem 1.4rem}.cipher-title-block h2{font-size:2.7rem}.cipher-controls,.cipher-result,.puzzle-code,.puzzle-answer{padding:1.2rem}.puzzle-buttons button{flex:1 1 100%}
  footer{grid-template-columns:1fr;align-items:start}footer a{justify-self:start}
}