@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:wght@400;500;600&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400&display=swap');
:root{color-scheme:dark;--night:#0f0f1c;--ink:#ece6d8;--muted:#b8b0a4;--fire:#e8a849;--rule:#ffffff24;--serif:'Crimson Pro',Georgia,serif;--sans:Inter,system-ui,sans-serif;--mono:'JetBrains Mono',monospace}
*{box-sizing:border-box}body{margin:0;background:var(--night);color:var(--ink);font-family:var(--sans);font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--fire);outline-offset:6px}button:disabled{opacity:.3;cursor:default}[hidden]{display:none!important}.skip-link{position:fixed;left:20px;top:-100px;z-index:100;padding:14px;background:var(--night)}.skip-link:focus{top:12px}
#campus{position:relative;height:100svh;min-height:500px;overflow:hidden}.scene-scroll{height:100%;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}.scene-scroll::-webkit-scrollbar{display:none}.scene-plane{position:relative;width:max(100%,calc(100svh * 1.778723));height:100%;min-height:500px}.scene-image{position:absolute;width:100%;height:100%;object-fit:fill;display:block}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(6,9,15,.72),transparent 24%,transparent 72%,rgba(6,9,15,.85))}.campus-header{position:absolute;top:0;left:0;right:0;padding:32px 40px;display:flex;justify-content:space-between;align-items:start;pointer-events:none}.campus-header>*{pointer-events:auto}.wordmark{font:500 30px var(--serif);text-shadow:0 2px 12px #000}.wordmark span{display:block;font:12px var(--mono);letter-spacing:.08em;color:#ded4c7;margin-top:5px}.quiet-button{border:1px solid #ffffff35;background:#0f0f1c88;border-radius:30px;padding:12px 18px;font-size:14px;backdrop-filter:blur(12px)}.quiet-button:hover{background:#282027dd;border-color:var(--fire)}.campus-bottom{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);text-align:center;width:max-content;max-width:95%;text-shadow:0 2px 15px #000}.arrival-message{font:400 24px var(--serif);margin:0 0 15px}.door-nav{display:flex;align-items:center;justify-content:center;gap:20px;font-size:15px}.door-nav a{padding:8px 12px;border-bottom:1px solid transparent}.door-nav a:hover{border-color:var(--fire)}.door-nav span{color:var(--fire)}.look-hint{font:12px var(--mono);letter-spacing:.04em;color:#c8bbab;margin:12px 0 0}.touch-hint{display:none}
.portal{position:absolute;top:32%;height:39%;width:8.5%;z-index:2;isolation:isolate}.portal-read{left:7.7%}.portal-learn{left:46.3%;top:37%;height:33%}.portal-play{left:85.7%;top:38%;height:33%}.door-light{position:absolute;inset:0;border:1px solid transparent;border-radius:48% 48% 2px 2px;transition:box-shadow .4s,border-color .4s,background .4s}.portal:hover .door-light,.portal:focus-visible .door-light{border-color:#ffd78a99;background:#ffc57018;box-shadow:0 0 40px #e8a84955,inset 0 0 35px #e8a84940}.portal:focus-visible{outline:none}.door-label{position:absolute;top:100%;left:50%;transform:translate(-50%,8px);font:500 29px var(--serif);text-align:center;white-space:nowrap;text-shadow:0 2px 10px #000,0 1px 4px #000;transition:color .3s}.door-label span{display:block;margin-top:3px;font:12px var(--mono);color:#e2d6c5;letter-spacing:.015em}.portal:hover .door-label{color:#ffd99b}
.arrival-overlay{position:fixed;inset:0;z-index:30;overflow:hidden;background:var(--night);opacity:1;transition:opacity 1.3s ease}.arrival-overlay.leaving{opacity:0;pointer-events:none}.approach-image{width:100%;height:100%;object-fit:cover;object-position:50% 53%;transform-origin:50% 53%;will-change:transform;animation:approach 6s cubic-bezier(.2,.5,.35,1) both}.approach-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0f0f1c22,#0f0f1c11 40%,#0f0f1caa)}.approach-title{position:absolute;left:0;right:0;bottom:13%;text-align:center;animation:title-away 4.8s ease both}.approach-title>p:not(.eyebrow){font:400 clamp(48px,7vw,90px) var(--serif);margin:8px 0 14px;letter-spacing:-.035em}.approach-title>span{font:18px var(--serif);color:#e1d8c9}.arrival-overlay>.quiet-button{position:absolute;right:30px;top:30px}.arriving .campus-header,.arriving .campus-bottom,.arriving .portal{opacity:0;pointer-events:none}.campus-header,.campus-bottom,.portal{transition:opacity 1s ease}.crossing{position:fixed;inset:0;background:#101016;z-index:40;pointer-events:none;opacity:0;transition:opacity .32s}.crossing.active{opacity:1;pointer-events:auto}@keyframes approach{from{transform:scale(1)}to{transform:scale(1.62)}}@keyframes title-away{0%{opacity:0;transform:translateY(8px)}18%,60%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-8px)}}
.room{--room-accent:#e8a849;min-height:100svh;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#46312266,transparent 68%),#111019}.room[data-room=learn]{--room-accent:#c3a6e3;background:radial-gradient(ellipse at 50% 38%,#49326199,transparent 68%),#181222}.room[data-room=play]{--room-accent:#bdd2a1;background:radial-gradient(ellipse at 50% 38%,#34472a88,transparent 68%),#121812}.room[data-room=read]{--room-image:url('assets/read-room.webp')}.room[data-room=learn]{--room-image:url('assets/learn-room.webp')}.room[data-room=play]{--room-image:url('assets/play-room.webp')}.room-landscape{position:absolute;inset:0;background:linear-gradient(180deg,#101016b3 0%,#10101652 30%,#10101626 55%,#101016a6 100%),var(--room-image) center/cover;opacity:1;pointer-events:none}.room-header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:28px 40px;gap:24px;font-size:14px}.back-link{color:#d9cbbb}.back-link:hover{color:var(--room-accent)}.room-header nav{display:flex;gap:24px}.room-header nav a{padding:8px 0;border-bottom:1px solid transparent;color:#b9b4ac}.room-header nav a[aria-current=page]{border-color:var(--room-accent);color:var(--ink)}.room-intro{position:relative;text-align:center;padding:28px 24px 15px}.eyebrow{text-transform:uppercase;font:12px var(--mono);letter-spacing:.16em;color:var(--fire);margin:0}.room-intro .eyebrow{color:var(--room-accent)}.room-intro h1{font:400 clamp(42px,5.5vw,68px) var(--serif);letter-spacing:-.025em;margin:9px 0 12px}.room-intro>p:last-child{max-width:510px;margin:0 auto;line-height:1.6;color:var(--muted)}.carousel{position:relative;max-width:1150px;margin:0 auto;padding:0 20px 30px}.shelf{position:relative;height:365px;margin:24px auto 10px;perspective:1300px;touch-action:pan-y}.selection-card{position:absolute;top:0;left:50%;width:400px;max-width:calc(100vw - 48px);height:340px;padding:32px;display:flex;flex-direction:column;align-items:start;border:1px solid #ad97743b;border-radius:5px;background:linear-gradient(145deg,#312820,#19161c);box-shadow:0 24px 65px #0007;transform-origin:center;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .4s,filter .4s;transform:translateX(-50%)}.room[data-room=learn] .selection-card{background:linear-gradient(145deg,#38264b,#20172d);border-color:#ac86cd55}.room[data-room=play] .selection-card{background:linear-gradient(145deg,#354332,#18251c);border-color:#7f986855}.selection-card .card-kicker{font:12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--room-accent);margin:0 0 19px}.selection-card h2{font:400 39px/1.05 var(--serif);letter-spacing:-.02em;margin:0 0 16px;max-width:100%}.selection-card p{margin:0 0 20px;line-height:1.65;font-size:15px;color:#cdc6bc}.selection-card .card-action{margin-top:auto;background:transparent;border:0;border-bottom:1px solid var(--room-accent);padding:8px 0;color:var(--ink);font-size:15px;text-align:left}.selection-card .card-action:hover{color:var(--room-accent)}.selection-card[data-position=left]{transform:translateX(calc(-50% - 315px)) scale(.83) rotateY(15deg);opacity:.45;filter:brightness(.75);z-index:1;cursor:pointer}.selection-card[data-position=right]{transform:translateX(calc(-50% + 315px)) scale(.83) rotateY(-15deg);opacity:.45;filter:brightness(.75);z-index:1;cursor:pointer}.selection-card[data-position=active]{z-index:3}.selection-card[data-position=hidden]{opacity:0;pointer-events:none;transform:translateX(-50%) scale(.7)}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:28px}.round-button{display:inline-grid;place-items:center;background:#ffffff06;border:1px solid #ffffff35;border-radius:50%;width:46px;height:46px;font-size:22px;line-height:1;flex-shrink:0}.round-button:hover{border-color:var(--fire);background:#ffffff0d}.dots{display:flex;gap:6px}.dots button{position:relative;width:28px;height:36px;padding:0;border:0;background:transparent}.dots button:after{content:'';display:block;width:5px;height:5px;border-radius:50%;background:#a69b8d;margin:auto;transition:all .3s}.dots button[aria-pressed=true]:after{width:20px;border-radius:5px;background:var(--room-accent)}.selection-count{text-align:center;font:12px var(--mono);color:var(--muted);margin-top:15px}.room-footer{position:relative;padding:20px 40px 26px;display:flex;justify-content:space-between;color:#968e83;font:12px var(--mono);letter-spacing:.04em}
dialog{border:1px solid #8b817855;border-radius:8px;background:#171920;color:var(--ink);width:min(940px,calc(100vw - 32px));max-height:90svh;padding:0;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#080b12cf;backdrop-filter:blur(7px)}.exhibit-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 26px;border-bottom:1px solid var(--rule);position:sticky;top:0;background:#171920;z-index:1}.exhibit-top h2{font:400 30px var(--serif);margin:0}#exhibitContent{padding:26px;line-height:1.7}#exhibitContent p{color:#c8c2b9}#exhibitContent h3{font:500 26px var(--serif);margin:0 0 10px}#exhibitContent iframe{border:0;width:100%;height:65svh;background:#f4f1ea;display:block;border-radius:5px}.principles{display:grid;gap:10px}.principles details{border-bottom:1px solid var(--rule);padding:14px 0}.principles summary{cursor:pointer;font-size:17px;color:var(--ink)}.principles details p{margin:12px 0}.analogs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.analogs button{border:1px solid var(--rule);border-radius:25px;padding:10px 15px;background:transparent;font-size:14px}.analogs button[aria-pressed=true]{border-color:var(--fire);color:var(--fire)}.analog-state{padding:22px;background:#ffffff06;border-left:2px solid var(--fire);min-height:145px}.source-note{font-size:13px;color:#b7ad9e!important}.noscript-note{position:fixed;bottom:0;z-index:100;background:var(--night);padding:20px;line-height:1.6}.noscript-note a{text-decoration:underline}
@media(max-width:700px){.campus-header{padding:22px 20px}.wordmark{font-size:26px}.wordmark span{font-size:10px;max-width:160px;line-height:1.5}.campus-header .quiet-button{font-size:12px;padding:10px 13px}.touch-hint{display:inline}.campus-bottom{bottom:22px}.arrival-message{font-size:22px}.scene-plane{width:calc(max(100svh,500px) * 1.778723)}.door-label{font-size:29px}.room-header{padding:20px;gap:14px;font-size:13px}.room-header nav{gap:17px}.room-intro{padding:28px 22px 10px}.room-intro>p:last-child{font-size:15px}.shelf{height:355px;margin-top:25px}.selection-card{width:340px;padding:27px}.selection-card h2{font-size:36px}.selection-card[data-position=left]{transform:translateX(calc(-50% - 265px)) scale(.86);opacity:.25}.selection-card[data-position=right]{transform:translateX(calc(-50% + 265px)) scale(.86);opacity:.25}.room-footer{padding:15px 22px 25px;font-size:11px}.arrival-overlay>.quiet-button{top:20px;right:20px}.exhibit-top{padding:16px}.exhibit-top h2{font-size:25px}#exhibitContent{padding:18px}.carousel{padding-bottom:15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Keep labels legible while opening up the room artwork. */
.room-header,.room-intro,.room-footer,.selection-count{text-shadow:0 2px 8px #000,0 1px 3px #000}
.room-intro>p:last-child{color:#eee5d8}.room-header nav a{color:#e4dbcf}.room-footer,.selection-count{color:#ded4c7}.room .round-button{background:#101016b3}.room .dots{background:#10101699;border-radius:24px;padding:0 8px}
