:root{--ink:#17202c;--muted:#68717d;--line:#e5e8ec;--paper:#fff;--bg:#f5f6f8;--accent:#d9a72e;--nav:#131a24}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}.topbar{height:76px;background:var(--nav);display:flex;align-items:center;padding:0 max(24px,calc((100% - 1180px)/2));box-shadow:0 2px 12px #10151d33}.brand{display:flex;align-items:center;gap:11px;color:white;text-decoration:none;font-weight:700;line-height:1.05}.brand small{font-size:10px;color:#aeb6c1;text-transform:uppercase;letter-spacing:1.6px}.star{color:var(--accent);font-size:30px}.page{max-width:1180px;margin:auto;padding:44px 24px 70px}.hero,.detail-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:11px;letter-spacing:2px;color:#a47a16;font-weight:700;margin:0 0 7px}h1{font-family:'Playfair Display',serif;font-size:42px;margin:0 0 6px}.muted{color:var(--muted);margin:0}.count{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:15px 22px;display:flex;align-items:center;gap:10px}.count strong{font-size:27px}.count span{font-size:12px;color:var(--muted);max-width:55px}.search{height:52px;border:1px solid var(--line);background:white;border-radius:12px;display:flex;align-items:center;padding:0 17px;gap:12px;margin-bottom:18px;box-shadow:0 2px 7px #1c27300a}.search span{font-size:25px;color:#89919b}.search input{border:0;outline:0;width:100%;font:inherit}.cards{display:grid;gap:10px}.candidate-card{background:white;border:1px solid var(--line);border-radius:13px;display:grid;grid-template-columns:56px 1fr auto 20px;align-items:center;gap:16px;padding:14px 18px;color:inherit;text-decoration:none;transition:.18s}.candidate-card:hover{transform:translateY(-1px);border-color:#d4b667;box-shadow:0 7px 22px #1a263012}.candidate-card[hidden]{display:none}.avatar{width:56px;height:56px;border-radius:50%;background:#eee8da;color:#96711b;display:flex;align-items:center;justify-content:center;font-weight:700;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.candidate-main h2{font-size:17px;margin:0 0 5px}.candidate-main p{font-size:13px;color:var(--muted);margin:0}.candidate-main p span{margin:0 8px}.candidate-meta{display:flex;gap:16px;align-items:center;text-align:right;font-size:12px;color:var(--muted)}.candidate-meta small{color:#a1a7ae}.badge{background:#f1e9d6;color:#886817;padding:5px 8px;border-radius:20px;font-weight:600}.arrow{color:#aeb3b9;font-size:27px}.empty{text-align:center;padding:70px;color:var(--muted)}.empty span{font-size:46px;color:var(--accent)}.hidden{display:none}.back{display:inline-block;color:#6c737d;text-decoration:none;font-size:13px;margin-bottom:28px}.genre{background:#eee4c9;color:#806114;border-radius:30px;padding:8px 14px;font-size:13px}.detail-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:20px;align-items:start}.detail-content{display:grid;gap:20px}.panel{background:white;border:1px solid var(--line);border-radius:14px;padding:25px}.panel h2{font-size:16px;margin:0 0 22px;padding-bottom:13px;border-bottom:1px solid var(--line)}.panel h2 span{float:right;background:#f0f1f3;color:#737b85;border-radius:20px;padding:3px 8px;font-size:11px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px}.fields div{min-width:0}.fields span,.media-item span{display:block;color:#8a919a;font-size:10px;text-transform:uppercase;letter-spacing:.8px;margin-bottom:5px}.fields strong,.fields a{font-size:14px;overflow-wrap:anywhere;color:var(--ink)}.fields a{color:#8f6a13}.songs small{display:block;color:var(--muted);margin-top:3px}.biography{white-space:pre-line;line-height:1.65;margin:0;font-size:14px}.media{position:sticky;top:20px}.media-item{margin-bottom:22px}.media-item img,.media-item video{display:block;width:100%;max-height:330px;object-fit:contain;background:#101318;border-radius:9px;margin-bottom:9px}.media-item div{display:grid;grid-template-columns:1fr auto;gap:3px 10px}.media-item strong{font-size:12px;overflow:hidden;text-overflow:ellipsis}.media-item span{margin:0}.media-item a{font-size:12px;color:#8f6a13}@media(max-width:760px){.page{padding:30px 15px}.hero,.detail-head{align-items:flex-start;gap:20px}.count{display:none}h1{font-size:32px}.candidate-card{grid-template-columns:48px 1fr 15px;padding:12px}.avatar{width:48px;height:48px}.candidate-meta{display:none}.detail-grid{grid-template-columns:1fr}.fields{grid-template-columns:1fr}.media{position:static}.genre{display:none}}
