:root{--ink: #171321;--muted: #686071;--line: rgba(180, 89, 35, .2);--accent: #ff7117;--magenta: #b31667;--blue: #2d6cdf;--paper: #fffdf9;--bg: #fffaf4;--radius: 12px;--shadow: 0 4px 16px rgba(79, 42, 61, .08);--font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:var(--bg);font-family:var(--font);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}a{color:inherit}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px clamp(16px,4vw,48px);border-bottom:1px solid var(--line);background:#fff6e7d1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.15rem}.brand-mark{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:var(--accent);background:#ff71171f}.app-main{flex:1;display:flex;gap:24px;padding:24px;max-width:1280px;margin:0 auto;width:100%}.prompt-panel{flex:0 0 380px;max-width:480px;display:flex;flex-direction:column;gap:16px}.preview-panel{flex:1;min-width:0;display:flex;flex-direction:column}.prompt-input{display:flex;flex-direction:column;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.prompt-input textarea{width:100%;min-height:140px;padding:12px;border:1px solid var(--line);border-radius:8px;background:#fff;resize:vertical;font-size:.95rem;line-height:1.5;color:var(--ink)}.prompt-input textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #ff711733}.prompt-input textarea:disabled{opacity:.6;cursor:not-allowed}.error-message{color:#d32f2f;font-size:.875rem;margin:0}.prompt-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.hint{color:var(--muted);font-size:.8rem}.prompt-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 20px;border:0;border-radius:8px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--magenta));font-weight:700;cursor:pointer;transition:opacity .2s}.prompt-actions button:hover{opacity:.9}.prompt-actions button:disabled{opacity:.5;cursor:not-allowed}.export-button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 16px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);font-weight:600;cursor:pointer;transition:background .2s}.export-button:hover{background:#f0eae0}.export-button:disabled{opacity:.5;cursor:not-allowed}.preview-pane{flex:1;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--paper);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center}.preview-pane.placeholder,.preview-pane.loading,.preview-pane.error{flex-direction:column;gap:8px;padding:48px 24px;text-align:center;color:var(--muted)}.preview-pane .sp-wrapper{width:100%;height:100%;min-height:500px}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}@media (max-width: 800px){.app-main{flex-direction:column;padding:16px}.prompt-panel{flex:1;max-width:100%}}