:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.director-panel{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;padding:20px;height:100%;display:flex;flex-direction:column;box-shadow:0 4px 6px #0000001a}.panel-title{color:#fff;margin:0 0 20px;font-size:1.5rem;font-weight:700}.prompt-form{display:flex;flex-direction:column;gap:15px;flex:1}.prompt-input{width:100%;padding:15px;border:2px solid rgba(255,255,255,.3);border-radius:8px;background:#ffffff1a;color:#fff;font-size:16px;resize:none;transition:all .3s ease;font-family:Segoe UI,system-ui,sans-serif}.prompt-input::placeholder{color:#ffffffb3}.prompt-input:focus{outline:none;border-color:#fff9;background:#fff3}.prompt-input:disabled{opacity:.6;cursor:not-allowed}.button-group{display:flex;gap:10px}.generate-btn,.reset-btn{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease}.generate-btn{flex:1;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 12px #0003}.generate-btn:disabled{opacity:.6;cursor:not-allowed}.reset-btn{background:#fff3;color:#fff;border:2px solid rgba(255,255,255,.3)}.reset-btn:hover:not(:disabled){background:#ffffff4d}.reset-btn:disabled{opacity:.5;cursor:not-allowed}.history{margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.2)}.history h3{color:#ffffffe6;font-size:.9rem;margin-bottom:10px}.history ul{list-style:none;padding:0;margin:0}.history li{color:#fffc;font-size:.85rem;padding:5px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history li:before{content:"→ ";color:#ffffff80}.live-canvas{background:linear-gradient(135deg,#fa709a,#fee140);border-radius:10px;padding:20px;height:100%;display:flex;flex-direction:column;box-shadow:0 4px 6px #0000001a}.live-canvas .panel-title{color:#fff;margin:0 0 20px;font-size:1.5rem;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.canvas-container{flex:1;display:flex;justify-content:center;align-items:center;background:#fffffff2;border-radius:8px;padding:20px;box-shadow:inset 0 2px 4px #0000001a}.game-canvas{background:#fff;border:2px solid #ddd;border-radius:4px;box-shadow:0 4px 8px #0000001a;max-width:100%;max-height:100%}.blueprint-panel{background:linear-gradient(135deg,#4facfe,#00f2fe);border-radius:10px;padding:20px;height:100%;display:flex;flex-direction:column;box-shadow:0 4px 6px #0000001a}.blueprint-panel .panel-title{color:#fff;margin:0 0 15px;font-size:1.5rem;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.explanation{background:#fffffff2;padding:10px 15px;border-radius:6px;margin-bottom:15px;color:#333;font-size:.9rem;box-shadow:0 2px 4px #0000001a}.blueprint-header{display:flex;align-items:center;justify-content:space-between}.blueprint-layout{display:flex;gap:12px;min-height:0;flex:1}.editor-container{flex:1;border-radius:8px;overflow:hidden;box-shadow:0 4px 8px #00000026;min-width:0}.ai-help-btn{background:#fffffff2;color:#0b74de;border:none;border-radius:6px;padding:8px 12px;cursor:pointer;font-weight:600;box-shadow:0 2px 4px #00000026}.ai-help-btn:hover{filter:brightness(.95)}.chat-panel{width:320px;display:flex;flex-direction:column;background:#fffffffa;border-radius:8px;box-shadow:0 4px 8px #00000026}.chat-messages{padding:12px;overflow-y:auto;flex:1}.chat-empty{color:#666;font-size:.9rem}.chat-msg{margin-bottom:12px}.chat-msg .chat-role{font-weight:700;font-size:.85rem;margin-bottom:4px}.chat-msg.user .chat-role,.chat-msg.assistant .chat-role{color:#000}.chat-msg .chat-content{color:#000;white-space:pre-wrap;line-height:1.35}.chat-input-row{display:flex;gap:8px;padding:10px;border-top:1px solid #eee}.chat-input{flex:1;padding:8px 10px;border:1px solid #ddd;border-radius:6px}.chat-send-btn{background:#0b74de;color:#fff;border:none;border-radius:6px;padding:8px 12px;font-weight:600;cursor:pointer}.chat-send-btn:disabled{opacity:.6;cursor:not-allowed}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}.app{display:flex;flex-direction:column;height:100vh;background:linear-gradient(135deg,#667eea,#764ba2)}.app-header{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:15px 30px;border-bottom:1px solid rgba(255,255,255,.2);color:#fff;text-align:center}.app-title{font-size:2rem;margin:0;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.app-tagline{font-size:.9rem;margin-top:5px;opacity:.9}.error-banner{background:#f44;color:#fff;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;animation:slideDown .3s ease}.error-banner button{background:transparent;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0 10px;opacity:.8;transition:opacity .2s}.error-banner button:hover{opacity:1}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.panels-container{flex:1;display:grid;grid-template-columns:1fr 2fr 1.5fr;gap:20px;padding:20px;overflow:hidden}.panel{min-height:0;overflow:auto}@media (max-width: 1200px){.panels-container{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.panel.director{grid-row:1}.panel.canvas{grid-row:2}.panel.blueprint{grid-row:3}}@media (max-width: 768px){.app-title{font-size:1.5rem}.panels-container{padding:10px;gap:10px}}
