:root{--ink:#253c54;--muted:#6d7b86;--paper:#fffaf0;--cream:#fcf5e8;--sky:#5aa9d6;--deep:#287fae;--coral:#ed9379;--sun:#f5c85b;--leaf:#83b89c;--line:#e2d8c7;--shadow:0 18px 48px rgba(48,92,118,.13)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:radial-gradient(circle at 8% 4%,#d8eef8,transparent 26%),radial-gradient(circle at 96% 18%,#fbe1c6,transparent 30%),linear-gradient(145deg,#fbf5e9,#eef7f6 52%,#fcf2e4)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}.hidden{display:none!important}header{position:sticky;top:0;z-index:20;background:rgba(252,245,232,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}nav{max-width:1100px;min-height:72px;margin:auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;gap:9px;align-items:center;background:transparent;color:var(--ink);font-weight:900;font-size:1.18rem}.brand b{display:grid;place-items:center;width:39px;height:39px;border-radius:48% 52% 45% 55%;background:linear-gradient(135deg,var(--deep),var(--sky));color:white}.navlinks{display:flex;gap:6px}.navlinks button{padding:9px 11px;background:transparent;color:var(--muted);font-weight:750}.primary,.secondary,.small{min-height:42px;padding:10px 14px;border-radius:12px;font-weight:850}.primary{background:linear-gradient(135deg,var(--deep),var(--sky));color:white;box-shadow:0 10px 22px rgba(43,131,177,.22)}.secondary{background:var(--paper);border:1px solid #d8d4c9;color:var(--deep)}.small{padding:8px 10px;background:#e8f3f4;color:#31769a;font-size:.84rem}.danger{background:#fff0ef;color:#a44848}#app{max-width:1100px;margin:auto;padding:28px 20px 82px}.loading{text-align:center;padding:50px;color:var(--muted)}.error{max-width:620px;margin:40px auto;padding:28px;border:1px solid #efc6bf;border-radius:18px;background:#fff8f5;box-shadow:var(--shadow)}.error h2{font:1.8rem Georgia,serif;margin:0 0 10px}.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:25px 0 45px}.tag{display:inline-block;padding:8px 12px;border-radius:999px;background:#dff1f8;color:var(--deep);font-size:.84rem;font-weight:850}.hero h1{margin:16px 0;font:clamp(2.8rem,6.2vw,5.1rem)/.98 Georgia,serif;letter-spacing:-.055em}.hero h1 em{font-style:normal;color:var(--deep)}.hero p,.muted{color:var(--muted);line-height:1.6}.paths{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px;max-width:690px}.path{padding:18px;border:1px solid #d7e3df;border-radius:18px;background:#fffdf7}.path.demo{background:linear-gradient(135deg,#eef9fb,#fff4e1)}.path h3{margin:0 0 7px;font:1.25rem Georgia,serif}.path p{min-height:51px;color:var(--muted);font-size:.9rem;line-height:1.45}.path button{width:100%}.coverwrap{display:grid;place-items:center;min-height:305px}.cover{width:min(100%,300px);aspect-ratio:3/4;position:relative;overflow:hidden;padding:28px;border-radius:13px 22px 22px 13px;background:linear-gradient(150deg,#267ea8,#63b6d6 47%,#f0ad73);box-shadow:-12px 0 #1e648b,0 28px 50px rgba(37,119,158,.3);color:white}.cover:before{content:"";position:absolute;right:-45px;top:-42px;width:195px;height:195px;border-radius:50%;background:rgba(255,255,255,.16)}.cover small{position:relative;text-transform:uppercase;letter-spacing:.14em}.cover h2{position:relative;margin:53px 0 0;font:2.1rem/1.04 Georgia,serif}.symbol{position:absolute;left:27px;bottom:20px;font-size:4rem}.section{margin-top:25px}.section h2{font:2rem Georgia,serif;margin:0}.moments,.library-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.moment,.project{padding:15px;border:1px solid var(--line);border-radius:17px;background:rgba(255,250,240,.86)}.art{height:70px;display:grid;place-items:center;border-radius:11px;margin-bottom:10px;color:white;font-size:2rem}.moment h3,.project h3{margin:0}.moment p{font-size:.83rem;color:var(--muted);line-height:1.4}.panel{overflow:hidden;border:1px solid var(--line);border-radius:23px;background:rgba(255,250,240,.95);box-shadow:var(--shadow)}.panelhead{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line)}.panelhead h2{margin:0;font:1.5rem Georgia,serif}.steps{display:flex;gap:6px;flex-wrap:wrap}.steps span{padding:6px 9px;border-radius:999px;background:#edf2f1;color:#82919c;font-size:.76rem;font-weight:850}.steps .on{background:#d8edf5;color:var(--deep)}.wizard{padding:24px}.wizard h3{margin:0 0 8px;font:1.65rem Georgia,serif}.choices,.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choice{min-height:105px;padding:15px;border:1px solid #d9e5e0;border-radius:15px;background:#fffdf7;color:var(--ink);text-align:left}.choice.on{border:2px solid var(--sky);background:#eaf7fa}.choice strong{display:block;color:var(--deep)}.choice small{display:block;margin-top:4px;color:var(--muted)}.choice i{display:block;margin-bottom:7px;font-style:normal;font-size:1.4rem}.field{display:flex;flex-direction:column;gap:7px}.wide{grid-column:span 2}.field label{font-size:.86rem;color:#40566a;font-weight:850}.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid #d9d9d2;border-radius:11px;background:#fffaf2;color:var(--ink);font-size:16px}.field textarea{min-height:94px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--sky);box-shadow:0 0 0 3px #dceff5}.hint{margin:0;color:var(--muted);font-size:.8rem;line-height:1.4}.note{margin-top:16px;padding:13px;border:1px solid #d9e8df;border-radius:13px;background:#eff8f5;color:#537070;font-size:.89rem}.plan{padding:18px;border:1px solid #d7e8e5;border-radius:18px;background:linear-gradient(135deg,#edf8f9,#fff4df)}.plan div{padding:10px 0;border-bottom:1px dashed #cbdedb}.plan div:last-child{border:0}.plan b{display:block;color:var(--deep);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}.foot{display:flex;justify-content:space-between;gap:10px;margin-top:23px;padding-top:20px;border-top:1px dashed var(--line)}.editorgrid{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:620px}.pages{padding:14px;background:#f3f8f5;border-right:1px solid var(--line)}.pagehead{display:flex;justify-content:space-between;align-items:center;gap:7px;margin-bottom:10px}.pagelist{max-height:590px;overflow:auto}.pagebutton{width:100%;margin:6px 0;padding:10px;border:1px solid #dce5df;border-radius:12px;background:#fffaf4;color:var(--ink);text-align:left}.pagebutton.on{border-color:#80bdd7;background:#e2f1f6;box-shadow:inset 3px 0 var(--deep)}.pagebutton small{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.editor{min-width:0;padding:21px}.tabs{display:flex;gap:8px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}.tabs button{padding:10px 12px;border-radius:10px;background:#eff5f3;color:#66808a;font-weight:850}.tabs button.on{background:#dceff5;color:var(--deep)}.edtop{display:flex;justify-content:space-between;gap:8px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}.saved{color:#47866f;font-size:.84rem;font-weight:850}.scene{position:relative;min-height:190px;margin-bottom:17px;overflow:hidden;border-radius:20px;background:linear-gradient(145deg,#2f7fa7,#78c4d5);color:white}.scene.coral{background:linear-gradient(145deg,#ed9379,#f4c75e)}.scene.leaf{background:linear-gradient(145deg,#78ad92,#d6d680)}.scene.sunset{background:linear-gradient(145deg,#6d7fb1,#efa277)}.scene.twilight{background:linear-gradient(145deg,#5676aa,#94cbd7)}.scene .symbol{top:19px;left:26px}.scene .orb{position:absolute;right:28px;top:24px;width:68px;height:68px;border-radius:50%;background:#ffe7a0;box-shadow:0 0 35px #ffe7a0}.scene .hill{position:absolute;bottom:-45px;left:-10%;width:120%;height:112px;border-radius:50% 50% 0 0;background:#5d8f88}.scene h3{position:absolute;left:128px;right:20px;bottom:18px;margin:0;font:1.4rem/1.12 Georgia,serif}.actions,.approval{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.approval{align-items:center;padding:11px;border:1px solid #dce9df;border-radius:12px;background:#f4faf7}.approval span{margin-right:auto;color:#50706d;font-size:.82rem;font-weight:800}.studio,.character{padding:17px;border:1px solid #d8e6dd;border-radius:17px;background:#f6fbf8}.character{background:linear-gradient(145deg,#e6f5f6,#fff3df)}.studio h3,.character h3{margin:10px 0;font:1.45rem Georgia,serif}.cells{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cell{padding:9px;border-radius:10px;background:rgba(255,255,255,.7);font-size:.85rem}.cell b{display:block;color:#397a94;font-size:.71rem;text-transform:uppercase}.reader{display:grid;grid-template-rows:auto 1fr auto;min-height:600px;overflow:hidden;border-radius:23px;background:#284f67;color:white}.bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:15px 19px;background:rgba(0,0,0,.13)}.bar button{min-height:40px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.14);color:white;font-weight:850}.bar .speak{background:white;color:var(--deep)}.readerbody{display:grid;place-items:center;padding:25px}.spread{display:grid;grid-template-columns:1fr 1fr;width:min(760px,100%);min-height:390px;overflow:hidden;border-radius:10px;background:#fffaf0;color:var(--ink);box-shadow:0 18px 44px rgba(0,0,0,.28)}.spreadart{display:grid;place-items:center;color:#fff8dc;font-size:5rem;background:linear-gradient(145deg,#2d80aa,#6db6d3)}.spreadart.coral{background:linear-gradient(145deg,#ed9379,#f4c75e)}.spreadart.leaf{background:linear-gradient(145deg,#78ad92,#d6d680)}.spreadart.sunset{background:linear-gradient(145deg,#6d7fb1,#efa277)}.spreadart.twilight{background:linear-gradient(145deg,#5676aa,#94cbd7)}.spreadtext{display:flex;flex-direction:column;justify-content:center;padding:37px}.spreadtext h2{margin:0 0 18px;font:2rem/1.08 Georgia,serif}.spreadtext p{margin:0;font:1.1rem/1.7 Georgia,serif}.mini{height:126px;padding:14px;display:flex;align-items:end;border-radius:12px;background:linear-gradient(145deg,#2d80aa,#72b5d0);color:white;font:1.35rem/1.1 Georgia,serif}.float{position:fixed;z-index:30;right:16px;bottom:16px;min-height:46px;padding:10px 13px;border:1px solid #d8d8cb;border-radius:999px;background:#fff9ef;color:var(--deep);box-shadow:0 12px 30px rgba(48,92,118,.18);font-weight:900}#toast{position:fixed;z-index:50;bottom:20px;left:50%;max-width:calc(100vw - 32px);padding:12px 16px;border-radius:12px;background:#284f67;color:white;box-shadow:0 12px 35px rgba(0,0,0,.22);transform:translate(-50%,110px);transition:.22s}#toast.show{transform:translate(-50%,0)}@media(max-width:900px){.hero{grid-template-columns:1fr}.coverwrap{order:-1;min-height:220px}.cover{width:205px}.cover h2{margin-top:35px;font-size:1.62rem}.paths,.moments,.library-grid{grid-template-columns:1fr}.editorgrid{display:block;min-height:0}.pages{border-right:0;border-bottom:1px solid var(--line);padding:12px}.pagelist{display:flex;gap:8px;max-height:none;overflow-x:auto;overflow-y:hidden;padding:2px 2px 10px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;touch-action:pan-x}.pagebutton{min-width:126px;width:126px;flex:0 0 126px;min-height:68px;margin:0;scroll-snap-align:start}.editor{padding:16px}.edtop{position:sticky;top:72px;z-index:10;background:rgba(255,250,240,.97)}.spread{grid-template-columns:1fr;min-height:455px}.spreadart{min-height:180px}.spreadtext{padding:25px}.reader{min-height:calc(100vh - 110px)}.readerbody{padding:13px}.bar:last-child button{flex:1}}@media(max-width:600px){nav{padding:0 14px}.navlinks{display:none}.brand{font-size:1.04rem}.brand b{width:37px;height:37px}.nav .primary{padding:10px 12px;font-size:.86rem}#app{padding:20px 14px 62px}.hero h1{font-size:3rem}.choices,.fields{grid-template-columns:1fr}.wide{grid-column:auto}.wizard{padding:17px}.steps{display:none}.foot{position:sticky;bottom:0;padding-bottom:4px;background:rgba(255,250,240,.98)}.foot .button{flex:1}.tabs{overflow-x:auto;white-space:nowrap}.tabs button{flex:0 0 auto}.actions,.approval{display:grid;grid-template-columns:1fr}.approval span{margin:0}.float{width:48px;height:48px;padding:0;font-size:24px}.float span{display:none}.scene h3{left:118px;font-size:1.2rem}.cells{grid-template-columns:1fr}.bar{padding:12px}.bar strong,.bar button{font-size:.78rem}.spreadtext h2{font-size:1.55rem}.spreadtext p{font-size:1rem}}