:root { color-scheme: dark; --bg:#0d1722; --panel:#1d2b3a; --panel2:#111e2b; --line:#314457; --text:#f5f8fc; --muted:#aebed0; --blue:#35a4f4; --danger:#ff8585; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); font:16px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button { border:0; border-radius:14px; padding:12px 18px; background:var(--blue); color:white; font-weight:750; cursor:pointer; }
button:disabled { opacity:.55; cursor:wait; }
button.secondary { background:var(--panel); border:1px solid var(--line); }
button.quiet { background:transparent; color:var(--muted); }
.muted { color:var(--muted); }
.eyebrow { margin:0 0 6px; color:var(--blue); font-size:12px; font-weight:850; letter-spacing:.17em; }
.hidden { display:none !important; }
.login-page { display:grid; place-items:center; padding:24px; }
.login-card { width:min(420px,100%); padding:36px; border:1px solid var(--line); border-radius:28px; background:var(--panel); box-shadow:0 24px 70px #0006; }
.login-card h1 { margin:0; font-size:52px; letter-spacing:-.05em; }
.login-card form { display:grid; gap:18px; margin-top:30px; }
.login-card label { display:grid; gap:7px; color:var(--muted); font-weight:700; }
.login-card input { width:100%; padding:14px 16px; color:var(--text); background:var(--panel2); border:1px solid var(--line); border-radius:13px; outline:none; }
.login-card input:focus { border-color:var(--blue); }
.error { min-height:1.4em; margin:0; color:var(--danger); }
.web-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:32px; min-height:70px; padding:0 28px; background:#0d1722ed; border-bottom:1px solid var(--line); backdrop-filter:blur(18px); }
.brand { font-size:24px; font-weight:900; }
.web-header nav { display:flex; gap:8px; flex:1; }
.web-header nav a { padding:10px 14px; border-radius:12px; color:var(--muted); font-weight:700; }
.web-header nav a.active { color:white; background:var(--panel); }
.review-layout { display:grid; grid-template-columns:320px minmax(0,1fr); min-height:calc(100vh - 70px); }
aside { padding:24px; border-right:1px solid var(--line); background:#101c28; }
.aside-heading { display:flex; align-items:center; justify-content:space-between; }
.aside-heading h1 { margin:0; }
.house-list { display:grid; gap:8px; margin-top:20px; }
.house-button { width:100%; display:grid; grid-template-columns:1fr auto; gap:3px 12px; padding:13px; text-align:left; background:var(--panel2); border:1px solid transparent; }
.house-button.active { border-color:var(--blue); }
.house-button small { color:var(--muted); }
.house-button strong { grid-row:1 / span 2; grid-column:2; align-self:center; }
.review-main { padding:30px; min-width:0; }
.calibration-launch { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 22px; padding:16px 18px; border:1px solid var(--line); border-radius:18px; background:var(--panel2); }
.calibration-launch > div { display:grid; gap:3px; }
.calibration-launch strong { font-size:18px; }
.calibration-launch small { color:var(--muted); }
.calibration-launch span { color:var(--blue); font-weight:750; }
.review-heading { display:flex; justify-content:space-between; gap:20px; align-items:end; }
.review-heading h2 { margin:0; font-size:30px; }
.review-heading-actions { display:flex; align-items:end; gap:10px; }
.review-sort { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:700; }
.review-sort select { min-width:170px; border:1px solid var(--line); border-radius:12px; padding:9px 12px; color:var(--text); background:var(--panel2); }
.selection-count { padding:8px 12px; color:var(--muted); background:var(--panel2); border-radius:99px; }
.review-actions { position:sticky; top:82px; z-index:10; display:grid; grid-template-columns:repeat(3,minmax(0,auto)) minmax(0,1fr); gap:10px; margin:22px 0 14px; padding:14px; border:1px solid var(--line); border-radius:18px; background:#111e2bf2; backdrop-filter:blur(12px); }
.review-actions button { border:1px solid var(--line); background:var(--panel); white-space:nowrap; }
.review-actions button[data-verdict="same"]:not(:disabled) { border-color:var(--blue); background:var(--blue); }
.review-actions button.quiet { justify-self:end; border-color:transparent; background:transparent; }
.review-actions button:disabled { color:#7890a6; background:#162432; opacity:.65; cursor:not-allowed; }
.review-help { margin:0 0 8px; color:var(--muted); }
.review-help b { color:var(--text); }
.review-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; margin-top:22px; }
.review-card { position:relative; overflow:hidden; background:var(--panel); border:2px solid transparent; border-radius:22px; cursor:pointer; transition:.14s ease; }
.review-card:hover { border-color:#45627d; transform:translateY(-1px); }
.review-card.selected { border-color:var(--blue); transform:translateY(-2px); }
.review-card[data-verdict="same"] { box-shadow:inset 0 0 0 2px #35a4f466; }
.review-card[data-verdict="separate"] { box-shadow:inset 0 0 0 2px #7cbf9a66; }
.review-card[data-verdict="unsure"] { box-shadow:inset 0 0 0 2px #e4b85c66; }
.card-select { position:absolute; z-index:3; top:12px; left:12px; width:28px; height:28px; accent-color:var(--blue); }
.photo-strip { display:grid; width:100%; aspect-ratio:16/9; gap:3px; overflow:hidden; background:#09121b; }
.photo-strip--1 { grid-template-columns:1fr; }
.photo-strip--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.photo-strip--3 { grid-template-columns:1.5fr repeat(2,minmax(0,1fr)); }
.photo-strip img { display:block; min-width:0; width:100%; height:100%; object-fit:cover; cursor:zoom-in; }
.photo-placeholder { display:grid; width:100%; aspect-ratio:16/9; place-items:center; color:var(--muted); background:var(--panel2); }
.card-body { padding:16px; }
.card-title { display:flex; justify-content:space-between; gap:12px; align-items:start; }
.card-title h3 { margin:0; font-size:25px; }
.card-id { color:var(--muted); font-size:13px; }
.facts { display:flex; flex-wrap:wrap; gap:7px; margin:14px 0; }
.facts span,.verdict { padding:6px 9px; border-radius:9px; background:var(--panel2); color:var(--muted); }
.card-footer { display:flex; min-width:0; align-items:center; justify-content:space-between; gap:10px; color:var(--muted); font-size:13px; }
.card-source { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.card-footer a { flex:0 0 auto; color:var(--blue); font-weight:800; }
.photo-viewer { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:4vw; background:#000d; }
.photo-viewer img { max-width:100%; max-height:90vh; object-fit:contain; }
.photo-viewer button { position:absolute; top:20px; right:20px; width:48px; height:48px; padding:0; border-radius:50%; font-size:30px; background:#1d2b3a; }
@media (max-width:1050px) { .review-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }.review-actions button.quiet { justify-self:stretch; } }
@media (max-width:800px) { .web-header { padding:0 14px; gap:10px; }.web-header nav { overflow-x:auto; }.web-header nav a { flex:none; padding:8px; font-size:13px; }.review-layout { display:block; } aside { border-right:0; border-bottom:1px solid var(--line); }.review-main { padding:20px 14px; }.calibration-launch { align-items:flex-start; flex-direction:column; }.review-heading { align-items:start; flex-direction:column; }.review-heading-actions { width:100%; align-items:end; }.review-sort { flex:1; }.review-sort select { width:100%; min-width:0; }.review-grid { grid-template-columns:1fr; }.review-actions { position:static; grid-template-columns:1fr; }.review-actions button { width:100%; }.review-help { font-size:14px; } }
