:root{--ink:#0b0b0b;--paper:#f4f1ea;--spot:#d4141c;--title:"Shippori Mincho B1", "Times New Roman", serif;--ui:"Barlow Condensed", "Arial Narrow", sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--ink);height:100%;color:var(--ink);font:600 15px/1.3 var(--ui);letter-spacing:.03em;-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#view{width:100vw;height:100vh;display:block;position:fixed;inset:0}.kicker{font:600 11px var(--ui);letter-spacing:.3em;text-transform:uppercase}#hud>*{position:fixed}#roadName{font:800 26px/1.1 var(--title)}#radio{background:var(--paper);border:3px solid var(--ink);width:240px;box-shadow:5px 5px 0 var(--ink);padding:6px 12px 8px;top:16px;right:16px}#radio .row1{align-items:baseline;gap:6px;display:flex}#radio .row1 .kicker{letter-spacing:.2em}#freq{font:800 30px/1 var(--title);letter-spacing:0;min-width:2.6em}#radio small{letter-spacing:.2em;color:#555;font-size:11px}#countdown{font:700 20px var(--ui);letter-spacing:.06em;font-variant-numeric:tabular-nums;margin-left:auto}#countdown.late{color:var(--spot)}#countdown.late.off{visibility:hidden}.dial{height:26px;margin:6px 0 2px;position:relative}.scale{border-bottom:2px solid var(--ink);height:14px;position:absolute;inset:0}.scale i{background:var(--ink);width:1px;height:6px;position:absolute;bottom:0}.scale i.long{width:2px;height:11px}.scale b{font:600 10px var(--ui);position:absolute;top:15px;transform:translate(-50%)}#needle{background:var(--spot);width:2px;height:16px;position:absolute;top:-1px;transform:translate(-1px)}#clock{font:600 13px var(--ui);color:#333;letter-spacing:.08em;font-variant-numeric:tabular-nums}#clock b{font:800 17px var(--title);color:var(--ink);letter-spacing:0}#subs{text-align:center;pointer-events:none;z-index:6;max-width:70vw;transition:opacity .3s;bottom:calc(12vh + 18px);left:50%;transform:translate(-50%)}#subs.in{transition:opacity .15s}#subs p{color:var(--paper);paint-order:stroke fill;-webkit-text-stroke:6px var(--ink);margin:0}#subs .en{font:600 26px/1.25 var(--title)}#subs .jp{font:600 18px/1.4 var(--title);margin-top:2px}#subMark{vertical-align:middle;width:8px;height:8px;margin-right:10px;display:inline-block;transform:translateY(-3px)}#subMark.monitor{background:var(--spot)}#subMark.notice{border:2px solid var(--ink);background:var(--paper);box-shadow:0 0 0 1px var(--paper)}#map{border:3px solid var(--ink);width:220px;height:220px;box-shadow:5px 5px 0 var(--ink);background:var(--paper);image-rendering:pixelated;bottom:16px;left:16px}#radio{opacity:.18;transition:opacity 1.5s linear}#radio.loud{opacity:1;transition:opacity .12s linear}.lb{background:var(--ink);z-index:3;pointer-events:none;height:12vh;transition:transform .8s ease-in-out;position:fixed;left:0;right:0}#lbTop{top:0;transform:translateY(-100%)}#lbBot{bottom:0;transform:translateY(100%)}body.letterbox .lb{transform:translateY(0)}#thought{z-index:6;pointer-events:none;opacity:0;max-width:34vw;position:fixed;top:18%;left:4vw}#thought.in{opacity:1;transition:opacity 1s linear}#thought.out{opacity:0;transition:opacity 1.5s linear}#thought p{color:var(--paper);paint-order:stroke fill;-webkit-text-stroke:6px var(--ink);font-family:var(--title);margin:0;font-weight:600}#thought .en{font-size:22px;font-style:italic;line-height:1.3}#thought .jp{margin-top:4px;font-size:16px;line-height:1.5}#qcard{z-index:12;text-align:center;background:var(--ink);color:var(--paper);place-content:center;display:grid;position:fixed;inset:0}#qcard.light{background:var(--paper);color:var(--ink)}#qcard.gap{background:#000}#qcard.gap p{visibility:hidden}#qcard p{font-family:var(--title);margin:0;font-weight:800}#qcard .en{font-size:clamp(32px,5vw,64px)}#qcard .jp{margin-top:14px;font-size:clamp(20px,2.6vw,30px);font-weight:600}#help{color:var(--ink);background:var(--paper);border:2px solid var(--ink);letter-spacing:.08em;opacity:.9;padding:3px 10px;font-size:13px;bottom:14px;left:50%;transform:translate(-50%)}.card{z-index:5;pointer-events:none;position:fixed;top:34%;left:0;right:0}.card-inner{background:var(--ink);color:var(--paper);border-top:4px solid var(--paper);border-bottom:4px solid var(--paper);box-shadow:0 0 0 4px var(--ink);padding:22px 8vw 26px;animation:.25s steps(4,end) cardIn}.card h2{font:800 clamp(48px, 8vw, 96px)/.95 var(--title);margin:6px 0 0}.card .jp{font:600 22px var(--title);color:#bbb;margin:8px 0 0}.card .kicker{color:var(--spot);font-size:14px}@keyframes cardIn{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.title{z-index:10;background:var(--ink);color:var(--paper);place-items:center;display:grid;position:fixed;inset:0}.title-inner{width:min(640px,100vw - 40px)}.ep{font:600 14px var(--ui);letter-spacing:.4em;text-transform:uppercase;margin:0 0 12px}.ep:before{content:"";background:var(--spot);vertical-align:middle;width:30px;height:3px;margin-right:12px;display:inline-block}.title h1{font:800 clamp(54px, 11vw, 104px)/.9 var(--title);letter-spacing:-.01em;margin:0}.title h1 span{display:block}.title h1 span:nth-child(2){padding-left:.6em}.title h1 span:nth-child(3){padding-left:1.6em}.title .jp{font:600 20px var(--title);color:#aaa;border-bottom:2px solid var(--paper);margin:14px 0 0;padding-bottom:12px}.title .pitch{color:#c7c3ba;max-width:520px;font-size:17px;font-weight:500}.title button{font:700 18px var(--ui);letter-spacing:.3em;text-transform:uppercase;color:var(--ink);background:var(--paper);cursor:pointer;border:0;margin-top:10px;padding:12px 22px}.title button:hover{background:var(--spot);color:var(--paper)}.title button.loading{opacity:.5;cursor:wait}.title .keys{color:#888;letter-spacing:.1em;margin-top:14px;font-size:13px}#fade{background:var(--ink);opacity:0;pointer-events:none;z-index:4;transition:opacity .4s;position:fixed;inset:0}#fade.on{opacity:1}.stamp{color:#c7c3ba;font:600 17px var(--title);align-items:flex-end;gap:14px;margin:-2px 0 16px;display:flex}.stamp .year{font:800 clamp(44px, 8vw, 68px)/.86 var(--title);color:var(--paper);letter-spacing:-.01em}.stamp .day{flex-direction:column;gap:3px;padding-bottom:2px;display:flex}.stamp small{font:500 12px var(--ui);letter-spacing:.2em;color:#999;text-transform:uppercase;display:block}@media (height<=520px){.title .stamp{gap:10px;margin:0 0 6px}.title .stamp .year{font-size:clamp(26px,11vh,46px)}.title .stamp .day{font-size:clamp(11px,3.6vh,15px)}}.card .date{color:var(--paper);align-items:baseline;gap:14px;margin:12px 0 0;display:flex}.card .date b{font:800 clamp(30px, 5vw, 52px)/1 var(--title)}.card .date span{font:600 clamp(15px, 2vw, 20px) var(--title);color:#ccc}.title .erase{color:#777;letter-spacing:.1em;font-size:12px;position:absolute;bottom:14px;right:18px}#eraseBar{background:var(--spot);width:0;height:2px;margin-top:4px}.strike{font-style:normal;display:inline-block;position:relative}.strike:after{content:"";background:var(--spot);transform-origin:0;width:calc(100% + .1em);height:.08em;min-height:3px;position:absolute;top:50%;left:-.05em;transform:scaleX(0)}.title.struck .strike:after{transform:scaleX(1)}#testcard{z-index:8;background:var(--paper);place-items:center;display:grid;position:fixed;inset:0}#testcard .bars{display:flex;position:absolute;inset:0}#testcard .bars i{flex:1}#testcard .bars i:first-child{background:#f4f1ea}#testcard .bars i:nth-child(2){background:#cfccc5}#testcard .bars i:nth-child(3){background:#a5a39d}#testcard .bars i:nth-child(4){background:#7b7975}#testcard .bars i:nth-child(5){background:var(--spot)}#testcard .bars i:nth-child(6){background:#36352f}#testcard .bars i:nth-child(7){background:#0b0b0b}#testcard b{background:var(--ink);color:var(--paper);font:800 44px var(--title);letter-spacing:.1em;padding:10px 34px;position:relative}#seatext{z-index:6;pointer-events:none;position:fixed;inset:0}#seatext span{color:var(--ink);font-family:var(--title);white-space:nowrap;font-weight:600;transition:opacity 2s linear;position:absolute}#seatext .final{text-align:center;white-space:normal;width:min(900px,90vw);font-size:40px;line-height:1.25;top:42%;left:50%;transform:translate(-50%)}#seatext .final small{margin-top:10px;font-size:22px;display:block}#seatext .final2{top:60%}#endcard{z-index:9;background:var(--paper);color:var(--ink);place-items:center;display:grid;position:fixed;inset:0}.end-inner{width:min(640px,100vw - 40px)}#endcard .kicker{color:var(--spot);font-size:14px}#endcard h1{font:800 clamp(54px, 11vw, 104px)/.9 var(--title);margin:6px 0 0}#endcard h1 span{display:block}#endcard h1 span:nth-child(2){padding-left:.6em}#endcard h1 span:nth-child(3){padding-left:1.6em}#endcard .jp{font:600 20px var(--title);border-bottom:2px solid var(--ink);margin:14px 0 0;padding-bottom:12px}#endcard .strike:after{transition:transform .6s linear;transform:scaleX(0)}#endcard.struck .strike:after{transform:scaleX(1)}.endline{font:600 20px var(--title);margin:18px 0 0}.endline.jpline{color:#444;margin-top:4px;font-size:16px}.press{font:700 16px var(--ui);letter-spacing:.3em;text-transform:uppercase;margin-top:30px}@media (width<=760px){#radio{width:180px}#map{width:140px;height:140px}#help{display:none}}.loading{z-index:30;background:var(--ink);color:var(--paper);text-align:center;place-content:center;padding:24px;display:grid;position:fixed;inset:0}.loading .kicker{color:var(--spot);font-size:13px}.loading p:last-child{font:600 22px/1.4 var(--title);max-width:560px;margin:10px auto 0}.card.pause{z-index:20;pointer-events:auto;top:18%}.pause .settings{gap:2px;max-width:460px;margin-top:18px;display:grid}.pause .row{width:100%;color:var(--paper);font:600 17px var(--ui);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-align:left;background:0 0;border:0;border-left:4px solid #0000;outline:none;justify-content:space-between;align-items:center;gap:16px;padding:7px 12px;display:flex}.pause .row b{color:#bbb;letter-spacing:.08em;font-weight:700}.pause .row.focus,.pause .row:hover{border-left-color:var(--spot);background:#1c1c1c}.pause .row.resume b{color:#888;font-size:12px}.pause input[type=range]{width:200px;accent-color:var(--spot)}body.subs-large #subs .en{font-size:34px}body.subs-large #subs .jp{font-size:23px}body.subs-large #thought .en{font-size:28px}body.subs-large #thought .jp{font-size:20px}body.driving:not(.paused),body.driving:not(.paused) *{cursor:none}#subMark.fm{background:var(--paper);border:2px solid var(--ink);box-shadow:0 0 0 1px var(--paper);border-radius:50%;width:10px;height:10px}#subMark.far{border:2px solid var(--ink);box-shadow:0 0 0 1px var(--paper), inset 0 0 0 1px var(--paper);background:0 0;border-radius:50%;width:10px;height:10px}@media (height<=520px){.card{top:16%}.card-inner{padding:10px 6vw 12px}.card h2{font-size:clamp(24px,9vh,44px)}.card .jp{margin-top:4px;font-size:clamp(12px,3.8vh,16px)}.card .date{gap:10px;margin-top:6px}.card .date b{font-size:clamp(20px,7vh,32px)}.card .date span{font-size:clamp(11px,3.4vh,14px)}}@media (width<=760px){#radio{padding:6px 10px 8px}#radio .row1{gap:4px}#freq{min-width:0;font-size:24px}#radio .row1 small{letter-spacing:.05em;font-size:10px}#countdown{font-size:17px}}body.ending #touch,body.ending #turn,body.ending #map,body.ending #help,body.ending #radio{display:none!important}
