@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Russo+One&display=swap");
:root{color-scheme:dark;--bg:#070d17;--panel:#101927;--line:#27344a;--text:#f4f7fc;--muted:#91a4c3;--red:#ff4655;--cyan:#34c8ff}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -30%,#17233a 0,transparent 48%),var(--bg);color:var(--text);font-family:Inter,sans-serif;isolation:isolate}
.map-ambience{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#070d17}
.map-ambience::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,13,23,.6),rgba(7,13,23,.76) 52%,rgba(7,13,23,.9)),radial-gradient(circle at 50% 38%,transparent 0,rgba(7,13,23,.28) 72%)}
.map-ambience i{position:absolute;inset:-50px;background-image:var(--map);background-position:center;background-size:cover;filter:grayscale(1) blur(18px) contrast(.9);opacity:0;transform:scale(1.08);animation:map-ambience-cycle 50s ease-in-out infinite;animation-delay:var(--delay)}
@keyframes map-ambience-cycle{0%,16%{opacity:.42;transform:scale(1.08) translate3d(-.7%,0,0)}20%,96%{opacity:0;transform:scale(1.14) translate3d(.7%,-.5%,0)}100%{opacity:.42;transform:scale(1.08) translate3d(-.7%,0,0)}}
.select-shell{position:relative;z-index:1;width:min(1280px,calc(100% - 48px));margin:0 auto;padding:44px 0}
.select-brand{display:flex;align-items:center;gap:14px;font:22px "Russo One";letter-spacing:.08em}.select-brand span{display:grid;place-items:center;width:38px;height:42px;background:var(--red);clip-path:polygon(12% 0,88% 0,68% 100%,32% 100%);font-size:20px}
.select-copy{max-width:720px;margin:80px 0 38px}.select-copy p,.course-card p{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.18em}.select-copy h1{margin:10px 0 14px;font:clamp(34px,5vw,64px)/1.05 "Russo One"}.select-copy>div{color:var(--muted);font-size:16px;line-height:1.6}
.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.course-grid[hidden]{display:none}.course-card{position:relative;min-height:380px;padding:34px;border:1px solid var(--line);background:linear-gradient(145deg,#121d2d,#0c1421);color:inherit;text-decoration:none;overflow:hidden;transition:transform .24s ease,border-color .24s ease,background .24s ease}.course-card:hover{transform:translateY(-5px);border-color:var(--accent);background:linear-gradient(145deg,#162338,#0d1725)}.course-card:after{content:"";position:absolute;right:-80px;bottom:-120px;width:280px;height:280px;border:1px solid var(--accent);opacity:.18;transform:rotate(45deg)}.course-card.lineup{--accent:var(--cyan)}.course-card.defense{--accent:var(--red)}.course-card.combo{--accent:#ffb23f}.course-card.wallbang{--accent:#ff5e91}.course-card.lineup p{color:var(--cyan)}.course-card.combo p{color:#ffb23f}.course-card.wallbang p{color:#ff5e91}.course-number{position:absolute;right:28px;top:25px;color:#61718b;font-size:12px}.course-icon{display:grid;place-items:center;width:72px;height:72px;margin-bottom:56px;border:1px solid var(--accent);color:var(--accent);font-size:38px;transform:rotate(45deg)}.course-icon::first-line{transform:rotate(-45deg)}.course-card h2{margin:10px 0 12px;font:32px "Russo One"}.course-card>div:not(.course-icon){max-width:520px;color:var(--muted);line-height:1.6}.course-card>b{position:absolute;left:34px;bottom:34px;color:var(--accent);font-size:12px;letter-spacing:.08em}
.course-status{position:absolute;right:28px;bottom:30px;z-index:2;padding:8px 10px;border:1px solid #394a64;background:#0b1421;color:#8497b5;font-size:9px;font-weight:800;letter-spacing:.08em}.course-status.complete{border-color:#248654;background:#0c2118;color:#48df87}.course-card:has(.course-status.complete){border-color:#24865466}.site-return{margin-left:auto;padding:10px 14px;border:1px solid var(--line);color:#8fa3c4;font-size:10px;text-decoration:none;transition:border-color .2s,color .2s}.site-return:hover{border-color:var(--cyan);color:#fff}footer{margin-top:28px;color:#61718b;font-size:9px;letter-spacing:.16em}
@media(max-width:760px){.select-shell{width:min(100% - 28px,1280px);padding-top:24px}.select-copy{margin:50px 0 28px}.course-grid{grid-template-columns:1fr}.course-card{min-height:340px}}
@media(prefers-reduced-motion:reduce){.map-ambience i{animation:none}.map-ambience i:first-child{opacity:.38}}
