:root{--ink: #20304a;--muted: #68758a;--paper: #fffdf8;--cream: #fff7df;--sun: #ffca55;--coral: #ff846c;--mint: #76d5bd;--sky: #78cdeb;--purple: #9c8cf3;--line: #dce5ea;--shadow: 0 18px 50px rgb(39 54 86 / 12%);color:var(--ink);background:#f8fbfc;font-family:Microsoft YaHei,PingFang SC,system-ui,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 10% 0%,#fff5cf 0 14%,transparent 35%),radial-gradient(circle at 95% 10%,#daf5ef 0 12%,transparent 32%),#f8fbfc}button,input,textarea,select{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:4px solid rgb(120 205 235 / 35%);outline-offset:2px}.app-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;height:76px;padding:0 4vw;border-bottom:1px solid rgb(220 229 234 / 80%);background:#ffffffdb;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none}.brand-mark{display:grid;width:43px;height:43px;place-items:center;border-radius:14px;background:var(--sun);box-shadow:0 6px #eeb13b;font-size:24px;transform:rotate(-3deg)}.brand b,.brand small{display:block}.brand b{font-size:18px}.brand small{color:var(--muted)}.header-actions{display:flex;gap:10px;align-items:center}.provider-pill{display:flex;gap:7px;align-items:center;padding:8px 12px;border-radius:999px;color:#227f6b;background:#eff9f6;font-size:13px;font-weight:700}.provider-pill i{width:8px;height:8px;border-radius:50%;background:var(--mint)}.provider-pill.mock,.provider-pill.checking{color:#8a6712;background:#fff7d9}.provider-pill.mock i,.provider-pill.checking i{background:var(--sun)}.provider-pill.offline{color:#a34d42;background:#fff0eb}.provider-pill.offline i{background:var(--coral)}.ghost{padding:9px 12px;border:0;border-radius:14px;color:var(--muted);background:transparent;font-weight:800;text-decoration:none;cursor:pointer}.new-book:hover{color:var(--ink);background:var(--cream)}.shell{width:min(1240px,92vw);margin:0 auto;padding:30px 0 64px}.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center;min-height:520px}.eyebrow{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border-radius:999px;color:#c05c49;background:#fff0eb;font-size:13px;font-weight:800;letter-spacing:.06em}h1{margin:20px 0;font-size:clamp(40px,5.3vw,72px);line-height:1.04;letter-spacing:-.04em}h1 em{position:relative;color:var(--coral);font-style:normal}.hero p,.page-copy{max-width:620px;color:var(--muted);font-size:18px;line-height:1.8}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.primary{display:inline-flex;padding:14px 22px;border:0;border-radius:14px;color:#fff;background:var(--coral);box-shadow:0 7px #d95b48;font-weight:800;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s}.primary:hover{box-shadow:0 9px #d95b48;transform:translateY(-2px)}.primary:active{box-shadow:0 3px #d95b48;transform:translateY(4px)}.primary:disabled,.secondary:disabled{opacity:.45;box-shadow:none;cursor:not-allowed;transform:none}.secondary{display:inline-flex;align-items:center;justify-content:center;padding:13px 19px;border:1px solid var(--line);border-radius:14px;color:inherit;background:#fff;font-weight:800;text-decoration:none;cursor:pointer}.secondary:hover:not(:disabled){box-shadow:0 8px 20px #2736561a}.hero-art{position:relative;height:440px}.book-stack{position:absolute;top:10%;left:12%;width:75%;height:76%;overflow:hidden;border:8px solid white;border-radius:28px 16px 16px 28px;background:#fff;box-shadow:var(--shadow);transform:rotate(3deg)}.book-picture{position:relative;height:72%;overflow:hidden;background:linear-gradient(145deg,#93ddec,#fff2ae)}.book-picture:before{position:absolute;top:30px;right:35px;width:150px;height:150px;border-radius:50%;background:#fff9;content:""}.book-picture:after{position:absolute;top:44%;left:50%;color:#fff;font-size:86px;text-shadow:30px -50px 0 var(--coral),-65px 35px 0 var(--mint);content:"✦";transform:translate(-50%,-50%)}.book-title{padding:24px 26px}.book-title small{color:var(--muted)}.float-card{position:absolute;padding:12px 16px;border-radius:16px;background:#fff;box-shadow:var(--shadow);font-weight:800;animation:bob 3.2s ease-in-out infinite}.float-card.one{top:15px;right:5px;transform:rotate(5deg)}.float-card.two{bottom:35px;left:0;animation-delay:-1.2s}@keyframes bob{50%{translate:0 -8px}}.page{min-height:calc(100vh - 76px);padding-top:96px}.page h1{max-width:760px;font-size:clamp(38px,5vw,60px)}.route-note{width:fit-content;margin:34px 0 24px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;color:var(--muted);background:#ffffffdb;box-shadow:0 10px 35px #27365612}.text-link{color:#b74e3e;font-weight:800;text-decoration:none}.text-link:hover{text-decoration:underline}.progress-wrap{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:28px;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}.progress-step{display:flex;gap:10px;align-items:center;justify-content:center;padding:14px 12px;border:0;color:#8792a3;background:#fff;font-weight:700;cursor:pointer}.progress-step:disabled{cursor:not-allowed}.progress-step span{display:grid;width:28px;height:28px;place-items:center;border-radius:50%;background:#eef2f4}.progress-step.active{color:var(--ink);background:#fffaf0}.progress-step.active span,.progress-step.done span{color:#fff;background:var(--coral)}.progress-step.done{color:#47615a}.page-head{display:flex;gap:24px;align-items:end;justify-content:space-between;margin-bottom:24px}.page-head h2{margin:10px 0 4px;font-size:clamp(28px,4vw,44px)}.page-head p{margin:0;color:var(--muted)}.form-layout{display:grid;grid-template-columns:1fr 320px;gap:22px}.panel{padding:24px;border:1px solid var(--line);border-radius:22px;background:#ffffffeb;box-shadow:0 10px 35px #27365612}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}label{display:grid;gap:8px;font-size:14px;font-weight:800}label.full{grid-column:1 / -1}label small{color:var(--muted);font-weight:400}input,textarea,select{width:100%;padding:13px 14px;border:1px solid #ccd9df;border-radius:13px;color:var(--ink);background:#fbfdfd}textarea{min-height:96px;line-height:1.6;resize:vertical}.choice-row{display:flex;flex-wrap:wrap;gap:9px}.choice{padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:#fff;cursor:pointer}.choice.selected{border-color:var(--coral);color:#b74e3e;background:#fff0eb;font-weight:800}.side-note{color:#fff;background:#243755}.side-note h3{margin-top:0;font-size:21px}.side-note ol{padding-left:22px;color:#dbe7f4;line-height:2}.side-note .privacy{margin-top:24px;padding:14px;border-radius:14px;color:#dbe7f4;background:#ffffff17;font-size:13px;line-height:1.6}.form-footer{display:flex;align-items:center;justify-content:space-between;margin-top:22px}.form-footer small{color:var(--muted)}.loading{display:grid;min-height:390px;place-items:center;text-align:center}.loading p{color:var(--muted)}.loader-book{position:relative;width:100px;height:76px;margin:0 auto 28px;perspective:600px}.loader-book:before,.loader-book:after{position:absolute;top:0;width:48px;height:70px;border-radius:4px 13px 13px 4px;background:var(--sun);content:"";transform-origin:left center;animation:page-turn 1.3s ease-in-out infinite alternate}.loader-book:before{right:2px}.loader-book:after{left:2px;border-radius:13px 4px 4px 13px;background:var(--sky);transform-origin:right center;animation-delay:-.6s}@keyframes page-turn{to{transform:rotateY(-28deg)}}.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.route-card{padding:22px;border:2px solid transparent;border-radius:22px;background:#fff;box-shadow:0 10px 30px #27365614;color:inherit;text-align:left;cursor:pointer;transition:.2s}.route-card:hover{transform:translateY(-4px)}.route-card.selected{border-color:var(--coral);box-shadow:0 14px 36px #ff846c33}.route-icon{font-size:34px}.route-card h3{margin:12px 0 18px;font-size:22px}.story-beat{padding:13px 0;border-top:1px dashed var(--line)}.story-beat b{display:block;margin-bottom:5px;color:#b75b49;font-size:12px}.story-beat span{color:#526076;font-size:14px;line-height:1.55}.route-highlight{margin-top:14px;padding:12px;border-radius:12px;color:#755e27;background:#fff9e7;font-size:13px;line-height:1.5}.editor-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 300px;gap:18px;align-items:start}.page-list,.character-panel{position:sticky;top:100px}.page-list{display:grid;gap:9px;max-height:calc(100vh - 130px);padding-right:5px;overflow:auto}.page-thumb{display:grid;grid-template-columns:52px 1fr;gap:10px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left;cursor:pointer}.page-thumb.selected{border-color:var(--coral);background:#fff5f1}.thumb-art{aspect-ratio:4 / 3;overflow:hidden;border-radius:8px;background:linear-gradient(135deg,var(--sky),#fff2ad)}.thumb-art.illustrated,.canvas-art.illustrated,.preview-art.illustrated{background:linear-gradient(145deg,#a8e6cf,#ffd3b6 58%,#7c83fd)}.page-thumb b{font-size:13px}.page-thumb small{display:block;margin-top:3px;overflow:hidden;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}.canvas-card{overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow)}.canvas-art{position:relative;display:grid;aspect-ratio:3 / 2;place-items:center;overflow:hidden;background:linear-gradient(140deg,#a5e2ef,#fff1ae)}.illustration-image{display:block;width:100%;height:100%;object-fit:cover}.canvas-art .illustration-image{position:absolute;top:0;right:0;bottom:0;left:0}.placeholder-copy{max-width:340px;color:#324862;text-align:center}.placeholder-copy span,.placeholder-copy b{display:block}.placeholder-copy span{font-size:54px}.placeholder-copy b{margin:8px;font-size:20px}.placeholder-copy small{line-height:1.5}.image-action{position:absolute;right:16px;bottom:16px}.canvas-text{padding:22px}.canvas-text textarea{min-height:130px;background:var(--paper);font-size:17px}.word-count{display:block;margin-top:7px;color:var(--muted);font-size:12px;text-align:right}.edit-tools{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:14px}.edit-tools input{min-width:0}.character-panel h3{margin-top:0}.character-avatar{display:grid;width:70px;height:70px;margin-bottom:14px;place-items:center;border-radius:22px;background:linear-gradient(135deg,var(--mint),var(--sky));font-size:34px}.character-fact{padding:12px 0;border-bottom:1px dashed var(--line)}.character-fact small,.character-fact b{display:block}.character-fact small{margin-bottom:4px;color:var(--muted)}.prompt-box{max-height:150px;margin-top:16px;padding:12px;overflow:auto;border-radius:12px;color:#5c6980;background:#f3f7f8;font-size:12px;line-height:1.55}.editor-top{display:flex;gap:10px;align-items:center}.save-state{color:var(--muted);font-size:13px}.preview-shell{display:grid;grid-template-columns:1fr 310px;gap:24px;align-items:start}.book-preview{display:grid;min-height:580px;padding:36px;place-items:center;border-radius:28px;background:#e9f1f3}.book-page{width:min(760px,100%);overflow:hidden;border-radius:14px 28px 28px 14px;background:#fff;box-shadow:10px 16px #2335521f,var(--shadow)}.preview-art{display:grid;aspect-ratio:3 / 2;place-items:center;background:linear-gradient(135deg,#9fddeb,#fff1ae);text-align:center}.preview-art span,.preview-art b{display:block}.preview-art span{font-size:64px}.preview-copy{min-height:160px;padding:24px 34px;font-size:18px;line-height:1.8}.cover-page{display:grid;min-height:500px;padding:40px;place-items:center;background:linear-gradient(150deg,var(--sky),#fff1ad 65%,var(--coral));text-align:center}.cover-icon{font-size:72px}.cover-page h2{margin:12px 0;font-size:48px}.preview-nav{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:22px}.preview-nav span{padding:13px}.preview-side h3{margin-top:0}.preview-side label{margin-top:10px}.title-options{display:grid;gap:9px}.title-option{padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:left;cursor:pointer}.title-option.selected{border-color:var(--coral);background:#fff3ee}.contribution{margin-top:18px;padding:15px;border-radius:15px;color:#35695e;background:#eef9f6;font-size:13px;line-height:1.7}.preview-actions{display:grid;gap:10px;margin-top:18px}.toast{position:fixed;bottom:28px;left:50%;z-index:99;max-width:calc(100vw - 32px);padding:12px 18px;border-radius:999px;opacity:0;color:#fff;background:#243755;box-shadow:var(--shadow);pointer-events:none;text-align:center;transform:translate(-50%,120px);transition:.25s}.toast.show{opacity:1;transform:translate(-50%)}@media(prefers-reduced-motion:reduce){.float-card,.loader-book:before,.loader-book:after{animation:none}.primary{transition:none}}@media(max-width:960px){.hero,.form-layout,.preview-shell{grid-template-columns:1fr}.hero-art{display:none}.routes{grid-template-columns:1fr}.editor-layout{grid-template-columns:150px 1fr}.character-panel{position:static;grid-column:1 / -1}.character-panel .panel{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}}@media(max-width:640px){.app-header{padding:0 16px}.brand small,.provider-pill span{display:none}.shell{width:min(94vw,600px);padding-top:18px}.hero{min-height:calc(100vh - 112px)}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions a{justify-content:center}.page{padding-top:64px}.progress-step{font-size:0}.progress-step span{font-size:13px}.form-grid{grid-template-columns:1fr}.form-footer{flex-direction:column;gap:12px;align-items:stretch}.editor-layout{grid-template-columns:1fr}.page-list{position:static;grid-auto-columns:135px;grid-auto-flow:column;overflow-x:auto}.page-thumb{grid-template-columns:44px 1fr}.edit-tools{grid-template-columns:1fr}.page-head{flex-direction:column;align-items:start}.editor-top{flex-wrap:wrap}}@media print{.app-header,.progress-wrap,.preview-side,.preview-nav{display:none!important}.shell{width:100%;padding:0}.preview-shell{display:block}.book-preview{min-height:auto;padding:0;background:#fff}.book-page{width:100%;box-shadow:none;page-break-after:always}}