:root{--brand-purple: #651ff0;--brand-purple-dark: #4d0099;--bg: #f2f2f5;--surface: #ffffff;--text: #2a1250;--text-muted: #6b6b7a;--danger: #c0392b;--radius: 12px;--max-width: 640px}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,Segoe UI,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}h1,h2,h3,h4{margin:0 0 .5rem;font-weight:600}header.app-header{background:var(--brand-purple);color:#fff;padding:.75rem 1rem;text-align:center}header.app-header h1{font-size:1.5rem;margin:0}header.app-header a{color:#fff;text-decoration:none}main{max-width:var(--max-width);margin:1.25rem auto;padding:0 1rem;display:flex;flex-direction:column;gap:1rem}.card{background:var(--surface);border-radius:var(--radius);padding:1.25rem;box-shadow:0 1px 3px #00000014}.stack{display:flex;flex-direction:column;gap:.75rem}.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.row.space-between{justify-content:space-between}button,input[type=submit]{font:inherit;background:var(--brand-purple);color:#fff;border:0;border-radius:var(--radius);padding:.65rem 1.1rem;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:transparent;color:var(--brand-purple-dark);border:2px solid var(--brand-purple)}button.danger{background:var(--danger)}input[type=text],input[type=email]{font:inherit;padding:.65rem .75rem;border-radius:var(--radius);border:2px solid #ddd;width:100%}.room-code{font-size:2.75rem;letter-spacing:.15em;text-align:center;font-weight:700;color:var(--brand-purple-dark)}.room-code.compact{font-size:1.5rem}.room-code-input{text-transform:uppercase;text-align:center;font-size:1.5rem}.share-code{font-size:1.4rem;letter-spacing:.1em}.text-center{text-align:center}.no-margin{margin:0}.mt-sm{margin-top:.5rem}.full-width{width:100%}.flex-grow{flex:1}.status-message{text-align:center}.structure-name{display:inline;font-size:1rem;font-weight:500}.muted{color:var(--text-muted);font-size:.9rem}.error-text{color:var(--danger);text-align:center}.category-group summary{cursor:pointer;font-weight:600;padding:.5rem 0}.structure-list{list-style:none;margin:0;padding:0}.structure-list li{border-top:1px solid #eee}.structure-list li>a,.structure-list li>button.list-item{display:flex;justify-content:space-between;align-items:center;width:100%;padding:.6rem 0;background:none;border:0;border-radius:0;color:inherit;text-decoration:none;font:inherit;text-align:left;cursor:pointer}.structure-list li>a:hover,.structure-list li>button.list-item:hover{color:var(--brand-purple-dark)}.progress-bar{height:10px;border-radius:6px;background:#e5e0f5;overflow:hidden}.progress-bar-fill{height:100%;width:var(--progress, 0%);background:var(--brand-purple);transition:width .3s ease}@media (min-width: 480px){main{margin:2rem auto}}.story-canvas{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;padding:.75rem;border:2px dashed #ddd;border-radius:var(--radius);background:#fafafa}.story-canvas .filler-input{width:auto;flex:1 1 6rem;min-width:4rem;padding:.4rem .5rem;border-color:#eee}.prompt-chip{background:var(--brand-purple);color:#fff;border-radius:999px;padding:.3rem .75rem;font-size:.9rem;white-space:nowrap}.preview-text{font-family:ui-monospace,monospace;font-size:.8rem;word-break:break-word}.story-filler{color:var(--text)}.story-prompt{display:inline-block;color:var(--brand-purple-dark);background:#f0e9fc;border-radius:6px;padding:.05rem .4rem;margin:0 .15rem;font-weight:600}
