:root{--ink:#15233a;--muted:#718096;--line:#e5eaf1;--paper:#f4f7fb;--white:#fff;--blue:#365ee9;--pale:#edf2ff;--teal:#16866e;--red:#ca4a54;--amber:#b67817;--shadow:0 10px 28px #1f37620a}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px Segoe UI,Arial,sans-serif}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(calc((100vw - 1180px)/2),30px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{height:38px;width:38px;background:#172944;color:#fff;border-radius:11px;display:grid;place-items:center;font-size:12px;font-weight:800;letter-spacing:-.5px}.brand strong,.brand small{display:block}.brand strong{font-size:14px}.brand small{font-size:11px;color:var(--muted);margin-top:3px}.privacy{font-size:12px;color:#65758b}.green-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#34ab7f;margin-right:8px}main{max-width:1180px;margin:0 auto;padding:34px 24px 22px}.hero{display:flex;align-items:center;justify-content:space-between;margin:8px 0 24px}.eyebrow{font-size:10px;letter-spacing:1.4px;font-weight:800;color:#8190a5}.hero h1{font-size:29px;margin:8px 0 6px;letter-spacing:-1.2px}.hero p,.controls p{margin:0;color:var(--muted);font-size:13px}.button{border:0;border-radius:10px;padding:11px 15px;font:700 12px Segoe UI,Arial,sans-serif;cursor:pointer;transition:.15s}.button:disabled{opacity:.45;cursor:not-allowed}.primary{background:var(--blue);color:#fff;box-shadow:0 5px 13px #365ee92a}.primary:hover{background:#244bd3}.icon{font-size:15px;margin-right:5px}.secondary{background:var(--pale);color:var(--blue)}.secondary:hover{background:#e0e8ff}.ghost{background:none;color:var(--blue);padding:8px}.card{background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}.connection{min-height:72px;display:flex;align-items:center;gap:14px;padding:14px 18px;margin-bottom:18px}.state-icon{height:38px;width:38px;border-radius:12px;background:#f0f3f8;color:#8290a5;display:grid;place-items:center;font-size:20px}.connection strong,.connection span:not(.status-chip){display:block}.connection strong{font-size:12px}.connection div:nth-child(2) span{font-size:11px;color:var(--muted);margin-top:4px}.status-chip{margin-left:auto;padding:6px 9px;border-radius:20px;font-size:9px!important;font-weight:800;letter-spacing:.6px;white-space:nowrap}.muted{background:#f0f2f6;color:#77869a}.ok{background:#e9f7f2;color:var(--teal)}.warn{background:#fff5e6;color:var(--amber)}.bad{background:#fff0ef;color:var(--red)}.steps{display:grid;grid-template-columns:1fr 1fr;gap:16px}.step-card{padding:19px;min-width:0}.step-head{display:flex;align-items:center;gap:12px;margin-bottom:17px}.step-number{height:30px;width:30px;background:#f0f3f8;color:#8592a6;border-radius:9px;display:grid;place-items:center;font-weight:800;font-size:10px}.step-head h2,.controls h2,.audit h2{font-size:15px;margin:0 0 3px;letter-spacing:-.3px}.step-head p{font-size:11px;color:var(--muted);margin:0}.dropzone{height:124px;border:1px dashed #cbd5e3;border-radius:12px;background:#fafcff;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;gap:4px;position:relative}.dropzone:hover,.dropzone.drag{border-color:var(--blue);background:#f5f7ff}.dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.upload-icon{width:28px;height:28px;border-radius:9px;background:#eef2ff;color:var(--blue);display:grid;place-items:center;font-weight:800}.dropzone strong{font-size:11px}.dropzone small,.dropzone em{font-size:10px;color:var(--muted);font-style:normal}.dropzone em{color:var(--teal);font-weight:700}.select-row{display:flex;align-items:center;gap:9px;margin-top:12px}.select-row label{font-size:10px;color:var(--muted);white-space:nowrap}.select-row select{min-width:0;flex:1}.select-row button{white-space:nowrap}select,input[type=url],input[type=number]{height:35px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:0 10px;color:var(--ink);font:11px Segoe UI,Arial,sans-serif;outline:0}select:focus,input:focus{border-color:#9babf3;box-shadow:0 0 0 3px #365ee910}.input-action{display:flex;gap:8px}.input-action input{flex:1;min-width:0}.preview-mini{margin-top:13px;border:1px solid #edf0f5;border-radius:10px;min-height:74px;max-height:210px;overflow:auto}.empty{display:block;padding:25px;text-align:center;color:#98a4b5;font-size:10px}.wide{grid-column:1 / -1}.wide .step-head{margin-bottom:13px}.push{margin-left:auto}.filter-note{display:flex;align-items:flex-start;gap:10px;background:#f7f9fc;border-radius:10px;padding:11px 13px;margin:0 0 12px}.filter-note>span{width:18px;height:18px;border-radius:50%;background:#e8edff;color:var(--blue);font-weight:800;font-size:11px;display:grid;place-items:center;flex:none}.filter-note strong,.filter-note small{display:block}.filter-note strong{font-size:10px}.filter-note small{font-size:10px;color:var(--muted);margin-top:4px;line-height:1.5}.report-options{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.table-choice{border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 10px;color:#4c5b70;font:10px Segoe UI,Arial,sans-serif;cursor:pointer;text-align:left}.table-choice.active{border-color:#9babf3;background:#f4f6ff;color:var(--blue)}.table-choice small{display:block;color:#91a0b3;margin-top:3px;font-size:9px}.mini-table{border-collapse:collapse;width:100%;font-size:10px;white-space:nowrap}.mini-table th{position:sticky;top:0;background:#f5f7fb;color:#637087;text-align:left;font-size:9px}.mini-table th,.mini-table td{border-bottom:1px solid #eef1f5;padding:7px 9px}.mini-table tr:last-child td{border-bottom:0}.controls{margin-top:16px;padding:20px;display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;align-items:center}.controls h2{margin:7px 0}.controls p{font-size:11px;line-height:1.55;max-width:330px}.rule-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rule{padding:10px 11px;background:#f8fafd;border:1px solid #edf0f5;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px}.rule strong,.rule small{display:block}.rule strong{font-size:10px}.rule small{font-size:9px;color:var(--muted);margin-top:3px}.rule input[type=checkbox]{accent-color:var(--blue);width:15px;height:15px}.unit-input{display:flex;align-items:center;gap:4px}.unit-input input{width:51px;height:30px;text-align:right;padding:0 5px}.unit-input i{font-style:normal;color:var(--muted);font-size:10px}.audit{margin-top:16px;padding:20px}.audit-head{display:flex;align-items:center;justify-content:space-between}.audit h2{margin:6px 0 0}.empty-state{min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);gap:6px;text-align:center}.empty-state>span{font-size:25px;color:#9ca9ba}.empty-state strong{font-size:11px;color:#617087}.empty-state small{font-size:10px}.audit-results{margin-top:14px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.metric{border:1px solid var(--line);border-radius:10px;padding:12px}.metric small{display:block;color:var(--muted);font-size:9px}.metric strong{display:block;font-size:14px;margin-top:6px}.metric em{display:block;font-style:normal;font-size:9px;margin-top:4px}.positive{color:var(--teal)}.negative{color:var(--red)}.alert-list{margin:12px 0 0;padding:0;list-style:none}.alert-list li{padding:9px 11px;border-radius:8px;background:#fff8ed;color:#916315;font-size:10px;margin-top:6px}.alert-list li.error{background:#fff2f1;color:#a33d45}.alert-list li.pass{background:#edf8f3;color:#267a61}footer{display:flex;justify-content:space-between;padding:18px 2px;color:#93a0b2;font-size:9px}#toast{position:fixed;right:22px;bottom:22px;z-index:10;max-width:440px;background:#1d2d47;color:#fff;padding:12px 16px;border-radius:10px;box-shadow:0 10px 30px #15233a33;font-size:11px;opacity:0;transform:translateY(12px);transition:.2s;pointer-events:none}#toast.show{opacity:1;transform:translateY(0)}
@media(max-width:800px){main{padding:24px 14px}.steps{grid-template-columns:1fr}.wide{grid-column:auto}.controls{grid-template-columns:1fr;gap:16px}.hero h1{font-size:22px}.hero{align-items:flex-start;gap:12px}.privacy{display:none}.rule-grid{grid-template-columns:1fr}.hero .button{padding:10px;font-size:10px}.metric-grid{grid-template-columns:1fr}footer{gap:10px;flex-direction:column}}
.full-action{width:100%;margin-top:10px}.proposal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;background:#f7f9fd;border:1px solid var(--line);border-radius:10px}.proposal-head strong,.proposal-head small{display:block}.proposal-head strong{font-size:11px}.proposal-head small{font-size:9px;color:var(--muted);margin-top:4px}.proposal-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.partial-note{font-size:10px;color:var(--muted);margin:8px 2px}.table-wrap{max-height:340px;overflow:auto;border:1px solid #edf0f5;border-radius:9px;margin-top:10px}.result-note{padding:10px 12px;border-radius:8px;margin-bottom:10px;font-size:10px}.result-note.success{background:#edf8f3;color:#267a61}.result-note.failure{background:#fff2f1;color:#a33d45}
.browser-panel{padding:14px;margin-bottom:18px}.browser-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:10px}.browser-toolbar>div{min-width:180px;margin-right:auto}.browser-toolbar strong,.browser-toolbar small{display:block}.browser-toolbar strong{font-size:12px}.browser-toolbar small{font-size:10px;color:var(--muted);margin-top:3px}.browser-toolbar select{max-width:260px;min-width:145px}.browser-toolbar input{height:35px;border:1px solid var(--line);border-radius:8px;padding:0 10px;min-width:190px;max-width:280px;font:11px Segoe UI,Arial,sans-serif}.browser-viewport{position:relative;width:100%;height:min(70vh,700px);min-height:340px;overflow:auto;background:#eef2f8;border:1px solid #dfe5ef;border-radius:10px;display:flex;align-items:flex-start;justify-content:center;outline:0;cursor:default}.browser-viewport:focus{box-shadow:0 0 0 2px #365ee955}.browser-viewport img{display:block;width:100%;height:auto;user-select:none}.browser-empty{position:absolute;inset:0;display:grid;place-items:center;color:#8290a5;font-size:12px;text-align:center;padding:30px}.browser-hint{font-size:9px;color:var(--muted);margin:8px 2px 0}.relation-table{margin-top:12px}.relation-table td:last-child{font-weight:700}.relation-match{color:var(--teal)}.relation-missing{color:var(--red)}.relation-ambiguous{color:var(--amber)}
@media(max-width:800px){.browser-toolbar{flex-wrap:wrap}.browser-toolbar>div{width:100%}.browser-toolbar select,.browser-toolbar input{flex:1;min-width:0;max-width:none}.browser-viewport{height:65vh;min-height:300px}}
.preview-mini#plan-preview,.preview-mini#report-preview{max-height:360px}.preview-note{display:block;padding:7px 9px;color:var(--muted);font-size:9px;background:#f8fafd}
.feedback{margin-top:16px;padding:20px;display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}.feedback-copy h2{font-size:15px;margin:7px 0}.feedback-copy p{font-size:11px;line-height:1.55;color:var(--muted);max-width:330px;margin:0}.feedback-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.feedback-form label{display:grid;gap:6px;color:#65758b;font-size:10px}.feedback-form label span,.feedback-submit small{color:#98a4b5}.feedback-form select,.feedback-form input,.feedback-form textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;padding:9px 10px;color:var(--ink);font:11px Segoe UI,Arial,sans-serif;outline:0}.feedback-form select,.feedback-form input{height:36px}.feedback-form textarea{resize:vertical;min-height:82px}.feedback-form select:focus,.feedback-form input:focus,.feedback-form textarea:focus{border-color:#9babf3;box-shadow:0 0 0 3px #365ee910}.feedback-message{grid-column:1/-1}.feedback-submit{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px}.feedback-submit small{font-size:9px;line-height:1.4}.feedback-submit .button{white-space:nowrap}
@media(max-width:800px){.feedback{grid-template-columns:1fr;gap:16px}.feedback-form{grid-template-columns:1fr}.feedback-message,.feedback-submit{grid-column:auto}}
/* Header identity and theme control */
.brand-mark{width:46px;height:46px;display:block;object-fit:cover;object-position:center 34%;border-radius:50%;border:2px solid #df3040;background:#100e12;box-shadow:0 0 0 3px #df30401a}
.topbar-actions{display:flex;align-items:center;gap:18px}
.theme-toggle{white-space:nowrap;display:inline-flex;align-items:center;gap:7px;padding:9px 12px}
html[data-theme="dark"]{color-scheme:dark;--ink:#f1f2f6;--muted:#a1a5b2;--line:#30313a;--paper:#111116;--white:#1b1b22;--blue:#8a9cff;--pale:#272838;--teal:#63d0ad;--red:#ff7c87;--amber:#f0c16d;--shadow:0 12px 32px #0007}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink)}
html[data-theme="dark"] .topbar,html[data-theme="dark"] .card{background:#1b1b22;border-color:var(--line)}
html[data-theme="dark"] .privacy{color:#b0b4c0}
html[data-theme="dark"] .eyebrow,html[data-theme="dark"] .feedback-form label{color:#a1a5b2}
html[data-theme="dark"] .secondary{background:#2b2d40;color:#b4bdff}
html[data-theme="dark"] .secondary:hover{background:#373a52}
html[data-theme="dark"] .state-icon,html[data-theme="dark"] .step-number,html[data-theme="dark"] .muted{background:#2c2d35;color:#a3a8b6}
html[data-theme="dark"] .ok{background:#18382f;color:#63d0ad}
html[data-theme="dark"] .warn{background:#3a3020;color:#f0c16d}
html[data-theme="dark"] .bad{background:#3b2429;color:#ff929b}
html[data-theme="dark"] .dropzone{background:#17171d;border-color:#454653}
html[data-theme="dark"] .dropzone:hover,html[data-theme="dark"] .dropzone.drag{background:#202133;border-color:#8a9cff}
html[data-theme="dark"] .upload-icon,html[data-theme="dark"] .filter-note>span{background:#2b2d40;color:#b4bdff}
html[data-theme="dark"] select,html[data-theme="dark"] input[type=url],html[data-theme="dark"] input[type=number],html[data-theme="dark"] .feedback-form select,html[data-theme="dark"] .feedback-form input,html[data-theme="dark"] .feedback-form textarea,html[data-theme="dark"] .browser-toolbar input{background:#15151b;color:var(--ink);border-color:#3b3c47}
html[data-theme="dark"] .preview-mini,html[data-theme="dark"] .table-wrap,html[data-theme="dark"] .mini-table th,html[data-theme="dark"] .table-choice,html[data-theme="dark"] .proposal-head,html[data-theme="dark"] .preview-note{background:#17171e;color:#d9dbe3;border-color:#30313a}
html[data-theme="dark"] .mini-table td,html[data-theme="dark"] .mini-table th{border-color:#30313a}
html[data-theme="dark"] .filter-note,html[data-theme="dark"] .rule{background:#202027;border-color:#30313a}
html[data-theme="dark"] .table-choice.active{background:#282a3a;color:#c2caff;border-color:#727fda}
html[data-theme="dark"] .browser-viewport{background:#111116;border-color:#383943}
html[data-theme="dark"] .alert-list li{background:#342b1d;color:#f0c16d}
html[data-theme="dark"] .alert-list li.error,html[data-theme="dark"] .result-note.failure{background:#382326;color:#ff929b}
html[data-theme="dark"] .alert-list li.pass,html[data-theme="dark"] .result-note.success{background:#18382f;color:#7ce0be}
html[data-theme="dark"] .empty-state strong{color:#c9ccd5}
html[data-theme="dark"] .positive{color:#63d0ad}
html[data-theme="dark"] .negative{color:#ff7c87}
html[data-theme="dark"] #toast{background:#30313a}
@media(max-width:800px){.topbar{padding:0 14px}.topbar-actions{gap:0}.topbar-actions .privacy{display:none}.theme-toggle{font-size:10px;padding:8px 9px}}
.feedback[hidden]{display:none!important}
.feedback[hidden],.feedback-form[hidden]{display:none!important}.admin-panel-actions{display:flex;gap:8px}.admin-login-form{margin-top:12px}
#browser-empty[hidden],#browser-image[hidden]{display:none!important}

.feedback-attachments{grid-column:1/-1}.feedback-attachments input[type=file]{height:auto;padding:8px;background:var(--paper);cursor:pointer}.feedback-file-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.feedback-file-download{border:1px solid var(--line);border-radius:7px;padding:7px 9px;font-size:10px}.feedback-file-download small{color:var(--muted);font-weight:400}.feedback-file-download:disabled{opacity:.55;cursor:wait}


.rule-status{display:inline-flex;align-items:center;white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:5px 8px;color:var(--muted);background:var(--white);font-size:8px;font-weight:800;letter-spacing:.45px}.rule input[type=checkbox][hidden]{display:none!important}html[data-theme=dark] .rule-status{background:#15151b;border-color:#3b3c47;color:#c2c4cd}

.plan-status-counts{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;color:var(--muted);font-size:12px}.plan-status-counts span{padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
