:root{--bg:#121212;--panel:#1d1d1f;--panel-2:#242426;--line:rgba(255,255,255,.09);--muted:#8d8d95;--text:#f3f1f6;--purple:#7f45ff;--purple-soft:#a77bff;--yellow:#f3d46a;--serif:Georgia,'Times New Roman',serif;--sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--radius:16px;--visual-viewport-height:100dvh}
*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:var(--sans)}body{margin:0;min-width:320px;background:radial-gradient(circle at 50% 0,#27212e 0,transparent 36rem),var(--bg)}button,input{font:inherit;color:inherit}button{border:0;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--purple-soft);outline-offset:3px}.app{min-height:100svh;padding-bottom:74px}.main{max-width:540px;margin:0 auto;padding:0 16px}.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;max-width:540px;margin:0 auto;position:sticky;top:0;z-index:20;background:rgba(18,18,18,.87);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:8px;background:none;font-weight:800;font-size:22px;letter-spacing:-.07em}.brand-dot{width:18px;height:18px;border-radius:50% 50% 45% 45%;border:2px solid var(--text);position:relative}.brand-dot:after{content:"";position:absolute;bottom:-4px;left:-5px;width:25px;height:1px;background:var(--purple-soft);transform:rotate(-12deg)}.top-actions{display:flex;gap:8px}.round-button{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.06);color:#dedce6;font-size:20px;display:grid;place-items:center}.view{padding-bottom:22px}.view[hidden]{display:none}.eyebrow{font-size:9px;letter-spacing:.17em;text-transform:uppercase;color:#a69fac;font-weight:700}.hero-strip{min-height:190px;border-radius:18px;background:linear-gradient(130deg,#292135,#16171a 64%,#2b2533);padding:24px 22px;margin:6px 0 25px;display:flex;justify-content:space-between;overflow:hidden;position:relative}.hero-strip:after{content:"";position:absolute;inset:auto -30px -55px 42%;height:140px;background:linear-gradient(90deg,transparent,rgba(135,86,255,.22));transform:rotate(-20deg)}h1,h2,p{margin:0}.hero-strip h1{font-size:35px;line-height:.94;letter-spacing:-.06em;margin:7px 0 12px}.hero-strip h1 em{font-family:var(--serif);font-weight:400;color:#d0b2ff}.hero-copy{font-size:12px;line-height:1.45;color:#b7adb9;max-width:185px}.hero-orbit{width:90px;height:110px;align-self:flex-end;position:relative;opacity:.9}.hero-orbit span{position:absolute;border:1px solid rgba(207,173,255,.5);border-radius:50%;transform:rotate(35deg)}.hero-orbit span:nth-child(1){width:65px;height:22px;right:0;top:28px}.hero-orbit span:nth-child(2){width:75px;height:34px;right:3px;top:24px;transform:rotate(80deg)}.hero-orbit span:nth-child(3){width:42px;height:42px;right:15px;top:20px}.hero-orbit b{position:absolute;right:18px;top:45px;font:600 11px ui-monospace,monospace;color:var(--yellow)}.section-head{display:flex;justify-content:space-between;align-items:end;margin:0 1px 13px}.section-head h2{font-size:21px;letter-spacing:-.045em;margin-top:5px}.section-head.compact{margin-top:25px}.text-button{font-size:11px;color:#b4a7c5;background:none;padding:0 0 4px}.text-button span{font-size:15px;margin-left:4px}.chips{display:flex;gap:7px;overflow:auto;margin:0 -2px 17px;padding-bottom:3px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{white-space:nowrap;padding:8px 13px;border-radius:999px;background:#2a2a2d;color:#aaa6ae;font-size:11px}.chip.active{background:var(--purple);color:white}.plot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.plot-card{min-height:250px;border-radius:15px;overflow:hidden;background:#242426;position:relative;transition:transform .2s ease}.plot-card:active{transform:scale(.98)}.plot-art{height:170px;position:relative;overflow:hidden;background:linear-gradient(145deg,#272b43,#16171d)}.plot-art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.8))}.plot-art.lantern{background:linear-gradient(145deg,#a46c3a 0,#4b3547 40%,#141920 100%)}.plot-art.lantern:before{content:"";position:absolute;width:52px;height:90px;left:49%;top:28px;border:3px solid rgba(250,205,122,.8);border-radius:50% 50% 38% 38%;box-shadow:0 0 36px rgba(246,190,86,.6),inset 0 0 16px rgba(246,190,86,.32)}.plot-art.lantern .art-line{position:absolute;left:0;right:0;bottom:34px;height:2px;background:#16191e;box-shadow:0 12px 0 #16191e}.plot-art.neon{background:linear-gradient(145deg,#1a0f3d,#5a2275 45%,#201928)}.plot-art.neon:before{content:"";position:absolute;inset:18px 12px;border:1px solid #da83ff;transform:skewY(-14deg);box-shadow:0 0 25px rgba(219,131,255,.5)}.plot-art.ocean{background:linear-gradient(145deg,#0c5263,#142a48 55%,#0e1828)}.plot-art.ocean:before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-25px;top:22px;background:radial-gradient(circle,#ddbe77 0 7%,transparent 8% 22%,rgba(221,190,119,.3) 23% 25%,transparent 26%)}.plot-art.forest{background:linear-gradient(145deg,#5c3725,#1a3030 45%,#111718)}.plot-art.forest:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(112deg,transparent 0 15px,rgba(169,212,174,.15) 16px 18px,transparent 19px 28px)}.plot-art .art-label{position:absolute;z-index:1;left:12px;bottom:12px;color:#fff;font:500 22px/1 var(--serif);letter-spacing:-.04em}.plot-meta{padding:11px 12px 13px}.plot-meta h3{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px}.plot-meta p{font-size:11px;line-height:1.35;color:#aca8af;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.plot-tags{font-size:10px;color:#827a8e;margin-top:7px}.plot-badge{position:absolute;top:9px;left:9px;z-index:2;background:rgba(20,20,22,.72);border-radius:999px;padding:5px 7px;font-size:9px}.back-button{display:flex;align-items:center;gap:7px;color:#b8b2bd;background:none;font-size:12px;padding:9px 0;margin:0 0 8px}.back-button:first-letter{font-size:25px}.detail-cover{height:385px;border-radius:17px;position:relative;overflow:hidden;background:linear-gradient(145deg,#e5c17b 0,#8b5c4c 33%,#263148 70%,#11181d);box-shadow:0 18px 35px rgba(0,0,0,.22)}.cover-glow{position:absolute;inset:-50px -10px 20px;background:radial-gradient(circle at 64% 30%,#ffe1a0 0 9%,transparent 24%),radial-gradient(circle at 39% 46%,rgba(102,217,217,.5),transparent 29%),linear-gradient(120deg,transparent,#203447 75%);opacity:.9}.cover-lighthouse{position:absolute;bottom:73px;right:15%;width:40px;height:175px;background:#17232a;border-radius:4px 4px 1px 1px;box-shadow:0 0 0 4px rgba(232,209,159,.2)}.cover-lighthouse:before{content:"";position:absolute;left:-17px;top:-13px;width:74px;height:26px;background:#17232a;border-radius:50% 50% 0 0}.cover-lighthouse i{position:absolute;width:16px;height:20px;left:12px;top:7px;background:#fbd987;box-shadow:0 0 40px 15px rgba(251,217,135,.5)}.cover-lighthouse:after{content:"";position:absolute;bottom:-74px;left:-110px;width:280px;height:100px;background:repeating-linear-gradient(175deg,transparent 0 7px,rgba(184,223,220,.17) 8px 9px);transform:skewX(-15deg)}.cover-title{position:absolute;left:21px;bottom:23px;z-index:2}.cover-title span{display:block;color:#e7cb83;font-size:9px;letter-spacing:.12em;margin-bottom:8px}.cover-title strong{display:block;font:500 42px/.88 var(--serif);letter-spacing:-.065em}.cover-title small{display:block;margin-top:9px;color:#dfd7d0;font-size:11px}.cover-stat{position:absolute;right:14px;bottom:20px;border-radius:999px;background:rgba(0,0,0,.36);padding:8px 10px;font-size:11px}.detail-heading{display:flex;justify-content:space-between;align-items:start;padding:18px 0 4px}.detail-heading h1{font-size:27px;letter-spacing:-.06em}.detail-heading p{font-size:12px;color:var(--muted);margin-top:5px}.save-button{width:36px;height:36px;background:#29272b;border-radius:10px;font-size:18px;color:#e8d9ff}.tags{display:flex;flex-wrap:wrap;gap:5px;color:#94869f;font-size:10px;margin:7px 0 20px}.creator-row{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0}.creator-avatar{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#8e56ff,#f3d46a);font-weight:800}.creator-row strong{display:block;font-size:12px}.creator-row small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.follow-button{margin-left:auto;padding:7px 12px;background:var(--purple);border-radius:999px;font-size:10px}.detail-card{padding:20px 0 8px}.detail-card p{font:16px/1.5 var(--serif);color:#ddd8df;margin-top:12px}.detail-card p.muted{font:12px/1.55 var(--sans);color:#969099}.cast-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.cast-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:10px;background:#242326;border-radius:12px;text-align:left}.cast-card .avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:600 16px var(--serif);background:#304454}.cast-card.nora .avatar{background:#65464b}.cast-card.rafe .avatar{background:#3e5e5d}.cast-card b{font-size:11px}.cast-card small{display:block;color:#8f8991;font-size:9px;margin-top:3px}.detail-spacer{height:86px}.enter-dock{position:fixed;bottom:73px;left:50%;transform:translateX(-50%);width:min(508px,calc(100% - 32px));padding:10px 0 4px;background:linear-gradient(180deg,transparent,var(--bg) 28%);z-index:15}.primary-button{width:100%;height:48px;border-radius:9px;background:var(--purple);font-weight:700;font-size:13px;box-shadow:0 8px 25px rgba(127,69,255,.28)}.primary-button span{float:right;font-size:20px;line-height:14px;margin-right:6px}.enter-dock small{display:block;text-align:center;color:#77717d;font-size:9px;margin-top:7px}.story-head{height:45px;display:flex;align-items:center;justify-content:space-between}.story-head .back-button{margin:0}.story-head-title{text-align:center}.story-head-title span{display:block;font-size:8px;letter-spacing:.12em;color:#8e8792}.story-head-title b{display:block;font-size:11px;margin-top:4px}.story-progress{display:flex;align-items:center;gap:9px;margin:4px 0 12px;color:#aaa1ad;font-size:9px;letter-spacing:.12em}.story-progress div{flex:1;height:2px;background:#312d34}.story-progress div span{display:block;width:14%;height:100%;background:var(--purple);transition:width .4s ease}.story-stage{height:232px;border-radius:16px;overflow:hidden;position:relative;background:#1a292c;margin-bottom:14px}.stage-art{position:absolute;inset:0;background:linear-gradient(160deg,#193943,#101e25 50%,#111619)}.rain{position:absolute;inset:0;opacity:.28;background:repeating-linear-gradient(105deg,transparent 0 17px,rgba(198,230,221,.3) 18px 19px,transparent 20px 33px);animation:rain 1.4s linear infinite}@keyframes rain{to{transform:translate(-22px,55px)}}.window-shape{position:absolute;left:13%;top:14%;width:42%;height:61%;border:7px solid #0f252c;box-shadow:inset 0 0 45px #061015}.window-shape:after{content:"";position:absolute;top:48%;left:0;right:0;height:6px;background:#10232a}.desk-shape{position:absolute;left:-5%;right:-5%;bottom:-4%;height:34%;background:linear-gradient(#323533,#171b1b 18%)}.lantern-shape{position:absolute;left:63%;top:23%;width:34px;height:57px;border:3px solid #987848;border-radius:7px 7px 12px 12px;box-shadow:0 0 42px rgba(237,184,83,.28)}.lantern-shape:before{content:"";position:absolute;left:7px;top:-15px;width:14px;height:15px;border:2px solid #987848;border-bottom:0;border-radius:50% 50% 0 0}.stage-time{position:absolute;right:13px;top:13px;border:1px solid rgba(255,255,255,.17);border-radius:99px;padding:5px 7px;font:9px ui-monospace,monospace;color:#bed0c9}.stage-copy{position:absolute;inset:auto 15px 15px;z-index:2}.stage-copy .eyebrow{color:#e9bb68}.stage-copy h1{font:500 26px/1 var(--serif);letter-spacing:-.05em;margin:7px 0 4px}.stage-copy p{color:#a6aaa9;font-size:10px}.story-scroll{padding-bottom:14px;min-height:250px}.scene-log{display:grid;gap:10px}.log-entry{animation:fadein .35s ease both}.log-entry.scene{color:#e0d9df;font:18px/1.53 var(--serif);padding:5px 2px 8px}.log-entry.dialogue{display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:start}.dialogue-avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#364956;color:#f6e4bb;font:600 13px var(--serif)}.dialogue-avatar.nora{background:#68464d}.dialogue-avatar.rafe{background:#3b5c5b}.dialogue-copy{background:#232326;border-radius:4px 13px 13px 13px;padding:10px 12px}.dialogue-copy strong{display:block;font-size:10px;color:#d6a7ff;margin-bottom:4px;letter-spacing:.05em}.dialogue-copy p{font:14px/1.5 var(--serif);color:#e1dce2}.log-entry.user{justify-self:end;max-width:86%;padding:10px 13px;border-radius:14px 4px 14px 14px;background:#4d2f9c;color:#fff;font-size:13px;line-height:1.5}.typing{display:flex;align-items:center;gap:4px;color:#847d89;font-size:9px;margin:13px 0}.typing i{width:4px;height:4px;border-radius:50%;background:var(--purple-soft);animation:dot 1s infinite}.typing i:nth-child(2){animation-delay:.16s}.typing i:nth-child(3){animation-delay:.32s}.typing span{margin-left:5px}@keyframes dot{50%{opacity:.25;transform:translateY(-2px)}}@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.action-bar{display:flex;gap:8px;position:sticky;bottom:74px;padding:8px 0 7px;background:linear-gradient(180deg,transparent,var(--bg) 25%);z-index:6}.action-bar input{flex:1;min-width:0;height:45px;border:1px solid #3c3743;background:#232125;border-radius:12px;padding:0 13px;font-size:13px}.action-bar input::placeholder{color:#79727d}.action-bar button{width:45px;height:45px;border-radius:12px;background:var(--purple);font-size:22px}.quick-actions{display:flex;gap:7px;overflow:auto;padding:0 0 8px;scrollbar-width:none}.quick-actions::-webkit-scrollbar{display:none}.quick-actions button{white-space:nowrap;border:1px solid #3a3346;background:#221c2c;color:#c4b5d5;border-radius:999px;padding:7px 10px;font-size:10px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:67px;z-index:25;display:flex;justify-content:center;gap:0;background:rgba(29,29,31,.96);border-top:1px solid rgba(255,255,255,.05);backdrop-filter:blur(15px)}.nav-item{width:20%;max-width:108px;background:none;color:#77727e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:20px}.nav-item small{font-size:9px}.nav-item.active{color:#f5f1f7}.nav-item.create span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#5e38bd;color:#fff}.state-drawer{position:fixed;z-index:40;left:50%;bottom:0;width:min(540px,100%);height:min(73svh,590px);transform:translate(-50%,102%);background:#1b1a1e;border-radius:20px 20px 0 0;transition:transform .35s cubic-bezier(.2,.8,.2,1);overflow:auto}.state-drawer.open{transform:translate(-50%,0)}.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;padding:24px 19px 17px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(27,26,30,.9);backdrop-filter:blur(13px)}.drawer-head h2{font-size:22px;letter-spacing:-.06em;margin-top:5px}.close-button{width:30px;height:30px;border-radius:50%;background:#2c2a30;font-size:20px;color:#aaa1af}.drawer-body{padding:17px 19px 40px}.state-meter{display:flex;justify-content:space-between;color:#aaa1af;font-size:11px;margin-bottom:23px}.state-meter b{color:#fff}.state-meter span:last-child{color:#a77bff;font-size:9px;letter-spacing:.1em}.state-block{margin:0 0 23px}.state-block>.eyebrow{display:block;margin-bottom:10px}.relationship{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;background:#26242a;border-radius:10px;margin-bottom:7px}.relationship strong{font-size:12px}.relationship span{font-size:10px;color:#d8b0ff}.state-block ul{padding:0;margin:0;list-style:none;display:grid;gap:8px}.state-block li{font:13px/1.4 var(--serif);color:#d3ccd6}.state-block li:before{content:'◇';color:var(--yellow);margin-right:8px}.request-block{padding-top:17px;border-top:1px solid var(--line)}.request-block code{display:block;color:#d5c9e8;font:10px ui-monospace,monospace;word-break:break-all}.request-block small{display:block;color:#77717f;font-size:9px;margin-top:8px}.scrim{position:fixed;inset:0;z-index:35;background:rgba(0,0,0,.56);opacity:0;pointer-events:none;transition:opacity .3s}.scrim.open{opacity:1;pointer-events:auto}.toast{position:fixed;z-index:55;left:50%;bottom:87px;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#30244a;border:1px solid #6c4ca2;color:#eee4f7;border-radius:999px;padding:9px 13px;font-size:10px;transition:.25s;max-width:calc(100% - 30px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:700px){body{background:#0e0e10}.app{max-width:540px;margin:0 auto;background:var(--bg);box-shadow:0 0 60px rgba(0,0,0,.25)}}

/* Room mode mirrors the focused, character-by-character chat rhythm of Zeta. */
.app.room-mode .topbar,.app.room-mode .bottom-nav{display:none}
.app.room-mode .main{max-width:540px;padding:0}
.app.room-mode{height:var(--visual-viewport-height);min-height:0;padding-bottom:0;overflow:hidden}.app.room-mode .story-view{height:var(--visual-viewport-height);min-height:0;padding:0;display:flex;flex-direction:column;overflow:hidden;background:#111}
.story-head{height:60px;min-height:60px;flex:0 0 auto;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.06);background:#151515;position:relative;top:0;z-index:12}
.story-head .back-button{width:28px;justify-content:flex-start;margin:0;color:#ece8ef;font-size:28px;line-height:1}
.story-head-title{display:flex;flex-direction:column;align-items:center;gap:4px;line-height:1}
.story-head-title b{font-size:14px;font-weight:650;letter-spacing:-.02em}
.story-head-title span{font-size:9px;letter-spacing:.08em;color:#88828c;text-transform:uppercase}
.room-actions{display:flex;align-items:center;gap:10px}
.model-pill{font-size:10px;color:#f2eef6;background:#3a3a3a;border-radius:999px;padding:7px 10px}
.menu-button{width:26px;height:28px;background:none;color:#d4ced7;font-size:20px;line-height:1}
.ai-notice{height:29px;min-height:29px;display:flex;justify-content:center;align-items:center;gap:5px;color:#8d8790;font-size:9px;background:#141414;border-bottom:1px solid rgba(255,255,255,.035)}
.ai-notice span{font-size:12px;color:#aaa3ad}
.app.room-mode .story-progress{display:none}
.app.room-mode .story-stage{display:none}
.app.room-mode .story-scroll{flex:1;min-height:0;height:auto;overflow-y:auto;padding:17px 12px 12px;scroll-behavior:smooth}
.app.room-mode .scene-log{display:flex;flex-direction:column;gap:8px;padding-bottom:6px}
.app.room-mode .log-entry{animation:fadein .28s ease both}
.app.room-mode .log-entry.scene{align-self:center;max-width:92%;font:italic 12px/1.45 var(--sans);color:#aaa2ac;text-align:center;padding:8px 8px 12px}
.app.room-mode .log-entry.user{align-self:flex-end;max-width:84%;margin:4px 0 6px;padding:10px 12px;border-radius:15px 4px 15px 15px;background:#6048d3;color:#fff;font-size:14px;line-height:1.46;box-shadow:none}
.app.room-mode .log-entry.user:before{content:'You';display:block;color:#cfc6ff;font-size:9px;text-align:right;margin-bottom:4px;letter-spacing:.04em}
.app.room-mode .log-entry.dialogue{align-self:stretch;display:grid;grid-template-columns:31px minmax(0,1fr);gap:8px;align-items:start;margin:3px 0}
.app.room-mode .dialogue-avatar{width:31px;height:31px;border:0;margin-top:1px;background:#34495b;color:#f4deb2;box-shadow:none;font-size:12px}
.app.room-mode .dialogue-avatar.nora{background:#67454e}.app.room-mode .dialogue-avatar.rafe{background:#385b59}
.app.room-mode .dialogue-copy{max-width:calc(100% - 4px);padding:0;background:none;border-radius:0}
.app.room-mode .dialogue-copy strong{font-size:11px;font-weight:450;letter-spacing:0;color:#aaa1b0;margin:0 0 4px}
.app.room-mode .dialogue-copy p{display:block;margin:0;padding:10px 12px;background:#242426;border-radius:4px 14px 14px 14px;color:#e6e1e6;font:14px/1.48 var(--sans)}
.app.room-mode .dialogue-copy p em{display:block;color:#b4adb6;font-style:italic;margin-bottom:8px}
.app.room-mode .dialogue-copy p em:last-child{margin-bottom:0}
.app.room-mode .dialogue-copy p.typing-active:after,.app.room-mode .log-entry.scene span.typing-active:after{content:'▌';display:inline-block;margin-left:2px;color:#b68af8;animation:typeCursor .8s steps(1,end) infinite}
.app.room-mode .message-mark{display:block;color:#615c65;text-align:right;font-size:8px;margin-top:3px;line-height:1}
.app.room-mode .typing{align-self:flex-start;display:flex;align-items:center;gap:4px;margin:6px 0 3px 39px;color:#807985;font-size:9px}
.app.room-mode .typing[hidden]{display:none}
.app.room-mode .typing i{width:4px;height:4px}
.suggestions-wrap{background:#111;padding:4px 12px 0;position:relative;z-index:8}
.suggested-label{display:block;border:0;background:none;color:#c1b6cf;font-size:10px;padding:5px 0 7px}
.app.room-mode .quick-actions{display:flex;gap:6px;overflow-x:auto;padding:0 0 7px;min-height:31px;scrollbar-width:none}
.app.room-mode .quick-actions::-webkit-scrollbar{display:none}
.app.room-mode .quick-actions button{flex:0 0 auto;border:1px solid #3a3443;background:#222025;color:#d0c7d7;border-radius:999px;padding:7px 10px;font-size:10px;line-height:1}
.app.room-mode .quick-actions button small{display:none}
.app.room-mode .action-bar{position:relative;bottom:auto;flex:0 0 auto;display:flex;align-items:center;gap:7px;height:59px;padding:8px 12px 10px;background:#171717;border-top:1px solid rgba(255,255,255,.06);z-index:10}
.free-mode{width:34px;height:37px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:none;color:#eee8f0;font-size:16px;line-height:13px}
.free-mode small{font-size:9px;color:#aaa2ab}
.app.room-mode .action-bar input{height:37px;padding:0 12px;border:0;border-radius:20px;background:#2a292b;color:#f3eef6;font-size:16px}
.app.room-mode .action-bar .asterisk-button,.app.room-mode .action-bar .send-button{width:38px;height:38px;flex:0 0 38px;border-radius:10px;font-size:17px}
.app.room-mode .action-bar .asterisk-button{background:#332849;color:#d6baff;border:1px solid #4b3c60}
.app.room-mode .action-bar input::placeholder{color:#938c96}
.app.room-mode .action-bar input{caret-color:#c7a4ff;transition:background .2s ease,box-shadow .2s ease}
.app.room-mode .action-bar input:focus{background:#302b38;box-shadow:0 0 0 1px rgba(160,116,255,.55),0 5px 18px rgba(0,0,0,.18)}
.asterisk-button{width:22px;height:31px;margin-left:-33px;background:none;color:#dfd7e2;font-size:18px;line-height:1;z-index:2}
.send-button{width:37px;height:37px;border-radius:50%;background:#8754ff;color:#fff;font-size:13px;padding-left:3px}
.send-button:disabled,.app.room-mode .quick-actions button:disabled{opacity:.45}
@media(min-width:700px){.app.room-mode{max-width:540px}.app.room-mode .story-view{min-height:100vh}}

/* Zeta-like discovery density for the original Ludio catalog. */
.featured-banner{height:99px;border-radius:15px;margin:6px 0 19px;padding:18px 15px;display:flex;align-items:flex-end;justify-content:space-between;position:relative;overflow:hidden;background:linear-gradient(120deg,#312252 0%,#4e27a5 45%,#1b1926 100%)}
.featured-banner:before{content:'';position:absolute;inset:-65px -35px auto 45%;height:150px;border:1px solid rgba(224,198,255,.32);border-radius:50%;transform:rotate(-18deg);box-shadow:0 0 55px rgba(205,162,255,.34)}
.featured-banner:after{content:'';position:absolute;right:-16px;bottom:-39px;width:165px;height:88px;border:1px solid rgba(255,255,255,.22);transform:rotate(-12deg);box-shadow:0 0 40px rgba(196,157,255,.2)}
.featured-banner>div,.featured-banner>b{position:relative;z-index:2}.featured-banner .eyebrow{display:block;color:#d5bfff;font-size:8px;margin-bottom:5px}.featured-banner strong{display:block;font:600 22px/1 var(--sans);letter-spacing:-.055em}.featured-banner span{display:block;color:#ded1ed;font-size:10px;margin-top:5px}.featured-banner>b{align-self:flex-end;color:#c7b4da;font-size:9px;font-weight:500}

/* Final Room fidelity pass: avatars, snapshots, and the suggested-replies sheet. */
.app.room-mode .story-head{height:48px;min-height:48px}
.app.room-mode .story-head-title{gap:2px}.app.room-mode .story-head-title b{font-size:13px}.app.room-mode .story-head-title span{font-size:8px}
.app.room-mode .log-entry.user{display:flex;align-items:flex-end;gap:7px;padding:0;margin:4px 0 8px;background:none;max-width:91%;color:#fff}
.app.room-mode .log-entry.user:before{display:none}
.app.room-mode .user-copy{order:1;display:block;background:#6048d3;border-radius:15px 4px 15px 15px;padding:10px 12px;font-size:14px;line-height:1.46}
.app.room-mode .user-avatar{order:2;width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:50%;background:#8b8b8b;color:#eceaf1;font-size:11px;font-weight:600}
.app.room-mode .log-entry.scene{align-self:stretch;display:flex;align-items:flex-start;gap:6px;max-width:100%;text-align:left;padding:8px 12px 10px;color:#aaa2ac}
.app.room-mode .narration-icon{color:#887d96;font-size:11px;line-height:1.45}
.app.room-mode .snapshot-button{width:34px;height:37px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:none;color:#eee8f0;font-size:17px;line-height:13px}
.snapshot-button small{font-size:8px;color:#aaa2ab}
.suggestions-panel{position:absolute;left:0;right:0;bottom:58px;z-index:18;padding:11px 12px 9px;background:#242326;border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -16px 32px rgba(0,0,0,.38)}
.suggestions-panel[hidden]{display:none}
.suggestions-panel-head{display:flex;align-items:center;justify-content:space-between;color:#eeeaf0;font-size:13px;margin-bottom:10px}
.suggestions-panel-head button{width:28px;height:28px;border-radius:50%;background:#36343a;color:#d8d3da;font-size:20px;line-height:1}
.suggestion-cards{display:grid;gap:7px}
.suggestion-card{display:grid;grid-template-columns:1fr auto;gap:4px;text-align:left;padding:10px 12px;border-radius:10px;border:1px solid #45404e;background:#2d2b30;color:#f2edf4}
.suggestion-card strong{font-size:12px;font-weight:500;grid-column:1}
.suggestion-card span{font-size:10px;color:#b5adba;grid-column:1}.suggestion-card b{grid-column:2;grid-row:1 / span 2;align-self:center;color:#a77bff;font-size:16px}
.suggestion-footer{display:flex;align-items:center;gap:8px;margin-top:11px;color:#9f97a3;font-size:9px}.suggestion-footer button{width:18px;height:18px;border:1px solid #68606e;border-radius:50%;background:none;color:#c8bfce;font-size:10px}.suggestion-footer b{margin-left:auto;color:#b8a5c8;font-size:9px;font-weight:500}
.plot-card{min-height:255px}.plot-card .plot-art{height:100%;min-height:255px}.plot-card .plot-meta{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:48px 12px 12px;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.87) 54%,rgba(0,0,0,.96) 100%)}.plot-card .plot-meta h3{color:#fff}.plot-card .plot-meta p{color:#e0dbe4}.plot-card .plot-tags{color:#aaa0b1}.plot-trend{display:block;margin-top:6px;color:#ad7cff;font-size:9px}
.plot-card{min-height:340px}.plot-card .plot-art{min-height:340px}.app.room-mode .story-view{position:relative}.plot-card .art-label{display:none}.message-tools{display:flex;gap:6px;align-items:center;padding:2px 0 4px 39px}.message-tools button{width:25px;height:25px;border:1px solid #37343b;border-radius:50%;background:#1b1b1d;color:#8f8994;font-size:11px}.scroll-latest{position:absolute;right:15px;bottom:118px;z-index:9;width:30px;height:30px;border-radius:50%;border:1px solid #4a4350;background:#27242b;color:#e0d8e6;font-size:16px;box-shadow:0 6px 20px rgba(0,0,0,.35)}.scroll-latest[hidden]{display:none}.model-sheet{position:absolute;left:0;right:0;bottom:58px;z-index:20;padding:12px 14px 16px;background:#252326;border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -16px 35px rgba(0,0,0,.45)}.model-sheet[hidden]{display:none}.sheet-grabber{width:38px;height:4px;border-radius:99px;background:#5b5660;margin:0 auto 13px}.model-sheet-head{display:flex;align-items:center;justify-content:space-between;color:#f1edf3;font-size:14px}.model-sheet-head button{width:28px;height:28px;border-radius:50%;background:#39363d;color:#e3dfe7;font-size:19px}.model-sheet>p{color:#9b949f;font-size:10px;margin:7px 0 11px}.model-card{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:12px;margin-top:7px;border-radius:11px;border:1px solid #45404b;background:#2e2b31;color:#ece7f0}.model-card.selected{border-color:#8a59ff;background:#35294a}.model-card span{display:grid;gap:4px}.model-card b{font-size:12px}.model-card small{font-size:10px;color:#ada4b2}.model-card>strong{color:#bd9bff}.model-card em{font-style:normal;color:#a99bb5;font-size:10px}
/* Generated Ludio art direction */
.brand-logo{display:block;width:88px;height:auto;max-height:31px;object-fit:contain;filter:invert(1) brightness(1.55)}
.plot-card .plot-art{isolation:isolate;min-height:340px;height:340px;background:#222}
.plot-card .plot-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.94;z-index:0;transition:transform .35s ease,opacity .2s ease}
.plot-card:hover .plot-image{transform:scale(1.04);opacity:1}
.plot-card .plot-art:after{z-index:1;background:linear-gradient(180deg,rgba(10,10,14,.05) 28%,rgba(10,10,14,.85) 100%)}
.plot-card .plot-badge,.plot-card .art-label{z-index:2}
.plot-card .art-label{display:none}
.plot-card .plot-meta{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:14px 12px 13px;background:linear-gradient(180deg,transparent,rgba(12,12,15,.88) 34%)}
.plot-card .plot-meta h3{font-size:15px}
.detail-cover{background-image:linear-gradient(180deg,rgba(14,18,26,.02) 28%,rgba(11,15,20,.66) 100%),url('/assets/cover-last-lantern.png');background-size:cover;background-position:center}
.detail-cover .cover-glow,.detail-cover .cover-lighthouse{display:none}
.cast-card .avatar{display:block;object-fit:cover;background:#304454}
.cast-card.nora .avatar,.cast-card.rafe .avatar{background:#304454}
.dialogue-avatar{background-size:cover;background-position:center;overflow:hidden;font-size:0}
.dialogue-avatar.mira{background-image:url('/assets/avatar-mira.png')}
.dialogue-avatar.nora{background-image:url('/assets/avatar-nora.png')}
.dialogue-avatar.rafe{background-image:url('/assets/avatar-rafe.png')}
.dialogue-avatar img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}

/* Zeta-inspired portrait story covers: every card keeps the 400:600 (2:3) crop. */
.plot-card{
  min-height:0;
  aspect-ratio:2 / 3;
  isolation:isolate;
  background:#1b1b1f;
}
.plot-card .plot-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  border-radius:inherit;
}
.plot-card .plot-image{
  object-fit:cover;
  object-position:center;
}
.plot-card .plot-art:after{
  background:linear-gradient(180deg,
    rgba(7,8,12,.02) 18%,
    rgba(7,8,12,.10) 40%,
    rgba(7,8,12,.52) 68%,
    rgba(7,8,12,.94) 100%);
}
.plot-card .plot-meta{
  bottom:0;
  padding:76px 12px 13px;
  background:linear-gradient(180deg,transparent 0%,rgba(8,8,11,.15) 30%,rgba(8,8,11,.72) 82%,rgba(8,8,11,.92) 100%);
}
.plot-card .plot-meta h3{font-size:15px;line-height:1.12;margin-bottom:5px;text-shadow:0 1px 8px rgba(0,0,0,.42)}
.plot-card .plot-meta p{font-size:11px;line-height:1.35;text-shadow:0 1px 6px rgba(0,0,0,.42)}
.plot-card .plot-tags{margin-top:6px;font-size:9px;color:rgba(245,238,250,.72)}
.plot-card .plot-trend{margin-top:5px;color:#c4a5ff}

/* Keep the detail cover on the same portrait artboard while capping desktop width. */
.detail-cover{
  width:100%;
  max-width:400px;
  height:auto;
  aspect-ratio:2 / 3;
  margin-inline:auto;
}
.detail-cover .cover-title{bottom:132px}
.detail-cover .cover-stat{bottom:126px}

/* Room controls: a quiet snapshot row sits above the composer, while replies stay behind one button. */
.app.room-mode .story-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:48px;
  padding:6px 12px 5px;
  background:#111;
  border-top:1px solid rgba(255,255,255,.035);
}
.app.room-mode .story-toolbar .snapshot-button{
  width:auto;
  min-width:92px;
  height:35px;
  display:grid;
  grid-template-columns:22px 1fr;
  grid-template-rows:17px 12px;
  column-gap:5px;
  align-items:center;
  justify-items:start;
  padding:2px 8px;
  border:1px solid #39353f;
  border-radius:9px;
  background:#211f24;
  color:#e9e3ed;
}
.app.room-mode .story-toolbar .snapshot-button span{grid-row:1 / span 2;font-size:18px;line-height:1;color:#d2c7dc}
.app.room-mode .story-toolbar .snapshot-button small{font-size:10px;color:#ddd5e2;line-height:1}
.app.room-mode .story-toolbar .snapshot-button em{font-style:normal;font-size:8px;color:#89818f;line-height:1}
.app.room-mode .story-toolbar .suggested-label{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:31px;
  margin-left:auto;
  padding:7px 10px;
  border:1px solid #3a3443;
  border-radius:999px;
  background:#211d2a;
  color:#cdbde0;
  font-size:10px;
}
.app.room-mode .suggestions-wrap{display:none}

/* Ludio uses scene lines for neutral narration so the room never exposes a backstage narrator. */
.app.room-mode .log-entry.scene{align-self:stretch;display:flex;align-items:flex-start;gap:6px;max-width:100%;padding:8px 12px 10px;color:#aaa2ac;font:italic 12px/1.45 var(--sans);text-align:left}
.app.room-mode .log-entry.scene .narration-icon{color:#887d96;font-size:11px;line-height:1.45}
.app.room-mode .log-entry.scene span:last-child{min-width:0}

/* Rich story output stays readable when the model returns several paragraphs. */
.app.room-mode .story-scroll{
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-bottom:28px;
}
.app.room-mode .scene-log{
  width:100%;
  gap:12px;
  padding-bottom:10px;
}
.app.room-mode .log-entry.scene{
  width:100%;
  max-width:100%;
  padding:10px 12px 12px;
  line-height:1.55;
}
.app.room-mode .log-entry.scene span:last-child{
  max-width:calc(100% - 18px);
  overflow-wrap:anywhere;
  white-space:pre-line;
}
.app.room-mode .log-entry.dialogue{
  width:100%;
  max-width:100%;
  margin:4px 0;
}
.app.room-mode .dialogue-copy{
  min-width:0;
  max-width:100%;
}
.app.room-mode .dialogue-copy p{
  max-width:100%;
  padding:12px 14px 13px;
  font-size:14px;
  line-height:1.55;
  letter-spacing:.005em;
  overflow-wrap:anywhere;
  white-space:pre-line;
}
.app.room-mode .dialogue-copy p em{
  margin:0 0 10px;
  line-height:1.52;
}
.app.room-mode .dialogue-copy p em + em{margin-top:2px}
.app.room-mode .log-entry.user{
  max-width:91%;
}
.app.room-mode .user-copy{
  max-width:100%;
  line-height:1.55;
  overflow-wrap:anywhere;
  white-space:pre-line;
}
.app.room-mode .action-bar{
  min-height:59px;
  height:auto;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
}

/* Entry choice and the full-screen Visual Novel presentation. */
.enter-dock .enter-label{display:block;margin:0 0 8px;text-align:center;color:#a9a0b0;font-size:9px;letter-spacing:.16em;font-weight:700}
.entry-mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.entry-mode{position:relative;display:grid;grid-template-columns:24px 1fr 16px;grid-template-rows:19px 15px;align-items:center;text-align:left;height:66px;padding:8px 10px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,#7e4bdf,#5a32b0);box-shadow:none}
.entry-mode.visual-entry{background:linear-gradient(135deg,#34303f,#201e27);border-color:#51465f}
.entry-mode .entry-mode-icon{grid-row:1 / span 2;display:grid;place-items:center;width:22px;height:22px;border:1px solid rgba(255,255,255,.35);border-radius:50%;font-size:13px;color:#f4eefe}
.entry-mode strong{font-size:14px;line-height:1;white-space:nowrap;letter-spacing:-.02em}
.entry-mode small{grid-column:2;color:rgba(255,255,255,.68);font-size:8px;line-height:1;text-align:left;margin:0;white-space:nowrap}
.entry-mode b{grid-column:3;grid-row:1 / span 2;align-self:center;font-size:16px;font-weight:400}
.enter-dock>small:last-child{margin-top:8px}

.app.room-mode .mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px 12px;background:#111;border-bottom:1px solid rgba(255,255,255,.05);z-index:11}
.app.room-mode .mode-tab{height:32px;border-radius:8px;background:transparent;color:#817b86;font-size:13px;letter-spacing:.01em;font-weight:600;transition:background .2s ease,color .2s ease,box-shadow .2s ease}
.app.room-mode .mode-tab span{margin-right:4px;color:#a39aa8}
.app.room-mode .mode-tab.active{background:#30283d;color:#f4eef9;box-shadow:inset 0 0 0 1px rgba(180,141,255,.22)}
.app.room-mode .mode-tab.active span{color:#c4a2ff}

.visual-stage[hidden]{display:none}
.app.room-mode .visual-stage{position:relative;isolation:isolate;flex:1;min-height:0;overflow:hidden;background:#08080b;color:#f7f2fa}
.app.room-mode .visual-backdrop{position:absolute;inset:0;z-index:-2;background-image:linear-gradient(180deg,rgba(8,9,14,.12) 0%,rgba(8,8,12,.18) 32%,rgba(8,7,12,.78) 70%,#08080b 100%),var(--visual-bg,url('/assets/cover-last-lantern.png'));background-size:cover;background-position:center 26%;transform:scale(1.02);transition:filter .45s ease,transform .8s ease}
.app.room-mode .visual-stage.scene-shift .visual-backdrop{animation:visualBackdropShift .75s ease both}
@keyframes visualBackdropShift{0%{filter:brightness(1.28);transform:scale(1.06)}100%{filter:brightness(1);transform:scale(1.02)}}
.app.room-mode .visual-backdrop:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 72% 26%,rgba(255,210,133,.22),transparent 24%),linear-gradient(115deg,rgba(17,37,46,.08),transparent 48%,rgba(102,65,135,.16));mix-blend-mode:screen}
.app.room-mode .visual-topline{position:absolute;left:15px;right:15px;top:14px;display:flex;justify-content:space-between;color:rgba(244,236,249,.66);font:8px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}
.app.room-mode .audio-toggle{margin-left:auto;padding:5px 7px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(9,8,13,.28);color:rgba(244,236,249,.78);font-size:9px;letter-spacing:0;text-transform:none}
.app.room-mode .audio-toggle[aria-pressed="true"]{border-color:rgba(202,160,255,.7);color:#e1c9ff;background:rgba(69,42,99,.46)}
.app.room-mode .visual-content{position:absolute;left:0;right:0;bottom:23px;padding:0 17px 4px;text-shadow:0 2px 18px rgba(0,0,0,.42)}
.app.room-mode .visual-context{max-width:92%;margin-bottom:14px;color:rgba(236,226,241,.74);font:italic 12px/1.45 var(--sans);white-space:pre-line}
.app.room-mode .visual-speaker{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.app.room-mode .visual-avatar{width:43px;height:43px;flex:0 0 43px;border:1px solid rgba(255,255,255,.34);border-radius:50%;background:#46535d center/cover no-repeat;box-shadow:0 6px 20px rgba(0,0,0,.3)}
.app.room-mode .visual-avatar.mira{background-image:url('/assets/avatar-mira.png')}
.app.room-mode .visual-avatar.nora{background-image:url('/assets/avatar-nora.png')}
.app.room-mode .visual-avatar.rafe{background-image:url('/assets/avatar-rafe.png')}
.app.room-mode .visual-avatar.you{background:linear-gradient(135deg,#8467df,#4e3993);position:relative}
.app.room-mode .visual-avatar.you:after{content:'Y';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:700}
.app.room-mode .visual-speaker span{display:block;color:#d0b5ff;font-size:8px;letter-spacing:.14em;margin-bottom:4px}
.app.room-mode .visual-speaker strong{display:block;color:#fff;font-size:15px;font-weight:600}
.app.room-mode .visual-copy{max-width:100%;margin:0;padding-right:28px;color:#fff;font:500 clamp(22px,6.1vw,31px)/1.18 var(--serif);letter-spacing:-.025em;white-space:pre-line;overflow-wrap:anywhere}
.app.room-mode .visual-copy em{font-size:.64em;line-height:1.35;color:#d8cedd;letter-spacing:0}
.app.room-mode .visual-advance{position:absolute;right:17px;bottom:2px;width:31px;height:31px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(16,13,22,.36);color:#f4eafa;font-size:17px;line-height:1}
.app.room-mode .visual-footer-hint{display:none}
.app.room-mode .visual-history[hidden]{display:none}
.app.room-mode .visual-history{background:#111015;border-top:1px solid rgba(255,255,255,.06);z-index:8}
.app.room-mode .visual-history-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;height:32px;padding:0 13px;background:transparent;color:#aaa1b1;font-size:11px;text-align:left}
.app.room-mode .visual-history-toggle b{font-size:15px;font-weight:400;color:#c6a6e9;transition:transform .2s ease}
.app.room-mode .visual-history-toggle.open b{transform:rotate(180deg)}
.app.room-mode .visual-history-panel[hidden]{display:none}
.app.room-mode .visual-history-panel{max-height:170px;overflow:auto;padding:0 12px 9px;border-top:1px solid rgba(255,255,255,.04)}
.app.room-mode .visual-history-item{display:grid;grid-template-columns:48px 1fr;gap:7px;padding:8px 2px;border-bottom:1px solid rgba(255,255,255,.04)}
.app.room-mode .visual-history-item:last-child{border-bottom:0}
.app.room-mode .visual-history-item span{font-size:9px;color:#bb95e8;padding-top:2px}
.app.room-mode .visual-history-item p{margin:0;color:#bdb5c3;font-size:11px;line-height:1.35}
.app.room-mode .visual-choice-dock[hidden]{display:none}
.app.room-mode .visual-choice-dock{padding:9px 12px 8px;background:rgba(16,15,19,.97);border-top:1px solid rgba(255,255,255,.07);z-index:9}
.app.room-mode .visual-choice-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;color:#e4dae9;font-size:14px;font-weight:650;letter-spacing:.01em}
.app.room-mode .visual-choice-head button{padding:6px 9px;border:1px solid #4b3c5b;border-radius:999px;background:#251d2e;color:#d5baf6;font-size:10px}
.app.room-mode .visual-choice-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.app.room-mode .visual-choice{display:grid;grid-template-columns:20px 1fr;grid-template-rows:auto auto;gap:4px 6px;min-width:0;min-height:68px;padding:10px 9px;border:1px solid #3f354a;border-radius:10px;background:#242027;color:#f0e9f5;text-align:left}
.app.room-mode .visual-choice:hover,.app.room-mode .visual-choice:focus-visible{border-color:#9873cd;background:#30263b}
.app.room-mode .visual-choice:disabled{opacity:.5}
.app.room-mode .visual-choice-number{grid-row:1 / span 2;color:#a984da;font:10px ui-monospace,monospace;padding-top:1px}
.app.room-mode .visual-choice span:nth-child(2){min-width:0}
.app.room-mode .visual-choice strong{display:-webkit-box;overflow:hidden;font-size:13px;font-weight:600;line-height:1.22;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.app.room-mode .visual-choice small{display:-webkit-box;overflow:hidden;margin-top:3px;color:#9e95a7;font-size:10px;line-height:1.22;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.app.room-mode .visual-choice>b{display:none}
.app.room-mode .story-view.visual-mode:not(.custom-input-open) .action-bar{display:none}
.app.room-mode .story-view.visual-mode.custom-input-open .visual-choice-dock{padding-bottom:6px}
.app.room-mode .story-view.visual-mode.custom-input-open .visual-choice-list{display:none}
.app.room-mode .story-view.visual-mode .story-scroll,.app.room-mode .story-view.visual-mode .story-progress,.app.room-mode .story-view.visual-mode .story-stage,.app.room-mode .story-view.visual-mode .ai-notice{display:none}
.app.room-mode .story-view.visual-mode .story-toolbar{background:rgba(11,10,14,.86);backdrop-filter:blur(12px);border-top-color:rgba(255,255,255,.08)}
.app.room-mode .story-view.visual-mode .action-bar{background:rgba(12,11,15,.94);backdrop-filter:blur(12px)}

@media(max-width:360px){.entry-mode-grid{grid-template-columns:1fr}.entry-mode{height:56px}.entry-mode .entry-mode-icon{width:20px;height:20px}.app.room-mode .visual-copy{font-size:22px}.app.room-mode .visual-choice-list{grid-template-columns:1fr}.app.room-mode .visual-choice{grid-template-columns:20px 1fr auto}.app.room-mode .visual-choice>b{display:block;grid-column:3;grid-row:1 / span 2;align-self:center;color:#be9aef}.app.room-mode .story-view.visual-mode .visual-history{bottom:338px}}

/* Unified story controls and image-first theatre interaction. */
.detail-view>.detail-cover{margin-top:5px}
.entry-mode{height:72px;grid-template-columns:34px 1fr 18px;grid-template-rows:1fr;padding:10px 13px;border-radius:13px}
.entry-mode .entry-mode-icon{grid-row:1;float:none;width:30px;height:30px;margin:0;border-radius:9px;font-size:16px;line-height:1}
.entry-mode strong{font-size:16px;line-height:1.1;letter-spacing:-.025em}
.entry-mode b{grid-row:1;font-size:18px}
.app.room-mode .mode-switch{display:none}
.app.room-mode .story-toolbar{display:none!important}
.app.room-mode .model-pill{padding:7px 11px;background:#2f2e31;border:1px solid rgba(255,255,255,.08);font-size:10px}
.app.room-mode .free-mode{width:44px;flex:0 0 44px;border:1px solid #423c47;border-radius:11px;background:#252328;color:#cdb8ea;font-size:14px;line-height:11px}
.app.room-mode .free-mode small{font-size:9px;color:#eee8f2;font-weight:650}
.app.room-mode .model-sheet{position:fixed;z-index:45;left:50%;right:auto;bottom:0;width:min(540px,100%);transform:translateX(-50%);padding-bottom:calc(18px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0}

.room-menu[hidden]{display:none}
.room-menu{position:fixed;z-index:42;top:54px;left:50%;width:min(512px,calc(100% - 24px));transform:translateX(-50%);padding:13px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:rgba(30,28,33,.97);box-shadow:0 18px 55px rgba(0,0,0,.52);backdrop-filter:blur(24px)}
.room-menu-head{display:flex;align-items:center;justify-content:space-between;padding:1px 2px 11px}
.room-menu-head button{width:28px;height:28px;border-radius:50%;background:#3a363d;color:#ddd5e0;font-size:18px}
.room-menu-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.menu-mode-tab{display:grid;grid-template-columns:27px 1fr;grid-template-rows:auto auto;gap:2px 7px;align-items:center;padding:12px 11px;border:1px solid #45404a;border-radius:12px;background:#29272c;color:#a9a1ad;text-align:left}
.menu-mode-tab>span{grid-row:1 / span 2;display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:#37323e;color:#b995e4;font-size:14px}
.menu-mode-tab strong{font-size:13px;color:#eee9f0}.menu-mode-tab small{font-size:9px;color:#8f8793}
.menu-mode-tab.active{border-color:#8b64c8;background:#352b42;box-shadow:inset 0 0 0 1px rgba(186,146,237,.15)}
.menu-mode-tab.active>span{background:#573f72;color:#f2e7ff}
.menu-snapshot{display:grid;grid-template-columns:32px 1fr 18px;align-items:center;gap:9px;width:100%;margin-top:9px;padding:11px;border:1px solid #403b44;border-radius:12px;background:#252328;color:#eee9f0;text-align:left}
.menu-snapshot>span:first-child{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#37323d;color:#caa8ef;font-size:17px}
.menu-snapshot>span:nth-child(2){display:grid;gap:3px}.menu-snapshot strong{font-size:12px}.menu-snapshot small{font-size:9px;color:#918995}.menu-snapshot>b{color:#b995e4;font-size:16px;font-weight:400}

.app.room-mode .story-view.visual-mode{position:relative;overflow:hidden}
.app.room-mode .story-view.visual-mode .story-head{background:rgba(13,13,16,.78);backdrop-filter:blur(14px);border-bottom-color:rgba(255,255,255,.08)}
.app.room-mode .story-view.visual-mode .visual-stage{flex:none;width:100%;height:calc(100svh - 48px);min-height:560px}
.app.room-mode .story-view.visual-mode .visual-backdrop{background-image:linear-gradient(180deg,rgba(7,8,12,.12) 0%,rgba(8,8,12,.06) 35%,rgba(8,7,12,.38) 57%,rgba(8,7,12,.9) 100%),var(--visual-bg,url('/assets/cover-last-lantern.png'));background-position:center 30%}
.app.room-mode .story-view.visual-mode .visual-content{bottom:245px;max-height:calc(100svh - 365px);overflow:auto;padding:0 17px 12px;scrollbar-width:none;mask-image:linear-gradient(180deg,transparent 0,#000 8%,#000 100%)}
.app.room-mode .story-view.visual-mode .visual-content::-webkit-scrollbar{display:none}
.app.room-mode .story-view.visual-mode .visual-context{font-size:12px;line-height:1.48;text-shadow:0 2px 14px #000}
.app.room-mode .story-view.visual-mode .visual-copy{font-size:clamp(23px,6.2vw,32px);line-height:1.16;text-shadow:0 2px 18px rgba(0,0,0,.75)}
.app.room-mode .story-view.visual-mode .visual-history{position:absolute;z-index:13;top:auto;left:auto;right:14px;bottom:318px;width:auto;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(17,15,21,.56);backdrop-filter:blur(14px)}
.app.room-mode .story-view.visual-mode .visual-history-toggle{width:auto;height:34px;gap:14px;padding:0 12px;color:#eee7f2;font-size:10px}
.app.room-mode .story-view.visual-mode .visual-history-panel{display:none!important}
.app.room-mode .story-view.visual-mode .visual-choice-dock{position:absolute;z-index:12;left:0;right:0;bottom:0;min-height:205px;padding:40px 14px calc(15px + env(safe-area-inset-bottom));border:0;background:linear-gradient(180deg,transparent 0,rgba(9,8,12,.72) 17%,rgba(9,8,12,.96) 55%,#09080c 100%)}
.app.room-mode .story-view.visual-mode .visual-choice-head{margin-bottom:9px;font-size:15px}
.app.room-mode .story-view.visual-mode .visual-choice-head button{padding:7px 11px;background:rgba(43,35,50,.78);backdrop-filter:blur(12px)}
.app.room-mode .story-view.visual-mode .visual-choice-list{grid-template-columns:1fr;gap:7px}
.app.room-mode .story-view.visual-mode .visual-choice{min-height:45px;grid-template-columns:25px 1fr auto;grid-template-rows:1fr;padding:9px 11px;border-color:rgba(255,255,255,.17);border-radius:4px;background:rgba(42,38,45,.68);backdrop-filter:blur(14px)}
.app.room-mode .story-view.visual-mode .visual-choice-number{grid-row:1;align-self:center;font-size:11px;color:#c3a2ea}
.app.room-mode .story-view.visual-mode .visual-choice span:nth-child(2){align-self:center}.app.room-mode .story-view.visual-mode .visual-choice strong{font-size:13px;-webkit-line-clamp:1}.app.room-mode .story-view.visual-mode .visual-choice small{font-size:9px;-webkit-line-clamp:1}
.app.room-mode .story-view.visual-mode .visual-choice>b{display:block;grid-column:3;grid-row:1;align-self:center;color:#c3a2ea;font-size:13px}
.app.room-mode .story-view.visual-mode.custom-input-open .visual-choice-dock{bottom:59px;min-height:68px;padding:12px 14px 8px}
.app.room-mode .visual-stage.is-thinking .visual-copy{color:#d8c8e6;animation:theatreThinking 1.35s ease-in-out infinite}
.app.room-mode .visual-stage.is-thinking .visual-avatar{background-image:none!important;background:linear-gradient(135deg,#8159c7,#38275d);position:relative}
.app.room-mode .visual-stage.is-thinking .visual-avatar:after{content:'✦';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:18px}
.app.room-mode .visual-copy.typing-active:after{content:'▌';display:inline-block;margin-left:3px;color:#c59cff;animation:typeCursor .8s steps(1,end) infinite}
@keyframes typeCursor{50%{opacity:0}}
@keyframes theatreThinking{0%,100%{opacity:.62}50%{opacity:1}}

.summary-sheet[hidden]{display:none}
.summary-sheet{position:fixed;inset:0;z-index:60;display:grid;place-items:center;color:#fff}
.summary-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}
.summary-card{position:relative;width:min(540px,100%);height:100svh;overflow:auto;padding:72px 25px calc(28px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(7,7,9,.74),rgba(7,7,9,.94)),url('/assets/visual/scene-lighthouse.png') center/cover no-repeat;box-shadow:0 0 55px rgba(0,0,0,.7)}
.summary-close{position:fixed;z-index:2;top:20px;right:max(20px,calc((100vw - 500px)/2));width:36px;height:36px;border-radius:50%;background:rgba(23,21,26,.7);color:#fff;font-size:25px}
.summary-ornament{text-align:center;color:#c7a5ec;font-size:12px;letter-spacing:.18em}.summary-card h2{text-align:center;margin:10px 0 34px;font-size:26px;letter-spacing:-.03em}
.summary-copy{font:18px/1.65 var(--serif);color:#f2edf3;text-shadow:0 2px 14px #000}
.summary-beats{display:grid;gap:13px;margin:24px 0 82px}
.summary-beats article{padding:16px 17px;border:1px solid rgba(255,255,255,.13);border-radius:20px;background:rgba(40,38,42,.72);backdrop-filter:blur(18px)}
.summary-beats span{display:block;margin-bottom:7px;color:#caa9ed;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.summary-beats p{font:16px/1.55 var(--serif);color:#f4eef5}.summary-beats em{color:#c7bdca}
.summary-continue{position:fixed;z-index:2;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));width:min(480px,calc(100% - 32px));height:57px;transform:translateX(-50%);border-radius:18px;background:#744bca;color:#fff;font-size:16px;font-weight:700;box-shadow:0 12px 35px rgba(0,0,0,.4)}
body.overlay-open{overflow:hidden}

/* Mobile keyboards resize the visual viewport. Keep the composer attached to it and let only the transcript scroll. */
html.keyboard-open body{overflow:hidden}
.app.room-mode .story-view.visual-mode.custom-input-open .action-bar{position:absolute;left:0;right:0;bottom:0}
.app.room-mode .story-view.visual-mode.custom-input-open .visual-choice-dock{bottom:59px}

@media(max-width:360px){.entry-mode{height:61px}.entry-mode strong{font-size:14px}.app.room-mode .story-view.visual-mode .visual-content{bottom:270px;max-height:calc(100svh - 390px)}.app.room-mode .story-view.visual-mode .visual-history{bottom:239px}.app.room-mode .story-view.visual-mode .visual-choice-dock{min-height:230px}}

/* Current interaction pass: language popover, two-row mode menu, and theatre recap. */
.language-button{height:34px;min-width:58px;padding:0 10px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.06);color:#eee8f2;font-size:11px;font-weight:700;letter-spacing:.05em}
.language-button span{margin-left:3px;color:#b9a6d0;font-size:12px}
.language-menu{position:fixed;z-index:45;top:56px;right:max(16px,calc((100vw - 540px)/2 + 16px));width:148px;padding:6px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(32,30,36,.98);box-shadow:0 16px 40px rgba(0,0,0,.42);backdrop-filter:blur(20px)}
.language-menu[hidden]{display:none}
.language-menu button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 11px;border-radius:9px;background:transparent;color:#b8b1bd;text-align:left;font-size:12px}
.language-menu button small{font-size:9px;color:#817783;letter-spacing:.1em}
.language-menu button.active{background:#382c49;color:#fff}.language-menu button.active small{color:#c6a2f6}
.detail-cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.detail-cover .cover-title,.detail-cover .cover-stat{z-index:2}
.detail-cover:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,9,14,.02) 24%,rgba(8,8,11,.12) 44%,rgba(8,8,11,.86) 100%);pointer-events:none}
.detail-cover .cover-title{left:21px;right:18px}.detail-cover .cover-title strong{font-size:clamp(31px,8vw,42px)}
.plot-art.campus{background:linear-gradient(145deg,#4b5f7a,#1d293d 55%,#121820)}
.app.room-mode .room-menu-mode{grid-template-columns:1fr;gap:7px}
.app.room-mode .room-menu{top:54px}
.app.room-mode .model-pill{font-size:11px;letter-spacing:.02em;text-transform:none}
.app.room-mode .story-view.visual-mode .visual-history{top:72px;right:14px;left:auto;bottom:auto;width:auto;position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(17,15,21,.58);backdrop-filter:blur(14px)}
.app.room-mode .story-view.visual-mode .visual-history-toggle{height:32px;padding:0 11px;gap:10px;font-size:10px}
.app.room-mode .story-view.visual-mode .visual-history-toggle b{display:none}

/* Composer polish: the narration marker belongs to the input, like a small mode toggle above it. */
.app.room-mode .action-bar{padding-top:30px}
.app.room-mode .action-bar .input-wrap{position:relative;flex:1;min-width:0;display:flex;align-items:center}
.app.room-mode .action-bar .input-wrap input{width:100%;min-width:0}
.app.room-mode .action-bar .asterisk-button{position:absolute;left:9px;top:-25px;width:24px;height:22px;display:grid;place-items:center;margin:0;border:0;background:transparent;color:#d6baff;font-size:18px;line-height:1;z-index:3}
.app.room-mode .action-bar .asterisk-button:focus-visible{outline-offset:1px}
.app.room-mode .action-bar .asterisk-button:hover{color:#fff}

/* Use the mark and a spaced, title-case wordmark in the official header lockup. */
.brand{gap:14px;letter-spacing:0}
.brand-logo{display:block;width:30px;height:30px;max-height:none;object-fit:contain;filter:none}
.brand-wordmark{display:block;color:#f4eef7;font:700 22px/1 var(--sans);letter-spacing:-.055em}

/* Every catalogue card has a branded loading state while its portrait art is lazy-loaded. */
.plot-image-placeholder{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:radial-gradient(circle at 50% 42%,rgba(139,89,226,.3),transparent 35%),linear-gradient(145deg,#292234,#111217);color:rgba(244,237,250,.78);font-size:16px;letter-spacing:-.04em}
.plot-image-placeholder img{width:46px;height:46px;object-fit:contain;opacity:.9;filter:drop-shadow(0 7px 16px rgba(127,83,220,.35))}
.plot-image-placeholder b{font-weight:650}
.plot-card .plot-image{opacity:0;transition:transform .35s ease,opacity .2s ease}
.plot-card .plot-image.is-loaded{opacity:.94}
.plot-card .plot-image.is-failed{display:none}
.plot-card .plot-image.is-loaded ~ .plot-badge,.plot-card .plot-image.is-loaded ~ .art-label{z-index:2}
.app.room-mode .story-view.visual-mode .visual-history-panel{display:none!important}
.app.room-mode .story-view.visual-mode .visual-advance{display:none!important}
.app.room-mode .story-view.visual-mode .visual-choice-number{font-size:13px;font-weight:700;letter-spacing:.04em}
.app.room-mode .story-view.visual-mode .visual-choice>b{display:none!important}
.app.room-mode .story-view.visual-mode .visual-content{bottom:245px}
.app.room-mode .visual-avatar.mina{background-image:url('/assets/avatar-mira.png')}
.app.room-mode .visual-avatar.theo{background-image:url('/assets/avatar-rafe.png')}
.app.room-mode .visual-avatar.yuna{background-image:url('/assets/avatar-nora.png')}
.app.room-mode .visual-avatar.mingxuan{background-image:url('/assets/avatar-mira.png')}
.app.room-mode .visual-avatar.mingxu{background-image:url('/assets/avatar-nora.png')}
.app.room-mode .visual-avatar.harlan-ci{background-image:url('/assets/avatar-rafe.png')}
.app.room-mode .visual-avatar.gu-xingzhou{background-image:url('/assets/avatar-nora.png')}
.app.room-mode .visual-avatar.qinghe{background-image:url('/assets/avatar-mira.png')}
.dialogue-avatar.mingxuan{background-image:url('/assets/avatar-mira.png')}
.dialogue-avatar.mingxu{background-image:url('/assets/avatar-nora.png')}
.dialogue-avatar.harlan-ci{background-image:url('/assets/avatar-rafe.png')}
.dialogue-avatar.gu-xingzhou{background-image:url('/assets/avatar-nora.png')}
.dialogue-avatar.qinghe{background-image:url('/assets/avatar-mira.png')}
.plot-art.phoenix{background:linear-gradient(145deg,#6f1f2f,#281725 55%,#101016)}