/* Forward Korea — Mission Board / Daily Quest v1.2
 * Canonical visual source: Drive / 06_ASSETS / PRODUCT_VISUALS / mission-boardgame-mobile-concept-v1.png
 * Theme switching is presentation-only. Never bind these rules to roll/quest state.
 */
:root {
  --board-bg:#FFF8E8;
  --board-surface:#FBF3E2;
  --board-tile:#FFFFFF;
  --board-tile-alt:#F4E9D0;
  --board-ink:#15130D;
  --board-muted:#746D5F;
  --board-border:#15130D;
  --board-shadow:#15130D;
  --board-red:#C92A2A;
  --board-blue:#0B3D91;
  --board-yellow:#FFD23F;
  --board-green:#2E7D32;
  --board-soft-blue:#DCEBFF;
  --board-radius:14px;
  --board-hard-shadow:5px 5px 0 var(--board-shadow);
}

[data-theme="night"] {
  --board-bg:#11110F;
  --board-surface:#181713;
  --board-tile:#211F1A;
  --board-tile-alt:#29261F;
  --board-ink:#F6EEDC;
  --board-muted:#B9AE99;
  --board-border:#E8DFCD;
  --board-shadow:#000000;
  --board-red:#E05252;
  --board-blue:#4F83D7;
  --board-yellow:#F2C84B;
  --board-green:#5CAD6F;
  --board-soft-blue:#233A59;
}

.today-section .wrap{max-width:980px}
.today-quest-shell{border:3px solid var(--board-border);border-radius:var(--board-radius);background:var(--board-bg);box-shadow:7px 7px 0 var(--board-shadow);padding:18px;position:relative;overflow:hidden}
.today-quest-shell::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.035;background-image:radial-gradient(currentColor .8px,transparent .8px);background-size:7px 7px;color:var(--board-ink)}
.today-quest-shell>*{position:relative}
.today-quest-intro{display:grid;grid-template-columns:1fr auto;align-items:end;gap:14px;margin-bottom:14px}
.today-quest-intro h3{font-size:clamp(28px,5vw,46px);line-height:1;margin:7px 0 5px;color:var(--board-ink)}
.today-quest-intro p{margin:0;color:var(--board-muted);font-weight:800;font-size:14px}
.today-quest-meta{font-family:'Archivo',sans-serif;font-weight:900;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--board-muted);text-align:right}

.board-wrap{margin:0;color:var(--board-ink)}
.lap-badge{display:flex;align-items:center;gap:10px;background:var(--board-tile);border:3px solid var(--board-border);border-radius:12px;box-shadow:3px 3px 0 var(--board-shadow);padding:9px 12px;margin-bottom:12px;color:var(--board-ink)}
.lap-flag{width:34px;height:34px;display:grid;place-items:center;flex:none}
.lap-flag svg{width:31px;height:31px;color:var(--board-ink)}
.lap-badge b{font-size:16px;display:block}
.lap-badge small{color:var(--board-muted);font-size:11px;font-weight:800}

