@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap";:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100vh;background-color:#f5f6fb}#root{min-height:100vh}textarea,button,body{font-family:SF Pro Display,Helvetica Neue,Arial,sans-serif}:root{font-family:VT323,"Press Start 2P",monospace;line-height:1.4;font-weight:400;color:#f9f7e8;background-color:#050505}body{margin:0;background-image:radial-gradient(#211f3a 1px,transparent 1px),radial-gradient(#1a1a2e 1px,transparent 1px);background-position:0 0,12px 12px;background-size:24px 24px;min-height:100vh}.chat-app{min-height:100vh;padding:20px 12px 40px;color:#f8f6df}.top-bar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:24px}.top-bar h1{margin:0;font-size:clamp(24px,4vw,32px);color:#fffbe8;text-shadow:3px 3px 0 #111}.top-bar-actions{display:flex;gap:12px;flex-wrap:wrap}button{border:3px solid #111;border-radius:0;padding:10px 18px;font-size:12px;cursor:pointer;background-color:#ff5c8d;color:#050505;box-shadow:4px 4px #111;font-family:"Press Start 2P",monospace;text-transform:uppercase}button:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:6px 6px #111}button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.chat-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:16px;max-width:1100px;margin:0 auto}.chat-panel{background-color:#0f0f0fd9;border:4px solid #f9c846;padding:clamp(16px,2vw,24px);box-shadow:0 12px #111;display:flex;flex-direction:column;gap:clamp(12px,2vw,20px);height:clamp(520px,70vh,780px);min-height:0}.chat-panel-header{display:flex;justify-content:space-between;align-items:baseline}.session-id,.session-sub{margin:0;color:#b8f0ff;font-size:14px}.autosave{font-size:10px;padding:6px 14px;border:2px solid #f9c846;background-color:#050505;color:#f9c846}.autosave.error{border-color:#ff5c8d;color:#ff5c8d}.autosave.saved{border-color:#5ef0ff;color:#5ef0ff}.autosave.saving{border-color:#b8f0ff;color:#b8f0ff}.chat-window{background-image:linear-gradient(#141414 .1em,transparent .1em),linear-gradient(90deg,#141414 .1em,transparent .1em);background-size:12px 12px;border:4px solid #5ef0ff;flex:1;min-height:0;padding:24px;display:flex;flex-direction:column;gap:18px;overflow-y:auto}.chat-window::-webkit-scrollbar{width:8px}.chat-window::-webkit-scrollbar-thumb{background-color:#5ef0ff}.placeholder{color:#a5b4fc;margin:0}.bubble{display:flex;gap:12px;max-width:80%}.bubble.user{align-self:flex-start}.bubble.assistant{align-self:flex-end;flex-direction:row-reverse}.avatar{width:40px;height:40px;border-radius:0;border:3px solid #111;background-color:#ff5c8d;display:flex;align-items:center;justify-content:center;font-weight:600;color:#111}.bubble.assistant .avatar{background-color:#5ef0ff}.bubble-content{background-color:#1d1d2f;border:3px solid #5ef0ff;border-radius:0;padding:10px 14px;color:#f8f6df;box-shadow:4px 4px #111}.bubble.user .bubble-content{border-color:#ff5c8d}.bubble.assistant .bubble-content{border-color:#5ef0ff}.bubble-meta{font-size:12px;color:#ffdd57;margin-bottom:4px;letter-spacing:.08em}.typing .bubble-content{background-color:#10101c}.typing-dots{display:flex;gap:6px;margin-bottom:4px}.typing-dots span{width:10px;height:10px;border-radius:0;background-color:#5ef0ff;animation:flicker 1s infinite steps(2)}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes flicker{0%{opacity:.5}to{opacity:1}}.input-bar{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:10px;align-items:flex-end}.input-bar textarea{border-radius:0;border:3px solid #5ef0ff;padding:12px;font-size:16px;background-color:#050505;color:#f8f6df;min-height:110px;resize:vertical;box-shadow:inset 4px 4px #111}.emoji-bar{display:grid;grid-template-columns:repeat(auto-fill,minmax(32px,1fr));gap:6px;max-height:150px;overflow-y:auto;padding:4px;border:2px solid #111;background-color:#0b0b15}.emoji-bar button{padding:6px;font-size:18px;box-shadow:2px 2px #111}.input-bar>button{grid-column:span 2;justify-self:flex-end}.completion-banner{margin:16px auto 0;padding:18px;border:3px solid #ffdd57;background-color:#111;box-shadow:6px 6px #111;display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center}.completion-banner p{margin:0;color:#ffdd57;letter-spacing:.08em}.persona-panel{background-color:#0f0f0fd9;border:4px solid #5ef0ff;padding:clamp(14px,2vw,20px);box-shadow:0 10px #111;display:flex;flex-direction:column;gap:14px;min-height:50vh;font-family:PingFang SC,Microsoft YaHei,Noto Sans SC,sans-serif}.persona-panel h3,.tone{margin:0}.instructions{margin:0;line-height:1.6}.scenario-hint button{margin-top:8px}.scenario-cards{background-color:#111;padding:16px;border:3px solid #ff5c8d;border-radius:0;margin-top:12px;max-height:260px;overflow:auto}.scenario-cards ul{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-direction:column;gap:8px}.scenario-cards li{font-size:14px;color:#e2e8f0}.modal{position:fixed;inset:0;background-color:#050505d9;display:flex;align-items:center;justify-content:center;padding:24px;z-index:20}.persona-card{background:#fff7d6;color:#050505;border:4px solid #050505;border-radius:0;padding:32px;width:min(420px,100%);box-shadow:12px 12px #111;text-align:left;font-family:PingFang SC,Microsoft YaHei,Noto Sans SC,sans-serif}.persona-card .tone{color:#111;margin-top:12px}.persona-card .instructions{color:#111;margin:16px 0 24px;line-height:1.6}.persona-card button{width:100%;margin-top:16px}.persona-example{margin-top:12px;color:#6b7280;font-size:14px;line-height:1.5}.persona-example hr{border:none;border-top:1px dashed rgba(0,0,0,.3);margin-bottom:8px}@media(max-width:1024px){.chat-layout{grid-template-columns:1fr}.persona-panel{min-height:auto}.input-bar{grid-template-columns:1fr}.input-bar>button{grid-column:span 1;justify-self:stretch}}@media(max-width:600px){.top-bar{flex-direction:column;align-items:flex-start}.chat-app{padding:16px 10px 36px}button{font-size:10px;padding:8px 14px}.emoji-bar{grid-template-columns:repeat(6,minmax(32px,1fr))}}