:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--bg: #0b1020;--panel: #11192e;--panel-2: #0f172a;--line: #22304f;--text: #e5eefc;--muted: #8ea2c9;--accent: #5b8cff;--accent-2: #18315f;--good: #1e8f5a;--warn: #b17a00;--bad: #c44e4e}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(circle at top,#101936,var(--bg));color:var(--text)}a{color:inherit;text-decoration:none}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.page-center{min-height:100vh;display:grid;place-items:center}.app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.sidebar{background:#080c1aeb;border-right:1px solid var(--line);padding:20px;position:sticky;top:0;height:100vh}.brand{font-weight:700;font-size:18px;line-height:1.2;margin-bottom:20px}.nav{display:flex;flex-direction:column;gap:8px}.nav-link{padding:10px 12px;border-radius:10px;color:var(--muted);border:1px solid transparent}.nav-link.active,.nav-link:hover{background:#5b8cff26;color:var(--text);border-color:#5b8cff59}.main{min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#090d1c9e;position:sticky;top:0;z-index:10}.topbar-right{display:flex;gap:12px;align-items:center}.content{padding:24px}.stack{display:flex;flex-direction:column;gap:16px}.grid{display:grid;gap:16px}.cards,.tiny-cards{grid-template-columns:repeat(5,minmax(0,1fr))}.two-col{grid-template-columns:1.2fr .8fr;align-items:start}.preview-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.panel{background:linear-gradient(180deg,#11192ef2,#0c1222fa);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 14px 40px #0000002e}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.panel-head h2{margin:0;font-size:18px}.panel-actions{display:flex;gap:8px;flex-wrap:wrap}.metric{padding:16px;border:1px solid var(--line);border-radius:16px;background:#ffffff08}.metric.good{border-color:#1e8f5a73}.metric.bad{border-color:#c44e4e73}.metric-label{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.06em}.metric-value{font-size:26px;font-weight:700;margin-top:10px}.btn{border:1px solid transparent;border-radius:10px;padding:10px 14px;cursor:pointer;font-weight:600;color:var(--text);background:var(--accent)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:#ffffff0d;border-color:var(--line)}.btn-danger{background:#c44e4e29;border-color:#c44e4e66}.btn-ghost{background:transparent;border-color:transparent}.input{width:100%;background:#ffffff0a;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:10px 12px;outline:none}.input:focus{border-color:#5b8cffb3;box-shadow:0 0 0 3px #5b8cff21}.textarea{min-height:220px;resize:vertical}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.form-grid label{display:flex;flex-direction:column;gap:6px}.filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:10px;align-items:end;margin-bottom:14px}.row-actions{display:flex;gap:8px;flex-wrap:wrap}.space{justify-content:space-between}.table{width:100%;border-collapse:collapse;overflow:hidden}.table th,.table td{border-bottom:1px solid rgba(255,255,255,.06);padding:12px 10px;text-align:left;vertical-align:top}.table th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.table tr:hover td{background:#ffffff05}.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:#ffffff0d;border:1px solid var(--line);font-size:12px}.badge-good{background:#1e8f5a26;border-color:#1e8f5a59}.badge-warn{background:#b17a0026;border-color:#b17a0059}.badge-bad{background:#c44e4e26;border-color:#c44e4e59}.progress{height:12px;background:#ffffff12;border-radius:999px;overflow:hidden;border:1px solid var(--line)}.progress-bar{height:100%;background:linear-gradient(90deg,var(--accent),#75f0bf);width:0}.progress-row{display:flex;justify-content:space-between;margin-top:10px}.activity-feed{display:flex;flex-direction:column;gap:10px}.activity-item{padding:12px;border:1px solid var(--line);border-radius:12px;background:#ffffff08}.preview-box{white-space:pre-wrap;background:#00000038;padding:14px;border-radius:12px;border:1px solid var(--line)}.current-box{margin-top:12px;padding:14px;border-radius:14px;background:#ffffff08;border:1px solid var(--line)}.stepper{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:16px}.step{padding:10px;border:1px solid var(--line);border-radius:12px;color:var(--muted);text-align:center}.step.active{color:var(--text);border-color:#5b8cff99;background:#5b8cff1f}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(440px,100%);background:#11192ef5;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:12px;box-shadow:0 18px 60px #0000004d}.error{color:#ffb1b1;background:#c44e4e1f;border:1px solid rgba(196,78,78,.4);padding:10px 12px;border-radius:10px}.dropzone{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:20px;border:1px dashed var(--line);border-radius:16px;background:#ffffff08}.preview-image-wrap{margin-top:16px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#ffffff05}.preview-image{width:100%;display:block;object-fit:contain;min-height:320px;background:#000}.live-browser-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.live-browser-frame{margin-top:16px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#000;min-height:720px}.live-browser-canvas{width:100%;height:720px}.toast-stack{position:fixed;top:20px;right:20px;z-index:1000;display:flex;flex-direction:column;gap:10px;width:min(380px,calc(100vw - 40px))}.toast{position:relative;border-radius:14px;border:1px solid var(--line);padding:14px 42px 14px 14px;background:#11192efa;box-shadow:0 18px 50px #00000059}.toast-success{border-color:#1e8f5a80}.toast-error{border-color:#c44e4e8c}.toast-info{border-color:#5b8cff80}.toast-warning{border-color:#b17a008c}.toast-title{font-weight:700;margin-bottom:4px}.toast-message{color:var(--muted);font-size:14px;line-height:1.4}.toast-close{position:absolute;top:8px;right:8px;border:0;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}@media(max-width:1200px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.cards,.tiny-cards,.two-col,.form-grid,.filters,.stepper{grid-template-columns:1fr}}