:root{--brand: #1a5dad;--brand-2: #4489da;--brand-deep: #154c8e;--brand-darker: #10396a;--brand-hover: #2175d9;--brand-shadow: #0b294b;--brand-shadow-hover: #0e325d;--brand-light: #c4daf3;--brand-wash: #eaf1fb;--slate: #455a64;--slate-deep: #263238;--cta: #ff9b00;--cta-deep: #e08600;--spark: #fdf500;--bg: #ffffff;--bg-2: #f5f5f5;--bg-3: #eaeaea;--ink: #222222;--ink-strong: #111111;--ink-soft: #5a6b7b;--ink-faint: #8a97a3;--line: #e2e6ea;--line-strong: #cfd6dd;--paper: var(--bg);--paper-2: #eef2f7;--surface: var(--bg);--accent: #1a5dad;--accent-deep: #154c8e;--accent-wash: #eaf1fb;--ok: #1f7a44;--ok-wash: #e3f0e6;--warn: #9a6708;--warn-wash: #f5ead2;--err: #c12f23;--err-wash: #f8e1de;--err-deep: #7a201a;--del-fg: #a8362b;--del-bg: #f6ddd7;--ins-fg: #1c7340;--ins-bg: #dcefe1;--radius: 3px;--radius-card: 5px;--radius-pill: 30px;--sans: "Source Sans Pro", system-ui, -apple-system, sans-serif;--body: "Open Sans", system-ui, -apple-system, sans-serif;--mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--shadow: 0 1px 2px rgba(16, 57, 106, .05), 0 4px 16px rgba(16, 57, 106, .08);--shadow-lg: 0 10px 40px rgba(16, 57, 106, .14);--shadow-card: 0 0 0 1px rgba(16, 57, 106, .04), 0 6px 20px rgba(16, 57, 106, .08);--shadow-btn: 0 2px 0 0 var(--brand-shadow);--shadow-btn-hover: 0 2px 5px 0 var(--brand-shadow-hover)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--body);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#root{position:relative;z-index:1}a{color:inherit;text-decoration:none}h1,h2,h3{margin:0;font-family:var(--sans);font-weight:600;letter-spacing:0;line-height:1.2;color:var(--ink)}.eyebrow{display:inline-block;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--brand)}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:0;padding:10px 20px;border-radius:var(--radius);border:2px solid var(--brand);background:var(--brand);color:#fff;cursor:pointer;box-shadow:var(--shadow-btn);transition:background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .05s ease}.btn:hover{background:var(--brand-hover);border-color:var(--brand-hover);box-shadow:var(--shadow-btn-hover)}.btn:active{transform:translateY(1px);box-shadow:0 1px 0 0 var(--brand-shadow)}.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-accent{background:var(--brand);border-color:var(--brand)}.btn-accent:hover{background:var(--brand-hover);border-color:var(--brand-hover)}.btn-cta{background:var(--cta);border-color:var(--cta);color:var(--ink);box-shadow:0 2px 0 0 var(--cta-deep)}.btn-cta:hover{background:#ffac26;border-color:#ffac26;box-shadow:0 2px 6px #e0860080}.btn-ghost{background:transparent;color:var(--brand);border-color:var(--brand);box-shadow:none}.btn-ghost:hover{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:none}.field{display:flex;flex-direction:column;gap:6px}.field>label{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:0;color:var(--ink-soft)}.input,.select{font-family:var(--body);font-size:14px;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius);padding:11px 13px;width:100%;transition:border-color .15s ease,box-shadow .15s ease}.input:focus,.select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--accent-wash)}.input::placeholder{color:var(--ink-faint)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.card-pad{padding:24px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);box-shadow:0 1px 12px #10396a0f}.topbar:after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:120px;background:var(--brand)}.brand{display:flex;align-items:center;gap:11px}.brand-emblem{flex:none;display:block}.brand-name{font-family:var(--sans);font-weight:700;font-size:20px;letter-spacing:.06em;color:var(--brand)}.brand-divider{width:1px;height:20px;background:var(--line-strong)}.brand-sub{font-family:var(--sans);font-size:12.5px;letter-spacing:.01em;color:var(--ink-soft)}.topbar-right{display:flex;align-items:center;gap:16px}.user-email{font-family:var(--mono);font-size:12px;color:var(--ink-soft)}.main{max-width:1170px;margin:0 auto;padding:40px 28px 80px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid var(--line)}.page-head h1{font-size:32px;font-weight:300;margin-top:6px}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden}.kpi{background:var(--surface);padding:16px 18px}.kpi-accent{box-shadow:inset 3px 0 0 var(--brand)}.kpi-l{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:0;color:var(--ink-soft);margin-bottom:8px}.kpi-v{font-family:var(--mono);font-size:26px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1;color:var(--brand-darker)}.kpi-v small{font-size:14px;color:var(--ink-faint)}.badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:0;padding:4px 11px;border-radius:var(--radius-pill);border:1px solid transparent}.badge-queued{background:var(--paper-2);color:var(--ink-soft);border-color:var(--line-strong)}.badge-running{background:var(--brand-wash);color:var(--brand);border-color:#b9d2f0}.badge-done{background:var(--ok-wash);color:var(--ok);border-color:#a9d4b8}.badge-error{background:var(--err-wash);color:var(--err);border-color:#e7b0aa}.pulse{width:7px;height:7px;border-radius:50%;background:currentColor;animation:pulse 1.1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}.dropzones{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dropzone{position:relative;border:1.5px dashed var(--line-strong);border-radius:var(--radius-card);background:var(--paper-2);padding:26px 18px;text-align:center;cursor:pointer;transition:border-color .15s ease,background .15s ease}.dropzone:hover,.dropzone.drag{border-color:var(--brand);background:var(--brand-wash)}.dropzone.filled{border-style:solid;border-color:var(--ok);background:var(--ok-wash)}.dropzone input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.dz-tag{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:0;color:var(--ink-soft);margin-bottom:8px}.dz-name{font-family:var(--mono);font-size:12.5px;word-break:break-all;color:var(--ink)}.dz-hint{font-size:13px;color:var(--ink-faint)}.upload-grid{display:grid;grid-template-columns:1fr 1fr 2fr;gap:16px;margin-top:18px}.rows{display:flex;flex-direction:column}.row-item{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:18px;padding:16px 18px;border:1px solid var(--line);border-top:none;background:var(--surface);transition:background .12s ease}.row-item:first-child{border-top:1px solid var(--line);border-radius:var(--radius) var(--radius) 0 0}.row-item:last-child{border-radius:0 0 var(--radius) var(--radius)}.row-item:hover{background:var(--paper-2)}.row-name{font-family:var(--sans);font-weight:600;font-size:15px}.row-meta{font-family:var(--mono);font-size:11.5px;color:var(--ink-soft);letter-spacing:.02em}.row-date{font-family:var(--mono);font-size:12px;color:var(--ink-faint)}.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.diff-col{border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);overflow:hidden}.diff-col-head{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:0;color:var(--ink-soft);padding:10px 14px;background:var(--paper-2);border-bottom:1px solid var(--line)}.diff-body{font-family:var(--mono);font-size:12.5px;line-height:1.7;padding:16px;white-space:pre-wrap;word-break:break-word;max-height:540px;overflow:auto}.c-del{background:var(--del-bg);color:var(--del-fg);border-radius:2px;box-shadow:0 0 0 1px #a8362b1f}.c-ins{background:var(--ins-bg);color:var(--ins-fg);border-radius:2px;box-shadow:0 0 0 1px #1c73401f}.report-img{width:100%;display:block;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--paper-2)}.img-skeleton{display:flex;align-items:center;justify-content:center;min-height:180px;border:1px dashed var(--line-strong);border-radius:var(--radius-card);font-family:var(--mono);font-size:12px;color:var(--ink-faint);background:var(--paper-2)}.tbl{width:100%;border-collapse:collapse;font-family:var(--body);font-size:13px}.tbl th{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:0;color:var(--ink-soft);text-align:left;padding:9px 12px;background:var(--paper-2);border:1px solid var(--line)}.tbl td{padding:9px 12px;border:1px solid var(--line);font-variant-numeric:tabular-nums}.swatch{display:inline-block;width:16px;height:16px;border:1px solid var(--line-strong);border-radius:2px;vertical-align:middle;margin-right:8px}.section{margin-top:40px}.section-head{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--line)}.section-head h2{font-size:18px;font-weight:600;letter-spacing:0}.section-head .idx{font-family:var(--mono);font-size:12px;color:var(--brand);font-weight:600}.loader{display:inline-flex;align-items:center;gap:12px;font-family:var(--body);font-size:13px;color:var(--ink-soft)}.loader-spin{width:16px;height:16px;border:2px solid var(--line-strong);border-top-color:var(--brand);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.note{background:var(--brand-wash);border-left:3px solid var(--brand);padding:12px 16px;border-radius:0 var(--radius) var(--radius) 0;font-size:13px;color:var(--brand-darker)}.banner-error{background:var(--err-wash);border-left:3px solid var(--err);padding:12px 16px;border-radius:0 var(--radius) var(--radius) 0;font-size:13.5px;color:#7a201a;font-family:var(--body)}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.reveal{animation:fadeUp .5s cubic-bezier(.2,.7,.2,1) both}.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}.login-poster{position:relative;background:linear-gradient(158deg,var(--brand-2) 0%,var(--brand) 52%,var(--brand-darker) 100%);color:#fff;padding:56px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.login-poster:after{content:"";position:absolute;right:-120px;bottom:-120px;width:380px;height:380px;border:1px solid rgba(255,255,255,.16);border-radius:50%;box-shadow:0 0 0 40px #ffffff0d}.login-poster h1{font-size:clamp(40px,6vw,72px);font-weight:300;letter-spacing:-.01em;color:#fff;line-height:1.1}.login-poster .lede{font-family:var(--body);font-size:16px;max-width:32ch;color:#ffffffd1;line-height:1.6}.login-poster .foot{font-family:var(--sans);font-size:12.5px;letter-spacing:.04em;color:#ffffffb3}.login-form-wrap{display:flex;align-items:center;justify-content:center;padding:40px}.login-form{width:100%;max-width:360px;display:flex;flex-direction:column;gap:18px}.login-form h2{font-size:26px;font-weight:600}.auth-toggle{font-family:var(--body);font-size:13px;color:var(--ink-soft)}.auth-toggle button{background:none;border:none;color:var(--brand);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline;padding:0}.muted{color:var(--ink-soft)}.stack{display:flex;flex-direction:column;gap:16px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:16px}.empty{text-align:center;padding:60px 20px;color:var(--ink-faint);font-family:var(--body);font-size:13px;border:1px dashed var(--line-strong);border-radius:var(--radius-card)}@media (max-width: 860px){.login{grid-template-columns:1fr}.login-poster{display:none}.dropzones,.diff-grid,.upload-grid,.zones-wrap{grid-template-columns:1fr}}.img-btn{display:block;position:relative;width:100%;padding:0;margin:0;border:none;background:none;line-height:0}.img-btn.zoomable{cursor:zoom-in}.img-zoom-hint,.zones-zoom{position:absolute;top:10px;right:10px;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:0;color:#fff;background:#101c28c7;padding:4px 10px;border-radius:var(--radius-pill);border:none;cursor:pointer;opacity:0;transition:opacity .15s ease}.img-btn.zoomable:hover .img-zoom-hint,.zones-canvas:hover .zones-zoom{opacity:1}.zones-zoom{z-index:2}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#101c28ed;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;flex-direction:column;animation:fadeUp .18s ease both}.lightbox-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}.lightbox-bar .mono{font-size:12px;color:#ffffffb8}.lightbox-actions{display:flex;gap:8px}.lightbox .btn-ghost{color:#fff;border-color:#fff6}.lightbox .btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}.lightbox-stage{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.lightbox-stage img{max-width:96%;max-height:100%;transition:transform .05s linear;transform-origin:center center;will-change:transform}.zones-wrap{display:grid;grid-template-columns:1fr 260px;gap:16px;align-items:start}.zones-canvas{position:relative;line-height:0;border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden}.zones-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.zone-rect{fill:#1a5dad12;stroke:var(--brand);stroke-width:2;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill .1s ease}.zone-rect:hover,.zone-rect.sel{fill:#1a5dad47;stroke-width:3}.zone-label{fill:var(--brand-deep);font-family:var(--mono);font-size:28px;font-weight:600;paint-order:stroke;stroke:#fff;stroke-width:5px}.zones-list{border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);overflow:hidden}.zones-list-head{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:0;color:var(--ink-soft);padding:10px 14px;background:var(--paper-2);border-bottom:1px solid var(--line)}.zones-list-body{max-height:460px;overflow:auto}.zone-row{display:flex;align-items:center;gap:12px;width:100%;padding:9px 14px;border:none;border-bottom:1px solid var(--line);background:none;font:inherit;text-align:left;cursor:pointer;transition:background .1s ease}.zone-row:last-child{border-bottom:none}.zone-row:hover,.zone-row.sel{background:var(--brand-wash)}.zone-row .zone-idx{color:var(--brand-deep);font-weight:600;min-width:22px}.zone-row .mono{font-size:12px}.route-loading{min-height:60vh;display:flex;align-items:center;justify-content:center}.nav-link{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink-soft);padding:6px 2px;border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease}.nav-link:hover{color:var(--brand)}.nav-link.active{color:var(--brand);border-bottom-color:var(--brand)}.btn-sm{padding:6px 12px;font-size:13px}.btn-danger{background:var(--err);border-color:var(--err);color:#fff;box-shadow:0 2px 0 0 var(--err-deep)}.btn-danger:hover{background:var(--del-fg);border-color:var(--del-fg);box-shadow:0 2px 5px #7a201a80}.admin-tbl{font-size:14px}.admin-tbl td{vertical-align:middle}.admin-tbl .col-actions{text-align:right;white-space:nowrap}.row-actions{display:inline-flex;gap:8px;justify-content:flex-end}.check{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-size:14px;color:var(--ink);cursor:pointer}.check input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;background:#101c288c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;animation:fadeUp .16s ease both}.modal{width:100%;max-width:440px;box-shadow:var(--shadow-lg)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid var(--line)}.modal-head h2{font-size:18px;font-weight:600}.modal-close{background:none;border:none;font-size:15px;color:var(--ink-soft);cursor:pointer;line-height:1;padding:4px}.modal-close:hover{color:var(--ink-strong)}.modal-body{padding:22px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}
