:root{--wine:#521c2b;--wine-dark:#36131e;--gold:#aa864d;--cream:#f7f2e8;--paper:#fffcf6;--ink:#342728;--muted:#746565;--line:#daccb6;--serif:Georgia,'Yu Mincho','Hiragino Mincho ProN',serif;font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;color:var(--ink);background:var(--cream);font-size:16px;line-height:1.8}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit;text-underline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif)}h2{font-size:24px;line-height:1.6}p{margin-top:12px}small,.hint{font-size:14px}.muted,.hint{color:var(--muted)}.preview-strip{padding:5px 5%;background:var(--wine-dark);color:#f4e7c9;font-size:14px;display:flex;justify-content:space-between;gap:12px}.header{max-width:1280px;margin:auto;min-height:112px;display:flex;align-items:center;justify-content:space-between;padding:22px 40px;gap:24px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;flex-direction:column;font-size:14px;letter-spacing:.12em;color:var(--wine)}.brand-en{font-family:var(--serif);font-size:25px;letter-spacing:.12em;line-height:1.5}.header nav{display:flex;gap:30px;align-items:center;font-size:14px}.header nav a{text-decoration:none}.nav-login{background:none;border:1px solid var(--wine);color:var(--wine);padding:8px 23px;font-size:14px}.hero{max-width:1200px;margin:auto;padding:80px 40px 76px;display:grid;grid-template-columns:1.2fr 1fr;gap:72px;align-items:center}.eyebrow{font-size:14px;letter-spacing:.12em;color:var(--wine);margin:0 0 20px}.hero h1{font-size:clamp(34px,3.1vw,48px);font-weight:500;line-height:1.65;letter-spacing:.035em}.intro{max-width:470px;margin-top:25px;line-height:2}.text-link{display:inline-block;font-size:14px;margin-top:26px;color:var(--wine)}.text-link span{margin-left:18px}.invitation{background:var(--wine);color:#fff8e9;padding:35px 32px;outline:1px solid var(--gold);outline-offset:-9px;box-shadow:0 15px 30px #36131e12}.section-kicker{font-family:Georgia,serif;font-size:14px;letter-spacing:.2em;color:var(--gold);display:block;margin-bottom:12px}.invitation h2{font-size:25px}.invitation p{color:#eadccb}.invitation form{margin-top:24px}.invitation .hint{color:#e4d4b7;text-align:center;margin-top:14px}label,legend{font-size:14px;font-weight:600}label[for]{display:block;margin-bottom:7px}input:not([type=radio]){width:100%;border:1px solid var(--line);border-radius:2px;padding:12px 14px;background:var(--paper);color:var(--ink);min-height:50px}#code{letter-spacing:.12em}.primary,.outline,.quiet{display:block;min-height:48px;padding:12px 18px;border-radius:2px;font-size:16px;text-align:center}.primary{background:var(--wine);color:var(--paper);border:1px solid var(--wine);width:100%}.primary:hover:not(:disabled){background:var(--wine-dark)}.invitation .primary{background:#dcc397;color:var(--wine-dark);border-color:#dcc397;font-weight:600;margin-top:15px}.invitation .primary:hover:not(:disabled){background:#ead2ab}.outline{border:1px solid var(--wine);background:transparent;color:var(--wine)}.quiet{background:transparent;border:0;color:var(--muted);text-decoration:underline;text-underline-offset:5px}.error{font-size:14px;color:#ffe3b4!important;margin-top:5px}.error:empty{display:none}.section{max-width:1120px;margin:auto}.how{text-align:center;border-top:1px solid var(--line);padding:50px 0 54px}.how h2{font-size:28px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:35px;text-align:left}.steps article{padding:0 35px;border-right:1px solid var(--line)}.steps article:last-child{border:0}.step-number{font-family:Georgia,serif;font-size:30px;color:var(--gold)}.steps h3{font-size:22px;margin-top:8px}.steps p{color:var(--muted)}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;border-top:1px solid var(--line);padding:45px 0 60px}.bottom-grid h2{font-size:23px}.news .badge{margin-top:22px}.host-guide .outline{margin-top:18px;font-size:14px}.badge{display:inline-block;border:1px solid var(--line);color:var(--wine);font-size:14px;padding:3px 12px;background:#eee4d5}.status-note{max-width:1120px;margin:0 auto 20px;color:var(--wine)}footer{background:var(--wine-dark);color:#eadcc6;text-align:center;padding:36px 20px}footer .brand-en{font-size:21px}footer p{font-size:14px}footer small{display:block;color:#cbbda7;margin-top:20px}.room-main{max-width:1200px;margin:auto;padding:25px 40px 70px}.breadcrumb{display:flex;gap:15px;font-size:14px;color:var(--muted)}.room-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 0}.room-heading .eyebrow{margin-bottom:8px}.room-heading h1{font-size:34px;line-height:1.5;font-weight:500}.room-heading p{max-width:700px}.room-role{flex-shrink:0}.room-facts{display:grid;grid-template-columns:1fr 1fr 1.4fr 1fr;background:var(--wine);color:var(--paper);padding:22px 8px;border-top:3px solid var(--gold);margin:4px 0 30px}.room-facts div{padding:0 20px;border-right:1px solid #956d70}.room-facts div:last-child{border:0}.room-facts span{display:block;font-size:14px;color:#deccb8}.room-facts strong{display:block;font-size:16px;margin-top:5px;font-weight:500}.room-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:28px;align-items:start}.panel{background:var(--paper);border:1px solid var(--line);padding:26px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.panel h2{font-size:23px}.count{font-size:14px;color:var(--wine);border:1px solid var(--line);padding:1px 10px;white-space:nowrap}.waiting-list{list-style:none;margin:22px 0 0;padding:0}.waiting-list li{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding:23px 8px}.waiting-list li.self{background:#f0e6d5;border-bottom:1px solid var(--gold)}.rank{font:28px Georgia,serif;color:var(--gold)}.person{flex:1;min-width:0;overflow-wrap:anywhere}.person strong,.person>span,.person>small{display:block}.person>span,.person>small{color:var(--muted);font-size:14px}.self-label{font-size:14px;color:var(--wine);margin-left:8px}.ticket{font-size:14px;color:var(--muted);white-space:nowrap}.your-position{background:var(--wine);color:#fff6e5;padding:18px 20px;margin-top:20px}.your-position strong,.your-position span{display:block}.your-position span{font-size:14px;margin-top:5px}.join-panel .primary{margin-top:24px}.join-panel .outline{width:100%;margin-top:12px}.join-panel .quiet{width:100%;margin-top:8px}.viewers{margin-top:24px}.viewers ul{list-style:none;padding:0;margin:15px 0 0}.viewers li{display:flex;align-items:center;gap:12px;padding:10px 0;overflow-wrap:anywhere}.initial{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;font-family:Georgia,serif;color:var(--gold);flex-shrink:0}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--gold);padding:0;width:560px;max-width:calc(100% - 32px);max-height:calc(100dvh - 32px);box-shadow:0 20px 100px #20071155}dialog::backdrop{background:#27131b99}.dialog-body{padding:32px}.dialog-body>p{color:var(--muted)}.dialog-body form{margin-top:22px}.dialog-body label small{color:var(--muted);font-weight:400;margin-left:10px}.dialog-body fieldset{border:0;padding:0;margin:24px 0}.dialog-body legend{margin-bottom:10px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{position:relative;display:flex;gap:8px;align-items:center;padding:12px;border:1px solid var(--line);font-weight:400;cursor:pointer;font-size:14px}.choice:has(input:checked){border-color:var(--wine);background:#f0e6d5}.choice input{accent-color:var(--wine);width:17px;height:17px;flex-shrink:0}.avatar-letter{display:block;font-family:Georgia,serif;color:var(--gold);font-size:22px}.avatars{margin-top:10px}.dialog-body .quiet{width:100%;font-size:14px;margin-top:8px}.dialog-body>.primary{margin-top:25px}.actions{margin-top:14px}
@media(max-width:1000px){.hero{gap:35px}.section{margin-left:40px;margin-right:40px}.room-heading{align-items:flex-start}.room-role{white-space:normal}.room-grid{grid-template-columns:1.3fr 1fr}.room-facts{grid-template-columns:1fr 1fr;gap:20px}.room-facts div:nth-child(2){border:0}.steps article{padding:0 20px}.panel{padding:20px}}
@media(max-width:650px){.preview-strip{font-size:14px;padding:6px 18px;flex-wrap:wrap;gap:0 12px}.header{padding:20px;display:block;min-height:0}.brand-en{font-size:22px}.brand{font-size:14px}.header nav{margin-top:18px;gap:23px;justify-content:space-between}.nav-login{padding:6px 15px}.hero{display:block;padding:35px 20px 40px}.hero h1{font-size:34px}.eyebrow{margin-bottom:13px;letter-spacing:.06em}.intro{margin-top:18px}.hero .text-link{margin-top:18px}.invitation{margin-top:32px;padding:30px 24px}.invitation h2{font-size:23px}.section{margin-left:20px;margin-right:20px}.how{padding:33px 0}.how h2{font-size:24px}.steps{grid-template-columns:1fr;margin-top:24px}.steps article{padding:21px 4px;border-right:0;border-bottom:1px solid var(--line)}.steps article:first-child{padding-top:0}.steps h3{display:inline-block;margin-left:15px}.steps p{margin-top:6px}.bottom-grid{grid-template-columns:1fr;gap:32px;padding:32px 0 40px}.host-guide{border-top:1px solid var(--line);padding-top:30px}.bottom-grid h2{font-size:23px}.room-main{padding:20px 20px 40px}.room-heading{display:block;padding:24px 0}.room-heading h1{font-size:29px}.room-role{margin-top:14px}.room-facts{padding:18px 0;gap:20px 0}.room-facts div{padding:0 12px}.room-facts strong{overflow-wrap:anywhere}.room-grid{grid-template-columns:1fr;gap:20px}.panel{padding:20px 18px}.panel h2{font-size:22px}.waiting-list li{gap:12px;padding:20px 5px}.ticket{display:none}.your-position{padding:15px}.dialog-body{padding:24px 20px}.dialog-body h2{font-size:23px}.choice-grid{gap:8px}.choice{padding:10px 7px;gap:5px}.avatars .choice{align-items:center}.status-note{padding:0 20px}.join-panel .primary{margin-top:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Phase 2: casting and rehearsal, continuing the existing parlor palette. */
select{font:inherit;width:100%;min-height:48px;padding:10px 12px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:2px;max-width:100%}select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.participant-choices{display:grid;gap:10px}.participant-choices .choice{padding:16px;gap:14px}.participant-choices .choice>span>span{display:block;font-size:14px;color:var(--muted)}#selection-form>.primary,#roles-form>.primary{margin-top:22px}#roles-form select{margin-bottom:20px}.form-error{color:#982e36;font-size:14px}.form-error:empty{display:none}.cast-summary{border-top:1px solid var(--line);margin-top:25px;padding-top:18px}.cast-summary h3{font-size:19px}.cast-summary>div{margin-top:14px}.cast-summary strong,.cast-summary span{display:block;overflow-wrap:anywhere}.cast-summary span{font-size:14px;color:var(--muted)}.selected-member{color:var(--wine)!important;font-weight:600;margin-top:6px}.inline-back{font:inherit;font-size:14px;border:0;background:transparent;color:var(--wine);padding:0;min-height:36px;text-align:left}.preview-controls{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:25px;border:1px dashed var(--gold);background:#efe6d6;padding:18px 22px;margin-bottom:28px}.preview-controls .hint{margin:0}.reading-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:28px;align-items:start}.script-sheet{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold)}.script-header{padding:27px 30px;border-bottom:1px solid var(--line)}.script-header h2{font-size:26px}.script-header .section-kicker{margin-bottom:7px}.script-lines{margin:0;padding:0;list-style:none}.script-line{padding:28px 30px;border-bottom:1px solid var(--line)}.script-line.my-line{border-left:4px solid var(--wine);padding-left:26px;background:#faf4e9}.line-heading{display:flex;align-items:center;gap:14px}.line-number{font:23px Georgia,serif;color:var(--gold)}.line-heading>div{flex:1;min-width:0}.line-heading strong{display:block;overflow-wrap:anywhere}.line-heading>div>span{display:block;font-size:14px;color:var(--muted)}.line-owner{color:var(--muted);font-size:14px}.my-line .line-owner{color:var(--wine);font-weight:600}.spoken{font-size:26px;font-family:var(--serif);line-height:2.25;margin-top:23px;overflow-wrap:anywhere}.spoken rt{font-size:14px;font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;font-weight:400}.line-translation{margin-top:18px}.support-label{font-size:14px;color:var(--muted)}.line-translation p,.reading-guide p{margin-top:3px;overflow-wrap:anywhere}.reading-guide{padding:12px 15px;background:#efe8da;margin-top:18px}.free-speech{border-left:2px solid var(--gold);padding-left:15px;margin-top:22px}.free-speech strong{font-size:14px;color:var(--wine)}.free-speech p{margin-top:6px}.roman-guide{font-size:14px;margin-top:18px;color:var(--muted)}.roman-guide summary{cursor:pointer;min-height:40px;display:list-item;padding:7px 0}.roman-guide p{font-size:16px;margin-top:3px;overflow-wrap:anywhere}.script-footnote{padding:20px 30px;margin:0}.reading-aside .panel+.panel{margin-top:24px}.reading-aside .panel h2{font-size:22px}.ready-list{list-style:none;padding:0;margin:20px 0}.ready-list li{display:flex;align-items:center;gap:10px;justify-content:space-between;border-top:1px solid var(--line);padding:16px 0}.ready-list li>div{min-width:0}.ready-list strong,.ready-list div>span{display:block;overflow-wrap:anywhere}.ready-list div>span{font-size:14px;color:var(--muted)}.readiness{font-size:14px;flex-shrink:0;color:var(--muted)}.is-ready{color:var(--wine);font-weight:600}#toggle-ready{width:100%}.ready-status{font-weight:600;color:var(--wine)}.ready-status:empty{display:none}.conversation-help>div{border-top:1px solid var(--line);padding-top:12px;margin-top:18px}.conversation-help p{margin-top:4px;overflow-wrap:anywhere}
@media(max-width:1000px){.reading-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}.script-header,.script-line{padding:24px}.script-line.my-line{padding-left:20px}.ready-list li{display:block}.readiness{display:block;margin-top:6px}.line-heading{gap:10px}}
@media(max-width:750px){.reading-grid{grid-template-columns:minmax(0,1fr)}.preview-controls{grid-template-columns:minmax(0,1fr);gap:12px;padding:16px}.script-header,.script-line{padding:22px 18px}.script-line.my-line{padding-left:14px}.spoken{font-size:24px}.line-heading{flex-wrap:wrap}.line-owner{margin-left:auto}.script-footnote{padding:18px}.ready-list li{display:flex}.readiness{margin-top:0}.rehearsal-main .room-heading h1{font-size:28px}}
.language-toggle{font:inherit;font-size:14px;min-height:40px;padding:7px 12px;background:transparent;border:1px solid var(--gold);color:var(--wine);white-space:nowrap}.dialog-language{display:block;margin:0 0 16px auto}.header nav{flex-wrap:wrap;gap:18px}.header nav a,.header nav button{line-height:2}.chosen-script{padding:12px;border-left:2px solid var(--gold);background:#f3eadb;font-size:16px;overflow-wrap:anywhere}ruby{ruby-position:over}rt{font-size:.65em;font-weight:400;letter-spacing:0;line-height:1.1}button:has(ruby),label:has(ruby),h1:has(ruby),h2:has(ruby),h3:has(ruby){line-height:2.1}p:has(ruby),.choice:has(ruby),.badge:has(ruby){line-height:2.2}.participant-choices small{display:block;margin-top:6px;color:var(--muted)}select{white-space:normal}html[lang=en] .hero h1{font-size:clamp(32px,3vw,44px)}html[lang=en] .room-heading h1{overflow-wrap:anywhere}html[lang=en] .ready-list li{flex-wrap:wrap}.dialog-body{overflow-wrap:anywhere}@media(max-width:650px){.header nav{justify-content:flex-start;gap:10px 16px}.header nav .language-toggle{order:3}.header nav .nav-login{order:4}.room-facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.room-heading h1{font-size:27px}.line-owner{white-space:normal}.choice-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.performance-stage{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold);padding:42px;text-align:center;max-width:850px;margin:auto}.speaker-name strong{display:block;font-family:var(--serif);font-size:26px;overflow-wrap:anywhere}.speaker-name span{font-size:16px;color:var(--muted)}.performance-line{font-size:34px;margin:35px 0;line-height:2.3}.performance-stage .primary,.performance-stage .outline{max-width:420px;margin:24px auto 0}.performance-support{max-width:850px;margin:22px auto 0;border:1px solid var(--line);padding:20px 28px;background:var(--paper)}.performance-support>summary{cursor:pointer;color:var(--wine);font-size:16px;min-height:40px;line-height:2}.performance-support>section{border-top:1px solid var(--line);margin-top:20px;padding-top:18px}.performance-support h2{font-size:20px}.performance-support p{overflow-wrap:anywhere}#begin-performance{margin-top:18px}@media(max-width:650px){.performance-stage{padding:28px 18px}.performance-line{font-size:27px;margin:25px 0}.performance-support{padding:18px}.speaker-name strong{font-size:23px}}
.header{max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2));background:var(--cream)}.header nav{justify-content:flex-end}.profile-details{margin:24px 0}.profile-details dt{font-size:14px;color:var(--muted);margin-top:16px}.profile-details dd{margin:5px 0;overflow-wrap:anywhere}.phrase-pronunciation{font-size:14px;margin-top:20px;width:100%}.pronunciation-request{font-family:var(--serif);font-size:26px;line-height:1.8;color:var(--wine)!important}.pronunciation-phrase{margin:20px 0;padding:15px 18px;background:#f0e6d5;border-left:3px solid var(--gold);font-size:23px;overflow-wrap:anywhere}@media(max-width:850px){.header{display:block}.header nav{justify-content:flex-start;margin-top:18px;gap:10px}.header nav button{max-width:100%;white-space:normal}.header nav .language-toggle,.header nav .nav-login{order:initial}}@media(max-width:650px){.pronunciation-request{font-size:23px}.pronunciation-phrase{font-size:21px}}

/* Shared viewport-fixed header. Height tracks wrapping, locale and font size. */
.site-chrome{position:fixed;inset:0 0 auto;z-index:100;background:var(--cream);padding-top:env(safe-area-inset-top,0px);box-shadow:0 3px 12px #36131e12}
.header-spacer{height:var(--header-height,160px)}
html{scroll-padding-top:calc(var(--header-height,160px) + 16px)}
/* Entrance: action-first host steps and a compact participant view. */
.entrance-simple{max-width:1160px;padding-top:32px}.entrance-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}.entrance-title h1{font-size:30px;font-weight:500}.entrance-title p{font-size:14px;color:var(--muted);margin-top:5px}.host-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);background:var(--paper)}.host-steps>section{padding:24px;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;min-width:0}.host-steps>section:last-child{border-right:0}.host-steps h2{font-size:22px;margin-top:7px}.host-steps p{font-size:16px;color:var(--muted);overflow-wrap:anywhere;margin-bottom:20px;flex:1}.host-steps button{width:100%;font-size:16px}.entrance-start{display:flex;justify-content:flex-end;margin:20px 0 28px}.entrance-start .primary{max-width:360px}.entrance-script{margin-top:24px}.entrance-script .section-kicker{font-family:inherit;letter-spacing:.04em}.entrance-simple .cast-summary{margin-top:24px;padding:20px 24px;background:var(--paper);border:1px solid var(--line);display:flex;flex-wrap:wrap;gap:16px 32px}.entrance-simple .cast-summary h3{width:100%}.entrance-simple .cast-summary>div{margin:0}.participant-actions{max-width:600px;margin:0 auto 28px}.participant-actions h2{margin-bottom:20px}.participant-actions .your-position{margin:0 0 18px}.entrance-secondary{display:flex;gap:18px;margin-top:24px;align-items:center}.entrance-details{margin-top:28px;border-top:1px solid var(--line);padding-top:20px;color:var(--muted)}.entrance-details summary{cursor:pointer;font-size:14px;min-height:40px}.entrance-details h3{font-size:18px;margin-top:15px}.queue-count{font-family:Georgia,serif;margin-left:5px}.participant-choices input[type=checkbox]{width:18px;height:18px;accent-color:var(--wine);flex-shrink:0}.choice:has(input:disabled){opacity:.55}.header .brand{flex-shrink:0}.header nav{min-width:0}#selection-error:empty{display:none}@media(max-width:750px){.host-steps{grid-template-columns:minmax(0,1fr)}.host-steps>section{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:14px;border-right:0;border-bottom:1px solid var(--line);padding:20px}.host-steps>section:last-child{border-bottom:0}.host-steps .step-number{grid-row:1/4;font-size:25px}.host-steps h2{margin-top:0}.host-steps p{margin:4px 0 14px}.host-steps button{grid-column:2}.entrance-start .primary{max-width:none}.entrance-title{display:block}.entrance-title .badge{margin-top:12px}.entrance-title h1{font-size:27px}.entrance-simple .cast-summary{padding:20px}.entrance-simple{padding-top:24px}}

