:root {
  --surface:#fcf9f8; --ink:#1c1b1b; --muted:#5a413a; --primary:#eb5a28;
  --primary-dark:#ce4614; --primary-fixed:#ffdbd0; --low:#f6f3f2; --container:#f0eded;
  --border:rgba(226,191,181,.3); --font-body:'Hanken Grotesk',sans-serif;
  --font-heading:'Bricolage Grotesque',sans-serif;
  color-scheme:light;
}
* {box-sizing:border-box}
html,body {margin:0; padding:0}
body {background:var(--surface); color:var(--ink); font:400 16px/1.5 var(--font-body); -webkit-font-smoothing:antialiased}
[hidden] {display:none!important}
button,input {font:inherit}
button {border:0; background:none; color:inherit}
a {color:inherit; text-decoration:none}
button[aria-disabled="true"] {cursor:default}
button:focus-visible,input:focus-visible,a:focus-visible {outline:2px solid var(--primary); outline-offset:4px}
.icon {width:20px; height:20px; display:inline-block; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.icon-library {position:absolute; width:0; height:0; overflow:hidden}
.sr-only {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.page-width {width:100%; max-width:1280px; margin-inline:auto; padding-inline:20px}
.site-header {position:fixed; inset:0 0 auto; z-index:30; background:rgba(252,249,248,.96); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); box-shadow:0 3px 8px rgba(73,40,22,.1),0 10px 24px rgba(73,40,22,.16)}
.header-inner {position:relative; height:68px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.header-left,.header-right,.brand,.main-nav {display:flex; align-items:center}
.header-left {gap:16px; min-width:0; height:100%}
.header-right {gap:8px}
.brand {gap:10px; flex-shrink:0}
.brand-fox {width:44px; height:44px; object-fit:contain; border-radius:14px}
.brand-wordmark {display:flex; flex-direction:column}
.brand-cheeko {font:700 24px/1 var(--font-heading); letter-spacing:-.5px}
.brand-store {font-size:10px; line-height:14px; color:var(--primary); font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-top:4px}
.main-nav {gap:6px; height:100%; align-items:stretch}
.nav-link {position:relative; display:flex; align-items:center; padding:0 12px; color:var(--muted); font-size:14px; font-weight:500; line-height:20px}
.nav-link.selected {color:var(--primary)}
.nav-link.selected::after {content:""; position:absolute; right:12px; bottom:0; left:12px; height:4px; border-radius:4px 4px 0 0; background:currentColor}
.search-field {display:none; align-items:center; gap:12px; height:40px; border:1px solid rgba(226,191,181,.4); border-radius:999px; background:var(--low); padding:0 16px}
.search-field input {width:100%; min-width:0; border:0; outline:none; background:transparent; font-size:14px; color:var(--ink)}
.search-field input::placeholder {color:var(--muted); opacity:1}
.search-field .icon {width:18px; height:18px}
.search-field:focus-within {border-color:var(--primary)}
.icon-button {width:36px; height:36px; display:flex; align-items:center; justify-content:center; color:var(--muted); border-radius:50%}
.help-button {display:none}
.profile-button {width:36px; height:36px; display:flex; align-items:center; justify-content:center; background:var(--primary); border-radius:50%; color:#fff; box-shadow:0 2px 4px rgba(235,90,40,.2)}
.profile-button .icon {width:19px; height:19px}
#accountBox {position:relative}
.profile-button {cursor:pointer}
.account-menu {position:absolute; top:calc(100% + 12px); right:0; width:min(280px,calc(100vw - 32px)); padding:12px; border:1px solid var(--border); border-radius:16px; background:#fff; box-shadow:0 12px 36px rgba(40,20,10,.12)}
.account-identity {display:flex; flex-direction:column; gap:3px; padding:4px 4px 12px; border-bottom:1px solid var(--border); overflow-wrap:anywhere}
.account-identity strong {font-size:14px; font-weight:700}
.account-identity span {font-size:12px; color:var(--muted)}
.sign-out-button {width:100%; margin-top:8px; padding:10px 12px; border-radius:10px; color:var(--primary); text-align:left; font-size:14px; font-weight:700; cursor:pointer}
.sign-out-button:hover {background:var(--low)}
.sign-out-button:disabled {opacity:.6; cursor:wait}
.account-error {margin:8px 4px 4px; color:#93000a; font-size:12px; line-height:18px}
.content-canvas {padding-top:104px; padding-bottom:8px}
#storeApp[data-detail="true"] .device-status-row,
#storeApp[data-detail="true"] .featured-section,
#storeApp[data-detail="true"] .games-section,
#storeApp[data-detail="true"] .videos-section,
#storeApp[data-detail="true"] #backHome,
#storeApp[data-detail="true"] #searchEmpty {display:none!important}
.detail-back {display:inline-flex; align-items:center; gap:7px; margin-bottom:32px; color:var(--muted); font-size:14px; font-weight:600}
.detail-back:hover {color:var(--primary)}
.detail-hero {display:grid; grid-template-columns:minmax(0,1fr); gap:28px; align-items:center; padding-block:8px 44px}
.detail-intro {min-width:0}
.detail-intro>.eyebrow {margin-bottom:12px; letter-spacing:.09em}
.detail-intro h1,.detail-empty h1 {font:700 clamp(34px,5vw,60px)/1.08 var(--font-heading); letter-spacing:-.035em; margin:0; overflow-wrap:anywhere; text-wrap:balance}
.detail-intro h1:focus,.detail-empty h1:focus {outline:none}
.detail-byline {display:flex; flex-wrap:wrap; align-items:center; gap:9px; color:var(--muted); font-size:14px; line-height:22px; margin-top:16px}
.detail-publisher {color:var(--primary); font-weight:700}
.detail-divider {color:var(--muted)}
.detail-badge {display:inline-block; margin-top:14px; padding:4px 12px; border-radius:999px; background:var(--primary-fixed); color:var(--primary-dark); font-size:12px; font-weight:700}
.detail-actions {display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}
.detail-primary,.detail-share {display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:48px; padding:12px 22px; border-radius:999px; font-size:14px; line-height:20px; font-weight:700; cursor:pointer; transition:background .15s ease,transform .15s ease}
.detail-primary {background:var(--primary); color:#fff; box-shadow:0 3px 6px rgba(235,90,40,.16)}
.detail-primary:hover:not(:disabled) {background:var(--primary-dark)}
.detail-primary:disabled {cursor:not-allowed; background:var(--primary-fixed); color:var(--primary-dark); box-shadow:none}
.detail-share {background:var(--low); color:var(--primary); border:1px solid var(--border)}
.detail-share:hover {background:var(--primary-fixed)}
.detail-share:disabled {cursor:wait}
.detail-primary:active:not(:disabled),.detail-share:active:not(:disabled) {transform:scale(.98)}
.detail-action-note,.detail-action-status {color:var(--muted); font-size:12px; line-height:18px; margin:10px 0 0}
.detail-action-status:empty {display:none}
.detail-art {position:relative; overflow:hidden; background:var(--low); border:1px solid var(--border)}
.detail-art--game {width:min(240px,100%); aspect-ratio:1; border-radius:36px; justify-self:start; padding:14px; background:#fff; box-shadow:0 14px 40px rgba(90,40,20,.08)}
.detail-art--game img {width:100%; height:100%; object-fit:contain; border-radius:24px}
.detail-art--video {width:100%; aspect-ratio:16/9; border-radius:20px}
.detail-art--video img {width:100%; height:100%; object-fit:cover}
.detail-art .artwork-fallback .icon {width:80px; height:80px}
.detail-content-grid {display:grid; grid-template-columns:minmax(0,1fr); gap:32px; padding-top:36px; border-top:1px solid var(--border)}
.detail-about h2 {font-size:24px; line-height:32px; font-weight:700; letter-spacing:-.02em}
.detail-description {max-width:65ch; margin:16px 0 0; color:var(--muted); font-size:16px; line-height:1.8; white-space:pre-line; overflow-wrap:anywhere}
.detail-brand-note {display:flex; align-items:center; gap:16px; align-self:start; padding:20px; background:var(--low); border-radius:16px}
.detail-brand-note img {object-fit:contain; flex:none}
.detail-brand-note p {margin:6px 0 0; font-size:16px; line-height:24px; font-weight:600}
.detail-specs {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:0; padding:24px; background:var(--low); border-radius:16px}
.detail-specs dt {color:var(--muted); font-size:11px; line-height:16px; text-transform:uppercase; letter-spacing:.06em}
.detail-specs dd {font-size:15px; line-height:22px; font-weight:600; margin:6px 0 0; overflow-wrap:anywhere}
.detail-empty {min-height:360px; padding-block:28px}
.detail-empty h1 {font-size:36px}
.detail-empty p {color:var(--muted); margin-top:20px; max-width:50ch}
.feature-detail {max-width:960px; margin-inline:auto}
.feature-detail>.eyebrow {margin-bottom:10px}
.feature-detail>h1 {font:700 clamp(28px,3.5vw,40px)/1.15 var(--font-heading); letter-spacing:-.025em; margin:0; overflow-wrap:anywhere}
.feature-detail>h1:focus {outline:none}
.feature-detail-subtitle {font-size:17px; line-height:1.7; color:var(--muted); margin:14px 0 0; max-width:65ch; white-space:pre-line; overflow-wrap:anywhere}
.feature-detail-cover {position:relative; width:100%; aspect-ratio:16/9; margin-block:28px 16px; border-radius:22px; overflow:hidden; background:var(--low)}
.feature-detail-cover>img {display:block; width:100%; height:100%; object-fit:contain}
.feature-linked-list {list-style:none; padding:0; margin:0}
.feature-linked-list li+li {border-top:1px solid var(--border)}
.feature-linked-card {display:flex; align-items:center; gap:20px; padding-block:24px; border-radius:8px}
.feature-linked-card:hover .feature-linked-copy h2 {color:var(--primary)}
.feature-linked-art {position:relative; flex:none; width:72px; aspect-ratio:1; border-radius:16px; overflow:hidden; background:var(--low)}
.feature-linked-art>img {width:100%; height:100%; object-fit:contain}
.feature-linked-art--video {width:128px; aspect-ratio:16/9; border-radius:12px}
.feature-linked-art--video>img {object-fit:cover}
.feature-linked-copy {flex:1; min-width:0}
.feature-linked-copy h2 {font-size:20px; line-height:26px; font-weight:700; overflow-wrap:anywhere; transition:color .15s ease}
.feature-linked-copy p {font-size:13px; line-height:20px; color:var(--muted); margin:6px 0 0}
.feature-linked-copy .feature-linked-description {display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden}
.feature-linked-action {display:flex; align-items:center; gap:8px; flex:none; padding:10px 18px; border-radius:999px; background:var(--primary-fixed); color:var(--primary-dark); font-size:13px; line-height:20px; font-weight:700}
.feature-linked-action .icon {width:16px; height:16px}
.feature-linked-empty {color:var(--muted); padding-block:24px; margin:0}
@media(max-width:639px) {.feature-detail-subtitle {font-size:15px}.feature-detail-cover {border-radius:16px;margin-block:24px 8px}.feature-linked-card {flex-wrap:wrap; gap:14px; padding-block:20px}.feature-linked-art {width:56px;border-radius:12px}.feature-linked-art--video {width:88px}.feature-linked-copy h2 {font-size:17px;line-height:23px}.feature-linked-copy p {font-size:12px;line-height:18px}.feature-linked-action {padding:8px 12px;font-size:12px}.feature-linked-description {display:none!important}}
.detail-skeleton {margin-top:24px; height:200px; max-width:640px; border-radius:20px; background:var(--low)}
a.game-card,a.video-card {transition:border-color .15s ease,box-shadow .15s ease}
a.game-card:hover,a.video-card:hover {border-color:rgba(235,90,40,.45); box-shadow:0 5px 16px rgba(90,40,20,.07)}
@media(min-width:768px) {
  .detail-hero {grid-template-columns:minmax(0,1fr) 280px; gap:64px; padding-bottom:64px}
  .detail-art--game {width:280px; justify-self:end}
  .detail-hero--video {grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px}
  .detail-content-grid {grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:32px 48px}
  .detail-specs {grid-column:1; grid-row:2; grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(min-width:1024px) {.detail-hero {padding-top:20px; grid-template-columns:minmax(0,1fr) 320px; gap:80px}.detail-art--game {width:320px}.detail-hero--video {grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:56px}}
@media(max-width:767px) {.detail-art {grid-row:1}.detail-art--game {width:176px; border-radius:28px; padding:10px}.detail-art--game img {border-radius:18px}.detail-back {margin-bottom:24px}.detail-brand-note {grid-row:3}}
.device-status-row {display:flex; flex-direction:column; gap:16px; margin-bottom:40px}
.device-column {position:relative; display:flex; flex-direction:column; min-width:0; flex:1}
.device-menu {position:absolute; z-index:12; top:calc(100% + 8px); left:0; width:min(360px,calc(100vw - 32px)); max-height:min(400px,60vh); overflow-y:auto; padding:12px; background:#fff; border:1px solid var(--border); border-radius:16px; box-shadow:0 12px 32px rgba(40,20,10,.14)}
.device-menu .devices-status {margin:0}
.connected-devices {width:100%}
.devices-heading {display:flex; align-items:center; justify-content:space-between; gap:12px}
.devices-heading h2 {margin:0; font-size:14px; line-height:20px; font-weight:700}
.devices-count {color:var(--muted); font-size:12px; white-space:nowrap}
.devices-status {margin:6px 0 0; color:var(--muted); font-size:12px; line-height:18px}
.devices-list {list-style:none; padding:0; margin:8px 0 0; display:grid; gap:8px}
.devices-list:empty {margin:0}
.device-row {cursor:pointer; display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--low); border:1px solid var(--border); border-radius:12px}
.device-row>.icon {width:22px; height:22px; color:var(--primary)}
.device-identity {display:flex; flex-direction:column; gap:2px; flex:1; min-width:0}
.device-name {font-size:13px; line-height:18px; font-weight:700}
.device-address {font:600 12px/18px ui-monospace,monospace; overflow-wrap:anywhere}
.device-ip {color:var(--muted); font-size:12px; line-height:18px; overflow-wrap:anywhere}
.device-online {display:flex; align-items:center; gap:5px; color:#296847; font-size:11px; font-weight:600; white-space:nowrap}
.device-online::before {content:''; width:6px; height:6px; border-radius:50%; background:#37835b}
.device-row.selected {border-color:var(--primary); box-shadow:0 0 0 1px var(--primary)}
.device-row:focus-visible {outline:2px solid var(--primary); outline-offset:2px}
.device-online.is-offline {color:var(--muted)}
.device-online.is-offline::before {background:var(--muted)}
.device-picker {display:inline-flex; align-items:center; align-self:flex-start; gap:9px; padding:10px 16px; min-height:44px; background:var(--primary); color:#fff; border-radius:999px; box-shadow:0 3px 6px rgba(235,90,40,.22); font-size:14px; font-weight:700; line-height:20px; max-width:100%}
.device-picker {cursor:pointer}
.device-picker:disabled {cursor:default; opacity:.65}
.device-picker[aria-expanded="true"]>.icon:last-child {transform:rotate(180deg)}
.device-picker #deviceLabel {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0}
.device-count {padding:1px 8px; background:rgba(255,255,255,.2); border-radius:999px; font-size:11px; font-weight:600; white-space:nowrap}
.device-picker>.icon {width:18px; height:18px}
.catalog-status {width:min(100%,340px); padding:12px 16px; background:var(--low); border:1px solid var(--border); border-radius:16px; box-shadow:0 1px 2px rgba(40,20,10,.03)}
.section-heading {display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:24px}
.section-heading>div:first-child {min-width:0}
h2,h3 {font-family:var(--font-heading); margin:0; color:var(--ink)}
.section-heading h2 {font-size:28px; font-weight:700; line-height:34px; letter-spacing:-.02em; text-wrap:balance}
.section-description {margin:4px 0 0; color:var(--muted); font-size:16px; line-height:24px}
.eyebrow {margin:0 0 4px; color:var(--primary); text-transform:uppercase; font-size:10px; line-height:14px; font-weight:700; letter-spacing:.055em}
.featured-heading {margin-bottom:16px}
.featured-heading h2 {font-size:22px; line-height:30px; letter-spacing:-.02em}
.carousel-controls {display:flex; gap:8px; flex-shrink:0}
.carousel-button {display:flex; align-items:center; justify-content:center; width:36px; height:36px; background:#eae7e7; border-radius:50%}
.featured-track{display:flex;gap:22px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 14px}
.featured-track::-webkit-scrollbar{display:none}
.featured-item{flex:0 0 min(78vw,560px);min-width:0;scroll-snap-align:start}
.featured-card{display:block;position:relative;isolation:isolate;width:100%;height:clamp(260px,25vw,330px);overflow:hidden;border-radius:18px;background:#18375e;color:#fff;box-shadow:0 4px 14px rgba(37,26,17,.18)}
.featured-cover,.featured-shade{position:absolute;inset:0}
.featured-cover img{width:100%;height:100%;object-fit:cover}
.featured-cover-fallback{display:flex;align-items:center;justify-content:center;height:100%;background:linear-gradient(125deg,#102446,#294f7d 55%,#e2823c)}
.featured-cover-fallback .icon{width:84px;height:84px;opacity:.5}
.featured-shade{background:linear-gradient(180deg,rgba(1,16,48,.24),transparent 24%,rgba(1,13,39,.28) 47%,rgba(1,13,48,.95) 83%);z-index:1}
.featured-card--dark{color:#201915;background:#ffe4a2}
.featured-card--dark .featured-shade{background:linear-gradient(180deg,rgba(255,248,226,.08),transparent 25%,rgba(255,237,181,.35) 49%,rgba(255,229,156,.97) 84%)}
.featured-badge{position:absolute;z-index:2;top:0;left:0;padding:10px 14px;border-radius:0 0 14px 0;background:rgba(14,18,34,.78);color:#fff;font-size:13px;font-weight:700;line-height:18px;max-width:80%}
.featured-card--dark .featured-badge{background:rgba(255,255,255,.78);color:#242025}
.featured-card-content{position:absolute;z-index:2;inset:auto 0 0;padding:22px 24px 20px}
.featured-headline h3{color:inherit;font:700 clamp(24px,2.5vw,32px)/1.1 var(--font-heading);letter-spacing:-.025em;max-width:90%}
.featured-subtitle{margin:8px 0 0;font-size:clamp(13px,1.3vw,16px);line-height:1.35;max-width:90%}
.featured-card-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.featured-content-summary{display:flex;align-items:center;gap:12px;min-width:0}
.featured-content-summary img,.featured-content-fallback{width:48px;height:48px;flex:none;object-fit:cover;border-radius:12px;background:rgba(255,255,255,.85)}
.featured-content-fallback{display:flex;align-items:center;justify-content:center;color:#eb5a28}
.featured-content-fallback .icon{width:24px;height:24px}
.featured-content-summary>div{display:flex;flex-direction:column;min-width:0}
.featured-content-summary strong{font-size:16px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.featured-content-summary small{font-size:12px;line-height:18px;opacity:.86}
.featured-cta{flex:none;border:0;border-radius:12px;background:rgba(255,255,255,.22);color:inherit;padding:11px 20px;font-size:14px;font-weight:700;cursor:pointer;backdrop-filter:blur(8px)}
.featured-cta:hover,.featured-cta:focus-visible{background:rgba(255,255,255,.34)}
.featured-card--dark .featured-cta{background:rgba(31,29,24,.18)}
.featured-card--dark .featured-cta:hover,.featured-card--dark .featured-cta:focus-visible{background:rgba(31,29,24,.3)}
@media(max-width:639px){.featured-track{gap:14px}.featured-item{flex-basis:min(88vw,430px)}.featured-card{height:270px}.featured-card-content{padding:18px 20px}.featured-headline h3{font-size:24px;max-width:100%}.featured-subtitle{max-width:100%;font-size:14px}.featured-card-footer{margin-top:16px}.featured-content-summary img,.featured-content-fallback{width:40px;height:40px}.featured-content-summary strong{font-size:13px}.featured-cta{padding:10px 12px;font-size:12px}}
.featured-video-dialog{width:min(820px,94vw);max-height:90vh;border:0;border-radius:16px;padding:16px;background:#18181b;color:#fff}
.featured-video-dialog::backdrop{background:rgba(0,0,0,.75)}
.featured-video-dialog video{width:100%;max-height:75vh}
.featured-video-close{display:block;margin-left:auto;margin-bottom:8px;color:#fff;cursor:pointer}
.featured-placeholder {height:380px; border:1px solid var(--border); border-radius:24px; box-shadow:0 1px 2px rgba(40,20,10,.03)}
.feature-soft {background:linear-gradient(135deg,#ffedd5 0%,#fffbeb 48%,#ffe4e6 100%)}
.feature-dark {background:linear-gradient(135deg,#1c1917,#292524 55%,#451a03)}
.feature-warm {background:linear-gradient(135deg,#fbbf24,#fdba74 50%,#fda4af)}
.games-section {margin-top:52px}
.section-link {display:inline-flex; align-items:center; gap:5px; color:var(--primary); font-size:14px; font-weight:700; white-space:nowrap; flex-shrink:0}
.section-link .icon {width:18px; height:18px}
.games-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.game-card {padding:12px; border:1px solid var(--border); background:#fff; border-radius:16px; box-shadow:0 1px 3px rgba(40,20,10,.035); display:flex; flex-direction:column; min-width:0}
.game-art {position:relative; aspect-ratio:1; overflow:hidden; background:var(--container); border-radius:12px; margin-bottom:12px}
.game-art img,.video-art img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.game-badge{position:absolute;top:8px;right:8px;padding:3px 7px;border-radius:6px;background:#fff;color:var(--primary);font-size:10px;font-weight:700}
.game-description,.video-description{color:var(--muted);font-size:12px;line-height:17px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:5px 0}
.artwork-fallback {display:flex; align-items:center; justify-content:center; position:absolute; inset:0; background:var(--low); color:rgba(90,65,58,.4)}
.artwork-fallback .icon {width:44px; height:44px; stroke-width:1.2}
.game-details {min-height:58px; margin-bottom:10px}
.game-details h3 {font-size:18px; line-height:24px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-.015em}
.game-meta {margin:2px 0 0; color:var(--muted); font-size:10px; line-height:14px; letter-spacing:.025em; font-variant-numeric:tabular-nums}
.game-card-footer {border-top:1px solid var(--border); padding-top:10px; margin-top:auto}
.download-action {display:flex; align-items:center; gap:4px; color:var(--primary); padding:0; font-size:11px; line-height:16px; font-weight:700; white-space:nowrap}
.download-action .icon {width:15px; height:15px}
.videos-section {margin-top:48px}
.videos-grid {display:grid; grid-template-columns:1fr; grid-auto-rows:1fr; gap:16px}
.video-card {min-width:0; align-self:stretch; background:#fff; border:1px solid var(--border); border-radius:16px; overflow:hidden; box-shadow:0 1px 3px rgba(40,20,10,.035); display:flex; flex-direction:column}
.video-art {position:relative; width:100%; aspect-ratio:5/4; overflow:hidden; background:var(--container)}
.video-shade {position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.6),transparent 55%)}
.video-badges {position:absolute; left:12px; bottom:12px; right:8px; display:flex; align-items:center; gap:8px; color:#fff; font-size:10px; line-height:14px; font-weight:600}
.duration {padding:2px 8px; border-radius:5px; background:rgba(0,0,0,.6); font-variant-numeric:tabular-nums; white-space:nowrap}
.play-preview {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:48px; height:48px; display:flex; align-items:center; justify-content:center; color:#fff; background:var(--primary); border-radius:50%; opacity:0; transition:opacity .2s}
.video-card:hover .play-preview {opacity:1}
.play-preview .icon {width:26px; height:26px; fill:currentColor; stroke-width:0}
.video-details {padding:12px; display:flex; flex-direction:column; flex:1}
.video-overline {display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:10px; line-height:14px; letter-spacing:.04em; margin-bottom:4px; text-transform:uppercase}
.video-format {color:var(--primary); font-weight:700; flex-shrink:0}
.video-details h3 {font-size:18px; line-height:24px; font-weight:700; letter-spacing:-.015em; overflow-wrap:anywhere}
.video-meta {margin:6px 0 8px; font-size:14px; line-height:20px; color:var(--muted); font-variant-numeric:tabular-nums}
.video-card-footer {display:flex; align-items:center; justify-content:flex-end; margin-top:auto}
.watch-action {padding:6px 12px; border-radius:999px; background:var(--container); display:flex; align-items:center; gap:6px; font-size:12px; line-height:16px; font-weight:600; white-space:nowrap}
.watch-action .icon {width:16px; height:16px}
.catalog-placeholder {grid-column:1/-1; min-height:170px; display:flex; align-items:center; justify-content:center; background:var(--low); border:1px solid var(--border); border-radius:16px; color:var(--muted); font-size:14px; padding:24px; text-align:center}
.catalog-placeholder[role="alert"] {color:#93000a; background:#fff3ef}
.back-home {display:inline-flex; align-items:center; gap:4px; color:var(--primary); font-size:14px; font-weight:600; margin-bottom:24px}
.search-empty {padding:24px; background:var(--low); border:1px solid var(--border); border-radius:16px; color:var(--muted); text-align:center}
#storeApp:not([data-view="home"]) .games-section,#storeApp:not([data-view="home"]) .videos-section {margin-top:0}
#storeApp[data-view="home"] .games-grid,#storeApp[data-view="home"] .videos-grid {grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:var(--shelf-card-width); overflow-x:auto; overflow-y:hidden; padding-bottom:14px; scroll-snap-type:x proximity; overscroll-behavior-x:contain; scrollbar-width:thin; scrollbar-color:var(--primary-fixed) var(--low)}
#storeApp[data-view="home"] .games-grid {--shelf-card-width:164px}
#storeApp[data-view="home"] .videos-grid {--shelf-card-width:min(88%,360px)}
#storeApp[data-view="home"] .item {scroll-snap-align:start}
#storeApp[data-view="home"] .games-grid:focus-visible,#storeApp[data-view="home"] .videos-grid:focus-visible {outline:2px solid var(--primary); outline-offset:4px}
#storeApp[data-view="home"] .games-grid:has(.catalog-placeholder),#storeApp[data-view="home"] .videos-grid:has(.catalog-placeholder) {grid-template-columns:1fr; grid-auto-flow:row; grid-auto-columns:auto}
.site-footer {margin-top:80px; background:var(--low); border-top:1px solid var(--border)}
.footer-inner {padding-block:40px; display:flex; flex-direction:column; gap:24px; align-items:flex-start; justify-content:space-between}
.footer-brand {display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:14px}
.footer-brand img {object-fit:contain; border-radius:8px}
.footer-brand strong {font-weight:700; white-space:nowrap}
.footer-brand>span {color:var(--muted); font-size:14px}
.footer-links {display:flex; flex-wrap:wrap; gap:20px}
.footer-links button {padding:0; color:var(--muted); font-size:12px; line-height:16px; font-weight:600}
.footer-links .pass-link {color:var(--primary); font-weight:700}
#authGate {min-height:100svh; display:flex; align-items:center; justify-content:center; padding:32px 20px; background:radial-gradient(ellipse at 50% 20%,#fff0df,transparent 60%),var(--surface)}
.auth-card {width:min(440px,100%); padding:36px 30px; border:1px solid var(--border); border-radius:24px; background:#fff; text-align:center; box-shadow:0 12px 44px rgba(100,40,10,.06)}
.auth-fox {width:88px; height:88px; object-fit:contain; border-radius:22px; margin-bottom:14px}
.auth-card h1 {font:700 36px/44px var(--font-heading); letter-spacing:-.02em; margin:0}
.auth-card h1 span {color:var(--primary)}
.auth-subtitle {font-size:16px; line-height:24px; color:var(--muted); margin:8px 0 22px}
.auth-copy,.auth-status {font-size:14px; line-height:20px; color:var(--muted); margin:0 0 20px}
.oauth {display:flex; align-items:center; justify-content:center; gap:12px; width:100%; padding:13px 16px; border:1px solid var(--border); border-radius:999px; background:#fff; color:var(--ink); font-size:14px; font-weight:600; margin-bottom:12px; cursor:pointer}
.oauth svg {width:20px; height:20px; flex-shrink:0}
.oauth.apple {background:var(--ink); color:#fff; border-color:var(--ink)}
.oauth:disabled {opacity:.5; cursor:wait}
.auth-error,.auth-notice {font-size:14px; line-height:20px; border-radius:12px; padding:12px; margin:12px 0 0}
.auth-error {background:#fff0ea; color:#93000a}
.auth-notice {background:var(--low); color:var(--muted)}
@media(max-width:420px) {.page-width{padding-inline:16px}.header-left{gap:10px}.brand-fox{width:36px;height:36px}.brand{gap:7px}.brand-cheeko{font-size:21px}.main-nav{gap:0}.nav-link{padding:8px 9px}.header-right{gap:4px}.device-picker{font-size:12px;gap:7px;padding-inline:12px}.device-count{font-size:10px;padding-inline:6px}.featured-placeholder{height:320px}.section-heading h2{font-size:26px;line-height:32px}.game-card{padding:10px}.game-details h3{font-size:16px;line-height:22px}.download-action{font-size:10px;gap:3px}.download-action .icon{width:13px;height:13px}.games-grid{gap:12px}.featured-heading h2{font-size:20px;line-height:26px}.carousel-controls{gap:6px}.carousel-button{width:30px;height:30px}}
@media(min-width:640px) {.page-width{padding-inline:24px}.header-left{gap:24px}.nav-link{padding-inline:20px}.help-button{display:flex}.section-link{display:inline-flex}.games-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.videos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-inner{align-items:center}.footer-links{gap:24px}}
@media(min-width:768px) {.header-right{gap:12px}.search-field{display:flex;width:245px}.mobile-search{display:none}.device-status-row{flex-direction:row;align-items:flex-start;justify-content:space-between;gap:20px}.catalog-status{flex-shrink:0}.section-heading h2{font-size:36px;line-height:44px}.featured-heading h2{font-size:24px;line-height:30px}.videos-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.footer-inner{flex-direction:row;align-items:center;padding-block:48px}.footer-brand{font-size:14px}}
@media(min-width:1024px) {.page-width{padding-inline:48px}.header-left{gap:32px}.search-field{width:320px}.games-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.game-details h3{font-size:18px}.content-canvas{padding-top:112px}.device-status-row{margin-bottom:48px}.site-footer{margin-top:88px}}
@media(min-width:1100px) {#storeApp[data-view="videos"] .videos-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1280px) {.search-field{width:384px}.header-right{gap:12px}}
@media(max-width:767px) {.header-right.search-open .search-field{display:flex;position:absolute;top:calc(100% + 8px);left:16px;right:16px;height:46px;background:#fff;box-shadow:0 8px 24px rgba(40,20,10,.12);z-index:2}}
@media(max-width:767px) {#storeApp:has(.header-right.search-open) .content-canvas{padding-top:158px}}
#storeApp[data-searching="true"] .games-grid,#storeApp[data-searching="true"] .videos-grid{grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none}
#storeApp[data-searching="true"] .games-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,164px),1fr))}
#storeApp[data-searching="true"] .videos-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
@media(max-width:639px) {.section-heading:not(.featured-heading){flex-direction:column;align-items:flex-start;gap:12px}}
@media(min-width:640px) {#storeApp[data-view="home"] .games-grid{--shelf-card-width:calc((100% - 32px)/3)}#storeApp[data-view="home"] .videos-grid{--shelf-card-width:calc((100% - 24px)/2)}}
@media(min-width:768px) {#storeApp[data-view="home"] .videos-grid{--shelf-card-width:calc((100% - 48px)/3)}}
@media(min-width:1024px) {#storeApp[data-view="home"] .games-grid{--shelf-card-width:calc((100% - 80px)/6)}#storeApp[data-view="home"] .videos-grid{--shelf-card-width:calc((100% - 96px)/5)}}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after{transition:none!important;animation:none!important}}
