:root{--bg:#07110f;--panel:#10201c;--panel2:#152823;--lime:#b9f55e;--text:#f2f8f4;--muted:#8da39a;--danger:#ff6c62;--line:#263a34}*{box-sizing:border-box}body{margin:0;background:#020706;color:var(--text);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}.phone-shell{width:min(100%,460px);min-height:100vh;margin:auto;background:radial-gradient(circle at 80px 0,#153c2d 0,transparent 260px),var(--bg);position:relative;overflow:hidden}.topbar{height:62px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:18px;font-weight:800;display:flex;gap:9px;align-items:center}.brand-mark{display:grid;place-items:center;width:26px;height:26px;color:#07110f;background:var(--lime);border-radius:8px}.icon-btn,.round-btn{border:1px solid var(--line);color:var(--text);background:#12211e;border-radius:50%;width:36px;height:36px}.screen{display:none;padding:0 18px 36px}.screen.active{display:block}.hero{padding-top:14px}.eyebrow{color:var(--lime);font-size:12px;font-weight:800;letter-spacing:2px}.hero h1{font-size:42px;line-height:1.03;margin:12px 0 10px;letter-spacing:-2px}.hero h1 span{color:var(--lime)}.hero>p{margin:0 0 20px;color:var(--muted)}.route-card{background:linear-gradient(145deg,#162a24,#0d1916);border:1px solid var(--line);border-radius:22px;overflow:hidden}.route-map{height:168px;position:relative;background:radial-gradient(circle at 70% 20%,#224d39,transparent 44%),repeating-linear-gradient(120deg,transparent 0 22px,#12241f 23px)}.route-map svg{width:100%;height:100%;overflow:visible}.route-shadow{fill:none;stroke:#07110f;stroke-width:12;stroke-linecap:round}.route{fill:none;stroke:var(--lime);stroke-width:5;stroke-linecap:round;stroke-dasharray:8 5}.route-map circle{fill:var(--lime);stroke:#07110f;stroke-width:4}.map-tag{position:absolute;right:78px;top:65px;font-size:10px;background:#20382f;border:1px solid #426354;padding:5px 8px;border-radius:8px}.route-meta{display:grid;grid-template-columns:repeat(3,1fr);padding:14px 0}.route-meta div{text-align:center;border-right:1px solid var(--line)}.route-meta div:last-child{border:0}.route-meta b{display:block;font-size:18px}.route-meta span{font-size:11px;color:var(--muted)}.vehicle-card{display:flex;align-items:center;gap:12px;margin:14px 0;padding:14px;background:#0d1916;border:1px solid var(--line);border-radius:16px}.vehicle-card .car-icon{color:var(--lime);font-size:25px}.vehicle-card div:nth-child(2){flex:1}.vehicle-card small,.vehicle-card strong{display:block}.vehicle-card small{color:var(--muted);font-size:10px;margin-bottom:4px}.vehicle-card strong{font-size:13px}.vehicle-card button,.section-title button{color:var(--lime);border:0;background:none}.primary-btn{width:100%;border:0;border-radius:17px;padding:15px;background:var(--lime);color:#07110f;box-shadow:0 12px 35px #b9f55e26}.primary-btn span,.primary-btn small{display:block;font-weight:900}.primary-btn span{font-size:17px}.primary-btn small{font-size:10px;margin-top:3px;opacity:.7}.safety-note{text-align:center;color:#6f847c;font-size:10px}.rank-preview{margin-top:28px}.section-title{display:flex;justify-content:space-between;align-items:center}.section-title h2{font-size:18px}.podium-row{display:flex;align-items:center;gap:10px;padding:12px 6px;border-bottom:1px solid #1d302a}.podium-row.mine{background:#172720;border-radius:14px;padding:12px}.rank{width:20px;color:#879c94;font-weight:700}.rank.no1{color:#ffd260}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:800}.purple{background:#7458c8}.orange{background:#c97835}.green{background:#397b56}.blue{background:#307eb2}.gray{background:#59635f}.red{background:#a84242}.driver{flex:1}.driver b,.driver small{display:block}.driver b{font-size:13px}.driver small{color:var(--muted);font-size:10px;margin-top:3px}.podium-row>strong{font-size:18px}.drive-screen{min-height:100vh;background:radial-gradient(circle at 50% 35%,#244c37,transparent 42%);padding-top:20px}.drive-head{display:flex;justify-content:space-between;align-items:center;text-align:center}.drive-head small,.drive-head b{display:block}.drive-head small{color:var(--muted);font-size:11px}.drive-head b{font-size:20px;margin-top:3px}.live-dot{color:var(--lime);font-size:10px}.speed-wrap{text-align:center;margin:36px 0 14px}.speed-wrap span{font-size:74px;font-weight:300;letter-spacing:-5px}.speed-wrap small{margin-left:8px;color:var(--muted)}.stability-gauge{display:grid;place-items:center}.gauge-ring{width:196px;height:196px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--lime) 0 345deg,#23362f 345deg);position:relative;box-shadow:0 0 50px #b9f55e24}.gauge-ring:before{content:"";position:absolute;inset:12px;background:#0b1713;border-radius:50%}.gauge-ring>div{position:relative;text-align:center}.gauge-ring span,.gauge-ring small{display:block}.gauge-ring span{font-size:58px;font-weight:800}.gauge-ring small{color:var(--muted);font-size:11px}.sensor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0}.sensor-grid div{padding:14px;background:#101e1a;border:1px solid var(--line);border-radius:14px}.sensor-grid span,.sensor-grid b,.sensor-grid i{display:block}.sensor-grid span{color:var(--muted);font-size:10px}.sensor-grid b{margin:5px 0;font-size:17px}.sensor-grid i{font-size:10px;color:#8ea098;font-style:normal}.sensor-grid .good{color:var(--lime)}.event-strip{display:flex;align-items:center;gap:12px;background:#142720;border-radius:14px;padding:14px}.pulse{width:10px;height:10px;background:var(--lime);border-radius:50%;box-shadow:0 0 0 6px #b9f55e20}.event-strip div{flex:1}.event-strip b,.event-strip small{display:block}.event-strip b{font-size:12px}.event-strip small{color:var(--muted);font-size:10px;margin-top:4px}.finish-btn{width:100%;margin-top:18px;padding:14px;border-radius:14px;border:1px solid #4c6259;background:transparent;color:#c8d4cf}.result-screen{padding-top:22px}.back-home{border:0;background:transparent;color:var(--muted)}.result-hero{text-align:center;margin-top:22px}.result-hero>small{color:var(--muted)}.result-hero div b{font-size:72px;letter-spacing:-4px}.result-hero div span{color:var(--muted)}.result-hero p{font-size:12px}.result-hero p strong{color:var(--lime)}.result-badge{margin:12px auto 24px;width:100px;height:100px;border-radius:28px;background:var(--lime);color:#07110f;font-size:50px;font-weight:900;display:grid;place-items:center;transform:rotate(-4deg)}.result-badge span{display:block;font-size:9px;margin-top:-22px}.score-breakdown,.events-card,.formula{background:#101e1a;border:1px solid var(--line);border-radius:18px;padding:17px;margin-bottom:12px}.score-breakdown h2{font-size:16px;margin:0 0 15px}.metric{display:grid;grid-template-columns:1fr 35px;gap:4px 10px;margin:13px 0}.metric span{font-size:12px}.metric span small{color:var(--muted)}.metric b{text-align:right}.metric i{grid-column:1/3;height:5px;background:#263831;border-radius:3px;overflow:hidden}.metric em{display:block;height:100%;background:var(--lime)}.events-card{display:grid;grid-template-columns:repeat(3,1fr)}.events-card div{text-align:center;border-right:1px solid var(--line)}.events-card div:last-child{border:0}.events-card span,.events-card b,.events-card small{display:block}.events-card span{font-size:10px;color:var(--muted)}.events-card b{font-size:15px;margin:5px}.events-card small{font-size:9px;color:var(--danger)}.events-card div:last-child small{color:var(--lime)}.formula b{font-size:12px;color:var(--lime)}.formula p{color:var(--muted);font-size:11px;line-height:1.6;margin-bottom:0}.compact{margin-top:4px}.rank-screen{padding-top:20px}.rank-head{display:flex;gap:15px;align-items:center}.rank-head small{color:var(--muted);font-size:10px}.rank-head h2{font-size:20px;margin:2px 0}.filters{display:flex;background:#0f1c18;border-radius:13px;padding:4px;margin:24px 0}.filters button{flex:1;border:0;border-radius:10px;background:transparent;color:var(--muted);padding:9px}.filters .selected{background:#23362f;color:var(--lime)}.top-three{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:190px}.top-three>div{width:30%;background:#13231e;text-align:center;padding:12px 4px;border-radius:18px 18px 5px 5px;height:148px}.top-three .winner{height:180px;background:linear-gradient(#293d27,#15241f);border:1px solid #57723d}.top-three .avatar{margin:7px auto;width:44px;height:44px}.top-three span{font-size:12px;color:#ffd260}.top-three b,.top-three strong{display:block;font-size:11px}.top-three strong{font-size:19px;margin-top:5px}.rank-list{margin-top:18px}.rank-list>div{display:grid;grid-template-columns:25px 38px 1fr auto auto;gap:9px;align-items:center;padding:12px 8px;border-bottom:1px solid var(--line)}.rank-list .me{background:#172820;border-radius:14px}.rank-list b{font-size:12px}.rank-list small{color:var(--muted);font-size:10px}.rank-list strong{font-size:15px}.fair-note{margin-top:22px;padding:16px;background:#0d1916;border:1px solid var(--line);border-radius:16px}.fair-note b{font-size:12px;color:var(--lime)}.fair-note p{font-size:10px;color:var(--muted);line-height:1.6;margin-bottom:0}@media(min-width:700px){body{padding:24px}.phone-shell{min-height:900px;border-radius:32px;border:1px solid #273e36;box-shadow:0 30px 80px #000}.drive-screen{min-height:900px}}
