:root{
  --paper:#f6f4f0; --card:#ffffff; --ink:#20201e; --muted:#6e6a63; --line:#ded9d1;
  --accent:#b4432c; --green:#2c6b53; --shadow:0 1px 2px rgba(0,0,0,.05), 0 6px 18px rgba(0,0,0,.05);
  --radius:10px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:"Segoe UI",Roboto,Arial,sans-serif;font-size:16px;line-height:1.55;}
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 20px;}
.bar{background:#1d1c1a;color:#f2efe9;}
.bar-in{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:14px 0;flex-wrap:wrap;}
.brand{font-size:20px;font-weight:700;letter-spacing:.3px;}
.brand span{color:#e8a48f;}
.bar-note{font-size:13px;color:#a9a49c;}
.hero{padding:34px 0 8px;}
.hero h1{font-size:34px;line-height:1.15;margin:0 0 10px;letter-spacing:-.3px;}
.hero p{margin:0;max-width:640px;color:var(--muted);}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;margin:28px 0;}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.card h2{font-size:19px;margin:0;}
.card h3{font-size:15px;margin:22px 0 6px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.label{font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);margin:0 0 6px;}
.hint{font-size:13.5px;color:var(--muted);margin:0 0 14px;}
.hint.center{text-align:center;margin-top:8px;margin-bottom:0;}
.center{text-align:center;} .mt{margin-top:16px;}
.roomcode{font-family:Consolas,monospace;font-size:34px;font-weight:700;letter-spacing:6px;color:var(--accent);margin:0 0 10px;}
.url{font-family:Consolas,monospace;font-size:13px;background:#f2efe9;border:1px solid var(--line);border-radius:6px;padding:9px 10px;word-break:break-all;margin:0;color:#3a3833;}
.qr{width:150px;height:150px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:6px;}
.status{margin:18px 0 0;font-size:13.5px;padding:9px 12px;border-radius:6px;background:#eef3f0;border:1px solid #cfe0d8;color:var(--green);}
.status.warn{background:#fbeeea;border-color:#eccfc7;color:var(--accent);}
.grid3{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:start;}
@media (max-width:780px){.grid3{grid-template-columns:1fr;}.hero h1{font-size:27px;}}
.btn{display:inline-block;font:inherit;font-size:14px;padding:9px 15px;border-radius:7px;border:1px solid transparent;background:var(--accent);color:#fff;cursor:pointer;transition:background .15s;margin:0 4px 6px 0;}
.btn:hover{background:#9c3623;}
.btn.ghost{background:transparent;border-color:var(--line);color:var(--ink);}
.btn.ghost:hover{background:#f2efe9;border-color:#c9c3b9;}
.btn.small{font-size:13px;padding:7px 12px;}
.sec-title{font-size:19px;margin:34px 0 14px;}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.streams{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media (max-width:780px){.streams{grid-template-columns:1fr;}}
.stream{position:relative;background:#1d1c1a;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;border:1px solid #2c2a27;}
.stream video{width:100%;height:100%;object-fit:cover;display:block;}
.tag{position:absolute;left:8px;bottom:8px;font-size:11.5px;background:rgba(0,0,0,.62);color:#f0ece5;padding:4px 8px;border-radius:5px;}
.tag.live{background:var(--green);color:#fff;}
.pill{font-size:12.5px;background:#eae6df;border:1px solid var(--line);border-radius:20px;padding:4px 12px;color:var(--muted);}
.table-wrap{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;}
table.rank{width:100%;border-collapse:collapse;font-size:14.5px;}
table.rank th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);font-weight:600;padding:12px 14px;background:#f2efe9;border-bottom:1px solid var(--line);}
table.rank td{padding:12px 14px;border-bottom:1px solid #eeeae3;vertical-align:middle;}
table.rank tr:last-child td{border-bottom:0;}
table.rank tr.empty td{text-align:center;color:var(--muted);padding:30px 14px;font-style:italic;}
.c-rank{width:52px;} .c-type{width:110px;} .c-score{width:110px;} .c-judges{width:90px;}
.rank-no{font-weight:700;color:var(--muted);}
tr.top1 .rank-no{color:#b8860b;} tr.top2 .rank-no{color:#7d7d7d;} tr.top3 .rank-no{color:#a1653a;}
.p-title{font-weight:600;}
.p-link{display:block;font-size:12.5px;color:var(--muted);text-decoration:none;word-break:break-all;}
.p-link:hover{color:var(--accent);text-decoration:underline;}
.score{font-weight:700;font-size:16px;}
.score small{font-weight:400;color:var(--muted);font-size:12px;}
.foot{margin-top:50px;padding:22px 0 34px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);}