/* THE LAB — approved illustrated art, live controls and responsive layout. */
:root{--bg:#051621;--panel:#082637;--line:#268da6;--muted:#c3e3eb;--mint:#6feeff;--orange:#ffcc52;--cream:#fff9dc}
html{scroll-behavior:smooth;scroll-padding-top:20px}
body.the-lab{background:#041723 url('assets/lab/hero.png') center top/1536px auto fixed;color:#f6fcff}
body.the-lab:before{content:'';position:fixed;inset:0;background:#031520d9;z-index:-1;pointer-events:none}
.the-lab header{max-width:1140px;margin:12px auto 0;padding:15px 23px;gap:20px;border:3px solid #7b6046;border-radius:20px;background:linear-gradient(110deg,#173748,#041a28 45%,#103e50);box-shadow:inset 0 0 0 3px #06121a,inset 0 5px 0 #91bdc34a,0 8px 20px #0009;position:relative;z-index:2}
.the-lab header:before,.the-lab header:after{content:'⊕';position:absolute;top:4px;color:#a3abb1;font-size:12px}.the-lab header:before{left:5px}.the-lab header:after{right:5px}
.the-lab .brand{font-size:16px;line-height:1.02;letter-spacing:-.03em}.the-lab .brand strong{display:block;font-size:27px;color:#ffdc62;text-shadow:0 2px 0 #97600d,0 3px 3px #000}.the-lab .brand b{background:none;box-shadow:none;border:0;color:#ffd854;font-size:49px;width:52px;height:52px;transform:none;text-shadow:0 0 12px #13dbff}
.the-lab header nav{gap:8px;align-items:center}.the-lab header nav a{background:linear-gradient(#0b3d52,#052536);border:1px solid #247894;box-shadow:inset 0 1px #80e6ff44;color:#e8faff;font-size:14px;padding:14px 18px;font-weight:700}.the-lab header nav a:hover,.the-lab header nav a[aria-current]{color:#ffe167;border-color:#e9a43d;background:#093345}
.the-lab main{max-width:1180px;padding-top:24px}.the-lab.lab-home main{padding:0 20px 20px;max-width:1180px}
.lab-hero{position:relative;isolation:isolate;margin:0 -20px;overflow:hidden;border-bottom:6px solid #163f50}
.hero-scene{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.hero-invitation{position:absolute;left:23%;right:23%;top:69%;text-align:center;z-index:1}
.hero-invitation p{margin:0 0 15px;font-size:clamp(14px,2.5vw,28px);line-height:1.2;font-weight:1000;color:#fff;letter-spacing:-.03em;text-shadow:0 3px 3px #000,0 0 12px #000}
.the-lab .button,.the-lab button.primary{background:linear-gradient(#fff65d 0%,#ffd232 35%,#ffb711 65%,#ff8614);color:#342004;border:2px solid #fff192;border-radius:16px;font-weight:1000;box-shadow:inset 0 2px 2px #ffffe2,0 0 0 3px #b45c18,0 5px 0 #73390c,0 0 23px #ffb81970;text-shadow:0 1px #fff3a2;gap:13px;min-height:50px;transition:transform .15s,filter .15s}
.the-lab .button:hover,.the-lab button.primary:hover{filter:brightness(1.14);transform:translateY(-3px)}.the-lab .button:active,.the-lab button.primary:active{transform:translateY(2px)}
.the-lab .lab-enter{font-size:clamp(16px,2.4vw,28px);padding:16px 30px;width:min(100%,350px);border-radius:50px}
.station-deck{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:-2px -12px 0;padding:20px 16px;background:linear-gradient(100deg,#134559,#051d2b 45%,#103f52);border:3px solid #25728a;box-shadow:inset 0 0 0 5px #061923,0 8px 22px #000a;border-radius:8px}
.station{min-width:0;overflow:hidden;text-align:center;border:2px solid #2cb9de;border-radius:22px;background:linear-gradient(#031b29,#052c3b);box-shadow:inset 0 0 0 4px #02101d,0 0 0 2px #020f19,0 6px 14px #000;position:relative;padding:18px 0 22px}
.station h2{color:#ffeb8a;font-size:clamp(19px,2.6vw,29px);letter-spacing:-.045em;margin:0 5px 8px;font-weight:1000;text-shadow:0 3px 3px #000}.station p{color:#f4fcff;font-size:15px;line-height:1.4;min-height:42px;margin:0 10px 7px}.station .button{min-width:58%;font-size:24px;margin-top:-6px;position:relative}
.station-art{aspect-ratio:300/165;background-image:url('assets/lab/approved-art.png');background-size:341.333333% 930.909091%;background-repeat:no-repeat;margin:0 5px 5px}.art-flip{background-position:4.14% 52.88%}.art-table{background-position:50% 52.88%}.art-mystery{background-position:96.13% 52.88%}
.discovery-deck{padding:28px 0 25px;position:relative;text-align:center;background:linear-gradient(#041e2a44,#09354688);border-bottom:8px ridge #8e633a}
.metal-plaque{display:table;margin:0 auto 14px;padding:12px 33px;background:linear-gradient(110deg,#2c2c26,#07212d 22%,#061923 80%,#40402e);color:#ffe778;border:5px ridge #b18c4c;border-radius:10px;font-weight:1000;font-size:clamp(22px,3.3vw,35px);text-shadow:0 3px 3px #000;box-shadow:0 5px 8px #000b}
.deck-caption{font-size:13px;margin:0 12px 18px;color:#c8edf5}.specimen-shelf{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;padding:0 4px}.specimen{position:relative;display:block;text-decoration:none;min-width:0;transition:transform .2s}.specimen:hover{transform:translateY(-5px)}
.specimen-art{display:block;aspect-ratio:3/4;width:100%;background-image:url('assets/lab/creatures.png');background-size:400% 200%;background-position:var(--sx) var(--sy);border-radius:15px;overflow:hidden}
.specimen-label{position:relative;margin:-5px auto 0;display:block;width:88%;border:2px solid #775025;border-radius:5px;background:linear-gradient(#ffe09a,#ba7835);color:#24170a;box-shadow:0 3px 7px #0008;font-size:24px;line-height:1.15;font-weight:900;padding:4px 1px}.specimen-label small{display:block;font-size:10px;font-weight:700}.discovery-state{position:absolute;top:5px;right:4px;background:#042337e8;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;font-size:14px;color:#8cffda;border:1px solid #7fbcca}.undiscovered .specimen-art{filter:saturate(.35) brightness(.68)}.collection-link{display:inline-block;margin-top:22px;color:#8aeeff;font-weight:700;font-size:14px;padding:12px}
.arcade-invite{position:relative;overflow:hidden;margin:30px 0 0;padding:26px 28px 145px;border:3px ridge #7499a5;border-radius:16px;background:linear-gradient(115deg,#0b3040,#021622);display:flex;align-items:center;justify-content:space-between;gap:20px}.arcade-invite h2{margin:9px 0;font-size:28px}.arcade-invite p{margin-bottom:10px;max-width:510px}.arcade-invite .button{flex-shrink:0;font-size:15px}.the-lab.lab-home .arcade-invite .lab-set{position:absolute;bottom:-10px;left:0;right:0;height:140px;margin:0;opacity:.8}.arcade-invite .lab-set:before{display:none}
.the-lab footer{max-width:1180px;margin:0 auto;border:0;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:0 20px 20px;background:#041722}.footer-art{width:calc(100% + 40px);margin:0 -20px;height:auto;aspect-ratio:1024/200;background:url('assets/lab/approved-art.png') 0 93.56%/100% 768% no-repeat}.footer-bar{width:100%;display:flex;align-items:center;justify-content:space-evenly;flex-wrap:wrap;gap:20px;padding:25px 16px;border:4px ridge #607b82;border-radius:14px;background:linear-gradient(110deg,#0b3446,#031b27);box-shadow:0 0 0 4px #071019}.footer-bar a{font-size:14px;text-decoration:none;font-weight:700;color:#89eeff}.footer-bar span{font-size:12px}.footer-note{font-size:11px;color:#a9c9d4;margin:5px 0}.the-lab .lab-motion{order:2}
.the-lab .page-title{background:linear-gradient(110deg,#092637f5,#0b3647eb);border:3px ridge #bd8c4b;border-radius:13px;box-shadow:0 7px 15px #0008}.the-lab .page-title h1{color:#ffe18b;font-size:40px;text-shadow:0 2px 0 #9b632a,0 4px 6px #000}.page-title h1 small{display:inline-block;font-size:20px;color:#a3f4ff;text-shadow:none;letter-spacing:0;margin-left:10px}
.the-lab .panel,.the-lab .board{background:linear-gradient(145deg,#0c3547f5,#041d2cf7);border:3px ridge #43869b;box-shadow:inset 0 0 0 2px #03131e,0 9px 20px #0007;border-radius:18px}.the-lab .tabs button{background:linear-gradient(#155066,#062532);border:2px solid #438ca4;box-shadow:0 3px 0 #03101b;color:#cceefa}.the-lab .tabs button.active{background:linear-gradient(#ffe56b,#edac36);border-color:#ffed9b;color:#2b210d}.the-lab .secondary{background:linear-gradient(#17445a,#0a2939);border:1px solid #48859c;box-shadow:0 3px 0 #021723;color:#e9f9ff}.the-lab .secondary:hover{border-color:#98ecff}.the-lab .feedback{background:#031a29;border-color:#30657c}.the-lab .game-link{border-top:5px solid #e9b54c}.the-lab .game-link:hover{background:#0b3547}.the-lab .game-link:nth-child(2){border-top-color:#53d6db}.the-lab .game-link h2{color:#ffe58d}.the-lab .pill{color:#d6f5ff;background:#072b3a;border-color:#3d7a91}.the-lab .tag{background:#062635;color:#8ceaff;border:1px solid #315d71}.the-lab .eyebrow{color:#f5ce77}.the-lab .card{background:radial-gradient(ellipse at 50% 40%,#18556b,#052330 70%);border:3px ridge #318daf;box-shadow:0 5px 0 #020e16,0 0 15px #20bcdd18}.the-lab .card .back{color:#ffd36b;text-shadow:0 0 14px #ffc64c88}.the-lab .card.open{background:linear-gradient(135deg,#fff1ba,#d5b873);color:#2d230e;border-color:#ffda77}.the-lab .card.matched{background:linear-gradient(135deg,#0c5557,#073035);color:#caffef;border-color:#54e5cd}.the-lab .card .back small{color:#8eeaff;text-shadow:none}
.the-lab .side{display:block}.the-lab .side-creature{max-height:none;max-width:230px;margin:0 auto 16px}.the-lab .collect-card{padding:12px}.the-lab .collect-card .specimen-art{max-width:230px;margin:0 auto 12px}.the-lab .collect-card.locked .specimen-art{filter:grayscale(1) brightness(.3)}.the-lab .collect-card h3{margin-top:7px}.the-lab .collect-card .small{min-height:80px}.the-lab .lab-set{max-height:115px;margin-top:-10px;margin-bottom:8px;opacity:.65}.the-lab .lab-set:before{display:none}.the-lab .scene-controls{background:#052b3b}.the-lab .scene-controls button{background:#16465a}.the-lab .scene-live{color:#8cecff}.the-lab .scene-stage{border-color:#389bb3}
.lab-sparks{pointer-events:none;position:absolute;inset:0;overflow:hidden}.lab-sparks i{position:absolute;left:17%;top:60%;width:6px;height:6px;background:#9bfaff;border-radius:50%;box-shadow:0 0 12px 4px #20eaff;animation:spark-rise 5s infinite ease-in}.lab-sparks i:nth-child(2){left:82%;animation-delay:-2s}.lab-sparks i:nth-child(3){left:23%;top:45%;animation-delay:-3s}.lab-sparks i:nth-child(4){left:72%;top:50%;animation-delay:-1s;background:#ffe866;box-shadow:0 0 12px #ffd233}.lab-sparks i:nth-child(5){left:12%;top:75%;animation-delay:-4s}.lab-sparks i:nth-child(6){left:91%;animation-delay:-2.5s}@keyframes spark-rise{0%{transform:translateY(15px) scale(.3);opacity:0}30%{opacity:.9}100%{transform:translateY(-80px) scale(1.1);opacity:0}}
.lab-calm *, .lab-calm *:before,.lab-calm *:after{animation-play-state:paused!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:15px;z-index:100;background:#fff;color:#082b40;padding:15px}.skip-link:focus{top:10px}
@media(min-width:1500px){.the-lab header{margin-top:20px}.lab-hero{border-radius:15px 15px 0 0;margin-top:15px}}
@media(max-width:800px){.the-lab header{margin:7px 8px 0;padding:12px;gap:12px}.the-lab header nav{gap:5px}.the-lab header nav a{font-size:12px;padding:11px 9px}.the-lab .brand{font-size:12px}.the-lab .brand strong{font-size:22px}.the-lab .brand b{font-size:36px;width:36px;height:40px}.station-deck{gap:10px;padding:13px 10px}.station{border-radius:15px;padding-top:15px}.station p{font-size:12px;min-height:50px}.station .button{font-size:19px;padding:10px 18px}.hero-invitation p{margin-bottom:10px}.the-lab .lab-enter{padding:12px 20px;min-height:46px}.specimen-shelf{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 10px}.specimen-art{max-width:220px}.arcade-invite{display:block;padding:24px 24px 135px}.arcade-invite .button{margin-top:18px}.the-lab .side{display:grid;grid-template-columns:150px 1fr;gap:20px}.the-lab .side .side-creature{height:auto;margin:0}.the-lab .collection{grid-template-columns:repeat(2,minmax(0,1fr))}.the-lab .page-title h1{font-size:32px}}
@media(max-width:540px){.the-lab header{flex-wrap:wrap;justify-content:center;border-radius:12px}.the-lab header nav{width:100%;justify-content:center}.the-lab header nav a{flex:1;text-align:center;padding:10px 5px;font-size:11px}.the-lab .brand{font-size:13px}.the-lab .brand strong{font-size:23px}.lab-hero{margin-top:0;padding-bottom:98px;background:#061f2e}.hero-invitation{left:8%;right:8%;top:auto;bottom:22px}.hero-invitation p{font-size:18px;margin-bottom:13px}.the-lab .lab-enter{font-size:20px;width:auto;padding:12px 28px}.the-lab.lab-home main{padding-left:14px;padding-right:14px}.lab-hero{margin-left:-14px;margin-right:-14px}.station-deck{grid-template-columns:1fr;padding:16px;gap:20px;margin:0 -5px}.station{padding-top:20px}.station h2{font-size:29px}.station p{font-size:15px;min-height:0;margin-bottom:15px}.station-art{aspect-ratio:300/165}.station .button{font-size:24px;margin-top:0}.metal-plaque{font-size:22px;padding:12px 18px}.specimen-label{font-size:22px}.specimen-label small{font-size:9px}.specimen-shelf{gap:14px 6px}.discovery-state{width:22px;height:22px;font-size:11px}.deck-caption{font-size:11px}.arcade-invite h2{font-size:25px}.the-lab .side{grid-template-columns:100px 1fr;gap:12px}.the-lab .side .side-creature{height:auto}.the-lab .side h3{font-size:20px}.the-lab .side p{font-size:12px}.the-lab .page-title h1 small{display:block;margin:10px 0 0;font-size:18px}.the-lab .lab-set{height:90px}.the-lab .lab-machinery{height:100%}.footer-bar{gap:20px}.footer-bar a{font-size:12px}.footer-bar span{width:100%;text-align:center}.the-lab .collect-card .small{font-size:11px;min-height:120px}.the-lab .collect-card h3{font-size:18px}.the-lab .board-head{flex-wrap:wrap}.the-lab .save-note{font-size:11px}.the-lab .tabs button{flex:1 0 40%;font-size:13px}.the-lab .page-title{padding:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.the-lab *{animation:none!important;transition:none!important}}