/* SuiteFace Day Play: the same card room with the lights up. Night Play is the original theme.
   Mode comes from html[data-play]; set in <head> by play.js (Central Time: Day 7 am–7 pm, Night 7 pm–7 am,
   unless the visitor picked one). Felt tables, the marquee sign and playing cards stay as they are:
   they're objects in the room, so they look the same day or night. */
html[data-play="day"]{
  --night:#FBF6EC; --ink:#FFFFFF; --ink-2:#F3ECDF;
  --cream:#2B2730; --cream-dim:#4A4552; --muted:#6B6372;
  --gold-hi:#8F6410; --bulb:#B8862F; --red-soft:#B5122E;
  --line:rgba(43,39,48,.13);
  color-scheme:light;
}
/* Objects that keep their night colors (felt, signs, cards, rendered tables). */
html[data-play="day"] :is(.sign,.feltbox,.round,.mycard,.clip .stage,.ex .felt,.sft-wrap,.casbuild-art,.sfe,.tchatbox,.hand-box,.pchip,.sponsor-sign,.sfx,.slot,.pagespin,.launchbox,.stage,.tch-msg){
  --night:#17151B; --ink:#2B2730; --ink-2:#36313D;
  --cream:#FAF7F0; --cream-dim:#CFC6B6; --muted:#A69DB0;
  --gold-hi:#E8C46A; --bulb:#FFE7A3; --red-soft:#E5505E;
  --line:rgba(250,247,240,.12);
  color-scheme:dark; color:#FAF7F0;
}
html[data-play="day"] body{background:
  radial-gradient(1200px 600px at 50% -200px,rgba(232,196,106,.22),transparent 70%),
  radial-gradient(900px 500px at 100% 40%,rgba(47,138,98,.06),transparent 70%),
  var(--night)}
html[data-play="day"] body::before{background:var(--night)}

