:root{color-scheme:dark;--cream:#eee9db;--muted:#a7aaa1;--gold:#cead77;--line:#ffffff24;--ink:#080b0a;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--cream);overflow:hidden}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#171b17b8;border-radius:3px;padding:11px 15px;font-size:12px;transition:background .2s,border-color .2s}button:hover{background:#33392cbf;border-color:#b8a785}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #e6c58b;outline-offset:4px}button.primary{background:#d5bd8b;color:#171b18;border-color:#d5bd8b}.primary:hover{background:#ecd4a2}.primary span{float:right;margin-left:22px}[hidden]{display:none!important}#experience,#scene{width:100%;height:100dvh;position:absolute;inset:0}#scene{display:block;touch-action:none;outline:none}#veil{position:absolute;inset:0;background:#f6edda;opacity:0;pointer-events:none;z-index:4}.masthead{position:absolute;top:30px;left:34px;display:flex;gap:15px;align-items:center;pointer-events:none}.brand{font-family:Georgia,serif;display:grid;place-items:center;border:1px solid #cfb98968;border-radius:50%;width:43px;height:43px;color:#d2bd8d;text-decoration:none;pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:2.1px;font-weight:400;color:var(--gold);text-transform:uppercase}h1{font-family:Georgia,serif;font-weight:400;font-size:20px;letter-spacing:.2px;margin:6px 0 0}.settings{position:absolute;top:35px;right:32px;display:flex;gap:7px}.settings button{background:#0a0d0b96;padding:9px 12px;font-size:10px}.settings button[aria-pressed=true]{color:var(--gold);border-color:#c4a86b75}.chapter{position:absolute;right:36px;top:130px;display:flex;align-items:center;gap:12px;font-size:10px;color:#aca38f;letter-spacing:1px}.chapter-line{width:60px;height:1px;background:#b4a27c60}.glass{background:linear-gradient(120deg,#101610ec,#0b100ef3);border:1px solid #afaa8b2e;box-shadow:0 14px 80px #0005;backdrop-filter:blur(13px)}.setup{position:absolute;left:7%;top:50%;transform:translateY(-42%);width:390px;padding:30px}.setup h2{font:400 52px/.99 Georgia,serif;letter-spacing:-1.2px;margin:24px 0}.setup h2 em{font-weight:400;color:#b5d0bf}.setup p{font-size:13px;line-height:1.8;color:#b9bdb2}.start-actions{display:grid;gap:9px;margin:25px 0 17px}.start-actions button{text-align:left;padding:15px}.setup p.fine{font-size:10px;line-height:1.6;color:#91968c;margin-bottom:0}.loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:24px 30px;min-width:280px;z-index:6}.loading p{font-size:14px}.loading progress{width:100%;height:3px;accent-color:var(--gold)}body.ready .loading{display:none}.dialogue{position:absolute;left:34px;bottom:62px;width:min(490px,calc(100% - 68px));padding:21px 24px}.speaker-row{display:flex;justify-content:space-between;align-items:center}.speaker-row .eyebrow{font-size:9px}#speech-indicator{color:#a9c3ac;font-size:18px;opacity:.4}.speaking #speech-indicator{opacity:1;animation:breathe 1s infinite}#caption{font:400 20px/1.4 Georgia,serif;letter-spacing:.1px;margin:13px 0 16px}.feedback{font-size:12px;line-height:1.5;color:#d8c6a5;margin:10px 0}.choices{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.choices button{background:#b3a67b0c;border-color:#b9a37356;padding:11px 14px;text-align:left}.answer-row{display:flex;gap:6px}input{min-width:0;flex:1;padding:12px 10px;color:#e6e8de;border:1px solid var(--line);border-radius:3px;background:#0408057a;font-size:12px}input::placeholder{color:#838d82}#submit{font-size:20px;padding:4px 14px}#listen{font-size:11px;padding:8px}#listen.listening{background:#704a37;border-color:#d3a375}.text-action{border:0;background:none;padding:8px 0 0;color:#b5bda9;font-size:10px;margin-right:15px}.text-action:hover{background:none;color:var(--cream)}.passage{width:100%;text-align:left;margin:6px 0}.footer{position:absolute;bottom:24px;left:34px;right:34px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.4px;color:#9a9d8e}.footer span:last-child{color:#989583}#audio-status{position:absolute;right:32px;bottom:62px;max-width:290px;color:#c0b99f;font-size:10px;line-height:1.6;background:#050807bb;border-radius:3px;padding:7px 10px}#audio-status:empty{display:none}#transcript-review{font-size:11px;color:#cbbd99;padding-top:8px}#transcript-review button{padding:8px}#cinematic-caption{position:absolute;bottom:14%;left:0;right:0;text-align:center;pointer-events:none;text-shadow:0 2px 10px #000}#cinematic-caption p{font:24px Georgia,serif;letter-spacing:.5px}.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}#touch-controls{display:none;position:absolute;right:20px;top:45%;gap:5px}#touch-controls button{width:37px;height:40px;padding:0;background:#0c110ac9}body[data-room="3"] .chapter{color:#b7ad99}@keyframes breathe{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(pointer:coarse){#touch-controls{display:flex}}@media(max-width:650px){.masthead{top:19px;left:19px;gap:10px}.brand{width:34px;height:34px;font-size:13px}h1{font-size:17px;margin-top:3px}.eyebrow{font-size:8px;letter-spacing:1.5px}.settings{top:82px;left:19px;right:auto;gap:5px}.settings button{font-size:9px;padding:7px 9px}.chapter{top:27px;right:19px;font-size:9px;gap:6px}.chapter-line{width:22px}.setup{width:calc(100% - 38px);max-width:390px;left:19px;top:auto;bottom:48px;transform:none;padding:24px}.setup h2{font-size:44px;margin:17px 0}.setup p{font-size:12px}.dialogue{left:14px;bottom:47px;width:calc(100% - 28px);padding:16px 18px;max-height:48dvh;overflow-y:auto}#caption{font-size:17px;line-height:1.3;margin:10px 0 12px}.choices{gap:6px}.choices button{font-size:11px;padding:9px 11px}.footer{bottom:16px;left:19px;right:19px;font-size:8px}.footer #instructions{display:none}#audio-status{top:120px;bottom:auto;left:19px;right:19px;max-width:none;font-size:9px;padding:5px 8px}#cinematic-caption{bottom:16%}#cinematic-caption p{font-size:20px}#touch-controls{top:39%;right:14px;display:flex}.loading{max-width:85%}}

.question-instructions{font-size:12px;line-height:1.6;color:#b6c6af;border-left:1px solid #ad986b;padding-left:12px;margin:12px 0 0}

/* Compact screens reserve separate space for the world and its conversation.
   The canvas bounds are measured in journey.js; UI never scales with DPR. */
body[data-layout="portrait"] .dialogue{bottom:max(34px,env(safe-area-inset-bottom));left:12px;width:calc(100% - 24px);padding:13px 16px;max-height:39dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
body[data-layout="portrait"] .setup{bottom:34px;max-height:56dvh;overflow:auto}
body[data-layout="portrait"] #caption{font-size:17px;line-height:1.3;margin:7px 0 10px}
body[data-layout="portrait"] .question-instructions{font-size:11px;line-height:1.45;margin:8px 0 0}
body[data-layout="portrait"] .choices button{min-height:42px}
body[data-layout="portrait"] #touch-controls{gap:5px}
body[data-layout="portrait"] #touch-controls button,body[data-layout="landscape"] #touch-controls button{width:44px;height:44px}
body[data-layout="portrait"] .footer{bottom:12px}
body[data-layout="portrait"] #cinematic-caption{bottom:25px;padding:0 16px}
body[data-layout="landscape"] .masthead{top:16px;left:18px;gap:10px}
body[data-layout="landscape"] .brand{width:34px;height:34px;font-size:13px}
body[data-layout="landscape"] h1{font-size:17px;margin:3px 0 0}
body[data-layout="landscape"] .eyebrow{font-size:8px;letter-spacing:1.5px}
body[data-layout="landscape"] .settings{top:18px;right:14px;left:auto;gap:5px}
body[data-layout="landscape"] .settings button{font-size:9px;padding:8px 9px;min-height:34px}
body[data-layout="landscape"] .chapter{right:18px;top:auto;bottom:10px;font-size:8px;gap:6px}
body[data-layout="landscape"] .chapter-line{width:22px}
body[data-layout="landscape"] .dialogue,body[data-layout="landscape"] .setup{left:auto;right:14px;top:70px;bottom:auto;transform:none;width:296px;max-height:calc(100dvh - 100px);padding:13px 16px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;box-shadow:none}
body[data-layout="landscape"] .setup h2{font-size:32px;margin:12px 0}
body[data-layout="landscape"] .setup p{font-size:11px;line-height:1.5}
body[data-layout="landscape"] .start-actions{margin:12px 0;gap:7px}
body[data-layout="landscape"] .start-actions button{padding:11px}
body[data-layout="landscape"] #caption{font-size:17px;line-height:1.3;margin:8px 0 10px}
body[data-layout="landscape"] .question-instructions{font-size:11px;line-height:1.45;margin:7px 0}
body[data-layout="landscape"] .choices{gap:5px}
body[data-layout="landscape"] .choices button{font-size:10px;padding:9px 10px;min-height:36px}
body[data-layout="landscape"] input{font-size:11px;padding:10px 8px}
body[data-layout="landscape"] #listen{padding:6px;font-size:10px}
body[data-layout="landscape"] #submit{padding:4px 10px}
body[data-layout="landscape"] .footer{bottom:12px;left:18px;right:auto;font-size:8px}
body[data-layout="landscape"] .footer #instructions{display:none}
body[data-layout="landscape"] #audio-status{left:18px;right:336px;top:57px;bottom:auto;max-width:none;margin:0;padding:4px 6px;font-size:9px}
body[data-layout="landscape"] #cinematic-caption{left:12px;right:326px;bottom:20px}
body[data-layout="landscape"] #cinematic-caption p{font-size:16px}

/* Constrain replaced canvas dimensions immediately during mobile rotation. */
html,body{width:100%;height:100%;overflow:hidden}
#experience{position:fixed;overflow:hidden}
#scene{max-width:100%}
body[data-layout="landscape"][data-phase="introduction"] #cinematic-caption{right:12px}

body[data-layout="portrait"] .masthead{top:19px;left:19px;gap:10px}
body[data-layout="portrait"] .brand{width:34px;height:34px;font-size:13px}
body[data-layout="portrait"] h1{font-size:17px;margin-top:3px}
body[data-layout="portrait"] .eyebrow{font-size:8px;letter-spacing:1.5px}
body[data-layout="portrait"] .settings{top:82px;left:19px;right:auto;gap:5px}
body[data-layout="portrait"] .settings button{font-size:9px;padding:7px 9px}
body[data-layout="portrait"] .chapter{top:27px;right:19px;font-size:9px;gap:6px}
body[data-layout="portrait"] .chapter-line{width:22px}
body[data-layout="portrait"] .setup{width:calc(100% - 38px);max-width:390px;left:19px;top:auto;transform:none;padding:24px}
body[data-layout="portrait"] .setup h2{font-size:44px;margin:17px 0}
body[data-layout="portrait"] .setup p{font-size:12px}
body[data-layout="portrait"] .footer{left:19px;right:19px;font-size:8px}
body[data-layout="portrait"] .footer #instructions{display:none}
body[data-layout="portrait"] #audio-status{top:120px;bottom:auto;left:19px;right:19px;max-width:none;font-size:9px;padding:5px 8px}
body[data-layout="portrait"] #touch-controls,body[data-layout="landscape"] #touch-controls{display:flex}

/* Conversation and exploration remain available without resetting one another. */
body[data-layout="desktop"] .dialogue{max-height:calc(100dvh - 190px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.room-tools{position:absolute;right:32px;top:174px;padding:11px 12px;max-width:300px}
.room-tools>div{display:flex;gap:7px}
.room-tools button{font-size:11px;padding:10px 11px;min-height:40px}
.room-tools p{margin:8px 0 0;color:#a7b1a0;font-size:10px;line-height:1.4}
.reflection-summary{margin:13px 0 16px;padding-top:11px;border-top:1px solid var(--line);font-size:12px;line-height:1.5}
.reflection-summary dt{color:var(--gold);font-size:10px;letter-spacing:.5px;margin-top:9px}
.reflection-summary dt:first-child{margin-top:0}
.reflection-summary dd{margin:3px 0 0;color:#d7dbcf;overflow-wrap:anywhere}
body[data-layout="portrait"] .room-tools{left:19px;right:19px;top:116px;max-width:none;padding:9px 10px}
body[data-layout="portrait"] .room-tools>div{justify-content:space-between}
body[data-layout="portrait"] .room-tools button{min-height:40px;font-size:11px;padding:9px 13px}
body[data-layout="portrait"][data-room="3"][data-phase="question"] #audio-status{top:202px}
body[data-layout="landscape"] .room-tools{left:18px;right:336px;top:60px;max-width:none;padding:7px 9px}
body[data-layout="landscape"] .room-tools button{font-size:10px;padding:7px 10px;min-height:32px}
body[data-layout="landscape"] .room-tools p{font-size:9px;margin-top:5px}
body[data-layout="landscape"][data-room="3"][data-phase="question"] #audio-status{top:133px}
body[data-layout="landscape"][data-exploring="true"] .room-tools{right:18px;width:max-content}
body[data-layout="landscape"] .reflection-summary{font-size:11px}

/* Three soft pulses invite narration without requiring sound or ongoing motion. */
#mute.sound-cue{color:#e4cf9f;border-color:#bda775;animation:sound-invitation 2.4s ease-in-out 3}
@keyframes sound-invitation{0%,100%{box-shadow:0 0 0 0 #cead7700}50%{box-shadow:0 0 0 3px #cead7738}}
body[data-reduced-motion="true"] #mute.sound-cue{animation:none}
@media(prefers-reduced-motion:reduce){#mute.sound-cue{animation:none}}

/* A quiet, always available exit to Eoin's CV; independent of loading/gates. */
.cv-link{position:absolute;right:32px;top:88px;min-height:40px;display:flex;align-items:center;gap:20px;padding:9px 13px;color:var(--cream);background:#0a0d0bbf;border:1px solid #cead7766;border-radius:3px;font-size:11px;text-decoration:none}
.cv-link:hover{background:#273028;border-color:var(--gold)}
body[data-layout="portrait"] .cv-link{right:19px;top:18px;min-height:44px;font-size:10px;padding:10px;gap:10px}
body[data-layout="portrait"] .chapter{top:64px}
body[data-layout="landscape"] .cv-link{right:18px;top:auto;bottom:8px;min-height:34px;font-size:10px;padding:7px 10px;gap:10px}
body[data-layout="landscape"] .chapter{right:152px;bottom:17px}
body[data-layout="landscape"] .dialogue,body[data-layout="landscape"] .setup{max-height:calc(100dvh - 118px)}

/* The Witness delivers a small dossier in the existing conversation dock. */
.portfolio-dossier{margin:15px 0 18px;padding-top:16px;border-top:1px solid #a6d7d247;font-size:12px;line-height:1.6}
.dossier-heading .eyebrow{color:#a7d2c8;font-size:8px;letter-spacing:1.6px}
.dossier-heading h2{font:400 30px/1.15 Georgia,serif;margin:7px 0 3px}
.dossier-heading p{color:var(--gold);margin:0 0 12px;font-size:11px}
#dossier-intro{color:#d3dace;margin:0 0 8px}
#dossier-context{color:#9eafa6;font-size:11px;margin:14px 0 4px}
.dossier-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-bottom:17px}
.action-link{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:10px 13px;border:1px solid #b0c3b647;background:#14201d99;border-radius:3px;color:var(--cream);text-decoration:none;font-size:11px}
.action-link.primary{color:#101a17;background:#b7d6c8;border-color:#b7d6c8}
.action-link:hover{border-color:#cde5db;background:#2c4037}.action-link.primary:hover{background:#d5eade}
.text-link{color:#b5c9bf;font-size:11px;text-underline-offset:4px;padding:10px 4px}
.dossier-projects{display:grid;gap:12px}
.dossier-project{padding:15px 17px;background:linear-gradient(130deg,#17241e6b,#0b151168);border:1px solid #8aada438;border-left:2px solid #a1cabc66;border-radius:2px}
.dossier-project h3{font:400 22px/1.2 Georgia,serif;margin:4px 0 9px}
.dossier-project p{margin:8px 0;color:#c2cfc4;line-height:1.6}
.dossier-project .project-field{color:#b7c3a5;font-size:9px;letter-spacing:.6px;margin:0}
.dossier-project .project-outcome{color:#9daa9f;font-size:11px}
.project-evidence{font-size:10px;line-height:1.6;color:#99aea3;margin:9px 0}
.project-evidence summary{cursor:pointer;padding:4px 0;color:#b5c9bf}
.project-evidence p{font-size:10px}
.project-link{display:inline-flex;align-items:center;min-height:44px;color:#cce2d6;font-size:11px;text-underline-offset:4px}
body[data-layout="portrait"] .portfolio-dossier,body[data-layout="landscape"] .portfolio-dossier{padding-top:12px;font-size:11px;margin:12px 0}
body[data-layout="portrait"] .dossier-heading h2,body[data-layout="landscape"] .dossier-heading h2{font-size:26px}
body[data-layout="portrait"] .dossier-project,body[data-layout="landscape"] .dossier-project{padding:12px 13px}
body[data-layout="landscape"] .dossier-actions{gap:6px;padding-bottom:13px}
body[data-layout="landscape"] .action-link{font-size:10px;padding:8px 10px;gap:10px}
/* Compact docks lead with evidence and actions; the short introduction remains
   in the optional narration, with the selection context visible below the name. */
body[data-layout="portrait"] #dossier-intro,body[data-layout="landscape"] #dossier-intro{display:none}
body[data-layout="portrait"] .dossier-projects::before,body[data-layout="landscape"] .dossier-projects::before{content:'Projects · scroll to explore ↓';font-size:9px;line-height:1.4;color:#a9bdb2}
