:root{--paper:#171914;--ink:#efeee7;--muted:#969b8a;--line:#363b2e;--accent:#e4ff70;--pill:#272d20;--pilltext:#eeefdf;--acid:#e4ff70}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;overflow-x:hidden;display:grid;grid-template-rows:78px minmax(380px,1fr)98px;min-height:100svh;transition:background .65s,color .65s}body.night{--paper:#e9e6dd;--ink:#24271e;--muted:#686e5b;--line:#c5c9b9;--pill:#252d1e;--pilltext:#f4f5e7;--accent:#e14b28}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.mono{font:10px 'DM Mono',monospace;letter-spacing:.06em;line-height:1.6}.skip{position:fixed;top:-80px;left:10px;background:var(--ink);color:var(--paper);padding:15px;z-index:100}.skip:focus{top:5px}
header{margin:0 3.2%;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;position:relative;z-index:5}.wordmark{font:800 43px 'Syne',sans-serif;letter-spacing:-5px;line-height:1}.wordmark span{font:24px 'DM Sans';vertical-align:top;margin-left:5px;letter-spacing:0;color:var(--accent)}.signature{display:flex;flex-direction:column;gap:5px}.signature strong{font:700 18px 'Syne';letter-spacing:-.6px}.signature>span{font:7px 'DM Mono',monospace;letter-spacing:.08em;color:var(--muted)}.header-right{margin-left:auto;display:flex;align-items:center;gap:22px}.quiet{border:0;background:transparent;color:var(--muted);font-size:11px}.quiet span{font-size:20px;margin-left:8px}.about-button{background:transparent;border:1px solid var(--line);border-radius:30px;padding:11px 18px;font-size:12px}.about-button:hover{border-color:var(--accent)}.about-button span{margin-left:20px;color:var(--accent)}
#playground{position:relative;min-height:0;height:calc(100svh - 176px);min-height:380px;margin:0 3.2%;overflow:hidden;isolation:isolate;background-image:radial-gradient(var(--line) .7px,transparent .7px);background-size:36px 36px}.scene-heading{position:absolute;left:1.5%;top:5%;pointer-events:none;z-index:0}.edition{color:var(--muted);font-size:8px;display:flex;align-items:center;gap:8px}.live-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px #e4ff7055}.edition-number{margin-left:24px}h1{font:800 clamp(80px,11.4vw,218px)/.82 'Syne',sans-serif;letter-spacing:-.08em;margin:35px 0 22px;position:relative;white-space:nowrap}h1 em{font-family:'Instrument Serif',serif;font-weight:400;color:var(--accent);font-size:1.25em;letter-spacing:-.075em}.asterisk{font:400 .35em 'DM Sans';position:absolute;right:-.25em;top:-.18em;color:var(--accent);transform:rotate(-20deg)}.scene-heading p{font-size:12px;line-height:1.6;color:var(--muted);margin:0 0 0 4px}.coordinate{position:absolute;right:0;top:28%;writing-mode:vertical-rl;font-size:7px;color:var(--muted);pointer-events:none}.scene-bottom{position:absolute;bottom:18px;left:1.5%;right:1.5%;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none;z-index:2}.instruction{display:flex;align-items:center;gap:13px}.instruction .hand{font-size:31px;color:var(--accent);transform:rotate(-15deg)}.instruction p{font-size:10px;color:var(--muted);line-height:1.65;margin:0}.instruction strong{color:var(--ink);font-weight:500}.scene-readout{display:flex;flex-direction:column;text-align:right;color:var(--muted);font-size:8px}#trails{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}#objects{position:absolute;inset:0;pointer-events:none;z-index:3}
.specimen{position:absolute;left:0;top:0;width:clamp(175px,18vw,290px);height:clamp(175px,18vw,290px);background:none;border:0;padding:0;cursor:grab;pointer-events:auto;touch-action:none;will-change:transform;user-select:none;-webkit-user-select:none}.specimen:active{cursor:grabbing}.specimen canvas{display:block;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 22px 20px #0005)}.specimen:focus-visible{outline:1px dashed var(--accent);outline-offset:5px;border-radius:50%}.object-label{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);white-space:nowrap;font:8px 'DM Mono',monospace;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:7px 10px;display:flex;gap:8px;align-items:center;transition:background .3s}.object-label>span{color:var(--muted);font-size:7px}.object-label>b{font-weight:400;color:var(--accent)}.specimen:hover .object-label{border-color:var(--accent);color:var(--accent)}.paper{position:absolute;inset:25px 25px 40px;background:#ded7fd;color:#292636;box-shadow:5px 8px 0 #06080566;text-align:left;padding:17px;display:flex;flex-direction:column;transform:rotate(-10deg)}.paper:before{content:'';position:absolute;top:-9px;left:35%;width:45px;height:18px;background:#faf8ef99;transform:rotate(4deg)}.paper small{font:6px 'DM Mono';letter-spacing:.02em}.paper strong{font:600 clamp(20px,2.1vw,32px)/1.1 'Syne';letter-spacing:-1px;margin-top:15px}.paper em{font:italic clamp(22px,2.7vw,38px) 'Instrument Serif';margin-top:5px}.paper>span{font:5.5px 'DM Mono';margin-top:auto}
#portal{position:absolute;width:170px;height:190px;left:79%;top:44%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}.portal-rings{width:140px;height:140px;position:relative;display:grid;place-items:center;margin:auto;border-radius:50%;box-shadow:inset 0 0 45px #0009,0 0 30px #d9f85c09;transition:transform .3s}.portal-rings i{position:absolute;inset:0;border:1px dashed var(--muted);border-radius:50%;opacity:.55}.portal-rings i:nth-child(2){inset:13px;border-style:solid;opacity:.35;border-color:var(--accent)}.portal-rings i:nth-child(3){inset:27px;border-style:dotted;opacity:.65}.portal-rings>span{font-size:42px;color:var(--accent)}.portal-label{text-align:center;font-size:6px;letter-spacing:.08em;margin-top:12px;color:var(--muted)}.portal-label b{font-weight:400;color:var(--accent)}#portal.active .portal-rings{filter:drop-shadow(0 0 16px var(--accent));transform:scale(1.15)}
footer{margin:0 3.2%;border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;position:relative;z-index:5}.control-caption{font-size:8px;white-space:nowrap}.control-caption span{margin-left:10px;color:var(--accent)}.dock{display:flex;gap:3px;align-items:center;background:var(--pill);color:var(--pilltext);border:1px solid var(--line);border-radius:50px;padding:6px}.dock button{border:0;background:transparent;color:inherit;font-size:11px;padding:11px 17px;border-radius:30px;white-space:nowrap}.dock button>span:first-child{font-size:17px;vertical-align:-1px;margin-right:7px}.dock button[aria-pressed=true]{background:var(--accent);color:var(--paper)}.night .dock button[aria-pressed=true]{color:#fff}.dock button:hover{box-shadow:inset 0 0 0 1px #9a9f8f}.divider{height:24px;border-left:1px solid #6e775a;margin:0 4px}.utility{display:flex;gap:6px}.utility button{border:1px solid var(--line);background:transparent;border-radius:50%;width:36px;height:36px;font-size:16px;display:grid;place-items:center}.utility button:hover{border-color:var(--accent);color:var(--accent)}#portal-button{color:var(--accent)}.direct-contact{margin-left:auto;font-size:11px;white-space:nowrap}.direct-contact:hover{color:var(--accent)}#toast{position:fixed;bottom:108px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--ink);color:var(--paper);padding:12px 20px;border-radius:50px;font-size:12px;z-index:10;transition:opacity .2s,transform .2s;max-width:90%;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}
dialog{border:1px solid var(--line);border-radius:3px;background:var(--paper);color:var(--ink);width:min(580px,calc(100% - 32px));padding:45px;max-height:85svh;overflow:auto;box-shadow:0 25px 150px #0006}dialog::backdrop{background:#11170ec9;backdrop-filter:blur(15px)}#close{position:absolute;right:12px;top:7px;width:44px;height:44px;font-size:28px;font-weight:400;background:none;border:0}dialog .kicker{font:9px 'DM Mono';color:var(--muted);letter-spacing:.08em}dialog h2{font:600 51px/1.03 'Syne';letter-spacing:-3px;margin:25px 0}dialog h2 em{font:italic 1.15em 'Instrument Serif';color:var(--accent)}dialog p{font-size:15px;line-height:1.75;color:var(--muted)}dialog .panel-footer{border-top:1px solid var(--line);padding-top:18px;margin-top:28px;font:9px 'DM Mono';color:var(--muted);line-height:1.6}dialog .panel-action{display:inline-block;background:var(--accent);color:var(--paper);border:0;border-radius:30px;padding:13px 20px;font-size:12px;margin:10px 8px 0 0}.night dialog .panel-action{color:white}dialog .email-link{display:block;font-size:clamp(20px,5vw,32px);letter-spacing:-1px;text-decoration:underline;text-underline-offset:6px;margin:25px 0}dialog ul{list-style:none;padding:0}dialog li{font-size:13px;line-height:1.6;padding:10px 0;border-bottom:1px solid var(--line);color:var(--muted)}dialog li strong{color:var(--ink)}dialog #copy-result{font-size:12px}
@media(min-width:1600px){.scene-heading{top:7%}.scene-heading p{font-size:14px}.edition{font-size:10px}.object-label{font-size:10px}}@media(max-width:1050px){.control-caption{display:none}footer{gap:14px}.dock button{padding:11px 14px}.signature>span{font-size:6px}.edition-number{display:none}.paper{inset:20px 20px 32px;padding:12px}.paper strong{margin-top:10px}.paper em{margin-top:2px}}
@media(max-width:650px){body{grid-template-rows:64px minmax(310px,1fr)120px}header{margin:0 5%;gap:14px}.wordmark{font-size:33px}.wordmark span{font-size:17px}.signature strong{font-size:14px}.signature>span{display:none}.header-right{gap:10px}.quiet{font-size:0;width:34px;height:40px}.quiet span{font-size:22px;margin:0}.about-button{padding:9px 12px;font-size:10px;min-height:40px}.about-button span{margin-left:8px}#playground{height:calc(100svh - 184px);min-height:310px;margin:0 3%}.scene-heading{top:5%;left:3%}.edition{font-size:5.7px;gap:5px}h1{font-size:17.7vw;margin:24px 0 16px;letter-spacing:-.085em}.asterisk{right:-.1em;top:-.45em}.scene-heading p{font-size:9px;line-height:1.5}.specimen{width:clamp(110px,33.7vw,160px);height:clamp(110px,33.7vw,160px)}.object-label{font-size:7px;padding:5px 7px;bottom:0;gap:4px}.object-label>span{font-size:6px}.note-object{display:none}.coordinate{display:none}#portal{width:100px;height:116px;left:77%;top:57%}.portal-rings{width:80px;height:80px}.portal-rings i:nth-child(2){inset:8px}.portal-rings i:nth-child(3){inset:18px}.portal-rings>span{font-size:28px}.portal-label{font-size:4.5px;margin-top:8px}.scene-bottom{bottom:10px;left:4%;right:4%}.instruction{gap:7px}.instruction .hand{font-size:23px}.instruction p{font-size:8px}.scene-readout{font-size:6px}footer{margin:0 5%;padding:9px 0;gap:6px;flex-wrap:wrap;justify-content:center;align-content:center}.dock{width:100%;justify-content:center;padding:4px}.dock button{min-height:40px;padding:8px 12px;font-size:11px}.dock button>span:first-child{font-size:16px;margin-right:5px}.utility{margin-right:auto;gap:5px}.utility button{width:39px;height:39px;font-size:16px}.direct-contact{font-size:10px;padding:10px 0}.shuffle-label{display:none}#toast{bottom:130px;font-size:10px}dialog{padding:38px 25px}dialog h2{font-size:42px}dialog p{font-size:14px}}
@media(max-width:650px) and (max-height:700px){.specimen{width:110px;height:110px}h1{font-size:15.5vw;margin:16px 0 12px}.scene-heading{top:4%}.scene-heading p{font-size:8px}#portal{top:57%;left:79%}.portal-rings{width:65px;height:65px}.portal-label{font-size:4px}.object-label{font-size:6px;padding:4px 6px}}
@media(max-width:350px){.signature{display:none}.dock button{padding:8px 9px}.about-button{padding:8px}.scene-readout{font-size:5.5px}.utility button{width:36px;height:36px}.direct-contact{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}body.calm *{transition:none!important;animation:none!important}

@media(max-width:650px) and (max-height:700px){.scene-heading p{display:none}#portal{top:68%;left:50%}}
/* Keep the dismissal control visible while long exhibit text scrolls. */
dialog{overflow:hidden}#detail-content{overflow-y:auto;max-height:calc(85svh - 92px);padding-right:10px;scrollbar-width:thin;scrollbar-color:var(--muted) var(--paper)}#close{z-index:2;background:var(--paper);border-radius:50%}@media(max-width:650px){#detail-content{max-height:calc(85svh - 78px)}}