/* TOKYO 1988 (docs/TOKYO_1988_MAP.md): a full-screen map with the brand's night colours around it. */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/anton-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--t88-bg:#05081a;--t88-panel:rgba(8,12,32,.94);--t88-text:#eef2ff;--t88-dim:#aeb8d6;--t88-pink:#ff4fb8;--t88-line:rgba(255,255,255,.14);
 --ch1:#ff4fb8;--ch2:#46b8ff;--ch3:#ffb347;--ch4:#5fe0a6;--ch5:#c49bff}
html,body{height:100%;margin:0}
body.t88{background:var(--t88-bg);color:var(--t88-text);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;overflow:hidden}
.t88-map{position:fixed;inset:0;background:#0b1024}
.t88-top{position:fixed;z-index:1000;top:0;left:0;right:0;display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:linear-gradient(180deg,rgba(5,8,26,.92),rgba(5,8,26,.6) 70%,transparent);pointer-events:none}
.t88-top>*{pointer-events:auto}
.t88-logo img{display:block;width:84px;height:auto}
.t88-title h1{margin:0;font:400 26px/1 "Anton",Impact,sans-serif;letter-spacing:.06em}
.t88-title h1 em{font-style:normal;color:var(--t88-pink)}
.t88-title{min-width:0}
.t88-title p{margin:4px 0 0;font-size:12px;line-height:1.35;color:var(--t88-dim)}
.t88-badge{flex:none;white-space:nowrap;margin-left:auto;padding:4px 10px;border:1px solid var(--t88-pink);border-radius:999px;color:var(--t88-pink);font-size:12px;font-weight:700}
.t88-modes{position:fixed;z-index:1000;top:calc(74px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;padding:3px;border-radius:999px;background:var(--t88-panel);border:1px solid var(--t88-line);box-shadow:0 6px 20px rgba(0,0,0,.4)}
.t88-modes button{min-width:72px;height:36px;border:0;border-radius:999px;background:transparent;color:var(--t88-dim);font:700 14px/1 inherit;cursor:pointer}
.t88-modes button[aria-pressed=true]{background:var(--t88-pink);color:#05081a}
.t88-list-btn{position:fixed;z-index:1000;left:14px;bottom:calc(18px + env(safe-area-inset-bottom));height:44px;padding:0 18px;border:1px solid var(--t88-line);border-radius:999px;background:var(--t88-panel);color:var(--t88-text);font:700 14px/1 inherit;box-shadow:0 6px 20px rgba(0,0,0,.4);cursor:pointer}
.t88-list{position:fixed;z-index:1001;left:14px;bottom:calc(70px + env(safe-area-inset-bottom));width:min(300px,calc(100vw - 28px));max-height:min(60vh,520px);overflow:auto;padding:10px 14px;border:1px solid var(--t88-line);border-radius:16px;background:var(--t88-panel);box-shadow:0 10px 30px rgba(0,0,0,.5)}
.t88-list h3{margin:10px 0 6px;font-size:13px}.t88-list h3 small{color:var(--t88-dim);font-weight:400}
.t88-list ul{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.t88-list button{height:32px;padding:0 12px;border:1px solid var(--t88-line);border-radius:999px;background:transparent;color:var(--t88-text);font:13px/1 inherit;cursor:pointer}
.t88-list button:hover,.t88-list button:focus-visible{border-color:var(--t88-pink)}
/* Pins: a chapter-coloured emblem, and the ward's name when zoomed in. */
.t88-pin{display:inline-flex;align-items:center;gap:6px;transform:translate(-14px,-14px);white-space:nowrap;cursor:pointer}
.t88-pin-mark{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pin,#ff4fb8);color:#05081a;font-size:15px;font-weight:700;box-shadow:0 0 0 2px #05081a,0 0 14px var(--pin,#ff4fb8)}
.t88-pin-name{padding:3px 8px;border-radius:6px;background:rgba(5,8,26,.86);color:#fff;font-size:12px;font-weight:700}
.t88-map[data-zoom=far] .t88-pin-name{display:none}
.t88-pin.ch1{--pin:var(--ch1)}.t88-pin.ch2{--pin:var(--ch2)}.t88-pin.ch3{--pin:var(--ch3)}.t88-pin.ch4{--pin:var(--ch4)}.t88-pin.ch5{--pin:var(--ch5)}
.leaflet-marker-icon:focus-visible .t88-pin-mark{outline:3px solid #fff;outline-offset:2px}
/* The divider between 1987-1990 (left) and today (right). */
.t88-split{position:absolute;z-index:600;top:0;bottom:0;left:50%;width:0;border-left:2px solid #fff;box-shadow:0 0 12px rgba(0,0,0,.6);pointer-events:none}
.t88-split-handle{position:absolute;top:50%;left:-22px;width:44px;height:44px;margin-top:-22px;border:2px solid #fff;border-radius:50%;background:var(--t88-pink);cursor:ew-resize;pointer-events:auto;touch-action:none}
.t88-split-handle::before{content:"⟷";color:#05081a;font-size:20px;font-weight:700}
.t88-split-label{position:absolute;white-space:nowrap;top:calc(124px + env(safe-area-inset-top));padding:4px 10px;border-radius:999px;background:rgba(5,8,26,.86);font:400 16px/1 "Anton",Impact,sans-serif;letter-spacing:.06em}
.t88-split-label.old{right:10px;color:var(--t88-pink)}.t88-split-label.now{left:10px}
/* The ward card: a bottom sheet on phones, a side panel on wide screens. */
.t88-card{position:fixed;z-index:1002;left:0;right:0;bottom:0;max-height:62vh;overflow:auto;border-radius:18px 18px 0 0;background:var(--t88-panel);border-top:1px solid var(--t88-line);box-shadow:0 -10px 30px rgba(0,0,0,.5);padding-bottom:env(safe-area-inset-bottom)}
.t88-card figure{margin:0}.t88-card figure img{display:block;width:100%;height:auto;max-height:34vh;object-fit:cover}
.t88-card-body{padding:14px 18px 20px}
.t88-eyebrow{font-size:12px;color:var(--t88-pink);font-weight:700;letter-spacing:.04em}
.t88-card h2{margin:6px 0 4px;font-size:24px}.t88-card h2 small{display:block;margin-top:2px;font-size:13px;color:var(--t88-dim);font-weight:400}
.t88-place{margin:6px 0 12px;font-size:13px;color:var(--t88-dim)}
.t88-boss{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.t88-boss .t88-face{width:52px;height:52px;border-radius:50%;border:2px solid var(--t88-pink);flex:none}
.t88-boss b{display:block;font-size:16px}.t88-boss small{color:var(--t88-dim);font-size:12px}
.t88-intro{margin:0 0 16px;font-size:14px;line-height:1.8}
.t88-go{display:flex;align-items:center;justify-content:center;height:48px;border-radius:999px;background:var(--t88-pink);color:#05081a;font-weight:700;text-decoration:none}
.t88-close{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(5,8,26,.8);color:#fff;font-size:22px;cursor:pointer;z-index:1}
.t88-noscript{position:fixed;inset:auto 0 40% 0;text-align:center}
.leaflet-container{background:#0b1024;font-family:inherit}
.leaflet-control-attribution{max-width:calc(100vw - 120px);font-size:10px;background:rgba(255,255,255,.85)!important}
.leaflet-control-attribution a{color:#0a3d91}
.leaflet-bottom.leaflet-right{margin-bottom:env(safe-area-inset-bottom)}
/* The zoom buttons sit above the ward list button, clear of the card. */
.leaflet-bottom.leaflet-left{bottom:calc(66px + env(safe-area-inset-bottom))}
@media (max-width:420px){.t88-title p{font-size:11px}}
@media (min-width:900px){
 .t88-card{left:auto;top:calc(130px + env(safe-area-inset-top));right:14px;bottom:auto;width:380px;max-height:calc(100vh - 160px);border-radius:18px;border:1px solid var(--t88-line)}
 .t88-logo img{width:110px}.t88-title h1{font-size:32px}
}
@media (prefers-reduced-motion:reduce){.leaflet-fade-anim .leaflet-tile,.leaflet-zoom-anim .leaflet-zoom-animated{transition:none!important}}