@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Noto+Sans+TC:wght@400;500;700&display=swap');
:root{--lime:#dfff83;--ink:#142824;--paper:#f3f5e9;--muted:#c0cbbb}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);font-family:'Noto Sans TC',sans-serif;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:4px}button:hover{filter:brightness(1.12)}button:active{transform:translateY(1px)}.hidden{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#loading{position:fixed;inset:0;background:#142824;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:20}h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-weight:900;letter-spacing:-.02em;line-height:.82;font-size:clamp(80px,8vw,132px);margin:30px 0}h1 span{display:block;color:var(--lime)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;display:flex;align-items:center;gap:9px}.topbar{position:fixed;z-index:4;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:28px 38px;background:linear-gradient(#14282499,transparent);pointer-events:none}.topbar>*{pointer-events:auto}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:38px;font-weight:800;letter-spacing:-.04em;display:flex;align-items:center}.brand-slash{color:var(--lime);margin:0 2px}.brand-caption{font-family:'Noto Sans TC',sans-serif;font-size:12px;letter-spacing:.16em;margin-left:15px}.top-center{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:500;letter-spacing:.08em;text-shadow:0 1px 8px #000}.live-dot{width:6px;height:6px;flex-shrink:0;display:inline-block;border-radius:50%;background:var(--lime)}.divider{opacity:.4;margin:0 10px}.topbar nav{display:flex;gap:10px}.topbar button,.map-heading button{background:#142824ab;border:1px solid #e5f4d92b;padding:9px 14px;border-radius:4px;font-size:14px}kbd{font-family:inherit;font-size:12px;background:#f3f5e918;border:1px solid #f3f5e929;border-radius:3px;padding:2px 5px;margin-left:5px}.overlay{position:fixed;inset:0;background:linear-gradient(90deg,#142824ed 0%,#142824cc 24%,#14282411 63%,transparent);z-index:3}.start-panel{position:absolute;top:50%;left:7%;transform:translateY(-48%);width:370px}.intro-lead{font-size:28px;font-weight:700;line-height:1.5;margin:26px 0 14px}.intro-copy{font-size:14px;color:#d4ded0;line-height:1.9;max-width:310px}.start-divider{height:1px;background:#f3f5e926;margin:25px 0 16px}.start-meta{font-size:11px;letter-spacing:.07em;display:flex;justify-content:space-between;margin-bottom:18px}.primary{background:var(--lime);color:var(--ink);width:100%;padding:17px 20px;text-align:left;font-weight:700;font-size:16px;border-radius:3px;display:flex;justify-content:space-between;align-items:center}.primary span{font-size:12px;font-weight:500}.start-note{font-size:12px;line-height:1.8;color:#bbccbd;margin-top:16px}.intro-bottom{position:absolute;bottom:32px;left:7%;right:7%;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;color:#cad9c7}#hud{pointer-events:none;position:fixed;inset:0;z-index:2}.mission-card{position:absolute;top:118px;left:38px;width:310px;padding:20px 22px;background:#142824db;border:1px solid #e9f5da22;border-radius:5px;backdrop-filter:blur(14px)}.mission-card .eyebrow{font-size:11px;color:var(--lime);letter-spacing:.08em}.mission-card .eyebrow #mission-count{margin-left:auto;color:#bccbb9}.mission-card h2{font-size:18px;margin:17px 0 8px;font-weight:500}.mission-card p{font-size:13px;color:#b8c9b9;margin:0;line-height:1.8}.mission-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:22px}#distance{font-family:'Barlow Condensed',sans-serif;font-size:27px;font-weight:600;color:var(--lime)}#reward{font-size:11px;color:#ccdac7}.progress-track{height:3px;background:#cdddba26;margin-top:14px}.progress-track i{display:block;width:0;background:var(--lime);height:100%;transition:width .3s}.bottom-left{position:absolute;left:38px;bottom:80px}.map-shell{position:relative;width:240px;height:190px;border:1px solid #e9f5da26;border-radius:5px;overflow:hidden;background:#142824e6}.map-north{position:absolute;right:12px;top:10px;color:#dfff83;font-size:12px}.map-caption{position:absolute;left:12px;bottom:10px;font-size:10px;letter-spacing:.15em;color:#becdb9}.location{margin-top:12px;display:flex;align-items:center;gap:10px;font-size:14px;text-shadow:0 1px 9px #000}.location-mark{width:6px;height:6px;background:var(--lime);transform:rotate(45deg)}.speed-panel{position:absolute;right:40px;bottom:84px;width:194px;text-shadow:0 2px 14px #142824}.speed-panel .eyebrow{font-size:11px;letter-spacing:.14em}.speed-number{display:flex;align-items:baseline;justify-content:flex-end;gap:12px}.speed-number #speed{font-family:'Barlow Condensed',Impact,sans-serif;font-size:100px;line-height:1.2;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.speed-unit{font-size:11px;color:#d0dccb;letter-spacing:.12em}.speed-bottom{border-top:1px solid #f3f5e951;padding-top:10px;display:flex;justify-content:space-between;font-size:16px}#gear{color:var(--lime)}.key-guide{position:absolute;bottom:30px;left:38px;right:38px;display:flex;gap:20px;justify-content:center;font-size:11px;color:#d8e4d4;text-shadow:0 1px 8px #000}.key-guide kbd{margin-right:4px}.interaction{position:absolute;left:50%;bottom:29%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:14px 20px;border-radius:4px;background:#142824dd;font-size:14px}.interaction kbd{background:var(--lime);color:var(--ink);font-weight:700;font-size:16px}.toast{position:fixed;top:98px;left:50%;transform:translateX(-50%);background:var(--lime);color:var(--ink);padding:13px 22px;border-radius:4px;font-size:14px;z-index:12;max-width:90%;text-align:center}.modal{position:fixed;inset:0;background:#061d19ab;backdrop-filter:blur(10px);z-index:8;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}.dialog{width:410px;padding:36px;background:#142824;border:1px solid #cedfc238;border-radius:8px;max-height:95vh;overflow:auto}.dialog>.eyebrow{color:var(--lime)}.dialog h2{font-size:36px;line-height:1.4;letter-spacing:-.03em;margin:22px 0 12px}.dialog p{color:#c0cdbb;font-size:14px;line-height:1.8}.dialog .primary{margin-top:25px}.secondary{background:transparent;border:1px solid #cedfc238;padding:14px 18px;width:100%;margin-top:12px;border-radius:3px;font-size:14px}.options{display:flex;justify-content:space-between;gap:10px;margin-top:20px}.options button{background:#e8f3da0a;font-size:12px;padding:10px;border-radius:3px;flex:1}details{margin-top:22px;border-top:1px solid #cedfc222;padding-top:18px;font-size:12px;color:#b7c9b8}summary{cursor:pointer}a{color:inherit}details p{font-size:12px!important}.map-dialog{width:min(950px,95vw);background:#142824;border:1px solid #cedfc238;border-radius:8px;padding:24px;max-height:94vh;overflow:auto}.map-heading{display:flex;justify-content:space-between;align-items:center}.map-heading .eyebrow{color:#a7bfa4;font-size:11px}.map-heading h2{font-family:'Barlow Condensed',sans-serif;font-size:34px;margin:8px 0 18px}#bigmap{width:100%;max-height:65vh;object-fit:contain;background:#142824}.map-legend{display:flex;gap:28px;font-size:12px;margin-top:18px;color:#c8d7c2}.map-legend i{display:inline-block;width:9px;height:9px;margin-right:7px}.legend-player{background:#dfff83;clip-path:polygon(50% 0,100% 100%,50% 75%,0 100%)}.legend-goal{border:2px solid #ffc56d;border-radius:50%}.result{display:grid;grid-template-columns:1fr 1fr;gap:15px;font-size:14px;margin:24px 0;padding:20px 0;border-block:1px solid #cedfc222}.result strong{text-align:right;color:var(--lime)}.attribution{position:fixed;z-index:4;bottom:7px;left:50%;transform:translateX(-50%);font-size:9px;color:#cfdecda6;white-space:nowrap}.attribution a{text-decoration:none}#touch-controls{position:fixed;bottom:35px;left:18px;right:18px;z-index:5;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none}#touch-controls button{pointer-events:auto;background:#142824bc;border:1px solid #dfff8344;border-radius:9px;width:54px;height:54px;font-size:18px;touch-action:none;user-select:none;-webkit-user-select:none}#touch-controls button.pressed{background:#dfff83;color:#142824}.touch-steer{text-align:center}.touch-steer>button{margin-bottom:5px}.touch-steer>div{display:flex;gap:5px}.touch-actions{display:flex;flex-direction:column;gap:8px}.touch-actions button{font-size:12px!important;width:70px!important}
@media(max-width:900px){.brand-caption{display:none}.topbar{padding:20px}.top-center{font-size:10px;gap:7px}.topbar button{font-size:12px;padding:8px}.topbar kbd{display:none}.mission-card{left:20px;top:90px;width:260px;padding:16px}.bottom-left{left:20px;bottom:200px}.map-shell{width:170px;height:130px}.map-shell canvas{width:170px;height:135px}.speed-panel{right:20px;bottom:215px;width:145px}.speed-number #speed{font-size:75px}.key-guide{display:none}.start-panel{left:7%;width:330px}.start-panel h1{font-size:100px}.interaction{bottom:190px}.intro-bottom{bottom:25px}.speed-panel .eyebrow{font-size:9px}}
@media(max-width:600px){.topbar{padding:15px}.brand{font-size:30px}.top-center #district{display:none}.top-center .divider{display:none}.topbar nav{gap:5px}.topbar button{padding:8px 9px}.start-panel{left:8%;width:84%;top:48%;max-width:330px}.start-panel h1{font-size:95px;margin:23px 0}.intro-lead{font-size:24px;margin:20px 0 10px}.intro-copy{font-size:13px}.start-divider{margin:18px 0 13px}.overlay{background:linear-gradient(90deg,#142824ea,#1428249c)}.intro-bottom{left:8%;right:8%;font-size:9px}.mission-card{top:76px;left:15px;width:240px;padding:14px 16px}.mission-card h2{font-size:16px;margin:10px 0 5px}.mission-card p{font-size:12px}.mission-bottom{margin-top:10px}#distance{font-size:22px}.bottom-left{left:15px;bottom:205px}.map-shell{width:140px;height:105px}.map-shell canvas{width:140px;height:110px}.location{font-size:11px;margin-top:7px}.map-caption{font-size:8px}.speed-panel{bottom:216px;right:15px;width:126px}.speed-number #speed{font-size:65px}.speed-unit{font-size:9px}.speed-bottom{font-size:13px}.dialog{padding:26px}.map-dialog{padding:16px}.map-legend{gap:13px;font-size:10px}.map-heading h2{font-size:28px}.interaction{width:max-content;max-width:90%;font-size:12px;bottom:165px}#toast{top:68px;font-size:12px;padding:10px 15px}}
@media(max-height:600px) and (orientation:landscape){.start-panel{top:54%;width:390px}.start-panel h1{font-size:74px;margin:15px 0}.intro-lead{display:none}.intro-copy{margin:10px 0;max-width:none}.start-divider{margin:12px 0}.start-note{font-size:10px;margin:8px 0}.intro-bottom{display:none}.mission-card{width:235px;top:75px}.bottom-left{bottom:140px}.map-shell{height:100px;width:140px}.map-shell canvas{height:110px;width:140px}.speed-panel{bottom:130px}.interaction{bottom:120px}.topbar{padding:12px 20px}}

@media(max-width:600px){#toast{top:auto;bottom:172px;width:max-content;max-width:90%;font-size:12px}}

/* Version 2: crime HUD and controls. */
.crime-panel{position:absolute;right:38px;top:115px;width:230px;padding:16px 18px;background:#142824d9;border:1px solid #e9f5da22;border-radius:5px;backdrop-filter:blur(12px)}#wanted-stars{font-size:27px;letter-spacing:3px;color:#9aad9b;line-height:1.1}#wanted-stars.wanted{color:#ffc56d;text-shadow:0 0 18px #f5ab5944}#wanted-status{font-size:12px;margin:9px 0 15px;color:#cfdbca}.health-line{font-size:11px;display:flex;justify-content:space-between;gap:8px;color:#cddcca}.health-line b{font-size:14px;color:#f4f7e8}.health-track{height:3px;background:#e9f5da22;margin-top:8px}.health-track i{display:block;background:var(--lime);width:100%;height:100%;transition:width .2s}#crosshair{position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%);color:#f3f5e9}#crosshair::before,#crosshair::after{content:'';position:absolute;background:currentColor;box-shadow:0 0 2px #000}#crosshair::before{width:18px;height:2px;top:10px;left:2px}#crosshair::after{height:18px;width:2px;top:2px;left:10px}#crosshair i{position:absolute;width:4px;height:4px;top:9px;left:9px;background:var(--lime)}#hit-marker{position:absolute;inset:-5px;border:2px solid transparent;transform:rotate(45deg)}#hit-marker.hit{border-color:#ffca74}#damage-flash{pointer-events:none;position:fixed;inset:0;z-index:7;opacity:0;box-shadow:inset 0 0 130px #df584bb0;transition:opacity .1s}#damage-flash.active{opacity:1}.legend-police{background:#65baff;border-radius:50%}.key-guide{gap:12px}.touch-actions #touch-attack{background:#dfff83de;color:#142824;font-weight:700}.touch-actions #touch-weapon{height:38px;border-color:#e9f5da22;font-size:10px!important}#world:focus{outline:none}
@media(max-width:900px){.crime-panel{right:20px;top:90px;width:175px;padding:12px}#wanted-stars{font-size:22px;letter-spacing:2px}.crime-panel .health-line{font-size:10px;flex-wrap:wrap}#wanted-status{font-size:11px;margin:7px 0 10px}.touch-actions{gap:6px}}
@media(max-width:600px){.mission-card{width:205px;padding:12px}.mission-card h2{font-size:14px}.mission-card p{font-size:11px}.mission-card #reward{font-size:9px}.crime-panel{right:15px;top:76px;width:142px;padding:11px}#wanted-stars{font-size:19px;letter-spacing:1px}.health-line{font-size:9px;gap:4px}.health-line #weapon-label{width:100%;font-size:9px}.health-line b{font-size:12px}#wanted-status{font-size:10px;margin:7px 0}.top-center{max-width:80px}.start-panel .start-note{line-height:1.6}.map-legend{flex-wrap:wrap;gap:12px}.map-caption{font-size:8px}.interaction{bottom:255px}#toast{bottom:272px}.speed-panel{bottom:282px}.bottom-left{bottom:276px}}
@media(max-height:600px) and (orientation:landscape){.crime-panel{top:74px;right:18px;width:180px}.touch-actions{flex-direction:row;align-items:flex-end}.touch-actions #touch-weapon{height:54px}.speed-panel{bottom:105px}.bottom-left{bottom:145px}.interaction{bottom:130px}#touch-controls{bottom:18px}}

#car-condition{margin-top:12px;padding:10px;background:#142824db;border-radius:4px}.condition-line{display:flex;justify-content:space-between;gap:8px;font-size:14px}.condition-track{height:4px;background:#ffffff26;margin-top:8px}.condition-track i{display:block;width:100%;height:100%;background:var(--lime);transition:width .15s}#car-condition[data-status="smoke"] .condition-track i{background:#ffc56d}#car-condition[data-status="fire"],#car-condition[data-status="wrecked"]{color:#ff9e6d;border:1px solid #ff7549}#car-condition[data-status="fire"] .condition-track i{background:#ff7549}@media(max-width:600px){#car-condition{padding:7px}.condition-line{font-size:12px}}

.view-options{border-top:1px solid #ffffff26;margin-top:22px;padding-top:8px}.view-options h3{font-size:16px;font-weight:500;margin:15px 0}.view-options>label{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin-top:14px;gap:12px}.view-options output{font-variant-numeric:tabular-nums;color:var(--lime)}.view-options>input[type=range]{width:100%;accent-color:var(--lime);height:28px;margin-top:6px}.view-options label.setting-check{justify-content:flex-start;line-height:1.5}.setting-check input{accent-color:var(--lime);width:18px;height:18px}.view-options .secondary{font-size:14px;padding:10px}.touch-actions #touch-run{height:38px;font-size:12px!important}.touch-actions #touch-run[aria-pressed=true]{background:var(--lime);color:#142824}.dialog{width:450px}#pause .dialog{padding:26px}#pause h2{font-size:28px;margin:12px 0 8px}#pause .primary{margin-top:12px}@media(max-width:600px){.topbar nav{gap:3px}.topbar button{font-size:11px;padding:8px 7px}.touch-actions{gap:5px}#touch-controls{bottom:22px}.speed-panel{bottom:315px}.bottom-left{bottom:304px}.interaction{bottom:290px}#pause .dialog{padding:22px}}

.jtv-panel{position:fixed;z-index:12;left:28px;top:96px;width:320px;padding:24px;background:#21182bef;border:1px solid #e69bff55;border-radius:16px;color:#f6e9ff;backdrop-filter:blur(12px)}.jtv-panel h2{margin:10px 0;font-size:26px}.jtv-panel small{display:block;margin-top:15px;font-size:11px;color:#b9a7c9}.jtv-actions{display:grid;gap:9px}.jtv-actions button{display:flex;justify-content:space-between;padding:13px;background:#493052;border:1px solid #956ca3;color:#fff;border-radius:8px}.jtv-actions button:hover{background:#60426d}#jtv-wallet{font-size:21px;color:#f7d590}#jtv-activity{min-height:48px;line-height:1.6;color:#ded0e7;font-size:13px}@media(max-width:700px){.jtv-panel{left:12px;top:76px;width:240px;padding:14px}.jtv-panel h2{font-size:19px}.jtv-actions button{padding:10px}.topbar nav{gap:3px}.topbar nav button{padding:8px;font-size:11px}.jtv-panel small{font-size:10px}}

.jtv-panel{max-height:calc(100dvh - 140px);overflow:auto}#jtv-music-options{margin-top:14px;border-top:1px solid #956ca344;padding-top:14px}#jtv-music-options summary{cursor:pointer;color:#f0caff;font-size:13px}#jtv-music-options label{display:block;margin:12px 0 5px;font-size:12px}#jtv-song-select{width:100%;padding:8px;background:#32253a;color:#fff;border:1px solid #956ca3;border-radius:5px}#jtv-music-container:not(:empty){min-height:200px;margin-top:10px}#jtv-music-container iframe{width:100%;min-width:200px;height:200px;border:0}#jtv-music-status{font-size:11px;line-height:1.5;color:#bba9c9}#jtv-music-status a{color:#dfbdff}@media(max-width:700px){.jtv-panel{max-height:calc(100dvh - 245px)}}