.header .brand.header-credit{font-size:6pt;line-height:1.5;letter-spacing:normal;}

/* Phrase audio and read-confirmation controls share the existing parlor palette. */
.audio-consent,.phrase-audio{margin:22px 0;padding:18px;border:1px solid var(--gold,#b89557);border-radius:10px;background:#fffaf1}
.phrase-audio h3{font-size:16px}.phrase-audio details{margin-bottom:14px}.phrase-audio details h2{font-size:21px}.audio-consent .choice{margin-top:10px}
.audio-player{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:12px 0}.audio-player button{width:auto}.audio-player label{display:flex;align-items:center;gap:12px;margin:0;font-size:14px}.audio-player input[type=range]{width:140px;max-width:100%;min-height:32px;padding:0;accent-color:#722c3b}.audio-choice{display:flex;flex-wrap:wrap;gap:12px}.audio-choice button{flex:1;min-width:130px}.audio-status{font-size:16px;min-height:1.5em}.performance-recording{margin:16px 0}.phrase-audio .choice{display:flex;align-items:start}.phrase-audio .choice input{flex:0 0 auto;width:20px}.audio-consent button.text-link{background:none;border:0;text-decoration:underline;font:inherit;text-align:left;cursor:pointer}.audio-player a{font-size:14px;overflow-wrap:anywhere}
@media(max-width:650px){.phrase-audio,.audio-consent{padding:14px}.audio-player{gap:10px}.audio-player label{width:100%}.audio-player input[type=range]{flex:1;max-width:220px}}
.model-audio-actions{display:flex;gap:10px;align-items:stretch;margin:14px 0}.model-audio-actions button{flex:1;min-width:0;width:auto;font-size:14px;white-space:normal}.phrase-audio select{width:100%;max-width:100%;min-width:0}.phrase-audio .audio-status:empty{display:none}

/* Phase 2–4: keep the existing palette and document flow. Image slots are not an asset specification. */
.entrance-secondary{flex-wrap:wrap}.cast-stage{margin:24px 0;border:1px solid var(--line);background:var(--paper);padding:20px;min-width:0}.scene-background{padding:16px;border:1px dashed var(--gold);color:var(--muted);font-size:14px}.cast-avatars{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px}.avatar-preview{margin:0;min-width:0;flex:1 1 210px;border:2px solid var(--line);background:var(--paper);padding:12px}.avatar-preview.speaking{border-color:var(--wine);box-shadow:0 0 0 2px var(--gold)}.avatar-layers{position:relative;isolation:isolate;min-height:170px;display:grid;align-items:center;background:var(--cream)}.avatar-background{position:absolute;inset:0;z-index:0;padding:8px;color:var(--muted);font-size:14px}.avatar-clothing{position:absolute;inset:0;z-index:1;border:1px dashed var(--gold);padding:8px;display:flex;align-items:flex-end;font-size:14px;color:var(--muted)}.avatar-default{position:relative;z-index:2;text-align:center;padding:35px 8px;color:var(--wine);font-size:16px}.custom-avatar{position:relative;z-index:2;display:block;max-width:100%;max-height:260px;margin:auto;object-fit:contain}.avatar-preview figcaption{position:relative;z-index:3;display:flex;flex-direction:column;gap:4px;padding-top:12px;overflow-wrap:anywhere;font-size:16px}.avatar-preview figcaption span{font-size:14px}.elapsed-time{font-size:16px}.performance-line{overflow-wrap:anywhere}.performance-stage,.performance-support{min-width:0}#profile-form input[type=file]{font-size:14px;max-width:100%}#profile-preview{margin:20px 0}#profile-form .primary{margin-top:20px}#profile-error{color:var(--wine);font-size:14px}.cast-stage>p{font-size:14px}@media(max-width:650px){.cast-stage{padding:14px}.cast-avatars{gap:12px}.avatar-preview{flex-basis:100%}.avatar-layers{min-height:150px}.entrance-secondary button{max-width:100%}}
/* Face-to-face performance: keep avatars visible while dialogue scrolls. */
.conversation-scene{display:flex;flex-direction:column;height:calc(100svh - var(--header-height,160px) - 32px);min-height:340px;max-height:760px;padding:0;overflow:hidden;scroll-margin-top:calc(var(--header-height,160px) + 16px);gap:0}
.conversation-scene .scene-background{border:0;border-bottom:1px dashed var(--gold);padding:4px 12px;flex:none}
.conversation-scene .cast-avatars{flex:1 1 42%;min-height:100px;max-height:300px;margin:0;padding:8px 12px;gap:8px;flex-wrap:nowrap;overflow:auto;align-items:stretch;justify-content:center}
.conversation-scene .avatar-preview{flex:1 1 0;min-width:0;max-width:420px;padding:6px;display:flex;flex-direction:column}
.conversation-scene .avatar-layers{flex:1;min-height:0;overflow:hidden}
.conversation-scene .avatar-default{padding:10px 4px;font-size:14px;overflow-wrap:anywhere}
.conversation-scene .avatar-clothing{font-size:14px;padding:3px;opacity:.65}
.conversation-scene .avatar-preview figcaption{flex:none;padding-top:4px;gap:0;font-size:14px;line-height:1.45}
.conversation-scene .custom-avatar{width:100%;height:100%;min-height:0;max-height:100%;object-fit:contain}
.conversation-scene .conversation-dialogue{flex:1 1 58%;min-height:0;overflow:auto;overscroll-behavior:contain;margin:0;border:0;border-top:2px solid var(--gold);padding:16px 24px;box-shadow:none}
.conversation-dialogue .section-kicker{margin:0;font-size:14px}.conversation-dialogue .speaker-name{font-size:18px;margin:0}.conversation-dialogue .line-owner{margin-top:4px}.conversation-dialogue .performance-line{font-size:clamp(24px,2.4vw,34px);line-height:1.7;margin:12px 0}.conversation-dialogue .primary{margin-top:12px}
@media(max-width:650px){.conversation-scene{height:calc(100svh - var(--header-height,160px) - 24px);min-height:320px}.conversation-scene .cast-avatars{padding:6px;gap:4px;max-height:220px}.conversation-scene .conversation-dialogue{padding:12px 14px}.conversation-scene .avatar-preview{padding:3px}.conversation-scene.overview-scene .avatar-clothing{display:none}.conversation-scene .avatar-default{font-size:14px}.conversation-scene .avatar-preview figcaption .badge{padding:2px;font-size:14px}}
.model-requests{margin:24px 0}.model-requests article{border-top:1px solid var(--line);padding:20px 0;min-width:0;overflow-wrap:anywhere}.model-requests h3{font-size:18px}.model-requests .spoken{font-size:24px}#pronunciation-request-form{margin-top:24px}#pronunciation-request-form .primary{margin-top:14px}.script-line[id]{scroll-margin-top:calc(var(--header-height,160px) + 16px)}

/* Phase 8: host authoring, matching the existing wine/cream panels. */
.script-editor{max-width:1050px;overflow-wrap:anywhere}.editor-section{margin-top:24px;padding:24px}.editor-field{min-width:0;margin-top:16px}.editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px}.script-editor textarea,.script-editor select{width:100%;max-width:100%;min-height:48px;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:10px;border-radius:2px}.script-editor textarea{resize:vertical}.script-editor input[type=file]{font-size:14px;max-width:100%}.editor-record{border-top:1px solid var(--line);padding:22px 0;margin-top:18px}.editor-toolbar,.editor-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.editor-image{display:block;max-width:100%;max-height:260px;object-fit:contain;margin-top:12px}.script-editor .primary{margin-top:20px}.script-editor #editor-new{margin-top:18px}.script-editor textarea:focus-visible,.script-editor select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(max-width:600px){.editor-grid{grid-template-columns:minmax(0,1fr)}.editor-section{padding:16px}.editor-actions{justify-content:flex-start}.script-editor h1{font-size:28px}}

.copy-editor{max-width:1050px;overflow-wrap:anywhere}.copy-editor select,.copy-editor textarea{font:inherit;width:100%;max-width:100%;min-width:0;min-height:48px;padding:12px;border:1px solid var(--line);background:var(--paper);color:var(--ink)}.copy-editor textarea{resize:vertical}.copy-editor .editor-actions{margin-top:20px}.copy-editor .primary{width:auto}.copy-key{font-size:14px;color:var(--muted)}.copy-preview{white-space:pre-wrap;overflow-wrap:anywhere}.copy-editor select:focus-visible,.copy-editor textarea:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(max-width:600px){.copy-editor h1{font-size:28px}.copy-editor .editor-actions>*{width:100%}}

/* Phase 12A VPS integration additions. Sites v19 layout/palette remain the base. */
.integration-auth{margin-top:18px;color:var(--wine);font-size:14px}.integration-select{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit}.participant-actions .primary,.participant-actions .outline{margin-top:12px;width:100%}.join-code-output{margin-top:18px;padding:16px;border:1px solid var(--gold);background:#fffaf1;overflow-wrap:anywhere}.join-code-output strong{display:block;font:20px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em;color:var(--wine);word-break:break-all}.join-code-output small{display:block;color:var(--muted);margin-top:8px}.integration-member-list{list-style:none;margin:18px 0 0;padding:0}.integration-member-list li{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--line)}.integration-member-list span{font-size:14px;color:var(--muted)}.live-members,.integration-later{margin-top:24px}.integration-disabled-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.integration-disabled-grid .outline{width:100%;height:100%}.form-error{color:#8b253b;font-size:14px;margin-top:10px}.form-error:empty{display:none}.queue-select{width:auto;min-height:40px;padding:7px 12px;font-size:14px}.waiting-list .queue-select{margin-left:auto}.dialog-body select.integration-select{margin-bottom:8px}.header nav{flex-wrap:wrap}.status-note.form-error{color:#8b253b}@media(max-width:750px){.integration-disabled-grid{grid-template-columns:1fr}.integration-member-list li{display:block}.integration-member-list span{display:block}.waiting-list .queue-select{width:100%;margin:10px 0 0}.waiting-list li{flex-wrap:wrap}}

/* Phase12C disposable: fixed no-scroll performance viewport. */
html.performance-viewport,
body.performance-viewport{
 height:100dvh;
 min-height:100dvh;
 max-height:100dvh;
 overflow:hidden!important;
 overscroll-behavior:none;
}

.performance-viewport #app{
 height:100dvh;
 max-height:100dvh;
 overflow:hidden;
}

.performance-viewport .footer{
 display:none!important;
}

.performance-fixed-page,
.performance-fixed-page *{
 box-sizing:border-box;
 min-width:0;
}

.performance-main.performance-fixed-page{
 width:100%;
 max-width:none;
 height:calc(100dvh - var(--header-height,160px));
 min-height:0;
 max-height:calc(100dvh - var(--header-height,160px));
 margin:0;
 padding:
  8px
  max(12px,calc((100vw - 1280px)/2))
  calc(8px + env(safe-area-inset-bottom,0px));
 display:flex;
 flex-direction:column;
 gap:8px;
 overflow:hidden;
}

.performance-fixed-head{
 flex:0 0 auto;
 min-height:48px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:16px;
 padding:0 2px;
}

.performance-title-block{
 min-width:0;
}

.performance-title-block .eyebrow{
 margin:0 0 2px;
 font-size:12px;
}

.performance-title-block h1{
 margin:0;
 max-width:min(62vw,760px);
 font-size:clamp(20px,2.2vw,30px);
 line-height:1.15;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
}

.performance-fixed-meta{
 display:flex;
 align-items:center;
 justify-content:flex-end;
 gap:10px;
 flex:0 0 auto;
}

.performance-fixed-meta .badge{
 white-space:nowrap;
}

.performance-fixed-meta .elapsed-time{
 display:flex;
 flex-direction:column;
 align-items:flex-end;
 gap:0;
 white-space:nowrap;
 font-size:11px;
 color:var(--muted);
}

.performance-fixed-meta .elapsed-time strong{
 font-size:15px;
 line-height:1.2;
 color:var(--ink);
 font-variant-numeric:tabular-nums;
}

.performance-scene{
 position:relative;
 flex:1 1 auto;
 width:100%;
 min-height:0;
 border:1px solid var(--line);
 overflow:hidden;
 isolation:isolate;
 background:#251a1b;
}

.performance-scene-empty{
 display:grid;
 place-items:center;
 color:var(--paper);
}

.performance-scene-background{
 position:absolute;
 inset:0;
 z-index:0;
 overflow:hidden;
 background:#372429;
}

.performance-scene-background img{
 display:block;
 width:100%;
 height:100%;
 object-fit:cover;
}

.performance-background-placeholder{
 width:100%;
 height:100%;
 display:grid;
 place-items:center;
 background:
  radial-gradient(circle at 50% 28%,#8a6754 0,#583d38 38%,#291d20 100%);
 color:#f5ead8;
 font-size:14px;
}

.performance-scene-shade{
 position:absolute;
 inset:0;
 z-index:1;
 pointer-events:none;
 background:
  linear-gradient(
   to bottom,
   rgba(20,12,14,.12) 0%,
   rgba(20,12,14,.04) 38%,
   rgba(20,12,14,.38) 100%
  );
}

.performance-cast-layer{
 position:absolute;
 z-index:2;
 top:3%;
 right:2%;
 bottom:35%;
 left:2%;
 display:flex;
 justify-content:center;
 align-items:flex-end;
 gap:clamp(8px,2vw,28px);
 pointer-events:none;
 overflow:hidden;
}

.performance-cast-layer.is-group{
 justify-content:space-evenly;
}

.performance-avatar{
 width:min(28%,260px);
 max-width:260px;
 height:100%;
 max-height:330px;
 margin:0;
 display:flex;
 flex-direction:column;
 justify-content:flex-end;
 align-items:center;
 opacity:1;
 transform:translateZ(0);
}

.performance-cast-layer.is-single .performance-avatar{
 width:min(40%,330px);
 max-width:330px;
}





.performance-avatar-head{
 position:absolute;
 top:4%;
 left:50%;
 width:42%;
 aspect-ratio:1/1.08;
 transform:translateX(-50%);
 border-radius:48% 48% 44% 44%;
 background:#191315;
}

.performance-avatar-male .performance-avatar-head::before{
 content:"";
 position:absolute;
 inset:-7% -4% 62%;
 border-radius:55% 55% 20% 20%;
 background:#191315;
}

.performance-avatar-female .performance-avatar-head::before{
 content:"";
 position:absolute;
 inset:-7% -10% 20%;
 border-radius:50% 50% 40% 40%;
 background:#191315;
 z-index:-1;
}

.performance-avatar-torso{
 position:absolute;
 bottom:0;
 left:50%;
 width:78%;
 height:62%;
 transform:translateX(-50%);
 border-radius:48% 48% 12% 12% / 24% 24% 10% 10%;
 background:#21181b;
}

.performance-avatar-female .performance-avatar-torso{
 width:72%;
}

.performance-avatar figcaption{
 flex:0 0 auto;
 width:100%;
 margin-top:3px;
 padding:4px 7px;
 border-radius:6px;
 background:rgba(27,18,21,.80);
 color:#fff9ee;
 text-align:center;
 line-height:1.2;
 text-shadow:0 1px 2px rgba(0,0,0,.65);
}

.performance-avatar figcaption strong,
.performance-avatar figcaption span{
 display:block;
 overflow-wrap:anywhere;
}

.performance-avatar figcaption strong{
 font-size:15px;
}

.performance-avatar figcaption>span{
 margin-top:2px;
 font-size:12px;
}

.performance-avatar figcaption .badge{
 display:inline-block;
 width:auto;
 margin-top:4px;
 padding:2px 6px;
 background:var(--wine);
 color:#fff;
 font-size:10px;
}

.performance-dialogue-card{
 position:absolute;
 z-index:5;
 right:2%;
 bottom:2%;
 left:2%;
 height:clamp(205px,34%,280px);
 min-height:0;
 padding:10px 14px;
 display:flex;
 flex-direction:column;
 gap:5px;
 overflow:hidden;
 border:1px solid rgba(255,255,255,.65);
 border-top:4px solid var(--gold);
 background:rgba(255,250,241,.94);
 box-shadow:0 8px 28px rgba(0,0,0,.25);
 backdrop-filter:blur(6px);
}

.performance-dialogue-meta{
 flex:0 0 auto;
 display:grid;
 grid-template-columns:minmax(0,1fr) minmax(0,.85fr);
 gap:12px;
 align-items:start;
}

.performance-speaker-chip,
.performance-target-chip{
 min-width:0;
}

.performance-speaker-chip{
 padding-left:9px;
 border-left:4px solid var(--wine);
}

.performance-speaker-chip.is-self{
 background:#f4e7d0;
}

.performance-speaker-chip span,
.performance-speaker-chip strong,
.performance-target-chip span,
.performance-target-chip strong{
 display:block;
 overflow-wrap:anywhere;
}

.performance-speaker-chip strong{
 font-family:var(--serif);
 font-size:19px;
 line-height:1.15;
}

.performance-speaker-chip>span:last-child,
.performance-target-chip>span{
 color:var(--muted);
 font-size:11px;
}

.performance-target-chip{
 text-align:right;
}

.performance-target-chip strong{
 font-size:14px;
}

.performance-guide{
 flex:0 0 auto;
 display:flex;
 gap:6px;
 align-items:baseline;
 overflow:hidden;
 white-space:nowrap;
 font-size:11px;
 color:var(--muted);
}

.performance-guide strong{
 color:var(--wine);
 flex:0 0 auto;
}

.performance-guide span{
 overflow:hidden;
 text-overflow:ellipsis;
}

.performance-dialogue-copy{
 flex:1 1 auto;
 min-height:0;
 overflow:hidden;
 display:flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 padding:1px 8px;
}

.performance-dialogue-copy[data-fit="failed"]{
 outline:2px solid #982e36;
 outline-offset:-2px;
}

.performance-dialogue-copy .performance-line{
 width:100%;
 margin:0;
 padding:0;
 overflow:visible;
 font-family:var(--serif);
 overflow-wrap:anywhere;
 word-break:normal;
}

.performance-dialogue-copy .dialogue-size-normal{
 font-size:clamp(27px,3.5vw,42px);
 line-height:1.42;
}

.performance-dialogue-copy .dialogue-size-medium{
 font-size:clamp(22px,2.7vw,33px);
 line-height:1.36;
}

.performance-dialogue-copy .dialogue-size-long{
 font-size:clamp(17px,2vw,25px);
 line-height:1.30;
}

.performance-action-row{
 flex:0 0 auto;
 min-height:42px;
 display:flex;
 justify-content:center;
 align-items:center;
}

.performance-action-row .primary{
 width:min(100%,360px);
 min-height:42px;
 margin:0;
 padding:8px 14px;
}

.performance-waiting{
 font-size:13px;
 color:var(--muted);
}

@media(max-width:650px){
 .performance-main.performance-fixed-page{
  padding:
   5px
   7px
   calc(6px + env(safe-area-inset-bottom,0px));
  gap:5px;
 }

 .performance-fixed-head{
  min-height:42px;
  gap:7px;
 }

 .performance-title-block .eyebrow{
  display:none;
 }

 .performance-title-block h1{
  max-width:50vw;
  font-size:17px;
 }

 .performance-fixed-meta{
  gap:6px;
 }

 .performance-fixed-meta .badge{
  padding:4px 6px;
  font-size:11px;
 }

 .performance-fixed-meta .elapsed-time span{
  display:none;
 }

 .performance-fixed-meta .elapsed-time strong{
  font-size:13px;
 }

 .performance-cast-layer{
  top:2%;
  right:1%;
  bottom:47%;
  left:1%;
  gap:5px;
 }

 .performance-avatar{
  width:min(31%,150px);
  max-height:220px;
 }

 .performance-cast-layer.is-single .performance-avatar{
  width:min(52%,190px);
 }

 

 .performance-avatar figcaption{
  padding:3px 4px;
 }

 .performance-avatar figcaption strong{
  font-size:12px;
 }

 .performance-avatar figcaption>span{
  font-size:10px;
 }

 .performance-dialogue-card{
  right:1.5%;
  bottom:1.5%;
  left:1.5%;
  height:45%;
  min-height:220px;
  padding:8px 9px;
  gap:3px;
 }

 .performance-dialogue-meta{
  grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
  gap:6px;
 }

 .performance-speaker-chip strong{
  font-size:16px;
 }

 .performance-target-chip strong{
  font-size:12px;
 }

 .performance-guide{
  font-size:10px;
 }

 .performance-dialogue-copy{
  padding:0 3px;
 }

 .performance-dialogue-copy .dialogue-size-normal{
  font-size:27px;
  line-height:1.38;
 }

 .performance-dialogue-copy .dialogue-size-medium{
  font-size:21px;
  line-height:1.32;
 }

 .performance-dialogue-copy .dialogue-size-long{
  font-size:17px;
  line-height:1.27;
 }

 .performance-action-row{
  min-height:39px;
 }

 .performance-action-row .primary{
  min-height:39px;
  padding:6px 10px;
  font-size:14px;
 }
}

@media(max-width:430px){
 .performance-title-block h1{
  max-width:46vw;
  font-size:16px;
 }

 .performance-dialogue-card{
  height:47%;
 }

 .performance-avatar figcaption strong{
  font-size:11px;
 }

 .performance-avatar figcaption>span{
  font-size:9px;
 }
}

@media(max-width:390px){
 .performance-fixed-head{
  min-height:39px;
 }

 .performance-title-block h1{
  max-width:43vw;
  font-size:15px;
 }

 .performance-fixed-meta .badge{
  font-size:10px;
 }

 .performance-fixed-meta .elapsed-time strong{
  font-size:12px;
 }

 .performance-dialogue-card{
  height:49%;
  padding:7px;
 }

 .performance-speaker-chip{
  padding-left:6px;
 }

 .performance-speaker-chip strong{
  font-size:15px;
 }

 .performance-dialogue-copy .dialogue-size-normal{
  font-size:25px;
 }

 .performance-dialogue-copy .dialogue-size-medium{
  font-size:20px;
 }

 .performance-dialogue-copy .dialogue-size-long{
  font-size:16px;
 }
}

@media(max-height:700px){
 .performance-main.performance-fixed-page{
  padding-top:4px;
  gap:4px;
 }

 .performance-fixed-head{
  min-height:36px;
 }

 .performance-dialogue-card{
  height:50%;
  min-height:205px;
 }

 .performance-cast-layer{
  bottom:50%;
 }

 

 .performance-guide{
  display:none;
 }
}

/* Phase12C disposable: CSP-safe class-based dialogue fitting. */

.performance-dialogue-copy .performance-fit-0{
 font-size:clamp(27px,3.5vw,42px);
 line-height:1.42;
}

.performance-dialogue-copy .performance-fit-1{
 font-size:clamp(25px,3.2vw,38px);
 line-height:1.39;
}

.performance-dialogue-copy .performance-fit-2{
 font-size:clamp(22px,2.9vw,34px);
 line-height:1.36;
}

.performance-dialogue-copy .performance-fit-3{
 font-size:clamp(20px,2.6vw,30px);
 line-height:1.34;
}

.performance-dialogue-copy .performance-fit-4{
 font-size:clamp(18px,2.3vw,27px);
 line-height:1.31;
}

.performance-dialogue-copy .performance-fit-5{
 font-size:clamp(17px,2.1vw,24px);
 line-height:1.29;
}

.performance-dialogue-copy .performance-fit-6{
 font-size:clamp(16px,1.9vw,22px);
 line-height:1.27;
}

.performance-dialogue-copy .performance-fit-7{
 font-size:15px;
 line-height:1.25;
}

.performance-dialogue-copy .performance-fit-8{
 font-size:14px;
 line-height:1.23;
}

@media(max-width:650px){
 .performance-dialogue-copy .performance-fit-0{
  font-size:27px;
  line-height:1.38;
 }

 .performance-dialogue-copy .performance-fit-1{
  font-size:25px;
  line-height:1.36;
 }

 .performance-dialogue-copy .performance-fit-2{
  font-size:23px;
  line-height:1.34;
 }

 .performance-dialogue-copy .performance-fit-3{
  font-size:21px;
  line-height:1.32;
 }

 .performance-dialogue-copy .performance-fit-4{
  font-size:19px;
  line-height:1.30;
 }

 .performance-dialogue-copy .performance-fit-5{
  font-size:18px;
  line-height:1.28;
 }

 .performance-dialogue-copy .performance-fit-6{
  font-size:17px;
  line-height:1.26;
 }

 .performance-dialogue-copy .performance-fit-7{
  font-size:15px;
  line-height:1.24;
 }

 .performance-dialogue-copy .performance-fit-8{
  font-size:14px;
  line-height:1.22;
 }
}

@media(max-width:430px){
 .performance-dialogue-copy .performance-fit-0{
  font-size:25px;
 }

 .performance-dialogue-copy .performance-fit-1{
  font-size:23px;
 }

 .performance-dialogue-copy .performance-fit-2{
  font-size:21px;
 }

 .performance-dialogue-copy .performance-fit-3{
  font-size:20px;
 }

 .performance-dialogue-copy .performance-fit-4{
  font-size:19px;
 }

 .performance-dialogue-copy .performance-fit-5{
  font-size:18px;
 }

 .performance-dialogue-copy .performance-fit-6{
  font-size:17px;
 }

 .performance-dialogue-copy .performance-fit-7{
  font-size:15px;
 }

 .performance-dialogue-copy .performance-fit-8{
  font-size:14px;
 }
}

@media(max-width:390px){
 .performance-dialogue-copy .performance-fit-0{
  font-size:24px;
 }

 .performance-dialogue-copy .performance-fit-1{
  font-size:22px;
 }

 .performance-dialogue-copy .performance-fit-2{
  font-size:20px;
 }

 .performance-dialogue-copy .performance-fit-3{
  font-size:19px;
 }

 .performance-dialogue-copy .performance-fit-4{
  font-size:18px;
 }

 .performance-dialogue-copy .performance-fit-5{
  font-size:17px;
 }

 .performance-dialogue-copy .performance-fit-6{
  font-size:16px;
 }

 .performance-dialogue-copy .performance-fit-7{
  font-size:15px;
 }

 .performance-dialogue-copy .performance-fit-8{
  font-size:14px;
 }
}

/* Phase12C disposable: CSP-safe legacy inline style replacements. */

.progression-background-image{
 display:block;
 width:100%;
 height:100%;
 max-height:120px;
 object-fit:cover;
}

.progression-actions{
 display:flex;
 gap:12px;
 flex-wrap:wrap;
 width:100%;
 justify-content:flex-end;
}

/* Phase 12D disposable live recording integration */
.phase12d-recording-consent{
 max-width:850px;
 margin:18px auto;
}

.phase12d-recording-box{
 width:100%;
 margin:0 0 10px;
}

.phase12d-recording-box .audio-status{
 margin:0 0 8px;
 text-align:center;
}

.phase12d-recording-box .audio-choice{
 justify-content:center;
}

.phase12d-review-recording{
 display:flex;
 flex-wrap:wrap;
 gap:12px;
 align-items:center;
 margin-top:16px;
 padding-top:14px;
 border-top:1px solid var(--line);
}

.phase12d-review-recording strong{
 width:100%;
}

.phase12d-review-recording audio{
 width:min(100%,420px);
}

.phase12d-review-recording .text-link{
 display:inline-block;
}

@media(max-width:650px){
 .phase12d-review-recording{
  align-items:stretch;
 }

 .phase12d-review-recording audio{
  width:100%;
 }
}

/* Role & Talk script catalog v2 */
.script-category-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.script-category-tab[aria-pressed="true"]{font-weight:700}.script-category-panel[hidden]{display:none}.script-catalog-row{display:grid;grid-template-columns:minmax(7rem,10rem) minmax(0,1fr) auto;gap:.9rem;align-items:center}.script-catalog-thumb{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.5rem}.script-catalog-copy{display:grid;gap:.3rem;min-width:0}.script-catalog-select{white-space:nowrap}.script-catalog-empty{padding:1rem 0}@media(max-width:520px){.script-catalog-row{grid-template-columns:6rem minmax(0,1fr)}.script-catalog-select{grid-column:2}.script-category-tabs{display:grid;grid-template-columns:1fr 1fr}}

/* ROLE_ART_FACE_FOCUS_20260928
   Performance role art:
   prioritize face / shoulders.
   Lower chest and waist may be cropped.
*/

/*
  Single visible counterpart:
  make the character substantially larger.
*/
.performance-cast-layer.is-single .performance-avatar{
  width:min(48%,380px);
  max-width:380px;
  max-height:440px;
}



/*
  The source WebP is 1200x1600.
  Fill the larger portrait window and crop mostly
  from the lower part of the body.
*/


/*
  Smartphone:
  still prioritize the face, but reduce the
  absolute footprint to protect the dialogue UI.
*/
@media (max-width:700px){
  .performance-cast-layer.is-single .performance-avatar{
    width:min(62%,290px);
    max-width:290px;
    max-height:360px;
  }

  

  
}

/* PERFORMANCE_DIALOGUE_STABLE_FONT_20260928
   Annotation presence must not reduce the spoken
   dialogue font size.
*/

.performance-dialogue-card
.performance-dialogue-copy
.performance-line{
  font-size:clamp(30px,2.7vw,44px) !important;
  line-height:1.22 !important;
}

/*
  Keep the selected font size.
  Do not create an inner scrollbar in the spoken
  dialogue area.
*/
.performance-dialogue-copy{
  overflow:visible !important;
}

/*
  Current-speaker information was removed from
  the dialogue frame. Keep target information.
*/
.performance-dialogue-meta{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:flex-start !important;
}

.performance-target-chip{
  margin-left:auto;
}

@media (max-width:700px){
  .performance-dialogue-card
  .performance-dialogue-copy
  .performance-line{
    font-size:clamp(24px,6vw,34px) !important;
    line-height:1.22 !important;
  }
}

/* PERFORMANCE_ANNOTATION_LAYOUT_20260928
   The speaker block was removed from the top-left
   of the performance dialogue card. Use that free
   area for reading-guide / annotation text so it
   does not reduce the spoken-line area.
*/

@media (min-width:701px){
  .performance-dialogue-card .performance-guide{
    position:absolute !important;
    top:10px;
    left:16px;
    width:62%;
    max-width:62%;
    margin:0 !important;
    padding:0 !important;
    z-index:3;
    background:transparent !important;
    border:0 !important;
  }
}

/*
  The fixed dialogue font is intentional.
  A failed legacy auto-fit state must not draw
  the red overflow warning frame.
*/
.performance-dialogue-copy[data-fit="failed"]{
  border-color:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
}

/*
  Mobile is naturally vertical, so keep the
  annotation in normal document flow.
*/
@media (max-width:700px){
  .performance-dialogue-card .performance-guide{
    position:static !important;
    width:auto;
    max-width:none;
    margin:0 0 6px !important;
  }

  .performance-dialogue-copy{
    overflow:visible !important;
  }
}

/* PERFORMANCE_SPEAKER_LEFT_HEADER_COMPACT_20260928
   1. Move the current-speaker badge to the
      left edge of the dialogue area.
   2. Target information has been removed from
      the dialogue card.
   3. Compact the shared fixed header.
*/

/*
  The badge is still generated only for the
  currently speaking visible avatar.

  Its positioned ancestor is performance-cast-layer.
  On desktop the cast layer and dialogue card both
  begin at 2%, so left:0 aligns their left edges.
*/
.performance-avatar figcaption .badge{
  position:absolute !important;
  z-index:7;
  left:0 !important;
  bottom:0 !important;
  width:auto !important;
  margin:0 !important;
  padding:3px 8px !important;
  transform:translateY(-2px);
  white-space:nowrap;
  font-size:10px !important;
}

/*
  There is no target block anymore, so the
  dialogue metadata row itself is unnecessary.
*/
.performance-dialogue-meta{
  display:none !important;
}

/*
  Shared fixed header:
  original desktop minimum height was 112px.
  Reduce it to approximately half.
*/
.header{
  min-height:56px !important;
  padding-block:6px !important;
  gap:12px !important;
}

/*
  Header navigation also needs to shrink so the
  reduced header does not immediately wrap.
*/
.header nav{
  margin-top:0 !important;
  gap:6px 10px !important;
  font-size:11px !important;
  align-items:center !important;
}

.header nav a,
.header nav button{
  line-height:1.2 !important;
}

/*
  Normal header buttons.
*/
.header .nav-login{
  min-height:28px !important;
  padding:4px 9px !important;
  font-size:11px !important;
  line-height:1.2 !important;
}

/*
  JP / EN language button.
*/
.header .language-toggle{
  min-height:28px !important;
  padding:4px 9px !important;
  font-size:11px !important;
  line-height:1.2 !important;
}

/*
  Powered by Karstar is already small;
  reduce it slightly with the compact header.
*/
.header .brand.header-credit{
  font-size:5pt !important;
  line-height:1.2 !important;
}

/*
  Narrow screens may still need wrapping because
  hosts have more controls. Keep it compact rather
  than restoring the old 18px top gap.
*/
@media(max-width:850px){
  .header{
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    padding-block:5px !important;
  }

  .header nav{
    flex:1 1 auto;
    justify-content:flex-end !important;
    margin-top:0 !important;
    gap:5px 7px !important;
  }

  .header nav button{
    max-width:100%;
    white-space:nowrap !important;
  }
}

/*
  On the compact performance layout the cast layer
  starts at 1% while the dialogue starts at 1.5%.
  Compensate for that small difference.
*/
@media(max-width:900px){
  .performance-avatar figcaption .badge{
    left:.5% !important;
  }
}

/* PERFORMANCE_CURRENT_SPEAKER_FRAME_LEFT_20260928
   Correction:
   move the entire current-speaker frame
   (name + role + current-speaker badge),
   not only the small badge.
*/

/*
  .performance-avatar normally has translateZ(0),
  which makes it the positioning container.

  Remove that only from the speaking avatar so
  its figcaption can align against the cast layer,
  whose left edge matches the dialogue area.
*/
.performance-avatar.speaking{
  transform:none !important;
}

/*
  Move the complete caption frame to the left edge
  immediately above the dialogue area.
*/
.performance-avatar.speaking figcaption{
  position:absolute !important;
  z-index:8;
  left:0 !important;
  bottom:0 !important;

  width:min(260px,32vw) !important;
  max-width:260px !important;

  margin:0 !important;
}

/*
  Undo the previous incorrect rule which moved only
  the CURRENT SPEAKER badge inside the frame.
*/
.performance-avatar.speaking
figcaption .badge{
  position:static !important;

  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;

  display:inline-block !important;
  width:auto !important;

  margin-top:4px !important;
  padding:2px 6px !important;

  transform:none !important;
  white-space:nowrap;

  font-size:10px !important;
}

/*
  Compact layouts:
  dialogue begins 0.5% farther right than the
  cast layer, so compensate for that difference.
*/
@media(max-width:900px){
  .performance-avatar.speaking figcaption{
    left:.5% !important;
    width:min(190px,48vw) !important;
    max-width:190px !important;
  }
}

/*
  Phones have more available relative width for
  the speaker information frame.
*/
@media(max-width:700px){
  .performance-avatar.speaking figcaption{
    width:min(230px,62vw) !important;
    max-width:230px !important;
  }
}

/* PERFORMANCE_SINGLE_FRAME_ALWAYS_LEFT_20260928
   When only one counterpart is visible, keep the
   entire name / role / current-speaker frame at
   the left edge regardless of speaking state.

   This also covers same-member multi-role turns,
   where the visible counterpart is intentionally
   not given the .speaking class.
*/

.performance-cast-layer.is-single
.performance-avatar{
  transform:none !important;
}

.performance-cast-layer.is-single
.performance-avatar figcaption{
  position:absolute !important;
  z-index:8;

  left:0 !important;
  right:auto !important;
  bottom:0 !important;

  width:min(260px,32vw) !important;
  max-width:260px !important;

  margin:0 !important;
}

/*
  Keep CURRENT SPEAKER inside that same frame.
*/
.performance-cast-layer.is-single
.performance-avatar figcaption .badge{
  position:static !important;

  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;

  display:inline-block !important;
  width:auto !important;

  margin-top:4px !important;
  padding:2px 6px !important;

  transform:none !important;
}

/*
  Compact performance layout:
  cast layer starts at 1%, dialogue at 1.5%.
*/
@media(max-width:900px){
  .performance-cast-layer.is-single
  .performance-avatar figcaption{
    left:.5% !important;

    width:min(190px,48vw) !important;
    max-width:190px !important;
  }
}

@media(max-width:700px){
  .performance-cast-layer.is-single
  .performance-avatar figcaption{
    width:min(230px,62vw) !important;
    max-width:230px !important;
  }
}

/* PROGRESS_SCRIPT_THUMBNAILS_20260928
   Use each published script background image as
   its thumbnail in the host script-selection dialog.
*/

#progress-script-dialog
.progress-script-choice{
  display:grid !important;
  grid-template-columns:
    auto
    minmax(120px,160px)
    minmax(0,1fr);
  align-items:center !important;
  gap:12px !important;
  width:100%;
}

#progress-script-dialog
.progress-script-thumb-wrap{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:6px;
  background:rgba(0,0,0,.08);
}

#progress-script-dialog
.progress-script-thumb{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

#progress-script-dialog
.progress-script-copy{
  display:grid;
  gap:4px;
  min-width:0;
}

#progress-script-dialog
.progress-script-copy strong,
#progress-script-dialog
.progress-script-copy span,
#progress-script-dialog
.progress-script-copy small{
  display:block;
}

@media(max-width:600px){
  #progress-script-dialog
  .progress-script-choice{
    grid-template-columns:
      auto
      100px
      minmax(0,1fr);
    gap:8px !important;
  }
}

/* SCRIPT_CATALOG_THUMBNAIL_LAYOUT_FIX_20260928
   Actual catalog markup has four direct children:
   radio / thumbnail / copy / select.
*/

.script-catalog-row{
  display:grid !important;
  grid-template-columns:
    24px
    minmax(140px,180px)
    minmax(0,1fr)
    auto !important;
  grid-template-areas:
    "radio thumb copy select";
  gap:14px !important;
  align-items:center !important;
  width:100%;
}

.script-catalog-row > input[type="radio"]{
  grid-area:radio;
  margin:0 !important;
  justify-self:center;
  align-self:center;
}

.script-catalog-row > .script-catalog-thumb-wrap{
  grid-area:thumb;
  display:block !important;
  width:100% !important;
  min-width:0;
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
  border-radius:6px;
  background:rgba(0,0,0,.06);
}

.script-catalog-row
.script-catalog-thumb{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center !important;
  margin:0 !important;
  opacity:1 !important;
  visibility:visible !important;
}

.script-catalog-row > .script-catalog-copy{
  grid-area:copy;
  display:grid !important;
  gap:5px;
  min-width:0;
}

.script-catalog-row > .script-catalog-select{
  grid-area:select;
  align-self:center;
  white-space:nowrap;
}

@media(max-width:600px){
  .script-catalog-row{
    grid-template-columns:
      22px
      100px
      minmax(0,1fr) !important;

    grid-template-areas:
      "radio thumb copy"
      ".     thumb select";

    gap:8px 10px !important;
    align-items:start !important;
  }

  .script-catalog-row > input[type="radio"]{
    margin-top:8px !important;
  }

  .script-catalog-row > .script-catalog-select{
    justify-self:start;
    margin-top:4px;
  }
}

/* SCRIPT_SELECTION_DIALOG_WIDE_20260928
   Widen only the host script-selection dialog.
*/

#progress-script-dialog{
  width:min(1100px,calc(100vw - 48px)) !important;
  max-width:1100px !important;
}

#progress-script-dialog .dialog-body{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
}

#progress-script-dialog fieldset{
  width:100%;
  min-width:0;
}

#progress-script-dialog .script-catalog{
  width:100%;
  min-width:0;
}

