:root{--runner-bg: #1b1711;--runner-bg-soft: #2a2319;--runner-paper: #d4be92;--runner-paper-soft: #c4ab7f;--runner-paper-dark: #8a6d42;--runner-panel: rgba(42, 33, 21, .92);--runner-panel-strong: rgba(255, 245, 222, .15);--runner-line: rgba(49, 37, 23, .45);--runner-text: #f8ebc6;--runner-muted: #cdb78d;--runner-gold: #f0c36b;--runner-gold-soft: rgba(240, 195, 107, .18);--runner-danger: #d37a52;--runner-shadow: 0 24px 70px rgba(0, 0, 0, .38)}*{box-sizing:border-box}.beats-body{font-family:Georgia,Times New Roman,serif;background:radial-gradient(circle at 18% 14%,rgba(245,223,163,.16),transparent 18%),radial-gradient(circle at 82% 20%,rgba(255,220,148,.08),transparent 16%),linear-gradient(180deg,#2d2418,#16110c 44%,#0d0a07);color:var(--runner-text)}a{color:inherit;text-decoration:none}.runner-page{position:relative;min-height:100vh;overflow:hidden}.runner-page:before,.runner-page:after{content:"";position:absolute;inset:0;pointer-events:none}.runner-page:before{background:radial-gradient(circle at center,rgba(255,241,214,.08),transparent 46%),linear-gradient(180deg,rgba(255,255,255,.06),transparent 18%),repeating-linear-gradient(0deg,rgba(31,24,17,.05) 0 2px,transparent 2px 8px);opacity:.5}.runner-page:after{inset:14px;border:6px solid rgba(36,27,18,.8);box-shadow:inset 0 0 0 2px #ffedc614;opacity:.9}.runner-shell{position:relative;z-index:1;width:min(calc(100% - 16px),1680px);margin:0 auto;padding:28px 0 64px}.runner-marquee{position:relative;margin-bottom:20px;padding:18px 44px;border:5px solid #2b2116;border-radius:10px;background:linear-gradient(180deg,#fff8e56b,#ad854c2e),linear-gradient(180deg,#d8c298,#baa06f);box-shadow:0 18px 36px #00000047,inset 0 0 0 2px #fff5de38;text-align:center}.runner-marquee:before,.runner-marquee:after{content:"";position:absolute;top:12px;bottom:12px;width:28px;background:linear-gradient(180deg,#6f5535,#4c3924);filter:drop-shadow(0 4px 6px rgba(0,0,0,.22))}.runner-marquee:before{left:-16px;clip-path:polygon(100% 0,0 50%,100% 100%)}.runner-marquee:after{right:-16px;clip-path:polygon(0 0,100% 50%,0 100%)}.runner-marquee .kicker{margin:0 0 6px;color:#362716c7;font-size:.78rem;font-weight:700;letter-spacing:.18em}.runner-marquee-title{margin:0;color:#2c2115;font-size:clamp(1.55rem,3.2vw,2.6rem);line-height:1.05;font-style:italic}.runner-btn,.runner-link{appearance:none;display:inline-flex;position:relative;align-items:center;justify-content:center;overflow:hidden;min-height:48px;padding:0 20px;border:3px solid #2f2417;border-radius:14px;background:linear-gradient(180deg,#fff7e224,#46311b0f),linear-gradient(180deg,#4c3824,#2b1f14);color:var(--runner-text);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .2s ease,border-color .2s ease,transform .2s ease,opacity .2s ease}.runner-btn:focus{outline:none}.runner-btn:focus-visible,.runner-link:focus-visible{outline:2px solid rgba(200,155,79,.85);outline-offset:2px}.runner-btn:hover,.runner-link:hover{background:linear-gradient(180deg,#fff7e22e,#46311b14),linear-gradient(180deg,#594128,#332517);border-color:#3f2e1c;transform:translateY(-1px)}.runner-btn:disabled{opacity:.55;cursor:wait;transform:none}.runner-btn--accent{background:linear-gradient(180deg,#fffaeb42,#8758231a),linear-gradient(180deg,#bb8740,#85521f);color:#1c140d;border-color:#3b2713;box-shadow:inset 0 0 0 1px #fff6e029}.runner-btn--accent:hover,.runner-btn--accent:focus-visible{background:linear-gradient(180deg,#fffaeb47,#8758231f),linear-gradient(180deg,#d39b4c,#9b6329);color:#1c140d;border-color:#3b2713}.runner-btn--accent:active{background:linear-gradient(180deg,#e8b25a,#a66b2c);color:#120d08;border-color:#3b2713;transform:scale(.98)}.runner-btn--accent:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,244,210,.38),transparent 58%);opacity:0;transform:scale(.72);pointer-events:none}.runner-btn--accent.runner-btn--tap-feedback{animation:runner-jump-tap .22s ease-out}.runner-btn--accent.runner-btn--tap-feedback:after{animation:runner-jump-tap-glow .22s ease-out}@keyframes runner-jump-tap{0%{transform:scale(1);box-shadow:0 0 #c89b4f00}35%{transform:scale(.96);box-shadow:0 0 0 6px #c89b4f2e}to{transform:scale(1);box-shadow:0 0 #c89b4f00}}@keyframes runner-jump-tap-glow{0%{opacity:0;transform:scale(.72)}30%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}.runner-side-panel,.runner-card{position:relative;overflow:hidden;border:5px solid #241b12;border-radius:18px;background:radial-gradient(circle at top,rgba(255,245,220,.14),transparent 24%),linear-gradient(180deg,#fff8e929,#543b1f14),linear-gradient(180deg,#403020,#241a12);box-shadow:var(--runner-shadow)}.runner-side-panel:before,.runner-card:before{content:"";position:absolute;inset:10px;border:2px solid rgba(255,240,204,.09);border-radius:10px;pointer-events:none}.runner-side-panel span{display:block;margin-bottom:6px;color:var(--runner-muted);font-size:10px;letter-spacing:.16em;text-transform:uppercase}.runner-side-panel{padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px}.runner-side-title{margin:0;font-size:30px;font-family:Impact,Haettenschweiler,Arial Black,sans-serif;text-transform:uppercase;letter-spacing:.02em}.runner-main{display:grid;grid-template-columns:1fr;gap:18px;align-items:start}.runner-card{padding:0}.runner-canvas-wrap{position:relative;padding:18px;background:radial-gradient(circle at top,rgba(255,238,188,.1),transparent 24%),linear-gradient(180deg,#fff8e10f,#fff0)}#runnerCanvas{display:block;width:100%;height:auto;aspect-ratio:1100 / 480;border-radius:16px;border:5px solid #1f1710;background:linear-gradient(180deg,#403325,#17110c);box-shadow:inset 0 0 0 2px #fff3d614,0 16px 24px #00000038;touch-action:manipulation}.runner-overlay{position:absolute;inset:18px;display:flex;align-items:center;justify-content:center;padding:24px;background:#120d098a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:16px}.runner-overlay-box{width:min(100%,620px);padding:32px;border-radius:18px;border:5px solid #241b12;background:linear-gradient(180deg,#fff6db26,#6248260d),linear-gradient(180deg,#413122,#271c13);text-align:center;box-shadow:var(--runner-shadow)}.runner-overlay-box h2{margin:0 0 14px;font-size:clamp(2rem,4vw,3.2rem);line-height:.94;font-family:Impact,Haettenschweiler,Arial Black,sans-serif;text-transform:uppercase;letter-spacing:-.04em}.runner-overlay-box p{margin:0;color:#f0ddb1;line-height:1.6;font-size:1.02rem}.runner-overlay-art{width:min(100%,420px);margin:0 auto 18px;filter:drop-shadow(0 16px 32px rgba(0,0,0,.38))}.runner-overlay-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}.runner-footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 18px 18px;color:#322417;font-size:13px}.runner-footer-note{position:relative;flex:1 1 220px;min-height:74px;padding:18px 18px 14px;border:4px solid #261c13;border-radius:999px;background:linear-gradient(180deg,#fffcf0cc,#e1c493d1),linear-gradient(180deg,#f2debb,#d4b17c);font-size:.98rem;line-height:1.25;text-align:center;box-shadow:0 8px 18px #00000029}.runner-footer-note:after{content:"";position:absolute;bottom:-16px;width:22px;height:22px;border-right:4px solid #261c13;border-bottom:4px solid #261c13;background:#e9c98f;transform:rotate(30deg)}.runner-footer-note--left:after{left:54px}.runner-footer-note--center:after{left:50%;margin-left:-11px}.runner-footer-note--right:after{right:54px}.runner-release-panel{margin:0 18px 18px;display:flex;justify-content:space-between;gap:18px;align-items:center;padding:22px 24px;border-radius:24px;border:1px solid rgba(200,155,79,.24);background:radial-gradient(circle at top right,rgba(200,155,79,.16),transparent 36%),linear-gradient(135deg,#140f08f2,#08080afa)}.runner-release-panel span{display:block;margin-bottom:6px;color:var(--runner-muted);font-size:11px;letter-spacing:.16em;text-transform:uppercase}.runner-release-panel h3{margin:0 0 8px;font-size:28px;text-transform:uppercase;letter-spacing:-.03em}.runner-release-panel p{margin:0;color:var(--runner-muted);line-height:1.6}.runner-release-panel-actions{display:flex;gap:12px;flex-wrap:wrap}.runner-mobile-controls{display:none;gap:12px;padding:0 18px 18px}.runner-mobile-controls .runner-btn{min-height:52px;flex:1 1 0}.runner-obstacle-catalog{margin-top:28px;padding:28px;border:5px solid #241b12;border-radius:18px;background:radial-gradient(circle at top right,rgba(255,243,204,.13),transparent 26%),linear-gradient(180deg,#fff8e424,#4e391f0d),linear-gradient(180deg,#413021,#241a12);box-shadow:var(--runner-shadow)}.runner-obstacle-catalog-head{margin-bottom:22px}.runner-obstacle-catalog-head span{display:block;margin-bottom:6px;color:var(--runner-muted);font-size:11px;letter-spacing:.16em;text-transform:uppercase}.runner-obstacle-catalog-head h2{margin:0 0 10px;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1;font-family:Impact,Haettenschweiler,Arial Black,sans-serif;text-transform:uppercase}.runner-obstacle-catalog-head p{margin:0;color:var(--runner-muted);line-height:1.7}.runner-obstacle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.runner-obstacle-card{display:grid;gap:14px;padding:18px;border-radius:14px;border:3px solid rgba(31,23,15,.9);background:linear-gradient(180deg,#fff8e11c,#46321c08),linear-gradient(180deg,#4a3723,#2c2015)}.runner-obstacle-art{width:100%;aspect-ratio:1 / 1;object-fit:contain;border-radius:12px;background:#fff;padding:12px;max-width:180px;justify-self:center;border:3px solid #2b2116;box-shadow:inset 0 0 0 1px #fffaea47}.runner-obstacle-copy h3{margin:0 0 8px;font-size:20px}.runner-obstacle-problem{display:block;margin:0 0 10px;padding:10px 12px;border:2px solid rgba(43,33,22,.82);border-radius:12px;background:linear-gradient(180deg,#fff6dd1f,#5e421f0a),linear-gradient(180deg,#f4d69f2e,#b6823d1f);color:#f5e3ba;font-size:13px;font-weight:600;line-height:1.5}.runner-obstacle-problem strong{display:block;margin-bottom:4px;color:#d7a85f;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.runner-obstacle-copy p{margin:0;color:var(--runner-muted);line-height:1.6;font-size:14px}.runner-obstacle-copy p.runner-obstacle-problem+p{margin-top:10px}.runner-sidebar{display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:10px}.runner-sidebar .runner-side-panel{padding:14px;min-width:0}.runner-sidebar .runner-side-title{font-size:18px}.runner-form{display:grid;gap:8px}.runner-form input{width:100%;min-height:42px;padding:0 12px;border:3px solid rgba(33,24,16,.9);border-radius:12px;background:linear-gradient(180deg,#e6cf9e,#c8aa72);color:#21170f;font:inherit}.runner-empty,.runner-save-status{color:var(--runner-muted);font-size:12px;line-height:1.45}.runner-save-status[data-state=error]{color:#ff8b8b}.runner-save-status[data-state=success]{color:var(--runner-gold)}.runner-leaderboard-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.runner-leaderboard-item{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:center;padding:10px 12px;border-radius:12px;border:3px solid rgba(31,23,15,.9);background:linear-gradient(180deg,#fff8e11c,#46321c08),linear-gradient(180deg,#4a3723,#2c2015)}.runner-leaderboard-rank{color:var(--runner-gold);font-weight:800;font-size:13px}.runner-leaderboard-name{min-width:0;font-weight:700}.runner-leaderboard-name span{display:block;margin-top:2px;color:var(--runner-muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase}.runner-leaderboard-score{font-weight:800;font-size:17px;color:var(--runner-text)}@media(max-width:1080px){.runner-main{grid-template-columns:1fr}.runner-obstacle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.runner-shell{width:min(calc(100% - 4px),1260px);padding-top:8px;padding-bottom:20px}.runner-marquee{margin-bottom:10px;padding:12px 14px}.runner-marquee:before,.runner-marquee:after{display:none}.runner-sidebar{grid-template-columns:1fr}.runner-canvas-wrap,.runner-footer,.runner-mobile-controls,.runner-release-panel{padding-left:6px;padding-right:6px}.runner-canvas-wrap{padding-top:6px;padding-bottom:8px}.runner-footer{display:none}.runner-card{border-width:4px;border-radius:12px}.runner-card:before{inset:6px}#runnerCanvas{border-width:3px;border-radius:10px}.runner-release-panel{margin-left:12px;margin-right:12px;flex-direction:column;align-items:stretch}.runner-overlay{inset:6px;padding:6px;align-items:stretch}.runner-mobile-controls{display:flex;padding-top:4px;padding-bottom:10px}.runner-overlay-box{width:100%;max-width:none;padding:12px 10px;border-width:3px;border-radius:10px}.runner-overlay-box h2{margin-bottom:6px;font-size:clamp(1.2rem,6vw,1.7rem)}.runner-overlay-box p{font-size:.82rem;line-height:1.28}.runner-overlay-art{display:none}.runner-overlay-actions{gap:6px;margin-top:8px}.runner-overlay-actions .runner-btn,.runner-overlay-actions .runner-link{min-height:38px;padding:0 12px;font-size:11px}.runner-footer-note{flex-basis:100%;min-height:0;border-radius:28px}.runner-footer-note:after{display:none}.runner-obstacle-catalog{margin-top:18px;padding:20px;border-radius:18px}.runner-obstacle-grid{grid-template-columns:1fr}}
