.bike-app{width:100vw;height:100dvh;background:#f1f1f1;color:#111;display:flex;flex-direction:column;overflow:hidden;font-family:Trebuchet MS,Segoe UI,sans-serif}.bike-topbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;background:#00000014;border-bottom:1px solid rgba(0,0,0,.15);z-index:6}.bike-link{color:#1d4ed8;text-decoration:none;font-weight:700}.bike-topbar-title{text-align:center;font-size:16px;font-weight:800;letter-spacing:.02em}.bike-topbar-btn{border:1px solid rgba(0,0,0,.2);border-radius:8px;background:#fff;padding:6px 11px;font-weight:700}.bike-stage{position:relative;flex:1;min-height:0}.bike-stage--menu{display:flex;align-items:center;justify-content:center}.bike-canvas-wrap{position:absolute;inset:0}.bike-canvas-wrap .game-canvas{width:100%;height:100%;display:block}.bike-headline{position:absolute;top:0;left:0;right:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 12px 6px;z-index:4;font-size:12px;font-weight:700;color:#000000bf;text-shadow:0 1px 0 rgba(255,255,255,.85),0 -1px 0 rgba(255,255,255,.85),1px 0 0 rgba(255,255,255,.85),-1px 0 0 rgba(255,255,255,.85)}.bike-headline__map{flex:1 1 100%;min-width:0;padding-bottom:26px}.bike-headline__exit{margin-left:auto;border:1px solid rgba(0,0,0,.18);border-radius:6px;background:#ffffffb8;padding:4px 9px;font-size:11px;font-weight:700;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:pointer}.bike-headline__restart{border:none;background:transparent;padding:2px 4px;font-size:15px;cursor:pointer;opacity:.6;line-height:1}.bike-headline__restart:hover{opacity:1}.bike-race-map{width:100%}.bike-race-map__track{position:relative;height:7px;border-radius:999px;background:#0003;overflow:visible}.bike-race-map__checkpoint{position:absolute;top:-2px;bottom:-2px;width:1px;background:#10b981f2;transform:translate(-50%)}.bike-race-map__player{position:absolute;top:50%;width:8px;height:8px;border-radius:999px;border:1px solid rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;font-size:0;line-height:1;pointer-events:none;transition:left 90ms linear,transform 90ms linear;will-change:left,transform}.bike-race-map__player.is-local{background:#0f56ff}.bike-race-map__player.is-remote{background:#ffffffe0}.bike-race-map__player-name{position:absolute;top:10px;transform:translate(-50%);font-size:10px;font-weight:700;line-height:1;white-space:nowrap;pointer-events:none;text-shadow:0 1px 0 rgba(255,255,255,.9),0 -1px 0 rgba(255,255,255,.9),1px 0 0 rgba(255,255,255,.9),-1px 0 0 rgba(255,255,255,.9);transition:left 90ms linear;will-change:left}.bike-race-map__player-name.is-local{color:#0f56ff}.bike-race-map__player-name.is-remote{color:#000000d1}.bike-message{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);background:#ffffffd9;border:1px solid rgba(0,0,0,.18);border-radius:10px;padding:8px 12px;font-size:16px;font-weight:800;z-index:4}.bike-message:empty{display:none}.bike-finish{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);width:min(520px,calc(100% - 24px));background:#fffffff2;border:1px solid rgba(0,0,0,.2);border-radius:12px;padding:14px;z-index:6;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 24px #00000038}.bike-finish--multi{top:36%}.bike-finish h2{margin:0;font-size:20px}.bike-finish-grid{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:center;font-size:14px}.bike-finish-grid span{color:#000000b3}.bike-finish-grid strong{justify-self:end}.bike-finish-list{display:flex;flex-direction:column;gap:5px;max-height:130px;overflow:auto;border-top:1px solid rgba(0,0,0,.12);border-bottom:1px solid rgba(0,0,0,.12);padding:8px 2px}.bike-finish-row{display:flex;justify-content:space-between;gap:10px;font-size:14px}.bike-menu-card{width:min(460px,calc(100% - 24px));background:#fffffff0;border:1px solid rgba(0,0,0,.18);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;z-index:3;margin-top:56px}.bike-menu-card h2{margin:0;text-align:center}.bike-menu-button{border:1px solid rgba(0,0,0,.2);border-radius:10px;background:#fff;padding:12px 14px;font-weight:800;font-size:15px}.bike-touch{position:absolute;left:12px;right:12px;bottom:12px;display:none;justify-content:space-between;z-index:5}.bike-touch-group{display:flex;gap:8px}.bike-touch button{width:70px;height:70px;border-radius:14px;border:1px solid rgba(255,255,255,.45);background:#0000004d;color:#fff;font-size:22px;font-weight:800;user-select:none;-webkit-user-select:none;transition:transform .07s ease,background .07s ease;touch-action:none}.bike-touch button:active{transform:scale(.88);background:#ffffff40}.bike-card{margin:20px auto;max-width:460px;width:calc(100% - 24px);background:#fffffff2;border:1px solid rgba(0,0,0,.18);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;z-index:2;position:relative}.bike-card--wide{max-width:620px}.bike-card h2{margin:0}.bike-card label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700}.bike-checkbox-row{display:flex;flex-direction:row!important;align-items:center;gap:8px}.bike-checkbox-row input{margin:0}.bike-card input,.bike-card select{border:1px solid rgba(0,0,0,.2);border-radius:8px;padding:8px 10px;font-size:14px}.bike-row{display:flex;gap:8px;flex-wrap:wrap}.bike-row button,.bike-room-header button{border:1px solid rgba(0,0,0,.2);border-radius:8px;background:#fff;padding:8px 12px;font-weight:700}.bike-players{display:flex;flex-direction:column;gap:6px}.bike-player-row{display:flex;justify-content:space-between;gap:10px;font-size:14px;align-items:center}.bike-player-row__meta{display:flex;align-items:center;gap:8px}.bike-player-row__meta select{min-width:116px}.bike-host-panel{position:absolute;top:58px;right:16px;z-index:12;display:flex;flex-direction:column;gap:8px;min-width:240px;max-width:min(320px,calc(100vw - 32px));padding:12px;border-radius:12px;background:#ffffffe6;box-shadow:0 12px 28px #0000002e}.bike-host-panel__row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.bike-host-panel__row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bike-host-panel__row select{flex:0 0 116px}.bike-room-header{display:flex;justify-content:space-between;align-items:center}.bike-note{margin:0;font-size:13px;color:#000000b8;text-align:center}.bike-error{margin:0;color:#b91c1c;font-weight:700}@media(max-width:900px),(pointer:coarse){.bike-touch{display:flex}.bike-finish{width:calc(100% - 16px);padding:10px;top:34%}.bike-finish h2{font-size:18px}.bike-finish-grid{font-size:13px}.bike-host-panel{inset:auto 8px 88px;max-width:none;min-width:0}}.bike-map-picker{display:flex;flex-direction:column;gap:5px}.bike-map-picker__back{display:inline-flex;align-items:center;gap:4px;border:none;background:transparent;padding:0 2px 2px;font-size:12px;font-weight:700;color:#0000008c;cursor:pointer;text-align:left}.bike-map-picker__back:hover{color:#000000d9}.bike-group-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid rgba(0,0,0,.14);border-radius:8px;background:#fff;padding:9px 12px;text-align:left;cursor:pointer;transition:background .1s,border-color .1s}.bike-group-btn:hover{background:#0000000a}.bike-group-btn.has-selection{border-color:#00000047}.bike-group-btn__name{font-size:13px;font-weight:700}.bike-group-btn.has-selection .bike-group-btn__name{font-weight:800}.bike-group-btn__count{font-size:12px;color:#00000073;flex-shrink:0}.bike-level-picker__list{display:flex;flex-direction:column;max-height:260px;overflow-y:auto;border:1px solid rgba(0,0,0,.12);border-radius:8px;padding:4px;background:#00000005}.bike-level-picker__item{border:1px solid transparent;border-radius:6px;background:transparent;padding:7px 9px;text-align:left;font-size:13px;font-weight:600;cursor:pointer;transition:background .1s}.bike-level-picker__item:hover:not(:disabled):not(.is-active){background:#0000000d}.bike-level-picker__item.is-active{background:#111827;color:#fff}.bike-level-picker__item:disabled{opacity:.5;cursor:default}.bike-level-picker__item--all{color:#0009;border-bottom:1px solid rgba(0,0,0,.08);border-radius:6px 6px 3px 3px;margin-bottom:2px}.bike-level-picker__item--all.is-active{color:#fff}.bike-note--indent{padding-left:4px}.bike-note--left{text-align:left}
