:root{--bg: #f4f5f2;--surface: #ffffff;--text: #1f2a24;--muted: #66726b;--border: #d9ded8;--accent: #1f7a4d;--accent-soft: #e3f2ea;--accent-text: #ffffff;--warn-bg: #fff4d6;--warn-text: #7a5600;--radius: 12px;color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #141916;--surface: #1d2420;--text: #e8eee9;--muted: #9aa8a0;--border: #33403a;--accent: #4cc38a;--accent-soft: #1f3a2d;--accent-text: #08150e;--warn-bg: #3a3012;--warn-text: #f1d58a}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}.app{max-width:1200px;margin:0 auto;padding:24px 16px 40px}.app-header h1{margin:0 0 4px;font-size:1.7rem}.app-header p{margin:0 0 20px;color:var(--muted)}.tabs{display:inline-flex;gap:4px;padding:4px;margin-bottom:20px;background:var(--surface);border:1px solid var(--border);border-radius:999px}.tabs button{border:0;background:transparent;color:var(--muted);padding:8px 18px;border-radius:999px;font:inherit;cursor:pointer}.tabs button.active{background:var(--accent);color:var(--accent-text)}.layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;align-items:start}.column{display:flex;flex-direction:column;gap:20px}.sticky{position:sticky;top:16px}@media(max-width:880px){.layout{grid-template-columns:1fr}.sticky{position:static}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.card h2{margin:0 0 14px;font-size:1.1rem}.subhead{margin:18px 0 10px;font-size:1rem;color:var(--accent)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.span-2{grid-column:span 2}@media(max-width:520px){.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}}.field{display:flex;flex-direction:column;gap:4px}.field label{font-size:.85rem;font-weight:600}.opt{font-weight:400;color:var(--muted)}input,select,textarea{width:100%;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:9px 10px}textarea{resize:vertical}input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.template-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text);font:inherit;cursor:pointer}.template-card:hover{border-color:var(--accent)}.template-card.active{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent)}.template-card .icon{font-size:1.3rem}.template-card .title{font-weight:600;font-size:.9rem}.template-card .desc{font-size:.78rem;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}.btn{display:inline-block;padding:9px 14px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font:inherit;text-decoration:none;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text);font-weight:600}.btn.small{padding:5px 10px;font-size:.85rem}.btn.disabled,.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.link{border:0;background:none;color:var(--accent);font:inherit;font-size:.85rem;text-decoration:underline;cursor:pointer}.preview-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.preview .field+.field{margin-top:10px}.preview textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;line-height:1.45}.step+.step{margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}.step h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:.95rem}.badge{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--accent-text);font-size:.8rem}.prompt-preview{white-space:pre-wrap;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px;font-size:.82rem}details{margin-top:10px}summary{cursor:pointer;color:var(--accent);font-size:.9rem}.hint,.muted{margin:6px 0 0;font-size:.82rem;color:var(--muted)}.warn{margin:10px 0 0;padding:8px 10px;border-radius:8px;background:var(--warn-bg);color:var(--warn-text);font-size:.85rem}.toast{margin:8px 0 0;font-size:.85rem;color:var(--accent);font-weight:600}.actions.secondary{margin-top:8px}code{background:var(--bg);padding:1px 5px;border-radius:4px}.app-footer{margin-top:24px;font-size:.8rem;color:var(--muted)}
