:root{color-scheme:dark;--cream:#fff2ee;--muted:#ba9da4;--red:#ff3b47;--teal:#ff3a52}*{box-sizing:border-box}body{margin:0;background:#070305;color:var(--cream);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font-family:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--teal);outline-offset:5px}button:disabled{opacity:.45;cursor:default}main{max-width:1600px;padding:0 36px;margin:auto}.masthead{height:101px;display:flex;align-items:center;justify-content:space-between;gap:24px}.masthead>a{color:var(--cream);font-size:23px;font-weight:700;letter-spacing:-1px;text-decoration:none;line-height:1}.masthead>a>span{color:var(--red)}.masthead i{font-style:normal;font-size:9px;letter-spacing:2px;display:block;color:var(--muted);margin-top:9px}.header-right{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:1.2px}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 15px var(--teal)}#sound{border:1px solid #6b2332;background:transparent;color:var(--cream);padding:11px 14px;margin-left:20px;font-size:10px;letter-spacing:1px}.arena{position:relative;aspect-ratio:16/9;min-height:480px;max-height:850px;overflow:hidden;border:1px solid #652330;border-radius:4px;background:#130409;isolation:isolate}canvas{width:100%;height:100%;display:block;touch-action:none}.overlay{position:absolute;inset:0;z-index:4} [hidden]{display:none!important}.intro{background:linear-gradient(90deg,rgba(5,1,4,.96),rgba(7,1,4,.78) 28%,rgba(7,1,4,.01) 65%);display:flex;align-items:center;padding:4.8%}.intro-copy{max-width:480px;width:48%}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--teal)}h1{font:clamp(66px,7.8vw,134px)/.83 'Bebas Neue',Impact,sans-serif;letter-spacing:-.02em;margin:20px 0 0;text-shadow:0 4px 0 #390810}h1>span{color:var(--teal)}h1>b{font:500 11px 'DM Sans',sans-serif;display:block;letter-spacing:4px;margin-top:20px}p{font-size:13px;color:#d5bfc3;line-height:1.7;margin:20px 0}.rules{display:flex;gap:25px;font-size:12px;border-top:1px solid #632734;padding-top:17px}.rules b{color:var(--cream);font-size:12px;margin-right:5px}.small{font-size:11px;margin:15px 0 22px}.primary{background:var(--teal);border:0;color:#fff4ef;font-size:11px;letter-spacing:1.2px;font-weight:700;padding:18px 21px;min-height:52px;min-width:240px;box-shadow:0 4px 0 #710c1f;transition:transform .15s}.primary:hover{transform:translateY(-2px)}.primary span{margin-left:26px}.intro-meta{display:flex;justify-content:space-between;gap:12px;max-width:340px;font-size:8px;letter-spacing:1px;color:#ba949e;margin-top:19px}.hero-tag{position:absolute;right:4%;bottom:6%;border-left:2px solid var(--teal);padding-left:16px}.hero-tag span{font-size:9px;letter-spacing:2px;color:var(--teal)}.hero-tag strong{font:26px/1.05 'Bebas Neue',sans-serif;display:block;margin-top:9px}.top-hud{position:absolute;top:25px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:start;pointer-events:none;text-shadow:0 2px 8px #000;z-index:2}.caption{display:block;font-size:10px;letter-spacing:2px;color:#e2bcc6}.top-hud strong{font:42px 'Bebas Neue',sans-serif}.hud-center{text-align:center}#lives{display:block;font-size:20px;letter-spacing:8px;color:var(--red);margin-top:7px}.hud-score{text-align:right;position:relative;padding-right:50px}#pause{pointer-events:auto;position:absolute;right:0;top:0;background:#280610ed;border:1px solid #ba445d;color:var(--cream);width:35px;height:35px}.end,.pause-overlay{background:#100207c9;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;text-align:center}.end-card,.pause-card{width:min(90%,530px);padding:20px}.end h2,.pause-overlay h2{font:85px/.9 'Bebas Neue',sans-serif;margin:20px 0;color:var(--cream)}.end h2{color:var(--teal)}.results{display:flex;justify-content:center;gap:40px;margin:24px 0}.results span{font-size:9px;letter-spacing:2px;color:#d1a9b3;display:block}.results strong{font:36px 'Bebas Neue',sans-serif}.toast{position:absolute;top:19%;left:50%;transform:translateX(-50%);font:28px 'Bebas Neue',sans-serif;letter-spacing:2px;color:#ffcad4;text-shadow:0 2px 12px #000;pointer-events:none;z-index:3;white-space:nowrap}.touch-hint{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:2px;color:#edb5c2;pointer-events:none}.bottom-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 0}.bottom-bar>div:first-child{display:flex;flex-direction:column;gap:6px;font-size:11px;color:#cbaab3}.mini-label{font-size:9px;letter-spacing:1.6px;color:var(--teal)}kbd{font:10px 'DM Sans',sans-serif;border:1px solid #854554;padding:2px 5px;border-radius:3px;color:var(--cream)}#surf{touch-action:none;user-select:none;min-width:220px;min-height:55px;border:1px solid #d04b64;background:#290811;color:var(--cream);font-size:11px;letter-spacing:2px;box-shadow:0 4px 0 #0a0205}#surf.held{background:var(--teal);color:#fff4ef;transform:translateY(3px);box-shadow:none}#surf span{padding-left:30px}.credit{text-align:right;display:flex;flex-direction:column;gap:8px;font-size:8px;letter-spacing:1.6px;color:#a77f8a}.credit a{color:#e4bac5;font-size:9px;text-decoration:none}.mobile-note{text-align:center;color:#ab7a89;font-size:10px;padding:4px 0 20px}
@media(min-width:1500px){h1{font-size:132px}}@media(max-width:950px){main{padding:0 18px}.arena{min-height:500px}.intro-copy{width:52%}h1{font-size:80px}.intro{padding:30px}.header-right>span:not(.live-dot){display:none}.credit{display:none}.bottom-bar>div:first-child{max-width:250px}.hero-tag{right:3%;bottom:7%}}
@media(max-width:600px){main{padding:0 10px}.masthead{height:76px}.masthead>a{font-size:19px}.masthead i{font-size:8px}#sound{margin-left:0}.arena{aspect-ratio:3/4;min-height:510px;max-height:690px}.intro{padding:25px 20px;background:linear-gradient(90deg,#090206ed,#19030bbd 60%,#19030b38)}.intro-copy{width:100%;max-width:350px}h1{font-size:88px}.hero-tag{display:none}.intro p{max-width:270px}.intro-meta{font-size:8px}.rules{gap:15px}.small{margin:14px 0 20px}.bottom-bar{padding:17px 0;gap:12px}.bottom-bar>div:first-child{font-size:10px;max-width:145px;line-height:1.6}#surf{min-width:170px;min-height:62px;font-size:10px;letter-spacing:1px}.top-hud{left:15px;right:15px;top:15px}.top-hud strong{font-size:32px}.hud-score{padding-right:36px}.caption{font-size:8px;letter-spacing:1px}#pause{width:28px;height:30px}#lives{font-size:16px;letter-spacing:3px}.end h2{font-size:70px}.results{gap:24px}.touch-hint{font-size:9px;letter-spacing:1px}.toast{font-size:24px}}

@media(max-width:760px),(pointer:coarse){.end,.pause-overlay{backdrop-filter:none;background:#120208f2}#surf,.primary{touch-action:none;-webkit-user-select:none;user-select:none}.arena{-webkit-user-select:none;user-select:none}}

/* Black / red / luminous white: mask-world identity. */
body{background:#070305;background-image:linear-gradient(180deg,#070305d9,#070305f5),url('assets/shivbudha-mask-background.webp?v=red-mask-6');background-position:center top;background-size:cover;background-repeat:no-repeat}
.arena{background:#100207 url('assets/shivbudha-mask-background.webp?v=red-mask-6') 66% center/cover no-repeat;box-shadow:0 0 45px #ff163512}
h1>span{color:#ff344e;text-shadow:0 0 28px #ff23454d,0 3px 0 #570814}
.primary{background:linear-gradient(135deg,#d51b35,#b9112a);color:#fff4ef;box-shadow:0 4px 0 #690719,0 0 26px #ff28433b}
.primary:hover{box-shadow:0 4px 0 #690719,0 0 35px #ff284369}
#surf{border-color:#c53650;box-shadow:0 4px 0 #0a0205,0 0 16px #ff244325}
#surf.held{background:#cd1932;color:#fff5f1;box-shadow:0 0 23px #ff244355}
.eyebrow,.mini-label{color:#ff8093}.hero-tag{border-color:#ff435f}.hero-tag span{color:#ff879b}
.live-dot{background:#ff405a;box-shadow:0 0 18px #ff2443}
@media(max-width:600px){.intro{background:linear-gradient(90deg,#090106df,#11020c87 66%,#11020c24)}.arena{background-position:66% center}}
/* Obsidian, charcoal, wine, crimson and scarlet: layered mask-world shades. */
:root{--obsidian:#070306;--charcoal:#170810;--wine:#370b1d;--crimson:#86132e;--scarlet:#e1294e}
body{background-color:var(--obsidian);background-image:radial-gradient(ellipse at 8% 72%,#4d0b234d,transparent 48%),radial-gradient(ellipse at 93% 12%,#84162d44,transparent 50%),linear-gradient(180deg,#070305d9,#170611ed 64%,#050204fa),url('assets/shivbudha-mask-background.webp?v=friends-7')}
.arena{border-color:#6c2039;box-shadow:0 0 45px #9c123125,0 14px 60px #020103c9}
.friend-header{border:1px solid #96304b;color:#ffbbce;background:linear-gradient(135deg,#351020,#17070f);padding:11px 14px;font-size:10px;letter-spacing:1px;min-height:37px}
.friend-header:hover,.share-run:hover{border-color:#ff577e;box-shadow:0 0 18px #b51d4440}
.incoming-challenge{border-left:2px solid #ff4d7a;padding:8px 11px;margin:0 0 16px;background:linear-gradient(90deg,#8a10304d,transparent)}
.incoming-challenge>span{display:block;font-size:8px;letter-spacing:1.4px;color:#ff92b0}.incoming-challenge strong{display:block;font-size:13px;font-weight:400;color:#fff0f3;margin-top:6px}.incoming-challenge b{font-weight:600}
.rival-hud{position:absolute;z-index:2;left:30px;top:105px;max-width:calc(100% - 60px);padding:7px 10px;border-left:2px solid #f63e70;background:#16040dcf;color:#ffb5cf;font-size:10px;letter-spacing:1px;pointer-events:none}
.end-actions{display:flex;flex-direction:column;align-items:center;gap:12px}.share-run{min-width:240px;min-height:46px;padding:13px 18px;border:1px solid #ad3757;background:linear-gradient(125deg,#400c22,#17060f);color:#ffe0ed;font-size:10px;letter-spacing:1.2px}
.friend-result{color:#ff8eb4!important;font-size:12px!important;font-weight:600}
#friendsDialog{font-family:'DM Sans',sans-serif;color:#fff0f3;width:min(710px,calc(100vw - 26px));max-height:calc(100dvh - 30px);overflow:auto;padding:25px;border:1px solid #96314f;border-radius:15px;background:radial-gradient(ellipse at 100% 0,#60102c55,transparent 60%),linear-gradient(145deg,#190710,#080306 70%);box-shadow:0 20px 90px #000b,0 0 35px #f0255440}
#friendsDialog::backdrop{background:#050105dc;backdrop-filter:blur(5px)}
.friends-heading{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.friends-heading h2{font:48px/1 'Bebas Neue',Impact,sans-serif;margin:9px 0 18px;letter-spacing:.5px}.friends-heading .eyebrow{font-size:9px;letter-spacing:1.4px}
#closeFriends{border:1px solid #6d2941;border-radius:50%;background:#260a18;color:#ffd3e6;width:37px;height:37px;font-size:24px;flex-shrink:0}
.nickname-label,.link-label{display:block;font-size:12px;color:#edb4ca;margin-bottom:8px}.nickname-label span{color:#a77c8e;font-size:10px}
#playerName,#challengeLink{width:100%;min-height:43px;padding:11px 13px;border:1px solid #713048;border-radius:6px;background:#10040b;color:#ffedf5;font:16px 'DM Sans',sans-serif;box-sizing:border-box}
.friends-body{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;margin:21px 0}.card-preview{min-width:0;align-self:start;background:linear-gradient(135deg,#380b20,#12050d);border-radius:8px;overflow:hidden}.card-preview canvas{aspect-ratio:1/1;width:100%;height:auto;touch-action:auto}.card-preview p{padding:28px;font:34px/1.2 'Bebas Neue',Impact,sans-serif;color:#f2c4d7;margin:0}
.friends-board h3{font:22px 'Bebas Neue',Impact,sans-serif;margin:2px 0 12px;color:#ffe3ef;letter-spacing:1px}#friendScores{list-style:none;margin:0;padding:0}#friendScores li{display:flex;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid #522034;font-size:12px}#friendScores .score-empty{line-height:1.7;color:#c59bb0}.score-rank{color:#ff6e9b;font-size:10px;min-width:18px}.score-person{min-width:0;overflow-wrap:anywhere;flex:1;color:#e8b9cd}#friendScores strong{font-size:13px;color:#fff0f5;white-space:nowrap}.score-note{font-size:10px;line-height:1.7;color:#b98da3;margin:15px 0 0}
.friends-actions{display:flex;gap:9px;flex-wrap:wrap}.friends-actions .primary{min-width:0;flex:1;padding:14px 13px;letter-spacing:.8px;font-size:10px;min-height:47px}.friends-actions>button:not(.primary){min-height:43px;padding:11px 13px;color:#f5bbd3;background:linear-gradient(145deg,#400b23,#200812);border:1px solid #7e2b49;border-radius:4px;font-size:9px;letter-spacing:.6px}#shareStatus{font-size:12px;line-height:1.6;color:#ffb0d1;min-height:18px;margin:13px 0}#challengeLink{font-size:12px;min-height:38px;white-space:nowrap;text-overflow:ellipsis}
@media(max-width:600px){.masthead{gap:10px}.masthead>a{font-size:17px}.masthead i{font-size:7px;letter-spacing:1.2px}.header-right{gap:6px}.header-right .live-dot{display:none}.friend-header{padding:9px 10px;font-size:8px;letter-spacing:.4px;min-height:37px}#sound{font-size:8px;padding:10px 9px;letter-spacing:.3px;min-height:37px}.has-challenge h1{font-size:66px}.has-challenge h1>b{margin-top:13px}.has-challenge .intro p{margin:12px 0}.has-challenge .incoming-challenge{margin-bottom:12px}.has-challenge .rules{padding-top:12px}.has-challenge .intro{padding-top:18px}.rival-hud{left:15px;top:84px;font-size:8px;max-width:calc(100% - 30px);letter-spacing:.5px}.end h2{font-size:60px;margin:14px 0}.end .results{margin:17px 0}.end .end-card{padding:15px}.end p{margin:12px 0;font-size:11px}.end-actions{gap:10px}.end-actions .primary{padding:14px 17px;min-height:47px}.share-run{min-height:43px;padding:11px 15px}#friendsDialog{padding:19px;max-height:calc(100dvh - 20px)}#friendsDialog::backdrop{backdrop-filter:none}.friends-body{grid-template-columns:1fr;gap:18px}.card-preview{max-width:220px;width:100%;justify-self:center}.card-preview p{font-size:28px;padding:23px}.friends-heading h2{font-size:42px}.friends-actions{display:grid;grid-template-columns:1fr 1fr}.friends-actions .primary{grid-column:1/-1}.nickname-label span{display:block;margin-top:5px}.score-note{margin-top:10px}}
