/* Shared site chrome. Keep sheet and card styling independent. */
@media screen{
 .masthead{--header-ink:#dbe4ed;--header-muted:#a4b3c6;display:flex;flex-wrap:nowrap;gap:22px;min-height:82px;padding:0 28px;background:#101925!important;border-bottom:1px solid #a68b554d!important;box-shadow:0 3px 12px #0002;position:relative}
 .masthead::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,#71c6df 0,#41697d 26%,#b69a62 65%,#b69a6220)}
 .masthead .brand{margin:0;gap:12px;flex:none;text-decoration:none;color:#f0eee8}
 .masthead .brand img{width:29px;height:34px;opacity:.85}
 .masthead .brand>span{font-size:17px;letter-spacing:.035em;line-height:1.3}
 .masthead .brand small{font-size:9px;letter-spacing:.18em;color:var(--header-muted);margin-top:5px}
 .masthead .nav{display:flex;flex:1;flex-basis:auto;order:0;justify-content:center;align-self:stretch;align-items:stretch;gap:2px;overflow:visible;margin:0}
 .masthead .nav button{position:relative;flex:0 1 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:0;border-radius:0;background:transparent;color:var(--header-muted);font:600 12px Overpass,sans-serif;letter-spacing:.045em;white-space:nowrap;box-shadow:none;min-height:44px}
 .masthead .nav button .icon{width:17px;height:17px;opacity:.75}
 .masthead .nav button.active{color:#e9d5a6;background:linear-gradient(0deg,#c4a46a12,transparent 75%);border:0}
 .masthead .nav button.active::after{content:'';position:absolute;bottom:0;left:13px;right:13px;height:2px;background:#d1b277}
 .masthead .nav button:hover{color:#fff;background:#ffffff08}
 .masthead .nav button:focus-visible,.masthead a:focus-visible,.site-menu-toggle:focus-visible{outline:2px solid #8ad0e4;outline-offset:-4px}
 .masthead .theme-picker{border-left:1px solid #8ca2b42b;padding-left:20px;gap:4px;color:var(--header-muted);margin-left:0}
 .masthead .theme-picker>span{font-size:9px;letter-spacing:.12em;text-transform:uppercase}
 .masthead .theme-picker select{min-height:30px;border:0;border-radius:0;padding:2px 20px 2px 0;background-color:transparent;color:var(--header-ink);font-size:12px;max-width:100px}
 .masthead .theme-picker option{background:#152130;color:#e3eaf0}
 .masthead .settings-link{height:44px;width:44px;min-width:44px;padding:12px;color:var(--header-muted);border:1px solid transparent;border-radius:5px;margin-left:-12px}
 .masthead .settings-link:hover{background:#ffffff08;border-color:#8ca2b42b;color:#fff}
 .site-menu-toggle{display:none}
 .topbar{height:40px;background:transparent!important;border-bottom:1px solid #8ca2b422;padding:0 28px}
 .topbar .breadcrumbs{font-size:11px;letter-spacing:.025em}
 .save-state{font-size:11px;white-space:nowrap;color:#96a89d}
 .sheet-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:18px;margin:0 0 16px;padding:0 0 14px;border-bottom:1px solid #8ca2b426;min-height:58px}
 .sheet-actions>a{font-size:12px;color:#b5c7d7;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;order:0}
 .sheet-actions>.top-actions{display:flex;align-items:center;gap:12px;order:1;margin:0}
 .sheet-actions>.row{order:2;flex-wrap:nowrap;gap:5px;width:auto}
 .sheet-actions .icon-action{width:40px;height:40px;min-height:40px;padding:9px!important;border:1px solid transparent;background:transparent;box-shadow:none;border-radius:4px;color:#b7c3d1}
 .sheet-actions .icon-action .icon{width:19px;height:19px;stroke-width:1.7}
 .sheet-actions .icon-action:hover{background:#ffffff09;border-color:#8ca2b44d;color:#f3e6c9;outline:none}
 .sheet-actions .icon-action.labelled-edit{width:auto;display:flex;align-items:center;gap:9px;padding:9px 15px!important;background:#294658;border-color:#658a98;box-shadow:inset 0 1px #ffffff0c;color:#ecf5f8;font-size:12px;font-weight:600}
 .sheet-actions .labelled-edit:hover{background:#34576a;border-color:#9bccd9}
 .sheet-actions .icon-action.danger{color:#af939a;margin-left:4px}
 .sheet-actions .icon-action.danger:hover{color:#f0b0b6;background:#ba687316}
 .sheet-actions .toolbar-divider{height:20px;margin:0 4px;background:#8ca2b433}
 .sheet-actions .top-actions button{height:36px;min-height:36px;padding:7px 9px;border:0;background:transparent;color:#aebdca;font-size:11px;box-shadow:none}
 .sheet-actions .top-actions button .icon{width:15px;height:15px}
 html[data-theme="paper"] .sheet-actions{border-color:#b8aa9044}
 html[data-theme="paper"] .sheet-actions>a,html[data-theme="paper"] .sheet-actions .top-actions button{color:#635b4d}
 html[data-theme="paper"] .sheet-actions .save-state{color:#586b55}
 html[data-theme="paper"] .sheet-actions .icon-action{background:transparent;border-color:transparent;box-shadow:none;color:#625a4e}
 html[data-theme="paper"] .sheet-actions .labelled-edit{background:#e5dcc8;border-color:#a9936b;color:#514025}
 html[data-theme="paper"] .sheet-actions .icon-action:hover{background:#c1ac7930;border-color:#b9a783}
 html[data-theme="paper"] .sheet-actions .danger{color:#98575b}
}
@media screen and (min-width:761px) and (max-width:1180px){
 .masthead{gap:12px;padding:0 20px;min-height:76px}
 .masthead .brand>span{font-size:14px}.masthead .brand small{font-size:8px}.masthead .brand img{width:25px}
 .masthead .nav button{padding:0 10px;font-size:11px}.masthead .nav button .icon{display:none}
 .masthead .theme-picker{padding-left:12px}
}
@media screen and (max-width:760px){
 .masthead,body:has(.wizard) .masthead{display:flex;flex-wrap:wrap;gap:8px;min-height:66px;padding:8px 12px!important}
 .masthead .brand,body:has(.wizard) .masthead .brand{flex:1;min-width:0;margin:0}
 .masthead .brand>span{font-size:15px}.masthead .brand small{font-size:8px;letter-spacing:.12em;display:block!important}.masthead .brand img{width:25px}
 .masthead .theme-picker{display:none}
 .masthead .settings-link{margin:0;width:40px;min-width:40px;height:44px}
 .site-menu-toggle{display:grid;place-items:center;width:44px;height:44px;padding:11px;order:2;background:transparent;border:1px solid #8ca2b42b;border-radius:4px;color:#c8d6e3}
 .site-menu-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5}
 .masthead .settings-link{order:1}
 .masthead .nav,body:has(.wizard) .masthead .nav{display:none;order:3;flex:0 0 100%}
 .masthead.navigation-open .nav,body:has(.wizard) .masthead.navigation-open .nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;border-top:1px solid #8ca2b433;padding:8px 0 2px}
 .masthead.navigation-open .theme-picker,body:has(.wizard) .masthead.navigation-open .theme-picker{display:flex;align-items:center;gap:16px;order:4;width:100%;border:0;border-top:1px solid #8ca2b422;padding:10px 12px 2px}
 .masthead.navigation-open .theme-picker>span{display:block}
 .masthead .nav button{justify-content:flex-start;padding:12px;min-height:44px;font-size:12px}
 .masthead .nav button .icon{display:block}
 .sheet-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;margin-bottom:10px;padding-bottom:10px}
 .sheet-actions>a{flex-basis:auto;font-size:11px;grid-column:1;grid-row:1}
 .sheet-actions>.top-actions{grid-column:2;grid-row:1;gap:2px}
 .sheet-actions .save-state{font-size:9px;max-width:160px;white-space:normal;text-align:right}
 .sheet-actions .top-actions button{width:36px;padding:8px;font-size:0}.sheet-actions .top-actions button span{display:none}
 .sheet-actions>.row{grid-row:2;grid-column:1/-1;display:flex;width:100%;justify-content:flex-end;gap:5px;flex-wrap:nowrap}
 .sheet-actions .row.wrap>button{flex-grow:0}
 .sheet-actions .icon-action{width:44px;height:44px;min-height:44px}
 .sheet-actions .icon-action.labelled-edit{margin-right:auto;width:auto;font-size:11px;padding:9px 11px!important;gap:7px}
 .sheet-actions .toolbar-divider{margin:0 1px}
}
@media screen and (min-width:761px) and (max-width:980px){
 .masthead{flex-wrap:wrap;padding-top:12px;gap:8px 16px}
 .masthead .brand{margin-right:auto}.masthead .nav{order:3;flex-basis:100%;min-height:44px}
 .masthead .nav button{flex:1}
 .sheet-actions .save-state{max-width:96px;white-space:normal;font-size:10px}
}
@media screen and (max-width:360px){
 .sheet-actions>.row{gap:2px}.sheet-actions .toolbar-divider{display:none}
 .sheet-actions .icon-action.labelled-edit{padding:8px!important;font-size:10px;gap:5px}
 .sheet-actions .icon-action.danger{margin-left:0}
}
@media print{.site-menu-toggle{display:none!important}}
@media screen{
 .sheet-actions .icon-action.labelled-edit{background:#294658!important;color:#ecf5f8!important}
 .sheet-actions .icon-action.labelled-edit:hover{background:#34576a!important}
 html[data-theme="paper"] .sheet-actions .icon-action.labelled-edit{background:#e5dcc8!important;border-color:#a9936b;color:#514025!important}
 html[data-theme="paper"] .sheet-actions .icon-action.labelled-edit:hover{background:#d9caaa!important}
}
@media screen{
 .masthead .nav button{font-size:14px;letter-spacing:.015em;padding-left:11px;padding-right:11px}
 .masthead .theme-picker select{border:1px solid #8399b0;border-radius:5px;background-color:#1d2b3d;padding:7px 10px;min-height:38px;max-width:115px;font-size:13px}
 .masthead .theme-picker>span{font-size:10px;color:#d1dce8}
 .sheet-identity{position:relative}
 .play-mode{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;padding:4px;gap:4px;border:1px solid #81744f;border-radius:7px;background:#121c29}
 .play-mode button{min-height:44px;padding:7px 17px;border:1px solid transparent;border-radius:4px;font:600 13px Overpass,sans-serif;white-space:nowrap}
 .play-mode button[aria-pressed=true]{background:#55492e;color:#f7e3af;border-color:#c6a45d;cursor:default}
 .play-mode button:disabled{opacity:1;background:transparent;color:#9ba6b7;cursor:not-allowed}
 .play-mode small{display:block;font-size:10px;color:inherit;line-height:1.2}
 html[data-theme=paper] .play-mode{background:#e9e2d5;border-color:#ac9770}
 html[data-theme=paper] .play-mode button[aria-pressed=true]{background:#dbca9e;color:#493a20}
 html[data-theme=paper] .play-mode button:disabled{color:#716b61}
}
@media screen and (min-width:981px) and (max-width:1180px){.masthead{gap:8px}.masthead .nav button{font-size:12px;padding:0 7px}}
@media screen and (max-width:980px){
 .play-mode{position:static;transform:none;order:5;margin:4px auto 0;width:max-content}
 .sheet-identity{flex-wrap:wrap}
 .masthead .nav button{font-size:13px}
}
@media print{.play-mode{display:none}}
@media screen and (max-width:980px){.sheet-identity>.play-mode{grid-column:1/-1;justify-self:center;margin:4px auto 0}}
@media screen and (min-width:981px){.sheet-identity .sheet-calling{max-width:calc(50% - 125px);overflow-wrap:anywhere}}
@media screen and (min-width:981px){.sheet-identity .identity-fields{margin-left:auto}}
.editor-phone-cancel{display:none}
@media screen and (max-width:760px){
 .editor-top-exit{display:none!important}
 .editor-phone-cancel{display:block;width:100%;min-height:44px;margin-top:12px;border:1px solid #a86670;border-radius:6px;background:#61313c;color:#ffe0e3;font:600 13px Overpass,sans-serif}
 .editor-phone-cancel:hover{background:#783e4b}
}
@media screen{
 .editor-top-exit{display:none!important}
 .editor-phone-cancel{display:block;width:100%;min-height:44px;margin-top:12px;border:1px solid #a86670;border-radius:6px;background:#61313c;color:#ffe0e3;font:600 13px Overpass,sans-serif}
 .editor-phone-cancel:hover{background:#783e4b}
}
@media screen{
 .wizard-footer{display:flex;align-items:center;gap:10px}
 .wizard-footer #wizard-back{margin-right:auto}
 .wizard-footer .editor-phone-cancel{display:block;width:auto;min-height:44px;margin:0;padding:10px 15px;font:inherit}
 .wizard-footer #wizard-next{min-height:44px}
 .wizard-footer .editor-phone-cancel,.wizard-footer #wizard-next{flex:0 0 auto;min-width:100px}
}
@media screen and (max-width:400px){
 .wizard-footer{gap:6px}
 .wizard-footer .editor-phone-cancel,.wizard-footer #wizard-next{min-width:0;flex:1;padding:10px}
 .wizard-footer #wizard-back{padding:10px}
}
/* Play modes echo the sheet's clipped trait banners. */
@media screen{
 .sheet-identity>.play-mode{border:0;border-radius:0;padding:3px;background:#7d765f;gap:2px;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
 .play-mode button{border:0;border-radius:0;background:#1a2634;min-width:92px;font-family:Eveleth,Overpass,sans-serif;font-size:11px;letter-spacing:.02em}
 .play-mode button[aria-pressed=true]{background:#3e3b2c;color:#ebd295;box-shadow:inset 0 -2px #c3a252}
 .play-mode button:disabled{background:#1a2634;color:#aeb8c6}
 .play-mode small{font-family:Overpass,sans-serif;font-size:10px;letter-spacing:0;margin-top:3px}
 html[data-theme=paper] .sheet-identity>.play-mode{background:#ad9b79}
 html[data-theme=paper] .play-mode button[aria-pressed=true]{background:#e6dcc1;color:#70531d}
 html[data-theme=paper] .play-mode button:disabled{background:#eee9df;color:#746e64}
}
@media screen{
 .play-mode,.sheet-identity>.play-mode{clip-path:none;border:1px solid #8a7954;border-radius:4px;padding:2px;gap:2px;background:#17212d}
 .play-mode button{border-radius:2px}
 .phone-play-mode{display:none}
 html[data-theme=paper] .play-mode,html[data-theme=paper] .sheet-identity>.play-mode{background:#eee9df}
}
@media screen and (max-width:760px){
 .sheet-identity>.play-mode{display:none}
 .phone-play-mode{display:flex;position:static;transform:none;width:max-content;margin:0 auto 12px}
}
/* Use the established choice palette, without a second gold outer frame. */
@media screen{
 .play-mode,.sheet-identity>.play-mode{border:1px solid #435065;background:#17212d;padding:3px;gap:3px;border-radius:6px}
 .play-mode button{border-radius:3px;border:1px solid transparent;min-height:44px}
 .play-mode button[aria-pressed=true]{background:#3d3a2e;border-color:#e1bf76;color:#ffe6a7;box-shadow:none}
 .play-mode button:disabled{background:transparent;color:#8e9bae}
 html[data-theme=paper] .play-mode,html[data-theme=paper] .sheet-identity>.play-mode{background:#f5f1e8;border-color:#c6bba5}
 html[data-theme=paper] .play-mode button[aria-pressed=true]{background:#e7dfcf;border-color:#b7a587;color:#514a3e;box-shadow:none}
 html[data-theme=paper] .play-mode button:disabled{background:transparent;color:#8a8174}
}
@media screen and (max-width:760px){
 .character-sheet .sheet-upper{padding-bottom:8px!important;margin-bottom:4px!important}
}