/* Same three palettes as justinfreres.com; scoped adapters preserve game semantics. */
:root[data-theme]{--jf-page:#f5f7fa;--jf-surface:#fff;--jf-alt:#edf1f6;--jf-text:#17263b;--jf-secondary:#45566d;--jf-accent:#204fac;--jf-border:#ced7e3;--jf-on-accent:#fff;color-scheme:light}
:root[data-theme="midnight"]{--jf-page:#101b2b;--jf-surface:#17263b;--jf-alt:#1b2e46;--jf-text:#f1f5fc;--jf-secondary:#c0cee0;--jf-accent:#94c4ff;--jf-border:#38506b;--jf-on-accent:#101b2b;color-scheme:dark}
:root[data-theme="editorial"]{--jf-page:#f4efe6;--jf-surface:#fffcf6;--jf-alt:#eae2d5;--jf-text:#302b25;--jf-secondary:#655646;--jf-accent:#7c3b28;--jf-border:#cdbfab;color-scheme:light}
html[data-theme] body{background:var(--jf-page);color:var(--jf-text)}
.jf-appearance{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;margin:0;font:600 12px/1.4 Arial,Helvetica,sans-serif;letter-spacing:normal;color:var(--jf-secondary);white-space:nowrap}
.jf-appearance select,html[data-theme] .theme-control select{display:inline-block;width:auto;max-width:100%;min-height:40px;padding:8px;border:1px solid var(--jf-border);border-radius:6px;background:var(--jf-surface);color:var(--jf-text);font:inherit;cursor:pointer}
[data-appearance-host]{display:flex;justify-content:flex-end;align-items:center;flex-shrink:0}
.jf-profile-mark{display:inline-flex!important;align-items:center;justify-content:center;width:40px!important;height:40px!important;min-width:40px;overflow:hidden;border-radius:50%;background:var(--jf-surface);padding:0!important;letter-spacing:0;box-shadow:none!important}
.jf-profile-mark img{display:block;width:100%!important;height:100%!important;object-fit:cover;filter:none!important}
.jf-portfolio-portrait{width:min(100%,320px);height:auto;aspect-ratio:1;border-radius:20px;object-fit:cover;display:block;margin:0 auto 24px;border:1px solid var(--jf-border)}
html[data-theme] :is(a,button,input,textarea,select,summary):focus-visible{outline:3px solid var(--jf-accent);outline-offset:3px}
/* Course surfaces, including instructor forms and navigation. */
html[data-jf-site="courses"]{--paper:var(--jf-page);--ink:var(--jf-text);--muted:var(--jf-secondary);--green:var(--jf-accent);--line:var(--jf-border)}
html[data-jf-site="courses"] :is(.coursecard,.panel,.coursedrop,input,textarea,select){background:var(--jf-surface);color:var(--jf-text);border-color:var(--jf-border)}
html[data-jf-site="courses"] :is(.bottompanel,.notice,.coursecode){background:var(--jf-alt);color:var(--jf-text)}
html[data-jf-site="courses"] :is(.coursedrop a,.coursedrop strong){color:var(--jf-text)}
html[data-jf-site="courses"] .heroaside{background:var(--jf-alt);color:var(--jf-text);border:1px solid var(--jf-border)}
html[data-jf-site="courses"] .heroaside :is(.pill,small,p){color:var(--jf-secondary)}
html[data-jf-site="courses"] .button,html[data-jf-site="courses"] .hero .button{background:var(--jf-accent);color:var(--jf-on-accent)}
html[data-jf-site="courses"] .logo{background:var(--jf-accent);color:var(--jf-on-accent)}
html[data-jf-site="courses"] .example-watermark{color:color-mix(in srgb,var(--jf-text) 10%,transparent)}
html[data-jf-site="courses"] header{flex-wrap:wrap;padding-top:18px;padding-bottom:18px}
html[data-jf-site="courses"] nav{flex:1;min-width:0}
/* Balloon answers retain their distinct colors; surrounding UI follows the palette. */
html[data-jf-site="balloon"] :is(.panel,.scoreboard>div){background:var(--jf-surface);color:var(--jf-text);border-color:var(--jf-border)}
html[data-jf-site="balloon"] :is(h1,.brand strong,.scoreboard strong){color:var(--jf-text)}
html[data-jf-site="balloon"] :is(.intro,.hint,.stat-label,footer){color:var(--jf-secondary)}
html[data-jf-site="balloon"] #feedback{color:var(--jf-secondary)}
html[data-jf-site="balloon"] :is(.quiet,.eyebrow,.best){background:var(--jf-alt);color:var(--jf-text)}
html[data-jf-site="balloon"] .primary{background:var(--jf-accent);color:var(--jf-on-accent)}
html[data-jf-site="balloon"] .app>[data-appearance-host]{margin-bottom:-10px}
/* 52 playing-card suits and the green playing surface remain recognizable. */
html[data-jf-site="fulldeck"] :is(.lobby,.arena,input){background:var(--jf-surface);color:var(--jf-text);border-color:var(--jf-border)}
html[data-jf-site="fulldeck"] :is(.invitation,.avatar){background:var(--jf-alt);color:var(--jf-text)}
html[data-jf-site="fulldeck"] :is(.textButton,.secondary,.room,h1 em){color:var(--jf-accent)}
html[data-jf-site="fulldeck"] :is(.intro p,.invitation p,.caption,.note,.divider,footer,.connection,.player p,h3 small,.room small,.round){color:var(--jf-secondary)}
html[data-jf-site="fulldeck"] :is(.soloNote,.phaseLoop>span,.phaseLoop small,.phaseLoop b,.actionBar>p,.history,.rules p){color:var(--jf-secondary)}
html[data-jf-site="fulldeck"] .phaseLoop .active{color:var(--jf-accent);border-color:var(--jf-accent)}
html[data-jf-site="fulldeck"] .phaseLoop .active small{color:var(--jf-accent)}
html[data-jf-site="fulldeck"] .rules{background:var(--jf-alt);color:var(--jf-text)}
html[data-jf-site="fulldeck"] .soloButton:hover:enabled{background:var(--jf-alt)}
html[data-jf-site="fulldeck"] input::placeholder{color:var(--jf-secondary)}
html[data-jf-site="fulldeck"] footer>span:first-child{color:var(--jf-secondary)}
html[data-jf-site="fulldeck"] .primary{background:var(--jf-accent);color:var(--jf-on-accent);border-color:var(--jf-accent)}
html[data-jf-site="fulldeck"] .primary:hover:enabled{filter:brightness(.95)}
html[data-jf-site="fulldeck"] body>[data-appearance-host]{max-width:1440px;margin:auto;padding:12px 5% 0}
/* Tactical map and faction colors are unchanged; theme the command surfaces. */
html[data-jf-site="tidal"] :is(.command-header,.mission-card,.result-card,.tactical-bar,.force-panel,.build-panel,.force-deck,.graphics-control select){background:var(--jf-surface);color:var(--jf-text);border-color:var(--jf-border);backdrop-filter:none}
html[data-jf-site="tidal"] :is(.mission-card,.result-card) :is(h1,h2,p,.eyebrow,.quick-start){color:var(--jf-text)}
html[data-jf-site="tidal"] :is(.game-title,.game-title b,.game-title small,.graphics-control,.resource-strip span,.resource-strip strong,.panel-title,.panel-title small,#orderReadout){color:var(--jf-text)}
html[data-jf-site="tidal"] :is(.order-button,.pause-button,#worldButton,.primary-action){background:var(--jf-accent);color:var(--jf-on-accent);border-color:var(--jf-accent)}
html[data-jf-site="tidal"] .command-header{flex-wrap:wrap;gap:12px}
html[data-jf-site="tidal"] :is(.resource-strip>div,.matchup,.mission-card kbd){background:var(--jf-alt);color:var(--jf-text);border-color:var(--jf-border)}
html[data-jf-site="tidal"] :is(.matchup b,.matchup span,.force-deck h2,.force-deck h2 span,.force-deck h2 small,footer){color:var(--jf-secondary)}
html[data-jf-site="tidal"] .order-button b{color:var(--jf-on-accent)}
html[data-jf-site="tidal"] .crest{color:var(--jf-accent);border-color:var(--jf-accent)}
html[data-jf-site="tidal"] .deck-column{background:var(--jf-surface);border-color:var(--jf-border)}
html[data-jf-site="tidal"] .section-heading :is(span,small){color:var(--jf-secondary)}
/* These two elements have legacy inline colors. */
html[data-jf-site="tidal"] .matchup b,html[data-jf-site="tidal"] footer{color:var(--jf-secondary)!important}
@media(max-width:600px){.jf-appearance{font-size:11px}.jf-appearance select{min-height:40px}html[data-jf-site="courses"] header{gap:12px}html[data-jf-site="courses"] header>[data-appearance-host]{width:100%}html[data-jf-site="courses"] .coursedrop{left:auto;right:0;min-width:min(275px,calc(100vw - 40px))}}
@media print{[data-appearance-host],.theme-control{display:none!important}html[data-jf-site="courses"]{--jf-page:#fff;--jf-surface:#fff;--jf-alt:#f5f5f5;--jf-text:#111;--jf-secondary:#333;--jf-border:#bbb}html[data-jf-site="courses"] .example-watermark{color:rgba(50,50,50,.12)}}
