@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Barlow:wght@400;500;600;700&display=swap');

:root { --forge-bg:#171715; --forge-panel:#24231f; --forge-line:#56534a; --forge-yellow:#ffd43b; --forge-red:#ee3e23; --forge-paper:#f1eee5; }
html { scroll-behavior:smooth; scrollbar-width:none; }
html::-webkit-scrollbar,body::-webkit-scrollbar,.shelf-track::-webkit-scrollbar,.forge-ticker::-webkit-scrollbar { display:none; }
body.forge-app { margin:0; background:var(--forge-bg); color:var(--forge-paper); font-family:'Barlow',sans-serif; letter-spacing:0; overflow-x:hidden; scrollbar-width:none; background-image:none; }
.forge-app *,.forge-app *::before,.forge-app *::after { box-sizing:border-box; letter-spacing:0; }
.forge-app h1,.forge-app h2,.forge-app h3 { font-family:'Barlow Condensed',sans-serif; letter-spacing:0; text-transform:uppercase; }
.forge-rail { display:none; }
.forge-mobile-head { height:56px; padding:0 13px; display:flex; align-items:center; justify-content:space-between; background:var(--forge-yellow); }
.forge-mobile-head a { color:#171715; text-decoration:none; font:800 14px 'Barlow Condensed',sans-serif; }
.forge-hero { min-height:600px; position:relative; padding:90px 15px 24px; display:flex; flex-direction:column; justify-content:flex-end; background-image:linear-gradient(180deg,rgba(23,23,21,.05) 25%,rgba(23,23,21,.95) 91%),url('/static/brand/frolicware-festival.webp'); background-size:cover; background-position:58% center; border-bottom:1px solid var(--forge-line); }
.forge-hero-copy { position:relative; z-index:1; }
.forge-hero-copy>span { display:inline-block; padding:6px 9px; background:var(--forge-red); color:#fff; font:700 10px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-hero h1 { max-width:6ch; margin:8px 0; font-size:68px; line-height:.8; }
.forge-hero p { max-width:34ch; margin:18px 0; color:#d4d0c7; font-size:12px; line-height:1.5; }
.forge-hero button { min-height:48px; padding:0 17px; border:0; border-radius:0; background:var(--forge-yellow); color:#171715; font:800 13px 'Barlow Condensed',sans-serif; text-transform:uppercase; cursor:pointer; }
.forge-score { position:absolute; top:18px; right:13px; width:122px; padding:11px; background:rgba(23,23,21,.84); border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(8px); }
.forge-score span,.forge-score strong,.forge-score i { display:block; }
.forge-score span { color:#cbc6bc; font-size:8px; text-transform:uppercase; }
.forge-score strong { margin:3px 0; font:800 28px 'Barlow Condensed',sans-serif; }
.forge-score i { color:var(--forge-yellow); font-size:8px; font-style:normal; }
.forge-ticker { display:flex; width:100%; overflow-x:auto; background:var(--forge-paper); color:#171715; scrollbar-width:none; }
.forge-ticker>span,.forge-ticker>div { flex:0 0 auto; padding:12px 15px; border-right:1px solid #a9a398; font-size:9px; text-transform:uppercase; }
.forge-ticker>span { background:var(--forge-red); color:#fff; font-weight:800; }
.forge-main { max-width:1400px; margin:auto; padding:26px 12px 80px; }
.forge-note { margin:0 0 25px; padding:13px; border:1px solid var(--forge-line); display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:10px; }
.forge-note .btn { color:var(--forge-yellow); white-space:nowrap; }
.forge-bracket { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-bottom:46px; background:var(--forge-line); border:1px solid var(--forge-line); }
.forge-bracket a { min-height:105px; padding:12px; display:flex; flex-direction:column; color:var(--forge-paper); text-decoration:none; background:var(--forge-panel); }
.forge-bracket span { color:var(--forge-yellow); font:700 9px 'Barlow Condensed',sans-serif; }
.forge-bracket strong { margin-top:auto; font:800 17px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-bracket small { color:#aaa59b; font-size:8px; }
.forge-app .shelf { width:100%; min-width:0; margin:0 0 48px; }
.forge-app .shelf-head { display:grid; grid-template-columns:1fr auto; align-items:end; gap:0 10px; margin:0 0 13px; padding-bottom:9px; border-bottom:2px solid var(--forge-paper); }
.forge-app .shelf-head>span { grid-column:1/-1; color:var(--forge-yellow); font:700 9px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-app .shelf-head h2 { margin:0; font-size:29px; line-height:1; }
.forge-app .shelf-head .tally { color:#aaa59b; font-size:8px; text-align:right; }
.forge-app .shelf-track { display:flex!important; width:100%; gap:8px; overflow-x:auto!important; overflow-y:hidden; padding:0 0 8px; scroll-snap-type:x mandatory; scrollbar-width:none; }
.forge-app .tile { flex:0 0 40vw; max-width:180px; padding:0; border:0; background:transparent; color:var(--forge-paper); text-align:left; scroll-snap-align:start; cursor:pointer; }
.forge-app .tile .art { display:block; position:relative; aspect-ratio:1/1; overflow:hidden; border-radius:0; border:1px solid var(--forge-line); margin:0 0 7px; background:#25241f; }
.forge-app .tile .art img { width:100%; height:100%; object-fit:cover; }
.forge-app .tile .label { display:block; padding:0; }
.forge-app .tile .name { display:block; color:#fff; font:700 11px 'Barlow Condensed',sans-serif; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.forge-app .tile .kind { display:block; margin-top:2px; color:var(--forge-yellow); font-size:8px; text-transform:uppercase; }
.forge-app .tile .go,.forge-app .tile .fresh { display:none; }
.forge-headliner { padding:16px 12px 12px; background:var(--forge-yellow); color:#171715; }
.forge-headliner .shelf-head { border-color:#171715; }
.forge-headliner .shelf-head>span,.forge-headliner .shelf-head .tally { color:#5f510d; }
.forge-headliner .tile { flex-basis:68vw; max-width:290px; }
.forge-headliner .tile .art { aspect-ratio:16/10; border-color:#171715; }
.forge-headliner .tile .name { color:#171715; }
.forge-headliner .tile .kind { color:#8b2717; }
.forge-live-card { margin:-16px 0 48px; padding:22px; min-height:175px; background:var(--forge-red); display:flex; flex-direction:column; justify-content:flex-end; }
.forge-live-card span { font:700 9px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-live-card strong { font:800 54px 'Barlow Condensed',sans-serif; line-height:.9; }
.forge-live-card p { margin:4px 0 15px; font-size:10px; }
.forge-live-card div { display:flex; align-items:flex-end; gap:4px; height:25px; }
.forge-live-card i { width:8px; height:40%; background:#fff; animation:forge-bars 1s ease-in-out infinite alternate; }
.forge-live-card i:nth-child(2),.forge-live-card i:nth-child(5) { height:90%; animation-delay:.2s; }
.forge-live-card i:nth-child(3) { height:60%; animation-delay:.4s; }
@keyframes forge-bars { to { height:100%; } }
.forge-promo { margin:0 -12px 50px; padding:28px 14px; background:var(--forge-paper); color:#171715; display:grid; gap:7px; }
.forge-promo span { color:var(--forge-red); font:700 9px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-promo strong { font:800 26px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.forge-promo a { width:max-content; color:#171715; font-size:10px; font-weight:700; }
.forge-catalog { border-top:8px solid var(--forge-yellow); padding-top:25px; }
.forge-app .tile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px 7px; }
.forge-app .tile-grid .tile { width:100%; max-width:none; }
.forge-app .tile-grid .tile .name { font-size:9px; }
.forge-footer { padding:30px 14px 85px; border-top:1px solid var(--forge-line); display:grid; gap:14px; color:#aaa59b; font-size:9px; }
.forge-footer nav { display:flex; flex-wrap:wrap; gap:13px; }
.forge-footer a { color:var(--forge-paper); }
@media (min-width:900px) {
  body.forge-app { padding-left:210px; }
  .forge-rail { position:fixed; z-index:30; inset:0 auto 0 0; width:210px; padding:24px 20px; display:flex; flex-direction:column; background:var(--forge-yellow); color:#171715; }
  .forge-brand { display:flex; gap:10px; color:#171715; text-decoration:none; }
  .forge-brand>span { width:48px; height:48px; display:grid; place-items:center; border:2px solid #171715; font:800 13px 'Barlow Condensed',sans-serif; }
  .forge-brand strong { font:800 25px/0.8 'Barlow Condensed',sans-serif; text-transform:uppercase; }
  .forge-rail>nav { display:grid; margin:auto 0; }
  .forge-rail>nav a { padding:13px 0; border-bottom:1px solid #908124; color:#171715; text-decoration:none; font:800 15px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
  .forge-account { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
  .forge-account .textlink,.forge-account .btn { color:#171715; text-decoration:none; font-size:10px; font-weight:700; }
  .forge-account .btn { padding:9px; border:1px solid #171715; background:transparent; border-radius:0; }
  .forge-rail small { margin-top:18px; font-size:8px; }
  .forge-mobile-head { display:none; }
  .forge-hero { min-height:760px; padding:80px 6vw; background-position:center; }
  .forge-hero h1 { font-size:105px; }
  .forge-score { top:35px; right:35px; width:170px; }
  .forge-main { padding:55px 35px 100px; }
  .forge-bracket { grid-template-columns:repeat(4,1fr); }
  .forge-split { display:grid; grid-template-columns:1fr .42fr 1fr; gap:28px; }
  .forge-split.lower { grid-template-columns:repeat(3,1fr); }
  .forge-live-card { margin:60px 0 0; }
  .forge-app .tile { flex-basis:175px; }
  .forge-headliner .tile { flex-basis:320px; max-width:320px; }
  .forge-app .tile-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:25px 12px; }
  .forge-footer { grid-template-columns:1fr auto; padding:35px; }
}

/* Event identity, conventional casino readability. */
.forge-app { font-size:16px; }
.forge-hero { min-height:350px; padding-top:70px; }
.forge-hero-copy>span { font-size:12px; }
.forge-hero h1 { font-size:58px; line-height:.86; }
.forge-hero p { font-size:15px; }
.forge-hero button { min-height:50px; font-size:15px; }
.forge-score span,.forge-score i { font-size:12px; }
.forge-ticker>span,.forge-ticker>div { font-size:12px; }
.forge-note { font-size:14px; }
.forge-bracket span { font-size:12px; }
.forge-bracket strong { font-size:20px; }
.forge-bracket small { font-size:12px; }
.forge-app .shelf-head>span { font-size:12px; }
.forge-app .shelf-head h2 { font-size:32px; }
.forge-app .shelf-head .tally { font-size:12px; }
.forge-app .tile { flex-basis:44vw; max-width:180px; }
.forge-app .tile .name,
.forge-app .tile-grid .tile .name { font-size:14px; }
.forge-app .tile .kind { font-size:12px; }
.forge-live-card span { font-size:12px; }
.forge-live-card p { font-size:14px; }
.forge-promo span { font-size:12px; }
.forge-promo a { font-size:14px; }
.forge-footer { font-size:12px; }

@media (min-width:900px) {
  .forge-hero { min-height:440px; }
  .forge-hero h1 { font-size:82px; }
  .forge-main { max-width:1600px; }
  .forge-app .tile { flex-basis:190px; max-width:190px; }
  .forge-headliner .tile { flex-basis:300px; max-width:300px; }
  .forge-account .textlink,.forge-account .btn { font-size:13px; }
  .forge-rail small { font-size:12px; }
}
