:root{--black:#000;--black2:#0b0907;--gold:#D4AF37;--gold2:#F3D77A;--gold-dk:#9C7A1E;--ox:#4A0000;--ox2:#4C0805;--ox-hi:#6B1A1A;--text:#F4EFE6;--muted:#C9BFAE}
.emblem{display:block;width:min(46vw,200px);height:auto;aspect-ratio:1;margin:6px auto 8px;border-radius:22%;border:2px solid var(--gold);box-shadow:0 0 0 4px var(--ox),0 0 24px #D4AF3755;image-rendering:auto}
@media(max-width:420px){.emblem{width:min(42vw,150px)}}
/* slots picker / main page */
body.lobbymode{background:radial-gradient(ellipse at top,#1a0d06,var(--black) 65%) fixed;color:var(--text)}
.lobbymode #lobby h1{color:var(--gold);text-shadow:0 2px 0 var(--ox)}
.lobbymode .ljp{background:var(--ox);border:1px solid var(--gold);color:var(--gold2)}
.lobbymode .lm{background:var(--black2);border-color:var(--gold);box-shadow:0 0 0 2px var(--ox) inset;transition:background .15s}.lobbymode .lm:hover{background:var(--ox-hi)}
.lobbymode .phead{background:var(--ox);border:1px solid var(--gold);color:var(--text)}.lobbymode .phead b{color:var(--gold2)}.lobbymode .phead a,.lobbymode a{color:var(--gold2)}
.lobbymode .login{background:var(--black2);border:2px solid var(--gold);color:var(--text)}.lobbymode .login h1{color:var(--gold)}
.lobbymode button,.lobbymode #go{background:linear-gradient(var(--gold2),var(--gold) 45%,var(--gold-dk));color:#1a0d00;border:1px solid var(--gold-dk)}
.lobbymode p,.lobbymode .note{color:var(--muted)}
/* online lobby, sign-in, role picker */
body.themed{background:radial-gradient(ellipse at top,var(--ox),var(--black) 60%) fixed;color:var(--text)}
.themed .hd{background:var(--black);border-color:var(--gold)}.themed .hd a,.themed .hd .t{color:var(--gold)}
.themed #auth{background:var(--black2);border:2px solid var(--gold);box-shadow:0 0 0 4px var(--ox),0 8px 30px #000;border-radius:18px}
.themed #auth .msg,.themed h2,.themed h3{color:var(--gold)}
.themed button{background:var(--ox);color:var(--text);border:1px solid var(--gold-dk)}.themed button:hover{background:var(--ox-hi)}
.themed #auth button.grn,.themed .modal button.grn,.themed .primary{background:linear-gradient(var(--gold2),var(--gold) 45%,var(--gold-dk))!important;color:#1a0d00;border-color:var(--gold-dk)}
.themed input{background:#120c08;color:var(--text);border:1px solid var(--gold-dk)}.themed input::placeholder{color:#a89a85}.themed input:focus{outline:2px solid var(--gold)}
.themed .note{color:var(--muted)}.themed a{color:var(--gold2)}
.roles{display:flex;flex-direction:column;gap:12px;padding:6px 0}.roles .msg{color:var(--gold);font-size:18px;font-weight:900;text-align:center}
.roles button.role{font:900 22px Arial,sans-serif;letter-spacing:2px;padding:22px 10px;border-radius:14px;border:2px solid var(--gold);background:linear-gradient(var(--ox-hi),var(--ox));color:var(--gold2);width:100%}
.roles button.role small{display:block;font:400 12px Arial;color:var(--muted);letter-spacing:0;margin-top:4px}.roles button.role:hover,.roles button.role:active{background:var(--ox-hi)}
.linkbtn{background:none!important;border:0!important;color:var(--gold2)!important;text-decoration:underline;font-size:13px;padding:4px}
/* password eye */
.pwwrap{position:relative;display:block}.pwwrap input{width:100%;padding-right:46px!important}
.pweye{position:absolute;z-index:5;right:4px;top:50%;transform:translateY(-50%);width:40px;height:40px;min-width:40px;padding:0!important;margin:0!important;border:0!important;background:none!important;color:var(--gold)!important;font-size:20px;line-height:40px;cursor:pointer;touch-action:manipulation}
.adm .pwwrap.inl{display:inline-block;width:220px;vertical-align:middle}
/* admin */
body.adm{background:var(--black);color:var(--text)}.adm header{background:var(--black);border-bottom:2px solid var(--gold)}.adm h1,.adm h2{color:var(--gold)}
.adm section{background:var(--black2);border:1px solid var(--gold);box-shadow:inset 0 3px 0 var(--ox)}
.adm button{background:linear-gradient(var(--gold2),var(--gold) 45%,var(--gold-dk));color:#1a0d00}.adm button.r{background:var(--ox);color:var(--text)}.adm button.r:hover{background:var(--ox-hi)}
.adm input,.adm select{background:#120c08;color:var(--text);border:1px solid var(--gold-dk)}.adm tr:hover td{background:#4A000055}.adm td,.adm th{border-color:#3a2a14}.adm th{color:var(--gold2)}
.modal{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:50}.modal>div{background:var(--black2);border:2px solid var(--gold);border-radius:12px;padding:16px;width:min(92vw,360px);box-shadow:0 0 0 4px var(--ox)}

.themed #lobby>.felt:first-child{background:radial-gradient(ellipse at top,var(--ox-hi),var(--ox) 70%);border:2px solid var(--gold);border-radius:16px;box-shadow:0 0 0 3px #000}
.linkbtn{box-shadow:none!important}
.pweye,.pweye:active,.pweye:hover{transform:translateY(-50%)!important;filter:none!important}
.adm #cs input,.adm #cs select,.adm #cs .pwwrap{display:block!important;width:100%!important;max-width:340px;margin:5px 0;padding:8px;font-size:16px}.adm #cs .pwwrap{padding:0}
.adm,.adm *{box-sizing:border-box}

.rtabs{display:flex;gap:0;margin:6px auto;max-width:560px;border:1px solid var(--gold);border-radius:12px;overflow:hidden}.rtabs a{flex:1;text-align:center;padding:12px 6px;font:900 15px Arial,sans-serif;letter-spacing:1px;text-decoration:none!important;color:var(--gold2)!important;background:var(--ox)}.rtabs a+a{border-left:1px solid var(--gold)}.rtabs a.on{background:linear-gradient(var(--gold2),var(--gold) 45%,var(--gold-dk));color:#1a0d00!important}.rtabs a:not(.on):hover{background:var(--ox-hi)}
.mc-logout{background:linear-gradient(var(--gold2),var(--gold) 45%,var(--gold-dk))!important;color:#1a0d00!important;border:1px solid var(--gold-dk)!important;border-radius:8px!important;font:900 13px Arial,sans-serif!important;padding:7px 12px!important;margin:0 0 0 6px!important;cursor:pointer;white-space:nowrap;width:auto!important;flex:none}
.mc-logout.fixed{position:fixed;top:8px;right:8px;z-index:60;box-shadow:0 2px 8px #000a}
.mc-logout:hover{filter:brightness(1.08)}