:root{font-family:"Open Sans",system-ui,sans-serif;color:#f4ede3;background:#02050e;--gold:#edbd76;--muted:#bcb9c2;--line:#403641;--ink:#f4ede3}
*{box-sizing:border-box}
body{margin:0;min-height:100vh}
button,input,textarea{font:inherit}
button,a,input,textarea{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.58}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ffdda9;outline-offset:3px}
a{color:var(--gold)}
.top{background:#080b15f2;border-bottom:1px solid var(--line)}
.top-inner{max-width:1180px;margin:auto;min-height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:12px}
.brand{display:inline-flex;align-items:center;font-weight:900;font-size:24px;letter-spacing:-1px;text-decoration:none;color:var(--ink)}
.brand-icon{display:grid;place-items:center;width:35px;height:35px;background:var(--gold);color:#21150e;border-radius:11px;margin-right:9px;font-size:30px}
.brand-accent{color:var(--gold)}
.top-label,.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:850;color:var(--muted)}
main{max-width:1180px;margin:0 auto;padding:36px 24px 64px}
.hero{position:relative;overflow:hidden;background:#111525;color:white;border-radius:10px;padding:42px;min-height:229px;display:flex;align-items:center;margin-bottom:29px}
.hero>*{z-index:1}.hero .eyebrow{color:#e6ad79}
.hero p{color:#d8d0cc;max-width:48ch}
.hero>div{max-width:65%}
.brand-logo{object-fit:contain;margin-right:9px;flex-shrink:0}.card-logo{display:block;object-fit:contain;margin:0 auto 18px}
h1,h2,h3,p{margin:0 0 12px}
h1{font-size:clamp(31px,5vw,52px);line-height:1.04;letter-spacing:-.045em}
h2{font-size:24px;letter-spacing:-.035em}h3{font-size:18px}p{line-height:1.55}
.panel{background:linear-gradient(155deg,#141827,#0d0f17);border:1px solid var(--line);border-radius:8px;padding:26px}
.center{max-width:660px;margin:24px auto}
.muted{color:var(--muted)}
.grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:21px;align-items:start}
.lineup,.row,.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.section-head{margin-bottom:16px}.section-head h2,.row h3{margin:0}
.row{border-top:1px solid var(--line);padding:14px 0;overflow-wrap:anywhere}.row:last-child{padding-bottom:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:1px solid transparent;border-radius:6px;background:var(--gold);color:#21150e;font-weight:750;padding:12px 16px;line-height:1.2;text-align:center}
.btn:hover{filter:brightness(.94)}
.alt{background:#262133;color:#ffdda9}.plain{background:#151827;color:#e1d8ce;border-color:var(--line)}
.full{width:100%}
.field{display:grid;gap:7px;font-weight:740;margin:14px 0}
input:not([type=radio]),textarea{width:100%;border:1px solid #524350;border-radius:11px;padding:12px;color:var(--ink);background:#0d0f17}
textarea{resize:vertical;min-height:70px}
.question-edit{margin:15px 0}
.option-edit{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:8px 0}
input[type=radio]{accent-color:var(--gold);width:20px;height:20px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.join-card{text-align:center;padding:36px}.join-card form{text-align:left}.join-card .brand-icon{margin:0 auto 18px;width:58px;height:58px;font-size:42px}
.qr{display:block;width:min(100%,230px);aspect-ratio:1;margin:8px auto;border:1px solid var(--line);border-radius:14px}
.pill{display:inline-block;background:#292235;border-radius:100px;color:#ffdda9;font-weight:800;padding:7px 12px;font-size:13px}
.names{display:flex;flex-wrap:wrap;gap:8px}
.game{max-width:940px;margin:auto}.game h1{overflow-wrap:anywhere;margin:19px 0}
.timer{font-variant-numeric:tabular-nums;font-size:27px;color:#ffdda9;font-weight:900}
.track{height:9px;background:#292235;border-radius:20px;overflow:hidden;margin:12px 0}
.track>div{height:100%;background:var(--gold);border-radius:20px}
.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.answer{color:white;min-height:88px;padding:15px;border-radius:14px;border:2px solid transparent;display:flex;align-items:center;gap:13px;font-size:clamp(16px,2vw,21px);font-weight:750;text-align:left;overflow-wrap:anywhere}
.answer b{background:#0003;border-radius:8px;padding:7px 10px}.answer:disabled{opacity:.7}.answer.selected{outline:3px solid var(--ink);outline-offset:2px;opacity:1}
.answer:nth-child(4n+1){background:#792c3a}.answer:nth-child(4n+2){background:#1d4673}.answer:nth-child(4n+3){background:#744918}.answer:nth-child(4n+4){background:#185746}
.rank{list-style:none;padding:0;margin:16px 0}.rank li{display:grid;grid-template-columns:35px 1fr auto;gap:10px;align-items:center;border-top:1px solid var(--line);padding:11px 0;overflow-wrap:anywhere}
.place{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#292235;color:#ffdda9;font-weight:800}
.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-items:end;text-align:center;margin:24px 0}
.medal{background:#292235;border-radius:16px 16px 7px 7px;padding:16px 7px;display:grid;align-content:center;gap:7px;overflow-wrap:anywhere;min-height:125px}.medal strong{font-size:25px}.medal.first{background:#61451e;min-height:175px;grid-column:2;grid-row:1}.medal.second{grid-column:1;grid-row:1;min-height:145px}.medal.third{grid-column:3;grid-row:1}
#notice{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:3;max-width:90vw;text-align:center;background:#111525;color:white;padding:11px 18px;border-radius:10px;box-shadow:0 6px 22px #0008}#notice:empty{display:none}
@media(max-width:730px){.grid,.answers{grid-template-columns:1fr}.hero{padding:26px}main{padding:22px 14px 42px}.panel{padding:20px}.top-inner{padding:0 14px;min-height:63px}.top-label{font-size:9px;text-align:right}.answer{min-height:60px}.row{flex-wrap:wrap}}
.quiz-actions{display:flex;flex-wrap:wrap;gap:7px}
.quiz-actions .btn{padding:9px 11px}
.danger{background:#321e2a;color:#ffc1c6;border-color:#75404a}
.delete-dialog{width:min(460px,calc(100% - 28px));color:var(--ink)}
.delete-dialog::backdrop{background:#000a}
.delete-dialog .actions{justify-content:flex-end}
@media(max-width:950px){.quiz-row{flex-wrap:wrap}}

@media(max-width:730px){.hero>div{max-width:100%}.brand{font-size:21px}.brand-logo{width:34px;height:34px}}
.question-time{max-width:240px}
.names + .muted{margin-top:16px}

h1,h2,.brand{font-family:Philosopher,Georgia,serif;letter-spacing:.005em}
h1,h2{color:#ffdda9}
.top{border-bottom-color:#705138}
body:has(.hero){background:linear-gradient(180deg,#02050e18,#02050e88 72%,#02050e) center top/cover no-repeat fixed,url('/mu-quest-background.webp') center top/cover no-repeat fixed #02050e}
.hero{min-height:265px;border:1px solid #705138;background:linear-gradient(110deg,#080b17ee,#080b1744)}
.hero h1{font-size:clamp(38px,5.5vw,64px)}
.hero .btn,.join-card .full,.actions>.btn:not(.alt):not(.plain):not(.danger){background:linear-gradient(180deg,#ffdda9,#d89c57);border-color:#f2c488;box-shadow:0 4px 20px #dc884127}
.panel{box-shadow:0 12px 35px #0004}
.join-card.center{border-top-color:#8a6340}
body:has(.join-card.center){background:linear-gradient(90deg,#02050eee,#02050e38),url('/mu-quest-background.webp') center top/cover no-repeat fixed}
.answer{border-color:#ffffff29}
.answer:disabled{opacity:.86}
.medal{border:1px solid #594859}
.medal.first{border-color:#cc9a56}
.medal.second{background:#333848}
.medal.third{background:#44302a}
@media(max-width:730px){body:has(.hero){background-position:center top,64% top}.hero{min-height:240px}.hero p{max-width:29ch}}

@media(max-width:730px){body:has(.player-lobby){background-position:left top,67% top}}

.vote-chart{margin:22px 0 26px}
.vote-chart ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.vote-label{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.vote-label>span{min-width:0;overflow-wrap:anywhere}
.vote-label>strong{white-space:nowrap;font-variant-numeric:tabular-nums}
.vote-track{height:8px;margin-top:6px;background:#292235;border-radius:12px;overflow:hidden}
.vote-track>div{height:100%;background:#a18ac1;border-radius:inherit}
.vote-option.correct .vote-track>div{background:var(--gold)}
.vote-correct{color:#ffdda9;font-weight:700}

.personal-result{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 20px}