:root{--bg:#020713;--bg-deep:#030914;--panel:#071a35;--panel-2:#0b2448;--panel-soft:#0a2041e0;--ink:#fff;--muted:#bdc8dc;--muted-2:#8493ad;--ruby:#ff174f;--ruby-2:#ff315f;--ruby-deep:#d9093d;--pink:#ff5b8c;--gold:#ffd27c;--line:#97b0da38;--line-strong:#dce7ff61;--glow:0 0 18px #ff174f6b, 0 0 42px #ff174f2e;--shadow:0 22px 70px #0000006b}*{box-sizing:border-box}html{background:var(--bg);min-height:100%}body{min-height:100%;color:var(--ink);background:radial-gradient(circle at 22% 0%, #0c468747, transparent 34rem), radial-gradient(circle at 82% 18%, #910b4633, transparent 28rem), var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{-webkit-tap-highlight-color:transparent}.story-studio{background:radial-gradient(circle at 50% -12%,#1a4f9733,#0000 33rem),linear-gradient(#061027 0%,#020713 72%);min-height:100svh;padding:0}.story-studio-shell{background:radial-gradient(circle at 96% 10%,#9a10541f,#0000 22rem),linear-gradient(#071127fa,#020713fc);width:min(100%,520px);min-height:100svh;margin:0 auto;overflow:hidden}.story-screen{--stage-progress:0%;isolation:isolate;min-height:100svh;padding:max(26px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 15%,#113a7133,#0000 25rem),linear-gradient(#06112a 0%,#020713 75%);flex-direction:column;gap:18px;display:flex;position:relative;overflow:hidden}.story-screen:not(.home-screen):before{content:"";z-index:3;top:max(23px, env(safe-area-inset-top));background:linear-gradient(90deg, var(--ruby) 0 var(--stage-progress), #5777a99e var(--stage-progress) 100%);border-radius:999px;width:min(42vw,170px);height:4px;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 0 16px #ff174f47}.story-screen:not(.home-screen):after{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle at 88% 36%,#860b4824,#0000 14rem),radial-gradient(circle at 10% 84%,#08418021,#0000 17rem);position:absolute;inset:0}.title-screen{--stage-progress:28%}.characters-screen{--stage-progress:48%}.world-screen{--stage-progress:66%}.generation-screen{--stage-progress:82%}.chapter-screen,.approval-screen,.chapter-edit-screen{--stage-progress:100%}.eyebrow{color:var(--gold);letter-spacing:.15em;text-align:center;text-transform:uppercase;margin:28px 0 0;font-size:.72rem;font-weight:800}h1,h2,p{margin-top:0}h1,h2{color:var(--ink);text-wrap:balance;margin-bottom:0}h1{letter-spacing:-.045em;font-size:clamp(2.25rem,11vw,3.8rem);font-weight:820;line-height:.98}h2{letter-spacing:-.035em;text-align:center;font-size:clamp(1.7rem,7.7vw,2.45rem);font-weight:820;line-height:1.08}.story-screen>p:not(.eyebrow):not(.notice):not(.demo-note):not(.chapter-summary){color:var(--muted);line-height:1.55}.primary-button,.secondary-button,.adjustment-actions button,.text-button{cursor:pointer;border:0}.primary-button{color:#fff;width:100%;min-height:56px;box-shadow:var(--glow), inset 0 1px 0 #ffffff47, inset 0 -12px 22px #94002629;letter-spacing:-.01em;background:linear-gradient(#ff4166fa,#ee083efa);border:1px solid #ff7d9bad;border-radius:18px;margin-top:auto;padding:15px 22px;font-weight:850;transition:transform .16s,filter .16s,opacity .16s}.primary-button:after{content:"›";float:right;font-size:1.55rem;line-height:.72}.primary-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.primary-button:active{transform:translateY(1px)scale(.995)}.primary-button:disabled{cursor:not-allowed;filter:grayscale(.25);opacity:.48;box-shadow:none}.secondary-button{color:#0000;background:#071b39db;border:1px solid #99b3de2e;border-radius:14px;align-self:flex-start;min-width:42px;min-height:42px;padding:10px 13px;font-size:0;box-shadow:0 9px 30px #0000002e}.secondary-button:before{content:"←";color:#fff;font-size:1.35rem;line-height:1}.screen-actions{margin-top:auto;display:flex}label{color:#f9fbff;gap:8px;font-size:.82rem;font-weight:720;display:grid}input,textarea,select{color:#fff;resize:vertical;background:linear-gradient(#0b2a52f5,#071f3ff5);border:1px solid #5f92cd57;border-radius:13px;outline:none;width:100%;padding:13px 14px;font-size:.96rem;font-weight:520;line-height:1.5;transition:border-color .16s,box-shadow .16s,background .16s;box-shadow:inset 0 1px #ffffff09,0 8px 24px #0000001f}input::placeholder,textarea::placeholder{color:#7e91b1}input:focus,textarea:focus,select:focus{border-color:var(--ruby-2);background:#0b2b54fa;box-shadow:0 0 0 2px #ff174f24,0 0 24px #ff174f1f}textarea{min-height:112px}select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,#dce8ff 50%),linear-gradient(135deg,#dce8ff 50%,#0000 50%),linear-gradient(#0b2a52f5,#071f3ff5);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px,0 0;background-repeat:no-repeat;background-size:6px 6px,6px 6px,100% 100%;min-height:50px;padding-right:40px}input[type=file]{cursor:pointer;color:var(--muted);font-size:.8rem}input[type=file]::file-selector-button{color:#fff;background:#ff174f29;border:0;border-radius:9px;margin-right:10px;padding:9px 11px;font-weight:750}.home-screen{text-align:center;background:linear-gradient(#0106110a 0%,#02071338 48%,#020713 82%),radial-gradient(circle at 68% 23%,#ff406959,#0000 12rem),radial-gradient(circle at 22% 22%,#1a80c561,#0000 14rem),radial-gradient(at 50% 42%,#b1124b38,#0000 18rem),linear-gradient(145deg,#061731 0%,#12081a 56%,#08030d 100%);justify-content:flex-end;gap:12px;padding-top:42px}.home-screen:before{content:"";z-index:-1;pointer-events:none;opacity:.88;background:radial-gradient(at 48% 42%,#0000 0 17%,#00000029 17.5% 18.5%,#0000 19%),linear-gradient(158deg,#0000 0 58%,#c5123e1f 59%,#0000 67%),radial-gradient(circle at 13% 78%,#ae0c403d,#0000 9rem),radial-gradient(circle at 94% 76%,#cc0d3633,#0000 10rem);position:absolute;inset:0}.home-screen:after{content:"";z-index:-1;filter:blur(8px);background:radial-gradient(circle at 46% 42%,#ffd9b21f,#0000 19%),radial-gradient(circle at 63%,#ff445c24,#0000 24%),linear-gradient(142deg,#0c3a6647,#760a3038);border-radius:46% 54% 38% 62%/54% 42% 58% 46%;position:absolute;inset:16% 8% 24%}.home-screen .eyebrow{color:#fff;letter-spacing:.015em;text-shadow:0 2px 18px #000000b3,0 0 28px #ff346533;margin-top:0;margin-bottom:auto;font-family:Georgia,Times New Roman,serif;font-size:clamp(2rem,10vw,3.15rem);font-weight:700;line-height:.9}.home-screen .eyebrow:after{content:" ♥";color:var(--ruby-2);text-shadow:var(--glow)}.home-screen h1{max-width:340px;margin:0 auto;font-size:clamp(2rem,9vw,2.9rem);line-height:1.03}.home-screen>p:not(.eyebrow){color:#edf3ff;max-width:330px;margin:0 auto 8px;font-size:1rem;line-height:1.45}.home-screen .primary-button{margin-top:12px}.title-screen{padding-top:max(26px, env(safe-area-inset-top));background:linear-gradient(#040e2240,#020713f0),radial-gradient(circle at 50% 21%,#ff185c38,#0000 10rem),linear-gradient(145deg,#071e42,#090c24 54%,#040712);justify-content:flex-start}.title-screen h2{margin-top:clamp(15vh,135px,22vh);font-size:clamp(2rem,8vw,2.65rem)}.title-screen label{color:#0000;margin-top:10px;font-size:0}.title-screen input{min-height:64px;box-shadow:var(--glow);background:radial-gradient(circle at 93%,#ffbb5624,#0000 28px),#390c2ab8;border-color:#ff4570e6;border-radius:18px;padding-inline:18px;font-size:1rem}.characters-screen h2,.world-screen h2{max-width:350px;margin-inline:auto}.character-grid{gap:14px;display:grid}.character-card{background:linear-gradient(145deg,#0b2244f5,#051730fa);border:1px solid #789bcf33;border-radius:18px;grid-template-columns:104px minmax(0,1fr);gap:9px 11px;min-height:180px;padding:12px;display:grid;position:relative;overflow:hidden;box-shadow:0 12px 34px #0003,inset 0 1px #ffffff06}.character-card:before{content:"";background:radial-gradient(circle at 50% 30%,#ffc2a73b,#0000 18%),radial-gradient(circle at 50% 56%,#bd194852,#0000 34%),linear-gradient(150deg,#17416a,#291129 64%,#0d1528);border:1px solid #ff37698a;border-radius:14px;grid-area:1/1/span 6;min-height:158px;box-shadow:inset 0 0 32px #0000004d}.character-card>:not(.reference-preview){grid-column:2}.character-card .reference-preview{z-index:2;grid-area:1/1/span 6;height:100%;min-height:158px;margin:0}.card-heading{color:#fff;justify-content:space-between;align-items:center;min-width:0;font-size:.8rem;display:flex}.text-button{color:#ff9ab6;background:0 0;font-size:.72rem;font-weight:700}.character-card label{gap:4px;font-size:.67rem}.character-card input,.character-card textarea,.character-card select{border-radius:10px;padding:8px 9px;font-size:.78rem}.character-card textarea{min-height:64px}.character-card input[type=file]{min-height:40px}.characters-screen>.secondary-button{color:#f6f8ff;background:#0a2a53f2;border-color:#4d77b147;border-radius:14px;width:100%;min-height:48px;font-size:.9rem;font-weight:780}.characters-screen>.secondary-button:before{content:"+";color:#ff97b5;margin-right:8px;font-size:1.15rem}.characters-screen .screen-actions .primary-button{margin-top:0}.world-screen .reference-preview{min-height:170px}.world-screen select{background-color:#081f3ffa;border-color:#ff376547;min-height:58px}.world-screen .screen-actions{margin-top:auto}.reference-preview{background:#071325;border:1px solid #f1efdac2;border-radius:16px;width:100%;margin-top:2px;position:relative;overflow:hidden;box-shadow:0 14px 38px #00000042}.reference-preview img{width:100%;height:100%;min-height:inherit;object-fit:cover;display:block}.generation-screen{text-align:center;background:radial-gradient(circle at 50% 57%,#ff2a653d,#0000 13rem),radial-gradient(circle at 24% 66%,#2153ad61,#0000 14rem),radial-gradient(circle at 82% 67%,#ad308b4d,#0000 15rem),linear-gradient(#061838,#061128 56%,#030814);justify-content:flex-start}.generation-screen h2{margin-top:24px}.generation-screen h2:after{content:" ✨";color:var(--gold)}.generation-screen:after{content:"";z-index:-1;filter:blur(3px);background:radial-gradient(circle,#ff48776b 0 8%,#0000 9%),radial-gradient(at 50% 62%,#ff854733,#0000 30%),linear-gradient(#0000,#ff265e1f);border-radius:50%;position:absolute;inset:38% 18% 24%}.summary-card{color:#dce8fb;box-shadow:var(--shadow);text-align:left;background:linear-gradient(#0e2e5beb,#071c3bf0);border:1px solid #6187be47;border-radius:18px;gap:10px;margin-top:clamp(18vh,145px,24vh);padding:20px;display:grid}.summary-card strong{color:#fff;font-size:1.08rem}.summary-card span{color:var(--muted);font-size:.86rem}.demo-note{color:#8fa4c5;margin:0;font-size:.76rem;line-height:1.45}.chapter-screen{gap:12px;padding-inline:0}.chapter-screen>*{margin-inline:20px}.chapter-screen>.secondary-button{margin-left:20px}.chapter-screen:after{content:"";z-index:0;background:radial-gradient(circle at 62% 28%,#f5b77e38,#0000 14%),radial-gradient(circle at 40% 52%,#30887847,#0000 27%),linear-gradient(145deg,#0a2f42,#26301f 42%,#542229 77%,#160a1b);order:4;width:100%;min-height:250px;margin:4px 0 0;position:relative;box-shadow:inset 0 -42px 60px #00000057,inset 0 1px #ffffff14}.chapter-screen .eyebrow{margin-top:-42px}.demo-badge{color:var(--gold);letter-spacing:.08em;background:#ffd27c14;border:1px solid #ffd27c47;border-radius:999px;align-self:center;padding:5px 9px;font-size:.66rem;font-weight:800}.chapter-screen h2{font-size:1.5rem}.chapter-summary{color:#99a9c1;order:5;margin-top:5px;margin-bottom:0;font-size:.82rem;line-height:1.45}.chapter-copy{color:#f6f8fd;order:6;padding:0 2px 8px;font-family:Georgia,Times New Roman,serif;font-size:1rem;line-height:1.7}.chapter-copy p{margin-bottom:14px}.chapter-screen .primary-button{order:7;width:calc(100% - 40px);margin:auto 20px 0}.approval-screen{background:radial-gradient(circle at 58% 30%,#ffa34c1f,#0000 10rem),radial-gradient(circle at 50% 54%,#8d113d24,#0000 18rem),linear-gradient(#071123,#070915 74%);justify-content:center}.approval-screen .eyebrow{color:var(--gold);margin-top:auto}.approval-screen .eyebrow:before{content:"✦ ";color:var(--gold)}.approval-screen .eyebrow:after{content:" ✦";color:var(--gold)}.approval-screen h2{margin-top:8px}.approval-actions{gap:12px;margin-top:16px;display:grid}.approval-actions .primary-button{margin-top:0}.approval-actions .secondary-button{color:#fff;text-align:left;background:linear-gradient(#101e3c,#0a1730);border:1px solid #6280b247;border-radius:16px;width:100%;min-height:58px;font-size:.96rem;font-weight:800}.approval-actions .secondary-button:before{content:"✎";color:#f3d9df;margin-right:12px;font-size:1rem}.adjustment-actions{gap:10px;display:grid}.adjustment-actions button{color:#fff;text-align:left;background:linear-gradient(#101e3c,#0a1730);border:1px solid #5e7eb247;border-radius:15px;min-height:56px;padding:13px 16px;font-weight:760}.notice{color:#ffd7e2;background:#610c2b40;border:1px solid #ff507a38;border-radius:13px;margin:0;padding:12px 14px;font-size:.8rem;font-weight:650;line-height:1.45}.access-screen,.chapter-edit-screen{justify-content:center}.access-screen form{gap:14px;margin-top:14px;display:grid}.access-screen .primary-button,.chapter-edit-screen .primary-button{margin-top:10px}.chapter-edit-screen textarea{min-height:min(46svh,390px)}@media (min-width:521px){.story-studio{padding:24px}.story-studio-shell{border:1px solid #7090c229;border-radius:28px;min-height:calc(100svh - 48px);box-shadow:0 30px 90px #00000075}.story-screen{border-radius:28px;min-height:calc(100svh - 48px)}}@media (max-width:380px){.story-screen{gap:14px;padding-inline:16px}.character-card{grid-template-columns:92px minmax(0,1fr);padding:10px}.character-card:before,.character-card .reference-preview{min-height:146px}h2{font-size:1.65rem}}