/* The common DareTap playground. All artwork is decorative; scores come from the boards. */
.arcade-hero {
  position: relative; isolation: isolate; display: grid; grid-template-columns: 1.05fr 1fr;
  align-items: center; gap: 12px; min-height: 470px; margin: 28px 0 0; padding: 48px 42px;
  color: #fffaf0; background: #7041e7; border: 2px solid #30213f; border-radius: 28px;
  box-shadow: 5px 6px #30213f; overflow: hidden;
}
.arcade-hero::before { content: ''; position: absolute; z-index: -1; inset: 0; opacity: .2; background-image: radial-gradient(#fff 1px,transparent 1px); background-size: 22px 22px; mask-image: linear-gradient(to right,transparent 30%,#000); }
.arcade-hero-copy { position: relative; z-index: 2; min-width: 0; }
.arcade-kicker { display: block; font-size: 11px; font-weight: 700; letter-spacing: .11em; line-height: 1.6; }
.arcade-hero .arcade-kicker { color: #fff0ba; }
.arcade-hero h1 { font-size: clamp(54px,6.5vw,88px); line-height: .99; letter-spacing: -.065em; margin: 24px 0; color: #fffaf0; }
.arcade-hero h1 span { display: block; color: #d0fc7e; transform: rotate(-3deg); transform-origin: left center; margin-top: 10px; }
.arcade-hero-copy > p { color: #f3eaff; font-size: 16px; line-height: 1.7; max-width: 440px; margin: 28px 0; }
.arcade-hero .actions { gap: 22px; }
.arcade-hero .button { min-height: 52px; padding: 14px 20px; font-size: 14px; gap: 25px; }
.arcade-hero .button span { font-size: 23px; line-height: 1; }
.arcade-secondary { display: inline-flex; align-items: center; gap: 12px; padding-block: 12px; font-size: 13px; color: #fffaf0; font-weight: 700; }
.arcade-secondary:hover { text-decoration: underline; text-underline-offset: 5px; }
.arcade-guest { display: flex; align-items: center; gap: 8px; color: #f4eaff; font-size: 12px; margin-top: 24px; }
.arcade-guest > span { color: #d0fc7e; font-size: 22px; }
.arcade-stage { position: relative; min-width: 0; display: grid; place-items: center; align-self: stretch; }
.arcade-sun { position: absolute; width: 85%; aspect-ratio: 1; max-width: 395px; background: #ffdf70; border: 2px solid #30213f; border-radius: 50%; box-shadow: 14px 12px #4d269f; }
.arcade-sun::after { content: ''; position: absolute; inset: -15px; border: 1px dashed #ffecb8aa; border-radius: 50%; }
.arcade-podium { position: relative; z-index: 1; width: 112%; max-width: 600px; height: auto; transform: rotate(2deg); filter: drop-shadow(0 12px 0 #3e206930); }
.arcade-sticker { position: absolute; z-index: 2; top: 5px; right: -18px; padding: 12px 17px; background: #ffaccc; color: #30213f; font-size: 13px; font-weight: 700; border: 2px solid #30213f; box-shadow: 4px 4px #30213f; transform: rotate(9deg); border-radius: 7px; }
.arcade-star { position: absolute; line-height: 1; }
.arcade-star.star-one { top: 24px; left: -6px; font-size: 75px; color: #c5fa74; transform: rotate(-12deg); }
.arcade-star.star-two { bottom: 22px; right: -16px; font-size: 58px; color: #ffaccc; }
.arcade-stage-label { position: absolute; z-index: 2; bottom: 0; right: 12%; font-size: 11px; font-weight: 700; letter-spacing: .14em; transform: rotate(-4deg); background: #30213f; border-radius: 5px; padding: 8px 16px; }
.arcade-home h1 { font-size: clamp(48px,5.1vw,72px); }
.arcade-home .crew-carousel { position: relative; z-index: 1; }
.arcade-home .carousel-kicker { color: #fff0ba; }
.arcade-loop { display: grid; grid-template-columns: repeat(3,1fr); padding: 16px 28px; margin: 22px 0 0; list-style: none; border-block: 2px solid var(--ink); }
.arcade-loop li { display: flex; align-items: center; justify-content: center; gap: 15px; font-size: 23px; line-height: 1.1; font-weight: 700; letter-spacing: -.035em; color: var(--text); }
.arcade-loop li + li { border-left: 1px solid var(--line); }
.arcade-loop li > span { font-size: 11px; color: var(--muted); letter-spacing: .05em; }
.arcade-loop b { color: #7041e7; font-size: 26px; margin-left: auto; margin-right: 22px; }
.arcade-loop li:first-child { justify-content: start; }
.arcade-loop li:not(:first-child) { padding-left: 26px; }
.arcade-invitations { margin: 52px 0 60px; }
.arcade-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.arcade-section-heading h2 { font-size: clamp(28px,3.5vw,42px); line-height: 1.1; margin: 10px 0 0; letter-spacing: -.055em; }
.arcade-section-heading p { margin: 12px 0 0; font-size: 14px; }
.arcade-section-heading .eyebrow { font-size: 10px; letter-spacing: .14em; }
.arcade-heading-star { font-size: 52px; color: #7041e7; transform: rotate(12deg); }
.arcade-play-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.arcade-play-card { position: relative; isolation: isolate; display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; padding: 29px; min-height: 270px; border: 2px solid #30213f; border-radius: 20px; box-shadow: 4px 5px #30213f; color: #30213f; overflow: hidden; }
.arcade-play-card > div:first-child { position: relative; z-index: 2; min-width: 0; }
.arcade-tap { background: #ffb5cf; }
.arcade-puzzle { background: #a7e6e0; }
.arcade-play-card h3 { font-size: clamp(25px,2.6vw,36px); letter-spacing: -.05em; margin: 16px 0 14px; }
.arcade-play-card p { color: #4d354b; font-size: 13px; line-height: 1.65; margin-bottom: 24px; }
.arcade-play-card .arcade-kicker { font-size: 10px; letter-spacing: .05em; }
.arcade-card-cta { display: flex; align-items: center; gap: 15px; font-size: 13px; font-weight: 700; }
.arcade-card-cta b { display: grid; place-items: center; width: 34px; height: 34px; background: #30213f; color: #fff; border-radius: 50%; font-size: 22px; transition: transform .2s; }
.arcade-play-art { position: relative; height: 100%; min-width: 0; align-self: stretch; }
.arcade-play-art img { position: absolute; bottom: -25px; left: -15%; width: 160%; max-width: none; height: 250px; object-fit: contain; transform: rotate(8deg); transition: transform .2s; }
.arcade-timer { position: absolute; font-size: 45px; font-weight: 700; color: #30213f; letter-spacing: -.07em; top: -8px; right: -13px; padding: 4px 15px; background: #fff0ab; border: 2px solid #30213f; border-radius: 12px; transform: rotate(9deg); box-shadow: 3px 3px #30213f; }
.arcade-puzzle-grid { display: grid; grid-template-columns: repeat(3,1fr); position: absolute; top: -16px; right: -18px; width: 110px; height: 110px; border: 2px solid #30213f; background: #fffaf0; border-radius: 8px; padding: 5px; transform: rotate(12deg); box-shadow: 4px 4px #30213f; }
.arcade-puzzle-grid i { font-style: normal; text-align: center; border: 1px solid #d8c8e7; font-size: 18px; font-weight: 700; }
.arcade-play-card:hover { transform: translateY(-4px); box-shadow: 5px 9px #30213f; }
.arcade-play-card:hover .arcade-card-cta b { transform: rotate(45deg); }
.arcade-play-card:hover .arcade-play-art img { transform: rotate(3deg) translateY(-3px); }
.hall-boards { scroll-margin-top: 16px; }
.hall-mini-crown { display: grid; place-items: center; width: 68px; height: 68px; background: #ffe375; color: #30213f; border: 2px solid #30213f; border-radius: 18px; font-size: 44px; transform: rotate(7deg); }
.hall-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.hall-controls .board-choices { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0; gap: 8px; }
.hall-controls .board-choices a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; border-radius: 10px; padding: 9px 15px; font-size: 12px; font-weight: 700; color: var(--text); background: var(--surface); border: 1px solid var(--line); }
.hall-controls .board-choices a[aria-current] { background: #30213f; color: #fff; border-color: #30213f; }
.hall-controls .board-choices a:hover { border-color: #7041e7; }
.hall-controls .board-choices a > span { font-size: 18px; }
.hall-controls .period-tabs { margin: 0; gap: 3px; padding: 4px; border: 1px solid var(--line); background: var(--surface); border-radius: 25px; }
.hall-controls .period-tabs a { display: flex; align-items: center; min-height: 36px; border: 0; font-size: 11px; padding: 8px 12px; color: var(--text); }
.hall-controls .period-tabs a[aria-current] { background: #e9defe; color: #4e269b; }
.hall-board-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px; }
.hall-board-grid:not([data-family=all]) { grid-template-columns: minmax(0,1fr); }
.hall-board { border: 2px solid var(--ink); border-radius: 20px; box-shadow: 4px 5px #30213f; background: var(--surface); overflow: hidden; min-width: 0; display: flex; flex-direction: column; }
.hall-board-header { display: flex; gap: 15px; align-items: center; padding: 24px; border-bottom: 2px solid #30213f; background: #e9dfff; color: #30213f; }
.hall-puzzle-board .hall-board-header { background: #ffe99c; }
.hall-board-header h3 { font-size: 26px; margin: 6px 0 0; }
.hall-board-header .eyebrow { font-size: 9px; color: #5e436e; }
.hall-board-icon { display: grid; place-items: center; width: 46px; height: 46px; flex: 0 0 auto; background: #fffaf0; border: 2px solid #30213f; border-radius: 12px; font-size: 29px; color: #30213f; }
.hall-board-body { padding: 26px; display: flex; flex-direction: column; align-items: start; flex: 1; }
.hall-board-body > p { font-size: 14px; }
.hall-board-body > .button, .hall-board-body > .actions { margin-top: auto; }
.hall-empty { width: 100%; padding: 15px 0 28px; }
.hall-empty h4 { font-size: 27px; letter-spacing: -.045em; line-height: 1.15; margin: 21px 0 12px; max-width: 360px; }
.hall-empty p { font-size: 14px; line-height: 1.75; margin-bottom: 4px; max-width: 430px; }
.hall-chain-doodle { display: flex; align-items: center; padding-left: 7px; }
.hall-chain-doodle span { display: grid; place-items: center; width: 51px; height: 51px; border: 2px solid #30213f; border-radius: 14px; transform: rotate(-12deg); background: #c5fa74; color: #30213f; font-size: 31px; box-shadow: 3px 3px #30213f; }
.hall-chain-doodle span + span { margin-left: -4px; background: #cfb9ff; transform: rotate(9deg); }
.hall-chain-doodle span:last-child { background: #ffb5cf; transform: rotate(-9deg); }
.hall-empty-star { font-size: 67px; line-height: 1; color: #8558df; }
.hall-puzzle-board .hall-empty { padding-top: 24px; }
.hall-rules { font-size: 12px; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 16px; width: 100%; }
.hall-rules summary { cursor: pointer; color: var(--text); font-weight: 700; padding-block: 12px; min-height: 44px; }
.hall-rules summary:focus-visible { outline: 3px solid #ff784f; outline-offset: 4px; border-radius: 3px; }
.hall-rules p { font-size: 12px; line-height: 1.8; margin: 12px 0 0; }
.hall-inline-link { color: #6330c6; font-size: 12px; font-weight: 700; padding-block: 10px; text-decoration: underline; text-underline-offset: 4px; }
.hall-inline-link:hover { color: #401884; }
.hall-notice { background: #f1eaff; border-left: 3px solid #7041e7; color: #533981; padding: 10px 12px; border-radius: 3px; }
.hall-chain-list,.hall-daily { list-style: none; padding: 0; margin: 5px 0 25px; width: 100%; }
.hall-chain-row { display: flex; gap: 15px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.hall-chain-row > div { min-width: 0; }
.hall-rank { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 auto; background: #e9dfff; border-radius: 10px; color: #503878; font-size: 14px; font-weight: 700; }
.hall-chain-row:first-child .hall-rank,.hall-daily li:first-child .hall-rank { background: #ffe375; color: #30213f; }
.hall-chain-row h4 { font-size: 20px; line-height: 1.3; margin: 7px 0; overflow-wrap: anywhere; }
.hall-chain-row .record-value { display: inline; font-size: 22px; color: var(--text); }
.hall-chain-row p { font-size: 12px; margin-bottom: 4px; }
.hall-chain-row .eyebrow { font-size: 9px; }
.hall-chain-row .actions { gap: 15px; }
.hall-daily li { display: flex; align-items: center; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.hall-daily li > strong { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 16px; }
.hall-daily-value { font-size: 23px; font-weight: 700; white-space: nowrap; }
.hall-daily-value small { display: block; font-size: 11px; font-weight: 400; text-align: right; color: var(--muted); }
.hall-verified { grid-column: 1/-1; background: #f0e8ff; border: 2px dashed #bca5de; border-radius: 20px; padding: 28px; }
.hall-verified-heading { display: flex; align-items: center; gap: 15px; margin-bottom: 16px; }
.hall-verified h3 { font-size: 27px; margin: 6px 0 0; }
.hall-verified > p { font-size: 14px; margin: 0; max-width: 720px; }
.hall-record-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.hall-record { padding: 22px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; display: flex; flex-direction: column; gap: 8px; min-width: 0; overflow-wrap: anywhere; }
.hall-record h4 { font-size: 23px; line-height: 1.2; margin: 8px 0; letter-spacing: -.03em; }
.hall-record p { margin: 0; }
.hall-record .record-value { font-size: 45px; color: #6330c6; line-height: 1.2; }
.hall-privacy { display: grid; grid-template-columns: 130px 1fr auto; align-items: center; gap: 26px; padding: 30px; margin: 46px 0; border: 2px solid var(--ink); border-radius: 20px; background: var(--surface); box-shadow: 4px 5px #30213f; }
.hall-privacy img { width: 140px; height: 180px; object-fit: contain; transform: rotate(-7deg); }
.hall-privacy h2 { font-size: 34px; margin: 10px 0 13px; }
.hall-privacy p { font-size: 14px; line-height: 1.7; margin-bottom: 0; }
.hall-privacy .hall-rules { margin-top: 15px; padding-top: 10px; }
.hall-privacy .button { white-space: nowrap; }

:root[data-theme=dark] .arcade-loop { border-color: #77578e; }
:root[data-theme=dark] .arcade-loop b,:root[data-theme=dark] .arcade-heading-star { color: #c6a2ff; }
:root[data-theme=dark] .hall-board,:root[data-theme=dark] .hall-privacy { border-color: #82639b; box-shadow: 4px 5px #0c0713; }
:root[data-theme=dark] .hall-board-header .eyebrow { color: #5e436e; }
:root[data-theme=dark] .hall-verified { background: #30243f; border-color: #80669d; }
:root[data-theme=dark] .hall-controls .board-choices a[aria-current] { background: #c5fa74; color: #30213f; border-color: #c5fa74; }
:root[data-theme=dark] .hall-controls .period-tabs a[aria-current] { background: #7041e7; color: white; }
:root[data-theme=dark] .hall-inline-link,:root[data-theme=dark] .hall-record .record-value { color: #ceb0ff; }
:root[data-theme=dark] .hall-chain-row .record-value { color: var(--text); }
:root[data-theme=dark] .hall-notice { background: #3b2c50; color: #e7d6ff; border-color: #c6a2ff; }
:root[data-theme=dark] .hall-empty-star { color: #c6a2ff; }
:root[data-theme=dark] .hall-board .button.ink { background: #c5fa74; color: #30213f; }

@media (min-width:701px) and (prefers-reduced-motion:no-preference) {
  .arcade-podium { animation: arcade-arrive .55s cubic-bezier(.22,.8,.4,1) both; }
  @keyframes arcade-arrive { from { opacity: 0; transform: translateY(18px) rotate(-3deg); } to { opacity: 1; transform: translateY(0) rotate(2deg); } }
}
@media (max-width:1050px) {
  .arcade-hero { padding: 36px 30px; min-height: 440px; }
  .arcade-hero h1 { font-size: 64px; }
  .arcade-home h1 { font-size: 54px; }
  .arcade-hero-copy > p { font-size: 14px; }
  .arcade-sticker { font-size: 10px; right: -8px; }
  .arcade-play-card { padding: 24px; grid-template-columns: 1.35fr 1fr; }
  .arcade-play-art img { left: -20%; width: 175%; }
  .arcade-play-card h3 { font-size: 29px; }
  .hall-privacy { grid-template-columns: 100px 1fr; }
  .hall-privacy img { width: 110px; grid-row: span 2; }
  .hall-privacy > .button { justify-self: start; grid-column: 2; }
  .hall-record-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .arcade-hero { grid-template-columns: 1fr; gap: 10px; padding: 24px 22px 20px; margin-top: 20px; border-radius: 22px; min-height: 0; box-shadow: 3px 4px #30213f; }
  .arcade-hero h1 { font-size: clamp(48px,12.5vw,76px); margin: 16px 0; }
  .arcade-home h1 { font-size: clamp(39px,10.5vw,65px); }
  .arcade-hero .arcade-kicker { font-size: 9px; letter-spacing: .09em; }
  .arcade-hero-copy > p { font-size: 14px; line-height: 1.6; margin: 18px 0; }
  .arcade-hero .actions { gap: 12px 22px; }
  .arcade-hero .button { font-size: 13px; min-height: 48px; padding: 12px 16px; }
  .arcade-guest { margin-top: 8px; font-size: 11px; }
  .arcade-stage { width: 100%; max-width: 430px; min-height: 210px; justify-self: center; }
  .arcade-podium { width: 100%; margin-top: 12px; }
  .arcade-sun { width: 70%; box-shadow: 9px 8px #4d269f; }
  .arcade-sticker { top: 6px; right: -4px; padding: 9px 11px; font-size: 10px; }
  .arcade-star.star-one { left: 0; top: 22px; font-size: 45px; }
  .arcade-star.star-two { right: 0; bottom: 18px; font-size: 36px; }
  .arcade-stage-label { font-size: 9px; padding: 6px 11px; bottom: -5px; right: 18%; }
  .arcade-home .arcade-stage { min-height: 0; }
  .arcade-loop { padding: 14px 2px; margin-top: 21px; }
  .arcade-loop li { flex-wrap: wrap; gap: 6px; justify-content: center; font-size: clamp(13px,3.6vw,20px); }
  .arcade-loop li:first-child { justify-content: center; }
  .arcade-loop li:not(:first-child) { padding-left: 0; }
  .arcade-loop li > span { font-size: 9px; }
  .arcade-loop b { display: none; }
  .arcade-invitations { margin: 38px 0 42px; }
  .arcade-section-heading { gap: 15px; margin-bottom: 21px; }
  .arcade-section-heading h2 { font-size: 30px; }
  .arcade-heading-star { font-size: 36px; }
  .arcade-play-grid,.hall-board-grid { grid-template-columns: 1fr; gap: 22px; }
  .arcade-play-card { padding: 24px; min-height: 255px; grid-template-columns: 1.25fr 1fr; }
  .arcade-play-card h3 { font-size: 30px; }
  .arcade-play-art img { height: 225px; left: -15%; width: 170%; bottom: -18px; }
  .arcade-timer { font-size: 34px; top: 0; right: -8px; }
  .arcade-puzzle-grid { width: 91px; height: 91px; top: 0; right: -8px; }
  .arcade-puzzle-grid i { font-size: 14px; }
  .hall-mini-crown { width: 48px; height: 48px; font-size: 31px; flex: 0 0 auto; border-radius: 13px; }
  .hall-controls { gap: 16px; }
  .hall-controls .board-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; gap: 8px; }
  .hall-controls .board-choices a { justify-content: center; white-space: normal; text-align: center; font-size: 12px; padding: 8px; }
  .hall-board-header { padding: 20px; gap: 12px; }
  .hall-board-header h3 { font-size: 24px; }
  .hall-board-body { padding: 22px; }
  .hall-empty h4 { font-size: 27px; }
  .hall-record-grid { grid-template-columns: 1fr; }
  .hall-verified { padding: 22px; }
  .hall-verified h3 { font-size: 25px; }
  .hall-privacy { grid-template-columns: 1fr; padding: 25px; gap: 16px; margin: 32px 0; position: relative; }
  .hall-privacy img { display: none; }
  .hall-privacy h2 { font-size: 32px; }
  .hall-privacy > .button { grid-column: 1; }
  .hall-daily-value { font-size: 20px; }
}
@media (prefers-reduced-motion:reduce) {
  .arcade-hero *, .arcade-play-card, .arcade-play-card *, .hall-app a { animation: none; transition: none; }
  .arcade-play-card:hover, .arcade-play-card:hover .arcade-card-cta b { transform: none; }
  .arcade-play-card:hover .arcade-play-art img { transform: rotate(8deg); }
}
/* Playable daily spotlight: public completed scores only, never decorative records. */
.arcade-surprise{display:inline-flex;align-items:center;gap:9px;min-height:48px;border:2px solid #fff8ee;border-radius:14px;padding:10px 16px;color:#fff8ee!important;font-weight:800;text-decoration:none!important;box-shadow:3px 3px 0 #23143f;transition:transform .15s}
.arcade-surprise:hover{transform:translateY(-2px);background:#ffffff18}.arcade-surprise>span{font-size:27px;line-height:1}.arcade-surprise:focus-visible{outline:3px solid #d6ff58;outline-offset:5px}
.spotlight{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(22px,4vw,54px);padding:clamp(24px,4vw,44px);margin:32px 0 44px;border:2px solid #241a38;border-radius:28px;background:#e1ff75;color:#241a38;box-shadow:6px 6px 0 #241a38;position:relative}
.spotlight-copy{min-width:0;align-self:center}.spotlight h2{font-size:clamp(30px,4vw,50px);letter-spacing:-.045em;line-height:1.05;margin:14px 0 18px;max-width:13ch}.spotlight p{line-height:1.6;max-width:45ch}.spotlight-copy>small{display:block;font-size:12px;line-height:1.6;margin-top:22px}.spotlight .actions{gap:16px}.spotlight-link{font-size:14px;font-weight:800;color:#241a38;text-underline-offset:4px}.spotlight a:focus-visible{outline:3px solid #7135cf;outline-offset:5px}
.spotlight-target{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-width:0;padding:24px 20px;background:#fffaf0;border:2px solid #241a38;border-radius:22px;box-shadow:0 5px 0 #241a38;overflow-wrap:anywhere}.spotlight-date{border-radius:8px;background:#ede4ff;padding:7px 12px;font-size:12px;font-weight:800;margin-bottom:24px}.spotlight-score{font-size:clamp(36px,5vw,64px);font-variant-numeric:tabular-nums;letter-spacing:-.055em;line-height:1.1;margin:12px 0;color:#6633bb}.spotlight-score small{font-size:20px;letter-spacing:0}.spotlight-player{font-weight:800;max-width:100%}.spotlight-symbol{font-size:60px;color:#6633bb;font-weight:900;line-height:1;margin-bottom:18px}.spotlight-target>strong:not(.spotlight-score){font-size:23px;line-height:1.15}.spotlight-target p{font-size:14px;margin:12px 0 0;max-width:29ch}
html[data-theme=dark] .spotlight{background:#d4ee76;color:#241a38;border-color:#bfa0f1;box-shadow:6px 6px 0 #734aa6}html[data-theme=dark] .spotlight-target{background:#251e35;color:#fff8ee;border-color:#bfa0f1;box-shadow:0 5px 0 #734aa6}html[data-theme=dark] .spotlight-date{background:#49305f;color:#fff8ee}html[data-theme=dark] .spotlight-score,html[data-theme=dark] .spotlight-symbol{color:#d4ee76}
@media(max-width:700px){.spotlight{grid-template-columns:1fr;padding:24px 20px;gap:24px;border-radius:22px;box-shadow:4px 4px 0 #241a38}.spotlight h2{max-width:16ch}.spotlight-date{margin-bottom:18px}.spotlight-target{padding:22px 16px}.spotlight .actions{align-items:flex-start;flex-direction:column}.arcade-hero .actions{flex-wrap:wrap}.arcade-secondary{flex-basis:100%}.spotlight-score{font-size:50px}}
@media(prefers-reduced-motion:reduce){.arcade-surprise{transition:none}.arcade-surprise:hover{transform:none}}
html[data-theme=dark] .spotlight .spotlight-copy>p,html[data-theme=dark] .spotlight .spotlight-copy>.eyebrow{color:#241a38}html[data-theme=dark] .spotlight .spotlight-target>p{color:#e8dcf6}

/* Play first, then explore. Compact choices keep the arcade personality useful. */
.arcade-hero{min-height:410px;padding:36px 38px}
.arcade-hero-copy>p{margin:22px 0;max-width:34ch}
.arcade-hero .actions{gap:14px}
.arcade-loop{border:0;background:var(--surface);border-radius:14px;padding:13px 22px;margin:20px 0 0}
.arcade-loop li{font-size:17px}.arcade-loop b{font-size:21px;margin-right:4px}
.arcade-loop li>span{font-size:10px}
.hall-app .arcade-hero{min-height:350px}.hall-app .arcade-hero h1{font-size:clamp(52px,6vw,76px)}
.hall-app .arcade-sun{max-width:285px}.hall-app .arcade-podium{max-width:430px}.hall-app .arcade-stage-label{bottom:0}
.hall-app .hall-boards{margin-top:34px}
.mood-picker{margin:34px 0 44px;scroll-margin-top:18px}
.mood-picker .arcade-section-heading{margin-bottom:20px}
.mood-picker h2{font-size:clamp(29px,3vw,38px)}
.mood-all{display:inline-flex;align-items:center;gap:10px;min-height:44px;flex-shrink:0;font-weight:700;font-size:13px;color:var(--text);text-decoration:underline;text-underline-offset:5px}
.mood-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.mood-card{position:relative;isolation:isolate;display:flex;min-height:218px;min-width:0;padding:25px 22px 26px;overflow:hidden;border:2px solid #30213f;border-radius:22px;box-shadow:3px 4px #30213f;color:#30213f;text-decoration:none;transition:transform .18s,box-shadow .18s}
.mood-rush{background:#ffbdd6}.mood-calm{background:#b9ebe6}.mood-duel{background:#e6d5ff}
.mood-copy{position:relative;z-index:2;width:68%;min-width:0}.mood-tag{font-size:9px;letter-spacing:.09em;font-weight:700;line-height:1.4;background:#ffffff80;padding:5px 7px;border-radius:5px;display:inline-block}
.mood-card h3{font-size:clamp(24px,2.2vw,31px);line-height:1.08;letter-spacing:-.045em;margin:15px 0 11px;max-width:9ch}
.mood-card .mood-copy>p{font-size:13px;line-height:1.55;color:#48384e;margin:0;max-width:19ch}
.mood-art{position:absolute;right:-11%;bottom:-14px;width:58%;height:180px;z-index:1;pointer-events:none}
.mood-art img{width:100%;height:100%;object-fit:contain;transform:rotate(7deg);transition:transform .18s}
.mood-art>span{position:absolute;top:-17px;right:38%;z-index:-1;font-size:29px;letter-spacing:-.06em;font-weight:700;transform:rotate(8deg);padding:3px 10px;border:2px solid #30213f;border-radius:10px;background:#fff5bb;box-shadow:2px 2px #30213f}
.mood-calm .mood-art>span{font-size:41px;line-height:1;background:#fffaf0;transform:rotate(-8deg)}
.mood-duel .mood-art>span{background:#d6ff72}
.mood-arrow{position:absolute;right:16px;top:17px;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-size:22px;color:#30213f;background:#ffffff80}
.mood-card:focus-visible{outline:3px solid #7041e7;outline-offset:5px}
html[data-theme=dark] .mood-card{border-color:#b69cda;box-shadow:3px 4px #735594;color:#30213f}
html[data-theme=dark] .mood-card .mood-copy>p{color:#48384e}
@media(hover:hover){.mood-card:hover{transform:translateY(-4px);box-shadow:3px 8px #30213f}.mood-card:hover img{transform:rotate(0deg) translateY(-3px)}}
.spotlight{padding:30px;gap:32px;border-radius:24px}.spotlight h2{font-size:clamp(30px,3.5vw,43px);max-width:16ch}.spotlight-symbol{font-size:44px}.spotlight-target{padding:20px}.spotlight-date{margin-bottom:16px}
@media(min-width:701px) and (max-width:1000px){.mood-grid{gap:14px}.mood-card{padding:20px 16px;min-height:245px}.mood-copy{width:80%}.mood-art{width:60%;height:145px;right:-15%;bottom:-16px}.mood-art>span{display:none}.mood-arrow{width:25px;height:25px;right:10px;top:13px}}
@media(max-width:700px){
 .arcade-hero{margin-top:16px;padding:24px 20px 18px;gap:8px;min-height:0}
 .arcade-hero h1{font-size:46px;margin:14px 0}.arcade-home h1{font-size:clamp(34px,9.8vw,53px)}
 .arcade-hero-copy>p{margin:16px 0;font-size:14px;line-height:1.5;max-width:35ch}
 .arcade-hero .actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
 .arcade-hero .button,.arcade-hero .arcade-surprise{font-size:12px;min-height:48px;padding:10px 6px;justify-content:center;gap:6px;line-height:1.25;text-align:center}
 .arcade-hero .button>span{display:none}.arcade-surprise>span{font-size:18px}
 .arcade-guest{font-size:11px;margin-top:12px}
 .arcade-home .carousel-kicker{display:none}.arcade-home .crew-slide{padding:0 3px 3px}.arcade-home .crew-slide img{height:145px;aspect-ratio:auto}.arcade-home .crew-slide figcaption{font-size:13px;margin-top:3px}
 .arcade-home .crew-carousel-controls{margin-top:6px;gap:14px;grid-template-columns:44px 88px 44px}.arcade-home .crew-carousel-arrow{box-shadow:none;background:#ffffff18;color:#fff;border:1px solid #ffffff66}
 .arcade-home .crew-carousel-progress{font-size:10px}.arcade-home .crew-carousel-dots{margin-top:4px}.arcade-home .crew-carousel-dots i{height:5px;width:5px}.arcade-home .crew-carousel-dots i[data-active]{width:18px}
 .arcade-loop{padding:12px 5px;margin-top:15px;border-radius:12px}.arcade-loop li{font-size:14px;gap:6px}.arcade-loop li:not(:first-child){padding-left:0}.arcade-loop li>span{font-size:9px}.arcade-loop b{display:none}
 .hall-app .arcade-hero{min-height:0}.hall-app .arcade-hero h1{font-size:48px}.hall-app .arcade-stage{min-height:0;height:140px;max-width:225px}.hall-app .arcade-podium{height:155px;width:240px;margin:0;object-fit:contain}.hall-app .arcade-sun{width:120px}.hall-app .arcade-sticker{font-size:8px;right:-30px;top:14px}.hall-app .arcade-star{font-size:28px}.hall-app .arcade-stage-label{display:none}.hall-app .hall-boards{margin-top:28px}
 .mood-picker{margin:28px 0 34px}.mood-picker .arcade-section-heading{gap:12px;align-items:end;margin-bottom:17px}.mood-picker h2{font-size:28px}.mood-picker .eyebrow{font-size:9px}.mood-all{font-size:11px;gap:4px;max-width:75px;line-height:1.3;text-align:right}
 .mood-grid{grid-template-columns:1fr;gap:14px}.mood-card{min-height:138px;padding:20px;border-radius:18px}.mood-copy{width:66%}.mood-card h3{font-size:25px;margin:10px 0 8px;max-width:none}.mood-tag{font-size:8px;padding:4px 6px}.mood-card .mood-copy>p{font-size:12px;max-width:20ch}.mood-art{height:136px;width:45%;right:-3%;bottom:-14px}.mood-art>span{font-size:21px;top:8px;right:38%;padding:3px 8px}.mood-calm .mood-art>span{font-size:28px}.mood-arrow{top:12px;right:12px;width:25px;height:25px;font-size:20px}
 .spotlight{padding:24px 20px;gap:20px}.spotlight h2{font-size:32px}.spotlight-copy>p{font-size:14px}.spotlight-target{padding:18px}.spotlight-target .spotlight-symbol{display:none}.spotlight-target>strong:not(.spotlight-score){font-size:20px}.spotlight-copy>small{font-size:11px}
}
@media(max-width:360px){.arcade-surprise>span{display:none}.mood-card{padding:18px 16px}.mood-card h3{font-size:23px}}
@media(prefers-reduced-motion:reduce){.mood-card,.mood-art img{transition:none}.mood-card:hover{transform:none}.mood-card:hover img{transform:rotate(7deg)}}