:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f7f4ef;--surface:#fff;--surface-muted:#f0ebe3;--text:#1f2a24;--text-muted:#5f6d64;--primary:#2f6f63;--primary-strong:#24584f;--accent:#d8ebe4;--border:#d9d2c7;--danger:#9b3b3b;--shadow:0 12px 40px #1f2a2414;--radius:18px;--radius-sm:12px;--touch-min:44px;--font:"Avenir Next", "Segoe UI", system-ui, sans-serif}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font);color:var(--text);background:radial-gradient(circle at top left, #e7f1ec 0%, transparent 32%), radial-gradient(circle at top right, #f6ead8 0%, transparent 28%), var(--bg);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5}a{color:var(--primary-strong)}button,input,select,textarea{font:inherit}.app-shell{grid-template-rows:auto 1fr auto;min-height:100vh;display:grid}.app-header{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#ffffffd1;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.25rem;display:flex;position:sticky;top:0}.brand{color:inherit;align-items:center;gap:.75rem;text-decoration:none;display:flex}.brand strong{font-size:1.05rem;display:block}.brand small{color:var(--text-muted);font-size:.82rem;display:block}.brand-mark{background:var(--accent);width:2.5rem;height:2.5rem;color:var(--primary-strong);border-radius:999px;place-items:center;font-size:1.2rem;display:grid}.app-nav{flex-wrap:wrap;gap:.5rem;display:flex}.app-nav a{min-height:var(--touch-min);color:var(--text);border-radius:999px;align-items:center;padding:.55rem .9rem;text-decoration:none;display:inline-flex}.app-nav a.active,.app-nav a:hover{background:var(--surface-muted)}.app-main{width:min(960px,100%);margin:0 auto;padding:1.25rem}.app-footer{text-align:center;color:var(--text-muted);padding:1.25rem;font-size:.92rem}.page{gap:1.25rem;display:grid}.hero,.panel,.story-page-card,.story-card,.story-form,.empty-state{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.hero,.panel,.empty-state,.story-form{padding:1.5rem}.hero{padding:2rem 1.5rem}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--primary-strong);margin:0;font-size:.78rem;font-weight:700}h1,h2,h3,p{margin-top:0}h1{margin-bottom:.75rem;font-size:clamp(2rem,5vw,2.8rem);line-height:1.1}.lede{color:var(--text-muted);max-width:60ch;font-size:1.05rem}.hero-actions,.form-actions,.reader-actions,.story-card-actions,.reader-controls{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.button{min-height:var(--touch-min);cursor:pointer;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:.65rem 1rem;font-weight:600;text-decoration:none;display:inline-flex}.button:disabled{opacity:.55;cursor:not-allowed}.button-primary{background:var(--primary);color:#fff}.button-primary:hover:not(:disabled){background:var(--primary-strong)}.button-secondary{background:var(--surface-muted);color:var(--text);border-color:var(--border)}.button-ghost{color:var(--text-muted);background:0 0}.steps{gap:1rem;margin:0;padding-left:1.2rem;display:grid}.steps li{gap:.2rem;display:grid}.steps span{color:var(--text-muted)}.panel-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.story-list{margin:0;padding-left:1.2rem}.story-list.compact{gap:.5rem;display:grid}.form-section{gap:1rem;margin-bottom:1.25rem;display:grid}.field-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;display:grid}.field{gap:.45rem;display:grid}.field span{font-weight:600}.field input,.field select,.field textarea{width:100%;min-height:var(--touch-min);border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;padding:.75rem .9rem}.field textarea{resize:vertical;min-height:6rem}.story-grid{gap:1rem;display:grid}.story-card{gap:1rem;padding:1.25rem;display:grid}.story-card-preview,.muted{color:var(--text-muted)}.banner{border-radius:var(--radius-sm);padding:.9rem 1rem}.banner-error{color:var(--danger);background:#fdecec;border:1px solid #efc2c2}.note{color:var(--text-muted);font-size:.92rem}.note code,.create-page code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em}.story-reader{gap:1rem}.reader-header{flex-wrap:wrap;justify-content:space-between;gap:1rem;display:flex}.story-page-card{align-content:center;gap:1rem;min-height:280px;padding:2rem 1.5rem;display:grid}.story-page-meta{flex-wrap:wrap;justify-content:space-between;gap:1rem;display:flex}.page-badge{background:var(--accent);color:var(--primary-strong);border-radius:999px;padding:.35rem .7rem;font-size:.82rem;font-weight:700}.story-page-text{max-width:36ch;font-size:clamp(1.2rem,3vw,1.6rem);line-height:1.45}.page-dots{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.page-dots button{background:var(--border);cursor:pointer;border:none;border-radius:999px;width:.85rem;height:.85rem;padding:0}.page-dots button.active{background:var(--primary);transform:scale(1.15)}.reader-controls{justify-content:space-between}.empty-state{text-align:center;justify-items:center;gap:1rem;display:grid}.print-only-all-pages{display:none}@media (width<=720px){.app-header{flex-direction:column;align-items:stretch}.app-nav{justify-content:space-between}.reader-controls{flex-direction:column}.reader-controls .button{width:100%}}@media print{.app-header,.app-footer,.reader-actions,.reader-controls,.story-page-card:not(.print-only-all-pages .story-page-card){display:none!important}.print-only-all-pages{gap:1rem;display:grid!important}.story-page-card{break-inside:avoid;box-shadow:none;border:1px solid #ccc}}