#progress-script-dialog .script-catalog-copy{
  min-width:0;
}

@media(max-width:700px){
  #progress-script-dialog{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
  }
}

/* SCRIPT_CATALOG_THREE_STAGE_FILTER_20260928
   Language -> participant count -> category.
   Filter controls are intentionally compact.
*/

.script-filter-row{
  display:flex !important;
  flex-wrap:wrap;
  gap:7px !important;
  margin:6px 0 !important;
}

.script-language-tabs{
  margin-top:12px !important;
}

.script-category-tabs{
  margin-bottom:12px !important;
}

.script-filter-tab{
  box-sizing:border-box !important;
  min-height:32px !important;
  height:32px !important;
  padding:3px 12px !important;
  font-size:14px !important;
  line-height:1 !important;
}

.script-filter-tab[aria-pressed="true"]{
  font-weight:700 !important;
}

.script-catalog-row{
  display:grid !important;
  grid-template-columns:
    24px
    minmax(140px,180px)
    minmax(0,1fr) !important;
  grid-template-areas:
    "radio thumb copy" !important;
  gap:14px !important;
  align-items:center !important;
}

.script-catalog-row > input[type="radio"]{
  grid-area:radio;
}

.script-catalog-row > .script-catalog-thumb-wrap{
  grid-area:thumb;
}

