*{box-sizing:border-box} :root{font-family:Inter,ui-rounded,system-ui,sans-serif;color:#2e294e}
body{margin:0;min-height:100vh;background:linear-gradient(145deg,#f8f3ff,#fff8ed);padding:24px}
.app{max-width:1100px;margin:auto}.hidden{display:none!important}.card{background:#fff;border:1px solid #eee5fa;border-radius:26px;box-shadow:0 18px 50px #4b2c6b16}
.setup{max-width:520px;margin:8vh auto;padding:42px;text-align:center}.setup .spark{font-size:44px;color:#8b5cf6}.setup h1{font-size:36px;margin:8px}.setup p{color:#77708c}
label{display:block;text-align:left;font-weight:700;margin:20px 0 8px}input{width:100%;border:1px solid #ded7e8;border-radius:14px;padding:14px;font-size:16px;outline:none}input:focus{border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf618}
button{border:0;border-radius:14px;background:#7653d6;color:white;padding:14px 18px;font-size:16px;font-weight:800;cursor:pointer}.setup button{width:100%;margin-top:20px}
header{display:flex;justify-content:space-between;align-items:center;margin:12px 2px 22px}header h1{margin:3px 0;font-size:30px}.eyebrow{font-size:11px;letter-spacing:1.6px;color:#8c7ba5;font-weight:900}.ghost{background:#fff;color:#7653d6;border:1px solid #ded7e8}
.columns{display:grid;grid-template-columns:1.05fr .95fr;gap:20px}.chat-card,.story-card{min-height:650px;overflow:hidden}.agent{padding:18px 20px;border-bottom:1px solid #eee8f5;display:flex;gap:12px;align-items:center}.avatar{font-size:28px;background:#f2eaff;padding:9px;border-radius:50%}.agent small{display:block;color:#91899e;margin-top:2px}
.chat{height:500px;overflow:auto;padding:22px;display:flex;flex-direction:column;gap:12px}.bubble{max-width:82%;padding:13px 16px;border-radius:18px;line-height:1.45}.bot{background:#f2edff;align-self:flex-start;border-bottom-left-radius:5px}.kid{background:#7653d6;color:white;align-self:flex-end;border-bottom-right-radius:5px}
.composer{display:flex;gap:10px;padding:15px;border-top:1px solid #eee8f5}.composer button{width:52px}.story-card{padding:22px}.story-head{display:flex;justify-content:space-between}.story-head h2{margin:4px 0 18px}.story-head #progress{background:#f2edff;height:30px;padding:6px 10px;border-radius:12px;font-weight:800;color:#7653d6}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{background:#faf8fd;border-radius:14px;padding:12px;min-height:68px}.field b{display:block;font-size:11px;color:#91899e;text-transform:uppercase;margin-bottom:5px}.field span{font-weight:700}
.preview{margin-top:16px;min-height:250px;border-radius:20px;background:linear-gradient(#46306d,#a16fa5 58%,#f2b583);color:white;padding:25px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}.preview:before{content:"✦  ·  ✧   · ✦";position:absolute;top:24px;left:25px;color:#fff9}.moon{position:absolute;right:30px;top:45px;font-size:58px;color:#fff4c2}.preview p{font-family:Georgia,serif;font-size:19px;line-height:1.55;margin:0;text-shadow:0 2px 10px #2d164b}
@media(max-width:800px){body{padding:12px}.columns{grid-template-columns:1fr}.chat-card,.story-card{min-height:auto}.chat{height:420px}.setup{padding:28px 22px;margin:3vh auto}header{align-items:flex-start}.fields{grid-template-columns:1fr 1fr}}