.board-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;background:var(--board-surface);border:3px solid var(--board-border);border-radius:15px;box-shadow:5px 5px 0 var(--board-shadow);padding:8px}
.board-tile{position:relative;background:var(--board-tile);color:var(--board-ink);border:2.5px solid var(--board-border);border-radius:9px;min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:7px 4px;text-align:center;box-shadow:2px 2px 0 var(--board-shadow);overflow:visible}
.board-tile .tile-no{position:absolute;left:5px;top:3px;font-family:'Archivo',sans-serif;font-weight:900;font-size:10px;color:var(--board-muted)}
.board-tile .tile-icon{display:grid;place-items:center;width:26px;height:26px;color:var(--board-ink)}
.board-tile .tile-icon svg{width:24px;height:24px;display:block}
.board-tile .tile-label{font-size:9px;font-weight:900;line-height:1.24;word-break:keep-all;max-width:68px}
.board-tile .tile-category{font-family:'Archivo',sans-serif;font-size:7px;font-weight:900;letter-spacing:.08em;color:var(--board-muted);text-transform:uppercase}
.board-tile.tile-start{background:var(--board-red);color:#fff;border-color:var(--board-border)}
.board-tile.tile-start .tile-no,.board-tile.tile-start .tile-category{color:rgba(255,255,255,.78)}
.board-tile.tile-start .tile-icon{color:#fff}
.board-tile.tile-star{background:var(--board-yellow);color:#15130D}
.board-tile.tile-star .tile-no,.board-tile.tile-star .tile-category{color:#4d4310}
.board-tile.tile-ladder{background:var(--board-blue);color:#fff}
.board-tile.tile-ladder .tile-no,.board-tile.tile-ladder .tile-category{color:rgba(255,255,255,.8)}
.board-tile.tile-ladder .tile-icon{color:#fff}
.board-tile[data-category="local"] .tile-icon{color:var(--board-green)}
.board-tile[data-category="watch"] .tile-icon{color:var(--board-blue)}
.board-tile[data-category="share"] .tile-icon{color:var(--board-red)}
.board-tile[data-category="check"] .tile-icon{color:var(--board-blue)}
.board-tile.has-token{outline:3px solid var(--board-red);outline-offset:-3px;z-index:3}
[data-theme="night"] .board-tile.has-token{outline-color:var(--board-yellow)}

.board-token{position:absolute;top:-15px;right:-7px;width:34px;height:34px;z-index:4;display:grid;place-items:center;padding:2px;border:2px solid var(--board-border);border-radius:999px;background:var(--board-tile);filter:drop-shadow(2px 3px 0 rgba(0,0,0,.55))}
.board-token svg{width:100%;height:100%;overflow:visible}
.board-token .token-contrast-ring{paint-order:stroke fill;stroke:var(--board-tile);stroke-width:7px;stroke-linejoin:round}
.board-token.hop{animation:token-hop .32s ease}
@keyframes token-hop{0%{transform:translateY(-13px) scale(1.18)}60%{transform:translateY(2px) scale(.94)}100%{transform:none}}

.board-center{grid-row:2/5;grid-column:2/5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--board-bg);border:3px solid var(--board-border);border-radius:13px;padding:14px;position:relative;overflow:hidden}
.board-center::after{content:"SMALL ACTIONS · BIG CHANGES";position:absolute;right:8px;bottom:6px;font-family:'Archivo',sans-serif;font-size:7px;font-weight:900;letter-spacing:.11em;color:var(--board-muted);transform:rotate(-4deg)}
.board-dice{width:78px;height:78px;display:grid;place-items:center;background:transparent;border:0;border-radius:14px;filter:drop-shadow(5px 6px 0 var(--board-shadow));will-change:transform}
.board-dice svg{width:76px;height:76px;display:block}
.board-dice .dice-dark{display:none}
[data-theme="night"] .board-dice .dice-light{display:none}
[data-theme="night"] .board-dice .dice-dark{display:block}
.board-dice.rolling{animation:dice-shake .08s infinite}
@keyframes dice-shake{0%{transform:translate(-2px,-1px) rotate(-3deg)}50%{transform:translate(2px,1px) rotate(3deg)}100%{transform:translate(-1px,2px) rotate(-2deg)}}

.board-center .btn-yellow{min-width:168px;background:var(--board-red);color:#fff;border-color:var(--board-border);box-shadow:5px 5px 0 var(--board-shadow);font-size:15px}
.board-center .btn-yellow:disabled{background:var(--board-tile-alt);color:var(--board-muted)}
.board-center .btn-sm{background:var(--board-tile);color:var(--board-ink);border-color:var(--board-border)}
.board-result{margin:12px 0 0;font-weight:900;font-size:14px;line-height:1.5;min-height:22px;color:var(--board-ink)}

.daily-quest-card{margin-top:12px;text-decoration:none;border:3px solid var(--board-border);border-radius:12px;background:var(--board-tile);box-shadow:4px 4px 0 var(--board-shadow);padding:14px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;color:var(--board-ink)}
.daily-quest-card[data-state="idle"]{background:var(--board-tile-alt);cursor:default;pointer-events:none}
.daily-quest-card[data-state="assigned"]{transition:transform .14s var(--ease),box-shadow .14s var(--ease)}
.daily-quest-card[data-state="assigned"]:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--board-shadow)}
.daily-quest-symbol{width:42px;height:42px;border:2.5px solid var(--board-border);border-radius:50%;background:var(--board-yellow);display:grid;place-items:center;color:#15130D}
.daily-quest-symbol svg{width:25px;height:25px}
.daily-quest-copy strong{display:block;font-size:16px;line-height:1.25}
.daily-quest-copy small{display:block;color:var(--board-muted);font-size:11px;font-weight:800;margin-top:3px}
.daily-quest-cta{font-family:'Archivo',sans-serif;font-size:18px;font-weight:900;color:var(--board-red)}

.token-panel{margin-top:12px;background:var(--board-tile);border:3px solid var(--board-border);border-radius:12px;box-shadow:3px 3px 0 var(--board-shadow);padding:12px;color:var(--board-ink)}
.token-panel strong{display:block;margin-bottom:8px}
.token-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.token-row>span{flex:none;font-size:12px;font-weight:900;color:var(--board-muted);width:36px}
.token-opts{display:flex;gap:8px;flex-wrap:wrap}
.token-opt{width:44px;height:44px;display:grid;place-items:center;background:var(--board-bg);border:2.5px solid var(--board-border);border-radius:10px;box-shadow:2px 2px 0 var(--board-shadow);cursor:pointer;color:var(--board-ink)}
.token-opt svg{width:27px;height:27px;overflow:visible}
.token-opt.selected{outline:3px solid var(--board-red);outline-offset:1px;background:var(--board-tile)}
[data-theme="night"] .token-opt.selected{outline-color:var(--board-yellow)}
.slot-note{margin-top:10px;color:var(--board-muted);font-size:11px;font-weight:800;text-align:center}

@media(max-width:760px){
  .today-quest-shell{padding:12px}
  .today-quest-intro{grid-template-columns:1fr;align-items:start}
  .today-quest-meta{text-align:left}
  .board-grid{gap:4px;padding:6px}
  .board-tile{min-height:59px;padding:5px 2px}
  .board-tile .tile-label{font-size:8px;max-width:58px}
  .board-tile .tile-category{display:none}
  .board-tile .tile-icon{width:22px;height:22px}
  .board-tile .tile-icon svg{width:20px;height:20px}
  .board-dice{width:62px;height:62px}
  .board-dice svg{width:60px;height:60px}
  .board-center{padding:8px;gap:6px}
  .board-center::after{display:none}
  .board-center .btn-yellow{min-width:0;width:100%;font-size:12px;padding:9px 7px}
  .board-center .btn-sm{font-size:11px;padding:7px 8px}
  .daily-quest-card{grid-template-columns:auto 1fr;padding:11px}
  .daily-quest-cta{display:none}
}

@media(max-width:390px){
  .board-tile{min-height:54px}
  .board-tile .tile-label{font-size:7.6px;line-height:1.18}
  .board-token{width:26px;height:26px;top:-12px;right:-5px}
  .lap-badge{padding:8px 10px}
  .lap-badge b{font-size:14px}
}

@media(prefers-reduced-motion:reduce){
  .board-dice.rolling,.board-token.hop{animation:none!important}
}

/* Brightness control never touches the board.
   .brightness-scope is the only filtered content. */
