@font-face{font-family:TreDisplay;src:url("/public/fonts/tre-display.woff2") format("woff2");font-display:swap}
@font-face{font-family:TreUI;src:url("/public/fonts/tre-ui.woff2") format("woff2");font-weight:700;font-display:swap}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#111;color:#e8ece4;font-family:TreUI,Arial,sans-serif}button,a{color:inherit;font:inherit;text-decoration:none}button{border:0;background:none;cursor:pointer}.app{position:fixed;inset:0;isolation:isolate;overflow:hidden}.bg{position:absolute;inset:0;z-index:0;overflow:hidden}.pile-bg{background:radial-gradient(circle at 22% 12%,rgba(255,255,255,.08),transparent 29%),radial-gradient(circle at 82% 76%,rgba(255,255,255,.07),transparent 32%),#111}.pile-bg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 31%,rgba(0,0,0,.74) 86%),linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:auto,36px 36px,36px 36px}.pile-card{position:absolute;width:clamp(150px,18vw,330px);aspect-ratio:5/7;object-fit:cover;box-shadow:0 28px 70px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.14);filter:saturate(.95) contrast(1.06) brightness(.74);transform-origin:center}.desk-bg{display:grid;place-items:center;background-color:#654020;background-image:linear-gradient(90deg,rgba(255,255,255,.05),transparent 20%,rgba(0,0,0,.12) 55%,transparent),repeating-linear-gradient(92deg,#5b351a 0 18px,#724722 18px 39px,#4d2c17 39px 58px)}.desk-bg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 44%,rgba(0,0,0,.6));pointer-events:none}.playmat{position:relative;width:min(91vw,calc(82vh * 1.55),1420px);aspect-ratio:1.55;overflow:hidden;border:12px solid #d8d7cf;border-radius:22px;background:radial-gradient(circle at 18% 25%,rgba(255,255,255,.4),transparent 20%),linear-gradient(135deg,#2c89c8,#e6568a 34%,#202461 68%,#67b5e9);box-shadow:0 44px 140px rgba(0,0,0,.62),inset 0 0 0 2px rgba(0,0,0,.35)}.playmat:before{content:"";position:absolute;inset:28px;z-index:1;border:2px solid rgba(255,255,255,.55);border-radius:16px;box-shadow:inset 0 0 0 2px rgba(0,0,0,.24)}.playmat:after{content:"";position:absolute;inset:0;z-index:1;background:repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.2) 0 1px,transparent 1px 7px),linear-gradient(120deg,transparent 0 32%,rgba(255,255,255,.28) 33% 35%,transparent 36%);mix-blend-mode:overlay;opacity:.72}.mat-title{position:absolute;z-index:4;left:8%;bottom:10%;display:grid;font-family:TreDisplay,Georgia,serif;font-size:clamp(58px,12vw,190px);line-height:.74;letter-spacing:-.06em;color:rgba(255,255,255,.86);text-shadow:0 18px 40px rgba(0,0,0,.45)}.athlete{position:absolute;z-index:3;font-size:clamp(14px,2vw,30px);letter-spacing:.18em;color:rgba(0,0,0,.68);text-shadow:2px 2px 0 rgba(255,255,255,.32);transform:skew(-12deg) rotate(var(--r))}.a1{--r:-18deg;top:17%;left:10%}.a2{--r:8deg;top:25%;left:43%}.a3{--r:-5deg;top:18%;right:10%}.mat-card{position:absolute;z-index:2;width:clamp(86px,9vw,155px);aspect-ratio:5/7;object-fit:cover;opacity:.55;box-shadow:0 18px 46px rgba(0,0,0,.42);filter:saturate(.9) brightness(.72)}.grommet{position:absolute;z-index:5;width:26px;height:26px;border-radius:999px;background:radial-gradient(circle at 34% 30%,#fff,#777 42%,#262626 72%);box-shadow:0 3px 12px rgba(0,0,0,.45)}.tl{top:8px;left:8px}.tr{top:8px;right:8px}.bl{bottom:8px;left:8px}.br{right:8px;bottom:8px}.rule{position:absolute;z-index:16;left:38px;right:38px;height:1px;background:currentColor;opacity:.42}.top{top:49px}.bottom{bottom:8px}.nav{position:absolute;z-index:20;inset:0;text-shadow:0 3px 18px rgba(0,0,0,.86);pointer-events:none}.logo{position:absolute;top:30px;left:38px;pointer-events:all;font-family:TreDisplay,Georgia,serif;font-size:44px;line-height:44px;letter-spacing:-.055em}.switch{position:absolute;top:40px;right:50px;pointer-events:all;font-size:12px;border-bottom:1px solid currentColor;padding-bottom:5px}.count{position:absolute;z-index:20;top:52px;left:50%;transform:translateX(-50%);display:flex;gap:10px;font-size:10px;text-shadow:0 3px 18px rgba(0,0,0,.86)}.hero-title{position:absolute;z-index:6;left:38px;top:calc(50% - 28vh);width:calc(100% - 76px);font-family:TreDisplay,Georgia,serif;font-size:min(26.5vw,37.5vh);line-height:.75;letter-spacing:-.047em;text-shadow:0 18px 52px rgba(0,0,0,.64);pointer-events:none}.hero-title span{display:block}.main-card{position:absolute;z-index:7;top:50%;left:50%;width:min(34vw,54vh);aspect-ratio:5/7;transform:translate(-50%,-50%);overflow:hidden;border:1px solid rgba(255,255,255,.38);background:#101010;box-shadow:0 34px 95px rgba(0,0,0,.55)}.main-card img{width:100%;height:100%;object-fit:cover;opacity:1}.card-copy{position:absolute;left:9%;right:9%;bottom:8%;display:flex;justify-content:space-between;align-items:end;font-size:10px;text-transform:uppercase;text-shadow:0 3px 14px rgba(0,0,0,.92)}.open{position:absolute;z-index:20;bottom:48px;left:50%;transform:translateX(-50%);display:grid;justify-items:center;gap:11px;font-size:12px;text-shadow:0 3px 14px rgba(0,0,0,.86)}.open i{display:block;width:2px;height:42px;background:currentColor}.meta{position:absolute;z-index:20;bottom:47px;left:50px;display:grid;grid-template-columns:90px 190px;gap:4px 16px;font-size:10px;text-transform:uppercase;text-shadow:0 3px 14px rgba(0,0,0,.86)}.rail{position:absolute;z-index:9;top:50%;right:50px;display:flex;max-height:78vh;flex-direction:column;gap:1.15vh;transform:translateY(-50%);overflow:hidden}.thumb{width:9.8vh;aspect-ratio:5/7;object-fit:cover;box-shadow:0 12px 34px rgba(0,0,0,.42);opacity:1}.footer{position:absolute;z-index:20;right:50px;bottom:49px;display:grid;justify-items:end;font-size:10px;text-shadow:0 3px 14px rgba(0,0,0,.86)}.modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;gap:52px;padding:28px;background:rgba(8,9,9,.86);backdrop-filter:blur(18px)}.modal.opened{display:flex}.slab{max-width:min(420px,88vw);max-height:88vh;box-shadow:0 34px 100px rgba(0,0,0,.58)}.modal-copy{max-width:520px;color:#bac4b8;text-transform:uppercase;letter-spacing:.12em}.modal-copy h2{margin:0 0 34px;font-family:TreDisplay,Georgia,serif;font-size:clamp(54px,8vw,120px);line-height:.78;letter-spacing:-.06em}.close{margin-top:32px;border-bottom:1px solid currentColor;padding-bottom:6px;color:#bac4b8}@media(max-width:700px){.pile-card{width:clamp(130px,43vw,230px)}.logo{left:20px;font-size:28px;line-height:28px}.switch{right:20px;top:35px}.rule{left:20px;right:20px}.hero-title{left:20px;top:28%;width:calc(100% - 40px);font-size:21vw}.main-card{width:min(62vw,43vh)}.rail{top:auto;right:auto;left:50%;bottom:100px;max-width:92vw;flex-direction:row;transform:translateX(-50%);overflow:visible}.thumb{width:18vw;flex:0 0 auto}.meta{display:none}.footer{right:20px;bottom:23px}.modal{flex-direction:column;gap:20px;overflow:auto}}