:root{--ink:#17140f;--paper:#f1ead8;--cream:#fff8e8;--orange:#f05a28;--lime:#cddd38;--blue:#247ba0;--red:#b8332a;--line:#29241c;--muted:#766e61;--shadow:5px 5px 0 #17140f;--radius:10px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#d9d0bd;color:var(--ink);font-family:'Noto Sans JP',sans-serif;min-height:100vh;background-image:linear-gradient(90deg,rgba(23,20,15,.035) 1px,transparent 1px),linear-gradient(rgba(23,20,15,.035) 1px,transparent 1px);background-size:24px 24px;padding-bottom:90px}.noise{position:fixed;inset:0;pointer-events:none;opacity:.14;z-index:99;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}.topbar{height:72px;padding:10px clamp(16px,4vw,60px);background:var(--ink);color:var(--cream);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;border-bottom:4px solid var(--orange)}.brand{color:inherit;text-decoration:none;font-family:'Kaisei Decol',serif;font-size:25px;font-weight:700;line-height:.8;letter-spacing:.04em}.brand span{color:var(--orange)}.brand small{display:block;font:800 8px/1 'Noto Sans JP';letter-spacing:.24em;margin-top:8px;color:var(--lime)}.resources{display:flex;gap:8px;align-items:center}.resource{background:#302b24;border:1px solid #554e43;padding:7px 10px;border-radius:5px;font-size:12px;white-space:nowrap}.resource b{color:#fff;font-size:14px}.resource.stamina b{color:var(--lime)}main{width:min(1180px,calc(100% - 28px));margin:24px auto}.hidden{display:none!important}.loading{text-align:center;padding:18vh 0;font-weight:800}.wheel{font-size:56px;animation:spin 1.2s linear infinite;color:var(--orange)}@keyframes spin{to{transform:rotate(360deg)}}.onboarding{padding:30px 0 90px}.eyebrow{font-size:11px;letter-spacing:.3em;font-weight:900;color:var(--red)}h1{font-family:'Kaisei Decol',serif;font-size:clamp(38px,7vw,86px);line-height:1.03;margin:8px 0 16px;letter-spacing:-.04em}h1 em{font-style:normal;color:var(--orange);text-decoration:underline;text-decoration-thickness:6px;text-underline-offset:8px}.lead{max-width:680px;font-size:16px;line-height:1.9}.character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:34px}.character-card{background:var(--paper);border:2px solid var(--line);border-radius:var(--radius);padding:18px;text-align:left;cursor:pointer;transition:.15s;box-shadow:2px 2px 0 var(--line);position:relative;overflow:hidden}.character-card:hover,.character-card.selected{transform:translate(-3px,-3px);box-shadow:var(--shadow);background:var(--cream)}.character-card.selected:after{content:'選択中';position:absolute;right:-30px;top:13px;transform:rotate(38deg);background:var(--orange);color:white;width:120px;text-align:center;font-size:10px;font-weight:900;padding:4px}.character-icon{font-size:40px}.character-card h3{font-family:'Kaisei Decol';margin:8px 0 2px;font-size:20px}.character-card .age{font-size:11px;color:var(--muted);font-weight:800}.character-card .title{font-size:12px;font-weight:900;color:var(--red);margin:8px 0}.character-card .bio{font-size:11px;line-height:1.7;color:#514b42}.mini-stats{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px}.mini-stats span{font-size:9px;border:1px solid var(--line);padding:2px 5px;background:white}.name-panel{display:flex;gap:12px;align-items:end;background:var(--ink);color:white;padding:18px;margin-top:20px;border-radius:var(--radius);box-shadow:var(--shadow)}.name-panel label{flex:1;font-size:11px;font-weight:800}.name-panel input{display:block;width:100%;margin-top:6px;padding:12px;border:0;border-bottom:3px solid var(--orange);font:700 18px inherit;background:#302b24;color:white;outline:none}.btn{border:2px solid var(--line);background:var(--paper);color:var(--ink);padding:11px 16px;font-weight:900;font-family:inherit;cursor:pointer;border-radius:5px;box-shadow:3px 3px 0 var(--line);transition:.12s}.btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--line)}.btn:active{transform:translate(2px,2px);box-shadow:none}.btn.primary{background:var(--orange);color:white}.btn.dark{background:var(--ink);color:white}.btn.lime{background:var(--lime)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}.panel{background:var(--paper);border:2px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.ticker{background:var(--lime);border:2px solid var(--line);margin-bottom:14px;padding:7px 12px;font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden}.dashboard{display:grid;grid-template-columns:270px 1fr;gap:14px}.profile-card{padding:18px}.profile-name{font-family:'Kaisei Decol';font-size:24px;font-weight:700}.profile-title{color:var(--red);font-size:11px;font-weight:900}.level{display:inline-block;background:var(--ink);color:white;padding:3px 7px;font-size:10px;margin-top:8px}.car-mini{height:115px;margin:18px -18px;background:repeating-linear-gradient(0deg,#332e27,#332e27 2px,#29251f 2px,#29251f 6px);display:grid;place-items:center;overflow:hidden}.car-body{font-size:74px;color:var(--orange);transform:skew(-8deg);text-shadow:4px 4px 0 #080706;position:relative;line-height:1}.car-body i,.car-body b{font-style:normal;font-size:24px;color:#111;position:absolute;bottom:-3px}.car-body i{left:15px}.car-body b{right:10px}.car-mini.aurora .car-body{color:#78e0d0;text-shadow:4px 4px #b05cff}.stat-row{display:grid;grid-template-columns:62px 1fr 28px;align-items:center;gap:7px;font-size:10px;font-weight:800;margin:8px 0}.statbar{height:7px;background:#c9c0ad;border:1px solid var(--line)}.statbar i{display:block;height:100%;background:var(--orange)}.scene{overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr;min-height:340px}.scene-art{position:relative;background:linear-gradient(#2b2738 0 54%,#c14e39 54% 57%,#211f1d 57%);overflow:hidden;min-height:340px}.moon{position:absolute;width:78px;height:78px;border-radius:50%;background:#f8e9a6;right:16%;top:14%;box-shadow:0 0 35px #ffcf7080}.city{position:absolute;left:0;right:0;bottom:43%;height:90px;background:linear-gradient(90deg,#19171c 5%,transparent 5% 7%,#19171c 7% 16%,transparent 16% 18%,#19171c 18% 26%,transparent 26% 29%,#19171c 29% 48%,transparent 48% 51%,#19171c 51% 68%,transparent 68% 71%,#19171c 71% 79%,transparent 79% 82%,#19171c 82%);clip-path:polygon(0 50%,8% 50%,8% 18%,16% 18%,16% 45%,30% 45%,30% 5%,38% 5%,38% 32%,53% 32%,53% 14%,61% 14%,61% 38%,76% 38%,76% 0,85% 0,85% 30%,100% 30%,100% 100%,0 100%)}.road{position:absolute;bottom:0;left:10%;right:10%;height:43%;background:#34302d;clip-path:polygon(35% 0,65% 0,100% 100%,0 100%)}.road:after{content:'';position:absolute;width:8px;height:100%;left:50%;background:repeating-linear-gradient(#f3dfa9 0 18px,transparent 18px 38px);transform:perspective(70px) rotateX(42deg)}.scene-art .car{position:absolute;bottom:13%;left:39%;font-size:58px;color:var(--orange);text-shadow:4px 4px #090808;transform:skew(-10deg)}#scene-copy{padding:25px 25px 10px}#scene-copy h2{font-family:'Kaisei Decol';font-size:28px;margin:0 0 9px}#scene-copy .chapter{color:var(--orange);font-weight:900;font-size:10px;letter-spacing:.12em}#scene-copy p{line-height:1.8;font-size:13px}.action-grid{padding:0 25px 25px;grid-column:2;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-self:end}.action-grid .btn{text-align:left;font-size:11px}.action-grid .btn strong{display:block;font-size:14px;margin-bottom:3px}.content-panel{margin-top:14px;padding:24px}.section-head{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--line);margin-bottom:14px;padding-bottom:9px}.section-head h2{font-family:'Kaisei Decol';margin:0;font-size:21px}.section-head span{font-size:9px;font-weight:900;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.item-card{border:1px solid #9b9181;background:var(--cream);padding:14px;border-radius:6px;position:relative}.item-card h3{font-size:14px;margin:0 0 5px}.item-card p{font-size:10px;line-height:1.6;color:var(--muted);min-height:32px}.item-icon{font-size:28px}.item-meta{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0}.pill{font-size:9px;background:#ded5c2;padding:3px 6px;border-radius:9px;font-weight:800}.rarity{position:absolute;right:10px;top:10px;font-size:10px;font-weight:900;color:var(--red)}.owned{outline:3px solid var(--lime)}.equipped:after{content:'装着中';position:absolute;right:8px;bottom:8px;background:var(--ink);color:white;font-size:8px;padding:3px 5px}.bottom-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:14px;margin-top:14px}.bottom-grid>.panel{padding:18px}.activity-item{display:grid;grid-template-columns:55px 1fr;gap:10px;padding:8px 0;border-bottom:1px dashed #a99e8b;font-size:11px;line-height:1.6}.activity-item time{color:var(--muted);font-size:9px}.rank-row{display:grid;grid-template-columns:22px 1fr auto;gap:8px;padding:8px 0;border-bottom:1px dashed #a99e8b;font-size:11px}.rank-row b:first-child{color:var(--orange)}.nav{position:fixed;z-index:30;bottom:12px;left:50%;transform:translateX(-50%);display:flex;background:var(--ink);border:2px solid #000;border-radius:11px;box-shadow:0 7px 25px #0006;padding:5px}.nav button{border:0;background:transparent;color:#bcb5a9;font:800 9px inherit;padding:8px 16px;cursor:pointer;border-radius:6px}.nav button span{display:block;font-size:18px;margin-bottom:2px}.nav button.active{background:var(--orange);color:white}.toast{position:fixed;top:88px;left:50%;transform:translate(-50%,-20px);background:var(--ink);color:white;padding:13px 20px;border-left:5px solid var(--lime);z-index:80;opacity:0;pointer-events:none;transition:.25s;max-width:min(520px,90vw);font-size:12px;font-weight:700;box-shadow:0 8px 30px #0005}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:var(--red)}.modal{position:fixed;inset:0;background:#100e0bbb;z-index:70;display:grid;place-items:center;padding:20px}.modal-card{background:var(--paper);border:3px solid var(--line);box-shadow:8px 8px 0 var(--orange);max-width:520px;width:100%;padding:25px;position:relative}.modal-close{position:absolute;right:8px;top:5px;border:0;background:none;font-size:28px;cursor:pointer}.race-result{text-align:center}.race-result .versus{font:900 45px 'Kaisei Decol';color:var(--orange)}.race-meter{height:16px;border:2px solid var(--line);display:flex;margin:15px 0}.race-meter i{background:var(--orange)}.race-meter b{background:var(--blue);flex:1}.empty{padding:30px;text-align:center;color:var(--muted);font-size:12px}.premium-banner{background:var(--ink);color:white;padding:18px;border-radius:7px;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}.premium-banner strong{color:var(--lime)}
@media(max-width:850px){.character-grid{grid-template-columns:repeat(2,1fr)}.dashboard{grid-template-columns:1fr}.profile-card{display:grid;grid-template-columns:1fr 150px 1fr;align-items:center}.car-mini{margin:0;height:100px}.scene{grid-template-columns:1fr 1fr}.bottom-grid{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){body{padding-bottom:82px}.topbar{height:66px;padding:8px 12px}.brand{font-size:19px}.resource{padding:5px;font-size:9px}.resource b{font-size:11px}.resource.rep{display:none}main{width:calc(100% - 18px);margin:12px auto}.character-grid{grid-template-columns:1fr}.name-panel{display:block;position:sticky;bottom:8px;z-index:5}.name-panel .btn{width:100%;margin-top:10px}.profile-card{grid-template-columns:1fr 110px}.profile-card #stats{grid-column:1/-1}.scene{grid-template-columns:1fr}.scene-art{min-height:210px}.scene-copy{grid-column:1}.action-grid{grid-column:1}.cards{grid-template-columns:1fr}.nav{bottom:5px;width:calc(100% - 10px);justify-content:space-around}.nav button{padding:7px 5px;flex:1}.content-panel{padding:15px}.premium-banner{display:block}.premium-banner .btn{margin-top:10px;width:100%}}

/* Illustrated game presentation */
.onboarding:before{content:"";display:block;width:100%;aspect-ratio:16/7;background:linear-gradient(90deg,#17140f00 55%,#17140f99),url('art/hero-crew.jpg') center 43%/cover;border:2px solid var(--line);border-radius:10px;box-shadow:var(--shadow);margin-bottom:28px}.character-card{padding:0;display:grid;grid-template-rows:260px 1fr}.character-card .character-copy{padding:15px 17px 18px}.character-portrait{width:100%;height:260px;object-fit:cover;object-position:center 25%;border-bottom:2px solid var(--line);filter:saturate(.93) contrast(1.03)}.character-card.selected .character-portrait{filter:saturate(1.15) contrast(1.06)}.profile-portrait{width:76px;height:76px;object-fit:cover;object-position:center 22%;border:2px solid var(--line);float:right;margin:0 0 8px 10px;box-shadow:3px 3px 0 var(--orange)}.car-mini{padding:0}.car-mini img{width:100%;height:100%;object-fit:cover;object-position:center}.scene-art{background:#18140f}.scene-art img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center;transition:opacity .2s}.scene-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 65%,#17140f44)}.visual-card{padding:0 0 15px;overflow:hidden}.visual-card>img{width:100%;height:180px;object-fit:cover;border-bottom:2px solid var(--line);display:block}.visual-card>h3,.visual-card>p,.visual-card>.item-meta,.visual-card>.btn{margin-left:14px;margin-right:14px}.visual-card>h3{margin-top:12px}.side-head{margin-top:32px}.side-cards .visual-card>img{height:210px}.garage-hero{height:340px;margin:-8px 0 22px;border:2px solid var(--line);overflow:hidden;box-shadow:4px 4px 0 var(--orange)}.garage-hero img{width:100%;height:100%;object-fit:cover}.parts-grid{grid-template-columns:repeat(4,1fr)}.part-card{padding:0 12px 14px;overflow:hidden}.part-card>img{width:calc(100% + 24px);height:160px;object-fit:cover;margin:0 -12px 12px;border-bottom:1px solid #9b9181;background:#efe2c9}.part-card .rarity{top:170px}.result-art{width:calc(100% + 50px);height:260px;object-fit:cover;margin:-25px -25px 20px;border-bottom:3px solid var(--orange)}.event-result{text-align:center}.event-result h2{font:700 20px/1.65 "Yu Mincho",serif;margin:10px auto 20px;max-width:440px}.modal-card{max-height:90vh;overflow:auto}.busy button{pointer-events:none}.item-card{transition:transform .16s,box-shadow .16s}.item-card:hover{transform:translateY(-3px);box-shadow:0 6px 0 #29241c22}
@media(max-width:1050px){.parts-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.character-card{grid-template-rows:230px 1fr}.character-portrait{height:230px}.parts-grid{grid-template-columns:repeat(2,1fr)}.garage-hero{height:280px}}
@media(max-width:580px){.onboarding:before{aspect-ratio:4/3;background-position:58% center}.character-card{grid-template-columns:138px 1fr;grid-template-rows:1fr}.character-portrait{height:100%;min-height:230px;border:0;border-right:2px solid var(--line)}.scene-art img{position:relative;height:230px}.scene-art{min-height:0}.scene-art:after{display:none}.visual-card>img{height:220px}.parts-grid{grid-template-columns:1fr 1fr}.part-card>img{height:130px}.part-card .rarity{top:140px}.result-art{height:210px}.garage-hero{height:210px}}
