:root{--bg-1: #0f172a;--bg-2: #1d3557;--panel: rgba(255, 255, 255, .92);--text: #0f172a;--muted: #475569;--accent: #ff6b35;--accent-2: #2a9d8f;--border: rgba(15, 23, 42, .16)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Space Grotesk,Trebuchet MS,sans-serif;color:var(--text);background:radial-gradient(circle at 15% 20%,rgba(255,107,53,.45),transparent 45%),radial-gradient(circle at 80% 10%,rgba(42,157,143,.35),transparent 40%),linear-gradient(130deg,var(--bg-1),var(--bg-2))}a{color:inherit}.page{max-width:1400px;margin:0 auto;padding:20px}.app-shell{display:grid;grid-template-columns:340px 1fr;gap:14px;min-height:calc(100vh - 40px)}.panel{background:var(--panel);border-radius:16px;border:1px solid var(--border);padding:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow-y:auto}.panel h1{margin:0 0 6px;font-size:1.35rem}.panel p{margin:0 0 10px;color:var(--muted)}.section{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.section h2{margin:0 0 10px;font-size:1rem}.controls-grid{display:grid;gap:8px}label{display:grid;gap:4px;font-size:.88rem}input,select,button{width:100%;padding:8px 10px;border-radius:10px;border:1px solid var(--border);background:#fff;color:inherit;font:inherit}input[type=color]{min-height:40px;padding:2px}button{background:linear-gradient(120deg,var(--accent),#f4a261);border:none;color:#fff;cursor:pointer;font-weight:700;transition:transform .12s ease}button:hover{transform:translateY(-1px)}button.secondary{background:linear-gradient(120deg,#2d6a4f,var(--accent-2))}.inline-3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.inline-2{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.note{margin-top:8px;font-size:.8rem;color:var(--muted)}.badge{display:inline-block;margin-top:6px;padding:4px 8px;border-radius:999px;background:#2a9d8f1f;color:#14532d;font-size:.8rem;font-weight:600}.status{margin-top:8px;font-size:.85rem;color:#1d4ed8;min-height:1.2em}.viewport-wrap{position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.2);box-shadow:0 20px 35px #0f172a61;background:#111827}.viewport{width:100%;height:100%;min-height:calc(100vh - 40px)}.drop-hint{position:absolute;left:14px;right:14px;top:14px;z-index:5;padding:10px 12px;border-radius:10px;border:1px dashed rgba(255,255,255,.8);color:#fff;background:#0f172a59;pointer-events:none;opacity:0;transition:opacity .14s ease;font-size:.85rem}.drop-hint.visible{opacity:1}table{width:100%;border-collapse:collapse;font-size:.84rem}th,td{border-bottom:1px solid var(--border);padding:6px;text-align:left}@media (max-width: 980px){.app-shell{grid-template-columns:1fr;grid-template-rows:auto minmax(420px,1fr)}.panel{max-height:45vh}.viewport{min-height:62vh}}