:root{--cn-ink:#111d24;--cn-panel:#18272e;--cn-panel-raised:#213139;--cn-line:#465860;--cn-paper:#edf0ea;--cn-muted:#aab7b9;--cn-brass:#b99a5b;--cn-brass-light:#d6bd83;--cn-red:#a64449;--cn-blue:#3b7186}
.codenames-settings{border-color:#84959c}.codenames-setting-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin:20px 0}.codenames-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}.codenames-sidebar{position:sticky;top:12px;display:grid;gap:12px}
.codename-team{overflow:hidden;border:1px solid #3e4e56;border-radius:13px;background:var(--cn-panel)}.codename-team header{display:flex;justify-content:space-between;padding:10px 12px;color:#fff}.codename-team-red header{background:var(--cn-red)}.codename-team-blue header{background:var(--cn-blue)}.codename-team header span{font-weight:900}.codename-team header b{font:800 .7rem/1.4 ui-monospace,monospace;text-transform:uppercase}.codename-roster{display:grid;gap:6px;padding:8px}.codename-player{position:relative;isolation:isolate;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:48px;padding:7px 8px;overflow:hidden;border:1px solid transparent;border-radius:9px;color:var(--cn-paper)}.codename-player:before{content:"";position:absolute;z-index:-1;inset:0;opacity:.28}.codename-player.role-spymaster:before{background:repeating-linear-gradient(135deg,transparent 0 11px,#b99a5b24 11px 12px),radial-gradient(circle at 93% 50%,transparent 0 8px,#b99a5b32 9px 10px,transparent 11px 15px,#b99a5b20 16px 17px,transparent 18px)}.codename-player.role-operative:before{background:radial-gradient(circle at 94% 42%,transparent 0 6px,#9fadb12c 7px 8px,transparent 9px),linear-gradient(45deg,transparent 82%,#9fadb124 83% 86%,transparent 87%)}.codename-player.role-spymaster{background:#121f25}.codename-player.role-operative{background:#27363e}.codename-player.is-me{border-color:#b99a5b99;background:#2b3030;box-shadow:inset 3px 0 var(--cn-brass)}.codename-player .user-avatar{width:34px;height:34px;min-width:34px;border-radius:50%}.codename-player.is-me .user-avatar{box-shadow:0 0 0 2px var(--cn-brass-light),0 0 0 5px #b99a5b25}.codename-player-copy{min-width:0}.codename-player strong,.codename-player small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.codename-player strong{font-size:.79rem;line-height:1.25}.codename-player.is-me strong{color:var(--cn-brass-light)}.codename-player small{display:flex;align-items:center;gap:5px;margin-top:2px;color:#aab7bb;font-size:.62rem}.role-mark{position:relative;display:inline-block;width:11px;height:11px;flex:0 0 11px}.role-spymaster .role-mark:before,.role-spymaster .role-mark:after{content:"";position:absolute;left:1px;width:9px;height:2px;background:var(--cn-brass);transform:skewX(-28deg)}.role-spymaster .role-mark:before{top:2px;box-shadow:0 4px var(--cn-brass)}.role-spymaster .role-mark:after{top:4px;width:6px}.role-operative .role-mark{border:2px solid #aebdc0;border-radius:50%}.role-operative .role-mark:after{content:"";position:absolute;width:5px;height:2px;right:-4px;bottom:-2px;background:#aebdc0;transform:rotate(45deg);transform-origin:left center}.you-mark{padding:3px 5px;border:1px solid #b99a5b66;border-radius:999px;color:var(--cn-brass-light);font:800 .51rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em}
.codenames-table{min-width:0}.codenames-command{min-height:84px;margin-bottom:12px;padding:12px 16px;border:1px solid #526269;border-left:5px solid var(--cn-blue);border-radius:12px;background:#152229;color:#f4f5ef;box-shadow:inset 0 1px #ffffff13,0 10px 24px #0711172b}.codenames-command.blue{border-color:#6295a8;border-left-color:#8cc1d3;background:linear-gradient(110deg,#3f7f97,#29566a),#315f72}.codenames-command.red{border-color:#a96167;border-left-color:#d67a7f;background:linear-gradient(110deg,#8a3e45,#632b32),#71333a}.codenames-clue-form{display:grid;grid-template-columns:minmax(160px,1fr) 94px auto;gap:10px;align-items:end;min-width:0}.codenames-clue-form label span{display:block;margin-bottom:5px;color:#c0cacb;font:700 .62rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em}.codenames-clue-form input,.codenames-clue-form select{width:100%;margin:0;border-color:#68777b;background:#f2f2eb;color:var(--cn-ink)}.codenames-waiting{display:grid;grid-template-columns:26px 1fr;align-items:center;min-height:58px}.codenames-waiting strong,.codenames-waiting small{grid-column:2}.codenames-waiting small{color:#d6e0e2}.codenames-waiting.is-your-turn strong{color:#f1dda9}.signal-pulse{grid-row:1/3;width:12px;height:12px;border-radius:50%;background:var(--cn-brass);box-shadow:0 0 0 7px #b99a5b22;animation:signal-pulse 1.5s ease-out infinite}.codenames-current-clue{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;min-height:58px}.codenames-current-clue>span{grid-column:1;color:#e3ecee;font:700 .65rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.12em}.codenames-current-clue strong{grid-column:1;font:900 clamp(1.5rem,4vw,2.5rem)/.9 "Arial Narrow",sans-serif}.codenames-current-clue>b{grid-column:2;grid-row:1/3;display:grid;place-items:center;width:52px;height:52px;border:1px solid #ead49b99;border-radius:50%;background:#192b34a6;color:#efd18b;font:900 1.5rem/1 ui-monospace,monospace}.codenames-current-clue small{grid-column:3;grid-row:1/3;color:#edf3f4}
.codenames-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.codenames-card{position:relative;min-width:0;overflow:hidden;border:2px solid #c7ccca;border-radius:10px;background:#e5e7e2;box-shadow:0 6px 16px #0b14192b;transition:transform .16s,border-color .16s,box-shadow .16s}.codenames-picture{display:block;width:100%;padding:0;border:0;background:#d5d9d6;cursor:zoom-in}.codenames-picture img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;transition:filter .18s,transform .18s}.codenames-card.can-contact .codenames-picture{cursor:pointer}.codenames-card.can-contact:hover,.codenames-card.can-contact:focus-within{z-index:2;transform:translateY(-3px);border-color:var(--cn-brass);box-shadow:0 12px 24px #0b141946}.codenames-card.is-selected{transform:translateY(-5px);border-color:var(--cn-brass-light);box-shadow:0 0 0 3px #b99a5b55,0 16px 30px #0b141955}.picture-number{position:absolute;z-index:6;left:5px;top:5px;padding:3px 5px;border-radius:4px;background:#132127d9;color:#fff;font:800 .58rem/1 ui-monospace,monospace}.picture-zoom{position:absolute;z-index:6;right:5px;top:5px;display:grid;place-items:center;width:25px;height:25px;padding:0;border:0;border-radius:50%;background:#f5f5efdf;color:#17242b;font-weight:900;cursor:zoom-in;opacity:0;transition:opacity .15s}.codenames-card:hover .picture-zoom,.picture-zoom:focus-visible{opacity:1}.identity-ribbon{position:absolute;z-index:3;inset:auto 0 0;display:flex;align-items:center;justify-content:center;gap:6px;padding:6px;background:#767d7de8;color:#fff;font:900 .64rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.05em}.identity-ribbon i{width:8px;height:8px;border-radius:50%;background:currentColor}.identity-red .identity-ribbon{background:#a43e43ed}.identity-blue .identity-ribbon{background:#376c83ed}.identity-assassin .identity-ribbon{background:#171b1ded}.codenames-card.is-revealed .codenames-picture img{filter:grayscale(.22) contrast(.86);transform:scale(.98)}.identity-cover{position:absolute;z-index:4;inset:0;display:grid;place-items:center;align-content:center;gap:6px;overflow:hidden;pointer-events:none;color:#fff;text-align:center;background:#777f80d9;backdrop-filter:saturate(.72)}.identity-cover:before,.identity-cover:after{content:"";position:absolute;inset:-24%;pointer-events:none}.identity-cover:before{opacity:.35;background:repeating-linear-gradient(128deg,transparent 0 13px,#fff 14px 15px,transparent 16px 27px);transform:rotate(-4deg)}.identity-cover:after{inset:8px;border:1px solid #ffffff55;border-radius:7px;box-shadow:inset 0 0 0 3px #11182028}.identity-red .identity-cover{background:#8f343bd9}.identity-blue .identity-cover{background:#285f77d9}.identity-neutral .identity-cover{background:#737a78d9}.identity-assassin .identity-cover{background:#111719e8}.agent-silhouette{position:relative;z-index:1;display:block;width:54%;max-width:72px;aspect-ratio:1/.82}.agent-silhouette i{position:absolute;left:50%;top:4%;width:28%;aspect-ratio:1;border:2px solid #ffffffaa;border-radius:50%;background:#111a20c7;transform:translateX(-50%);box-shadow:0 0 0 5px #ffffff12}.agent-silhouette:before{content:"";position:absolute;left:17%;right:17%;bottom:4%;height:52%;border:2px solid #ffffff99;border-radius:48% 48% 10% 10% / 70% 70% 14% 14%;background:#111a20c7;clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}.agent-silhouette:after{content:"";position:absolute;left:4%;right:4%;bottom:27%;height:1px;background:#ffffff70;box-shadow:0 7px #ffffff30}.identity-neutral .agent-silhouette i{border-radius:45% 55% 48% 52%;background:#e6e1d18c}.identity-neutral .agent-silhouette:before{background:#d8d5c476}.identity-assassin .agent-silhouette:before{background:#050708e8;clip-path:polygon(28% 0,72% 0,100% 100%,0 100%)}.identity-cover strong{position:relative;z-index:1;padding:4px 7px;border-top:1px solid #ffffff8a;border-bottom:1px solid #ffffff8a;font:900 clamp(.52rem,1.1vw,.72rem)/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em;text-shadow:0 1px 2px #0008}
.codenames-action-dock{position:sticky;z-index:20;bottom:12px;display:grid;grid-template-columns:auto minmax(170px,1fr) auto;gap:14px;align-items:center;margin:14px auto 0;padding:11px 12px;border:1px solid #796943;border-radius:14px;background:linear-gradient(100deg,#111d24f7,#1f3037f7);color:var(--cn-paper);box-shadow:0 16px 36px #09111599,0 0 0 1px #ffffff0b;backdrop-filter:blur(14px)}.codenames-action-dock.red{box-shadow:inset 4px 0 var(--cn-red),0 16px 36px #09111599}.codenames-action-dock.blue{box-shadow:inset 4px 0 var(--cn-blue),0 16px 36px #09111599}.dock-identity{min-width:126px;padding-right:13px;border-right:1px solid #ffffff1c}.dock-identity span,.dock-identity b{display:block}.dock-identity span{margin-bottom:4px;color:var(--cn-brass-light);font:800 .55rem/1 ui-monospace,monospace;letter-spacing:.15em}.dock-identity b{font:900 .75rem/1.2 "Arial Narrow",sans-serif;text-transform:uppercase}.dock-prompt b,.dock-prompt small{display:block}.dock-prompt small{margin-top:2px;color:var(--cn-muted);font-size:.7rem}.codenames-action-dock .actions{margin:0;flex-wrap:nowrap}.codenames-action-dock .play{border:1px solid #d6bd8366;background:var(--cn-brass);color:#121b20;box-shadow:0 7px 20px #080d1055}.codenames-action-dock .play:hover{background:var(--cn-brass-light)}.codenames-action-dock .quiet{border-color:#69777b;background:#26353b;color:#edf0ea}.spymaster-dock{grid-template-columns:auto minmax(0,1fr)}
.codenames-lightbox{position:fixed;z-index:110;inset:0;display:grid;place-items:center;padding:54px 18px;background:#0a1115ef;backdrop-filter:blur(10px)}.codenames-lightbox img{display:block;max-width:min(82vw,760px);max-height:78vh;border:8px solid #f1f2ec;border-radius:14px;box-shadow:0 28px 80px #000}.codenames-lightbox>button{position:absolute;right:24px;top:18px;width:44px;height:44px;border:1px solid #ffffff55;border-radius:50%;background:#17242b;color:#fff;font-size:1.7rem;cursor:pointer}.codenames-lightbox>span{position:absolute;bottom:18px;color:#fff;font:800 .75rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.15em}.codenames-result{padding:clamp(28px,6vw,70px);border:1px solid #53636b;border-radius:14px;background:#17242b;color:#eef1ed;text-align:center}.codenames-result.red{background:linear-gradient(135deg,#762f35,#17242b 70%)}.codenames-result.blue{background:linear-gradient(135deg,#28596f,#17242b 70%)}.codenames-result h3{margin:8px 0;font:900 clamp(2.3rem,7vw,5rem)/.92 "Arial Narrow",sans-serif;letter-spacing:-.04em}.codenames-result>p{color:#c4cccd}.codenames-result-rosters{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:720px;margin:30px auto 0;text-align:left}.review-board{margin-top:16px}@keyframes signal-pulse{70%{box-shadow:0 0 0 13px #b99a5b00}100%{box-shadow:0 0 0 0 #b99a5b00}}
@media (max-width:920px){.codenames-layout{grid-template-columns:1fr}.codenames-sidebar{position:static;grid-template-columns:1fr 1fr}.codenames-board{gap:6px}}
@media (max-width:650px){.codenames-setting-grid{grid-template-columns:1fr}.codenames-sidebar{grid-template-columns:1fr 1fr;gap:8px}.codename-team header{padding:8px 9px;font-size:.88rem}.codename-team header b{font-size:.58rem}.codename-roster{gap:4px;padding:5px}.codename-player{grid-template-columns:30px minmax(0,1fr);gap:7px;min-height:44px;padding:6px}.codename-player .user-avatar{display:block;width:30px;height:30px;min-width:30px}.codename-player strong{font-size:.7rem}.codename-player small{font-size:.54rem}.you-mark{position:absolute;right:4px;top:3px;padding:2px 4px;font-size:.43rem}.codename-player.is-me .codename-player-copy{padding-right:24px}.codenames-command{padding:10px}.codenames-current-clue{grid-template-columns:1fr auto}.codenames-current-clue small{display:none}.codenames-board{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.codenames-card{border-radius:7px}.identity-ribbon{padding:4px 2px;font-size:.46rem}.identity-cover{gap:2px}.identity-cover:after{inset:4px;border-radius:4px}.identity-cover strong{padding:3px 2px;font-size:.43rem;letter-spacing:.04em}.agent-silhouette{width:48%}.picture-number{font-size:.5rem}.picture-zoom{opacity:.9;width:22px;height:22px}.codenames-layout.has-action-dock{padding-bottom:136px}.codenames-action-dock{position:fixed;z-index:90;left:10px;right:10px;bottom:calc(70px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:0;padding:9px 10px;border-radius:13px}.dock-identity{grid-column:1/-1;min-width:0;padding:0 0 6px;border-right:0;border-bottom:1px solid #ffffff1c}.dock-identity span,.dock-identity b{display:inline}.dock-identity span{margin-right:7px}.dock-prompt b{font-size:.78rem}.dock-prompt small{font-size:.59rem}.codenames-action-dock .actions{gap:6px}.codenames-action-dock .actions button{padding:9px 10px;font-size:.72rem}.spymaster-dock{grid-template-columns:1fr}.spymaster-dock .codenames-clue-form{grid-template-columns:minmax(0,1fr) 70px auto;gap:6px}.spymaster-dock .codenames-clue-form label span{font-size:.5rem}.spymaster-dock .codenames-clue-form input,.spymaster-dock .codenames-clue-form select{height:38px;padding:7px;font-size:.75rem}.spymaster-dock .codenames-clue-form .play{padding:9px 10px;font-size:.72rem}.codenames-result-rosters{grid-template-columns:1fr}.codenames-lightbox img{max-width:94vw}.codenames-result{padding:34px 16px}}
@media (prefers-reduced-motion:reduce){.signal-pulse{animation:none}.codenames-card{transition:none}}

/* Player rows share one quiet dossier surface. Role is carried by the large emblem;
   turn ownership is the only animated layer. */
.codename-player.role-spymaster,.codename-player.role-operative{background:#27363e}
.codename-player:before{display:none}
.codename-player{grid-template-columns:40px minmax(0,1fr) 42px;min-height:54px}
.codename-player .user-avatar{width:40px;height:40px;min-width:40px}
.codename-player.is-me{background:#2b3030}
.codename-player>.user-avatar,.codename-player>.codename-player-copy,.codename-player>.role-emblem{position:relative;z-index:2}
.role-emblem{position:relative;display:grid;place-items:center;width:42px;height:42px;align-self:center;filter:drop-shadow(0 3px 5px #08101466)}
.role-emblem img{display:block;width:42px;height:42px;object-fit:contain}
.codename-player.is-active-operator{border-color:#ffffff26}
.codename-player.is-active-operator:after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:repeating-linear-gradient(110deg,transparent 0 16px,#ffffff08 17px 25px,transparent 26px 42px);background-size:42px 100%;animation:codename-operator-scan 1.25s linear infinite}
.codename-team-red .codename-player.is-active-operator{box-shadow:inset 3px 0 #a64449,inset 0 0 18px #a6444918}
.codename-team-blue .codename-player.is-active-operator{box-shadow:inset 3px 0 #3b7186,inset 0 0 18px #3b718618}
.codename-player.is-me.is-active-operator{box-shadow:inset 3px 0 var(--cn-brass),inset 0 0 20px #b99a5b1c}
@keyframes codename-operator-scan{from{background-position:0 0}to{background-position:42px 0}}
@media (max-width:650px){.codename-player{grid-template-columns:40px minmax(0,1fr) 40px;min-height:54px}.codename-player .user-avatar{display:block;width:40px;height:40px;min-width:40px}.role-emblem,.role-emblem img{width:40px;height:40px}}
@media (prefers-reduced-motion:reduce){.codename-player.is-active-operator:after{animation:none;background-position:center}}
@media (max-width:650px){.codenames-action-dock{bottom:calc(56px + env(safe-area-inset-bottom))}}

/* One continuous team field binds the clue and all twenty pictures together. */
.codenames-field{padding:10px;border:1px solid;border-radius:18px;box-shadow:inset 0 1px #ffffff18,0 16px 36px #07111738}
.codenames-field.blue{border-color:#8bb7c7;background:linear-gradient(145deg,#5693a9,#3e788e),#4b879d}
.codenames-field.red{border-color:#c28489;background:linear-gradient(145deg,#a45b62,#82434b),#925159}
.codenames-field .codenames-command{margin-bottom:10px;border:1px solid #ffffff20;border-radius:10px;background:none;box-shadow:inset 0 1px #ffffff12,0 5px 14px #07111724}
.codenames-field.blue .codenames-command{border-color:#9fc7d455;background:linear-gradient(120deg,#1b485c,#123446),#173f51}
.codenames-field.red .codenames-command{border-color:#d59a9e55;background:linear-gradient(120deg,#622b33,#421c23),#52242b}
@media (max-width:650px){.codenames-field{padding:6px;border-radius:13px}.codenames-field .codenames-command{margin-bottom:6px;border-radius:8px 8px 4px 4px}}

/* Illustrated mission silhouettes replace the static passport-photo bust. */
.agent-silhouette{position:relative;z-index:1;display:block;width:70%;max-width:92px;aspect-ratio:6/5}
.agent-silhouette:before,.agent-silhouette:after{content:none}
.agent-silhouette img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 4px #05090c70)}
.identity-blue .agent-silhouette img{transform:scaleX(-1)}
.identity-neutral .agent-silhouette img{opacity:.88}
.identity-assassin .agent-silhouette img{filter:drop-shadow(0 4px 5px #000)}

/* Revealed locations use full illustrated identity cards, with only the mission label overlaid. */
.identity-cover{display:block;background:#18252b;backdrop-filter:none}
.identity-cover:before{z-index:1;inset:0;opacity:.1;background:linear-gradient(135deg,#fff 0 1px,transparent 1px 15px);background-size:16px 16px;transform:none}
.identity-cover:after{z-index:2}
.identity-character{position:absolute;z-index:0;inset:0;display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.94) contrast(1.03)}
.identity-cover strong{position:absolute;z-index:3;left:7px;right:7px;bottom:7px;padding:6px 4px;border-top:1px solid #ffffffb0;border-bottom:1px solid #ffffffb0;background:#121a20c7;box-shadow:0 2px 8px #0007}
.identity-red .identity-cover strong{background:#711f27dc}
.identity-blue .identity-cover strong{background:#164a64dc}
.identity-neutral .identity-cover strong{background:#665c49dc}
.identity-assassin .identity-cover strong{background:#07090be8;color:#f0cbc8}
@media (max-width:650px){.identity-cover strong{left:4px;right:4px;bottom:4px;padding:4px 2px}}

/* A revealed identity changes silhouette as well as color: two distinct shields,
   an exact octagon for bystanders, and the full rectangle for the assassin. */
.codenames-card.is-identity-visible:not(.identity-assassin):not(.review-original){overflow:visible;border-color:transparent;border-radius:0;background:transparent;box-shadow:none}
.codenames-card.is-identity-visible:not(.identity-assassin):not(.review-original) .codenames-picture{background:transparent}
.codenames-card.is-identity-visible:not(.identity-assassin):not(.review-original) .codenames-picture img{opacity:0}
.codenames-card.is-identity-visible:not(.identity-assassin):not(.review-original) .identity-cover{inset:0 2px;filter:drop-shadow(0 0 1px #f3f1e9) drop-shadow(0 6px 5px #07111766)}
.codenames-card.is-identity-visible:not(.identity-assassin):not(.review-original) .identity-cover:after{display:none}
.codenames-card.identity-red.is-identity-visible:not(.review-original) .identity-cover{clip-path:none;-webkit-mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat;mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat}
.codenames-card.identity-blue.is-identity-visible:not(.review-original) .identity-cover{clip-path:none;-webkit-mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat;mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat}
.codenames-card.identity-neutral.is-identity-visible:not(.review-original) .identity-cover{inset:3px;clip-path:polygon(29.3% 0,70.7% 0,100% 29.3%,100% 70.7%,70.7% 100%,29.3% 100%,0 70.7%,0 29.3%)}
.codenames-card.identity-red.is-identity-visible:not(.review-original)::before,.codenames-card.identity-blue.is-identity-visible:not(.review-original)::before,.codenames-card.identity-neutral.is-identity-visible:not(.review-original)::before{content:"";position:absolute;z-index:3;inset:-2px 0;pointer-events:none}
.codenames-card.identity-red.is-identity-visible:not(.review-original)::before{background:#e05d64;-webkit-mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat;mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat}
.codenames-card.identity-blue.is-identity-visible:not(.review-original)::before{background:#73bdd8;-webkit-mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat;mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat}
.codenames-card.identity-neutral.is-identity-visible:not(.review-original)::before{inset:0;background:#fff4cf;clip-path:polygon(29.3% 0,70.7% 0,100% 29.3%,100% 70.7%,70.7% 100%,29.3% 100%,0 70.7%,0 29.3%)}
.codenames-card.identity-red.is-identity-visible:not(.review-original) .identity-cover,.codenames-card.identity-blue.is-identity-visible:not(.review-original) .identity-cover,.codenames-card.identity-neutral.is-identity-visible:not(.review-original) .identity-cover{filter:drop-shadow(0 6px 5px #07111766)}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original){overflow:visible;border-color:transparent;border-radius:0;background:transparent;box-shadow:none}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original) .codenames-picture{background:transparent}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original) .codenames-picture img{opacity:0}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original) .identity-cover{inset:0 2px;-webkit-mask:url('/assets/codenames-burst-assassin.svg') center/94% 96% no-repeat;mask:url('/assets/codenames-burst-assassin.svg') center/94% 96% no-repeat;filter:drop-shadow(0 7px 6px #000a)}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original) .identity-cover:after{display:none}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original)::before{content:"";position:absolute;z-index:3;inset:-2px 0;pointer-events:none;background:#020304;-webkit-mask:url('/assets/codenames-burst-assassin.svg') center/98% 100% no-repeat;mask:url('/assets/codenames-burst-assassin.svg') center/98% 100% no-repeat}
.codenames-card.identity-assassin.is-identity-visible:not(.review-original) .identity-cover strong{bottom:15%;left:12%;right:12%}
.codenames-card.identity-red.is-identity-visible:not(.review-original) .identity-cover strong,.codenames-card.identity-blue.is-identity-visible:not(.review-original) .identity-cover strong{bottom:14%;left:9%;right:9%}
.codenames-card.identity-neutral.is-identity-visible:not(.review-original) .identity-cover strong{bottom:9%;left:10%;right:10%}
.codenames-card.review-original{overflow:hidden;border:2px solid #c7ccca;border-radius:10px;background:#e5e7e2;box-shadow:0 6px 16px #0b14192b}
.codenames-card.review-original .identity-cover{display:none}
.codenames-card.review-original .codenames-picture img{opacity:1;filter:none;transform:none}

.codenames-outcome-gate{position:fixed;z-index:115;inset:0;display:grid;place-items:center;padding:20px;background:#071016e8;backdrop-filter:blur(9px)}
.codenames-outcome-card{position:relative;width:min(520px,100%);overflow:hidden;padding:42px 36px 34px;border:1px solid #796943;border-radius:20px;background:linear-gradient(150deg,#1c2b32,#101920);color:#eef1ed;text-align:center;box-shadow:0 30px 100px #000c}
.codenames-outcome-card.blue{border-color:#4f91aa;box-shadow:0 0 0 1px #3b71864d,0 30px 100px #000c}
.codenames-outcome-card.red{border-color:#bd555c;box-shadow:0 0 0 1px #a644494d,0 30px 100px #000c}
.codenames-outcome-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:var(--cn-brass)}
.codenames-outcome-card.red:before{background:var(--cn-red)}.codenames-outcome-card.blue:before{background:var(--cn-blue)}
.outcome-insignia{display:grid;place-items:center;width:82px;height:86px;margin:0 auto 22px;background:linear-gradient(145deg,#83bfd4,#24556c);clip-path:none;-webkit-mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat;mask:url('/assets/codenames-shield-blue.svg') center/100% 100% no-repeat;filter:drop-shadow(0 9px 8px #0007)}
.codenames-outcome-card.red .outcome-insignia{background:linear-gradient(145deg,#d77a80,#7e272f);-webkit-mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat;mask:url('/assets/codenames-shield-red.svg') center/78% 98% no-repeat}
.outcome-insignia i{display:grid;place-items:center;width:43px;height:43px;border:1px solid #4a350e66;border-radius:50%;background:#efd89a;color:#5c4317;font:900 1.65rem/1 Georgia,serif;box-shadow:0 4px 12px #0005}
.outcome-summary{margin:0 0 24px;padding:22px 20px 20px;border:2px solid #4f91aa;border-radius:16px;background:linear-gradient(135deg,#153f52,#0c2b3a);box-shadow:inset 0 1px #ffffff12,0 10px 24px #0003}
.codenames-outcome-card.red .outcome-summary{border-color:#bd555c;background:linear-gradient(135deg,#57232a,#35151b)}
.codenames-outcome-card h3{margin:0 auto 12px;max-width:420px;color:#fff;font:900 clamp(1.7rem,5vw,2.8rem)/1 "Arial Narrow",sans-serif;letter-spacing:-.03em}
.outcome-verdict{margin:0!important;font-size:1.05rem;font-weight:850}.outcome-verdict.won{color:#a9e58e!important}.outcome-verdict.lost{color:#ff979d!important}
.codenames-outcome-card .play{min-width:170px;background:var(--cn-brass);color:#121b20}

.review-board{perspective:1000px}.review-board .codenames-card{backface-visibility:hidden;transform-style:preserve-3d}
.review-board.is-flipping .codenames-card{animation:codenames-review-flip .44s ease-in-out both}
.review-board.is-flipping.flip-to-identity .codenames-card{border-color:transparent;background:transparent;box-shadow:none;transition:none}
.review-actions [data-action="codenames-toggle-review"]{border:1px solid #68777b;border-radius:9px;background:#26353b;color:#edf0ea}
@keyframes codenames-review-flip{0%{transform:rotateY(0)}49.999%{transform:rotateY(90deg)}50%{transform:rotateY(-90deg)}100%{transform:rotateY(0)}}
@media (max-width:650px){.codenames-card.review-original{border-radius:7px}.codenames-outcome-card{padding:32px 20px 26px}.outcome-insignia{width:70px;height:74px;margin-bottom:18px}.outcome-insignia i{width:37px;height:37px;font-size:1.4rem}.outcome-summary{padding:19px 14px 17px;border-radius:14px}.codenames-card.identity-red.is-identity-visible:not(.review-original) .identity-cover strong,.codenames-card.identity-blue.is-identity-visible:not(.review-original) .identity-cover strong{bottom:15%;left:7%;right:7%}}
@media (prefers-reduced-motion:reduce){.review-board.is-flipping .codenames-card{animation:none}}

/* Team dossiers stay two-up. The winning dossier leads the review and carries
   the only ceremonial accent: a brass crown rather than another large banner. */
.codenames-layout{grid-template-columns:380px minmax(0,1fr)}
.codename-roster{grid-template-columns:repeat(2,minmax(0,1fr))}
.codename-player{grid-template-columns:36px minmax(0,1fr) 34px;gap:7px;min-width:0;min-height:52px;padding:6px}
.codename-player .user-avatar{width:36px;height:36px;min-width:36px}
.codename-player .user-avatar.initial{font-size:1rem;line-height:1}
.role-emblem,.role-emblem img{width:34px;height:34px}
.codenames-result-rosters{max-width:960px;padding-top:48px}
.codenames-result-rosters .codename-team.is-winner{position:relative;overflow:visible;box-shadow:0 15px 34px #050a0e55}
.codenames-result-rosters .codename-team-red.is-winner{border-color:#c15a62;box-shadow:0 0 0 1px #c15a6240,0 15px 34px #050a0e55}
.codenames-result-rosters .codename-team-blue.is-winner{border-color:#6195aa;box-shadow:0 0 0 1px #6195aa40,0 15px 34px #050a0e55}
.codenames-result-rosters .codename-team-red.is-winner header{background:var(--cn-red);color:#fff}
.codenames-result-rosters .codename-team-blue.is-winner header{background:var(--cn-blue);color:#fff}
.codenames-result-rosters .codename-team.is-winner header{border-radius:12px 12px 0 0}
.winner-crown{position:absolute;z-index:5;left:50%;top:-47px;width:76px;height:54px;transform:translateX(-50%);filter:drop-shadow(0 6px 5px #070b0d99)}
.winner-crown svg{display:block;width:100%;height:100%;overflow:visible;fill:#e3b955;stroke:#6b4b12;stroke-width:2;stroke-linejoin:round}
.winner-crown .crown-body{fill:#e3b955}.winner-crown .crown-band{fill:#c99831}.winner-crown .crown-ridge{fill:none;stroke:#fff0aa;stroke-width:2.5}.winner-crown .crown-jewel{fill:#a64449;stroke:#5e1d23}
@media (max-width:1100px){.codenames-layout{grid-template-columns:1fr}.codenames-sidebar{position:static;grid-template-columns:1fr 1fr}}
@media (max-width:650px){
  .codenames-sidebar{grid-template-columns:1fr;gap:8px}
  .codename-roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .codename-player{grid-template-columns:40px minmax(0,1fr) 34px;gap:5px;min-height:50px;padding:5px}
  .codename-player .user-avatar{display:grid;width:40px;height:40px;min-width:40px}
  .codename-player .user-avatar.initial{font-size:1rem}
  .role-emblem,.role-emblem img{width:34px;height:34px}
  .codename-player strong{font-size:.66rem}.codename-player small{font-size:.5rem}
  .codenames-result-rosters{grid-template-columns:1fr;gap:10px;margin-top:20px;padding-top:42px}
  .winner-crown{top:-41px;width:66px;height:47px}
}
