:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--background:#fdf7fa;--card:#fff;--border:#e7d6e0;--text:#1f1a23;--muted:#6b5d68;--primary:#b13a7a;--primary-dark:#8a2660;--warning:#fff5ec;--warning-border:#f1ad6b;--danger:#ffe8e8;--danger-text:#8f1d1d}*{box-sizing:border-box}body{background:var(--background);color:var(--text);margin:0;font-family:Arial,Helvetica,sans-serif}button,textarea,select{font:inherit}.page{max-width:1100px;margin:0 auto;padding:32px 20px 56px}.hero{gap:16px;margin-bottom:24px;display:grid}.eyebrow{color:var(--primary);letter-spacing:.06em;text-transform:uppercase;font-size:13px;font-weight:700}h1{margin:0;font-size:clamp(28px,5vw,46px);line-height:1.1}.notice{border:1px solid var(--warning-border);background:var(--warning);border-radius:16px;padding:16px;line-height:1.5}.notice strong{color:var(--primary-dark)}.starter-card{border:1px solid var(--border);background:var(--card);border-radius:16px;gap:14px;padding:18px;display:grid}.starter-card h2{margin:0;font-size:18px}.starter-intro{color:var(--muted);margin:0;line-height:1.45}.topic-tabs{flex-wrap:wrap;gap:8px;display:flex}.topic-tab{border:1px solid var(--border);color:var(--text);cursor:pointer;background:#f9eaf1;border-radius:999px;padding:8px 14px}.topic-tab:hover{background:#f3d9e6}.topic-tab.active{background:var(--primary);border-color:var(--primary);color:#fff}.starter-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;display:grid}.starter-button{text-align:left;border:1px solid var(--border);cursor:pointer;color:var(--text);background:#fdf7fa;border-radius:12px;padding:10px 12px}.starter-button:hover{background:#f9eaf1}.language-card{border:1px solid var(--border);background:var(--card);border-radius:16px;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 16px;display:flex}.language-card label{font-weight:700}.language-card select{border:1px solid var(--border);color:var(--text);background:#fff;border-radius:999px;min-width:180px;padding:8px 12px}.layout{grid-template-columns:1fr;align-items:start;gap:20px;display:grid}.panel{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 16px 48px #1f1a2314}.chat{flex-direction:column;min-height:600px;display:flex}.messages{flex-direction:column;flex:1;gap:14px;padding:18px;display:flex;overflow-y:auto}.message{white-space:pre-wrap;border-radius:16px;max-width:90%;padding:14px 16px;line-height:1.5}.message.user{background:var(--primary);color:#fff;align-self:flex-end}.message.assistant{color:var(--text);background:#f9eaf1;align-self:flex-start}.message.safety{background:var(--warning);border:1px solid var(--warning-border)}.composer{border-top:1px solid var(--border);gap:10px;padding:16px;display:grid}textarea{resize:vertical;border:1px solid var(--border);width:100%;min-height:92px;color:var(--text);border-radius:14px;padding:14px}.actions{flex-wrap:wrap;gap:10px;display:flex}button,.link-button{background:var(--primary);color:#fff;cursor:pointer;border:0;border-radius:999px;padding:10px 16px;text-decoration:none}button.secondary,.link-button.secondary{color:var(--text);background:#f3e3ec}button.recording{background:var(--danger-text);color:#fff}button.danger{background:var(--danger);color:var(--danger-text)}button:hover,.link-button:hover{background:var(--primary-dark)}button.secondary:hover,.link-button.secondary:hover{background:#e9d2de}button.recording:hover{background:#6f1515}button.danger:hover{background:#ffd6d6}button:disabled{cursor:not-allowed;opacity:.65}.sidebar{gap:16px;padding:18px;display:grid}.sidebar h3{margin:0 0 8px}.sidebar p,.sidebar li{color:var(--muted);line-height:1.5}.sources{gap:10px;display:grid}.source-card{border:1px solid var(--border);border-radius:12px;padding:12px}.source-card a{color:var(--primary-dark)}.source-card .small{color:var(--muted);font-size:13px}.trace{gap:8px;display:grid}.trace-item{border:1px solid var(--border);border-radius:12px;padding:10px}.disclaimer-block{border:1px dashed var(--warning-border);background:#fffaf3;border-radius:12px;padding:12px}.disclaimer-block ul{margin:6px 0 0 18px;padding:0}.small{color:var(--muted);font-size:13px}@media (max-width:880px){.message{max-width:100%}}
