:root{--page-bg: #0f0d0b;--surface: #1a1512;--surface-selected: #2d241b;--paper: #211b16;--paper-deep: #17120f;--ink: #f3ead8;--muted: #c8b8a0;--accent: #ff6a55;--teal: #35c5c8;--gold: #f6c84b;--rose: #7f3c43;--shadow: #050403;--shadow-soft: rgba(5, 4, 3, .62);--button-ink: #17110e;--focus-ring: rgba(53, 197, 200, .28);--teal-wash: rgba(53, 197, 200, .16);--accent-wash: rgba(255, 106, 85, .14);--gold-wash: rgba(246, 200, 75, .16);color:var(--ink);background:var(--page-bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;line-height:1.45;text-rendering:optimizeLegibility}*{box-sizing:border-box;scrollbar-color:var(--accent) rgba(15,13,11,.84);scrollbar-width:thin}*::-webkit-scrollbar{width:12px;height:12px}*::-webkit-scrollbar-track{border:2px solid rgba(243,234,216,.08);background:linear-gradient(135deg,rgba(246,200,75,.08) 0 16%,transparent 16% 100%),#0f0d0b}*::-webkit-scrollbar-thumb{border:3px solid #0f0d0b;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--gold) 48%,var(--teal));box-shadow:inset 0 0 0 1px #f3ead859}*::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#ff826f,var(--gold) 46%,#58d7da)}*::-webkit-scrollbar-corner{background:#0f0d0b}body{position:relative;margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:linear-gradient(115deg,transparent 0 58%,rgba(53,197,200,.08) 58% 59%,transparent 59% 100%),linear-gradient(66deg,transparent 0 22%,rgba(255,106,85,.08) 22% 23%,transparent 23% 100%),repeating-linear-gradient(0deg,rgba(243,234,216,.024) 0 1px,transparent 1px 5px),linear-gradient(135deg,#0f0d0b,#18110f 46%,#091414);background-attachment:fixed;background-size:720px 560px,620px 520px,auto,auto}body:before,body:after{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;content:""}body:before{opacity:.42;background:radial-gradient(circle at center,rgba(246,200,75,.18) 0 1.2px,transparent 1.4px),radial-gradient(circle at center,rgba(53,197,200,.11) 0 1px,transparent 1.3px);background-position:0 0,9px 9px;background-size:18px 18px,18px 18px;-webkit-mask-image:linear-gradient(135deg,transparent 0%,#000 14%,#000 72%,transparent 100%);mask-image:linear-gradient(135deg,transparent 0%,#000 14%,#000 72%,transparent 100%)}body:after{opacity:.7;background:linear-gradient(128deg,transparent 0 18%,rgba(243,234,216,.08) 18% 18.4%,transparent 18.4% 100%),linear-gradient(52deg,transparent 0 71%,rgba(243,234,216,.07) 71% 71.4%,transparent 71.4% 100%),linear-gradient(90deg,rgba(5,4,3,.62),transparent 18% 82%,rgba(5,4,3,.72));background-size:560px 430px,690px 520px,auto}button,input,textarea,select{font:inherit}button{border:0}.shell{position:relative;z-index:1;width:min(1520px,100%);margin:0 auto;padding:10px clamp(14px,2.4vw,28px) 36px}.shell--detail{width:min(1760px,100%);padding-top:8px}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:20px 0 24px}.app-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:8px 0 10px;border-bottom:2px solid rgba(243,234,216,.18);background:linear-gradient(90deg,rgba(15,13,11,.94),rgba(15,13,11,.74) 70%,transparent),linear-gradient(180deg,transparent,rgba(5,4,3,.18));-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.app-header--overview{grid-template-columns:minmax(0,1fr) auto}.app-title{display:flex;align-items:center;gap:12px;min-width:0}.brand-logo{width:clamp(46px,6vw,68px);height:clamp(46px,6vw,68px);flex:0 0 auto;border:2px solid rgba(243,234,216,.28);border-radius:14px;background:#0f0d0b;box-shadow:4px 4px 0 var(--shadow);object-fit:cover}.app-title__copy{min-width:0}.app-header h1{max-width:860px;margin:0;font-size:clamp(1.55rem,3.6vw,3.2rem);line-height:.95;overflow-wrap:anywhere;text-wrap:balance}.shell--detail .app-header{padding-bottom:8px}.shell--detail .app-header h1{max-width:none;font-size:clamp(1.35rem,2.5vw,2.35rem)}.topbar h1,.story-strip h2,.script-panel h2{margin:0;letter-spacing:0}.topbar h1{max-width:760px;font-size:clamp(2rem,6vw,5rem);line-height:.95}.eyebrow{margin:0 0 5px;color:var(--accent);font-size:.72rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.topbar__actions{display:flex;gap:10px}.app-header__actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.back-button,.latest-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border:2px solid var(--ink);border-radius:6px;background:var(--surface);color:var(--ink);box-shadow:3px 3px 0 var(--shadow);cursor:pointer;font-weight:900;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}.latest-button{background:var(--gold);color:var(--button-ink);white-space:nowrap}.back-button:not(:disabled):hover,.latest-button:not(:disabled):hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--shadow)}.current-work{display:grid;grid-template-columns:60px minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:14px;border:2px solid var(--ink);background:linear-gradient(135deg,rgba(243,234,216,.06) 0 12%,transparent 12% 100%),linear-gradient(90deg,var(--accent-wash),transparent 42%),var(--surface);box-shadow:4px 4px 0 var(--shadow);padding:10px 12px}.current-work__cover{display:grid;aspect-ratio:2 / 3;width:60px;place-items:center;overflow:hidden;border:2px solid var(--ink);background:var(--paper);color:var(--accent);box-shadow:3px 3px 0 var(--shadow)}.current-work__cover img{width:100%;height:100%;object-fit:cover}.current-work h2,.section-heading h2,.comic-card h3{margin:0;letter-spacing:0}.current-work h2{font-size:clamp(1.05rem,2vw,1.45rem);line-height:1;overflow-wrap:anywhere}.current-work__main{min-width:0}.current-work p:not(.eyebrow),.comic-card p:not(.eyebrow){max-width:860px;margin:8px 0 0;color:var(--muted)}.current-work__actions{display:grid;gap:10px;align-content:center;justify-items:end}.progress-summary{border:2px solid var(--ink);border-radius:999px;background:var(--paper-deep);padding:5px 10px;font-size:.78rem;font-weight:900;white-space:nowrap}.generation-status{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border:2px solid var(--ink);border-radius:6px;background:var(--gold);box-shadow:4px 4px 0 var(--shadow);color:var(--button-ink);padding:0 14px;font-size:.88rem;font-weight:900;white-space:nowrap}.generation-status--active{background:var(--teal)}.workspace{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:24px;align-items:start}.control-panel,.story-strip,.script-panel,.next-beat{border:2px solid var(--ink);background:var(--surface);box-shadow:5px 5px 0 var(--shadow)}.control-panel{position:sticky;top:24px;display:grid;gap:16px;padding:18px}.field{display:grid;gap:8px}.field span{display:flex;align-items:center;gap:6px;font-size:.86rem;font-weight:800}.field input,.field textarea,.field select{width:100%;border:2px solid var(--ink);border-radius:6px;background:var(--paper);color:var(--ink);padding:11px 12px;outline:none}.field textarea{resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--focus-ring)}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.primary-button,.danger-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border-radius:6px;border:2px solid var(--ink);color:var(--ink);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}.primary-button{width:100%;background:var(--gold);box-shadow:4px 4px 0 var(--shadow);color:var(--button-ink);font-weight:900}.primary-button.compact{width:auto;padding:0 14px;white-space:nowrap}.danger-button{justify-self:start;padding:0 16px;background:var(--rose);box-shadow:4px 4px 0 var(--shadow);color:var(--ink);font-weight:800}.icon-button{width:46px;background:var(--surface);box-shadow:3px 3px 0 var(--shadow)}.primary-button:not(:disabled):hover,.danger-button:not(:disabled):hover,.icon-button:not(:disabled):hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--shadow)}button:disabled{cursor:not-allowed;opacity:.55}.stage{display:grid;gap:20px}.overview,.detail-view{display:grid;gap:14px}.overview{gap:14px}.detail-view{justify-items:center;gap:10px;padding-top:2px}.section-heading{padding-top:0;border-left:6px solid var(--accent);padding-left:12px}.section-heading h2{font-size:clamp(1.2rem,2.4vw,2rem);line-height:1}.comic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}.comic-card{position:relative;display:grid;grid-template-rows:auto 1fr;gap:10px;border:2px solid var(--ink);background:linear-gradient(135deg,transparent 0 74%,rgba(246,200,75,.13) 74% 75.2%,transparent 75.2% 100%),linear-gradient(180deg,rgba(53,197,200,.08),transparent 28%),var(--paper);box-shadow:5px 5px 0 var(--shadow);color:inherit;padding:10px;text-align:left;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}.comic-card:hover{transform:translate(-1px,-1px);box-shadow:8px 8px 0 var(--shadow)}.comic-card:after{content:"";position:absolute;inset:8px 8px auto auto;width:28px;height:28px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);background:linear-gradient(45deg,transparent 48%,rgba(243,234,216,.28) 50%);pointer-events:none}.comic-card img,.comic-card .thumb-empty{width:100%;aspect-ratio:2 / 3;border:2px solid var(--ink);background:var(--paper-deep);object-fit:cover}.comic-card h3{font-size:1.08rem;line-height:1.05}.story-strip{display:grid;gap:18px;padding:20px;background:linear-gradient(90deg,var(--teal-wash),transparent),var(--surface)}.story-strip.muted{background:linear-gradient(135deg,var(--accent-wash) 25%,transparent 25% 50%,var(--accent-wash) 50% 75%,transparent 75%),var(--surface);background-size:28px 28px}.story-strip h2{font-size:clamp(1.5rem,3vw,2.8rem);line-height:1}.story-strip p:not(.eyebrow){max-width:760px;margin:10px 0 0;color:var(--muted)}.meter{height:9px;overflow:hidden;border:2px solid var(--ink);border-radius:999px;background:var(--paper-deep)}.meter span{display:block;height:100%;border-right:2px solid var(--ink);background:var(--teal);transition:width .22s ease}.generation-row{display:flex;align-items:stretch;justify-content:space-between;gap:18px}.next-beat{flex:1;display:grid;gap:4px;padding:14px 16px}.next-beat span{color:var(--accent);font-size:.76rem;font-weight:900;text-transform:uppercase}.next-beat strong{font-size:1rem}.reader{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(280px,.6fr);gap:20px;align-items:start}.image-reader{display:grid;justify-items:center;align-items:start;min-width:0;width:100%;padding:8px 0 2px;background:linear-gradient(90deg,transparent 0 13%,rgba(246,200,75,.07) 13% 13.4%,transparent 13.4% 86%,rgba(255,106,85,.07) 86% 86.4%,transparent 86.4%),linear-gradient(180deg,rgba(5,4,3,.28),transparent 24%,transparent 76%,rgba(5,4,3,.2))}.image-reader--slider{grid-template-columns:54px minmax(0,1120px) 54px;gap:14px;justify-content:center}.image-reader img,.image-reader .image-empty{width:min(100%,1120px);aspect-ratio:2 / 3;border:3px solid var(--ink);background:#0c0a08;box-shadow:8px 8px 0 var(--shadow),0 20px 60px var(--shadow-soft);object-fit:contain}.reader-nav{display:inline-flex;align-items:center;justify-content:center;width:54px;height:74px;border:2px solid var(--ink);border-radius:6px;background:linear-gradient(180deg,rgba(243,234,216,.06),transparent),var(--surface);color:var(--ink);box-shadow:4px 4px 0 var(--shadow);cursor:pointer;position:sticky;top:42vh;margin-top:min(36vh,440px);transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}.reader-nav:not(:disabled):hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--shadow)}.page-art,.empty-reader,.comic-preview,.page-card,.image-empty,.thumb-empty{border:2px solid var(--ink);background:var(--paper)}.page-art{aspect-ratio:2 / 3;min-height:560px;box-shadow:5px 5px 0 var(--shadow)}.page-art img{display:block;width:100%;height:100%;object-fit:contain;background:var(--paper)}.image-empty{display:grid;aspect-ratio:2 / 3;min-height:560px;place-items:center;color:var(--accent)}.script-panel{padding:18px}.script-panel p:not(.eyebrow){color:var(--muted)}.script-panel ol{display:grid;gap:14px;margin:18px 0 0;padding-left:22px}.script-panel li{padding-left:4px}.script-panel li strong,.script-panel li span,.script-panel li em{display:block}.script-panel li span{color:var(--muted)}.script-panel li em{margin-top:4px;color:var(--teal);font-style:normal;font-weight:700}.empty-reader{display:grid;min-height:520px;place-items:center;box-shadow:5px 5px 0 var(--shadow);background:linear-gradient(135deg,var(--gold-wash) 0 18%,transparent 18% 50%,var(--teal-wash) 50% 68%,transparent 68%),var(--surface)}.comic-preview{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:min(520px,82%);aspect-ratio:3 / 4;padding:12px;box-shadow:5px 5px 0 var(--shadow);transform:rotate(-2deg)}.comic-preview span{min-height:0;border:2px solid var(--ink);background:linear-gradient(90deg,transparent 0 20%,var(--gold) 20% 34%,transparent 34% 100%),linear-gradient(160deg,var(--paper) 0 42%,var(--rose) 43% 100%)}.comic-preview span:first-child{grid-column:span 2;background:linear-gradient(90deg,transparent 0 22%,var(--teal) 22% 36%,transparent 36% 100%),linear-gradient(160deg,var(--paper) 0 50%,var(--gold) 51% 100%)}.page-grid{display:flex;gap:12px;width:min(100%,1230px);overflow-x:auto;scrollbar-color:var(--gold) rgba(15,13,11,.84);border-top:1px solid rgba(243,234,216,.16);padding:12px 8px 10px 4px}.page-grid::-webkit-scrollbar{height:14px}.page-grid::-webkit-scrollbar-track{border-color:#f6c84b29;background:linear-gradient(90deg,transparent 0 18%,rgba(53,197,200,.16) 18% 18.8%,transparent 18.8% 100%),var(--paper-deep)}.page-grid::-webkit-scrollbar-thumb{border-color:var(--paper-deep)}.page-card{display:grid;flex:0 0 112px;gap:10px;padding:8px;background:var(--paper-deep);box-shadow:3px 3px 0 var(--shadow);color:inherit;text-align:left;cursor:pointer}.page-card[aria-current=true]{background:var(--surface-selected);outline:3px solid var(--teal)}.page-card img,.thumb-empty{width:100%;aspect-ratio:2 / 3;object-fit:cover}.thumb-empty{display:grid;place-items:center;color:var(--accent)}.page-card strong{font-size:.82rem;line-height:1.25}.error{margin:0;border:2px solid var(--accent);border-radius:6px;background:var(--paper);color:var(--accent);padding:10px 12px;font-weight:800}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:980px){.workspace,.reader{grid-template-columns:1fr}.control-panel{position:static}.topbar{align-items:flex-start}.app-header,.current-work{grid-template-columns:1fr}.app-header{align-items:stretch}.current-work__actions{justify-items:stretch}.current-work__cover{width:min(76px,28vw)}.page-grid{width:100%}}@media(max-width:640px){.shell{padding:10px 12px 24px}.app-header{gap:10px;padding-top:4px}.app-header h1{font-size:clamp(1.35rem,9vw,2rem)}.brand-logo{width:48px;height:48px;border-radius:12px}.topbar,.generation-row{flex-direction:column}.topbar__actions,.primary-button.compact,.generation-status,.danger-button,.back-button,.latest-button,.app-header__actions{width:100%}.app-header__actions{flex-direction:column;align-items:stretch}.grid-two{grid-template-columns:1fr}.icon-button{flex:1}.page-art,.image-empty{min-height:300px}.image-reader img,.image-reader .image-empty{max-height:none}.image-reader--slider{grid-template-columns:minmax(0,1fr);gap:10px}.reader-nav{position:static;width:100%;height:44px;margin-top:0}.reader-nav--previous{order:2}.reader-nav--next{order:3}.page-card{flex-basis:94px}}