.script-catalog-row > .script-catalog-copy{
  grid-area:copy;
}

.script-catalog-title-row{
  display:flex !important;
  align-items:baseline;
  flex-wrap:wrap;
  gap:5px 12px;
}

.script-catalog-title-row > strong{
  display:inline !important;
}

.script-catalog-meta{
  display:inline !important;
  white-space:nowrap;
  color:var(--muted);
  font-size:13px;
  font-weight:400;
}

.script-catalog-summary{
  display:block !important;
  margin-top:4px;
}

.script-catalog-select{
  display:none !important;
}

@media(max-width:600px){
  .script-filter-row{
    display:grid !important;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
    gap:6px !important;
  }

  .script-filter-tab{
    width:100%;
    min-height:32px !important;
    height:32px !important;
  }

  .script-category-tabs{
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }

  .script-catalog-row{
    grid-template-columns:
      22px
      100px
      minmax(0,1fr) !important;
    grid-template-areas:
      "radio thumb copy" !important;
    gap:8px 10px !important;
  }

  .script-catalog-title-row{
    display:block !important;
  }

  .script-catalog-meta{
    display:block !important;
    margin-top:3px;
    white-space:normal;
  }
}

/* Entrance layout revision 2026-09-28 */
.entrance-top-actions{
 display:flex;
 justify-content:flex-end;
 align-items:center;
 flex-wrap:wrap;
 gap:8px 18px;
 margin:0 0 10px;
 min-width:0;
}

