@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#07121b;--panel:#101f2a;--ink:#edf4ef;--muted:#91a8af;--teal:#78d7c7;--amber:#ffc16b;--line:rgba(172,207,210,.19);font-family:'Barlow','Noto Sans JP',sans-serif;font-size:16px;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,a,input,textarea{touch-action:manipulation}button,input,textarea{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;background:transparent;color:inherit;border:1px solid var(--line);padding:10px 15px;border-radius:3px;transition:background .18s,border-color .18s,transform .18s}button:hover{background:#24404a;border-color:var(--teal)}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}a:hover{color:var(--amber)}.link-button{display:inline-block;border:1px solid var(--line);padding:10px 15px;border-radius:3px;text-align:center;transition:background .18s,border-color .18s,transform .18s}.link-button:hover{background:#24404a;border-color:var(--teal);color:inherit}.link-button:active{transform:translateY(1px)}:focus-visible{outline:3px solid var(--amber);outline-offset:4px}button[aria-pressed=true]{color:var(--amber);border-color:var(--amber)}[hidden]{display:none!important}.eyebrow{font-size:13px;letter-spacing:.15em;font-weight:600;color:var(--teal)}.skip{position:fixed;top:-100px;left:10px;background:var(--amber);color:var(--bg);padding:12px;z-index:100}.skip:focus{top:10px}#world{display:none;position:fixed;inset:0;width:100%;height:100%;outline:none}#world:focus-visible{outline:3px solid var(--amber);outline-offset:-3px}.has-game{overflow:hidden}.has-game #world{display:block}.screen-vignette{display:none;position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,13,20,.72),transparent 56%),linear-gradient(0deg,#07121bf0,transparent 26%,transparent 80%,#07121b80);z-index:1}.has-game .screen-vignette{display:block}.topbar{height:98px;padding:0 4%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5;border-bottom:1px solid var(--line);gap:20px;background:#07121b40}.brand{display:flex;align-items:center;gap:14px;font-size:19px;font-weight:700;letter-spacing:.04em}.brand small{display:block;font-size:10px;letter-spacing:.2em;font-weight:500;color:var(--muted);margin-top:6px}.brand-domain{font-weight:500;color:var(--muted)}.brand-mark{display:grid;place-items:center;width:36px;height:39px;font-size:34px;background:var(--teal);color:var(--bg);clip-path:polygon(0 0,75% 0,100% 25%,100% 100%,25% 100%,0 75%)}.top-actions{display:flex;align-items:center;gap:10px}.top-actions button{font-size:12px;letter-spacing:.06em;padding:10px 11px}.top-actions #help{border-radius:16px;height:32px;padding:0 13px;font-size:16px;display:inline-flex;align-items:center;gap:7px;line-height:1}.help-word{font-size:11px;letter-spacing:.1em;font-weight:600}.top-actions .normal-button{display:inline-flex;align-items:center;border-left:1px solid var(--line);padding:10px 11px 10px 24px;margin-left:14px;font-size:14px;letter-spacing:.06em}.normal-button span{margin-left:15px}.loader{position:fixed;inset:0;z-index:20;background:#07121b;display:flex;flex-direction:column;align-items:center;justify-content:center}.loader-word{font:700 30px 'Barlow Condensed',sans-serif;color:var(--teal);letter-spacing:.07em}.loader-word span{font-size:15px;margin-left:14px;color:var(--amber)}.loader p{letter-spacing:.25em;font-size:15px}.loader small{color:var(--muted);margin-top:15px;letter-spacing:.15em}.loader .link-button{margin-top:35px;font-size:14px}.load-line{height:3px;width:230px;background:linear-gradient(90deg,var(--amber),var(--teal));transform-origin:left;animation:load 1s ease-in-out infinite alternate}@keyframes load{from{transform:scaleX(.3);opacity:.5}to{transform:scaleX(1);opacity:1}}
#experience{position:fixed;inset:98px 0 0;z-index:2;pointer-events:none}#experience button,#experience a,#experience nav,#experience #joystick,#experience #drive-pad{pointer-events:auto}#title-screen{position:absolute;left:5%;top:7%;width:390px}.title-kicker{font-size:11px;letter-spacing:.19em;color:var(--teal);margin:0 0 17px;display:flex;align-items:center;gap:9px}.title-kicker span{display:inline-block;width:6px;height:6px;background:var(--teal);box-shadow:0 0 10px #78d7c744}#game-title{font:900 clamp(68px,7.6vw,118px)/.81 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.016em;margin:0;position:relative;text-shadow:1px 1px 0 #9baea6,2px 2px 0 #899b95,3px 3px 0 #566f6c,4px 4px 0 #3f5757,5px 5px 0 #223d44,9px 12px 0 #03101960;transform:skewY(-3deg);transform-origin:left}#game-title em{font-style:normal;color:var(--amber);text-shadow:1px 1px 0 #daa65e,2px 2px 0 #9c713c,3px 3px 0 #765734,4px 4px 0 #5b4932,6px 7px 0 #03101970}.title-line{height:5px;background:var(--amber);display:block;width:56px;margin-top:25px}.title-ja{font-size:20px;font-weight:700;letter-spacing:.07em;margin:25px 0 13px}.title-description{font-size:14px;line-height:1.9;color:#a8bac0;margin:0 0 27px}.start-button{display:flex;align-items:center;justify-content:space-between;gap:45px;border:0;background:var(--amber);color:#10202a;padding:17px 24px;font:700 24px 'Barlow Condensed',sans-serif;letter-spacing:.1em;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));min-width:258px}.start-button:hover{background:#ffd49a}.start-button>span:last-child{font-size:28px}.start-caption{font-size:11px;color:#c7d0cc;margin:10px 0 19px;letter-spacing:.04em}.start-caption span{margin-left:25px;color:var(--muted)}.scene-caption{position:absolute;right:5%;top:6%;text-align:right;display:flex;flex-direction:column;gap:5px;color:#a8c4c8;letter-spacing:.18em;font-size:10px}.scene-caption strong{font:600 21px 'Barlow Condensed',sans-serif;letter-spacing:.2em;color:var(--ink)}.map-panel{position:absolute;right:4%;bottom:174px;width:195px;padding:13px 15px 10px;background:#071620ab;border:1px solid var(--line);border-radius:4px;backdrop-filter:blur(7px)}.map-heading,.map-foot{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;color:var(--muted)}.map-heading span:last-child{color:var(--amber)}#minimap{width:100%;height:115px;overflow:visible}#map-track{fill:none;stroke:#526c76;stroke-width:7;stroke-linejoin:round}#map-player{fill:var(--amber);stroke:#10232c;stroke-width:2}.map-foot{font-size:9px;letter-spacing:0}.map-foot>span:first-child{color:var(--amber)}.map-foot b{font-weight:400;color:var(--ink)}#pit-dock{position:absolute;bottom:42px;left:4%;right:4%}#pit-nav-note{display:none;margin:0 0 7px;font-size:10px;letter-spacing:.04em;line-height:1.6;color:#8fa8b0;border-left:2px solid var(--teal);padding-left:9px}.driving #pit-nav-note{display:block}.pit-nav{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0c1924b3;backdrop-filter:blur(12px)}.pit-card{position:relative;border:0;border-right:1px solid var(--line);text-align:left;border-radius:0;padding:17px 19px 16px;min-width:0}.pit-card:last-child{border-right:0}.pit-card .pit-number{font-size:12px;color:var(--teal);display:block;margin-bottom:9px;font-variant-numeric:tabular-nums}.pit-card .pit-number span{float:right;color:#748d96}.pit-card strong{font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:20px;letter-spacing:.07em;display:block}.pit-card .pit-jp{font-size:12px;color:var(--muted);display:block;margin-top:4px}.pit-card.visited:before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--teal)}.pit-card.visited .pit-number span{color:var(--teal)}.bottom-meta{position:absolute;bottom:0;left:4%;right:4%;height:42px;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.1em;color:#839ba3}.bottom-meta button{border:0;padding:4px;font-size:10px;color:var(--muted)}.drive-label{position:absolute;left:4%;top:26px;display:flex;flex-direction:column;gap:12px}.drive-label strong{font-size:22px;letter-spacing:.07em}.drive-label button{font-size:12px;width:max-content;padding:7px 10px}.speedometer{position:absolute;bottom:181px;left:4%;display:flex;align-items:center;gap:16px;font-size:14px}.speedometer>span:first-child{font:700 68px/.9 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums}.speedometer small{font-size:10px;letter-spacing:.1em;color:var(--muted)}kbd{font:500 11px 'Barlow',sans-serif;border:1px solid #56707980;border-radius:3px;padding:3px 5px;color:var(--ink)}.pit-in{position:absolute;bottom:188px;left:50%;transform:translateX(-50%);flex-direction:column;gap:5px;min-width:290px;padding:16px 26px}.pit-in>span{font-size:13px!important}.pit-in strong{font-size:26px}.pit-in small{font-size:12px;vertical-align:middle;margin-left:18px}.pit-in:active{transform:translateX(-50%) translateY(1px)}.driving .scene-caption{display:none}.driving .screen-vignette{background:linear-gradient(0deg,#07121bf0,transparent 28%,transparent 85%,#07121b40)}
dialog{border:1px solid #668b9360;background:var(--panel);color:var(--ink);padding:0;border-radius:6px;box-shadow:0 30px 100px #000a;max-width:calc(100vw - 40px)}dialog::backdrop{background:#020b14b0;backdrop-filter:blur(8px)}.info-dialog{width:1060px;max-height:88dvh}.info-dialog[open]{display:flex;flex-direction:column}.dialog-bar{display:flex;justify-content:space-between;align-items:center;padding:17px 26px;border-bottom:1px solid var(--line);gap:10px;flex-shrink:0}.dialog-bar>span{color:var(--teal);letter-spacing:.12em;font-size:12px}.dialog-bar button{border:0;padding:6px;font-size:13px}.dialog-bar kbd{margin-left:15px;margin-right:10px}#panel-body{overflow-y:auto;overscroll-behavior:contain;min-height:0;scrollbar-color:#536f78 #0d1b24}.dialog-foot{display:flex;justify-content:flex-end;align-items:center;gap:20px;padding:16px 26px;border-top:1px solid var(--line);flex-shrink:0}.dialog-foot>span{font-size:10px;letter-spacing:.1em;color:var(--teal);margin-right:auto}.dialog-foot button{font-size:13px}.dialog-foot #resume{color:var(--amber);border-color:#ffc16b60}.info-section{max-width:1160px;margin:auto;padding:58px 65px}.article-header .eyebrow{color:var(--teal);font-size:12px}.article-header h2{font-size:38px;letter-spacing:.06em;line-height:1.4;margin:12px 0 28px}.article-header .tagline{font-size:23px;font-weight:700;letter-spacing:.03em;color:var(--amber);line-height:1.6}.lead{font-size:16px;line-height:2.1;color:#c0ced1;max-width:800px}.info-section h3{font-size:22px;margin:42px 0 22px;border-top:1px solid var(--line);padding-top:26px}.info-section h3 small{font-size:13px;font-weight:400;margin-left:16px;color:var(--muted)}.info-section h4{font-size:17px;margin:10px 0 12px;font-weight:600;line-height:1.7}.info-section p{line-height:1.95;color:#c4d0d4;font-size:16px}.article-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 32px}.article-grid>article{border-left:2px solid #335762;padding:0 0 0 21px}.article-grid .eyebrow{font-size:11px}.article-grid p{font-size:15px;margin:0}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0 0;padding:0;list-style:none}.tags li{font-size:12px;color:#b3c7cd;background:#213642;padding:4px 8px;border:1px solid #57737d30;border-radius:2px;line-height:1.5}.identity{font-size:23px!important}.identity span{font-size:15px;margin-left:20px;color:var(--teal)}.career{padding:0;list-style:none}.career li{display:flex;gap:30px;padding:20px 0;border-bottom:1px solid var(--line)}.career time{color:var(--amber);font-size:16px;padding-top:13px;min-width:85px}.career p{margin:0}.spec-list{margin:12px 0 30px}.spec-list>div{display:grid;grid-template-columns:minmax(115px,25%) 1fr;gap:20px;border-bottom:1px solid var(--line);padding:14px 0;font-size:15px;line-height:1.8}.spec-list dt{color:var(--muted)}.spec-list dd{margin:0;min-width:0;overflow-wrap:anywhere}.spec-list .tags{margin:0}.notice{border:1px solid #ffc16b40;background:#ffc16b08;padding:20px;font-size:14px!important}.notice strong{display:block;color:var(--amber);margin-bottom:8px;font-size:13px}.product-card{padding:30px;margin-top:30px;border:1px solid var(--line);background:linear-gradient(140deg,#183b45,#10202a)}.product-card h3{font:700 50px 'Barlow Condensed',sans-serif;border:0;padding:0;margin:12px 0}.product-card>a{display:inline-block;margin-top:25px;color:var(--amber)}.stats{display:flex;gap:65px;padding:20px 0}.stats>div{display:flex;align-items:center;gap:18px}.stats b{font:700 90px 'Barlow Condensed',sans-serif;color:var(--amber)}.stats span{font-size:14px;line-height:1.8}.case{margin:24px 0;padding:0 0 18px;border-bottom:1px solid var(--line)}.case a{color:var(--teal)}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px}.channels{display:flex;flex-direction:column;gap:15px}.channels a{font-size:14px;color:var(--teal);overflow-wrap:anywhere}form label{display:block;font-size:14px;margin:20px 0 8px}form label span{font-size:10px;color:var(--amber);margin-left:9px}input,textarea{width:100%;border:1px solid #55717c;background:#091721;color:var(--ink);padding:12px 14px;border-radius:3px;line-height:1.7;font-size:16px}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#748b93;font-size:14px}.primary{background:var(--amber);color:#0d202a;border:0;padding:13px 19px;font-size:15px;font-weight:600}.primary:hover{background:#ffd49a;color:#0d202a}.primary span{margin-left:25px}.form-note,#formFeedback{font-size:13px!important}.form-note{color:var(--muted)!important}.review-actions{display:flex;gap:10px;flex-wrap:wrap}#reviewFields dd{white-space:pre-wrap}#formReview{border-top:1px solid var(--line);margin-top:20px;padding-top:20px}#localFormNote{font-size:14px}#localFormNote a{color:var(--teal)}.intro-dialog{width:700px}.intro-dialog[open]{display:flex;gap:20px;padding:30px}.robot-portrait{width:150px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0b1721;border:1px solid var(--line)}.robot-portrait canvas{width:140px;height:140px}.robot-portrait>span{font-size:9px;letter-spacing:.08em;color:var(--teal);margin-bottom:15px}.speech{flex:1;min-width:0}.speech>p{min-height:88px;font-size:17px;line-height:1.9;margin:18px 0}.speech button{background:var(--amber);color:#13242c;border:0;font-size:14px;padding:10px 22px}.speech button span{margin-left:25px}.speech>span:last-child{float:right;font-size:12px;color:var(--muted);margin-top:12px}.help-dialog{width:660px;max-height:90dvh;overflow:auto}.handbook{padding:32px}.handbook h2{font-size:25px;line-height:1.7}.handbook p{font-size:15px;color:#b4c7cc;line-height:1.9}#toast{position:fixed;top:112px;left:50%;transform:translateX(-50%);z-index:30;padding:16px 24px;border:1px solid var(--teal);background:#102632f5;color:var(--ink);font-size:14px;max-width:90%;box-shadow:0 10px 40px #0004;text-align:center}#site-content{background:#0c1c27}#site-content .info-section{border-top:1px solid var(--line);padding:70px 60px}#site-content .regular-hero{padding:85px 60px;max-width:1160px;margin:auto}.regular-hero h1{font-size:52px;line-height:1.5;letter-spacing:.03em;margin:20px 0}.regular-hero p{color:var(--muted);line-height:1.9}.regular-hero nav{display:flex;flex-wrap:wrap;gap:16px;margin:30px 0}.regular-hero nav a{font-size:14px;color:var(--teal);border-bottom:1px solid var(--line);padding:6px 0}#site-content footer{padding:35px;text-align:center;color:var(--muted);font-size:13px}.noscript-note{padding:20px;text-align:center;color:var(--amber);font-size:14px}#touch-controls{display:none}#mouse-controls{display:none}#drive-pad{touch-action:none}
@media(min-width:901px) and (max-height:850px){#title-screen{top:5%}#game-title{font-size:87px}.title-ja{margin-top:21px;font-size:18px}.title-description{margin-bottom:18px;font-size:13px}.title-line{margin-top:18px}.start-button{padding:13px 22px}.start-caption{margin-bottom:12px}.pit-card{padding-top:12px;padding-bottom:12px}.map-panel{bottom:160px}}
@media(min-width:901px) and (max-height:720px){#title-screen{top:4%}#game-title{font-size:69px}.title-kicker{margin-bottom:13px}.title-ja{font-size:17px;margin:16px 0 8px}.title-description{font-size:12px;margin-bottom:12px}.title-line{margin-top:14px}.start-caption{margin:7px 0 10px}.start-button{font-size:21px;padding:10px 20px}#pit-dock{bottom:32px}.pit-card{padding:10px 16px}.pit-card .pit-number{margin-bottom:4px}.bottom-meta{height:32px}.map-panel{bottom:143px}}
@media(max-width:900px){.topbar{height:80px;padding:0 4%}.brand{font-size:16px;gap:9px}.brand small{font-size:8px;letter-spacing:.1em}.brand-mark{width:30px;height:33px;font-size:27px}.top-actions{gap:7px}.top-actions button{padding:8px;font-size:11px}.top-actions .normal-button{padding:8px 8px 8px 12px;margin-left:0;font-size:12px}.normal-button span{display:none}#experience{inset:80px 0 0}#title-screen{top:6%;width:320px}#game-title{font-size:86px}.title-description{font-size:13px}.scene-caption{right:4%;top:4%}.map-panel{width:150px;bottom:170px}.pit-card{padding:14px 12px}.pit-card strong{font-size:18px}.pit-card .pit-jp{font-size:11px}.pit-card .pit-number{font-size:11px}.bottom-meta>span:nth-child(2){display:none}.info-section{padding:36px}.dialog-foot{gap:10px;padding:12px 20px}.dialog-foot>span{display:none}.dialog-foot button{font-size:12px}.contact-grid{grid-template-columns:1fr}.top-actions #effects{display:none}.top-actions #help{border-radius:50%;width:32px;height:32px;padding:0;font-size:17px;justify-content:center}.help-word{display:none}.article-grid{gap:24px}.drive-label strong{font-size:19px}}
@media(max-width:600px){.topbar{height:72px}.brand{font-size:14px}.brand small{font-size:7px;letter-spacing:.05em}.brand-mark{width:25px;height:28px;font-size:23px}.top-actions #music{font-size:15px;border:0;padding:6px}.top-actions #music span{display:none}.top-actions #help{width:26px;height:26px;font-size:14px}.top-actions .normal-button{padding:7px 0 7px 10px;font-size:11px}#experience{inset:72px 0 0}#title-screen{top:27px;left:6%;width:88%}.title-kicker{font-size:9px;letter-spacing:.12em;margin-bottom:16px}#game-title{font-size:73px;line-height:.8;width:max-content}.title-line{margin-top:18px;height:3px;width:40px}.title-ja{font-size:15px;margin:20px 0 10px}.title-description{font-size:11px;line-height:1.8;margin-bottom:20px;width:240px}.start-button{min-width:217px;font-size:22px;padding:14px 20px;gap:30px}.start-caption{font-size:9px;margin:8px 0 13px}.start-caption span{margin-left:16px}.scene-caption{top:auto;bottom:161px;right:5%;font-size:8px;letter-spacing:.1em}.scene-caption strong{font-size:14px}.scene-caption>span:last-child{display:none}.map-panel{display:none}#pit-dock{bottom:33px}#pit-nav-note{font-size:9px;margin-bottom:6px;padding-left:7px}.pit-nav{grid-template-columns:repeat(6,115px);overflow:auto;scrollbar-width:thin}.pit-card{padding:12px 11px}.pit-card strong{font-size:17px}.pit-card .pit-number{font-size:10px;margin-bottom:6px}.pit-card .pit-jp{font-size:10px}.bottom-meta{height:33px;font-size:8px}.screen-vignette{background:linear-gradient(90deg,#07121bdd,transparent 85%),linear-gradient(0deg,#07121bef,transparent 55%)}.driving .map-panel{display:block;top:16px;bottom:auto;width:117px;padding:9px}.driving #minimap{height:74px}.map-heading{font-size:8px}.map-foot{font-size:7px;display:block}.map-foot>span{margin-right:5px}.drive-label{top:22px;left:5%;gap:9px}.drive-label .eyebrow{font-size:9px}.drive-label strong{font-size:17px;max-width:200px}.drive-label button{font-size:10px;padding:6px 8px}.speedometer{left:5%;bottom:279px;gap:9px}.speedometer>span:first-child{font-size:49px}.speedometer>span:last-child{font-size:11px}.speedometer small{font-size:8px}.pit-in{bottom:287px;padding:11px 15px;min-width:218px}.pit-in>span{font-size:10px!important}.pit-in strong{font-size:22px}.pit-in small{font-size:9px;margin-left:9px}.info-dialog{max-width:100vw;width:100%;max-height:100dvh;height:100dvh;margin:0;border:0;border-radius:0}.dialog-bar{padding:16px}.dialog-bar>span{font-size:10px;letter-spacing:.07em}.dialog-bar button{font-size:12px}.dialog-bar kbd{display:none}.info-section{padding:28px 23px}.article-header h2{font-size:30px;margin:12px 0 21px}.article-header .tagline{font-size:20px}.article-header .eyebrow{font-size:10px}.info-section p,.lead{font-size:15px;line-height:2}.info-section h3{font-size:20px;margin-top:32px;padding-top:21px}.info-section h3 small{display:block;margin:7px 0 0}.article-grid{grid-template-columns:1fr;gap:28px}.article-grid>article{padding-left:16px}.info-section h4{font-size:16px}.tags li{font-size:11px}.stats{gap:30px}.stats b{font-size:65px}.stats>div{gap:10px}.stats span{font-size:11px}.spec-list>div{grid-template-columns:100px 1fr;gap:14px;font-size:13px}.career li{gap:15px}.career time{min-width:65px;font-size:13px}.career h4{font-size:15px}.identity{font-size:20px!important}.identity span{display:block;margin:5px 0 0;font-size:14px}.contact-grid{gap:12px}.product-card{padding:23px}.dialog-foot{padding:12px 16px;gap:9px;justify-content:space-between}.dialog-foot button{font-size:11px;padding:10px 11px}.intro-dialog{max-width:calc(100vw - 24px)}.intro-dialog[open]{gap:15px;padding:22px;flex-direction:column}.robot-portrait{width:100%;height:105px;flex-direction:row;gap:15px}.robot-portrait canvas{width:100px;height:100px}.robot-portrait>span{font-size:10px;margin:0}.speech>.eyebrow{font-size:11px}.speech>p{min-height:89px;font-size:16px;margin:14px 0}.help-dialog{max-width:calc(100vw - 20px)}.handbook{padding:25px}.handbook h2{font-size:22px}.handbook .spec-list>div{grid-template-columns:90px 1fr}.handbook p{font-size:14px}#toast{top:88px;padding:13px 15px;font-size:12px;width:max-content}#site-content .regular-hero{padding:50px 24px}#site-content .regular-hero h1{font-size:31px}#site-content .regular-hero p{font-size:14px}#site-content .regular-hero>.eyebrow{font-size:10px}#site-content .info-section{padding:44px 24px}}
@media(max-width:600px) and (max-height:760px){#title-screen{top:20px}#game-title{font-size:61px}.title-kicker{margin-bottom:12px}.title-line{margin-top:13px}.title-ja{margin:16px 0 8px;font-size:14px}.title-description{font-size:10px;margin-bottom:15px}.start-button{padding:11px 17px}.start-caption{margin:7px 0 10px}.scene-caption{display:none}.pit-card{padding:10px}#pit-dock{bottom:28px}.bottom-meta{height:28px}#game-title{font-size:54px}}
.sound-settings{display:flex;gap:12px;margin:20px 0}
/* Keep both opt-in switches and their state visible in the compact header. */
@media(max-width:900px){.top-actions #effects{display:inline-flex}}
@media(max-width:600px){.topbar{gap:4px;padding:0 2%}.brand>span:last-child{display:none}.top-actions{gap:3px}.top-actions button{padding:5px 3px;font-size:10px}.top-actions #music{font-size:10px;padding:5px 3px}.top-actions #music span{display:inline}.top-actions .normal-button{font-size:10px;padding:5px 0 5px 3px}}
.loader img{width:min(360px,86vw);height:auto;margin-bottom:18px;mask-image:radial-gradient(ellipse,black 26%,transparent 73%)}
@media(max-width:600px){.drive-label strong{font-size:14px;line-height:1.8;max-width:185px}.pit-in{top:166px;bottom:auto;min-width:210px;padding:11px 18px;gap:4px}.pit-nav{scrollbar-width:none}.speedometer{bottom:269px}.scene-caption{pointer-events:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Sprint 7 — inspection duel. Keep article layouts and fallback content intact. */
#experience select { pointer-events: auto; }
.race-hud { position:absolute; top:22px; right:4%; width:290px; padding:16px 18px 10px; background:#091a25ee; border:1px solid var(--line); border-radius:6px; }
.race-heading { display:flex; justify-content:space-between; align-items:center; font-size:11px; letter-spacing:.12em; color:var(--muted); margin-bottom:12px; }
.race-heading time { font:600 24px 'Barlow Condensed',sans-serif; color:var(--ink); font-variant-numeric:tabular-nums; }
.competitor { display:grid; grid-template-columns:1fr auto; gap:6px; margin-top:9px; font-size:11px; letter-spacing:.07em; }
.competitor.player { color:var(--teal); }
.competitor.rival { color:var(--amber); }
.competitor strong { font-variant-numeric:tabular-nums; }
.competitor progress { grid-column:1/-1; width:100%; height:4px; appearance:none; border:0; background:#233843; accent-color:var(--teal); }
.competitor progress::-webkit-progress-bar { background:#233843; }
.competitor.player progress::-webkit-progress-value { background:var(--teal); }
.competitor.rival progress::-webkit-progress-value { background:var(--amber); }
.competitor.player progress::-moz-progress-bar { background:var(--teal); }
.competitor.rival progress::-moz-progress-bar { background:var(--amber); }
#race-status { min-height:30px; margin:12px 0 0; color:#b8cbd0; font-size:11px; line-height:1.6; }
.driving .map-panel { top:238px; bottom:auto; }
#map-player { fill:var(--teal); }
#map-rival { fill:var(--amber); stroke:#10232c; stroke-width:2; }
.map-foot>span:first-child { color:var(--teal); }
.map-rival-key { color:var(--amber); }
.drive-label { padding:14px; left:calc(4% - 14px); background:linear-gradient(90deg,#07121bd9,transparent); border-radius:4px; }
.drive-label #reset { font-size:11px; color:var(--muted); border:0; padding-left:0; }
/* Sprint 18 / F-17-02: 介入ツールは画面左辺の縦並びに統一する（PC/スマホ共通）。
   #touch-controls・#mouse-controls の帯・#pit-in・.speedometer・.drive-label と
   非交差にするための具体的な位置は viewport 別ブロックで指定する。 */
.item-controls { position:absolute; left:4%; top:140px; bottom:180px; width:104px; display:flex; flex-direction:column; gap:6px; z-index:1; }
.item-controls .item-title { display:block; min-width:0; color:var(--teal); font-size:9px; letter-spacing:.06em; line-height:1.4; }
.item-controls .item-title kbd { margin:0 3px; }
#item-list { list-style:none; margin:0; padding:2px; display:flex; flex-direction:column; gap:6px; max-height:216px; overflow-y:auto; }
#item-list:empty { display:none; }
.item-slot { width:100%; min-height:44px; padding:4px 6px; font-size:10px; line-height:1.25; text-align:center; color:var(--ink); background:#0b1e2bec; border:1px solid #78d7c733; border-radius:4px; overflow-wrap:anywhere; }
.item-slot:not(:disabled):hover { border-color:var(--teal); background:#12283a; }
.item-controls p { margin:0; min-height:26px; padding:6px 8px; color:#b4c7cc; font-size:9px; line-height:1.5; background:#0b1e2bec; border:1px solid #78d7c733; border-radius:4px; }
.driving .pit-in { top:180px; bottom:auto; }
.dialog-foot { flex-wrap:wrap; }
.dialog-foot #panel-visited { display:block; flex:1 1 180px; font-size:11px; letter-spacing:0; line-height:1.6; }
.info-section { scroll-margin-top:105px; }
.race-result { width:720px; max-height:90dvh; overflow:auto; border-top:3px solid var(--teal); }
.result-body { padding:34px 40px; }
.result-body h2 { font-size:28px; line-height:1.6; margin:15px 0 10px; }
.result-stats { color:var(--muted); font-size:12px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.result-conversation p { display:grid; grid-template-columns:70px 1fr; gap:12px; font-size:14px; line-height:1.9; margin:20px 0; }
.result-conversation strong { font:600 16px 'Barlow Condensed',sans-serif; color:var(--teal); padding-top:4px; letter-spacing:.05em; }
.result-conversation p:first-child strong { color:var(--amber); }
.result-invitation { line-height:1.9; font-size:14px; border-top:1px solid var(--line); padding-top:20px; }
#result-contact { display:block; text-align:center; margin:4px 0; width:100%; }
.result-availability { font-size:11px; line-height:1.8; color:#b8cbd0; }
.result-actions { display:flex; gap:12px; margin-top:22px; }
.result-actions button, .result-actions .link-button { flex:1; font-size:13px; }
.intro-dialog { max-height:90dvh; overflow:auto; }
#toast { pointer-events:none; }
@media(max-width:900px) and (min-width:601px) {
 .race-hud { width:240px; }
 .driving .map-panel { top:233px; }
 .driving .pit-in { top:200px; left:40%; min-width:245px; }
}
@media(max-width:600px) {
 .race-hud { top:10px; left:4%; right:4%; width:auto; padding:9px 12px; display:grid; grid-template-columns:1fr 1fr; gap:3px 14px; }
 .race-heading { grid-column:1/-1; margin:0; font-size:9px; }
 .race-heading time { font-size:20px; }
 .competitor { margin:0; gap:4px; font-size:10px; }
 #race-status { grid-column:1/-1; font-size:9px; min-height:15px; margin:5px 0 0; }
 .drive-label { top:120px; left:4%; padding:0; gap:5px; max-width:calc(100% - 146px); }
 .drive-label .eyebrow { display:none; }
 .drive-label strong { font-size:12px; line-height:1.6; }
 .drive-label #reset { font-size:10px; padding:5px 0; }
 .driving .map-panel { top:119px; width:105px; padding:7px; }
 .driving #minimap { height:56px; }
 .map-foot { display:flex; font-size:6px; }
 .map-foot>span { margin:0; }
 .map-foot>span:last-child { display:none; }
 .driving .pit-in { top:239px; bottom:auto; min-width:210px; padding:10px 18px; }
 .speedometer { bottom:269px; gap:7px; }
 .speedometer>span:first-child { font-size:40px; }
 .speedometer small { display:none; }
 .dialog-foot #panel-visited { flex-basis:100%; font-size:10px; }
 .dialog-foot { gap:8px; }
 .result-body { padding:24px 20px; }
 .result-body>.eyebrow { font-size:10px; }
 .result-body h2 { font-size:22px; }
 .result-conversation p { grid-template-columns:1fr; gap:3px; font-size:13px; margin:15px 0; }
 .result-conversation strong { font-size:14px; }
 .result-invitation { font-size:13px; }
 .result-stats { font-size:10px; }
 .result-actions { gap:8px; }
 .result-actions button, .result-actions .link-button { font-size:11px; padding:10px 8px; }
}
@media(max-width:600px) and (max-height:740px) {
 .driving .pit-in { top:211px; padding:7px 15px; }
 .driving .pit-in>#near-name { display:none; }
 .speedometer { bottom:250px; }
}
@media (pointer:coarse) and (max-height:740px) {
 #touch-controls:not([hidden]) { bottom:135px; }
}

/* ===========================================================================
   Sprint 9 — 入力手段ごとに操作を完結させる（F-032 / sprint-9 契約 前提A・B）。
   運転UIの出し分けは画面幅ではなくポインター種別で行う。#touch-controls 系と
   #mouse-controls 系の 10 セレクタは max-width / min-width を含む @media の中に
   置かない（寸法・配置・touch-action もすべてポインター条件の側で成立させる）。
   =========================================================================== */

/* --- タイトル画面: コピー（左）と開始・入力案内（右）の2カラム --- */
.title-launch { max-width:390px; }
.difficulty-picker { margin:0 0 14px; padding:12px; background:#091a25e8; border:1px solid var(--line); }
.difficulty-label { display:block; color:var(--teal); font-size:10px; letter-spacing:.16em; margin-bottom:8px; }
.difficulty-label span { color:var(--muted); margin-left:8px; letter-spacing:0; }
.difficulty-options { display:flex; gap:4px; }
.difficulty-options button { flex:1; min-width:44px; min-height:44px; padding:6px 10px; font-size:12px; }
.difficulty-options button[aria-pressed="true"] { color:#10202a; background:var(--amber); border-color:var(--amber); font-weight:700; }
.difficulty-options button:focus-visible,#result-change-difficulty:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
#difficulty-description { margin:8px 0 0; min-height:2.8em; font-size:11px; color:#b6c8cd; line-height:1.5; }
.boost-guide { font-size:10px; line-height:1.6; color:#b6c8cd; margin:9px 0 0; }
#race-difficulty { font-size:10px; color:var(--amber); letter-spacing:0; margin-left:5px; }
.speed-details { min-width:140px; max-width:158px; padding:6px 8px; background:#071620ed; border:1px solid var(--line); border-radius:4px; }
#boost-readout { display:flex; flex-direction:column; gap:3px; margin-top:4px; font-size:10px; line-height:1.3; letter-spacing:0; }
#boost-readout strong { color:var(--muted); font-size:11px; }
#boost-detail { color:#cfdbdf; font-size:10px; }
#boost-readout[data-state="ready"] strong { color:var(--teal); }
#boost-readout[data-state="active"] strong { color:var(--amber); }
#result-change-difficulty { min-height:44px; min-width:44px; }
.result-actions { flex-wrap:wrap; }
@media (min-width:781px) {
 /* START SHIFTを画面中央に置くため、左右を同じ1frにしたグリッドの中央列へ置く。
    title-copyの実際の幅に関わらず、常に画面（#title-screen）の中央に来る。 */
 #title-screen { left:0; right:0; width:auto; padding:0 5%; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:start; column-gap:clamp(28px,4vw,52px); }
 .title-copy { width:100%; max-width:min(390px,38vw); }
 .title-launch { width:100%; max-width:clamp(300px,30vw,360px); padding-top:4px; }
 .title-description { margin-bottom:0; }
}

/* --- 入力案内（タイトル画面・導入ダイアログ） --- */
#input-guide { margin:17px 0 0; border-top:1px solid var(--line); padding-top:13px; }
.input-guide-head { margin:0 0 10px; font-size:11px; font-weight:700; letter-spacing:.02em; color:var(--amber); line-height:1.6; }
.input-rows { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; }
.input-rows > li { display:none; }
.input-kind { display:inline-block; font:600 9px 'Barlow',sans-serif; letter-spacing:.16em; color:var(--teal); border:1px solid var(--line); border-radius:2px; padding:1px 5px; margin-right:7px; vertical-align:2px; }
.input-body { font-size:10px; line-height:1.75; color:#a8bac0; }
.input-body b { color:var(--ink); font-weight:700; }
.input-body kbd { padding:0 4px; font-size:9px; margin-right:2px; }
#intro-controls { border-top:1px solid var(--line); padding-top:12px; margin:0 0 14px; }
.intro-controls-head { display:block; font-size:10px; letter-spacing:.05em; color:var(--teal); margin-bottom:8px; line-height:1.6; }
@media (pointer:fine) {
 #input-guide .input-rows > li[data-input="mouse"], #input-guide .input-rows > li[data-input="keyboard"],
 #intro-controls .input-rows > li[data-input="mouse"], #intro-controls .input-rows > li[data-input="keyboard"] { display:flex; }
}
@media (pointer:coarse) {
 #input-guide .input-rows > li[data-input="touch"], #intro-controls .input-rows > li[data-input="touch"] { display:flex; }
}

/* --- 操作ガイド（DRIVER'S HANDBOOK）の5ステップ --- */
.handbook-lead { margin:14px 0 22px; }
.guide-step { border-top:1px solid var(--line); padding-top:18px; margin-bottom:22px; }
.guide-step h3 { display:flex; align-items:baseline; gap:12px; margin:0 0 10px; font-size:17px; letter-spacing:.04em; }
.guide-step h3 b { font:700 13px 'Barlow Condensed',sans-serif; letter-spacing:.14em; color:var(--amber); }
.guide-step > p { margin:0 0 13px; font-size:14px !important; }
.guide-rows { margin:0; }
.guide-rows > div { display:grid; grid-template-columns:82px 1fr; gap:14px; padding:8px 0; border-bottom:1px solid #2b444e; }
.guide-rows > div:last-child { border-bottom:0; }
.guide-rows dt { font:600 9px 'Barlow',sans-serif; letter-spacing:.17em; color:var(--teal); padding-top:4px; }
.guide-rows dd { margin:0; font-size:13px; line-height:1.85; color:#b6c8cd; }
.guide-rows kbd { margin-right:3px; }

/* 小さく背の低い画面では入力案内も詰める（PITメニューに重ねない） */
@media (max-width:600px) and (max-height:760px) {
 #input-guide { margin-top:12px; padding-top:10px; }
 .input-guide-head { font-size:10px; margin-bottom:7px; }
 .input-rows { gap:5px; }
 .input-body { font-size:9px; line-height:1.6; }
 .start-caption { margin:6px 0 0; }
 .title-description { margin-bottom:12px; }
 #game-title { font-size:50px; }
 .title-ja { margin:14px 0 7px; }
}

/* --- 走行中のキー対応ヒント（Sprint 8 までの走行キー表示を置き換える） --- */
#drive-hint { display:none; position:absolute; left:4%; top:270px; grid-template-columns:repeat(2,max-content); gap:7px 16px; font-size:11px; color:var(--muted); letter-spacing:.02em; }
#drive-hint > span { display:flex; align-items:center; gap:4px; }
#drive-hint kbd { padding:2px 5px; font-size:10px; }

/* --- PIT IN の補足・ツール欄・遠隔閲覧の注記 --- */
.pit-in-note { font-size:10px !important; letter-spacing:.02em; color:#4b3a20; }
#item-count { font-weight:700; color:var(--amber); font-variant-numeric:tabular-nums; white-space:nowrap; }
#item-description[data-reason="ready"] { color:#cfdde0; }
#item-description[data-reason="empty"], #item-description[data-reason="paused"], #item-description[data-reason="inactive"] { color:#8fa5ac; }
#item-description[data-reason="active"] { color:var(--amber); }

/* Sprint 18 / F-17-03: スマートフォンではPIT INの文言を「PIT IN」だけに減らす。
   PC（pointer:fine）の表示は変更しない。 */
@media (pointer:coarse) {
 .pit-in > #near-name, .pit-in small, .pit-in-note { display:none; }
 .pit-in { min-height:44px; }
}

/* --- PIT ドック（遠隔閲覧メニューと、その説明） --- */
#pit-dock { pointer-events:none; }
#pit-dock .pit-nav { pointer-events:auto; }

/* --- スマートフォン等（主ポインターが coarse）の運転UI --- */
@media (pointer:coarse) {
 #touch-controls:not([hidden]) { display:flex; position:absolute; left:5%; right:5%; bottom:152px; align-items:center; justify-content:space-between; pointer-events:none; }
 #joystick { width:106px; height:106px; border:1px solid #83b3bf80; background:#152b369e; border-radius:50%; position:relative; touch-action:none; }
 #stick { position:absolute; width:45px; height:45px; top:30px; left:30px; border:1px solid var(--teal); background:#357d8190; border-radius:50%; pointer-events:none; }
 .joystick-label { position:absolute; bottom:9px; width:100%; text-align:center; font-size:8px; letter-spacing:.16em; color:var(--muted); }
 .touch-pedals { display:grid; grid-template-columns:58px 69px; gap:8px; pointer-events:auto; }
 .touch-pedals button { padding:0; font-size:11px; touch-action:none; height:52px; background:#17313ccc; user-select:none; }
 .touch-pedals #touchBoost { grid-column:1/3; height:46px; border-color:#ffc16b66; color:var(--amber); font-size:10px; }
 .touch-pedals #accelerator { background:#79d7c7dd; border-color:var(--teal); color:#071b23; font-weight:700; font-size:16px; }
}

/* --- PC（主ポインターが fine）の運転UI。単一ポインターで加速と操舵を併用する --- */
@media (pointer:fine) {
 #mouse-controls:not([hidden]) { display:flex; position:absolute; left:50%; transform:translateX(-50%); bottom:178px; align-items:flex-end; gap:12px; pointer-events:none; }
 #drive-pad { position:relative; width:212px; height:132px; border:1px solid #83b3bf80; border-radius:5px; background:linear-gradient(180deg,#1b3a47 0%,#0d1f29 100%); overflow:hidden; user-select:none; cursor:crosshair; touch-action:none; }
 #drive-pad:hover { border-color:var(--teal); }
 #drive-pad > * { pointer-events:none; }
 #pad-boost-zone { position:absolute; inset:0 0 auto 0; height:11.25%; background:#ffc16b33; border-bottom:1px solid #ffc16b8c; display:flex; align-items:center; justify-content:center; font:600 8px 'Barlow',sans-serif; letter-spacing:.26em; color:var(--amber); }
 .pad-scale { position:absolute; inset:0; font-size:9px; letter-spacing:.1em; color:#7d959d; }
 .pad-up { position:absolute; top:19%; left:50%; transform:translateX(-50%); }
 .pad-down { position:absolute; bottom:5px; left:50%; transform:translateX(-50%); }
 .pad-side { position:absolute; top:52%; transform:translateY(-50%); font-size:10px; }
 .pad-left { left:6px; }
 .pad-right { right:6px; }
 #drive-pad::after { content:''; position:absolute; left:0; right:0; top:75%; border-top:1px dashed #83b3bf59; }
 #pad-marker { position:absolute; left:50%; top:75%; width:26px; height:26px; border:2px solid var(--amber); border-radius:50%; background:#ffc16b26; transform:translate(-50%,-50%); opacity:.5; }
 #pad-marker.on { opacity:1; background:#ffc16b73; box-shadow:0 0 16px #ffc16b73; }
 #mouse-boost { height:56px; min-width:58px; padding:0 12px; font:600 11px 'Barlow',sans-serif; letter-spacing:.14em; color:var(--amber); border-color:#ffc16b66; background:#13272fdd; }
}

/* --- PC 幅広（601px 以上）: 左列にHUD、下中央に運転パッドを置く --- */
@media (pointer:fine) and (min-width:601px) {
 #drive-hint { display:grid; }
 .speedometer { top:200px; bottom:auto; }
}
/* Sprint 18 修正: 左列（drive-label・speedometer・#drive-hint）はすべて
   #experience の top からの固定pxで積まれており、隙間は#drive-hintの下
   （top:417px相当）から画面最下部の.bottom-metaの上までしかない。
   マウス運転パッド（#mouse-controls）は画面中央寄りで左列とは重ならない。 */
@media (pointer:fine) and (min-width:601px) {
 .item-controls { top:327px; bottom:50px; }
}

/* --- PC 幅狭（600px 以下・マウス）: 縦に積んで運転パッドの帯を空ける --- */
@media (pointer:fine) and (max-width:600px) {
 .speedometer { top:190px; bottom:auto; }
 .driving .pit-in { top:255px; bottom:auto; }
 .item-controls { top:344px; bottom:322px; }
}

/* --- 横向きスマートフォン等、高さが極端に低い画面 --- */
/* タイトル画面は縦積みだと START SHIFT と入力案内が画面外に出るため、
   コピー（左）と開始・入力案内（右）の2カラムに組み替える。 */
@media (max-height:520px) {
 #title-screen { top:10px; }
 .title-kicker { margin-bottom:7px; font-size:9px; }
 #game-title { font-size:clamp(40px,6vw,58px); }
 .title-line { margin-top:12px; }
 .title-ja { margin:11px 0 5px; font-size:14px; }
 .title-description { font-size:10px; line-height:1.75; }
 #start { font-size:19px; padding:11px 18px; gap:20px; min-width:0; width:100%; }
 .start-caption { margin:8px 0 0; }
 #input-guide { margin-top:10px; padding-top:10px; }
 .input-guide-head { font-size:10px; margin-bottom:8px; }
 .input-rows { gap:5px; }
 .input-body { font-size:9px; line-height:1.6; }
 .scene-caption { display:none; }
}
@media (max-height:520px) {
 .driving .map-panel { display:none; }
 .bottom-meta { display:none; }
 #pit-dock { bottom:0; }
 #pit-nav-note { font-size:9px; margin-bottom:6px; padding-left:7px; }
 .pit-card { padding:7px 10px; border-right-color:#2c464f; }
 .pit-card .pit-jp, .pit-card .pit-number { display:none; }
 .pit-card strong { font-size:15px; }
 .race-hud { top:6px; padding:7px 11px; display:grid; grid-template-columns:1fr 1fr; gap:3px 14px; }
 .race-heading { grid-column:1/-1; margin:0; font-size:9px; }
 .race-heading time { font-size:16px; }
 .competitor { margin:0; gap:3px; font-size:9px; }
 #race-status { grid-column:1/-1; min-height:11px; margin:4px 0 0; font-size:8px; }
 .drive-label { top:6px; padding:7px 10px; gap:5px; }
 .drive-label .eyebrow { display:none; }
 .drive-label strong { font-size:15px; }
 .drive-label #reset { font-size:10px; padding:4px 0; }
 .speedometer { top:10px; bottom:auto; left:auto; right:calc(4% + 258px); gap:8px; }
 .speedometer > span:first-child { font-size:40px; }
 .speedometer small { display:none; }
 .driving .pit-in { top:90px; bottom:auto; left:34%; min-width:186px; padding:4px 12px; gap:0; }
 .driving .pit-in > #near-name { display:none; }
 .driving .pit-in strong { font-size:15px; }
 .driving .pit-in small { font-size:9px; margin-left:10px; }
 .pit-in-note { font-size:8px !important; }
 /* 高さが極端に低いので、介入ツールはdrive-labelの下・STEERの上の狭い縦帯に収め、
    44px高は保ったまま内部スクロールへ任せる（title・説明文は視覚的に畳んで高さを確保する）。 */
 .item-controls { top:103px; bottom:134px; width:78px; }
 .item-controls .item-title { position:absolute; width:1px; height:1px; margin:0; padding:0; overflow:hidden; clip-path:inset(50%); }
 #item-list { max-height:none; flex:1 1 auto; gap:4px; }
 .item-slot { font-size:9px; padding:2px 4px; }
 .item-controls p { position:absolute; width:1px; height:1px; margin:0; padding:0; overflow:hidden; clip-path:inset(50%); min-height:0; }
}
@media (pointer:coarse) and (max-height:520px) {
 /* .bottom-metaはこの高さ帯で非表示のため、下の余白を詰めてPIT IN・介入ツールの
    縦帯を広げる。 */
 #touch-controls:not([hidden]) { bottom:20px; }
}
@media (pointer:fine) and (max-height:520px) {
 #mouse-controls:not([hidden]) { left:auto; right:4%; transform:none; bottom:56px; }
}

/* Sprint 18 / F-17-02 — keep the intervention list physically clear of STEER,
   drive-label and the speedometer. Each portrait band reserves its own top/
   bottom band measured against that band's drive-label / speedometer / STEER
   offsets so the list never overlaps them regardless of item count. */
@media (pointer:coarse) and (max-width:600px) and (min-height:741px) {
 .item-controls { top:293px; bottom:313px; }
}

@media (pointer:coarse) and (max-width:600px) and (min-height:521px) and (max-height:740px) {
 .item-controls { top:326px; bottom:147px; }
}

/* 360x640-class compact portrait: use the lower safe area instead of stacking
   PIT and intervention controls into the map row. */
@media (pointer:coarse) and (max-width:600px) and (min-height:521px) and (max-height:660px) {
 .driving .pit-in { top:221px; }
 .item-controls { top:326px; bottom:147px; }
}
@media (pointer:coarse) and (min-height:521px) and (max-height:660px) {
 #touch-controls:not([hidden]) { bottom:33px; }
}

/* サイト運営者フィードバック: スマートフォンでPIT INが中央の3D車両モデルと
   重なって見えるため、drive-labelの下・画面左上へ移動する。PC（pointer:fine）
   の中央配置は変更しない。drive-labelの状態文言（#drive-status）は「PIT IN」
   自体が同じ情報を示すため非表示にし、「対戦をやり直す」だけを残す。 */
@media (pointer:coarse) {
 #drive-status { display:none; }
 .driving .pit-in { left:4%; right:auto; transform:none; }
}
@media (pointer:coarse) and (max-width:600px) {
 .driving .pit-in { top:150px; }
}
@media (pointer:coarse) and (max-height:520px) {
 .driving .pit-in { top:51px; }
}

/* サイト運営者フィードバック: スマートフォンで所持ツールが増えると、左列の
   限られた縦帯では一覧の途中で見切れて見える。.map-panel（見える帯）の下、
   #touch-controlsの上にかけて右側にはまとまった空きがあるため、介入ツールは
   スマートフォンだけ右側へ移す。PC（pointer:fine）は左のまま変更しない。 */
@media (pointer:coarse) {
 .item-controls { left:auto; right:4%; }
 /* サイト運営者フィードバック: 所持ツールが3件以上になると一覧が伸びて
    崩れるため、スマートフォンでは常に2件分の高さで固定し、残りは
    #item-list自身のスクロールに任せる。 */
 #item-list { max-height:96px; }
}
@media (pointer:coarse) and (max-width:600px) and (min-height:741px) {
 .item-controls { top:221px; bottom:266px; }
}
@media (pointer:coarse) and (max-width:600px) and (min-height:521px) and (max-height:740px) {
 .item-controls { top:221px; bottom:200px; }
}
@media (pointer:coarse) and (max-width:600px) and (min-height:521px) and (max-height:660px) {
 .item-controls { top:221px; bottom:147px; }
}
@media (pointer:coarse) and (max-height:520px) {
 .item-controls { top:92px; bottom:174px; }
}

/* Sprint 15 — 勝敗確定後だけ使う、対戦状態から独立した余韻レイヤー。 */
.visually-hidden { position:fixed; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.post-race { position:fixed; inset:0; z-index:15; display:grid; place-items:center; padding:clamp(20px,5vw,64px); overflow-y:auto; background:radial-gradient(circle at 50% 45%,#193744e8 0,#07121bf5 54%,#030a10 100%); }
.post-race-frame { width:min(680px,100%); min-height:390px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border-block:1px solid #78d7c766; padding:clamp(28px,6vw,58px) clamp(18px,5vw,54px); position:relative; background:#091923e8; box-shadow:0 26px 90px #0009; }
.post-race-frame::before,.post-race-frame::after { content:''; position:absolute; width:68px; height:3px; background:var(--amber); top:-2px; }
.post-race-frame::before { left:0; }.post-race-frame::after { right:0; }
.post-race-signal { display:flex; gap:8px; margin-bottom:22px; }
.post-race-signal span { width:7px; height:7px; background:var(--teal); box-shadow:0 0 14px #78d7c799; animation:post-race-signal 1.1s ease-in-out infinite alternate; }
.post-race-signal span:nth-child(2) { animation-delay:.18s; }.post-race-signal span:nth-child(3) { animation-delay:.36s; }
.post-race-label { margin:0 0 10px; color:var(--amber); font:700 clamp(15px,2.4vw,21px) 'Barlow Condensed',sans-serif; letter-spacing:.28em; }
.post-race h2 { margin:0; font:900 clamp(48px,9vw,92px)/.92 'Barlow Condensed',sans-serif; letter-spacing:.04em; color:var(--ink); text-shadow:4px 5px 0 #183641; }
.post-race-copy { max-width:500px; margin:20px auto 24px; color:#c4d3d6; font-size:14px; line-height:1.9; }
.winner-route { width:min(460px,90%); height:36px; position:relative; margin:28px 0 2px; overflow:hidden; }
.winner-route-line { position:absolute; left:0; right:0; top:17px; height:1px; background:repeating-linear-gradient(90deg,#78d7c7 0 15px,transparent 15px 24px); }
.winner-runner { position:absolute; left:0; top:3px; padding:5px 9px; color:#07121b; background:var(--amber); font:700 10px 'Barlow',sans-serif; letter-spacing:.1em; animation:winner-run 2s cubic-bezier(.45,.05,.3,1) infinite; }
.finish-mark { position:absolute; right:0; top:0; height:34px; border-right:3px double var(--ink); padding-right:8px; color:var(--muted); font:600 9px 'Barlow',sans-serif; letter-spacing:.12em; }
.post-race[data-outcome="lose"] .winner-route { opacity:.42; }
.post-race[data-outcome="lose"] .winner-runner { left:12%; animation:none; background:#51656d; color:var(--ink); }
.post-race[data-outcome="lose"] .post-race-signal span { background:var(--amber); box-shadow:none; animation:none; }
.post-race-skip { min-width:210px; border-color:var(--amber); background:#172a33; color:var(--ink); padding:14px 24px; font-weight:700; letter-spacing:.07em; }
.post-race-skip span { margin-left:28px; color:var(--amber); }
#result-skip:focus-visible { outline:3px solid var(--amber); outline-offset:5px; }
.post-race-active #drive-hud,.post-race-active #race-hud,.post-race-active #item-controls,.post-race-active .map-panel,.post-race-active #touch-controls,.post-race-active #mouse-controls,.post-race-active #pit-dock { display:none!important; }
.result-record { display:grid; grid-template-columns:auto 1fr; align-items:end; gap:4px 22px; margin:20px 0 12px; padding:21px 22px 18px; border:1px solid #78d7c766; border-left:4px solid var(--amber); background:#091721; }
.result-record span { align-self:center; color:#d6e4e4; font-size:16px; font-weight:700; letter-spacing:.08em; }
.result-record strong { justify-self:end; color:var(--amber); font:800 clamp(46px,7vw,68px)/.85 'Barlow Condensed',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.03em; }
.result-record small { grid-column:1/-1; color:#b8cbd0; font-size:12px; line-height:1.6; text-align:left; }
@keyframes winner-run { 0% { transform:translateX(0); } 85%,100% { transform:translateX(350px); } }
@keyframes post-race-signal { from { opacity:.35; transform:scale(.8); } to { opacity:1; transform:scale(1); } }
@media(max-width:600px) {
 .post-race { padding:16px; }
 .post-race-frame { min-height:360px; padding:28px 17px; }
 .post-race-label { font-size:14px; letter-spacing:.2em; }
 .post-race h2 { font-size:50px; }
 .winner-route { width:100%; }
 .winner-runner { animation-name:winner-run-mobile; }
 .result-record { padding:17px 15px 15px; gap:5px 12px; }
 .result-record span { font-size:13px; }
 .result-record strong { font-size:48px; }
 .result-actions { flex-direction:column; }
}
@keyframes winner-run-mobile { 0% { transform:translateX(0); } 85%,100% { transform:translateX(calc(100vw - 150px)); } }
@media(prefers-reduced-motion:reduce) {
 .post-race *,.post-race *::before,.post-race *::after { animation-duration:0s!important; transition-duration:0s!important; }
}

/* Sprint 10: reserve the PIT menu band, even when the title gains a selector. */
#title-screen { max-height:calc(100% - 180px); overflow-y:auto; scrollbar-width:thin; pointer-events:auto; }
@media (max-width:780px) {
 #title-screen { top:18px; max-height:calc(100% - 148px); }
 #game-title { font-size:clamp(42px,13vw,64px); }
 .title-kicker { margin-bottom:12px; }
 .title-line { margin-top:12px; }
 .title-ja { margin:14px 0 7px; }
 .title-description { margin-bottom:12px; }
 .difficulty-picker { padding:9px; margin-bottom:10px; }
 #difficulty-description { min-height:0; }
 .scene-caption { display:none; }
}
@media (max-height:520px) {
 #title-screen { left:0; right:0; width:auto; padding:0 4%; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:24px; max-height:calc(100% - 55px); }
 .title-copy,.title-launch { width:100%; max-width:none; }
 .difficulty-picker { padding:7px; margin-bottom:8px; }
 .difficulty-label { margin-bottom:4px; }
 #difficulty-description { min-height:0; margin-top:5px; }
 .difficulty-options button { font-size:11px; padding:5px; }
 .speed-details { min-width:112px; }
}
