:root{font-family:Arial,Helvetica,sans-serif;color:#162643;background:#edf2f8;font-size:16px;--blue:#245be4;--orange:#ba470b;--ink:#162643}*{box-sizing:border-box}body{margin:0}main{max-width:1160px;margin:0 auto;padding:28px 30px 16px}button,input,select{font:inherit}button{cursor:pointer;border:0;border-radius:10px;padding:12px 18px;font-weight:700;transition:background .15s,transform .15s}button:hover:not(:disabled){filter:brightness(.94)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #9362da;outline-offset:3px}button:disabled{opacity:.45;cursor:default}.plain{background:white;color:var(--ink);border:1px solid #ccd6e5}.primary{background:var(--ink);color:white}.wide{width:100%}header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}.brand{display:flex;gap:13px;align-items:center}.mark{display:grid;place-items:center;background:var(--ink);color:#ffcb57;font-size:31px;font-weight:900;width:52px;height:52px;border-radius:13px;transform:rotate(-5deg)}h1{font-size:28px;margin:0;letter-spacing:-1px}.brand p{margin:5px 0 0;font-size:14px;color:#53657e}nav{display:flex;gap:8px}.scoreboard{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:18px;align-items:center;margin-bottom:24px}.team{padding:16px 22px;border-radius:15px;color:white;box-shadow:0 4px 0 #0001}.team>span{font-size:14px;font-weight:700;letter-spacing:1px}.team div{display:flex;align-items:baseline;gap:12px;margin-top:5px}.team strong{font-size:40px;line-height:1}.team div span{font-size:14px}.blue{background:var(--blue)}.orange{background:var(--orange)}.turn{text-align:center;display:flex;flex-direction:column;gap:6px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1px;color:#53657e}.turn strong{font-size:25px}.turn>span:last-child{font-size:14px;color:#53657e}.boardHeading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:14px;color:#53657e}.keyButton{background:transparent;border:1px dashed #99abc3;padding:8px 12px;font-size:14px;color:#344967}.board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.card{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;background:white;color:var(--ink);border:1px solid #cbd6e5;border-bottom:4px solid #b5c4d7;min-height:88px;padding:10px 4px;font-size:clamp(16px,2vw,23px);letter-spacing:.5px;text-transform:uppercase;word-break:normal;overflow-wrap:anywhere;box-shadow:0 2px 6px #12233d06}.card:hover:not(:disabled){transform:translateY(-2px)}.card:disabled{opacity:1}.card.revealed{border-bottom-color:#0002}.card.blue,.mini .blue{background:var(--blue);color:white;border-color:var(--blue)}.card.orange,.mini .orange{background:var(--orange);color:white;border-color:var(--orange)}.card.neutral,.mini .neutral{background:#d5dde8;color:#344967;border-color:#b9c6d7}.card.block,.mini .block{background:#162643;color:#ffcb57;border-color:#162643}.card small{font-size:12px;letter-spacing:0;text-transform:none;font-weight:400}.controls{margin-top:22px;background:#dfe7f3;border-radius:14px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:14px}form{display:flex;align-items:end;gap:10px;flex:1}label{font-size:14px;display:flex;flex-direction:column;gap:5px;flex:1}.numberLabel{flex:0 0 84px}input,select{width:100%;height:45px;background:white;color:var(--ink);border:1px solid #bccbe0;border-radius:8px;padding:10px}form button{height:45px;white-space:nowrap}#activeClue{display:flex;align-items:center;gap:18px;flex-wrap:wrap}#activeClue strong{font-size:25px}#activeClue>span:last-child{font-size:14px;color:#53657e}[hidden]{display:none!important}.message{font-size:16px;min-height:24px;margin:17px 0;color:#344967}footer{border-top:1px solid #ccd6e5;padding-top:12px;display:flex;justify-content:space-between;gap:15px;font-size:12px;color:#53657e}dialog{border:0;border-radius:18px;padding:25px;color:var(--ink);width:min(660px,calc(100% - 28px));max-height:90vh;box-shadow:0 25px 80px #0004}dialog::backdrop{background:#101d38bb;backdrop-filter:blur(5px)}.dialogHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}h2{font-size:24px;margin:0}.close{font-size:28px;line-height:1;padding:4px 10px;background:transparent;color:#53657e}dialog p,li{line-height:1.6;font-size:16px}li{padding-left:5px;margin-bottom:13px}ol{padding-left:22px}.dialogActions{display:flex;justify-content:end;gap:10px}.legend{display:flex;justify-content:space-between;gap:8px;font-size:14px;margin-bottom:13px}.blueText{color:var(--blue)}.orangeText{color:var(--orange)}.mini{gap:6px;margin-bottom:18px}.mini .card{min-height:60px;font-size:14px;border:0;border-radius:7px}.mini .card small{font-size:12px}
@media(max-width:700px){main{padding:18px 12px}header{gap:10px;align-items:flex-start;margin-bottom:20px}h1{font-size:25px}.brand{gap:9px}.mark{width:42px;height:42px;font-size:25px}.brand p{font-size:12px}.plain{padding:10px 12px}nav{flex-direction:column;gap:5px}nav button{font-size:14px;padding:8px 12px}.scoreboard{gap:8px;grid-template-columns:1fr 1fr 1fr;margin-bottom:16px}.team{padding:12px 10px;border-radius:10px}.team>span{font-size:12px;letter-spacing:0}.team div{flex-direction:column;gap:5px}.team strong{font-size:30px}.team div span{font-size:12px}.turn strong{font-size:18px}.turn>span:last-child{font-size:12px}.board{gap:6px}.card{min-height:70px;font-size:14px;letter-spacing:0;padding:8px 3px;border-radius:8px}.card small{font-size:12px}.boardHeading{font-size:12px}.keyButton{font-size:12px;padding:8px}.controls{flex-direction:column;align-items:stretch;padding:12px;gap:10px;margin-top:14px}form{flex-wrap:wrap;gap:8px}form label{min-width:0}form .numberLabel{flex:0 0 75px}form button{width:100%}#passButton{align-self:flex-end}.message{font-size:14px;line-height:1.5}footer{font-size:12px;flex-wrap:wrap}.mini .card{font-size:12px;min-height:58px}.mini .card small{font-size:12px}.legend{font-size:12px}dialog{padding:18px}h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){button{transition:none}.card:hover:not(:disabled){transform:none}}

.boardTools{display:flex;align-items:center;gap:8px}.boardTools .primary{padding:9px 13px;font-size:14px}.boardHeading>span{display:flex;flex-direction:column;gap:4px}#roundLabel{font-weight:400;font-size:12px;letter-spacing:1px;color:#53657e}.qrContainer{width:min(280px,100%);margin:18px auto;background:white}.qrContainer svg{display:block;width:100%;height:auto}.roundMatch{text-align:center}.smallNote{font-size:14px!important;color:#53657e}textarea{width:100%;min-height:96px;font:14px monospace;padding:10px;border:1px solid #bccbe0;border-radius:8px;resize:vertical;overflow-wrap:anywhere}summary{cursor:pointer;font-size:14px;padding:10px 0}.companion{max-width:100%;margin:30px auto}.companionHeading{margin-bottom:20px}.companion .board .card{border-bottom-width:1px;min-height:100px}.companion .legend{max-width:500px;margin-bottom:20px}.companion .message{margin-top:25px}#hiddenNotice{padding:80px 20px;text-align:center;border:2px dashed #bccbe0;border-radius:15px}.companion .card{cursor:default}.companion .card:hover{transform:none!important}
@media(max-width:700px){.boardHeading{align-items:flex-start}.boardTools{flex-direction:column;align-items:stretch;gap:5px}.boardTools .primary{font-size:12px;padding:8px}.companion .board .card{min-height:80px}.companionHeading h2{font-size:20px}}

/* BookOpen icon from Lucide, ISC license. */
.bookIcon{width:52px;height:52px;flex:0 0 auto;color:var(--ink)}.scoreboard{grid-template-columns:1fr 1.7fr 1fr}.turn{gap:10px}.turn>.eyebrow{font-size:24px}.turn strong{font-size:50px;line-height:1.1;letter-spacing:-1px;overflow-wrap:anywhere}.turn #roundLabel{font-size:14px;letter-spacing:.7px;color:#53657e}.boardHeading{justify-content:flex-end}.numberLabel{flex-basis:130px}footer{justify-content:flex-end}
@media(max-width:700px){.bookIcon{width:42px;height:42px}.scoreboard{grid-template-columns:1fr 1.8fr 1fr}.turn strong{font-size:36px;letter-spacing:-.7px}.turn>.eyebrow{font-size:24px;line-height:1.15}.turn #roundLabel{font-size:12px;letter-spacing:0}.boardTools{flex-direction:row;align-items:center}.boardHeading{justify-content:flex-end}.numberLabel,form .numberLabel{flex-basis:118px}.controls label{font-size:14px}}

.card.blue{--revealed-background:var(--blue);--revealed-text:white}.card.orange{--revealed-background:var(--orange);--revealed-text:white}.card.neutral{--revealed-background:#d5dde8;--revealed-text:#344967}.card.block{--revealed-background:#162643;--revealed-text:#ffcb57}.card.flipping{animation:cardFlip .42s ease-in-out both;transform-origin:center}.card.flipping small{animation:revealLabel .42s step-end both}
@keyframes cardFlip{0%{transform:perspective(600px) rotateY(0deg);background:white;color:var(--ink)}49.9%{transform:perspective(600px) rotateY(90deg);background:white;color:var(--ink)}50%{transform:perspective(600px) rotateY(-90deg);background:var(--revealed-background);color:var(--revealed-text)}100%{transform:perspective(600px) rotateY(0deg);background:var(--revealed-background);color:var(--revealed-text)}}
@keyframes revealLabel{0%{opacity:0}50%,100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.card.flipping,.card.flipping small{animation:none}}

#syncStatus{font-size:12px;color:#53657e;margin-right:auto}#liveStatus{font-size:14px;color:#53657e}.companionRevealed{opacity:.55}.companionRevealed small{font-weight:700}.wayweiser{margin-top:28px;padding:22px;border-radius:15px;background:#dfe7f3}.wayweiser h2{margin:0}.wayweiser p{line-height:1.5;font-size:14px}.wayweiserTeams{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}.wayweiserTeam button{width:100%;white-space:normal}.wayweiserTeam p{margin-bottom:0}.wayweiser .blue{background:var(--blue)}.wayweiser .orange{background:var(--orange)}#wayWord{display:block;font-size:40px;margin:16px 0;color:var(--ink)}#wayMessage:empty{display:none}
@media(max-width:700px){.wayweiser{padding:16px}.wayweiserTeams{gap:10px}.wayweiserTeam button{font-size:14px;padding:12px 8px}.boardHeading{flex-wrap:wrap;gap:8px}#syncStatus{width:100%;order:2}#wayWord{font-size:32px}}

/* The secret view uses colour for ownership and text only for reveal status. */
.secretCard{text-align:center;text-transform:none;letter-spacing:0;min-width:0;align-items:center;justify-content:center;gap:8px;padding:12px 4px;overflow-wrap:normal;word-break:normal}.secretWord{display:block;max-width:100%;text-align:center;line-height:1.25;font-size:clamp(.875rem,1.9vw,1.375rem);font-weight:600;hyphens:manual;overflow-wrap:normal;word-break:normal}.secretWord.longWord{font-size:clamp(.75rem,1.6vw,1.125rem)}.secretCard .secretStatus{font-size:clamp(.75rem,1.2vw,.875rem);font-weight:400;text-transform:none;text-align:center;line-height:1.2;white-space:nowrap;letter-spacing:0}.secretCard.companionRevealed{opacity:1}.secretCard.companionRevealed.blue{background:#cbd9fc;color:#183876}.secretCard.companionRevealed.orange{background:#f2cbb6;color:#793709}.secretCard.companionRevealed.neutral{background:#e3e8ee;color:#53657e}.secretCard.companionRevealed.block{background:#34445b;color:#ffdb7a}
@media(max-width:700px){#companionBoard{gap:4px}.companion .board .secretCard{min-height:90px;padding:10px 1px}.secretWord{font-size:.875rem}.secretWord.longWord{font-size:.75rem}.secretCard .secretStatus{font-size:.75rem}.mini .secretCard{padding:8px 1px}.mini .secretWord{font-size:.75rem}}
@media(max-width:350px){.secretWord{font-size:.75rem}.secretCard .secretStatus{transform:scaleX(.85)}}

.sendClue{margin:0 0 22px;padding:18px;background:#dfe7f3;border-radius:14px}.sendClue h2{font-size:21px;margin-bottom:14px}.sendClue form{align-items:flex-end;gap:12px}.sendClue .tabletNumber{flex:0 0 84px}.sendClue input:disabled,.sendClue select:disabled{opacity:.65}.sendClue p{font-size:14px;line-height:1.5;margin:12px 0 0}.sendClue p:empty{display:none}
@media(max-width:700px){.sendClue{padding:14px}.sendClue h2{font-size:18px}.sendClue form{flex-wrap:wrap;gap:10px}.sendClue form button{width:100%}.sendClue .tabletNumber{flex:0 0 76px}}
