/* A softer studio: rounded type, warm porcelain and small tactile details. */
:root{--font-body:'Nunito',Arial,sans-serif;--font-display:'Fredoka','Nunito',sans-serif;--ui-paper:#fff7e9;--ui-ink:#244a3f;--ui-edge:#dedbc9;--lime:#c9dcb6;--soft-peach:#f6b58e;--soft-coral:#df7958;--soft-sage:#dfebd2;--soft-lilac:#ebe2f1;--soft-shadow:0 12px 34px #253e3217,0 2px 3px #253e3209;--ui-ease:cubic-bezier(.22,1,.36,1)}
body,button,input,textarea,select,.arrival-intro{font-family:var(--font-body)}
button,input,textarea,select{font-size:14px}
h1,h2,h3,.opening-arrival strong,.room-current strong{font-family:var(--font-display);font-weight:600;letter-spacing:-.025em}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button,select{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #bf674b;outline-offset:4px}
button{transition:background-color .25s,color .25s,box-shadow .35s,translate .35s var(--ui-ease)}
svg{stroke-linecap:round;stroke-linejoin:round}
dialog::backdrop{background:#193c325c;backdrop-filter:blur(5px)}
dialog{border:1px solid #e0decd;box-shadow:0 28px 90px #152d313b;color:var(--ui-ink)}
::selection{background:#f4b793;color:#244a3f}

/* A typographic welcome. The real loading progress and skip button stay intact. */
.arrival-intro{--arrival-paper:#fff6e6;--arrival-ink:#23493e;padding:28px clamp(24px,5vw,80px) 46px;background:var(--arrival-paper)}
.arrival-top{position:relative;z-index:1}
.arrival-byline{font-size:15px;font-weight:800;color:var(--ui-ink)}
.arrival-byline small{font-size:12px;color:#656e5f;font-weight:500}
.arrival-intro #arrival-skip{background:#e5ebd5;border:1px solid #d4dfc1;border-radius:24px;min-height:48px;padding:0 21px;font-size:13px;font-weight:800;gap:20px}
.arrival-identity{width:min(740px,85vw);position:relative;margin:12px 0 24px}
.arrival-title{font:600 clamp(80px,10vw,150px)/.84 var(--font-display);letter-spacing:-.035em;animation:none;color:var(--ui-ink);width:auto}
.arrival-title .name-line{display:block;width:fit-content;margin-inline:auto;animation:soft-name-in .8s var(--ui-ease) both}
.arrival-title .name-line+ .name-line{color:var(--soft-coral);margin-top:12px;animation-delay:.13s;rotate:-3deg}
.arrival-title .name-dot{color:#88a972}
.arrival-role{font:600 17px/1.6 var(--font-body);color:#626e59;margin-top:34px;animation:arrival-soft .7s .4s both;display:block}
.arrival-mascot{width:76px;height:76px;margin:0 auto 32px;padding:8px;border-radius:27px;background:#e6ecd7;box-shadow:0 5px 0 #cfdcbd;rotate:8deg;animation:soft-host-in .7s .15s var(--ui-ease) both}
.arrival-mascot svg{display:block;width:100%;height:100%}
.arrival-bottom{width:min(320px,100%);min-height:60px}
.arrival-load{font-size:13px;color:#606f5d;margin-bottom:12px}
#arrival-percent{font-weight:800;font-size:14px;color:#244a3f}
.arrival-track{height:7px;border-radius:8px;background:#e7e4d4}
.arrival-track i{border-radius:8px;background:#9bb584}
.arrival-intro button:focus-visible{outline:3px solid #ba684c}
@keyframes soft-name-in{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes soft-host-in{from{opacity:0;transform:translateY(10px) rotate(-12deg)}to{opacity:1;transform:none}}

/* Film captions retain their original scroll timing. */
.opening-top,.opening-bottom,.opening-kicker,.thought-marker{font-family:var(--font-body);font-weight:700;letter-spacing:.03em}
.opening-copy h2,.opening-thought h2{font-family:var(--font-display);font-weight:550;letter-spacing:-.025em;line-height:1.08}
.opening-copy h2 em,.opening-thought em{font-family:inherit;font-style:normal;font-weight:600;color:#f7be99}
.opening-copy p{font-size:16px;font-weight:600;line-height:1.7}
.opening-arrival strong{font-family:var(--font-display);font-weight:600;letter-spacing:-.025em}
#skip-opening,#play-opening{border-radius:24px;background:#fff6e6;color:#23493e;box-shadow:0 5px 0 #d4ddbc;font-family:var(--font-body);font-weight:800;border:0;min-height:48px;padding:10px 22px}
.thought-marker:before{height:6px;border-radius:10px;background:#e8ae86;width:24px}
.opening-progress{height:5px;border-radius:5px}.opening-progress i{background:#f4b28a}

/* The 3D world stays the visual focus; the interface becomes a set of soft objects. */
#studio-shell>header{border-radius:25px;background:#fff8ecf7!important;border:1px solid #e1dfce;box-shadow:var(--soft-shadow);padding:0 21px;gap:22px}
#studio-shell .header-title{font-family:var(--font-body);font-size:12px!important;font-weight:700;color:#50624e}
#studio-shell .header-title small{font-size:11px;color:#66735f}
#studio-shell .wordmark{width:148px}
#studio-shell .profile-link{font-weight:800;font-size:13px;color:#405a47}
#studio-shell #music-toggle{border-radius:18px;background:#ede4f2;color:#594367;font-weight:800;font-size:13px;min-width:70px;min-height:44px}
#studio-shell #guide-open{border-radius:18px;background:#284f43;border-color:#284f43;color:#fff8ed;font-size:14px;font-weight:800;box-shadow:0 3px 0 #183d32;padding:0 20px;min-height:46px}
#studio-shell .edition{font-family:var(--font-body);font-weight:700;letter-spacing:0;font-size:11px;color:#5c6b55}
#studio-shell .intro{background:#fff7e9f5;color:var(--ui-ink);border:1px solid #e0dfcd;border-radius:30px 30px 30px 10px;padding:25px 26px 24px;width:288px;max-width:288px;left:30px;bottom:144px;box-shadow:var(--soft-shadow)}
#studio-shell .intro .eyebrow{font-family:var(--font-body);font-size:10px;font-weight:800;letter-spacing:.055em;color:#657454;margin-bottom:13px}
#studio-shell .intro h1{font:600 clamp(44px,4.3vw,62px)/.9 var(--font-display);letter-spacing:-.025em;color:#244a3f;text-shadow:none}
#studio-shell .intro h1 .surname{display:inline-block;color:#cc6d4c;margin-top:4px}
#studio-shell .intro .period{color:#91ab74}
#studio-shell .intro-description{font-family:var(--font-body);font-size:13px!important;line-height:1.65;color:#5d6a55;max-width:240px;margin:17px 0}
#studio-shell .intro .enter{background:#e4ebd5;border:1px solid #d0ddbe;color:#244a3f;border-radius:17px;min-height:48px;width:100%;font-size:14px;font-weight:800;box-shadow:0 3px 0 #c8d6b5;padding:0 16px;margin-top:12px}
#studio-shell .intro .enter>span{color:#365b41;background:transparent;border-radius:0}
#studio-shell .room-tabs{background:#fff8eb;border:1px solid #dedfcd;border-radius:25px;padding:6px;gap:3px;box-shadow:var(--soft-shadow)}
#studio-shell .room-tabs>button{font-family:var(--font-body);font-weight:800;font-size:14px!important;min-height:46px;border-radius:19px;padding:0 25px;gap:9px}
#studio-shell .room-tabs>button[aria-pressed=true]{color:#244a3f}
#studio-shell .room-tabs>button[aria-pressed=false]{color:#64705c}
#studio-shell .room-tabs small{font-size:10px!important;font-weight:700;opacity:.8}
#studio-shell .nav-selection{border-radius:18px;background:#dce8cd;box-shadow:0 2px 0 #bdcfa9}
#studio-shell .room-current strong{font-family:var(--font-body);font-size:13px;font-weight:800}
#studio-shell #hint-toggle{border:1px solid #e0dfd0;border-radius:19px;min-width:48px;min-height:46px;color:#405c46;background:#fff7e9;font-family:var(--font-body);font-weight:800;box-shadow:var(--soft-shadow)}
#studio-shell .room-contact{border-radius:20px;background:#f6b38e;color:#294b3d;box-shadow:0 4px 0 #ce9474;font-family:var(--font-body);font-weight:800;font-size:14px}
#studio-shell .gallery-walk{border-radius:19px;background:#fff7e9;padding:6px;box-shadow:var(--soft-shadow);width:330px!important}
#studio-shell #gallery-section{font-family:var(--font-body);font-weight:800;font-size:13px!important;color:#375442}
#studio-shell #all-projects{font-weight:800;font-size:13px;color:#385941;border:0;border-radius:13px;background:#e3ebd6}
#studio-shell #exhibit-card{background:#fff7e9!important;border:1px solid #dfdfcc!important;border-radius:28px 28px 10px 28px;box-shadow:var(--soft-shadow)!important}
#studio-shell #exhibit-title{font-family:var(--font-display);font-weight:550;color:#284d40;letter-spacing:-.025em}
#studio-shell #exhibit-story{font-size:14px!important;line-height:1.7;color:#59674f!important}
#studio-shell #exhibit-role{font-family:var(--font-body);font-size:12px!important;color:#62724f;font-weight:700}
#studio-shell #exhibit-category,#exhibit-count{font-family:var(--font-body);font-weight:800}
#studio-shell #exhibit-card .exhibit-paging button{border-radius:14px;background:#e9eddd;border:1px solid #d1dcbd;color:#365642;min-width:44px;width:44px}
#studio-shell #exhibit-open{font-family:var(--font-body);font-weight:800;color:#285440;font-size:13px!important}
.personal-tabs{border-radius:20px!important;background:#fff7e9!important;box-shadow:var(--soft-shadow)!important}
.personal-tabs button{font-family:var(--font-body);font-weight:800;border-radius:14px!important;color:#385d44!important}
.personal-tabs button[aria-pressed=true]{background:#dfe9cf!important}
.character-hotspot{font-family:var(--font-body);font-weight:800}
.character-hotspot>span{border-radius:19px!important;background:#fff5e5!important;color:#2b5142!important;box-shadow:0 4px 0 #c8d4b7!important}
.character-hotspot small{font-family:var(--font-body);font-size:11px;font-weight:800}
.speech-bubble{border-radius:26px 26px 26px 7px!important;background:#fff7e9!important;box-shadow:var(--soft-shadow)!important}
.speech-text{font-family:var(--font-display)!important;font-weight:500;font-size:23px;line-height:1.25;color:#2a5141}
#scene-tooltip,#personal-status{font-family:var(--font-body);border-radius:15px;font-weight:700}

/* Rounded dialogs with readable type and generous touch targets. */
#studio-guide,#panda-chat,.contact-dialog,#balance-panel,#signature-story,#project-index,.record-player,#tour-panel{border-radius:30px!important;background:#fff7e9!important;color:#294e40;box-shadow:var(--soft-shadow)}
#studio-guide h2,#panda-chat h2,.contact-dialog h2,#balance-panel h2,#signature-story h2,#project-index h2,#gallery-ending h2,#tour-panel h2{font-family:var(--font-display);font-weight:550;letter-spacing:-.025em;color:#294d40;line-height:1.08}
#studio-guide h3{font-family:var(--font-body);font-size:13px;letter-spacing:0;font-weight:800;color:#667459}
#studio-guide .guide-primary button{border-radius:18px;background:#e6ecd8!important;color:#35563f!important;border-color:#d5dfc7!important;padding:14px 17px;font-size:14px;font-weight:800;min-height:52px}
#studio-guide .guide-primary #panda-tour{background:#2f5948!important;color:#fff7e9!important;border-color:#2f5948!important}
#studio-guide #guide-balance{background:#f8dbc9!important;border-color:#f0cbb2!important}
#studio-guide #guide-feedback{background:#eae1ef!important;border-color:#ded1e6!important}
#studio-guide #scene-controls button{border-radius:17px;background:#fffbf3;min-height:48px;font-family:var(--font-body);font-size:13px;font-weight:800;color:#536b4e}
#studio-guide #scene-controls button[aria-pressed=true]{background:#e4ecd5}
#studio-guide .scene-tools button,#studio-guide .explore-bar button,#studio-guide .guide-settings select{border-radius:14px;min-height:44px}
#guide-close,#panda-chat-close,.contact-close,#signature-close,#balance-close,#record-close,#tour-exit{border-radius:50%;background:#e6ecd9!important;border:0;color:#375c43;min-width:44px;min-height:44px}
.contact-dialog input,.contact-dialog textarea,#panda-input,.project-search input{font-family:var(--font-body);font-size:16px;line-height:1.55;border:1px solid #cbd5be;border-radius:16px;background:#fffdf6;color:#284d3f;padding:12px 15px;box-shadow:inset 0 2px 3px #23442e05}
.contact-topics button,.panda-questions button,.balance-choices button{font-family:var(--font-body);border-radius:16px;font-size:13px;font-weight:800;min-height:44px;border-color:#d1dcc1;color:#41623f;background:#eef0e2;padding:8px 14px}
.contact-topics button[aria-pressed=true],.balance-choices button[aria-pressed=true]{background:#d5e4bf;color:#274d3c;border-color:#adc391;box-shadow:0 2px 0 #bfd0aa}
.prepare-email,#panda-send,#panda-chat-tour,#panda-chat-contact,#balance-toggle{font-family:var(--font-body);border-radius:17px!important;background:#2c5444!important;color:#fff9ec!important;box-shadow:0 3px 0 #173d31!important;font-weight:800;min-height:48px}
.panda-chat-head{background:#e6ecd8;border-radius:29px 29px 0 0}
.panda-chat-head h2{font-size:30px}.panda-chat-note{font-family:var(--font-body);font-size:12px;color:#617052}
.panda-message{font-family:var(--font-body);font-size:15px;line-height:1.65;border-radius:20px 20px 20px 6px!important}
.panda-message.assistant{background:#e7ecd9;color:#33503d}.panda-message.user{background:#f8d8c3;color:#58432f;border-radius:20px 20px 6px 20px!important}
.panda-chat-bottom button{font-size:12px;font-weight:800;min-height:44px;border-radius:15px}
#project-index header{background:#fff7e9;border-radius:29px 29px 0 0}
#project-index-grid button{border-radius:22px!important;border:1px solid #dcdccb;overflow:hidden;background:#fffaf0;box-shadow:0 3px 0 #e5e7d7}
#project-index-grid button img{border-radius:17px 17px 8px 8px}
#project-index-grid strong{font-family:var(--font-display);font-weight:500;font-size:21px;letter-spacing:-.015em}
#project-index-grid small{font-family:var(--font-body);font-size:12px;font-weight:600}
.viewer-top,.viewer-bottom{background:#fff7e9;color:#2b503f}.viewer-stage{background:#e9eddc}
.viewer #viewer-title{font-family:var(--font-display);font-weight:550;letter-spacing:-.025em;color:#294e40}
.viewer-stage img{border-radius:13px;box-shadow:0 12px 30px #24482f13}
#viewer-close,#viewer-prev,#viewer-next{font-family:var(--font-body);font-weight:800;border-radius:16px;background:#fff9ed;color:#34513c;min-height:44px}
.viewer .viewer-link,#viewer-link{border-radius:17px;background:#2c5744;color:#fff7eb;font-weight:800}
#viewer-shots button{border-radius:14px;font-family:var(--font-body);font-weight:800;min-height:44px}
.record-player h2{font-family:var(--font-display);font-weight:500;font-size:23px}.record-player button{border-radius:16px;font-family:var(--font-body);font-weight:800}
#signature-story .signature-portrait{border-radius:28px 0 0 28px}
#gallery-ending{border-radius:28px;background:#fff7e9eF;color:#294e40;padding:26px;box-shadow:var(--soft-shadow)}
#gallery-ending button{border-radius:16px;background:#e5ecd8;color:#33513b;font-weight:800}
.discovery-tip{font-family:var(--font-body);font-weight:700;font-size:11px!important}
#contact-title,#balance-title,#tour-title,#viewer-title,#guide-title,#project-index-grid strong{font-family:var(--font-display);font-weight:550;letter-spacing:-.025em}
#contact-dialog .postcard{border-radius:18px;background:#f0ebda;border-color:#d8dac6;box-shadow:none}
#contact-dialog .postcard p,.balance-case strong{font-family:var(--font-body);font-weight:600;letter-spacing:0}
#contact-dialog label{font-family:var(--font-body);font-size:13px;font-weight:700}
.panda-input-row{border-radius:19px;border-color:#cdd8c0;background:#fffdf6}
#panda-input{font:16px/1.5 var(--font-body);border-radius:17px;min-width:0}
#project-index-grid span{font-family:var(--font-body);font-size:12px;font-weight:600}

@media(hover:hover) and (pointer:fine){
 #studio-shell button:not(:disabled):hover{translate:0 -2px;box-shadow:0 5px 0 #284c341a!important}
 #studio-shell .intro .enter:hover{background:#d8e5c5;border-color:#b8cba1}
 #studio-shell #guide-open:hover{background:#3d6954;border-color:#3d6954}
 #studio-shell .room-tabs>button:hover{translate:0 0;box-shadow:none!important}
 dialog button:not(:disabled):hover{translate:0 -2px;box-shadow:0 4px 0 #29433112}
 #studio-shell .exhibit-paging button:hover{background:#d7e3c8}
 .arrival-intro #arrival-skip:hover{background:#d8e6c7;color:#23493e;border-color:#c3d5ac}
 #project-index-grid button:hover{translate:0 -4px;box-shadow:0 8px 22px #284d3915}
}
button:active{translate:0 1px}
@media(max-width:1100px) and (min-width:761px){#studio-shell .intro{width:250px;max-width:250px;padding:22px}#studio-shell>header{gap:16px}#studio-shell .intro h1{font-size:53px}}
@media(max-width:760px){
 .arrival-intro{padding:22px 22px max(35px,env(safe-area-inset-bottom))}.arrival-byline{font-size:13px}.arrival-byline small{font-size:11px}.arrival-intro #arrival-skip{font-size:12px;padding:0 14px;gap:10px;border-radius:19px}
 .arrival-identity{width:100%;margin:16px 0 24px}.arrival-title{font-size:clamp(67px,21vw,110px)}.arrival-role{font-size:15px;max-width:260px;margin:28px auto 0}.arrival-mascot{width:64px;height:64px;border-radius:22px;margin-bottom:28px}
 .opening-copy h2{font-size:clamp(36px,10.8vw,64px);line-height:1.05}.opening-copy p{font-size:14px}.opening-thought h2{font-size:clamp(34px,10vw,60px);line-height:1.1}
 #studio-shell>header{border-radius:21px;padding:0 11px;gap:9px;top:max(12px,env(safe-area-inset-top));height:60px}
 #studio-shell .wordmark{width:115px}#studio-shell #music-toggle{min-width:44px;font-size:12px;border-radius:15px;padding:0 9px}#studio-shell #guide-open{min-height:44px;font-size:12px;border-radius:15px;padding:0 12px;gap:10px}
 #studio-shell .intro{left:18px;bottom:130px;width:191px;max-width:191px;padding:17px 18px 19px;border-radius:25px 25px 25px 8px}
 #studio-shell .intro h1{font-size:40px!important;line-height:.91}#studio-shell .intro .eyebrow{font-size:8px;margin-bottom:10px;letter-spacing:.025em}
 #studio-shell .intro .enter{width:100%;min-height:45px;font-size:12px;margin-top:16px;border-radius:14px;padding:0 11px}
 #studio-shell .room-navigation{bottom:max(14px,env(safe-area-inset-bottom));height:58px;gap:7px}#studio-shell .room-tabs{padding:5px;border-radius:22px;gap:0}
 #studio-shell .room-tabs>button{font-size:12px!important;padding:0 11px;min-height:46px;border-radius:17px;gap:5px}#studio-shell .room-tabs small{display:none}#studio-shell .nav-selection{border-radius:16px}
 #studio-shell #hint-toggle{width:45px;min-width:45px;min-height:48px;border-radius:18px}
 #studio-shell .gallery-walk{width:calc(100% - 28px)!important;border-radius:18px;min-height:48px}#studio-shell #gallery-section{font-size:12px!important}#studio-shell #all-projects{font-size:12px;min-height:40px}
 #studio-shell #exhibit-card{border-radius:23px 23px 8px 23px;bottom:88px;padding:18px!important}#studio-shell #exhibit-title{font-size:28px}
 #studio-shell #exhibit-role{font-size:11px!important}#studio-shell #exhibit-open{font-size:12px!important}
 #studio-guide{border-radius:26px!important;padding:24px 21px;max-height:calc(100dvh - 28px)}#studio-guide #guide-title{font-size:36px}
 #studio-guide .guide-primary button{font-size:13px;padding:12px 14px}
 #panda-chat,.contact-dialog,#signature-story,#project-index{border-radius:25px!important;max-width:calc(100vw - 24px)}
 #project-index h2{font-size:32px}.panda-chat-head{border-radius:24px 24px 0 0}.panda-chat-head h2{font-size:27px}
 #signature-story .signature-portrait{border-radius:24px 24px 0 0}
 .viewer #viewer-title{font-size:28px}.contact-dialog h2{font-size:36px}.contact-topics button{font-size:12px;padding:8px 12px}
 #contact-dialog .contact-fields{grid-template-columns:1fr;gap:12px}#contact-title{font-size:36px}
 .personal-tabs{max-width:calc(100% - 28px);border-radius:18px!important}.personal-tabs button{font-size:12px!important}
 #gallery-ending{padding:22px;border-radius:24px}#gallery-ending h2{font-size:32px}
}
@media(max-width:350px){
 .arrival-byline{font-size:12px}.arrival-intro #arrival-skip{font-size:11px;padding:0 11px;gap:6px}.arrival-role{font-size:14px}
 #studio-shell .wordmark{width:101px}#studio-shell>header{gap:6px}#studio-shell #guide-open{padding:0 9px;gap:6px}#studio-shell .room-tabs>button{font-size:11px!important;padding:0 8px}
 #studio-shell .intro{width:181px;max-width:181px;padding:16px}.panda-chat-head h2{font-size:24px}
}
@media(max-height:540px){
 .arrival-intro{padding:12px 28px 20px}.arrival-identity{width:min(500px,80vw);margin:10px 0}.arrival-title{font-size:66px;line-height:.9}.arrival-title .name-line{display:inline-block}.arrival-title .name-line+.name-line{margin:0 0 0 12px}.arrival-mascot{display:none}.arrival-role{font-size:13px;margin-top:16px}.arrival-bottom{min-height:35px}.arrival-load{min-height:24px;margin-bottom:7px}
 #studio-shell .intro{width:207px;max-width:207px;padding:17px;bottom:88px;left:24px;border-radius:23px}.intro-description{display:none}#studio-shell .intro h1{font-size:34px!important}#studio-shell .intro .eyebrow{display:none}#studio-shell .intro .enter{min-height:44px;margin-top:12px;font-size:12px}
 #studio-shell>header{height:54px;top:9px;border-radius:19px}#studio-shell .gallery-walk{top:75px}#studio-shell .room-navigation{bottom:10px}
 .opening-copy h2{font-size:38px}.opening-thought h2{font-size:34px}.opening-reduced .opening-thought h2{font-size:24px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important}
 .arrival-title .name-line,.arrival-mascot,.arrival-role,.arrival-bottom{animation:none!important}
 button,a,.nav-selection,.viewer-stage img{transition:none!important}
 button:hover,dialog button:hover,#project-index-grid button:hover{translate:none!important}
}