:root{--bg: #eef4fb;--surface: #ffffff;--surface-2: #eef3f9;--border: #e3eaf3;--ink: #0a3367;--text: #243244;--muted: #6a7689;--brand: #0a5fb4;--brand-bright: #1287d8;--accent: #10aecb;--brand-soft: #e7f1fb;--grad-brand: linear-gradient(100deg, #0a5fb4 0%, #1490d4 55%, #16c1c6 100%);--grad-brand-soft: linear-gradient(120deg, #e9f3fd 0%, #e6f8fb 100%);--grad-hero: linear-gradient(96deg, #0a3367 0%, #0a5fb4 42%, #16c1c6 100%);--g-high: linear-gradient(90deg, #149e6b, #34cf9c);--g-midhigh: linear-gradient(90deg, #46b07a, #7ed7a0);--g-mid: linear-gradient(90deg, #93a0b6, #b7c0d2);--g-midlow: linear-gradient(90deg, #e29a37, #f2bf67);--g-low: linear-gradient(90deg, #db5836, #f0855c);--radius: 16px;--radius-sm: 10px;--shadow: 0 1px 2px rgba(12, 40, 80, .04), 0 6px 22px rgba(12, 40, 80, .07);--shadow-lg: 0 10px 36px rgba(12, 40, 80, .13);--ring: 0 0 0 4px rgba(18, 135, 216, .18)}*{box-sizing:border-box}html{color:var(--text);font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,BIZ UDPGothic,Meiryo,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;background:radial-gradient(900px 500px at 88% -8%,rgba(22,193,198,.16),transparent 60%),radial-gradient(900px 520px at -6% 4%,rgba(18,135,216,.14),transparent 58%),var(--bg);background-attachment:fixed}main{max-width:1000px;margin:0 auto;padding:1.5rem 1rem 4rem}a{color:var(--brand);text-decoration:none;transition:color .15s ease}a:hover{text-decoration:underline}h1,h2,h3{color:var(--ink);line-height:1.35;font-weight:700}.num{font-variant-numeric:tabular-nums}.pixel{font-family:DotGothic16,Noto Sans JP,sans-serif}.gradient-text{background:var(--grad-hero);-webkit-background-clip:text;background-clip:text;color:transparent}.site-header{position:sticky;top:0;z-index:20;background:#ffffffb8;backdrop-filter:saturate(160%) blur(12px);-webkit-backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid rgba(227,234,243,.9)}.site-header .inner{max-width:1000px;margin:0 auto;padding:.65rem 1rem;display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}.site-logo{display:inline-flex;align-items:center;transition:opacity .15s ease,transform .15s ease}.site-logo img{display:block;height:34px;width:auto}.site-logo:hover{text-decoration:none;opacity:.9;transform:translateY(-1px)}.site-nav{display:flex;gap:1.1rem;font-size:.95rem;margin-left:auto}.site-nav a{color:var(--text);font-weight:500}.site-nav a:hover{color:var(--brand);text-decoration:none}.search-box{width:100%;max-width:360px}.sample-banner{background:linear-gradient(90deg,#fff4dc,#fdeccd);color:#8a5a00;text-align:center;font-size:.82rem;padding:.4rem 1rem}.site-footer{border-top:1px solid var(--border);background:#fff9;color:var(--muted);font-size:.8rem;text-align:center;padding:1.75rem 1rem 2.5rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.3rem 1.5rem;margin-bottom:1.25rem}.card-title{font-size:1.05rem;color:var(--ink);font-weight:700;margin:0 0 .9rem;padding-left:.7rem;position:relative}.card-title:before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:4px;border-radius:4px;background:var(--grad-brand)}.breadcrumb{font-size:.85rem;color:var(--muted);margin-bottom:.75rem}.breadcrumb a{color:var(--muted)}.city-hero{position:relative;overflow:hidden}.city-hero:after{content:"";position:absolute;top:-40%;right:-10%;width:320px;height:320px;background:radial-gradient(circle,rgba(22,193,198,.16),transparent 70%);pointer-events:none}.city-hero-head{display:flex;align-items:center;gap:1rem}.city-emblem{width:64px;height:64px;object-fit:contain;border-radius:6px;flex:none}.city-hero h1{font-size:2rem;margin:.1rem 0}.city-hero .kana{color:var(--muted);font-size:.95rem;font-weight:400}.city-hero .pref{color:var(--brand);font-size:.9rem;font-weight:700}.tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:.6rem 0}.tag{background:var(--grad-brand-soft);border:1px solid rgba(18,135,216,.22);color:var(--brand);border-radius:999px;padding:.18rem .8rem;font-size:.82rem;font-weight:700}.summary{font-size:1.08rem;color:var(--ink);margin:.5rem 0 0;line-height:1.8}.overall-score{display:flex;align-items:baseline;gap:.55rem}.overall-score .big{font-size:2.7rem;font-weight:800;line-height:1;background:var(--grad-hero);-webkit-background-clip:text;background-clip:text;color:transparent}.overall-score .ranknote{color:var(--muted);font-size:.85rem}.kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}@media(max-width:760px){.kpi-grid{grid-template-columns:1fr}}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease}.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.kpi-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.kpi-label{font-weight:700;color:var(--ink)}.kpi-score{font-size:1.35rem;font-weight:800;font-variant-numeric:tabular-nums;padding:.1rem .7rem;border-radius:999px;color:#fff}.kpi-rank{font-size:.78rem;color:var(--muted)}.kpi-sub{font-size:.82rem;color:var(--muted);margin:.45rem 0 .15rem;display:flex;justify-content:space-between;gap:.5rem}.bar{height:8px;background:var(--surface-2);border-radius:6px;overflow:hidden}.bar .fill{height:100%;border-radius:6px}.fill.high{background:var(--g-high)}.fill.mid-high{background:var(--g-midhigh)}.fill.mid{background:var(--g-mid)}.fill.mid-low{background:var(--g-midlow)}.fill.low{background:var(--g-low)}.dev-badge{display:inline-block;min-width:2.2em;text-align:center;border-radius:8px;padding:.08rem .45rem;font-size:.8rem;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}.dev-high{background:var(--g-high)}.dev-mid-high{background:var(--g-midhigh)}.dev-mid{background:var(--g-mid)}.dev-mid-low{background:var(--g-midlow)}.dev-low{background:var(--g-low)}table{width:100%;border-collapse:collapse;font-size:.92rem}th,td{padding:.55rem .6rem;border-bottom:1px solid var(--border);text-align:left}th{color:var(--muted);font-weight:600;font-size:.82rem}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}tbody tr{transition:background .12s ease}tbody tr:hover{background:#1287d80d}tr.is-self td,tr.is-self:hover{background:var(--grad-brand-soft);font-weight:700}tbody tr[id^=m-]{scroll-margin-top:72px}tbody tr:target td{background:var(--brand-soft);font-weight:700;box-shadow:inset 3px 0 0 var(--brand)}.detail-bar{display:flex;align-items:center;gap:.5rem}.detail-bar .bar{flex:1;min-width:60px}.pills{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.pills a{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:.3rem .95rem;font-size:.85rem;color:var(--text);transition:all .15s ease}.pills a:hover{border-color:var(--brand);color:var(--brand);text-decoration:none}.pills a.active{background:var(--grad-brand);border-color:transparent;color:#fff;box-shadow:0 4px 14px #1287d84d}.button{display:inline-block;background:var(--grad-brand);color:#fff;border:none;border-radius:999px;padding:.6rem 1.6rem;font-size:1rem;font-family:inherit;font-weight:700;cursor:pointer;box-shadow:0 6px 18px #1287d847;transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}.button:hover{text-decoration:none;transform:translateY(-2px);filter:saturate(115%);box-shadow:0 10px 24px #1287d85c}.button.ghost{background:var(--surface);color:var(--brand);border:1.5px solid var(--brand);box-shadow:none}select,input.search-box{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.55rem .8rem;font-family:inherit;font-size:1rem;width:100%;transition:border-color .15s ease,box-shadow .15s ease}select:focus,input.search-box:focus{outline:none;border-color:var(--brand-bright);box-shadow:var(--ring)}.home-hero{position:relative;text-align:center;padding:3rem 0 1.5rem}.home-hero:before{content:"";position:absolute;inset:-10% 10% auto;height:260px;background:radial-gradient(closest-side,rgba(22,193,198,.2),transparent 75%);filter:blur(8px);z-index:-1}.home-hero h1{font-size:2.7rem;margin:0 0 .6rem;letter-spacing:.01em;background:var(--grad-hero);-webkit-background-clip:text;background-clip:text;color:transparent}.home-hero .lead{color:var(--muted);max-width:640px;margin:0 auto}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:start}@media(max-width:760px){.two-col{grid-template-columns:1fr}}.source-note{color:var(--muted);font-size:.8rem}.purpose-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}@media(max-width:860px){.purpose-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.purpose-grid{grid-template-columns:1fr 1fr}}.purpose-card{display:block;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.1rem 1rem;color:var(--text);position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.purpose-card:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--grad-brand)}.purpose-card:hover{text-decoration:none;transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:#1287d866}.purpose-emoji{font-size:1.9rem;line-height:1}.purpose-label{font-weight:700;color:var(--ink);margin-top:.5rem}.purpose-tag{font-size:.82rem;color:var(--muted);margin-top:.2rem}.purpose-weight{font-size:.72rem;color:var(--muted);margin-top:.5rem;line-height:1.5}.purpose-hero{display:flex;align-items:center;gap:1rem}.purpose-hero .purpose-emoji{font-size:2.6rem}.aptitude-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}@media(max-width:760px){.aptitude-grid{grid-template-columns:repeat(2,1fr)}}.aptitude{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"emoji label mark" "emoji rank mark";align-items:center;column-gap:.5rem;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.55rem .7rem;background:var(--surface);color:var(--text);transition:border-color .15s ease,background .15s ease}.aptitude:hover{text-decoration:none;border-color:var(--brand)}.aptitude-emoji{grid-area:emoji;font-size:1.4rem}.aptitude-label{grid-area:label;font-weight:700;color:var(--ink);font-size:.92rem}.aptitude-rank{grid-area:rank;font-size:.72rem;color:var(--muted)}.aptitude-mark{grid-area:mark;font-size:1.3rem;font-weight:800}.aptitude-excellent{background:linear-gradient(180deg,rgba(20,158,107,.1),transparent)}.aptitude-excellent .aptitude-mark{color:#149e6b}.aptitude-good .aptitude-mark{color:#2e9bdf}.aptitude-fair .aptitude-mark{color:var(--muted)}.compare-select{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center}.vs-mark{font-weight:800;color:var(--accent);font-size:1.2rem}.cmp-heads{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center}.cmp-head{text-align:center;border-top:4px solid;border-radius:var(--radius-sm);padding:.7rem .5rem;background:var(--surface-2)}.cmp-pref{font-size:.78rem;color:var(--muted)}.cmp-name{font-weight:700;font-size:1.1rem;color:var(--ink)}.cmp-name:hover{color:var(--brand)}.cmp-overall{font-size:2rem;font-weight:800;line-height:1.1}.cmp-verdict{text-align:center;font-size:1.05rem;color:var(--ink);margin:.9rem 0 .3rem}.cmp-recs{text-align:center;color:var(--muted);font-size:.9rem;margin:.2rem 0 0}.cmp-table{table-layout:fixed}.cmp-table th.cmp-h{width:37%;text-align:center;color:var(--ink);font-weight:700}.cmp-table th.cmp-cat{text-align:center;font-weight:600}.cmp-cell{text-align:center;white-space:nowrap}.cmp-win{display:inline-block;width:1.1em;text-align:center;color:#149e6b;font-weight:800}.map-embed{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border);background:var(--surface-2)}.map-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}@media(max-width:560px){.map-embed{aspect-ratio:4 / 3}}