@import "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&display=swap";:root{--bg:radial-gradient(circle at top, #f7f1e8 0%, #ece5d9 38%, #e6dece 100%);--surface:#fffaf2;--input-bg:#fffefb;--text:#2f2b26;--muted:#6e6458;--border:#d8ccb9;--code-bg:#efe5d7;--action:#cf5530;--shadow:#4a301926 0 10px 30px}*{box-sizing:border-box}body{color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;margin:0;font-family:Nunito,Trebuchet MS,sans-serif}.app-shell{place-items:center;min-height:100vh;padding:24px;display:grid}.card{background:var(--surface);border:1px solid var(--border);width:min(740px,100%);box-shadow:var(--shadow);border-radius:18px;padding:28px}h1,h2{margin:0}h1{font-size:clamp(1.5rem,2.6vw,2rem)}h2{font-size:clamp(1.25rem,2.2vw,1.7rem)}.subtitle{color:var(--muted);margin:10px 0 0}.stack{gap:16px;margin-top:24px;display:grid}.list{gap:14px;max-height:360px;padding-right:6px;display:grid;overflow:auto}.field{gap:8px;display:grid}.field span{font-size:.95rem;font-weight:600}input,select,button{font:inherit}input,select{border:1px solid var(--border);background:var(--input-bg);box-sizing:border-box;border-radius:10px;width:100%;padding:10px 12px}button{background:var(--action);color:#fff;cursor:pointer;border:0;border-radius:10px;padding:12px 16px;font-weight:700}button:hover{opacity:.9}button:disabled{cursor:not-allowed;opacity:.5}.buttons-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.editor-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}.editor-head{gap:8px;display:grid}.preview-list{gap:6px;max-height:240px;margin:0;padding-left:18px;display:grid;overflow:auto}.editor-list{max-height:330px}.editor-row{grid-template-columns:1fr 1fr 1fr auto;align-items:center;gap:8px;display:grid}.secondary{color:var(--text);border:1px solid var(--border);background:0 0}.danger{color:#fff;background:#ab2b39}@media (width<=800px){.buttons-row,.editor-buttons,.editor-row{grid-template-columns:1fr}}.progress,.hint{color:var(--muted);margin:0}.feedback-ok,.feedback-wrong{margin:0;font-weight:700}.feedback-ok{color:#0c7b59}.feedback-wrong{color:#ab2b39}code{background:var(--code-bg);border-radius:6px;padding:2px 6px}.results{gap:12px;margin:0;padding:0;list-style:none;display:grid}.results li{border:1px solid var(--border);background:var(--input-bg);border-radius:12px;gap:4px;padding:12px;display:grid}.results li.ok{border-color:#0c7b5980}.results li.wrong{border-color:#b0274080}