/* Header, sections, panels */
html[data-play="day"] .top{background:rgba(251,246,236,.88);box-shadow:0 1px 0 rgba(43,39,48,.06),0 10px 30px -24px rgba(43,39,48,.5)}
html[data-play="day"] .nav a:hover{background:#F3ECDF}
html[data-play="day"] .hero{background:radial-gradient(ellipse at 50% 0%,rgba(200,16,46,.10),transparent 60%),radial-gradient(ellipse at 50% 100%,rgba(47,138,98,.10),transparent 55%)}
html[data-play="day"] .sign{box-shadow:0 30px 70px -30px rgba(43,39,48,.55),0 0 0 1px rgba(184,134,47,.4)}
html[data-play="day"] .modal .box,html[data-play="day"] .lockcard,html[data-play="day"] .casbuild{box-shadow:0 24px 60px -30px rgba(43,39,48,.35)}
html[data-play="day"] .lockcard{background:repeating-linear-gradient(135deg,#FFFFFF 0 14px,#F7F1E5 14px 28px)}
html[data-play="day"] .casbuild{background:radial-gradient(120% 90% at 50% 0%,rgba(155,27,48,.10),transparent 60%),#FFFFFF}
html[data-play="day"] .modal{background:rgba(43,39,48,.45)}
html[data-play="day"] .toast{box-shadow:0 16px 40px -14px rgba(43,39,48,.5)}

/* Form fields */
html[data-play="day"] :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]){background:#FFFFFF;color:#2B2730;border-color:rgba(43,39,48,.22)}
html[data-play="day"] :is(input,textarea)::placeholder{color:#8C8494}
html[data-play="day"] :is(.sign,.feltbox,.tchatbox) :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]){background:#17151B;color:#FAF7F0;border-color:rgba(250,247,240,.2)}

/* Buttons: ghost buttons read dark-on-light; gold stays gold */
html[data-play="day"] .btn.ghost{color:#2B2730;border-color:rgba(43,39,48,.28)}
html[data-play="day"] :is(.sign,.feltbox,.round,.tchatbox,.hand-box) .btn.ghost{color:#FAF7F0;border-color:rgba(250,247,240,.3)}
html[data-play="day"] .chip{border-color:rgba(43,39,48,.2)}

/* Text that was hand-set light */
html[data-play="day"] .neon{color:#FFF4D6}
html[data-play="day"] .eyebrow{color:#8F6410}
html[data-play="day"] footer{background:#F5EEE1}
html[data-play="day"] .notice.good{color:#14553A}
html[data-play="day"] .notice.bad{color:#9B1B30}

/* Playing cards and card-like tiles stay cream with dark ink */
html[data-play="day"] :is(.pcard .back,.keeper,.seat.taken,.ans,.mini,.msg.them,.map-tip,.aclist,.ex .opt,.ex .mface,.ex .trumps li,.ex .bigcard,.ex .bub,.raise-out,.clip .bubble,.clip .face){background:#FAF7F0;color:#2B2730}
html[data-play="day"] :is(.ans,.ex .opt){box-shadow:0 6px 0 #D8CDB6}
html[data-play="day"] .chip[aria-pressed=true],html[data-play="day"] .chip.on{background:#2B2730;color:#FAF7F0;border-color:#2B2730}
html[data-play="day"] :is(.feltbox,.sign) .chip[aria-pressed=true]{background:#FAF7F0;color:#17151B;border-color:#FAF7F0}

/* Subpages (legal, guides, how cards work, private table) share the same tokens */
html[data-play="day"] .bar{background:rgba(251,246,236,.9)!important;border-bottom-color:rgba(43,39,48,.1)!important}
html[data-play="day"] :is(.bar a.home,.home){color:#2B2730}
html[data-play="day"] .sf-play-pill{background:#FFFFFF;color:#2B2730;border-color:rgba(43,39,48,.2)}

/* The Day/Night switch */
.sf-play{position:fixed;left:max(12px,env(safe-area-inset-left,0px));bottom:max(12px,env(safe-area-inset-bottom,0px));z-index:70;font:700 .82rem/1 "Figtree","Segoe UI",system-ui,sans-serif}
.sf-play-pill{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:.6rem .85rem;border-radius:999px;background:#2B2730;color:#FAF7F0;border:1px solid rgba(250,247,240,.2);box-shadow:0 10px 30px -14px rgba(14,12,17,.7)}
.sf-play-pill small{font-weight:600;opacity:.7}
.sf-play-pill:focus-visible{outline:3px solid #E8C46A;outline-offset:3px}
.sf-play-menu[hidden]{display:none!important}
.sf-play-menu{position:absolute;left:0;bottom:calc(100% + 8px);display:grid;gap:4px;min-width:220px;padding:6px;border-radius:16px;background:#FFFFFF;color:#2B2730;border:1px solid rgba(43,39,48,.14);box-shadow:0 20px 50px -20px rgba(14,12,17,.6)}
html[data-play="night"] .sf-play-menu{background:#2B2730;color:#FAF7F0;border-color:rgba(250,247,240,.16)}
.sf-play-menu button{all:unset;cursor:pointer;display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center;padding:.6rem .7rem;border-radius:10px}
.sf-play-menu button small{grid-column:2;font-weight:500;opacity:.7;font-size:.74rem}
.sf-play-menu button:hover,.sf-play-menu button:focus-visible{background:rgba(232,196,106,.22)}
.sf-play-menu button[aria-checked=true]{background:rgba(232,196,106,.32)}
html.sf-play-fade body{transition:background-color .6s ease,color .6s ease}
@media (max-width:560px){.sf-play-pill small,.sf-play-pill .t{display:none}.sf-play-pill{padding:.55rem .6rem}}
@media print{.sf-play{display:none}}

/* Wordmark outside the sign: "Suite"/"Face" letters that were cream turn card-ink */
html[data-play="day"] :is(.brand,footer) [fill="#FAF7F0"]{fill:#2B2730}
html[data-play="day"] :is(.brand,footer) [fill="#E9E2D6"]{fill:#3A333F}
html[data-play="day"] .casbuild .ticks{color:#4A4552}

/* Private Table page (its own inline styles) */
html[data-play="day"] main > .head h1,html[data-play="day"] main > h1,html[data-play="day"] .sub{color:#2B2730}
html[data-play="day"] main .about{color:#3A333F}
html[data-play="day"] main :is(.meta,.note){color:#5B5560}
html[data-play="day"] .bar a:not(.home){color:#8F6410}
html[data-play="day"] .bar .home{color:#2B2730}
html[data-play="day"] .sft-welcome{color:#2B2730;background:rgba(232,196,106,.14)}
html[data-play="day"] footer{color:#4A4552}
html[data-play="day"] .sf-credit{color:#5B5560!important}html[data-play="day"] .sf-credit a{color:#8F6410!important}