@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&family=Space+Grotesk:wght@400;500;600&display=swap";:root{--bg:#f7f4ef;--panel:#fff;--panel-2:#f3f4f2;--text:#1c2431;--muted:#5b6573;--border:#ded9cf;--accent:#0ea5a4;--accent-strong:#0b7b7a;--danger:#c0392b;--shadow:0 12px 28px #12182114;--accent-shadow:0 10px 24px #0ea5a440;--sans:"Space Grotesk", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;font-family:var(--sans);color:var(--text);background:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{background:radial-gradient(circle at top left, #e7f5f3, transparent 45%), radial-gradient(circle at bottom right, #f7ecd9, transparent 45%), var(--bg);min-height:100vh;margin:0}#root{min-height:100vh;padding:48px 20px 64px}h1,label{font-weight:600}p{margin:0}code{font-family:var(--mono)}.app{flex-direction:column;gap:24px;max-width:980px;margin:0 auto;display:flex}.header{text-align:left}.header h1{letter-spacing:-.02em;margin:0;font-size:40px}.header p{color:var(--muted);margin:8px 0 0}.controls{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;padding:20px}.controls label{color:var(--text);font-weight:600}.field{flex-direction:column;gap:6px;margin-bottom:12px;display:flex}.row{flex-wrap:wrap;align-items:center;gap:12px;margin-top:8px;display:flex}input,select{border:1px solid var(--border);min-width:220px;font-size:16px;font-family:var(--sans);background:var(--panel-2);color:var(--text);border-radius:12px;flex:1;padding:12px 14px}input:disabled,select:disabled{opacity:.7}button{cursor:pointer;border:1px solid #0000;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:600;transition:transform .15s,box-shadow .15s}button:active{transform:translateY(1px)}button.primary{background:var(--accent);color:#fff;box-shadow:var(--accent-shadow)}button.secondary{border-color:var(--accent);color:var(--accent-strong);background:0 0}.status{color:var(--muted);font-size:14px}.error{color:var(--danger);font-weight:600}.video-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;display:grid}.video-card{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:8px;padding:12px;display:flex}.video-card span{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);font-size:12px}video{object-fit:cover;background:#0f1114;border-radius:12px;width:100%;height:260px}@media (width<=640px){.header h1{font-size:30px}video{height:220px}}