.entrance-top-actions button{
 max-width:100%;
 white-space:normal;
}

.entrance-member-host-grid{
 display:grid;
 grid-template-columns:
  minmax(0,1fr)
  minmax(0,1fr);
 gap:28px;
 align-items:start;
 margin-top:24px;
 min-width:0;
}

.entrance-member-host-grid>*{
 min-width:0;
}

.entrance-member-host-grid .live-members,
.entrance-member-host-grid .participant-actions{
 max-width:none;
 margin:0;
}

@media(max-width:750px){
 .entrance-member-host-grid{
  grid-template-columns:minmax(0,1fr);
  gap:20px;
 }

 .entrance-top-actions{
  justify-content:flex-end;
  gap:6px 12px;
 }

 .entrance-top-actions button{
  min-width:0;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
 }
}



/* TWO_ACTOR_STAGE_LAYOUT_20260929
   Participant:
   - self always occupies the left slot
   - current / last completed counterpart uses right

   Spectator:
   - current speaker uses left
   - previous completed different role uses right

   No third character is rendered.
*/























.performance-cast-layer.two-actor-stage
.performance-avatar figcaption,
.performance-cast-layer.two-actor-stage
.performance-avatar.speaking figcaption,
.performance-cast-layer.two-actor-stage.is-single
.performance-avatar figcaption{
  position:static !important;
  z-index:8;
  width:min(100%,280px) !important;
  max-width:280px !important;
  min-height:0;
  margin:4px 0 0 !important;
  padding:5px 8px !important;
  transform:none !important;
  background:rgba(255,252,246,.94);
  border:1px solid rgba(218,204,182,.9);
  box-shadow:0 2px 8px rgba(30,15,18,.15);
  text-align:left;
  overflow:hidden;
}

.performance-cast-layer.two-actor-stage
.slot-right figcaption{
  margin-left:auto !important;
  text-align:right;
}

