:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#10151e;color:#f2f5fa}*{box-sizing:border-box}body{margin:0}main{width:min(840px,100%);margin:auto;padding:26px 24px 18px}header{display:flex;justify-content:space-between;gap:16px;font-size:14px;letter-spacing:.1em;margin-bottom:20px}.muted{color:#93a4b9;letter-spacing:0}.stage{width:min(100%,calc(100svh - 206px));min-width:240px;aspect-ratio:1;position:relative;margin:auto;overflow:hidden;border-radius:8px;background:#2997f0;touch-action:pan-y;outline-offset:5px;box-shadow:0 22px 70px #0005}.stage img,.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.stage canvas{opacity:0}.stage.active canvas{opacity:1}.hint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:14px;background:#10151ebf;padding:10px 14px;border-radius:30px;pointer-events:none;transition:opacity .3s}.stage:hover .hint,.stage:focus .hint{opacity:0}footer{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;margin-top:22px;font-size:14px}button{font:inherit;background:transparent;color:inherit;border:1px solid #435066;padding:10px 14px;border-radius:8px;cursor:pointer}button:hover{border-color:#a6bbd6}button:focus-visible,input:focus-visible{outline:2px solid #ffb354;outline-offset:4px}.modes{display:flex;gap:5px}.modes button[aria-pressed=true]{background:#f0f4fa;color:#111b29;border-color:#f0f4fa}label{display:flex;align-items:center;gap:10px}input{width:105px;accent-color:#ffa735}output{min-width:38px;font-variant-numeric:tabular-nums}#status{text-align:center;font-size:13px;color:#9baac0;line-height:1.5;margin-top:16px}@media(max-width:550px){main{padding:18px 12px}header{font-size:12px}.stage{width:100%;min-width:0}footer{gap:14px}.hint{font-size:12px}header{margin-bottom:16px}}@media(prefers-reduced-motion:reduce){.hint{transition:none}}
/* Independent cover background and uncropped, square portrait coordinate space. */
main{width:min(1200px,100%)}.stage{width:100%;min-width:0;height:auto;aspect-ratio:16/9;max-height:none}.stage[data-format=square]{width:min(100%,680px);aspect-ratio:1}.stage[data-format=portrait]{width:min(100%,390px);aspect-ratio:9/16}.stage #sky{inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);object-fit:cover;max-width:none}#portrait{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}#portrait img,#portrait canvas{position:absolute;inset:0;width:100%;height:100%}.stage.active #original{visibility:hidden}.formats{display:flex;justify-content:center;gap:6px;margin-top:18px;font-size:14px}.formats button[aria-pressed=true]{border-color:#ffa735;color:#ffbd6f}footer{margin-top:14px}@media(max-width:550px){.stage:not([data-format]),.stage[data-format=wide]{aspect-ratio:4/3}.formats{gap:5px}.formats button{padding:9px 10px}}
/* Floating corner navigation, with no destination until real pages exist. */
.stage{container-type:inline-size}.corner-menu{position:absolute;inset:0;z-index:3;pointer-events:none;--edge:clamp(14px,3cqw,36px)}.corner-link{position:absolute;pointer-events:auto;border:0;border-radius:3px;padding:8px 0;background:none;color:#ff5900;font-size:clamp(14px,2.1cqw,27px);font-weight:900;line-height:1.1;letter-spacing:.015em;text-transform:uppercase;text-shadow:none;transition:transform .25s ease,text-shadow .25s ease;cursor:default}.corner-link:hover,.corner-link:focus-visible{background:none;transform:translateY(-4px);text-shadow:0 1px 0 #ffb161,0 11px 7px #09264e52,0 21px 19px #09264e70,0 30px 30px #09264e45}.corner-link:focus-visible{outline:2px solid #ff5900;outline-offset:6px}.top-left{top:var(--edge);left:var(--edge)}.top-right{top:var(--edge);right:var(--edge)}.bottom-left{bottom:var(--edge);left:var(--edge)}.bottom-right{bottom:var(--edge);right:var(--edge)}.depth-value{color:#9baac0;font-variant-numeric:tabular-nums}.hint{bottom:70px}@container(max-width:440px){.hint{display:none}}@media(prefers-reduced-motion:reduce){.corner-link{transition:none}.corner-link:hover,.corner-link:focus-visible{transform:none}}
/* Solid backing keeps the orange labels readable over every cloud position. */
.corner-link{background:#101e32;color:#ff741a;padding:12px 16px;border:1px solid #ffffff26;border-radius:8px;text-shadow:none;box-shadow:none;transition:transform .25s ease,background-color .25s ease}.corner-link:hover,.corner-link:focus-visible{background:#192d47;text-shadow:none;box-shadow:none}.corner-link:focus-visible{outline:3px solid #ff741a;outline-offset:4px}@container(max-width:440px){.corner-link{padding:10px 12px;font-size:14px}}@media(prefers-reduced-motion:reduce){.corner-link{transition:none}}
/* Chunky handheld-era game blocks, drawn entirely with interface borders. */
.corner-link{background:#ff8a19;color:#291808;border:4px solid #352313;border-radius:0;padding:13px 18px;font-family:'Courier New',Courier,monospace;font-weight:900;font-size:clamp(14px,1.9cqw,24px);letter-spacing:-.035em;line-height:1.15;text-shadow:none;box-shadow:none;isolation:isolate;transition:transform .12s steps(2,end),background-color .12s steps(2,end)}
.corner-link::before{content:'';position:absolute;inset:0;border:4px solid;border-color:#ffd477 #c45b0b #a74309 #ffb84c;pointer-events:none;z-index:-1}
.corner-link::after{content:'';position:absolute;inset:5px;pointer-events:none;background:linear-gradient(#74390d,#74390d) left top/3px 3px no-repeat,linear-gradient(#74390d,#74390d) right top/3px 3px no-repeat,linear-gradient(#74390d,#74390d) left bottom/3px 3px no-repeat,linear-gradient(#74390d,#74390d) right bottom/3px 3px no-repeat}
.corner-link:hover,.corner-link:focus-visible{background:#ffa32a;color:#291808;transform:translateY(-3px);text-shadow:none;box-shadow:none}.corner-link:focus-visible{outline:3px solid #fff3b3;outline-offset:4px}.corner-link:active{transform:translateY(1px)}
@container(max-width:440px){.corner-link{padding:12px 13px;font-size:14px;border-width:3px}.corner-link::before{border-width:3px}}
@media(prefers-reduced-motion:reduce){.corner-link{transition:none}.corner-link:hover,.corner-link:focus-visible,.corner-link:active{transform:none}}
/* Staggered pixel mortar on the block face; the middle label band stays clear. */
.corner-link{background-color:#ff8a19;background-image:linear-gradient(#ff8a19,#ff8a19),linear-gradient(to bottom,transparent 14px,#aa490c 14px,#aa490c 17px,#ffc064 17px,#ffc064 19px,transparent 19px),linear-gradient(to right,transparent 29px,#aa490c 29px,#aa490c 32px,#ffc064 32px,#ffc064 34px,transparent 34px),linear-gradient(to right,transparent 9px,#aa490c 9px,#aa490c 12px,#ffc064 12px,#ffc064 14px,transparent 14px);background-size:calc(100% - 22px) 1.25em,40px 36px,40px 36px,40px 36px;background-position:center center,0 0,0 -18px,20px 0;background-repeat:no-repeat,repeat,repeat-x,repeat-x}
.corner-link:hover,.corner-link:focus-visible{background-color:#ff8a19;background-image:linear-gradient(#ff8a19,#ff8a19),linear-gradient(to bottom,transparent 14px,#aa490c 14px,#aa490c 17px,#ffc064 17px,#ffc064 19px,transparent 19px),linear-gradient(to right,transparent 29px,#aa490c 29px,#aa490c 32px,#ffc064 32px,#ffc064 34px,transparent 34px),linear-gradient(to right,transparent 9px,#aa490c 9px,#aa490c 12px,#ffc064 12px,#ffc064 14px,transparent 14px)}
.corner-link:hover,.corner-link:focus-visible{background-size:calc(100% - 22px) 1.25em,40px 36px,40px 36px,40px 36px;background-position:center center,0 0,0 -18px,20px 0;background-repeat:no-repeat,repeat,repeat-x,repeat-x;cursor:pointer}
.corner-link.crumbling{animation:block-shake .36s steps(2,end)}@keyframes block-shake{0%,100%{transform:translate(0)}20%{transform:translate(-4px,-2px) rotate(-2deg)}40%{transform:translate(4px,1px) rotate(2deg)}60%{transform:translate(-3px,-1px)}80%{transform:translate(2px,2px)}}.brick-chip{position:absolute;z-index:8;pointer-events:none;width:7px;height:7px;background:#ff8a19;border:2px solid #a74309;animation:chip-fall .65s steps(9,end) forwards}@keyframes chip-fall{to{transform:translate(var(--dx),var(--dy)) rotate(var(--spin));opacity:0}}
.about-page{position:fixed;inset:0;z-index:20;background:#10233a;color:#fff3d3;overflow:auto;padding:clamp(24px,6vw,90px);animation:page-open .55s cubic-bezier(.2,.8,.2,1) both}.about-page[hidden]{display:none}.about-page.closing{animation:page-close .3s ease both}.about-page h1{font:900 clamp(38px,9vw,100px)/1 'Courier New',monospace;color:#ff8a19;margin:12vh 0 32px}.about-page p{max-width:580px;font-size:20px;line-height:1.6}.about-page .eyebrow{font:700 14px 'Courier New',monospace;letter-spacing:.12em;color:#ffc064}.back-button{border:3px solid #ff8a19;border-radius:0;color:#ffb84c;font-weight:700;padding:14px 20px}.back-button:hover{background:#ff8a19;color:#10233a;border-color:#ff8a19}@keyframes page-open{from{clip-path:inset(0 100% 0 0);transform:translateY(24px)}to{clip-path:inset(0);transform:translateY(0)}}@keyframes page-close{to{opacity:0;transform:translateY(24px)}}@media(prefers-reduced-motion:reduce){.corner-link.crumbling,.brick-chip,.about-page,.about-page.closing{animation:none}.brick-chip{display:none}}
/* Subpage content is a brick panel in front of the same cloud scene. */
.about-page{background:#2997f0 url('assets/sky.png') center/cover no-repeat;padding:clamp(22px,6vw,80px);display:grid;align-items:center;justify-items:center;min-height:100svh;color:#321b0b}
.about-block{position:relative;isolation:isolate;width:min(100%,900px);padding:clamp(24px,5vw,64px);border:6px solid #352313;background-color:#ed8a32;background-image:linear-gradient(to bottom,transparent 45px,#b56122 45px,#b56122 48px,#ffb569 48px,#ffb569 50px,transparent 50px),linear-gradient(90deg,transparent 93px,#b56122 93px,#b56122 96px,transparent 96px),linear-gradient(90deg,transparent 45px,#b56122 45px,#b56122 48px,transparent 48px);background-size:96px 96px,96px 48px,96px 48px;background-position:0 0,0 0,48px 48px;background-repeat:repeat,repeat,repeat;box-shadow:inset 6px 6px 0 #ffc47a,inset -6px -6px 0 #aa4e16}
.about-block::before{content:'';position:absolute;inset:18px;z-index:-1;background:linear-gradient(90deg,#ed8a32ed,#ed8a32d9);pointer-events:none}
.about-page h1{color:#352313;font-size:clamp(36px,8vw,84px);margin:clamp(36px,6vh,70px) 0 28px;overflow-wrap:anywhere}.about-page p{font-size:clamp(16px,2vw,20px);font-weight:600}.about-page .eyebrow{color:#65300d;line-height:1.5}.back-button{background:#352313;color:#ffd28c;border:3px solid #352313;box-shadow:none}.back-button:hover,.back-button:focus-visible{background:#573018;color:#fff1d5;border-color:#352313}.back-button:focus-visible{outline:3px solid #352313;outline-offset:4px}@media(max-width:440px){.about-page{padding:18px}.about-block{padding:26px 20px;border-width:4px}.about-block::before{inset:12px}}
/* Back navigation shares the tactile brick styling of the corner menu. */
.back-button{position:relative;isolation:isolate;background-color:#ff9a2e;background-image:linear-gradient(#ff9a2e,#ff9a2e),repeating-linear-gradient(0deg,transparent 0 15px,#b65a16 15px 18px,transparent 18px 32px),repeating-linear-gradient(90deg,transparent 0 29px,#b65a16 29px 32px);background-size:calc(100% - 18px) 1.3em,100% 100%,100% 100%;background-position:center;background-repeat:no-repeat;color:#352313;border:4px solid #352313;border-radius:0;padding:13px 20px;font:900 16px/1.2 'Courier New',Courier,monospace;text-transform:uppercase;letter-spacing:.02em;text-shadow:none;box-shadow:none;transition:transform .12s steps(2,end)}
.back-button::before{content:'';position:absolute;inset:0;border:4px solid;border-color:#ffd58b #c45b0b #a74309 #ffbf64;pointer-events:none}
.back-button:hover,.back-button:focus-visible{background-color:#ff9a2e;background-image:linear-gradient(#ff9a2e,#ff9a2e),repeating-linear-gradient(0deg,transparent 0 15px,#b65a16 15px 18px,transparent 18px 32px),repeating-linear-gradient(90deg,transparent 0 29px,#b65a16 29px 32px);background-size:calc(100% - 18px) 1.3em,100% 100%,100% 100%;background-position:center;background-repeat:no-repeat;color:#352313;border-color:#352313;transform:translateY(-2px)}.back-button:active{transform:translateY(1px)}.back-button:focus-visible{outline:3px solid #fff1d5;outline-offset:4px}@media(prefers-reduced-motion:reduce){.back-button{transition:none}.back-button:hover,.back-button:focus-visible,.back-button:active{transform:none}}
.legal-menu{position:absolute;z-index:4;bottom:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;color:#17283d;background:#ffffffd9;padding:2px 10px;border-radius:3px;font-size:12px;line-height:1.3}.legal-menu button{padding:5px 0;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;cursor:default}.legal-menu button:hover{background:transparent;text-decoration:underline;text-underline-offset:3px}.legal-menu button:focus-visible{outline:2px solid #17283d;outline-offset:2px}@container(max-width:440px){.legal-menu{bottom:7px}.corner-link.bottom-left,.corner-link.bottom-right{bottom:48px}}
/* Ambient drift lives on wrappers so it does not overwrite pointer parallax. */
.sky-drift{position:absolute;inset:-10px;pointer-events:none;animation:sky-breathe 38s ease-in-out infinite alternate;will-change:transform}
@keyframes sky-breathe{from{transform:translate(-6px,-3px) scale(1.012)}to{transform:translate(6px,3px) scale(1.025)}}
.foreground-cloud{position:absolute;z-index:2;pointer-events:none;user-select:none;transform:translate(var(--cloud-x,0px),var(--cloud-y,0px));will-change:transform}
.stage .foreground-cloud img{position:relative;inset:auto;display:block;width:100%;height:auto;object-fit:contain;animation:cloud-glide 29s ease-in-out infinite alternate;will-change:transform}
.cloud-near{width:49%;left:6%;top:59%;opacity:.20;filter:blur(.4px)}.cloud-far{width:36%;right:6%;top:31%;opacity:.13;transform:translate(calc(var(--cloud-x,0px) * .65),calc(var(--cloud-y,0px) * .65))}.stage .cloud-far img{animation-name:cloud-glide-back;animation-duration:37s;animation-delay:-13s}
@keyframes cloud-glide{from{transform:translate(-7%,3%)}to{transform:translate(9%,-4%)}}@keyframes cloud-glide-back{from{transform:translate(8%,0) scaleX(-1)}to{transform:translate(-9%,6%) scaleX(-1)}}
.stage.motion-paused .sky-drift,.stage.motion-paused .foreground-cloud img,.stage.offscreen .sky-drift,.stage.offscreen .foreground-cloud img,.stage.tab-hidden .sky-drift,.stage.tab-hidden .foreground-cloud img{animation-play-state:paused}.stage.motion-paused .foreground-cloud{opacity:0}
@container(max-width:440px){.cloud-near{width:72%;left:-9%;top:62%;opacity:.17}.cloud-far{width:62%;right:-12%;top:35%;opacity:.11}}
@media(prefers-reduced-motion:reduce){.sky-drift,.stage .foreground-cloud img{animation:none;will-change:auto}.foreground-cloud{transform:none;will-change:auto}}
/* More visible foreground clouds; subpage motion stays behind the content. */
.cloud-near{opacity:.40}.cloud-far{opacity:.30}
.about-page{isolation:isolate;background:#2997f0}
.about-page::before{content:'';position:fixed;inset:-6%;z-index:-1;pointer-events:none;background:url('assets/sky.png') center/cover no-repeat;animation:subpage-sky-drift 22s ease-in-out infinite alternate;will-change:transform}
@keyframes subpage-sky-drift{from{transform:translate(-2.5%,-1.5%) scale(1.02)}to{transform:translate(2.5%,1.5%) scale(1.06)}}
@container(max-width:440px){.cloud-near{opacity:.34}.cloud-far{opacity:.25}}
@media(prefers-reduced-motion:reduce){.about-page::before{animation:none;transform:none;will-change:auto}}
/* Stronger cloud presence; keep subpage sky sharp without animated scaling. */
.cloud-near,.cloud-far{opacity:.85;filter:none}
.about-page::before{inset:-12px;background-size:cover;animation:subpage-sky-slide 32s ease-in-out infinite alternate;transform:none}
@keyframes subpage-sky-slide{from{transform:translateX(-6px)}to{transform:translateX(6px)}}
@container(max-width:440px){.cloud-near,.cloud-far{opacity:.85}}
@media(prefers-reduced-motion:reduce){.about-page::before{animation:none;transform:none}}
.about-video-wrap{position:fixed;inset:0;overflow:hidden;z-index:-1;pointer-events:none;background:transparent}.about-video-wrap iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-width:177.78vh;min-height:100vh;transform:translate(-50%,-50%);border:0;pointer-events:none}.about-page::before{z-index:-2}.about-block{z-index:1}@media(prefers-reduced-motion:reduce){.about-video-wrap{display:none}}
/* Keep the video outside grid flow, including during the page transition. */
#about-page .about-video-wrap{position:fixed;inset:0;width:100%;height:100%;z-index:0;overflow:hidden;pointer-events:none}#about-page .about-video-wrap iframe{position:absolute;display:block;max-width:none;top:50%;left:50%;width:max(100vw,177.78vh);height:max(100vh,56.25vw);min-width:0;min-height:0;transform:translate(-50%,-50%);border:0}#about-page .about-block{position:relative;z-index:1}
/* Cloud-image scenery only: three independent layers behind the brick panel. */
.about-clouds{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.about-cloud{position:absolute;max-width:none;height:auto;will-change:transform;pointer-events:none}.ac-one{width:65vw;left:-20vw;top:4vh;opacity:.8;animation:about-cloud-east 38s ease-in-out infinite alternate}.ac-two{width:55vw;right:-17vw;bottom:0;opacity:.65;animation:about-cloud-west 47s ease-in-out -18s infinite alternate}.ac-three{width:38vw;right:-9vw;top:26vh;opacity:.48;animation:about-cloud-middle 31s ease-in-out -9s infinite alternate}@keyframes about-cloud-east{from{transform:translate(-7vw,0)}to{transform:translate(24vw,4vh)}}@keyframes about-cloud-west{from{transform:translate(8vw,2vh) scaleX(-1)}to{transform:translate(-27vw,-4vh) scaleX(-1)}}@keyframes about-cloud-middle{from{transform:translate(8vw,-3vh)}to{transform:translate(-18vw,5vh)}}@media(max-width:550px){.ac-one{width:115vw;left:-45vw}.ac-two{width:100vw;right:-40vw}.ac-three{width:85vw;right:-35vw}}@media(prefers-reduced-motion:reduce){.about-cloud{animation:none;will-change:auto}}body.page-hidden .about-cloud{animation-play-state:paused}
/* Opaque cloud interiors; alpha remains only at the natural cutout edges. */
.ac-one,.ac-two,.ac-three{opacity:1}.ac-one{width:48vw;left:-15vw;top:-7vh;animation:about-cloud-east 43s ease-in-out -12s infinite alternate}.ac-two{width:76vw;right:-25vw;bottom:-5vh;animation:about-cloud-west 59s ease-in-out -27s infinite alternate}.ac-three{width:40vw;right:-10vw;top:30vh;animation:about-cloud-middle 34s ease-in-out -6s infinite alternate}
@keyframes about-cloud-west{from{transform:translate(9vw,3vh)}to{transform:translate(-30vw,-5vh)}}
.about-page::before{inset:-3%;animation:about-sky-slow 52s ease-in-out infinite alternate}@keyframes about-sky-slow{from{transform:translate(-1.5%,-.8%)}to{transform:translate(1.5%,.8%)}}
@media(max-width:550px){.ac-one{width:100vw;left:-40vw}.ac-two{width:145vw;right:-60vw}.ac-three{width:80vw;right:-30vw}}@media(prefers-reduced-motion:reduce){.about-cloud,.about-page::before{animation:none;transform:none;will-change:auto}}
/* Full viewport presentation with room for device safe areas. */
html,body{width:100%;height:100%;overflow:hidden}main{width:100%;max-width:none;margin:0;padding:0}.stage,.stage:not([data-format]),.stage[data-format]{width:100%;height:100vh;height:100dvh;max-height:none;aspect-ratio:auto;margin:0;border-radius:0;box-shadow:none}.corner-menu{--edge:clamp(16px,3vw,44px)}.top-left,.top-right{top:max(var(--edge),env(safe-area-inset-top))}.top-left,.bottom-left{left:max(var(--edge),env(safe-area-inset-left))}.top-right,.bottom-right{right:max(var(--edge),env(safe-area-inset-right))}.bottom-left,.bottom-right{bottom:max(54px,calc(env(safe-area-inset-bottom) + 42px))}.legal-menu{bottom:max(10px,env(safe-area-inset-bottom))}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.tilt-enable{position:absolute;z-index:5;left:50%;bottom:76px;transform:translateX(-50%);background:#fff2cf;color:#352313;border:2px solid #352313;border-radius:0;font:700 13px 'Courier New',monospace;padding:10px 13px;white-space:nowrap}.tilt-enable[hidden]{display:none}
/* Keep the mobile face clear, including the opposing tilt travel. */
@container(max-width:600px){.cloud-near{width:46%;left:-9%;top:71%;transform:translate(calc(var(--cloud-x,0px) * .35),calc(var(--cloud-y,0px) * .5))}.cloud-far{width:40%;right:-7%;top:39%;transform:translate(calc(var(--cloud-x,0px) * .3),calc(var(--cloud-y,0px) * .5))}}
#contact-form{display:grid;gap:12px;max-width:620px}#contact-form label{display:block;font-weight:700;font-size:16px}#contact-form input,#contact-form textarea{width:100%;min-width:0;border:3px solid #65300d;border-radius:0;background:#fff3d9;color:#291808;padding:12px;font:16px/1.5 Arial,sans-serif}#contact-form textarea{resize:vertical}#contact-form .back-button{justify-self:start;margin-top:8px}#contact-form .contact-note,#contact-result{font-size:14px;line-height:1.5;margin:0}.contact-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#contact-form button:disabled{opacity:.6;cursor:wait}.about-page:has(#contact-form){align-items:start}.about-page:has(#contact-form) h1{margin:30px 0 24px}
/* Safari may retain a visual viewport offset after closing a focused form. */
html,body{background:#2997f0;overscroll-behavior:none}main{position:fixed;left:0;right:0;top:var(--view-top,0px);height:var(--view-height,100dvh)}.stage,.stage:not([data-format]),.stage[data-format]{height:100%;min-height:0}.corner-menu .top-left,.corner-menu .top-right{top:calc(clamp(20px,3vw,44px) + env(safe-area-inset-top,0px))}.about-page{overscroll-behavior:contain}
#contact-form .privacy-consent{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;margin-top:2px;font-size:14px;line-height:1.45}#contact-consent{width:20px;height:20px;margin:2px 0 0;accent-color:#65300d}#contact-form .privacy-consent label{font-size:14px;font-weight:400}
.project-lead{font-size:clamp(20px,3vw,30px)!important;max-width:760px!important}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:980px;margin:28px 0}.project-card{border:3px solid #352313;background:#f4a047;padding:20px;box-shadow:inset 0 0 0 3px #d8731c}.project-card h2{font:700 clamp(20px,2.5vw,30px)/1.05 'Courier New',monospace;margin:12px 0;color:#321b0b}.project-card p{font-size:16px!important;line-height:1.45;margin:0;color:#321b0b}.project-label{font:700 13px 'Courier New',monospace;letter-spacing:.1em;color:#65300d}.project-tags{display:flex;flex-wrap:wrap;gap:8px;max-width:900px;margin:4px 0 26px}.project-tags span{border:2px solid #352313;background:#ffd28c;color:#352313;padding:7px 10px;font:700 13px 'Courier New',monospace}.project-link{display:inline-block;border:3px solid #352313;background:#352313;color:#ffd28c;padding:12px 16px;font-weight:700;text-decoration:none}.project-link:hover,.project-link:focus-visible{background:#573018;color:#fff1d5}.about-page:has(.project-grid) .about-block{max-width:1120px}@media(max-width:720px){.project-grid{grid-template-columns:1fr;margin:20px 0}.project-card{padding:16px}.project-tags{margin-bottom:20px}}
.project-select{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:900px;margin:30px 0}.project-select button{display:grid;gap:10px;text-align:left;border:3px solid #352313;background:#f4a047;color:#321b0b;padding:24px;box-shadow:inset 0 0 0 3px #d8731c;cursor:pointer}.project-select button strong{font:700 clamp(26px,4vw,44px)/1 'Courier New',monospace}.project-select button small{font:600 16px Arial,sans-serif}.project-select button:hover,.project-select button:focus-visible{background:#ffc064;transform:translateY(-3px)}@media(max-width:720px){.project-select{grid-template-columns:1fr;margin:20px 0}.project-select button{padding:18px}}
.project-select{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:900px){.project-select{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.project-select{grid-template-columns:1fr}}
.project-select button{min-width:0}.project-select button strong{font-size:clamp(24px,3.5vw,42px);overflow-wrap:anywhere;word-break:break-word}.project-select button small{line-height:1.3}.legal-copy{max-width:760px}.legal-copy h2{font:700 clamp(18px,2.5vw,26px)/1.15 'Courier New',monospace;margin:26px 0 10px;color:#321b0b}.legal-copy p{font-size:clamp(16px,2vw,19px)!important;line-height:1.55;margin:0 0 18px}.legal-copy a{color:#65300d;text-decoration:underline}
.tools-panel{max-width:980px;margin:34px 0 10px;padding-top:24px;border-top:3px solid #352313}.tool-logos{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.tool-logo{display:grid;justify-items:center;gap:7px;min-width:74px;padding:10px 9px;border:2px solid #352313;background:#ffd28c;color:#352313}.tool-logo img{width:34px;height:34px;object-fit:contain}.tool-logo small{font:700 11px/1.1 'Courier New',monospace;text-align:center}@media(max-width:520px){.tool-logos{gap:8px}.tool-logo{min-width:66px;padding:8px 6px}.tool-logo img{width:30px;height:30px}.tool-logo small{font-size:10px}}

/* Day / night: independent foreground stars and dark brick interiors. */
.theme-toggle{position:absolute;z-index:6;left:50%;top:calc(20px + env(safe-area-inset-top,0px));transform:translateX(-50%);width:44px;height:44px;padding:0;border:3px solid #352313;border-radius:0;background:#fff2cf;color:#352313;font:28px/1 Arial,sans-serif;box-shadow:inset 2px 2px #fff8e9,inset -2px -2px #c58b45}
.theme-toggle:hover{background:#ffda92;border-color:#352313}.theme-toggle:disabled{cursor:wait;opacity:.65}
.foreground-stars{display:none;position:absolute;inset:0;z-index:2;pointer-events:none}
.front-star{position:absolute;width:var(--size);height:var(--size);transform:translate(calc(var(--cloud-x,0px)*var(--depth)),calc(var(--cloud-y,0px)*var(--depth)));filter:drop-shadow(0 0 5px #9acbff) drop-shadow(0 0 12px #648fff)}
.front-star i{display:block;width:100%;height:100%;background:#f0f8ff;clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);animation:star-breathe 5s ease-in-out var(--delay) infinite alternate}
@keyframes star-breathe{from{opacity:.5;transform:translateY(-4px) scale(.75)}to{opacity:1;transform:translateY(5px) scale(1.1)}}
.night-mode,.night-mode body,.night-mode .stage{background:#07152b}
.night-mode .foreground-stars{display:block}.night-mode .foreground-cloud,.night-mode .about-clouds{display:none}
.night-mode #portrait{filter:brightness(.84) saturate(.9)}
.night-mode .about-page{background:#07152b;color:#edf2ff}.night-mode .about-page::before{background-image:url('assets/sky-night.png')}
.night-mode .about-block{border-color:#101a30;background-color:#202e47;background-image:linear-gradient(to bottom,transparent 45px,#111d33 45px,#111d33 48px,#43536c 48px,#43536c 50px,transparent 50px),linear-gradient(90deg,transparent 93px,#111d33 93px,#111d33 96px,transparent 96px),linear-gradient(90deg,transparent 45px,#111d33 45px,#111d33 48px,transparent 48px);box-shadow:inset 6px 6px #52617a,inset -6px -6px #101a30}
.night-mode .about-block::before{background:linear-gradient(90deg,#202e47ed,#202e47d9)}
.night-mode .about-page h1,.night-mode .legal-copy h2,.night-mode .project-card h2{color:#fff2d7}
.night-mode .about-page .eyebrow,.night-mode .project-label,.night-mode .legal-copy a{color:#ffbd76}
.night-mode .project-card,.night-mode .project-select button{background:#293c58;color:#edf2ff;border-color:#101a30;box-shadow:inset 0 0 0 3px #465a77}
.night-mode .project-card p{color:#edf2ff}.night-mode .project-select button:hover{background:#354d6e}
.night-mode .project-tags span{background:#344765;color:#edf2ff;border-color:#101a30}
.night-mode .tools-panel{border-color:#52617a}.night-mode .legal-menu{background:#12213ee8;color:#edf2ff}
.night-mode #contact-form input,.night-mode #contact-form textarea{background:#132139;color:#f0f5ff;border-color:#6b7c98}
.night-mode .theme-toggle{background:#243653;color:#fff0bc;border-color:#8b9eb9;box-shadow:none}
.stage.offscreen .front-star i,.stage.tab-hidden .front-star i{animation-play-state:paused}
@media(max-width:600px){.theme-toggle{width:36px;height:36px;font-size:23px;top:calc(24px + env(safe-area-inset-top,0px))}.front-star{width:calc(var(--size)*.8);height:calc(var(--size)*.8)}}
@media(prefers-reduced-motion:reduce){.front-star{transform:none}.front-star i{animation:none}}

/* A quiet, accessible petting target, clipped around Pawchi's silhouette. */
.pawchi-pet{-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;position:absolute;left:33%;top:5.5%;width:40%;height:36.5%;z-index:2;pointer-events:auto;border:0;padding:0;background:transparent;box-shadow:none;cursor:grab;clip-path:polygon(22% 0,33% 1%,47% 20%,69% 28%,100% 24%,100% 34%,80% 62%,87% 95%,69% 100%,56% 83%,23% 85%,6% 75%,0 67%,13% 56%,27% 51%,31% 30%,20% 26%)}
.pawchi-pet:active{cursor:grabbing}
.pawchi-pet:focus-visible{background:rgba(255,213,132,.18);outline:3px solid #ffb349;outline-offset:-4px}
.pet-heart{position:absolute;z-index:5;pointer-events:none;width:17px;height:17px;background:#ff6d99;filter:drop-shadow(0 0 5px #ff86ae);clip-path:polygon(0 15%,15% 15%,15% 0,40% 0,40% 15%,60% 15%,60% 0,85% 0,85% 15%,100% 15%,100% 55%,85% 55%,85% 70%,70% 70%,70% 85%,55% 85%,55% 100%,45% 100%,45% 85%,30% 85%,30% 70%,15% 70%,15% 55%,0 55%);opacity:0;animation:pet-heart-rise 1.1s ease-out var(--heart-delay) forwards}
@keyframes pet-heart-rise{0%{opacity:0;transform:translate(-50%,0) scale(.6)}15%{opacity:1}75%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--heart-dx)),-75px) scale(1.1)}}
@media(prefers-reduced-motion:reduce){.pet-heart{animation-name:pet-heart-fade}}
@keyframes pet-heart-fade{0%,100%{opacity:0}20%,70%{opacity:1}}

/* In-memory arcade score: counts accepted pets for this visit. */
.pet-counter{position:absolute;z-index:6;left:calc(50% - 26px);top:calc(20px + env(safe-area-inset-top,0px));transform:translateX(-50%);width:100px;height:44px;min-width:0;display:grid;align-content:center;gap:2px;text-align:center;background:#241b26;border:3px solid #ffb34f;box-shadow:inset 0 0 0 2px #694025,3px 3px 0 #352313;color:#ffe0a0;pointer-events:none;font-family:'Courier New',monospace}
.pet-counter[hidden]{display:none}
.pet-counter-label{font-size:9px;font-weight:700;letter-spacing:1px;line-height:1}
.pet-counter-digits{font-size:20px;font-weight:900;letter-spacing:2px;line-height:1;font-variant-numeric:tabular-nums;text-shadow:1px 1px #be612d}
.has-pet-score .theme-toggle{left:calc(50% + 54px)}
.night-mode .pet-counter{background:#101b34;border-color:#99b5e6;color:#e6efff;box-shadow:inset 0 0 0 2px #354766,3px 3px 0 #10182b}
.night-mode .pet-counter-digits{text-shadow:0 0 6px #94baff}
@media(max-width:600px){.pet-counter{top:calc(24px + env(safe-area-inset-top,0px));left:calc(50% - 20px);width:78px;height:36px;border-width:2px}.pet-counter-label{font-size:7px}.pet-counter-digits{font-size:17px;letter-spacing:1px}.has-pet-score .theme-toggle{left:calc(50% + 42px);width:30px}}

/* Retro accents for navigation; quieter typography for reading. */
.about-page .about-block h1{font-family:Arial,Helvetica,sans-serif;font-weight:750;font-size:clamp(34px,6vw,68px);letter-spacing:-.035em;line-height:1.08;margin:32px 0 22px}
.about-page .project-card h2,.about-page .legal-copy h2{font-family:Arial,Helvetica,sans-serif;font-size:clamp(22px,2.5vw,28px);font-weight:700;line-height:1.25;letter-spacing:-.02em}
.about-page .about-block p{font-weight:400;line-height:1.65}
.about-page .project-lead{font-size:clamp(19px,2.4vw,24px);max-width:760px}
.about-page .project-tags span{font-family:Arial,Helvetica,sans-serif;font-weight:600}
.about-page .project-select button strong{font-family:Arial,Helvetica,sans-serif;font-size:clamp(26px,3vw,36px);letter-spacing:-.025em}
.about-page .project-link{margin:0 0 22px;display:inline-block}
.language-toggle{position:fixed;z-index:30;right:16px;bottom:calc(12px + env(safe-area-inset-bottom,0px));padding:7px 10px;border:2px solid #352313;border-radius:0;background:#fff2cf;color:#352313;font:700 12px 'Courier New',monospace;box-shadow:2px 2px 0 #352313;-webkit-tap-highlight-color:transparent}
.night-mode .language-toggle{background:#243653;color:#edf2ff;border-color:#8b9eb9}