
/* V20.10.17 - club identity theme, seasonal atmosphere, interaction feedback, tutorial and accessibility */
:root{
  --v201017-club-primary:#b71f2d;
  --v201017-club-secondary:#315d91;
  --v201017-club-accent:#d5ad4e;
  --v201017-club-primary-rgb:183,31,45;
  --v201017-club-secondary-rgb:49,93,145;
  --v201017-ui-scale:1;
  --v201017-touch-min:44px;
}
body.v201017-club-theme{
  --pm-red:var(--v201017-club-primary);
  --pm-blue:var(--v201017-club-secondary);
  --pm-gold:var(--v201017-club-accent);
  --accent:var(--v201017-club-primary);
}
body.v201017-club-theme .header.v201014-header{
  background:
    linear-gradient(90deg,rgba(var(--v201017-club-primary-rgb),.96) 0 7px,transparent 7px),
    radial-gradient(circle at 88% 10%,rgba(var(--v201017-club-secondary-rgb),.26),transparent 34%),
    linear-gradient(180deg,#222c3a 0%,#121923 52%,#0c1118 100%)!important;
}
body.v201017-club-theme .header.v201014-header::before{background:linear-gradient(90deg,var(--v201017-club-primary),var(--v201017-club-accent) 48%,var(--v201017-club-secondary))!important;}
body.v201017-club-theme .tab-btn.active,
body.v201017-club-theme [data-ui-role="primary"],
body.v201017-club-theme .v201015-next-actions button.primary,
body.v201017-club-theme .v20107-actions button.primary{
  border-color:color-mix(in srgb,var(--v201017-club-accent) 66%,white)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--v201017-club-primary) 86%,white),color-mix(in srgb,var(--v201017-club-primary) 72%,black))!important;
}
body.v201017-club-theme .v201015-next-action{border-left-color:var(--v201017-club-accent);background:linear-gradient(135deg,rgba(var(--v201017-club-primary-rgb),.38),rgba(18,33,50,.96) 54%,rgba(9,15,24,.98));}
body.v201017-club-theme .v201015-next-track i,
body.v201017-club-theme .v20107-state-chip.active{background:linear-gradient(90deg,var(--v201017-club-primary),var(--v201017-club-accent))!important;}
body.v201017-club-theme #v208MobileNav button.active{background:color-mix(in srgb,var(--v201017-club-primary) 72%,#151d2a)!important;color:#fff!important;}
body[data-v201017-theme-mode="neutral"]{--v201017-club-primary:#b71f2d;--v201017-club-secondary:#315d91;--v201017-club-accent:#d5ad4e;--v201017-club-primary-rgb:183,31,45;--v201017-club-secondary-rgb:49,93,145;}

/* Seasonal home atmosphere */
#home{position:relative;isolation:isolate;}
#home::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.7;transition:background .28s ease,opacity .28s ease;}
body[data-season-mood="offseason"] #home::before{background:radial-gradient(circle at 85% 2%,rgba(126,150,178,.15),transparent 28%);}
body[data-season-mood="opening"] #home::before{background:radial-gradient(circle at 80% 4%,rgba(125,211,252,.22),transparent 30%),linear-gradient(180deg,rgba(72,132,172,.08),transparent 45%);}
body[data-season-mood="regular"] #home::before{background:radial-gradient(circle at 82% 4%,rgba(var(--v201017-club-secondary-rgb),.22),transparent 32%);}
body[data-season-mood="race"] #home::before{background:radial-gradient(circle at 82% 3%,rgba(255,214,90,.27),transparent 31%),linear-gradient(180deg,rgba(var(--v201017-club-primary-rgb),.12),transparent 48%);}
body[data-season-mood="danger"] #home::before{background:radial-gradient(circle at 82% 3%,rgba(255,91,91,.25),transparent 31%),linear-gradient(180deg,rgba(118,15,24,.15),transparent 48%);}
body[data-season-mood="champion"] #home::before{background:radial-gradient(circle at 50% 0%,rgba(255,224,120,.30),transparent 36%),radial-gradient(circle at 88% 9%,rgba(var(--v201017-club-primary-rgb),.22),transparent 30%);}
body[data-season-mood="complete"] #home::before{background:radial-gradient(circle at 84% 2%,rgba(177,190,210,.18),transparent 32%);}
.v201017-season-mood{position:relative;margin:0 0 10px;padding:11px 12px;border:1px solid rgba(255,255,255,.13);border-left:4px solid var(--v201017-club-accent);border-radius:10px;background:linear-gradient(90deg,rgba(var(--v201017-club-primary-rgb),.16),rgba(10,17,27,.93));overflow:hidden;}
.v201017-season-mood::after{content:attr(data-label);position:absolute;right:11px;top:8px;color:rgba(255,255,255,.11);font-size:9px;font-weight:1000;letter-spacing:.16em;}
.v201017-season-mood-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}.v201017-season-mood-head small{color:var(--v201017-club-accent);font-size:9px;font-weight:1000;letter-spacing:.12em;}.v201017-season-mood-head b{padding:4px 7px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(0,0,0,.22);color:#fff;font-size:9px;}.v201017-season-mood h3{margin:5px 0 2px;color:#fff;font-size:17px;letter-spacing:-.03em;}.v201017-season-mood p{margin:0;color:#b8c4d2;font-size:11px;line-height:1.45;}
body[data-season-streak="hot"] .v201017-season-mood{box-shadow:inset 0 0 0 1px rgba(255,214,90,.08),0 0 24px rgba(255,190,45,.08);}
body[data-season-streak="cold"] .v201017-season-mood{border-left-color:#ff6f78;}

/* Unified screen, button and drag feedback */
.screen.v201017-screen-enter{animation:v201017ScreenEnter .18s cubic-bezier(.2,.8,.2,1) both;}
@keyframes v201017ScreenEnter{from{opacity:.55;transform:translateY(5px)}to{opacity:1;transform:none}}
button,.tab-btn,.v149-menu-card,.card-tile{transform-origin:center;transition:transform .12s ease,filter .12s ease,border-color .12s ease,background-color .12s ease;}
button.v201017-pressed,.tab-btn.v201017-pressed,.v149-menu-card.v201017-pressed,.card-tile.v201017-pressed{transform:scale(.975)!important;filter:brightness(1.08);}
body.v201017-drag-active{cursor:grabbing!important;}
body.v201017-drag-active .v1885-order-drag-target,
body.v201017-drag-active .v1878-drag-target,
body.v201017-drag-active .v20932-preview-valid{outline-color:var(--v201017-club-accent)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--v201017-club-accent) 58%,transparent),0 12px 26px rgba(0,0,0,.42)!important;}
.v201017-input-hint{position:fixed;left:50%;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:100050;transform:translate(-50%,10px);max-width:calc(100vw - 28px);padding:7px 11px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(7,13,22,.94);color:#e8eef7;font-size:10px;font-weight:900;opacity:0;pointer-events:none;transition:.16s ease;}.v201017-input-hint.show{opacity:1;transform:translate(-50%,0);}

/* Accessibility preferences */
body.v201017-text-large{--v201017-ui-scale:1.095;font-size:calc(16px * var(--v201017-ui-scale));}
body.v201017-text-large button,body.v201017-text-large input,body.v201017-text-large select{font-size:max(13px,1em);}
body.v201017-large-targets{--v201017-touch-min:52px;}
body.v201017-large-targets button,body.v201017-large-targets .tab-btn{min-height:var(--v201017-touch-min)!important;}
body.v201017-high-contrast{--line:rgba(255,255,255,.28);--muted:#c5ceda;}
body.v201017-high-contrast .panel,body.v201017-high-contrast .section,body.v201017-high-contrast .v201016-board-stage,body.v201017-high-contrast .v201016-management-shell{border-color:rgba(255,255,255,.28)!important;}
body.v201017-high-contrast small,body.v201017-high-contrast p,body.v201017-high-contrast .notice{color:#d0d8e4!important;}
body.v201017-high-contrast :focus-visible{outline:3px solid #fff59d!important;outline-offset:3px!important;}
body.v201017-reduce-motion *,body.v201017-reduce-motion *::before,body.v201017-reduce-motion *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
.v201017-access{grid-column:1/-1;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.09);}
.v201017-access-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:9px;}.v201017-access-head h4{margin:0;color:#fff4c0;font-size:14px;}.v201017-access-head p{margin:3px 0 0;color:#aeb9c8;font-size:10px;line-height:1.4;}.v201017-theme-chip{padding:4px 7px;border:1px solid color-mix(in srgb,var(--v201017-club-accent) 40%,transparent);border-radius:999px;background:rgba(var(--v201017-club-primary-rgb),.18);color:#fff2bd;font-size:9px;font-weight:1000;}
.v201017-access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}.v201017-access-field{min-width:0;padding:8px;border:1px solid rgba(255,255,255,.10);border-radius:9px;background:rgba(0,0,0,.18);}.v201017-access-field>span{display:block;margin-bottom:5px;color:#b7c2d1;font-size:10px;font-weight:900;}.v201017-access-field select{width:100%;min-height:38px;padding:6px 8px;border:1px solid rgba(255,255,255,.15);border-radius:7px;background:#101925;color:#fff;font-size:11px;}.v201017-check{display:flex;align-items:center;gap:8px;min-height:38px;color:#fff;font-size:11px;font-weight:850;}.v201017-check input{width:19px;height:19px;accent-color:var(--v201017-club-primary);}.v201017-access-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px;}.v201017-access-actions button{min-height:38px;padding:7px 10px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:linear-gradient(180deg,#334158,#192332);color:#fff;font-size:10px;font-weight:1000;}

/* First-user tutorial */
#v201017Tutorial{position:fixed;inset:0;z-index:2147483200;pointer-events:none;}
.v201017-tutorial-backdrop{position:absolute;inset:0;background:rgba(2,5,10,.68);backdrop-filter:blur(1.5px);pointer-events:auto;}
.v201017-tutorial-spotlight{position:fixed;border:3px solid var(--v201017-club-accent);border-radius:13px;box-shadow:0 0 0 9999px rgba(2,5,10,.58),0 0 28px color-mix(in srgb,var(--v201017-club-accent) 42%,transparent);transition:inset .22s ease,width .22s ease,height .22s ease,transform .22s ease;pointer-events:none;}
.v201017-tutorial-card{position:fixed;z-index:2;width:min(360px,calc(100vw - 24px));padding:14px;border:1px solid rgba(255,255,255,.19);border-top:3px solid var(--v201017-club-accent);border-radius:14px;background:linear-gradient(180deg,#182433,#0c131d);box-shadow:0 22px 58px rgba(0,0,0,.58);pointer-events:auto;}
.v201017-tutorial-card.top{top:16px;left:50%;transform:translateX(-50%);}.v201017-tutorial-card.bottom{bottom:calc(78px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);}
.v201017-tutorial-kicker{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#f0d37d;font-size:9px;font-weight:1000;letter-spacing:.11em;}.v201017-tutorial-card h2{margin:8px 0 5px;color:#fff;font-size:19px;line-height:1.16;}.v201017-tutorial-card p{margin:0;color:#c2ccda;font-size:12px;line-height:1.55;}.v201017-tutorial-actions{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-top:12px;}.v201017-tutorial-actions>div{display:flex;gap:6px;}.v201017-tutorial-actions button{min-height:40px;padding:8px 11px;border:1px solid rgba(255,255,255,.15);border-radius:8px;background:#202d3d;color:#fff;font-size:11px;font-weight:1000;}.v201017-tutorial-actions button.primary{border-color:color-mix(in srgb,var(--v201017-club-accent) 58%,white);background:linear-gradient(180deg,var(--v201017-club-primary),color-mix(in srgb,var(--v201017-club-primary) 72%,black));}.v201017-tutorial-actions button:disabled{opacity:.35;}.v201017-tutorial-dots{display:flex;gap:4px;}.v201017-tutorial-dots i{width:6px;height:6px;border-radius:50%;background:#526071;}.v201017-tutorial-dots i.active{width:18px;border-radius:999px;background:var(--v201017-club-accent);}

@media(max-width:760px){
  .v201017-season-mood{padding:10px;}.v201017-season-mood h3{font-size:15px;}
  .v201017-access-grid{grid-template-columns:1fr;}
  .v201017-tutorial-card{border-radius:12px;}.v201017-tutorial-card.top{top:8px;}.v201017-tutorial-card.bottom{bottom:calc(70px + env(safe-area-inset-bottom,0px));}
}
@media(max-width:390px){.v201017-tutorial-card{width:calc(100vw - 14px);padding:12px;}.v201017-tutorial-card h2{font-size:17px;}.v201017-tutorial-card p{font-size:11px;}}