.performance-cast-layer.two-actor-stage
.performance-avatar figcaption strong,
.performance-cast-layer.two-actor-stage
.performance-avatar figcaption>span{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.performance-cast-layer.two-actor-stage
.performance-avatar figcaption strong{
  font-size:clamp(12px,1.25vw,16px);
  line-height:1.25;
}

.performance-cast-layer.two-actor-stage
.performance-avatar figcaption>span{
  margin-top:1px;
  font-size:clamp(10px,1vw,13px);
  line-height:1.25;
}

.performance-cast-layer.two-actor-stage
.performance-slot.inactive figcaption{
  opacity:.8;
}

.performance-cast-layer.two-actor-stage
.performance-avatar figcaption .badge,
.performance-cast-layer.two-actor-stage
.performance-avatar.speaking figcaption .badge,
.performance-cast-layer.two-actor-stage.is-single
.performance-avatar figcaption .badge{
  position:static !important;
  display:inline-block !important;
  width:auto !important;
  margin-top:3px !important;
  padding:2px 5px !important;
  transform:none !important;
  white-space:nowrap;
  font-size:9px !important;
}

.performance-dialogue-speaker{
  margin:0 0 2px;
  color:var(--muted);
  font-size:11px;
  font-weight:600;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.performance-scene
.performance-dialogue-card{
  z-index:5;
}

body:has([data-spectator]){
  height:100dvh;
  max-height:100dvh;
  overflow:hidden;
  overscroll-behavior:none;
}

body:has([data-spectator]) #app{
  height:100dvh;
  max-height:100dvh;
  overflow:hidden;
}

body:has([data-spectator]) .footer{
  display:none !important;
}

[data-spectator].performance-main.performance-fixed-page{
  width:100%;
  max-width:none;
  height:calc(100dvh - var(--header-height,160px));
  min-height:0;
  max-height:calc(100dvh - var(--header-height,160px));
  margin:0;
  overflow:hidden;
}

@media(max-width:900px){
  

  

  

  .performance-cast-layer.two-actor-stage
  .performance-avatar figcaption,
  .performance-cast-layer.two-actor-stage
  .performance-avatar.speaking figcaption,
  .performance-cast-layer.two-actor-stage.is-single
  .performance-avatar figcaption{
    width:min(100%,210px) !important;
    max-width:210px !important;
    padding:4px 6px !important;
  }
}

@media(max-width:700px){
  

  

  

  .performance-cast-layer.two-actor-stage
  .performance-avatar figcaption,
  .performance-cast-layer.two-actor-stage
  .performance-avatar.speaking figcaption,
  .performance-cast-layer.two-actor-stage.is-single
  .performance-avatar figcaption{
    width:min(100%,170px) !important;
    max-width:170px !important;
    margin-top:2px !important;
    padding:3px 5px !important;
  }

  .performance-cast-layer.two-actor-stage
  .performance-avatar figcaption strong{
    font-size:11px;
  }

  .performance-cast-layer.two-actor-stage
  .performance-avatar figcaption>span{
    font-size:9px;
  }

  .performance-dialogue-speaker{
    font-size:10px;
  }
}

/* END_TWO_ACTOR_STAGE_LAYOUT_20260929 */

/* SPECTATOR_RETURN_CONTROL_20260929
   Preserve the pre-existing spectator return action.
   This is navigation, not a speaking control.
*/
.spectator-return-control{
  width:auto !important;
  min-height:30px !important;
  margin:0 !important;
  padding:4px 9px !important;
  font-size:11px !important;
  line-height:1.2 !important;
  white-space:nowrap;
}
/* END_SPECTATOR_RETURN_CONTROL_20260929 */

/* PARTICIPANT_RIGHT_ROLE_MIRROR_20260929
   Participant performance screen only.

   Left:
   viewer/self role remains unchanged.

   Right:
   only the currently displayed opponent role image
   is horizontally mirrored.

   Spectator screen is excluded by [data-spectator].
   Captions, usernames, role names and dialogue text
   are not transformed.
*/

/* END_PARTICIPANT_RIGHT_ROLE_MIRROR_20260929 */

/* SPECTATOR_DIALOGUE_TRANSLATION_20260929
   Translation under the current dialogue is visible
   only on the spectator performance screen.
*/
main.performance-main.performance-fixed-page[data-spectator]
.performance-dialogue-translation{
  margin:8px 0 0;
  font-size:clamp(14px,1.35vw,18px);
  line-height:1.55;
  color:var(--muted);
  overflow-wrap:anywhere;
}
/* END_SPECTATOR_DIALOGUE_TRANSLATION_20260929 */

/* PHASE4D_ROLE_SCALE_USERNAME_ONLY_20261001
   Screenshot target:
   - speaking actor is larger
   - inactive actor is smaller
   - size follows speaking state, never left/right identity
   - caption contains username only
   - phone widths stay inside the two-column viewport
*/







/*
  Target screenshot uses a compact username plate
  overlapping the bottom edge of the character art.
*/
.performance-cast-layer.two-actor-stage
.performance-user-name{
  position:relative !important;
  z-index:8 !important;

  width:150px !important;
  max-width:150px !important;
  min-height:34px;

  margin-top:-34px !important;
  padding:6px 9px !important;

  display:flex !important;
  align-items:center;

  background:rgba(255,252,246,.94);
  border:1px solid rgba(218,204,182,.9);
  box-shadow:0 2px 8px rgba(30,15,18,.15);

  text-align:left !important;
  overflow:hidden;
}

.performance-cast-layer.two-actor-stage
.performance-user-name strong{
  display:block;
  width:100%;
  max-width:100%;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  font-size:12px;
  line-height:1.25;
}

.performance-cast-layer.two-actor-stage
.slot-left
.performance-user-name{
  margin-left:0 !important;
  margin-right:auto !important;
}

.performance-cast-layer.two-actor-stage
.slot-right
.performance-user-name{
  margin-left:auto !important;
  margin-right:0 !important;
  text-align:left !important;
}

.performance-cast-layer.two-actor-stage
.performance-slot.inactive
.performance-user-name{
  opacity:.94 !important;
}

/*
  Tablet / narrow desktop.
*/
@media(max-width:900px){
  

  

  .performance-cast-layer.two-actor-stage
  .performance-user-name{
    width:145px !important;
    max-width:145px !important;
  }
}

/*
  Portrait phone:
  speaking + inactive widths remain below the
  viewport width, so the two role images cannot
  overlap horizontally.
*/
@media(max-width:700px){
  

  

  .performance-cast-layer.two-actor-stage
  .performance-user-name{
    width:min(38vw,140px) !important;
    max-width:140px !important;
    min-height:30px;
    margin-top:-30px !important;
    padding:5px 7px !important;
  }

  .performance-cast-layer.two-actor-stage
  .performance-user-name strong{
    font-size:11px;
  }
}

/* END_PHASE4D_ROLE_SCALE_USERNAME_ONLY_20261001 */

/* PHASE4D_C_DESKTOP_USERNAME_FRAME_20261001
   Desktop/tablet only.
   Keep Phase4D actor sizes unchanged.
   Keep mobile <=700px unchanged.
   Place username plates fully inside the cast area,
   immediately above the dialogue card.
*/
@media (min-width:701px){

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot
  .performance-user-name{
    position:absolute !important;
    z-index:8 !important;

    top:auto !important;
    bottom:24px !important;

    width:150px !important;
    max-width:150px !important;
    min-height:34px !important;

    margin:0 !important;
    padding:6px 9px !important;

    display:flex !important;
    align-items:center !important;

    background:rgba(255,252,246,.94) !important;
    border:1px solid rgba(218,204,182,.9) !important;
    box-shadow:0 2px 8px rgba(30,15,18,.15) !important;

    overflow:hidden !important;
    transform:none !important;
    opacity:1 !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-left
  .performance-user-name{
    left:0 !important;
    right:auto !important;
    text-align:left !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:0 !important;
    text-align:left !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot
  .performance-user-name strong{
    display:block !important;
    width:100% !important;
    max-width:100% !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;

    font-size:12px !important;
    line-height:1.25 !important;
  }
}
/* END_PHASE4D_C_DESKTOP_USERNAME_FRAME_20261001 */

/* P4DE_USERNAME_INK_START */
.performance-cast-layer.two-actor-stage
.performance-user-name,
.performance-cast-layer.two-actor-stage
.performance-user-name strong{
  color:#342728 !important;
  text-shadow:none !important;
}
/* P4DE_USERNAME_INK_END */

/* P4DF_SPECTATOR_TRANSLATION_STACK_START */
@media (min-width:701px){

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy{
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line{
    flex:0 0 auto !important;
    width:100% !important;
    margin:0 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation{
    flex:0 0 auto !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:8px 0 0 !important;
    text-align:center !important;
  }
}
/* P4DF_SPECTATOR_TRANSLATION_STACK_END */

/* P4DH_PC_BACKGROUND_WIDE_START
   Desktop only.

   Expand the performance background viewport from
   the former 1280px visual width toward 1680px.

   The source image keeps object-fit:cover.
   No aspect-ratio distortion is introduced.

   Cast and dialogue remain in the same centered
   1228.8px safe area they occupied when the scene
   width was 1280px with 2% left/right insets.
*/
@media (min-width:901px){

  .performance-main.performance-fixed-page
  .performance-scene{
    width:min(1680px, calc(100vw - 24px)) !important;
    min-width:min(1680px, calc(100vw - 24px)) !important;
    max-width:1680px !important;
    align-self:center !important;
  }

  .performance-main.performance-fixed-page
  .performance-scene-background img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:50% 50% !important;
  }

  

  .performance-main.performance-fixed-page
  .performance-dialogue-card{
    left:max(
      2%,
      calc((100% - 1228.8px) / 2)
    ) !important;

    right:max(
      2%,
      calc((100% - 1228.8px) / 2)
    ) !important;
  }
}
/* P4DH_PC_BACKGROUND_WIDE_END */

/* P4DI_PC_FINAL_VISUAL_LOCK_START
   Reference viewport:
   1357 x 948 at browser zoom 100%.

   Background:
   - wide desktop frame
   - preserve aspect ratio
   - object-fit: cover

   Speaking actor:
   - 370 x 500 max
   - active scale 1.035

   Inactive actor:
   - 300 x 400 max
   - grayscale
   - opacity .82

   Username frame:
   - 150 x 34
   - 12px text

   Dialogue:
   - centered 1228.8px safe region
   - height clamp reproduces 262.5px
     at the reference viewport

   Spoken line:
   - reproduces 36.639px at reference width

   Translation:
   - 18px maximum
*/

@media (min-width:901px){

  /* ---------- scene / background ---------- */

  main.performance-main.performance-fixed-page
  .performance-scene{
    width:min(1680px, calc(100vw - 24px)) !important;
    min-width:min(1680px, calc(100vw - 24px)) !important;
    max-width:1680px !important;
    align-self:center !important;
  }

  main.performance-main.performance-fixed-page
  .performance-scene-background img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:50% 50% !important;
    transform:none !important;
  }

  /* ---------- central performance region ---------- */

  

  /* ---------- current speaker ---------- */

  

  /* ---------- inactive speaker ---------- */

  

  /* Role artwork itself never stretches. */

  

  /* ---------- username frame ---------- */

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot
  .performance-user-name{
    position:absolute !important;
    top:auto !important;
    bottom:24px !important;

    width:150px !important;
    max-width:150px !important;
    min-height:34px !important;
    height:34px !important;

    margin:0 !important;
    padding:6px 9px !important;

    display:flex !important;
    align-items:center !important;

    background:rgba(255,252,246,.94) !important;
    border:1px solid rgba(218,204,182,.9) !important;
    box-shadow:0 2px 8px rgba(30,15,18,.15) !important;

    color:#342728 !important;
    text-shadow:none !important;

    overflow:hidden !important;
    opacity:1 !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-left
  .performance-user-name{
    left:0 !important;
    right:auto !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:0 !important;
  }

  main.performance-main.performance-fixed-page
  .performance-cast-layer.two-actor-stage
  .performance-user-name strong{
    display:block !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-size:12px !important;
    line-height:15px !important;
    font-weight:700;

    color:#342728 !important;
    text-shadow:none !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  /* ---------- dialogue frame ---------- */

  main.performance-main.performance-fixed-page
  .performance-dialogue-card{
    left:max(
      2%,
      calc((100% - 1228.8px) / 2)
    ) !important;

    right:max(
      2%,
      calc((100% - 1228.8px) / 2)
    ) !important;

    bottom:2% !important;

    height:clamp(
      205px,
      34%,
      280px
    ) !important;

    min-height:0 !important;

    padding:10px 14px !important;
  }

  /* ---------- spoken dialogue ---------- */

  main.performance-main.performance-fixed-page
  .performance-dialogue-copy
  .performance-line{
    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-size:clamp(
      30px,
      2.7vw,
      44px
    ) !important;

    line-height:1.22 !important;

    text-align:center !important;
  }

  /* ---------- spectator translation ---------- */

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy{
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation{
    display:block !important;

    width:100% !important;
    max-width:100% !important;

    margin:8px 0 0 !important;
    padding:0 !important;

    font-size:clamp(
      14px,
      1.35vw,
      18px
    ) !important;

    line-height:1.55 !important;

    color:var(--muted) !important;
    text-align:center !important;
  }
}

/* P4DI_PC_FINAL_VISUAL_LOCK_END */

/* P4DK_SPECTATOR_COMPACT_TARGET_START

   PC spectator target:
   - dialogue and username edges share the same
     visual 6% side guides
   - compact dialogue height
   - cast ends directly above the dialogue area
   - current-speaker duplicate label is hidden
   - short/medium dialogue remains large
   - existing fit classes may shrink long/overflowing text
   - role artwork sizes and username frame sizes
     remain unchanged
*/

@media (min-width:901px){

  /* ---------- shared horizontal guides ---------- */

  

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-card{
    left:6% !important;
    right:6% !important;
    bottom:2% !important;

    height:clamp(
      110px,
      22%,
      180px
    ) !important;

    min-height:110px !important;
    max-height:180px !important;

    padding:10px 14px !important;
    gap:0 !important;
  }

  /* ---------- remove duplicate speaker name ---------- */

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-speaker{
    display:none !important;
  }

  /* ---------- dialogue + translation stack ---------- */

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy{
    flex:1 1 auto !important;
    min-height:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;

    padding:1px 8px !important;
    overflow:hidden !important;
  }

  /*
    Base target size.
    36px is the PC upper limit rather than the
    previous 44px viewport-scaled maximum.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;

    font-size:36px !important;
    line-height:1.20 !important;

    text-align:center !important;
    overflow:visible !important;
  }

  /*
    Restore meaningful fit levels.
    The JS fitting routine already adds these
    classes when the current line does not fit.
  */

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-0,

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-1,

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-2{
    font-size:36px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-3{
    font-size:32px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-4{
    font-size:29px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-5{
    font-size:26px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-6{
    font-size:23px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-7{
    font-size:20px !important;
    line-height:1.20 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy
  .performance-line.performance-fit-8{
    font-size:17px !important;
    line-height:1.20 !important;
  }

  /* ---------- translation ---------- */

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation{
    flex:0 0 auto !important;

    display:block !important;
    width:100% !important;
    max-width:100% !important;

    margin:8px 0 0 !important;
    padding:0 !important;

    font-size:18px !important;
    line-height:1.45 !important;

    color:var(--muted) !important;
    text-align:center !important;
  }
}

/* P4DK_SPECTATOR_COMPACT_TARGET_END */

/* P4DL_SPECTATOR_EDGE_ROLE_ART_START

   PC spectator only.

   Goal:
   - speaking actor touches the left background edge
   - inactive actor touches the right background edge
   - both actors become larger
   - speaking actor remains larger than inactive actor
   - username plates stay on the existing 6% guide
   - dialogue/background/mobile remain unchanged
*/

@media (min-width:901px){

  /*
    Use the full background width for actor placement.
    The dialogue card remains on the Phase4D-K 6%
    horizontal guide.
  */
  

  /*
    Current speaker.
    Larger than the previous 370 x 500 target,
    while remaining responsive on shorter desktops.
  */
  

  /*
    Previous / inactive speaker.
    Enlarged, but still clearly smaller than
    the current speaker.
  */
  

  /*
    Preserve the role image aspect ratio.
    No image stretching.
  */
  

  /*
    The cast layer is now full width, so compensate
    the username position to keep approximately the
    same whole-scene 6% guide as the dialogue frame.

    Each slot is roughly half the stage:
    12% of a slot ≈ 6% of the whole scene.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-left
  .performance-user-name{
    left:12% !important;
    right:auto !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:12% !important;
  }
}

/* P4DL_SPECTATOR_EDGE_ROLE_ART_END */

/* P4DM_ROLE_ART_FULL_HEIGHT_START

   PC spectator only.

   Final composition:
   - actor canvas uses the full background height
   - actor lower edge aligns to background lower edge
   - dialogue overlays the lower actor area
   - speaking actor remains larger
   - inactive actor remains smaller/grayscale
   - username cards remain above the dialogue
*/

@media (min-width:901px){

  /*
    Full scene height for cast.
    This is the key change from Phase4D-L.
  */
  

  /*
    Ensure both slots occupy full background height
    and anchor their artwork to the bottom.
  */
  

  /*
    Current speaker:
    approximately 3:4 portrait proportions.
    Significantly larger than Phase4D-L.
  */
  

  /*
    Inactive / previous speaker:
    enlarged as well, but remains clearly smaller.
  */
  

  /*
    Left and right canvases remain attached to
    their respective scene edges.
  */
  

  

  /*
    Preserve image proportions.
  */
  

  /*
    Keep the username labels where they were:
    immediately above the compact dialogue card,
    even though the cast layer now reaches the
    scene bottom.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-cast-layer.two-actor-stage
  .performance-user-name{
    top:auto !important;

    bottom:
      calc(
        2% +
        clamp(110px,22%,180px) +
        24px
      ) !important;
  }

  /*
    Horizontal username guides remain approximately
    aligned with the dialogue's 6% edges.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-slot.slot-left
  .performance-user-name{
    left:12% !important;
    right:auto !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:12% !important;
  }

  /*
    Dialogue stays above the artwork.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-card{
    z-index:10 !important;
  }

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-user-name{
    z-index:11 !important;
  }
}

/* P4DM_ROLE_ART_FULL_HEIGHT_END */

/* P4DN_ROLE_ART_EDGE_TRIM_START

   PC spectator only.

   Fine adjustment after Phase4D-M:
   - enlarge both role-art canvases slightly
   - push left actor 14px beyond left scene edge
   - push right actor 14px beyond right scene edge
   - push both 14px below scene bottom
   - performance-scene overflow clips the excess
   - username and dialogue layout stay unchanged
*/

@media (min-width:901px){

  /* Current speaker */

  

  /* Inactive / previous speaker */

  

  /* Left visible artwork meets left background edge. */

  

  /* Right visible artwork meets right background edge. */

  

  /*
    Keep original image proportions and bottom anchor.
    Right-side mirroring remains controlled by the
    existing role-art rule.
  */

  
}

/* P4DN_ROLE_ART_EDGE_TRIM_END */

/* P4DO_TRANSLATION_FONT_15X_START
   PC spectator translation only.
   18px -> 27px = 1.5x.
*/
@media (min-width:901px){

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation{
    font-size:27px !important;
  }
}

/* P4DO_TRANSLATION_FONT_15X_END */

/* P4DQ_SIDE_BASED_EDGE_ANCHOR_START

   PC spectator only.

   Position belongs to SIDE, never speaking state.

   Left slot:
   - always anchored to scene left edge

   Right slot:
   - always anchored to scene right edge

   Speaking/inactive state continues to control only
   size, grayscale and opacity.
*/

@media (min-width:901px){

  /* ---------- LEFT SLOT ---------- */

  

  /* ---------- RIGHT SLOT ---------- */

  

  /*
    Speaking image scaling must expand from its own
    outer edge rather than toward the center.
  */

  

  
}

/* P4DQ_SIDE_BASED_EDGE_ANCHOR_END */

/* P4EB_PARTICIPANT_VISUAL_PARITY_START

   PC participant only.

   Match the approved spectator composition for:
   - scene/background size
   - actor size and edge position
   - dialogue frame size and position
   - spoken dialogue font / fit levels

   Participant-specific behavior remains unchanged.
*/

@media (min-width:901px){

  /* ==================================================
     1. BACKGROUND
     ================================================== */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-scene{
    width:min(1680px, calc(100vw - 24px)) !important;
    min-width:min(1680px, calc(100vw - 24px)) !important;
    max-width:1680px !important;
    align-self:center !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-scene-background img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:50% 50% !important;
    transform:none !important;
  }


  /* ==================================================
     2. ACTOR AREA
     Full scene height, same as spectator.
     ================================================== */

  

  


  /* Current speaker */

  


  /* Inactive speaker */

  


  /* Side controls position, not speaking state. */

  

  


  /* Speaking scale expands from its outside edge. */

  

  


  /* Never stretch role artwork. */

  


  /* ==================================================
     3. USERNAME POSITION
     Geometry compensation only.
     Size/font/style are unchanged.
     ================================================== */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-cast-layer.two-actor-stage
  .performance-user-name{
    top:auto !important;

    bottom:
      calc(
        2% +
        clamp(110px,22%,180px) +
        24px
      ) !important;

    z-index:11 !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-slot.slot-left
  .performance-user-name{
    left:12% !important;
    right:auto !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:12% !important;
  }


  /* ==================================================
     4. DIALOGUE FRAME
     Same dimensions as spectator.
     Participant-specific inner controls remain.
     ================================================== */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-card{
    left:6% !important;
    right:6% !important;
    bottom:2% !important;

    height:clamp(
      110px,
      22%,
      180px
    ) !important;

    min-height:110px !important;
    max-height:180px !important;

    padding:10px 14px !important;
    gap:0 !important;

    z-index:10 !important;
  }


  /* Dialogue text region */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy{
    flex:1 1 auto !important;
    min-height:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:1px 8px !important;
    overflow:hidden !important;
  }


  /* ==================================================
     5. MAIN DIALOGUE FONT
     Same spectator font + auto-fit ladder.
     ================================================== */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;

    font-size:36px !important;
    line-height:1.20 !important;

    text-align:center !important;
    overflow:visible !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-0,

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-1,

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-2{
    font-size:36px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-3{
    font-size:32px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-4{
    font-size:29px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-5{
    font-size:26px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-6{
    font-size:23px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-7{
    font-size:20px !important;
    line-height:1.20 !important;
  }


  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-copy
  .performance-line.performance-fit-8{
    font-size:17px !important;
    line-height:1.20 !important;
  }
}

/* P4EB_PARTICIPANT_VISUAL_PARITY_END */

/* P4EC_PARTICIPANT_USERNAME_SPEAKER_START

   PC participant only.

   1. Match username horizontal/vertical placement
      to the approved spectator composition.

   2. Remove the duplicate speaker-name label from
      the upper-left of the dialogue card.

   No size or behavior changes.
*/

@media (min-width:901px){

  /* ---------- username vertical position ---------- */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-cast-layer.two-actor-stage
  .performance-slot
  .performance-user-name{
    position:absolute !important;
    top:auto !important;

    bottom:
      calc(
        2% +
        clamp(110px,22%,180px) +
        24px
      ) !important;
  }


  /* ---------- left username ---------- */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-left
  .performance-user-name{
    left:12% !important;
    right:auto !important;

    margin-left:0 !important;
    margin-right:0 !important;
  }


  /* ---------- right username ---------- */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-cast-layer.two-actor-stage
  .performance-slot.slot-right
  .performance-user-name{
    left:auto !important;
    right:12% !important;

    margin-left:0 !important;
    margin-right:0 !important;
  }


  /* ---------- duplicate dialogue speaker label ---------- */

  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-dialogue-speaker{
    display:none !important;
  }
}

/* P4EC_PARTICIPANT_USERNAME_SPEAKER_END */

/* EVALUATION_UI_PHASE2E_START */

.performance-evaluation{
  width:100%;
  min-width:0;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}

.evaluation-prompt,
.evaluation-state{
  font-size:12px;
  line-height:1.3;
  white-space:nowrap;
}

.evaluation-buttons{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  flex-wrap:wrap;
}

.progress-evaluation-button{
  width:auto;
  min-width:0;
  min-height:38px;
  height:auto;

  padding:7px 12px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  line-height:1.2;
  white-space:nowrap;
}

.progress-evaluation-button:disabled{
  cursor:default;
  opacity:.55;
}

.evaluation-label{
  display:inline;
  font-size:13px;
  line-height:1.2;
}

.review-evaluation-filter{
  margin:0 0 18px;

  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.review-evaluation-filter label{
  font-weight:700;
}

.review-evaluation-filter select{
  width:auto;
  min-width:180px;
}

.review-evaluation{
  margin:8px 0 0;
}

.review-evaluation-name{
  display:inline-flex;
  align-items:center;

  min-height:28px;
  padding:4px 9px;

  border:1px solid currentColor;
  border-radius:999px;

  font-weight:700;
  line-height:1.2;
}


/*
  Evaluation choices are always visible text.
  No icon-only mode on desktop or mobile.
*/
@media (max-width:700px){

  .performance-evaluation{
    gap:5px;
  }

  .evaluation-prompt,
  .evaluation-state{
    width:100%;
    text-align:center;
  }

  .evaluation-buttons{
    width:100%;

    display:grid;
    grid-template-columns:
      repeat(3,minmax(0,1fr));

    gap:5px;
  }

  .progress-evaluation-button{
    width:100%;
    min-width:0;
    min-height:40px;

    padding:6px 4px;

    white-space:normal;
  }

  .evaluation-label{
    display:inline;
    min-width:0;

    font-size:11px;
    line-height:1.2;
    text-align:center;
  }

  .review-evaluation-filter{
    align-items:stretch;
  }

  .review-evaluation-filter label,
  .review-evaluation-filter select{
    width:100%;
  }

}

/* EVALUATION_UI_PHASE2E_END */


/* Phase 8A production avatar profile */
.avatar-profile-dialog{
 width:min(760px,100%);
}

.avatar-profile-section{
 margin-top:28px;
 padding-top:22px;
 border-top:1px solid var(--line);
}

.avatar-profile-section h3{
 margin:0 0 14px;
 font-family:var(--serif);
 font-size:20px;
}

.avatar-profile-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:14px;
}

.avatar-profile-card{
 min-width:0;
 border:1px solid var(--line);
 padding:10px;
 background:var(--paper);
}

.avatar-profile-card.is-selected{
 border-color:var(--gold);
 box-shadow:0 0 0 1px var(--gold);
}

.avatar-profile-image{
 aspect-ratio:1/1;
 display:grid;
 place-items:center;
 overflow:hidden;
 background:var(--cream);
 margin-bottom:10px;
}

.avatar-profile-image img{
 width:100%;
 height:100%;
 object-fit:cover;
 display:block;
}

.avatar-profile-card .outline,
.avatar-profile-card .quiet{
 width:100%;
 margin-top:7px;
}

#avatar-upload-form{
 margin-top:18px;
}

#avatar-upload-form .primary{
 margin-top:12px;
}

#avatar-profile-clear{
 width:100%;
 margin-top:24px;
}

@media(max-width:650px){
 .avatar-profile-grid{
  grid-template-columns:
   repeat(2,minmax(0,1fr));
 }
}

/* Phase 12D-12: shared avatar selection moved to the global header. */
#avatar-common-upload-form{
 margin-top:16px;
}

#avatar-common-upload-form .primary{
 margin-top:12px;
}

#avatar-header-clear{
 width:100%;
 margin-top:24px;
}

#header-avatar{
 white-space:nowrap;
}

@media(max-width:650px){
 #header-avatar{
  order:initial;
 }
}

/* Phase G: per-line review favorites. */
.review-favorite-line{
 appearance:none;
 border:0;
 background:transparent;
 padding:4px 6px;
 font:inherit;
 font-size:1.7rem;
 line-height:1;
 cursor:pointer;
}

.review-favorite-line:disabled{
 cursor:wait;
 opacity:.55;
}

.review-favorite-line.is-favorite{
 font-weight:700;
}


/*
  AVATAR_LAYOUT_V3_20261006

  Targets only:
  - read-through-avatar-stage
  - result overview-scene

  Does NOT modify:
  - performance participant-scene
  - Review line-list page
*/


/* =================================================
   READ-THROUGH
   ================================================= */

.read-through-avatar-stage{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
}

.read-through-avatar-stage
.cast-avatars{
  display:flex !important;
  flex-wrap:wrap !important;

  gap:16px !important;

  align-items:stretch !important;
  justify-content:center !important;

  overflow:visible !important;
}

.read-through-avatar-stage
.avatar-preview{
  flex:1 1 320px !important;

  width:auto !important;
  min-width:0 !important;
  max-width:540px !important;

  display:flex !important;
  flex-direction:column !important;
}

.read-through-avatar-stage
.avatar-layers{
  position:relative !important;

  width:100% !important;
  height:260px !important;

  min-height:260px !important;
  max-height:260px !important;

  overflow:hidden !important;

  display:block !important;
}

.read-through-avatar-stage
.progression-role-art{
  position:absolute !important;

  inset:0 !important;

  display:block !important;

  width:100% !important;
  height:100% !important;

  max-width:100% !important;
  max-height:100% !important;

  object-fit:contain !important;
  object-position:center bottom !important;

  transform:none !important;
}


/* =================================================
   RESULT

   result uses:
   cast-stage conversation-scene overview-scene

   Remove the performance-style fixed viewport
   behaviour only from overview-scene.
   ================================================= */

.cast-stage.conversation-scene.overview-scene{
  display:block !important;

  width:auto !important;
  height:auto !important;

  min-height:0 !important;
  max-height:none !important;

  overflow:visible !important;

  padding:20px !important;

  gap:0 !important;
}

.cast-stage.overview-scene
.scene-background{
  flex:none !important;
}

.cast-stage.overview-scene
.cast-avatars{
  display:flex !important;

  flex:none !important;
  flex-wrap:wrap !important;

  width:100% !important;

  min-height:0 !important;
  max-height:none !important;

  margin-top:16px !important;
  padding:0 !important;

  gap:16px !important;

  overflow:visible !important;

  align-items:stretch !important;
  justify-content:center !important;
}

.cast-stage.overview-scene
.avatar-preview{
  flex:1 1 320px !important;

  width:auto !important;
  min-width:0 !important;
  max-width:540px !important;

  padding:12px !important;

  display:flex !important;
  flex-direction:column !important;
}

.cast-stage.overview-scene
.avatar-layers{
  position:relative !important;

  flex:none !important;

  width:100% !important;
  height:260px !important;

  min-height:260px !important;
  max-height:260px !important;

  overflow:hidden !important;

  display:block !important;
}

.cast-stage.overview-scene
.progression-role-art{
  position:absolute !important;

  inset:0 !important;

  display:block !important;

  width:100% !important;
  height:100% !important;

  max-width:100% !important;
  max-height:100% !important;

  object-fit:contain !important;
  object-position:center bottom !important;

  transform:none !important;
}


/*
  Result's previous-line text remains below the avatars,
  but must not control avatar-area height.
*/
.cast-stage.overview-scene
.conversation-dialogue{
  flex:none !important;

  min-height:0 !important;

  overflow:visible !important;

  margin-top:16px !important;
}


/* =================================================
   MOBILE
   ================================================= */

@media(max-width:650px){

  .read-through-avatar-stage
  .avatar-preview,
  .cast-stage.overview-scene
  .avatar-preview{
    flex-basis:100% !important;
    max-width:100% !important;
  }

  .read-through-avatar-stage
  .avatar-layers,
  .cast-stage.overview-scene
  .avatar-layers{
    height:210px !important;
    min-height:210px !important;
    max-height:210px !important;
  }

}


/*
  PHASE_I_PROFILE_MY_LIST_20261006
*/

.profile-favorite-section{
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid var(--line);
}

.profile-favorite-list{
  display:grid;
  gap:14px;
  margin-top:14px;
}

.profile-favorite-line{
  min-width:0;
  padding:16px;
  border:1px solid var(--line);
  background:var(--paper);
}

.profile-favorite-meta{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.profile-favorite-meta strong{
  min-width:0;
  overflow-wrap:anywhere;
}

.profile-favorite-meta span{
  flex:none;
  color:var(--muted);
  font-size:14px;
}

.profile-favorite-text{
  margin-top:12px;
  font-family:var(--serif);
  font-size:20px;
  line-height:1.7;
  overflow-wrap:anywhere;
}

.profile-favorite-translation{
  margin-top:8px;
  color:var(--muted);
  overflow-wrap:anywhere;
}

.profile-favorite-audio{
  display:block;
  width:100%;
  max-width:100%;
  margin-top:14px;
}

#avatar-profile-dialog{
  overflow:auto;
}

@media(max-width:650px){
  .profile-favorite-meta{
    display:block;
  }

  .profile-favorite-meta span{
    display:block;
    margin-top:4px;
  }

  .profile-favorite-text{
    font-size:18px;
  }
}


/*
  SPECTATOR_DIALOGUE_DISPLAY_FIX_20261007

  Scope:
  - spectator performance only

  Goals:
  - prevent translation clipping
  - normalize Japanese/English spacing
  - preserve existing 27px spectator translation
  - leave participant/read-through/review untouched
*/


/* =================================================
   ALL SPECTATOR VIEWPORTS
   ================================================= */

main.performance-main.performance-fixed-page[data-spectator]
.performance-dialogue-copy{
  min-width:0 !important;
  min-height:0 !important;

  overflow-x:hidden !important;
  overflow-y:auto !important;

  overscroll-behavior:contain;
}


main.performance-main.performance-fixed-page[data-spectator]
.performance-dialogue-copy
.performance-line{
  width:100% !important;
  max-width:100% !important;

  white-space:normal !important;

  text-align:center !important;
  text-align-last:center !important;
  text-justify:auto !important;

  letter-spacing:0 !important;
  word-spacing:0 !important;

  line-break:auto;
  word-break:normal;
  overflow-wrap:anywhere;

  font-kerning:normal;
  text-rendering:optimizeLegibility;
}


main.performance-main.performance-fixed-page[data-spectator]
.performance-dialogue-translation{
  width:100% !important;
  max-width:100% !important;

  white-space:normal !important;

  text-align:center !important;
  text-align-last:center !important;

  letter-spacing:0 !important;
  word-spacing:0 !important;

  line-break:auto;
  word-break:normal;
  overflow-wrap:anywhere;

  flex:0 0 auto !important;
}


/* =================================================
   DESKTOP SPECTATOR

   Previous compact target:
     110px - 180px

   Translation was later enlarged to 27px, so give
   the dialogue stack enough vertical room.

   Cast bottom follows the exact same height formula
   so actor artwork does not overlap the dialogue.
   ================================================= */

@media (min-width:901px){

  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-card{
    height:clamp(
      190px,
      30%,
      280px
    ) !important;

    min-height:190px !important;
    max-height:280px !important;

    padding:10px 14px !important;

    overflow:hidden !important;
  }


  


  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy{
    padding:5px 8px !important;
  }


  /*
    Keep the approved translation maximum.
    This rule exists only to make the final cascade
    explicit after the overflow fix.
  */
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation{
    font-size:27px !important;
    line-height:1.45 !important;
  }
}


/* END_SPECTATOR_DIALOGUE_DISPLAY_FIX_20261007 */


/*
  FAVORITES_STANDALONE_PAGE_20261007_START

  Dedicated Favorites page.
  Profile now contains only the entry link.
*/


.avatar-profile-favorites-link-section{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}


.avatar-profile-favorites-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  text-decoration:none;
}


.favorites-standalone-body{
  min-height:100vh;
}


.favorites-site-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;

  padding:16px
    clamp(18px,4vw,48px);

  border-bottom:
    1px solid
    rgba(127,127,127,.22);
}


.favorites-brand{
  font-weight:800;
  font-size:1.1rem;
  text-decoration:none;
  color:inherit;
}


.favorites-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
}


.favorites-nav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}


.favorites-main{
  width:min(
    1120px,
    calc(100% - 32px)
  );

  margin:0 auto;

  padding:
    clamp(30px,5vw,64px)
    0
    72px;
}


.favorites-hero{
  margin-bottom:28px;
}


.favorites-hero h1{
  margin:
    6px
    0
    10px;

  font-size:
    clamp(
      2rem,
      5vw,
      3.4rem
    );
}


.favorites-hero p{
  max-width:760px;
}


.favorites-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;

  margin:
    0
    0
    18px;

  padding:
    12px
    0;
}


.favorites-list{
  display:grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(
        min(100%,420px),
        1fr
      )
    );

  gap:18px;
}


.favorites-card{
  display:flex;
  flex-direction:column;
  gap:14px;

  min-width:0;

  padding:
    clamp(18px,3vw,26px);

  border:
    1px solid
    rgba(127,127,127,.22);

  border-radius:18px;
}


.favorites-card-meta{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}


.favorites-card-meta strong{
  min-width:0;
  overflow-wrap:anywhere;
}


.favorites-card-text{
  margin:0;

  font-size:
    clamp(
      1.1rem,
      2.5vw,
      1.35rem
    );

  line-height:1.7;

  white-space:pre-wrap;
  overflow-wrap:anywhere;
}


.favorites-card-translation{
  margin:0;

  opacity:.82;

  line-height:1.65;

  white-space:pre-wrap;
  overflow-wrap:anywhere;
}


.favorites-card-audio{
  margin-top:auto;
}


.favorites-card-audio audio{
  display:block;
  width:100%;
  max-width:100%;
}


.favorites-status-panel{
  padding:
    clamp(18px,3vw,28px);
}


@media (max-width:700px){

  .favorites-site-header{
    align-items:flex-start;
    flex-direction:column;
  }


  .favorites-header-actions{
    width:100%;
    justify-content:flex-start;
  }


  .favorites-main{
    width:min(
      100% - 24px,
      1120px
    );

    padding-top:26px;
  }


  .favorites-card-meta{
    flex-direction:column;
  }
}


/* FAVORITES_STANDALONE_PAGE_20261007_END */

/* Schema1 controls are rendered only for new level-2 runs. */
.schema1-difficulty-panel {margin:1rem 0;padding:1rem;border:1px solid currentColor;border-radius:0.6rem}
.schema1-difficulty-panel form {display:flex;flex-wrap:wrap;align-items:center;gap:0.7rem}
.schema1-difficulty-panel select {min-height:2.6rem}
.schema1-deadline {font-variant-numeric:tabular-nums;text-align:center;padding:0.5rem;font-weight:600}
.schema1-deadline strong {font-size:1.4rem}
.schema1-deadline.is-expired strong {opacity:0.65}

/* Unreleased schema1: clear pre-performance, review and learning notes. */
.schema1-briefing-notice {
  max-width: 56rem;
  margin: 2rem auto;
  padding: clamp(1.25rem,4vw,2.75rem);
  border: 1px solid var(--border, #bbb);
  border-radius: 1rem;
  text-align: center;
  line-height: 1.6;
}
.schema1-briefing-notice strong {
  display: block;
  font-size: clamp(2rem,6vw,3.5rem);
  font-variant-numeric: tabular-nums;
}
.learning-note { margin: .75rem 0; padding: .75rem 1rem; border-left: 3px solid currentColor; }
.learning-note p { margin: .35rem 0 0; }
.review-time-filter { margin: .75rem 0 1rem; }
.review-time-filter label { display: block; margin-bottom: .35rem; }
.review-time-result { display: inline-block; margin: .4rem 0; font-weight: 600; }
.spectator-note { font-style: italic; }
/* Role & Talk: mobile spectator presentation only.
   No participant, desktop, background, data or API changes. */
@media (max-width:700px) {
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    min-width:0 !important;
    width:100% !important;
    padding:4px 8px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-copy .performance-line {
    display:block !important;
    flex:0 0 auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    writing-mode:horizontal-tb !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
    text-align:center !important;
  }
  main.performance-main.performance-fixed-page[data-spectator]
  .performance-dialogue-translation {
    display:block !important;
    flex:0 0 auto !important;
    min-width:0 !important;
    max-width:100% !important;
    width:100% !important;
    margin:8px 0 0 !important;
    writing-mode:horizontal-tb !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    text-align:center !important;
  }
  /* Keep both actors above the dialogue card, without spilling outside the scene. */
  
  
  
  
}
/* ROLE_TALK_MOBILE_SPECTATOR_AVATAR_ABOVE_DIALOGUE_20261013
   Mobile spectator ONLY. Actor portraits reside in the part of the scene
   ABOVE the existing dialogue card. Preserve dialogue text and background. */
@media (max-width:700px) {
  
  
  
  
  /* Keep both performers within their halves, not pushed off-screen. */
  
  
}
/* END_ROLE_TALK_MOBILE_SPECTATOR_AVATAR_ABOVE_DIALOGUE_20261013 */
/* ROLE_TALK_AVATAR_BALANCE_MOBILE_PC_20261013
   Display-only adjustment for the two-actor performance scene.
   No dialogue, controls, progression or background changes. */

/* On desktop, inactive speaker must retain the same portrait canvas size
   as the active speaker. Grayscale (not scale) distinguishes the state. */
@media (min-width: 901px) {
  
  
  /* The left portrait content sits smaller in its available canvas in the
     supplied desktop example. Compensate at the image, not the whole slot. */
  
}

/* Mobile spectator: lower both portraits without moving the dialogue card.
   The existing names, dialogue text, and translation remain untouched. */
@media (max-width: 700px) {
  
}
/* END_ROLE_TALK_AVATAR_BALANCE_MOBILE_PC_20261013 */
/* ROLE_TALK_MOBILE_PARTICIPANT_AVATAR_ABOVE_DIALOGUE_20261013
   Portrait mobile participant ONLY: reserve the scene above the existing
   dialogue card for both role avatars. Do not modify spectator or desktop.
   Keep dialogue and action buttons in their existing positions. */
@media (max-width:700px) {
  
  
  
  
}
/* END_ROLE_TALK_MOBILE_PARTICIPANT_AVATAR_ABOVE_DIALOGUE_20261013 */
/* ROLE_TALK_MOBILE_AVATAR_DYNAMIC_GAP_FIX_20261013
   Two-person performance, mobile participant + spectator only.
   Restore speaking-state scale differences; keep portraits visually anchored
   to the dialogue upper edge. Color/grayscale ownership stays unchanged. */
@media (max-width:700px) {
  /* Lower both cast layers slightly into the existing dialogue card. */
  
  /* Give the mobile cast the same bottom anchoring independent of speaker. */
  
  /* The image, not its layout box, changes scale with speaker state. */
  
  
}
/* END_ROLE_TALK_MOBILE_AVATAR_DYNAMIC_GAP_FIX_20261013 */
/* ROLE_TALK_MOBILE_AVATAR_FLIP_OVERLAP_20261013
   Correct only two-actor mobile participant/spectator avatar placement.
   The right avatar faces inward. Portraits overlap the dialogue top edge.
   Preserve existing grayscale and left/right speaking-size differences. */
@media (max-width:700px) {
  
  
  
  
}
/* END_ROLE_TALK_MOBILE_AVATAR_FLIP_OVERLAP_20261013 */
/* ROLE_TALK_MOBILE_AVATAR_UNIFORM_SCALE_20261013
   Mobile two-actor participant/spectator ONLY.
   Equal geometric base and equal speaking/inactive scale on both sides.
   Preserve right-side inward-facing flip and the previous 24px overlap.
   Does not change grayscale/color, dialogue, controls or desktop layout.
*/
@media (max-width:700px) {
  
  
  
  
  
  
}
/* END_ROLE_TALK_MOBILE_AVATAR_UNIFORM_SCALE_20261013 */
/* ROLE_TALK_MOBILE_AVATAR_FRAME_NORMALIZE_20261013
   The role image files are 1600x1600 with different silhouette widths.
   Normalize the image BOX, not the human silhouette width (body-shape preserving).
   Mobile participant + spectator two-actor stages only.
*/
@media (max-width: 700px) {
  
  
  
  
  
  
  /* ROLE_TALK_MOBILE_AVATAR_SCALE_ONLY_20261013
     Keep existing cast positioning, image mirroring and speaker filter.
     Scale the existing art BOX, anchored at the lower edge. No layout edits. */
  
  

}
/* END_ROLE_TALK_MOBILE_AVATAR_FRAME_NORMALIZE_20261013 */

/* ROLE_TALK_STEP6_SCRIPT_CARD_20261014: host picker only */
#progress-script-dialog .script-search-card .script-search-title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px;min-width:0}
#progress-script-dialog .script-search-card .script-search-title{flex:0 1 auto;min-width:0}
#progress-script-dialog .script-search-card .script-search-meta{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:5px 9px;margin:0;font-size:12px;min-width:0}
#progress-script-dialog .script-search-card .script-search-meta span{white-space:nowrap}
#progress-script-dialog .script-search-card .script-search-content{min-width:0}
#progress-script-dialog .script-search-card .rt-step6-difficulty{display:flex;gap:6px;flex-wrap:nowrap;align-items:center;margin-top:4px}
#progress-script-dialog .rt-step6-difficulty [data-host-difficulty]{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:29px;padding:3px 10px;border:1px solid var(--line);border-radius:5px;cursor:pointer;font-size:12px;line-height:1.2;background:var(--paper);color:var(--ink)}
#progress-script-dialog .rt-step6-difficulty [data-host-difficulty][aria-checked="true"]{background:var(--wine);color:var(--paper);border-color:var(--wine)}
#progress-script-dialog .rt-step6-difficulty [data-host-difficulty]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media(max-width:650px){#progress-script-dialog .script-search-card .script-search-title-row{gap:2px 7px}#progress-script-dialog .rt-step6-difficulty [data-host-difficulty]{padding:4px 8px;font-size:11px}}
/* END_ROLE_TALK_STEP6_SCRIPT_CARD_20261014 */

/* ROLE_TALK_STEP6_CORRECTION_RIGHT_ALIGN_20261014: host cards only */
#progress-script-dialog .script-search-card .script-search-title-row{justify-content:space-between;width:100%}
#progress-script-dialog .script-search-card .script-search-title{flex:1 1 auto}
#progress-script-dialog .script-search-card .script-search-meta{margin-left:auto;text-align:right;justify-content:flex-end;flex:0 0 auto}
@media(max-width:650px){#progress-script-dialog .script-search-card .script-search-meta{margin-left:auto}}
/* END_ROLE_TALK_STEP6_CORRECTION_RIGHT_ALIGN_20261014 */


/* ROLE_TALK_AVATAR_REBUILD_20261014: sole performance avatar geometry and states.
   Do not style read-through or review avatars here. */
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage{
 position:absolute !important; inset:0 0 0 0 !important;
 display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
 align-items:end !important; gap:0 !important; overflow:hidden !important;
 pointer-events:none !important; z-index:2 !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot{
 position:relative !important; height:100% !important; width:100% !important;
 min-width:0 !important; max-width:none !important; max-height:none !important;
 margin:0 !important; padding:0 !important; display:flex !important;
 align-items:flex-end !important; justify-content:flex-end !important;
 overflow:hidden !important; opacity:1 !important; transform:none !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.slot-left{grid-column:1 !important;align-items:flex-start !important}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.slot-right{grid-column:2 !important;align-items:flex-end !important}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-avatar-art{
 position:relative !important; flex:0 0 auto !important;
 width:min(100%,calc((100svh - var(--header-height,160px)) * .73)) !important;
 height:min(100%,calc(100svh - var(--header-height,160px))) !important;
 min-width:0 !important; min-height:0 !important; max-width:100% !important;
 max-height:100% !important; margin:0 !important; padding:0 !important;
 bottom:0 !important; left:auto !important; right:auto !important;
 display:block !important; overflow:hidden !important;
 transform-origin:bottom center !important; filter:none !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-role-art{
 width:100% !important; height:100% !important; min-height:0 !important;
 max-width:100% !important; max-height:100% !important; display:block !important;
 object-fit:contain !important; object-position:center bottom !important;
 transform:none !important; transform-origin:center bottom !important;
 filter:none !important; opacity:1 !important;
}
/* Participant right-side opponent faces the viewer's left (toward own avatar). */
main.performance-main.performance-fixed-page:not([data-spectator]) .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.slot-right .performance-role-art{
 transform:scaleX(-1) !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.inactive .performance-avatar-art{
 transform:scale(.7) !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.inactive .performance-role-art{
 filter:grayscale(1) !important; opacity:1 !important;
}
main.performance-main.performance-fixed-page .performance-scene .performance-cast-layer.two-actor-stage .performance-slot.speaking .performance-avatar-art{
 transform:scale(1) !important;
}
/* ROLE_TALK_MOBILE_AVATAR_SEAM_HEIGHT_FIX_20261014
   Mobile only: make cast height end at dialogue top rather than using
   a bottom inset on a full-height cast. No PC, dialogue or state changes. */
@media(max-width:700px){
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage{
  --rt-dialogue-mobile-height:max(45%,220px);
  inset:auto 0 auto 0 !important;
  top:0 !important;
  bottom:auto !important;
  height:calc(98.5% - var(--rt-dialogue-mobile-height)) !important;
  max-height:calc(98.5% - var(--rt-dialogue-mobile-height)) !important;
  min-height:0 !important;
  overflow:hidden !important;
 }
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage .performance-slot{
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  justify-content:flex-end !important;
 }
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage .performance-avatar-art{
  width:min(100%,46vw) !important;
  height:100% !important;
  max-height:100% !important;
  flex:0 0 auto !important;
  bottom:0 !important;
 }
}
@media(max-width:430px){
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage{--rt-dialogue-mobile-height:max(47%,220px)}
}
@media(max-width:390px){
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage{--rt-dialogue-mobile-height:max(49%,220px)}
}
@media(max-width:700px) and (max-height:700px){
 main.performance-main.performance-fixed-page .performance-scene
 .performance-cast-layer.two-actor-stage{--rt-dialogue-mobile-height:max(50%,205px)}
}
/* END_ROLE_TALK_MOBILE_AVATAR_SEAM_HEIGHT_FIX_20261014 */

/* ROLE_TALK_STAGE_NEXT_PERFORMANCE_TRANSITION_20261018 */
.schema1-briefing-notice {
 position:fixed!important; inset:0!important; z-index:9000!important;
 background:#05070c!important; color:#f6f7fa!important;
 display:flex!important; flex-direction:column!important;
 justify-content:center!important; align-items:center!important;
 padding:clamp(22px,5vw,72px)!important; text-align:center!important;
 overflow:auto!important; gap:1rem!important;
 animation:rt-briefing-blackout .3s ease-out both;
}
.schema1-briefing-notice h2 {font-size:clamp(1.25rem,3.5vw,2rem);color:#fff!important;}
.schema1-briefing-notice p {max-width:850px;line-height:1.8;color:#e0e5ee!important;}
.schema1-briefing-notice .rt-transition-level {font-weight:700;letter-spacing:.08em;}
.schema1-briefing-notice .rt-transition-situation {white-space:pre-wrap;}
.schema1-briefing-notice #schema1-briefing-countdown {font-size:clamp(3rem,11vw,7rem);line-height:1.2;}
.schema1-briefing-notice #schema1-start-countdown {min-width:160px;min-height:48px;}
@keyframes rt-briefing-blackout {from {opacity:0} to {opacity:1}}
@media(prefers-reduced-motion:reduce){.schema1-briefing-notice{animation:none!important}}

/* GATE_C04_20261018_STORY_FULL_BLEED_BRIEFING */
#work-request-panel #work-request-form > label {
 display:block;
 width:100%;
 margin:0.8rem 0;
}
#work-request-panel #work-story {
 display:block;
 width:100%;
 min-width:0;
 max-width:100%;
 height:clamp(240px,35vh,420px);
 min-height:240px;
 padding:12px 14px;
 border:1px solid var(--line);
 border-radius:6px;
 background:var(--paper);
 color:var(--ink);
 font:inherit;
 line-height:1.6;
 resize:vertical;
}
.schema1-briefing-notice {
 position:fixed!important;
 inset:0!important;
 width:100vw!important;
 max-width:none!important;
 min-height:100dvh!important;
 height:100dvh!important;
 margin:0!important;
 border:0!important;
 border-radius:0!important;
 box-shadow:none!important;
 box-sizing:border-box!important;
}
.schema1-briefing-notice > * {
 animation:rt-stage04-briefing-content .24s ease-out .3s both;
}
@keyframes rt-stage04-briefing-content {from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 .schema1-briefing-notice > * {animation:none!important}
}
/* END_GATE_C04_20261018 */


/* ROLE_TALK_SOLO_FIXED_LAYOUT_20261020
   Desktop solo controls only.
   No changes to dialogue dimensions, typography fitting,
   spectator layout, multiplayer layout or avatars.
*/
@media (min-width:901px) {
  main.performance-main.performance-fixed-page:not([data-spectator])
  .performance-action-row.schema1-solo-partner {
    flex:0 0 auto !important;
    min-height:0 !important;
    width:100% !important;
    padding:0 !important;
    margin:0 !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .schema1-solo-partner .schema1-solo-understanding {
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    align-items:center !important;
    column-gap:8px !important;
    row-gap:4px !important;
    width:min(100%,900px) !important;
    margin:0 auto !important;
    padding:0 !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .schema1-solo-partner #schema1-solo-audio-status {
    grid-column:1/-1;
    margin:0 !important;
    padding:0 !important;
    font-size:12px !important;
    line-height:1.25 !important;
    text-align:center !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .schema1-solo-partner
  [data-schema1-solo-understanding] {
    width:100% !important;
    min-width:0 !important;
    min-height:34px !important;
    height:auto !important;
    padding:5px 7px !important;
    margin:0 !important;
    font-size:13px !important;
    line-height:1.25 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .schema1-solo-partner #schema1-solo-manual-play {
    grid-column:3;
    grid-row:1;
    width:100% !important;
    min-height:30px !important;
    margin:0 !important;
    padding:4px 6px !important;
    font-size:12px !important;
  }

  main.performance-main.performance-fixed-page:not([data-spectator])
  .schema1-solo-understanding:has(#schema1-solo-manual-play)
  #schema1-solo-audio-status {
    grid-column:1/3;
  }
}


/* ROLE_TALK_SOLO_REVIEW_AUDIO_V3_20261020
   Review only. Performance layout remains unchanged.
*/
.solo-review-partner{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.solo-review-partner strong{
  width:100%;
}
.solo-review-partner audio{
  width:min(100%,420px);
  max-width:100%;
}
.solo-review-partner label{
  display:inline-flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  font-size:14px;
}
.solo-review-playback-speed{
  min-height:38px;
  padding:5px 9px;
}
@media(max-width:650px){
  .solo-review-partner audio{
    width:100%;
  }
}

/* ROLE_TALK_NATIVE_MODEL_SOLO_V1: own-line example in solo review */
.solo-review-native{padding:.85rem;margin:.55rem 0;border:1px solid var(--line,#777);border-radius:.6rem}
.solo-review-native strong{display:block;margin-bottom:.45rem}
.solo-review-native audio{display:block;width:100%;max-width:100%;margin:.4rem 0}
.solo-review-native label{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}

/* Top-page total hits: decorative badge matching the site's wine/gold motif. */
.header .top-access-counter{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;white-space:nowrap;padding:8px 14px 8px 11px;border:1px solid #d9c4a2;border-radius:999px;background:linear-gradient(180deg,#fffaf1 0%,#f1e4d2 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 6px 14px rgba(54,19,30,.06);color:var(--wine)}
.header .top-access-counter-kicker{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:32px;padding:0 10px;border-radius:999px;border:1px solid var(--wine-dark);background:var(--wine);color:#fff6e5;font-family:var(--serif);font-size:11px;font-weight:700;letter-spacing:.12em;line-height:1;text-transform:uppercase}
.header .top-access-counter-body{display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1}
.header .top-access-counter-label{font-size:10px;letter-spacing:.08em;color:var(--muted)}
.header .top-access-counter strong{display:block;color:var(--wine);font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1}
@media(max-width:650px){.header .top-access-counter{gap:8px;padding:7px 12px 7px 9px}.header .top-access-counter-kicker{min-width:34px;height:28px;padding:0 8px;font-size:10px}.header .top-access-counter strong{font-size:15px}}