/* 超連関 日本史 MASTER */
:root{--bg:#f5f7fb;--panel:#fff;--panel2:#f0f4fa;--text:#172033;--muted:#657089;--line:#dbe2ec;--accent:#2b69d1;--accent2:#1d4f9c;--good:#16844a;--bad:#c83a3a;--warn:#b87500;--shadow:0 12px 36px rgba(28,44,72,.10);--radius:18px;--tap:46px;--bottom-nav-clearance:calc(118px + env(safe-area-inset-bottom))}
html[data-theme="dark"]{--bg:#101622;--panel:#182131;--panel2:#202b3e;--text:#eef3fb;--muted:#a9b5c9;--line:#344157;--accent:#6da6ff;--accent2:#99beff;--good:#57cf8c;--bad:#ff7a7a;--warn:#ffd070;--shadow:0 14px 38px rgba(0,0,0,.32)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.65}button,input,select,textarea{font:inherit}.app{max-width:980px;margin:auto;min-height:100vh;padding:0 16px var(--bottom-nav-clearance)}.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:13px 0;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(12px)}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:700}.brand h1{margin:0;font-size:22px;line-height:1.1}.brand h1 span{color:var(--accent)}.icon-btn,.text-btn{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:12px;min-height:42px;padding:8px 12px;cursor:pointer}.view{display:none}.view.active{display:block;padding-bottom:18px}.hero{background:linear-gradient(135deg,#17304d,#246b8c);color:white;padding:22px;border-radius:24px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr auto;gap:18px;margin:6px 0 14px}.hero h2{margin:3px 0 8px;font-size:25px}.hero p{margin:0;opacity:.86}.hero-score{text-align:center;min-width:84px}.hero-score b{display:block;font-size:28px}.hero-score span{font-size:11px;opacity:.8}.pill,.badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:800}.pill{background:rgba(255,255,255,.14)}.badge{background:var(--panel2);color:var(--muted);border:1px solid var(--line)}.badge.good{color:var(--good);border-color:color-mix(in srgb,var(--good) 40%,var(--line))}.badge.warn{color:var(--warn)}.badge.bad{color:var(--bad)}.grid{display:grid;gap:10px}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mode-card{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:17px;padding:15px;text-align:left;cursor:pointer;min-height:78px;box-shadow:0 4px 12px rgba(0,0,0,.03)}.mode-card b{display:block;font-size:15px}.mode-card span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.mode-card.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;border:0}.mode-card.primary span{color:rgba(255,255,255,.82)}.panel{margin:13px 0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:0 3px 12px rgba(0,0,0,.025)}.section-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.section-title h3{margin:0;font-size:16px}.section-title span{font-size:11px;color:var(--muted)}.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.filters label{font-size:11px;color:var(--muted);font-weight:700}.filters select,.search-input,.answer-input,.note-input{width:100%;margin-top:4px;border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:12px;padding:11px}.cta{width:100%;border:0;background:var(--accent);color:white;border-radius:14px;min-height:48px;padding:11px 14px;font-weight:800;cursor:pointer;margin-top:12px}.cta.secondary{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stat{background:var(--panel2);border-radius:14px;padding:12px;text-align:center}.stat b{display:block;font-size:20px}.stat span{font-size:10px;color:var(--muted)}.era-line{display:grid;grid-template-columns:110px 1fr 44px;gap:8px;align-items:center;margin:8px 0;font-size:11px}.bar{height:8px;background:var(--panel2);border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;background:var(--accent);border-radius:99px}.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:30;width:min(980px,100%);display:grid;grid-template-columns:repeat(5,1fr);background:color-mix(in srgb,var(--panel) 98%,transparent);border-top:1px solid var(--line);box-shadow:0 -10px 28px rgba(20,32,52,.10);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:2px 0 max(10px,env(safe-area-inset-bottom))}.nav-btn{border:0;background:transparent;color:var(--muted);padding:9px 3px 5px;cursor:pointer;font-size:18px}.nav-btn span{display:block;font-size:9px}.nav-btn.active{color:var(--accent)}
.quiz-head{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin:4px 0 12px}.quiz-progress{height:8px;background:var(--panel2);border-radius:99px;overflow:hidden}.quiz-progress i{display:block;height:100%;background:var(--accent)}.quiz-card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--shadow)}.q-meta{display:flex;gap:6px;flex-wrap:wrap}.quiz-card h2{font-size:21px;line-height:1.55;margin:13px 0 16px}.choices{display:grid;gap:9px}.choice{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:14px;padding:13px 14px;text-align:left;cursor:pointer;min-height:var(--tap);display:flex;gap:10px;align-items:flex-start}.choice .num{width:25px;height:25px;flex:0 0 25px;border-radius:8px;background:var(--panel2);display:grid;place-items:center;font-size:11px;font-weight:900}.choice.correct{border-color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--panel))}.choice.wrong{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 7%,var(--panel))}.choice:disabled{cursor:default;opacity:1}.input-wrap{display:grid;gap:8px}.answer-input{font-size:17px;padding:14px}.feedback{margin-top:15px;border-top:1px solid var(--line);padding-top:15px}.hidden{display:none!important}.feedback-head{font-size:20px;font-weight:900}.feedback-head.good{color:var(--good)}.feedback-head.bad{color:var(--bad)}.answer-line{font-size:14px;margin:6px 0 10px}.memory-box,.connection,.trap-box,.confidence-box,.note-box{padding:12px;border-radius:14px;margin:10px 0}.memory-box{background:color-mix(in srgb,var(--accent) 8%,var(--panel));border-left:3px solid var(--accent)}.connection{background:var(--panel2)}.trap-box{background:color-mix(in srgb,var(--warn) 8%,var(--panel));border:1px solid color-mix(in srgb,var(--warn) 25%,var(--line))}.inline-term{border:0;background:color-mix(in srgb,var(--accent) 11%,transparent);color:var(--accent2);border-radius:6px;padding:1px 4px;font-weight:800;cursor:pointer}.choice-review{display:grid;gap:8px;margin-top:12px}.choice-review article{border:1px solid var(--line);border-radius:13px;padding:10px 11px}.choice-review b{font-size:13px}.choice-review p{margin:4px 0 0;font-size:12px;color:var(--muted)}.choice-review button{border:0;background:transparent;color:var(--accent);padding:4px 0;cursor:pointer;font-size:11px}.confidence-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.confidence-row button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:11px;padding:9px;cursor:pointer;font-size:12px}.confidence-row button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--panel))}.next-sticky{position:sticky;bottom:calc(78px + env(safe-area-inset-bottom));z-index:10}.fav-btn{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:7px 10px;cursor:pointer;color:var(--text)}.fav-btn.on{color:#d39400}.result-card{text-align:center}.result-ring{width:130px;height:130px;border-radius:50%;margin:16px auto;display:grid;place-items:center;background:conic-gradient(var(--accent) var(--p,0%),var(--panel2) 0);position:relative}.result-ring:after{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--panel)}.result-ring b,.result-ring span{z-index:1;position:absolute}.result-ring b{font-size:25px;transform:translateY(-8px)}.result-ring span{font-size:10px;color:var(--muted);transform:translateY(18px)}
.glossary-hero{background:linear-gradient(135deg,#17304d,#255d7b);color:#fff;border-radius:22px;padding:20px;margin-bottom:14px}.glossary-tools{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:8px}.glossary-tools input,.glossary-tools select{width:100%;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:12px;padding:11px}.glossary-list{display:grid;gap:9px}.term-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden}.term-card summary{cursor:pointer;padding:13px;display:flex;justify-content:space-between;gap:8px;list-style:none}.term-card summary::-webkit-details-marker{display:none}.term-name{font-weight:900}.reading{font-size:11px;color:var(--muted);font-weight:600;margin-left:6px}.term-body{padding:0 14px 14px;border-top:1px solid var(--line)}.term-body h4{font-size:11px;color:var(--muted);margin:12px 0 4px}.term-body p{margin:0;font-size:14px}.term-box{padding:10px 11px;border-radius:12px;margin-top:9px;background:var(--panel2)}.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.chip{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:999px;padding:6px 9px;font-size:11px;cursor:pointer}.source-badge{font-size:9px;font-weight:900;border-radius:99px;padding:3px 6px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));color:var(--accent)}
.search-results,.notebook-list,.quality-list{display:grid;gap:9px}.result-item,.notebook-item,.quality-item{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px}.result-item h4,.notebook-item h4,.quality-item h4{margin:0 0 4px}.result-item p,.notebook-item p,.quality-item p{margin:0;color:var(--muted);font-size:12px}.actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.small-btn{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:10px;padding:7px 9px;font-size:11px;cursor:pointer}.quality-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.quality-summary .stat{padding:9px}.audit-good{color:var(--good)}.audit-bad{color:var(--bad)}.weak-card{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.weak-card:last-child{border-bottom:0}.timer{font-variant-numeric:tabular-nums;font-weight:900;color:var(--accent)}
@media(max-width:700px){.filters{grid-template-columns:repeat(2,1fr)}.glossary-tools{grid-template-columns:1fr 1fr}.glossary-tools input{grid-column:1/-1}.hero{grid-template-columns:1fr}.hero-score{text-align:left}.quality-summary{grid-template-columns:repeat(3,1fr)}}
@media(max-width:430px){.app{padding-left:11px;padding-right:11px}.quick-grid{grid-template-columns:1fr 1fr}.mode-card{padding:12px}.quiz-card{padding:15px}.quiz-card h2{font-size:19px}.stats-grid{grid-template-columns:repeat(2,1fr)}.era-line{grid-template-columns:86px 1fr 34px}.glossary-tools{grid-template-columns:1fr}.glossary-tools input{grid-column:auto}.confidence-row{grid-template-columns:1fr}.bottom-nav{grid-template-columns:repeat(5,1fr)}}


/* v2.1 Google login / cloud sync */
.cloud-panel{position:relative;overflow:hidden}.cloud-panel:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--accent)}
.sync-status{display:inline-flex;align-items:center;gap:6px;font-weight:800}.sync-status:before{content:"";width:8px;height:8px;border-radius:50%;background:#9ca3af}.sync-status.good:before{background:#20a464}.sync-status.busy:before{background:#e6a700;animation:syncPulse 1s infinite}.sync-status.bad:before{background:#d94b4b}
@keyframes syncPulse{50%{opacity:.35}}
.cloud-note,.cloud-footnote{color:var(--muted);font-size:12px;line-height:1.7}.cloud-footnote{margin:10px 0 0}.google-btn{max-width:360px}.account-row{display:flex;align-items:center;gap:12px;margin:8px 0 12px}.account-avatar{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:white;font-weight:900;font-size:18px;flex:0 0 auto}.account-text{display:flex;flex-direction:column;min-width:0}.account-text b,.account-text span,.account-text small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-text span,.account-text small{font-size:12px;color:var(--muted)}.danger-lite{border-color:color-mix(in srgb,#d94b4b 45%,var(--line))!important}.cloud-panel .actions{margin-top:8px}

/* v2.1.6 iPhone bottom-navigation clearance */
html{scroll-padding-bottom:var(--bottom-nav-clearance)}
main{padding-bottom:8px}
.view>.panel:last-child,.view>.quiz-card:last-child{margin-bottom:24px}
button,input,select,textarea,[tabindex]{scroll-margin-bottom:var(--bottom-nav-clearance)}
@media(max-width:430px){:root{--bottom-nav-clearance:calc(132px + env(safe-area-inset-bottom))}.nav-btn{min-height:54px;padding-top:8px}.view.active{padding-bottom:22px}}

.status-badge{display:inline-block;font-size:9px;font-weight:900;border:1px solid var(--line);border-radius:999px;padding:3px 6px;margin-right:5px;color:var(--muted);background:var(--panel2)}
.status-badge.done{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel));border-color:color-mix(in srgb,var(--accent) 25%,var(--line))}
.deep-details{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:var(--bg);overflow:hidden}.deep-details>summary{padding:11px 12px;font-weight:900;color:var(--accent);cursor:pointer;display:block}.deep-body{padding:2px 12px 12px;border-top:1px solid var(--line)}.deep-row{padding:10px 0;border-bottom:1px dashed var(--line)}.deep-row:last-child{border-bottom:0}.deep-row h5{margin:0 0 5px;font-size:12px}.deep-row p,.deep-row li{font-size:13px;line-height:1.7}.deep-row ul{margin:4px 0 0;padding-left:20px}.flow-list{display:grid;gap:6px}.flow-list div{display:flex;align-items:center;gap:8px;font-size:13px;background:var(--panel2);padding:8px;border-radius:10px}.flow-list span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:white;font-weight:900;font-size:11px}.refs a{color:var(--accent);text-decoration:none}.refs small{display:block;color:var(--muted);margin-top:7px}.term-card summary>span:last-child{display:flex;align-items:center;justify-content:flex-end;gap:3px;flex-wrap:wrap}

/* v3.2.0 通史年表・イモづる */
.bottom-nav{grid-template-columns:repeat(6,1fr)}
.timeline-launch{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
.timeline-hero{background:linear-gradient(135deg,#243b57,#315f76)}
.timeline-guide p{margin:4px 0 0;color:var(--muted);font-size:13px}
.timeline-tools{display:grid;grid-template-columns:2fr 1fr;gap:8px}.timeline-tools select{width:100%;margin-top:4px;border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:12px;padding:11px}
.timeline-jumps{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.timeline-jumps button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:999px;padding:6px 9px;font-size:10px;cursor:pointer}.timeline-jumps button.active{background:var(--accent);border-color:var(--accent);color:#fff}
.timeline-legend{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:10px;padding:0 4px 8px}
.master-timeline{position:relative;display:grid;gap:9px;margin:0 0 20px;padding-left:20px}.master-timeline:before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:3px;border-radius:99px;background:linear-gradient(var(--accent),color-mix(in srgb,var(--accent) 22%,var(--line)))}
.timeline-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 3px 12px rgba(0,0,0,.025);overflow:hidden}.timeline-card:before{content:"";position:absolute;left:-19px;top:24px;width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--bg)}
.timeline-card>summary{list-style:none;display:grid;grid-template-columns:92px 1fr;gap:10px;align-items:start;padding:13px;cursor:pointer}.timeline-card>summary::-webkit-details-marker{display:none}.timeline-year{font-weight:950;color:var(--accent);font-variant-numeric:tabular-nums;line-height:1.35}.timeline-event-title{font-weight:900;line-height:1.45}.timeline-event-meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px}.timeline-body{border-top:1px solid var(--line);padding:12px 13px 14px}.timeline-section{padding:8px 0;border-bottom:1px dashed var(--line)}.timeline-section:last-child{border-bottom:0}.timeline-section h4{font-size:11px;margin:0 0 6px;color:var(--muted)}.timeline-section p{font-size:12px;margin:0;line-height:1.7}.office-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.office-row{background:var(--panel2);border-radius:11px;padding:8px 9px}.office-row small{display:block;color:var(--muted);font-size:9px}.office-row b{display:block;font-size:12px;line-height:1.5}.timeline-chips{display:flex;flex-wrap:wrap;gap:6px}.timeline-chip{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:999px;padding:6px 9px;font-size:10px;cursor:pointer}.timeline-chip.person{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--panel))}.timeline-chip.static{color:var(--muted)}
.timeline-flow{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:stretch}.timeline-flow>div{background:var(--panel2);border-radius:11px;padding:9px}.timeline-flow small{display:block;color:var(--muted);font-size:9px;margin-bottom:3px}.timeline-flow p{font-size:11px}.timeline-arrow{display:grid;place-items:center;color:var(--accent);font-weight:900}.timeline-neighbors{display:grid;grid-template-columns:1fr 1fr;gap:7px}.timeline-neighbor{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:11px;padding:8px;text-align:left;cursor:pointer;font-size:10px}.timeline-neighbor b{display:block;color:var(--accent);font-size:10px}.timeline-empty{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;color:var(--muted);text-align:center}
.timeline-highlight{animation:timelinePulse 1.25s ease}@keyframes timelinePulse{0%,100%{box-shadow:0 3px 12px rgba(0,0,0,.025)}45%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 22%,transparent)}}
@media(max-width:600px){.timeline-tools{grid-template-columns:1fr}.timeline-card>summary{grid-template-columns:76px 1fr}.office-grid{grid-template-columns:1fr 1fr}.timeline-flow{grid-template-columns:1fr}.timeline-arrow{transform:rotate(90deg)}.timeline-neighbors{grid-template-columns:1fr}.bottom-nav{grid-template-columns:repeat(6,1fr)}.nav-btn{font-size:16px}.nav-btn span{font-size:8px}}

/* v3.2.0 timeline marker visibility */
.timeline-card{overflow:visible}.timeline-body{border-radius:0 0 16px 16px}.timeline-card>summary{border-radius:16px}

/* v3.3.0 detailed unified timeline */
.timeline-tools{grid-template-columns:minmax(220px,2fr) minmax(130px,1fr) minmax(130px,1fr)}
.parallel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.parallel-row{border:1px solid var(--line);border-radius:12px;padding:9px 11px;background:var(--soft)}
.parallel-row small{display:block;opacity:.72;margin-bottom:3px}.parallel-row b{display:block;line-height:1.45}
.detail-list{margin:8px 0 0;padding-left:1.25rem;display:grid;gap:7px;line-height:1.55}
.source-detail{border-left:4px solid #7d9cb8;padding-left:12px}.source-mini{font-size:.76rem;opacity:.62;margin-top:12px}
.track-note{font-size:.78rem;opacity:.7;margin:.65rem 0 0}.category-badge{font-weight:700}
@media(max-width:700px){.timeline-tools{grid-template-columns:1fr}.parallel-grid{grid-template-columns:1fr}}

.live-media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.live-media-card{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}.live-media-card img{display:block;width:100%;max-height:320px;object-fit:contain;background:#f4f4f2}.live-media-card figcaption{padding:10px 12px;display:grid;gap:5px}.live-media-card figcaption span,.live-media-card figcaption small{font-size:.82rem;line-height:1.45}.live-media-card a{font-size:.82rem;font-weight:700}.media-fallback{padding:22px 14px;text-align:center;background:var(--soft);font-size:.82rem}.hidden{display:none!important}

/* v3.4.0 reference panel */
.timeline-reference{margin-bottom:12px}.timeline-reference>summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;list-style:none}.timeline-reference>summary::-webkit-details-marker{display:none}.timeline-reference>summary span{font-size:12px;color:var(--muted)}.reference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.reference-grid article{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card2)}.reference-grid h4{margin:0 0 6px;font-size:14px}.reference-grid p{margin:0;font-size:12px;line-height:1.7;color:var(--muted)}@media(max-width:680px){.reference-grid{grid-template-columns:1fr}.timeline-reference>summary{align-items:flex-start;flex-direction:column;gap:2px}}


/* v3.12.0 textbook-style flow sheet */
.timeline-mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}.timeline-mode-switch button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:13px;padding:10px 12px;text-align:left;cursor:pointer}.timeline-mode-switch button b{display:block;font-size:13px}.timeline-mode-switch button span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.timeline-mode-switch button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--panel));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 26%,transparent)}.timeline-mode-switch button.active b{color:var(--accent2)}.timeline-scroll-hint{margin:9px 2px 0;color:var(--muted);font-size:11px;line-height:1.6}
.master-timeline.sheet-mode{display:block;padding-left:0}.master-timeline.sheet-mode:before{display:none}.timeline-sheet-era{margin:0 0 18px;border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.035)}.timeline-sheet-era-head{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 14%,var(--panel)),var(--panel));border-bottom:1px solid var(--line)}.timeline-sheet-era-head b{font-size:15px;color:var(--accent2)}.timeline-sheet-era-head span{font-size:10px;color:var(--muted)}.timeline-sheet-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}.timeline-sheet{min-width:1100px;display:grid;grid-template-columns:110px 190px 245px 245px 245px 245px}.sheet-head{position:sticky;top:0;z-index:5;background:var(--panel2);font-size:10px;font-weight:900;color:var(--muted);padding:8px 9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.sheet-head:last-child{border-right:0}.sheet-row{display:contents}.sheet-date,.sheet-context,.sheet-cell{position:relative;padding:8px 9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:56px;background:var(--panel)}.sheet-cell:last-child{border-right:0}.sheet-date{position:sticky;left:0;z-index:3;background:color-mix(in srgb,var(--panel) 94%,var(--accent) 6%);font-variant-numeric:tabular-nums}.sheet-date b{display:block;color:var(--accent2);font-size:12px;line-height:1.25}.sheet-date small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.sheet-context{font-size:10px;line-height:1.45}.sheet-context-item{display:grid;grid-template-columns:auto 1fr;gap:5px;margin:0 0 5px}.sheet-context-item:last-child{margin-bottom:0}.sheet-context-item em{font-style:normal;color:var(--muted);white-space:nowrap}.sheet-context-item b{font-size:10px}.sheet-cell.has-items{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 5%,var(--panel)) 0 2px,var(--panel) 2px)}.sheet-event{display:block;width:100%;position:relative;border:0;background:transparent;color:var(--text);padding:5px 5px 5px 14px;text-align:left;border-radius:8px;cursor:pointer;font-size:11px;line-height:1.45}.sheet-event:before{content:"";position:absolute;left:2px;top:10px;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}.sheet-event:after{content:"";position:absolute;left:5px;top:17px;bottom:-7px;width:1px;background:color-mix(in srgb,var(--accent) 34%,var(--line))}.sheet-event:last-child:after{display:none}.sheet-event:hover,.sheet-event:focus-visible{background:var(--panel2);outline:none}.sheet-event strong{font-weight:800}.sheet-event small{display:block;color:var(--muted);font-size:9px;margin-top:1px}.sheet-transition{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:7px 10px;background:color-mix(in srgb,var(--warn) 8%,var(--panel));border-bottom:1px solid color-mix(in srgb,var(--warn) 28%,var(--line));font-size:10px}.sheet-transition>strong{color:var(--warn);font-size:10px}.sheet-transition span{border:1px solid color-mix(in srgb,var(--warn) 28%,var(--line));background:var(--panel);border-radius:999px;padding:3px 7px;white-space:nowrap}.sheet-transition i{font-style:normal;color:var(--muted)}.sheet-empty{color:var(--muted);font-size:10px}.timeline-card-mode-note{font-size:11px;color:var(--muted);margin:0 0 8px;padding:0 2px}@media(max-width:600px){.timeline-mode-switch{grid-template-columns:1fr 1fr}.timeline-sheet{min-width:1020px;grid-template-columns:96px 170px 225px 225px 225px 225px}.sheet-date,.sheet-context,.sheet-cell{padding:7px}.sheet-event{font-size:10.5px}}


/* v3.13.0 connected flow bands */
.sheet-phase-rails{padding:9px 10px 11px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel2) 74%,var(--panel))}.sheet-phase-title{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin:0 0 7px}.sheet-phase-title b{font-size:11px;color:var(--accent2)}.sheet-phase-title span{font-size:9px;color:var(--muted)}.phase-rail-row{display:grid;grid-template-columns:108px minmax(0,1fr);gap:7px;align-items:center;min-height:29px;margin-top:4px}.phase-rail-label{font-size:9px;font-weight:850;color:var(--muted);text-align:right}.phase-rail-line{height:26px;position:relative;border-radius:8px;background:linear-gradient(90deg,color-mix(in srgb,var(--line) 45%,transparent) 1px,transparent 1px);background-size:20% 100%;overflow:hidden}.phase-rail-line:before{content:"";position:absolute;left:0;right:0;top:12px;height:2px;background:var(--line)}.phase-segment{position:absolute;top:2px;height:22px;min-width:22px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));background:color-mix(in srgb,var(--accent) 11%,var(--panel));border-radius:7px;padding:2px 5px;overflow:hidden;z-index:1}.phase-segment b{display:block;font-size:8.5px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phase-segment small{display:block;font-size:6.8px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.timeline-sheet{min-width:1220px;grid-template-columns:110px 300px 250px 250px 250px 250px;grid-auto-rows:minmax(58px,auto);align-items:stretch;position:relative}.office-head small{display:block;font-size:8px;font-weight:600;margin-top:2px}.sheet-date,.sheet-cell{min-height:58px}.sheet-office-band{position:relative;z-index:2;align-self:stretch;justify-self:stretch;box-sizing:border-box;left:calc((100% / var(--office-lanes)) * var(--office-lane));width:calc((100% / var(--office-lanes)) - 3px);margin:2px 0;padding:7px 5px;border-radius:9px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),color-mix(in srgb,var(--accent) 5%,var(--panel)));box-shadow:0 1px 2px rgba(0,0,0,.04);overflow:hidden}.sheet-office-band:after{content:"";position:absolute;left:50%;top:100%;height:7px;border-left:2px solid color-mix(in srgb,var(--accent) 42%,var(--line))}.sheet-office-band small{display:block;font-size:7.5px;color:var(--muted);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sheet-office-band b{display:block;font-size:9px;line-height:1.25;margin-top:2px;word-break:keep-all}.sheet-office-band em{display:block;font-style:normal;color:var(--muted);font-size:6.8px;line-height:1.2;margin-top:3px}.sheet-event.has-flow{padding-top:4px;padding-bottom:7px}.sheet-flow{display:block;position:relative;margin:1px 0 4px;padding:3px 5px 3px 17px;border-radius:6px;font-size:8px;line-height:1.35;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sheet-flow i{font-style:normal;font-weight:900;margin-right:4px}.sheet-flow:before{position:absolute;left:5px;top:2px;font-weight:950}.sheet-flow-cause{background:color-mix(in srgb,var(--warn) 7%,var(--panel2))}.sheet-flow-cause:before{content:"↓";color:var(--warn)}.sheet-flow-result{margin-top:4px;background:color-mix(in srgb,var(--accent) 7%,var(--panel2));color:color-mix(in srgb,var(--text) 72%,var(--muted))}.sheet-flow-result:before{content:"↓";color:var(--accent)}.sheet-event.has-flow:after{background:linear-gradient(var(--accent),color-mix(in srgb,var(--accent) 15%,var(--line)))}
@media(max-width:600px){.timeline-sheet{min-width:1130px;grid-template-columns:96px 270px 225px 225px 225px 225px}.sheet-phase-rails{min-width:0}.phase-rail-row{grid-template-columns:88px minmax(0,1fr)}.sheet-phase-title{align-items:flex-start;flex-direction:column;gap:2px}.sheet-office-band b{font-size:8.5px}.sheet-flow{font-size:7.8px}}


/* v4.0.0 — 170 improvements unified timeline */
.timeline-position{position:sticky;top:0;z-index:35;margin:0 0 10px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(10px);display:flex;gap:10px;align-items:center;box-shadow:0 5px 18px rgba(0,0,0,.06)}.timeline-position b{font-size:10px;color:var(--accent2)}.timeline-position span{font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-mode-switch.v4{grid-template-columns:repeat(5,minmax(0,1fr))}.timeline-setting-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}.timeline-setting-grid label{font-size:9px;color:var(--muted);font-weight:800}.timeline-setting-grid select{width:100%;margin-top:4px}.timeline-presets,.timeline-columns,.timeline-century-jumps{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:9px 0}.timeline-presets b,.timeline-century-jumps b{font-size:9px;color:var(--muted)}.timeline-presets button,.timeline-century-jumps button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:999px;padding:5px 8px;font-size:9px}.timeline-columns label{font-size:9px;border:1px solid var(--line);border-radius:999px;padding:5px 8px;background:var(--panel2)}
.timeline-legend .legend-politics{color:#9a3442}.timeline-legend .legend-external{color:#28699a}.timeline-legend .legend-society{color:#47784a}.timeline-legend .legend-culture{color:#8a6a24}
.timeline-sheet{display:grid;min-width:max(1120px,100%);grid-auto-rows:minmax(62px,auto);align-items:stretch;position:relative}.sheet-era-band{position:sticky;left:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:8px 5px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 18%,var(--panel)),color-mix(in srgb,var(--accent) 7%,var(--panel)));border-right:2px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-bottom:1px solid var(--line);writing-mode:vertical-rl}.sheet-era-band b{font-size:13px;letter-spacing:.12em}.sheet-era-band small{font-size:7px;color:var(--muted)}.sheet-date{position:sticky;left:72px;z-index:7}.era-head{position:sticky;left:0!important;z-index:12}.sheet-head:nth-child(2){position:sticky;left:72px;z-index:12}.sheet-head{top:0}.sheet-cell{padding:7px 8px}.sheet-cell.lane-politics{background:color-mix(in srgb,#a64652 3.5%,var(--panel))}.sheet-cell.lane-external{background:color-mix(in srgb,#347ab0 3.5%,var(--panel))}.sheet-cell.lane-society{background:color-mix(in srgb,#5b8b5d 3.5%,var(--panel))}.sheet-cell.lane-culture{background:color-mix(in srgb,#a68537 3.5%,var(--panel))}
.sheet-event{border-radius:7px;margin:0 0 3px;padding:5px 6px 6px;border-left:3px solid transparent;transition:opacity .16s,transform .16s,background .16s}.sheet-event.lane-politics{border-left-color:#a64652}.sheet-event.lane-external{border-left-color:#347ab0}.sheet-event.lane-society{border-left-color:#5b8b5d}.sheet-event.lane-culture{border-left-color:#a68537}.sheet-event.imp-trunk{background:color-mix(in srgb,var(--accent) 8%,var(--panel));padding-top:7px;padding-bottom:7px}.sheet-event.imp-trunk strong{font-size:12px;font-weight:950}.sheet-event.imp-branch strong{font-size:10.8px}.sheet-event.imp-leaf{opacity:.8}.sheet-event.imp-leaf strong{font-size:9.5px;font-weight:650}.event-top{display:grid;grid-template-columns:auto 1fr auto;gap:4px;align-items:start}.event-top i,.event-top em{font-style:normal;font-size:9px}.event-top em{color:var(--accent2);font-weight:950}.sheet-flow{font-size:7.7px;margin:3px 0;padding:2px 4px 2px 16px}.sheet-flow b{font-size:7px;margin-right:3px}.sheet-flow.cause:before{content:'↓';position:absolute;left:5px;color:var(--warn)}.sheet-flow.result:before{content:'↓';position:absolute;left:5px;color:var(--accent)}.sheet-thumb{width:44px;height:34px;object-fit:cover;border-radius:5px;float:right;margin:3px 0 3px 5px}.rel-off{opacity:.13!important;filter:grayscale(.7)}.rel-on{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 50%,transparent)}
.master-timeline[data-density="compact"] .sheet-cell,.master-timeline[data-density="compact"] .sheet-date{padding-top:4px;padding-bottom:4px}.master-timeline[data-density="compact"] .timeline-sheet{grid-auto-rows:minmax(46px,auto)}.master-timeline[data-density="roomy"] .sheet-cell,.master-timeline[data-density="roomy"] .sheet-date{padding-top:12px;padding-bottom:12px}.master-timeline[data-density="roomy"] .sheet-event strong{font-size:12px}.master-timeline[data-density="roomy"] .timeline-sheet{grid-auto-rows:minmax(80px,auto)}
.timeline-overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}.era-overview-card{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:14px}.era-overview-card header{display:flex;justify-content:space-between;align-items:center}.era-overview-card h3{margin:2px 0 8px}.era-overview-card header small,.era-overview-card header span{font-size:9px;color:var(--muted)}.overview-context{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}.overview-context span{display:grid;grid-template-columns:auto auto;gap:1px 4px;border:1px solid var(--line);border-radius:9px;padding:5px 7px;font-size:8px}.overview-context span i{grid-row:1/3;font-style:normal}.overview-context span b{font-size:7px;color:var(--muted)}.era-overview-card ol{margin:0;padding-left:24px}.era-overview-card li{margin:3px 0}.era-overview-card li button{border:0;background:transparent;color:var(--text);text-align:left;font-size:10px}.era-overview-card li b{display:inline-block;min-width:68px;color:var(--accent2)}.era-transition{margin-top:10px;padding:9px;border-radius:10px;background:var(--panel2);font-size:9px}.era-transition b{color:var(--accent2)}.era-transition p{margin:3px 0 7px;line-height:1.5}
.timeline-tree{display:grid;gap:20px}.tree-era{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:13px}.tree-era h3{margin:0 0 12px}.tree-trunk{position:relative;max-width:900px;margin:auto}.tree-trunk:before{content:'';position:absolute;left:86px;top:8px;bottom:8px;width:4px;border-radius:2px;background:color-mix(in srgb,var(--accent) 35%,var(--line))}.tree-node{position:relative;padding:8px 8px 8px 110px;min-height:70px}.tree-year{position:absolute;left:0;top:12px;width:72px;text-align:right;font-size:9px;font-weight:900;color:var(--accent2)}.tree-main{position:relative;border:1px solid var(--line);border-left:5px solid var(--accent);background:var(--panel2);border-radius:11px;color:var(--text);padding:8px 10px;text-align:left}.tree-main:before{content:'';position:absolute;left:-31px;top:17px;width:26px;height:2px;background:var(--line)}.tree-cause,.tree-result{margin:5px 0 0 8px;font-size:8px;color:var(--muted)}.tree-branches{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 0 8px}.tree-branches button{border:1px dashed var(--line);background:transparent;color:var(--text);border-radius:8px;padding:4px 6px;font-size:8px}.tree-arrow{text-align:center;color:var(--accent);font-weight:900;margin:-5px 0}
.media-mode-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:10px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.media-mode-head b{font-size:13px}.media-mode-head span{flex:1;min-width:220px;font-size:9px;color:var(--muted)}.timeline-media-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.media-study-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}.media-study-card.seen{box-shadow:inset 0 0 0 2px color-mix(in srgb,#5b8b5d 50%,transparent)}.media-study-card img,.media-placeholder{width:100%;height:130px;object-fit:contain;background:var(--panel2)}.media-placeholder{display:flex;align-items:center;justify-content:center;gap:8px;font-size:28px;color:var(--muted)}.media-placeholder small{font-size:9px}.media-study-card>div:last-child{padding:9px}.media-study-card small,.media-study-card span{font-size:8px;color:var(--muted)}.media-study-card b{display:block;font-size:11px;margin:3px 0}.media-study-card p{font-size:9px;line-height:1.45;margin:3px 0}.data-wait{font-size:10px;color:var(--muted);border:1px dashed var(--line);padding:9px;border-radius:10px}
.timeline-drawer{position:fixed;right:0;top:0;bottom:0;width:min(560px,92vw);z-index:1002;background:var(--panel);box-shadow:-18px 0 50px rgba(0,0,0,.22);transform:translateX(105%);transition:transform .22s ease;display:flex;flex-direction:column}.timeline-drawer.open{transform:translateX(0)}.timeline-drawer-shade{position:fixed;inset:0;z-index:1001;background:rgba(0,0,0,.32);opacity:0;pointer-events:none;transition:opacity .2s}.timeline-drawer-shade.open{opacity:1;pointer-events:auto}.timeline-drawer-head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.timeline-drawer-head small{display:block;color:var(--muted);font-size:9px}.timeline-drawer-head b{display:block;font-size:16px;margin-top:3px}.timeline-drawer-head button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:50%;width:34px;height:34px;font-size:20px}.timeline-drawer-body{padding:14px 16px 80px;overflow:auto}.detail-four{display:grid;grid-template-columns:1fr 1fr;gap:8px}.detail-four article{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--panel2)}.detail-four small{font-size:8px;color:var(--accent2);font-weight:900}.detail-four p,.detail-four li{font-size:10px;line-height:1.6}.detail-four ul{padding-left:18px}.year-world{border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:10px}.year-world h4{margin:0 0 7px}.year-world>div{display:grid;grid-template-columns:1fr 1fr;gap:5px}.year-world span{display:grid;padding:5px;border-radius:8px;background:var(--panel2)}.year-world small{font-size:7px;color:var(--muted)}.year-world b{font-size:9px}.relation-list{display:grid;gap:5px}.relation-list button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:9px;padding:7px;text-align:left}.relation-list button b{display:block;font-size:9px}.relation-list button small{font-size:7px;color:var(--muted)}.trap-box{border-left:4px solid var(--warn)!important}.drawer-open{overflow:hidden}
.timeline-training{margin-top:12px}.training-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.training-options button{border:1px solid var(--line);border-radius:10px;padding:9px;background:var(--panel2);color:var(--text)}.training-options button.correct{border-color:#5b8b5d;background:color-mix(in srgb,#5b8b5d 14%,var(--panel))}.training-options button.wrong{border-color:#a64652;background:color-mix(in srgb,#a64652 12%,var(--panel))}.training-feedback{font-size:10px;font-weight:800}.training-feedback.correct{color:#47784a}.training-feedback.wrong{color:#9a3442}.timeline-directory summary{cursor:pointer}.directory-tools{margin:10px 0}.office-directory-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:6px}.office-directory-list button{border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:7px;text-align:left}.office-directory-list b{display:block;font-size:9px}.office-directory-list span{font-size:7px;color:var(--muted)}
@media(max-width:780px){.timeline-mode-switch.v4{grid-template-columns:repeat(2,minmax(0,1fr))}.timeline-setting-grid{grid-template-columns:1fr 1fr}.detail-four,.year-world>div{grid-template-columns:1fr}.timeline-position{top:0}.timeline-sheet{min-width:1050px}.sheet-era-band{writing-mode:vertical-rl}.timeline-overview{grid-template-columns:1fr}.tree-node{padding-left:96px}.tree-trunk:before{left:76px}.tree-year{width:62px}.timeline-drawer{width:96vw}.timeline-columns{overflow-x:auto;flex-wrap:nowrap}.timeline-presets{overflow-x:auto;flex-wrap:nowrap}.timeline-presets button{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.timeline-drawer,.timeline-drawer-shade,.sheet-event{transition:none}}
.study-alert{display:inline-block;margin:2px 0;padding:2px 5px;border-radius:999px;background:color-mix(in srgb,var(--warn) 11%,var(--panel));color:var(--warn);font-size:7px;font-weight:900}.training-media{display:block;width:min(100%,360px);max-height:280px;object-fit:contain;margin:8px auto;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}

/* ===== v4.0.0 超連関UI：170改善点統合 ===== */
.v4-hero h2 small{font-size:12px;vertical-align:middle;color:var(--muted);font-weight:800}.timeline-position{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:8px;padding:8px 12px;margin:0 0 10px;background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.05)}.timeline-position b{font-size:12px;color:var(--accent2)}.timeline-position span{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.v4-controls{position:relative}.v4-mode-switch{grid-template-columns:repeat(5,minmax(0,1fr))}.v4-mode-switch button{min-width:0}.v4-option-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:8px;margin:0 0 10px}.v4-option-grid label,.compare-controls label{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:10px}.v4-option-grid select,.compare-controls select{border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);padding:8px;font:inherit}.v4-search-tools{grid-template-columns:minmax(220px,2fr) repeat(3,minmax(120px,1fr))}.timeline-field-filter{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.timeline-field-filter button{border:1px solid var(--line);background:var(--panel2);color:var(--muted);border-radius:999px;padding:6px 10px;font-size:10px;cursor:pointer}.timeline-field-filter button.active{border-color:var(--accent);color:var(--accent2);background:color-mix(in srgb,var(--accent) 10%,var(--panel))}.v4-legend{position:sticky;top:45px;z-index:25;background:color-mix(in srgb,var(--bg) 91%,transparent);backdrop-filter:blur(8px);padding:7px 6px;border-radius:10px}.legend-trunk{font-weight:900}.legend-branch{font-weight:700}.legend-leaf{opacity:.7}.timeline-overview{margin-bottom:12px}.overview-trunks{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:7px}.overview-trunks button{border:1px solid var(--line);border-radius:11px;background:var(--panel2);color:var(--text);text-align:left;padding:8px;cursor:pointer}.overview-trunks small{display:block;color:var(--accent2);font-size:9px}.overview-trunks b{font-size:11px;line-height:1.35}.overview-note{font-size:11px;color:var(--muted);margin-top:9px}.overview-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.overview-two>div{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--panel2)}.overview-two h4{margin:0 0 7px;font-size:12px}.overview-two p{margin:5px 0;font-size:10px;line-height:1.5}.overview-two small{display:block;color:var(--muted)}.overview-two b{display:block;margin-top:1px}.overview-offices{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-top:8px}.overview-offices>div{border:1px solid var(--line);border-radius:10px;padding:8px}.overview-offices b{font-size:10px}.overview-offices button{border:0;background:transparent;color:var(--accent2);padding:3px;font-size:9px;cursor:pointer}
.v4-sheet{grid-auto-rows:minmax(62px,auto);align-items:stretch}.v4-sheet .sheet-head{position:sticky;top:0;z-index:18}.v4-sheet .era-head{left:0;z-index:23}.v4-sheet .date-head{left:90px;z-index:22}.sheet-era-band{position:sticky;left:0;z-index:12;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:8px 4px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 16%,var(--panel)),color-mix(in srgb,var(--accent) 5%,var(--panel)));border-right:1px solid var(--line);border-bottom:1px solid var(--line);writing-mode:vertical-rl;text-orientation:upright;letter-spacing:.04em}.sheet-era-band b{font-size:13px;color:var(--accent2)}.sheet-era-band small{font-size:7px;color:var(--muted);margin-top:8px;writing-mode:horizontal-tb}.v4-sheet .sheet-date{left:90px;z-index:11;width:auto;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;text-align:left;cursor:pointer}.v4-sheet .sheet-date:hover{background:color-mix(in srgb,var(--accent) 10%,var(--panel))}.v4-sheet .sheet-date.turning,.v4-sheet .sheet-cell.turning{border-top:4px solid color-mix(in srgb,var(--warn) 70%,var(--accent));}.v4-sheet .sheet-date.turning:before{content:'転換';display:inline-block;font-size:7px;color:var(--warn);font-weight:900;margin-bottom:2px}.v4-sheet .sheet-cell{min-height:62px}.sheet-office-band{cursor:pointer;color:var(--text);text-align:left}.sheet-office-band:hover{filter:brightness(1.04);outline:2px solid color-mix(in srgb,var(--accent) 25%,transparent)}.sheet-event{border-left:3px solid transparent;padding-left:22px;margin:1px 0;transition:opacity .18s,transform .18s,background .18s}.sheet-event .event-icon{position:absolute;left:5px;top:7px;font-size:9px}.sheet-event.lane-politics{border-left-color:color-mix(in srgb,var(--accent2) 55%,transparent)}.sheet-event.lane-external{border-left-color:color-mix(in srgb,var(--accent) 55%,transparent)}.sheet-event.lane-society{border-left-color:color-mix(in srgb,var(--good) 55%,transparent)}.sheet-event.lane-culture{border-left-color:color-mix(in srgb,var(--warn) 55%,transparent)}.sheet-event.importance-trunk strong{font-size:12.5px;font-weight:950}.sheet-event.importance-trunk{background:color-mix(in srgb,var(--accent) 8%,transparent);padding-top:7px;padding-bottom:7px}.sheet-event.importance-branch strong{font-size:11px;font-weight:800}.sheet-event.importance-leaf{opacity:.78}.sheet-event.importance-leaf strong{font-size:9.5px;font-weight:650}.sheet-event.is-focus{opacity:1!important;transform:translateX(3px);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 35%,transparent);background:color-mix(in srgb,var(--accent) 13%,var(--panel))}.sheet-event.is-related{opacity:1!important;background:color-mix(in srgb,var(--good) 8%,var(--panel))}.sheet-event.is-dim{opacity:.2}.sheet-event.is-weak:after{content:'要復習';position:absolute;right:4px;top:3px;font-size:6px;font-weight:900;color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,var(--panel));border-radius:999px;padding:1px 4px}.sheet-flow{white-space:normal}.sheet-flow-cause:before,.sheet-flow-result:before{content:'↓'}.sheet-more{width:100%;border:1px dashed var(--line);background:transparent;color:var(--accent2);border-radius:8px;padding:5px;font-size:9px;cursor:pointer}.asia-context{border-bottom:1px dashed var(--line);padding:5px 2px}.asia-context:last-child{border-bottom:0}.asia-context small{display:block;color:var(--muted);font-size:8px}.asia-context b{font-size:9px;line-height:1.4}.sheet-phase-rails{background:var(--panel2)}.phase-segment{overflow:hidden}.phase-segment b{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.phase-segment small{display:none}
html[data-timeline-density="compact"] .v4-sheet{grid-auto-rows:minmax(48px,auto)}html[data-timeline-density="compact"] .sheet-event{padding-top:3px;padding-bottom:3px}html[data-timeline-density="relaxed"] .v4-sheet{grid-auto-rows:minmax(78px,auto)}html[data-timeline-density="relaxed"] .sheet-event{padding-top:8px;padding-bottom:8px}html[data-timeline-text="small"] .v4-master{font-size:.9em}html[data-timeline-text="large"] .v4-master{font-size:1.14em}
/* 一本木 */
.history-tree{position:relative;max-width:980px;margin:0 auto;padding:14px 0 30px}.history-tree:before{content:'';position:absolute;left:50%;top:0;bottom:0;width:5px;border-radius:5px;background:linear-gradient(var(--accent),color-mix(in srgb,var(--accent2) 65%,var(--accent)),var(--good));opacity:.35}.tree-spine-title{position:sticky;top:78px;z-index:8;width:max-content;margin:0 auto 12px;padding:6px 12px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:900}.tree-era{position:relative;padding:0 0 16px}.tree-era>h3{position:relative;z-index:3;width:max-content;margin:12px auto;padding:7px 16px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-size:13px}.tree-node{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;margin:10px 0;transition:opacity .2s}.tree-node:nth-of-type(even) .tree-main{grid-column:2}.tree-node:nth-of-type(even) .tree-branches{grid-column:1;grid-row:1}.tree-main{position:relative;z-index:2;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);padding:10px;text-align:left;cursor:pointer}.tree-main:before{content:'';position:absolute;top:50%;right:-19px;width:18px;border-top:2px solid var(--line)}.tree-node:nth-of-type(even) .tree-main:before{right:auto;left:-19px}.tree-main small{display:block;color:var(--accent2);font-size:9px}.tree-main b{display:block;font-size:12px;margin:2px 0}.tree-main span{display:block;color:var(--muted);font-size:9px;margin-top:4px}.tree-node.importance-trunk .tree-main{border-width:2px;border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:0 4px 12px rgba(0,0,0,.04)}.tree-node.importance-leaf{opacity:.75}.tree-branches{display:flex;flex-direction:column;justify-content:center;gap:5px}.tree-branches button{border:1px dashed var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:6px 8px;text-align:left;font-size:9px;cursor:pointer}.tree-branches small{color:var(--muted);margin-right:5px}.tree-node.is-dim{opacity:.15}.tree-node.is-focus,.tree-node.is-related{opacity:1}
/* 比較 */
.compare-controls{display:flex;align-items:end;justify-content:center;gap:10px}.compare-controls label{min-width:180px}.compare-controls>span{font-weight:950;color:var(--accent2);padding-bottom:8px}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.compare-era{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:14px}.compare-era>h3{margin:0;color:var(--accent2)}.compare-era>p{color:var(--muted);font-size:10px}.compare-era h4{font-size:11px;border-bottom:1px solid var(--line);padding-bottom:4px;margin:12px 0 6px}.compare-era>button,.compare-era p button{border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--text);padding:6px;margin:2px;font-size:9px;text-align:left;cursor:pointer}.compare-era>button{display:block;width:100%}.compare-era>button small,.compare-era>div small{display:block;color:var(--muted);font-size:8px}.compare-era>div b{font-size:10px}.compare-tip{margin-top:10px;font-size:11px}
/* 資料 */
.media-toolbar,.training-stats{display:flex;justify-content:space-between;align-items:center;gap:10px}.media-toolbar div{display:flex;flex-direction:column}.media-toolbar span,.training-stats span{color:var(--muted);font-size:10px}.media-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}.media-gallery-card{border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}.media-gallery-card.seen{opacity:.7}.media-gallery-card img,.media-gallery-placeholder{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--panel2)}.media-gallery-placeholder{display:grid;place-items:center;color:var(--muted);font-size:10px}.media-gallery-card>div:last-child{padding:10px}.media-gallery-card small{color:var(--muted);font-size:8px}.media-gallery-card h4{font-size:12px;margin:4px 0}.media-gallery-card p{font-size:9px;color:var(--muted)}.media-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}.media-actions a,.media-actions button{border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--accent2);padding:5px 7px;font-size:8px;text-decoration:none;cursor:pointer}
/* 判定 */
.timeline-training{max-width:680px;margin:10px auto}.training-question{border:1px solid var(--line);border-radius:18px;background:var(--panel);padding:18px}.training-question>small{color:var(--muted)}.training-question h3{font-size:18px;line-height:1.5}.training-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.training-options button,.training-feedback button{border:1px solid var(--line);border-radius:12px;background:var(--panel2);color:var(--text);padding:12px;text-align:left;cursor:pointer}.training-feedback{margin-top:12px;border-radius:12px;padding:12px}.training-feedback.good{background:color-mix(in srgb,var(--good) 10%,var(--panel))}.training-feedback.bad{background:color-mix(in srgb,var(--bad) 10%,var(--panel))}.training-feedback b{font-size:15px}.training-feedback p{font-size:11px}.training-feedback button{padding:8px;margin-right:6px}
/* 詳細ドロワー */
.timeline-drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.22);z-index:80}.timeline-drawer{position:fixed;z-index:90;right:0;top:0;bottom:0;width:min(520px,94vw);background:var(--bg);border-left:1px solid var(--line);box-shadow:-12px 0 36px rgba(0,0,0,.16);transform:translateX(105%);transition:transform .22s ease;display:flex;flex-direction:column}.timeline-drawer.open{transform:translateX(0)}.timeline-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-bottom:1px solid var(--line);background:var(--panel)}.timeline-drawer-head small{display:block;color:var(--muted);font-size:8px}.timeline-drawer-head b{font-size:13px}.timeline-drawer-head button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:999px;width:34px;height:34px;font-size:20px;cursor:pointer}.timeline-drawer-body{overflow:auto;padding:12px 12px 32px}.drawer-badges{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:9px}.drawer-badges span{border:1px solid var(--line);border-radius:999px;padding:4px 7px;font-size:8px}.drawer-badges .importance-trunk{font-weight:900;border-color:var(--accent);color:var(--accent2)}.drawer-flow{display:flex;flex-direction:column;gap:4px}.drawer-flow>div{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:10px}.drawer-flow>i{text-align:center;font-style:normal;font-weight:950;color:var(--accent)}.drawer-flow small{color:var(--muted);font-size:8px}.drawer-flow p{font-size:10px;line-height:1.6;margin:4px 0}.drawer-event b{display:block;font-size:14px}.drawer-event ul{padding-left:17px;font-size:9px}.drawer-actions{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}.drawer-actions button{border:1px solid var(--line);background:var(--panel2);color:var(--accent2);border-radius:8px;padding:6px 8px;font-size:8px;cursor:pointer}.drawer-section{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}.drawer-section h4{font-size:11px;margin:0 0 7px}.drawer-section .office-row{border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);cursor:pointer;text-align:left}.relation-grid{display:grid;gap:5px}.relation-card{border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:7px;text-align:left;cursor:pointer}.relation-card b{display:block;font-size:9px}.relation-card small{display:block;color:var(--muted);font-size:8px;margin-top:2px}.year-event-list{display:grid;gap:5px}.year-event-list button{display:grid;grid-template-columns:auto 1fr auto;gap:6px;align-items:center;border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:7px;text-align:left;cursor:pointer}.year-event-list b{font-size:9px}.year-event-list small{font-size:8px;color:var(--muted)}
/* 余白・可読性 */
.timeline-sheet-era{box-shadow:none;border-radius:12px}.timeline-sheet-era-head{padding:12px 14px}.sheet-cell,.sheet-date{padding:10px}.sheet-event strong{line-height:1.45}.timeline-chip{line-height:1.3}.hidden{display:none!important}
@media(max-width:800px){.v4-mode-switch{grid-template-columns:repeat(3,1fr)}.v4-option-grid{grid-template-columns:1fr 1fr}.v4-search-tools{grid-template-columns:1fr 1fr}.v4-search-tools .search-input{grid-column:1/-1}.overview-two,.compare-grid{grid-template-columns:1fr}.timeline-position{top:0}.v4-legend{top:43px;overflow-x:auto;white-space:nowrap;flex-wrap:nowrap}.training-options{grid-template-columns:1fr}.timeline-drawer{width:96vw}.history-tree:before{left:13px}.tree-spine-title{margin-left:0}.tree-era>h3{margin-left:0}.tree-node{grid-template-columns:1fr;padding-left:30px;gap:6px}.tree-node:nth-of-type(even) .tree-main,.tree-node:nth-of-type(even) .tree-branches{grid-column:1;grid-row:auto}.tree-main:before,.tree-node:nth-of-type(even) .tree-main:before{left:-18px;right:auto;width:16px}.tree-branches{padding-left:8px}.compare-controls label{min-width:0;flex:1}}
@media(max-width:520px){.v4-mode-switch{grid-template-columns:1fr 1fr}.v4-option-grid{grid-template-columns:1fr 1fr}.v4-search-tools{grid-template-columns:1fr}.v4-search-tools .search-input{grid-column:auto}.timeline-field-filter{overflow-x:auto;flex-wrap:nowrap}.timeline-field-filter button{white-space:nowrap}.overview-trunks{grid-template-columns:1fr 1fr}.media-gallery{grid-template-columns:1fr 1fr}.media-gallery-card h4{font-size:10px}.v4-sheet .date-head,.v4-sheet .sheet-date{left:82px}.v4-sheet .sheet-era-band{width:auto}.timeline-position span{font-size:9px}}
.timeline-century-jumps{display:flex;gap:5px;align-items:center;overflow-x:auto;margin:7px 0 0;padding-bottom:2px}.timeline-century-jumps span{font-size:9px;color:var(--muted);white-space:nowrap}.timeline-century-jumps button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:8px;padding:5px 7px;font-size:8px;cursor:pointer}.timeline-reading-toggle{display:flex;align-items:center;gap:4px;border:1px solid var(--line);background:var(--panel2);border-radius:999px;padding:5px 9px;font-size:10px;color:var(--muted);white-space:nowrap}.person-compare-controls{margin-top:10px}.person-compare-row{display:grid;grid-template-columns:1fr auto 1fr minmax(180px,1.3fr);gap:8px;align-items:center}.person-compare-row select{min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);padding:8px}.person-compare-row>div{border:1px solid var(--line);border-radius:10px;background:var(--panel2);padding:8px}.person-compare-row>div b{display:block;font-size:10px}.person-compare-row>div small{display:block;color:var(--muted);font-size:8px;margin-top:2px}.sheet-event.is-due:after{content:'復習期限';background:color-mix(in srgb,var(--bad) 14%,var(--panel));color:var(--bad)}@media(max-width:700px){.person-compare-row{grid-template-columns:1fr auto 1fr}.person-compare-row>div{grid-column:1/-1}}
/* v4 live-media learning metadata */
.media-look-point{display:block;margin-top:7px;padding:7px 9px;border-left:3px solid var(--accent,#2874a6);background:color-mix(in srgb,var(--panel,#fff) 88%,var(--accent,#2874a6) 12%);border-radius:7px;font-size:.82rem;line-height:1.45}
.training-media{margin:0 auto 14px;max-width:560px;text-align:center}.training-media img{max-width:100%;max-height:340px;object-fit:contain;border-radius:12px;background:#fff}.training-media figcaption{font-size:.78rem;color:var(--muted);margin-top:5px}.training-connect{padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--panel,#fff) 88%,var(--accent,#2874a6) 12%)}

/* ===== v4.1.0 指導書型・一本年表 ===== */
.guidebook-timeline-shell{margin:0 0 18px}.guidebook-source-strip{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin:8px 0 0;padding:10px 12px;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;background:var(--panel)}.guidebook-source-strip b{display:block;font-size:14px}.guidebook-source-strip span{display:block;font-size:10px;color:var(--muted)}.guidebook-badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.guidebook-badges span{border:1px solid var(--line);border-radius:999px;padding:4px 7px;background:var(--panel2);white-space:nowrap}.guidebook-badges .power-badge{color:#b3262e;border-color:color-mix(in srgb,#b3262e 38%,var(--line));background:color-mix(in srgb,#b3262e 7%,var(--panel))}.guidebook-rule-note,.guidebook-bottom-note{padding:8px 11px;border:1px solid var(--line);font-size:10px;line-height:1.55;color:var(--muted);background:color-mix(in srgb,var(--panel2) 65%,var(--panel))}.guidebook-rule-note{border-bottom:0}.guidebook-bottom-note{border-top:0;border-radius:0 0 12px 12px}.guidebook-scroll{border:1px solid var(--line);border-radius:0;box-shadow:none;background:var(--panel)}
.guidebook-sheet{display:grid;grid-auto-rows:minmax(52px,auto);align-items:stretch;background:var(--panel);font-variant-numeric:tabular-nums}.guidebook-sheet>.sheet-head{position:sticky;top:0;z-index:28;border-radius:0;border:0;border-right:1px solid var(--line);border-bottom:2px solid color-mix(in srgb,var(--text) 30%,var(--line));background:color-mix(in srgb,var(--panel2) 90%,var(--panel));padding:7px 6px;font-size:10px;text-align:center}.guidebook-sheet>.era-head{left:0;z-index:34}.guidebook-sheet>.date-head{left:72px;z-index:33}.guidebook-sheet>.power-head{color:#b3262e;background:color-mix(in srgb,#b3262e 7%,var(--panel))}.guidebook-sheet>.formal-head{background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
.guide-era-band{position:sticky;left:0;z-index:18;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:5px 3px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--accent) 8%,var(--panel));writing-mode:vertical-rl;text-orientation:upright}.guide-era-band b{font-size:12px;color:var(--accent2);letter-spacing:.08em}.guide-era-band small{writing-mode:horizontal-tb;font-size:7px;color:var(--muted);margin-top:6px}.guidebook-sheet .guide-date{position:sticky;left:72px;z-index:17;border-radius:0;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel);padding:7px 6px;text-align:left}.guidebook-sheet .guide-date b{font-size:11px}.guidebook-sheet .guide-date small{font-size:7px;line-height:1.3}.guidebook-sheet .guide-date.turning{border-top:3px solid color-mix(in srgb,var(--warn) 72%,var(--accent))}
.guide-power-band{z-index:8;border:0;border-left:4px solid #c22f36;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:color-mix(in srgb,#c22f36 7%,var(--panel));color:var(--text);padding:6px 7px;text-align:left;display:flex;flex-direction:column;justify-content:center;min-height:100%;cursor:pointer;overflow:hidden}.guide-power-band>span{color:#c22f36;font-size:13px;font-weight:950}.guide-power-band b{font-size:10.5px;line-height:1.35}.guide-power-band small{font-size:7px;color:var(--muted)}.guide-power-band em{font-style:normal;font-size:7.5px;line-height:1.35;color:var(--muted);margin-top:3px}.guide-power-band:hover{background:color-mix(in srgb,#c22f36 12%,var(--panel))}
.guide-formal-cell,.guide-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:5px 6px;background:var(--panel);min-width:0}.guide-formal-cell.turning,.guide-cell.turning{border-top:3px solid color-mix(in srgb,var(--warn) 72%,var(--accent))}.formal-lines{display:grid;gap:3px}.formal-line{display:grid;grid-template-columns:52px 1fr;gap:5px;align-items:start;padding-bottom:2px;border-bottom:1px dotted color-mix(in srgb,var(--line) 80%,transparent)}.formal-line:last-child{border-bottom:0}.formal-line small{font-size:7.5px;color:var(--muted);white-space:nowrap}.formal-line b{font-size:9px;line-height:1.35}.guidebook-sheet .sheet-empty{display:block;text-align:center;color:color-mix(in srgb,var(--muted) 55%,transparent);font-size:9px;padding:9px 0}
.guidebook-sheet .sheet-event{position:relative;display:block;width:100%;border:0;border-left:2px solid transparent;border-bottom:1px dotted color-mix(in srgb,var(--line) 75%,transparent);border-radius:0;background:transparent;color:var(--text);text-align:left;padding:4px 3px 4px 17px;margin:0;box-shadow:none;cursor:pointer;min-height:0}.guidebook-sheet .sheet-event:last-child{border-bottom:0}.guidebook-sheet .sheet-event:hover{background:color-mix(in srgb,var(--accent) 6%,var(--panel))}.guidebook-sheet .sheet-event .event-icon{left:3px;top:5px;font-size:8px}.guidebook-sheet .sheet-event strong{display:block;font-size:9.5px;line-height:1.38}.guidebook-sheet .sheet-event small{display:block;font-size:7px;line-height:1.25;color:var(--muted);margin-top:1px}.guidebook-sheet .sheet-event .sheet-flow{display:none}.guidebook-sheet .sheet-event.importance-trunk{background:color-mix(in srgb,var(--accent) 5%,transparent)}.guidebook-sheet .sheet-event.importance-trunk strong{font-size:10.5px;font-weight:950}.guidebook-sheet .sheet-event.importance-branch strong{font-weight:800}.guidebook-sheet .sheet-event.importance-leaf{opacity:.88}.guidebook-sheet .sheet-more{border-radius:3px;padding:3px;font-size:8px;margin-top:3px}.guidebook-sheet .asia-context{padding:3px 1px}.guidebook-sheet .asia-context small{font-size:7px}.guidebook-sheet .asia-context b{font-size:8.5px;line-height:1.3}.guidebook-sheet .sheet-event.is-dim{opacity:.18}.guidebook-sheet .sheet-event.is-focus{transform:none;box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 42%,transparent)}
html[data-timeline-density="compact"] .guidebook-sheet{grid-auto-rows:minmax(42px,auto)}html[data-timeline-density="compact"] .guidebook-sheet .sheet-event{padding-top:2px;padding-bottom:2px}html[data-timeline-density="relaxed"] .guidebook-sheet{grid-auto-rows:minmax(68px,auto)}html[data-timeline-density="relaxed"] .guidebook-sheet .sheet-event{padding-top:6px;padding-bottom:6px}
@media(max-width:700px){.guidebook-source-strip{flex-direction:column}.guidebook-badges{justify-content:flex-start}.guidebook-sheet>.date-head,.guidebook-sheet .guide-date{left:58px}.guide-era-band{width:auto}.guidebook-sheet>.era-head{width:auto}.guidebook-rule-note,.guidebook-bottom-note{font-size:9px}.guidebook-sheet{font-size:.95em}}

/* =========================================================
   v6.0.0 — smartphone-first synchronized chronology
   Core: 西暦 → 元号 → 天皇 → 政治体制 → 制度上トップ → 政治主導者 → 主要事件
   ========================================================= */
.v5-timeline .guidebook-source-strip{border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}
.v5-timeline .guidebook-source-strip>div:first-child span{font-weight:750;color:var(--text);margin-top:3px}
.v5-timeline .power-type-legend{display:flex;gap:5px;flex-wrap:wrap;padding:7px 10px;border:1px solid var(--line);border-bottom:0;background:var(--panel);font-size:8px}
.v5-timeline .power-type-legend span,.power-role-chip{display:inline-flex;align-items:center;width:max-content;border-radius:999px;padding:2px 6px;border:1px solid currentColor;font-size:7px;font-weight:900;line-height:1.25;background:var(--panel)}
.power-type-court{color:#2f7d4a!important}.power-type-sessho{color:#b78900!important}.power-type-kampaku{color:#2f66b0!important}.power-type-insei{color:#7a4aa8!important}.power-type-regent{color:#b3262e!important}.power-type-kanrei{color:#2f8fa3!important}.power-type-edo{color:#8b5a2b!important}.power-type-shogun{color:#4a5560!important}.power-type-prime-minister{color:#173d78!important}.power-type-emperor{color:#a36d00!important}.power-type-other{color:var(--accent2)!important}

.v5-sheet{grid-auto-rows:minmax(62px,auto)}
.v5-sheet>.sheet-head{white-space:nowrap}
.v5-sheet>.date-head{left:70px!important}
.v5-sheet .guide-date{left:70px!important}
.v5-sheet>.gengo-head{background:color-mix(in srgb,#98701b 8%,var(--panel))}
.v5-sheet>.emperor-head{background:color-mix(in srgb,#a36d00 8%,var(--panel))}
.v5-sheet>.regime-head{background:color-mix(in srgb,#557a5a 8%,var(--panel))}
.v5-sheet>.major-head{background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.desktop-core-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px;background:var(--panel);min-width:0;overflow:hidden}
.desktop-core-cell.turning{border-top:3px solid color-mix(in srgb,var(--warn) 72%,var(--accent))}
.v5-gengo-cell{display:flex;flex-direction:column;justify-content:center;gap:3px;text-align:center;background:color-mix(in srgb,#98701b 4%,var(--panel))}
.v5-gengo-cell b{font-size:11px;line-height:1.35;color:color-mix(in srgb,#98701b 78%,var(--text))}.v5-gengo-cell small{font-size:7px;color:var(--muted)}
.emperor-line,.regime-line{display:flex;min-height:100%;flex-direction:column;justify-content:center;gap:2px}.emperor-line small,.regime-line small{font-size:7px;color:var(--muted)}.emperor-line b,.regime-line b{font-size:10px;line-height:1.35}.emperor-line em{font-style:normal;color:var(--muted);font-size:6.8px;line-height:1.3}

.guide-emperor-band,.guide-regime-band{z-index:9;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;color:var(--text);padding:6px 7px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;overflow:hidden}
.guide-emperor-band{border-left:4px solid #a36d00;background:color-mix(in srgb,#a36d00 7%,var(--panel));cursor:pointer}.guide-regime-band{border-left:4px solid #557a5a;background:color-mix(in srgb,#557a5a 7%,var(--panel))}
.guide-emperor-band small,.guide-regime-band small{font-size:7px;color:var(--muted)}.guide-emperor-band b,.guide-regime-band b{font-size:10px;line-height:1.35}.guide-emperor-band span,.guide-regime-band span{font-size:6.8px;color:var(--muted);margin-top:2px}.guide-emperor-band em{font-style:normal;font-size:6.7px;color:var(--muted);line-height:1.3;margin-top:3px}

.guide-power-band{border-left-width:4px}.guide-power-band .power-role-chip{margin:3px 0 1px}.guide-power-band.power-type-court{border-left-color:#2f7d4a;background:color-mix(in srgb,#2f7d4a 7%,var(--panel))}.guide-power-band.power-type-sessho{border-left-color:#b78900;background:color-mix(in srgb,#b78900 8%,var(--panel))}.guide-power-band.power-type-kampaku{border-left-color:#2f66b0;background:color-mix(in srgb,#2f66b0 7%,var(--panel))}.guide-power-band.power-type-insei{border-left-color:#7a4aa8;background:color-mix(in srgb,#7a4aa8 7%,var(--panel))}.guide-power-band.power-type-regent{border-left-color:#b3262e;background:color-mix(in srgb,#b3262e 7%,var(--panel))}.guide-power-band.power-type-kanrei{border-left-color:#2f8fa3;background:color-mix(in srgb,#2f8fa3 7%,var(--panel))}.guide-power-band.power-type-edo{border-left-color:#8b5a2b;background:color-mix(in srgb,#8b5a2b 7%,var(--panel))}.guide-power-band.power-type-shogun{border-left-color:#4a5560;background:color-mix(in srgb,#4a5560 7%,var(--panel))}.guide-power-band.power-type-prime-minister{border-left-color:#173d78;background:color-mix(in srgb,#173d78 7%,var(--panel))}.guide-power-band.power-type-emperor{border-left-color:#a36d00;background:color-mix(in srgb,#a36d00 8%,var(--panel))}

.major-events{display:grid;gap:4px}.major-event{display:grid;grid-template-columns:18px 1fr;gap:4px;border:0;border-radius:8px;background:transparent;color:var(--text);padding:5px;text-align:left;cursor:pointer}.major-event:hover{background:var(--panel2)}.major-event>span{grid-row:1/3}.major-event b{font-size:10px;line-height:1.35}.major-event small{font-size:7px;color:var(--muted)}.major-event.importance-trunk{background:color-mix(in srgb,var(--accent) 8%,var(--panel));border-left:3px solid var(--accent)}.major-event.importance-trunk b{font-size:11px;font-weight:950}.major-event.importance-leaf{opacity:.78}

.formal-line.role-sessho{border-left:3px solid #b78900;padding-left:4px}.formal-line.role-kampaku{border-left:3px solid #2f66b0;padding-left:4px}.formal-line.role-insei{border-left:3px solid #7a4aa8;padding-left:4px}.formal-line.role-regent,.formal-line.role-tokusou{border-left:3px solid #b3262e;padding-left:4px}.formal-line.role-muromachiKanrei{border-left:3px solid #2f8fa3;padding-left:4px}.formal-line.role-edoPower{border-left:3px solid #8b5a2b;padding-left:4px}.formal-line.role-primeMinister{border-left:3px solid #173d78;padding-left:4px}

.mobile-core-head,.v5-mobile-core-cell{display:none}
.year-snapshot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.year-snapshot-grid>div{border:1px solid var(--line);border-radius:10px;background:var(--panel2);padding:8px;min-width:0}.year-snapshot-grid small{display:block;color:var(--muted);font-size:8px}.year-snapshot-grid b{display:block;font-size:10px;line-height:1.4;margin-top:2px}.year-snapshot-grid .snapshot-power{grid-column:1/-1;border-left:4px solid #b3262e}.snapshot-power em{display:block;font-style:normal;color:var(--muted);font-size:8px;line-height:1.4;margin-top:2px}.snapshot-power .power-role-chip{display:inline-flex;margin-left:5px}
.year-empty{font-size:9px;color:var(--muted)}

@media(max-width:700px){
  .v5-timeline .guidebook-source-strip{position:relative}.v5-timeline .guidebook-source-strip b{font-size:13px}.v5-timeline .guidebook-source-strip>div:first-child span{font-size:9px;line-height:1.45}
  .v5-timeline .power-type-legend{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:8px}.v5-timeline .power-type-legend span{flex:0 0 auto}
  .v5-sheet{grid-template-columns:72px 300px 232px 232px 240px 240px 250px!important;min-width:1566px!important;grid-auto-rows:minmax(72px,auto)}
  .v5-sheet>.era-head,.v5-sheet>.desktop-core-head:not(.date-head),.v5-sheet>.guide-era-band,.v5-sheet>.half-century-band,.v5-sheet>.guide-gengo-band,.v5-sheet>.guide-emperor-span,.v5-sheet>.guide-support-band,.v5-sheet>.guide-shogun-band,.v5-sheet>.guide-tenkabito-band,.v5-sheet>.guide-prime-minister-band,.v5-sheet>.desktop-core-cell,.v5-sheet>.guide-emperor-band,.v5-sheet>.guide-regime-band,.v5-sheet>.guide-power-band{display:none!important}
  .v5-sheet>.date-head{display:block!important;grid-column:1!important;left:0!important;z-index:36;background:var(--panel2)}
  .v5-sheet .guide-date{grid-column:1!important;left:0!important;z-index:24;padding:7px 5px;background:color-mix(in srgb,var(--panel) 94%,var(--accent) 6%)}
  .v5-sheet .guide-date b{font-size:11px}.v5-sheet .guide-date small{font-size:6.8px}
  .v5-sheet>.mobile-core-head{display:block;grid-row:1;grid-column:2!important;position:sticky;top:0;z-index:31;text-align:left;padding-left:10px;background:color-mix(in srgb,var(--accent) 7%,var(--panel2))}
  .v5-mobile-core-cell{display:grid;grid-column:2!important;gap:5px;padding:7px 8px;border-right:2px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-bottom:1px solid var(--line);background:var(--panel);min-width:0}
  .v5-mobile-core-cell.turning{border-top:3px solid color-mix(in srgb,var(--warn) 72%,var(--accent))}
  .mobile-core-top{display:grid;grid-template-columns:minmax(100px,.9fr) minmax(0,1.4fr);gap:5px}.mobile-core-top>span,.mobile-regime,.mobile-power,.mobile-formal,.mobile-major{min-width:0;border-radius:7px;padding:4px 6px;background:var(--panel2)}
  .mobile-core-top small,.mobile-regime small,.mobile-power>small,.mobile-formal>small,.mobile-major>small{display:block;font-size:6.7px;color:var(--muted);font-weight:900}.mobile-core-top b,.mobile-regime b{display:block;font-size:9.5px;line-height:1.3}.mobile-gengo{border-left:3px solid #98701b}.mobile-emperor{border-left:3px solid #a36d00}.mobile-regime{border-left:3px solid #557a5a}.mobile-power{border-left:3px solid #b3262e}.mobile-formal{border-left:3px solid var(--line)}.mobile-major{border-left:3px solid var(--accent)}
  .mobile-power>b{display:block;font-size:9.5px;line-height:1.35;margin:2px 0}.mobile-power .power-role-chip{font-size:6px;padding:1px 4px;margin-left:3px;vertical-align:middle}
  .mobile-formal .formal-lines{gap:1px}.mobile-formal .formal-line{grid-template-columns:44px 1fr;padding:1px 0}.mobile-formal .formal-line small{font-size:6.4px}.mobile-formal .formal-line b{font-size:8px}.mobile-major .major-events{gap:2px}.mobile-major .major-event{padding:3px;grid-template-columns:14px 1fr}.mobile-major .major-event b{font-size:8.8px}.mobile-major .major-event small{display:none}.mobile-major .major-event>span{font-size:8px}
  .v5-sheet>.v5-detail-head,.v5-sheet>.v5-detail-cell{display:block!important}.v5-sheet>.v5-detail-col-1{grid-column:3!important}.v5-sheet>.v5-detail-col-2{grid-column:4!important}.v5-sheet>.v5-detail-col-3{grid-column:5!important}.v5-sheet>.v5-detail-col-4{grid-column:6!important}.v5-sheet>.v5-detail-col-5{grid-column:7!important}
  .v5-sheet>.v5-detail-head{position:sticky;top:0;z-index:29}.v5-sheet>.guide-cell{padding:6px}
  .timeline-position{padding:7px 9px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 8px}.timeline-position b{font-size:9px}.timeline-position span{font-size:8.5px;line-height:1.35}
  .year-snapshot-grid{grid-template-columns:1fr}.year-snapshot-grid .snapshot-power{grid-column:auto}
}


/* =========================================================
   v6.0.0 — 完全同期年表 / smartphone first
   ========================================================= */
.v6-timeline .guidebook-rule-note{font-size:11px;line-height:1.6;padding:10px 12px}
.v6-sheet>.power-head{background:color-mix(in srgb,#173d78 7%,var(--panel2))}
.guide-power-band small{font-size:7px;color:var(--muted);font-weight:900}.guide-power-band b{font-size:10px;line-height:1.35}.guide-power-band span{font-size:6.8px;color:var(--muted)}.guide-power-band em{font-style:normal;font-size:6.8px;line-height:1.35;color:var(--muted);margin-top:3px}
.institutional-top{display:grid;gap:2px;padding:4px 5px 5px;border-left:3px solid #4a5560;background:color-mix(in srgb,#4a5560 5%,var(--panel));margin-bottom:4px}.institutional-top small{font-size:7px;color:var(--muted);font-weight:900}.institutional-top b{font-size:9.5px;line-height:1.35}
.power-inline>div{display:grid;gap:2px}.power-inline small{font-size:7px;color:var(--muted);font-weight:900}.power-inline b{font-size:10px}.power-inline em{font-style:normal;font-size:7px;color:var(--muted);line-height:1.35}
.parallel-lane-line{display:grid;gap:2px;padding:5px 3px}.parallel-lane-line small{font-size:7px;color:var(--muted)}.parallel-lane-line b{font-size:9.5px;line-height:1.35}
.tick-100{border-top:4px solid color-mix(in srgb,var(--accent) 75%,#17304d)!important}.tick-50{border-top:3px solid color-mix(in srgb,var(--accent) 45%,var(--line))!important}.tick-10{border-top:2px solid color-mix(in srgb,var(--muted) 32%,var(--line))!important}
.leader-legend{font-weight:900;color:#173d78}
.v6-drawer-flow{display:grid;gap:0}.v6-drawer-flow>div{border-left:3px solid var(--line);padding:10px 12px;margin:0;background:var(--panel)}.v6-drawer-flow>div+div{border-top:1px solid var(--line)}.v6-drawer-flow small{font-size:9px;color:var(--accent2);font-weight:900}.v6-drawer-flow p,.v6-drawer-flow li{font-size:11px;line-height:1.7}.v6-drawer-flow .drawer-event{border-left-color:var(--accent)}
@media(max-width:700px){
  .v6-sheet{grid-template-columns:76px minmax(276px,calc(100vw - 108px)) 236px 236px 246px 246px 226px 226px 226px 226px 246px!important;min-width:max-content!important;grid-auto-rows:minmax(92px,auto)}
  .v6-sheet>.date-head{width:76px;min-width:76px}.v6-sheet .guide-date{width:76px;min-width:76px}
  .v6-sheet>.mobile-core-head{grid-column:2!important;font-size:10px;white-space:normal;line-height:1.35}
  .v5-mobile-core-cell{grid-column:2!important;display:block;padding:0;background:var(--panel);border-right:2px solid color-mix(in srgb,var(--accent) 22%,var(--line))}
  .mobile-core-line{display:grid;grid-template-columns:86px minmax(0,1fr);gap:8px;align-items:start;padding:8px 10px;border-bottom:1px solid var(--line);border-radius:0;background:transparent!important;min-width:0}
  .mobile-core-line:last-child{border-bottom:0}.mobile-core-line>small{display:block!important;font-size:8.5px!important;color:var(--muted);font-weight:900;line-height:1.35}.mobile-core-line>b{font-size:12px!important;line-height:1.45!important}
  .mobile-gengo,.mobile-emperor,.mobile-regime,.mobile-top,.mobile-power,.mobile-major{border-left:0!important}
  .mobile-gengo{box-shadow:inset 4px 0 #98701b}.mobile-emperor{box-shadow:inset 4px 0 #a36d00}.mobile-regime{box-shadow:inset 4px 0 #557a5a}.mobile-top{box-shadow:inset 4px 0 #4a5560}.mobile-power{box-shadow:inset 4px 0 #173d78}.mobile-major{box-shadow:inset 4px 0 var(--accent)}
  .mobile-top em{grid-column:2;font-style:normal;font-size:8px;line-height:1.4;color:var(--muted)}
  .mobile-power>small{grid-row:1/-1}.mobile-leader{grid-column:2;display:grid;gap:3px;padding:5px 7px;border-left:4px solid currentColor;background:color-mix(in srgb,currentColor 4%,var(--panel));margin:0 0 4px}.mobile-leader:last-child{margin-bottom:0}.mobile-leader b{font-size:12px;line-height:1.35;color:var(--text)}.mobile-leader em{font-style:normal;font-size:8.5px;line-height:1.45;color:var(--muted)}.mobile-leader .power-role-chip{font-size:7px;padding:2px 5px}
  .mobile-major>small{grid-row:1/-1}.mobile-major .major-events{grid-column:2}.mobile-major .major-event{padding:5px 3px;grid-template-columns:16px 1fr}.mobile-major .major-event b{font-size:10.5px}.mobile-major .major-event small{display:block;font-size:7.5px}
  .v6-sheet>.v5-detail-col-1{grid-column:3!important}.v6-sheet>.v5-detail-col-2{grid-column:4!important}.v6-sheet>.v5-detail-col-3{grid-column:5!important}.v6-sheet>.v5-detail-col-4{grid-column:6!important}.v6-sheet>.v5-detail-col-5{grid-column:7!important}.v6-sheet>.v5-detail-col-6{grid-column:8!important}.v6-sheet>.v5-detail-col-7{grid-column:9!important}.v6-sheet>.v5-detail-col-8{grid-column:10!important}.v6-sheet>.v5-detail-col-9{grid-column:11!important}
  .guidebook-sheet .sheet-event strong{font-size:11px}.guidebook-sheet .sheet-event small{font-size:8px}.parallel-lane-line b{font-size:11px}.parallel-lane-line small{font-size:8px}
  .timeline-drawer{top:auto;right:0;left:0;bottom:0;width:100vw;max-height:88dvh;border-radius:18px 18px 0 0;transform:translateY(105%);box-shadow:0 -18px 50px rgba(0,0,0,.24)}.timeline-drawer.open{transform:translateY(0)}
  .timeline-drawer-head{padding:12px 14px}.timeline-drawer-body{padding:12px 14px calc(80px + env(safe-area-inset-bottom))}.timeline-drawer-head:before{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:44px;height:4px;border-radius:99px;background:var(--line)}
  .timeline-position{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--panel) 97%,transparent)}
  .v4-legend{top:54px;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}.v4-legend span{flex:0 0 auto}
}
@media(min-width:701px){.v6-sheet{font-size:1em}.v6-sheet>.sheet-head{font-size:10px}.v6-sheet .guide-date b{font-size:12px}.v6-sheet .guidebook-sheet .sheet-event strong{font-size:10px}}

.guide-emperor-band.court-south{width:50%;justify-self:start;padding-left:3px;padding-right:3px}.guide-emperor-band.court-north{width:50%;justify-self:end;padding-left:3px;padding-right:3px;border-left-color:#6a7392;background:color-mix(in srgb,#6a7392 7%,var(--panel))}.emperor-gap{background:color-mix(in srgb,#a36d00 4%,var(--panel));padding:4px}
@media(max-width:700px){.guide-emperor-band.court-south,.guide-emperor-band.court-north{width:auto}.v6-timeline .guidebook-rule-note{font-size:10.5px}.v6-timeline .power-type-legend span,.v6-timeline .power-role-chip{font-size:8px}.timeline-scroll-hint{font-size:10px;line-height:1.55}}
/* v6.0.0 readability floor: do not shrink text to fit information */
@media(max-width:700px){
  .v6-sheet>.mobile-core-head{font-size:12px;line-height:1.45;padding:10px 12px}
  .v6-sheet .guide-date b{font-size:14px;line-height:1.3}.v6-sheet .guide-date small{font-size:10.5px;line-height:1.4}
  .mobile-core-line{grid-template-columns:92px minmax(0,1fr);gap:10px;padding:10px 12px}
  .mobile-core-line>small{font-size:11px!important;line-height:1.4}.mobile-core-line>b{font-size:14px!important;line-height:1.5!important}
  .mobile-top em{font-size:11px;line-height:1.5}.mobile-leader{padding:7px 9px;gap:4px}.mobile-leader b{font-size:14px;line-height:1.45}.mobile-leader em{font-size:11px;line-height:1.5}.mobile-leader .power-role-chip{font-size:10px;padding:3px 6px}
  .mobile-major .major-event{padding:7px 4px;grid-template-columns:18px 1fr}.mobile-major .major-event b{font-size:13px;line-height:1.5}.mobile-major .major-event small{font-size:10.5px;line-height:1.45}
  .guidebook-sheet .sheet-event strong{font-size:13px;line-height:1.5}.guidebook-sheet .sheet-event small{font-size:10.5px;line-height:1.45}.parallel-lane-line b{font-size:13px;line-height:1.5}.parallel-lane-line small{font-size:10.5px}
  .timeline-position{padding:9px 11px}.timeline-position b{font-size:13px;line-height:1.4}.timeline-position span{font-size:12px;line-height:1.45}
  .v6-timeline .guidebook-rule-note{font-size:12px;line-height:1.65}.v6-timeline .power-type-legend{font-size:10px}.v6-timeline .power-type-legend span,.v6-timeline .power-role-chip{font-size:10px}
  .v6-drawer-flow small{font-size:12px}.v6-drawer-flow p,.v6-drawer-flow li{font-size:14px;line-height:1.75}.year-snapshot-grid small{font-size:11px}.year-snapshot-grid b{font-size:13px;line-height:1.5}.snapshot-power em{font-size:11px;line-height:1.5}
}


/* v6.0.1 STEP 1 — mobile timeline must never become a giant horizontal table */
.field-all-mobile{display:none}
@media(max-width:700px){
  .field-all-desktop{display:none}.field-all-mobile{display:inline}
  .v6-timeline .timeline-sheet-scroll{overflow-x:hidden!important;overscroll-behavior-x:none!important;width:100%}
  .v6-sheet{grid-template-columns:76px minmax(0,1fr)!important;min-width:100%!important;width:100%!important;max-width:100%!important;grid-auto-rows:minmax(92px,auto)}
  .v6-sheet>.v5-detail-head,.v6-sheet>.v5-detail-cell{display:none!important}
  .v6-sheet>.mobile-core-head{grid-column:2!important;width:auto!important;min-width:0!important}
  .v6-sheet .guide-date{grid-column:1!important;left:0!important}
  .v5-mobile-core-cell{grid-column:2!important;width:auto!important;min-width:0!important;overflow:hidden}
  .mobile-core-line{width:100%;min-width:0}
  .mobile-extra{box-shadow:inset 4px 0 color-mix(in srgb,var(--accent) 62%,var(--line));background:color-mix(in srgb,var(--accent) 3%,var(--panel))!important}
  .mobile-extra>small{grid-row:1/-1}
  .mobile-extra-content{grid-column:2;min-width:0;overflow-wrap:anywhere}
  .mobile-extra-content .sheet-event{padding:7px 4px 7px 20px}
  .mobile-extra-content .sheet-event strong{font-size:13px;line-height:1.5}
  .mobile-extra-content .sheet-event small{font-size:10.5px;line-height:1.45}
  .mobile-extra-content .parallel-lane-line{padding:4px 0}
  .guidebook-bottom-note{font-size:11px;line-height:1.6}
}

/* v6.0.2 STEP 2 — do not repeat unchanged mobile context every event-year */
@media(max-width:700px){
  .v6-sheet{grid-auto-rows:minmax(64px,auto)!important}
  .v5-mobile-core-cell{align-self:stretch}
  .mobile-context-change{background:color-mix(in srgb,var(--accent) 2%,var(--panel))!important}
  .mobile-major{min-height:64px}
}


/* STEP 3: reference-style arrangement */
.reference-layout-sheet{background:var(--panel)}
.guide-struct-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:4px 5px;background:var(--panel);min-width:0}
.guide-struct-cell.turning{border-top:3px solid color-mix(in srgb,var(--warn) 72%,var(--accent))}
.guide-date-gengo{display:block;font-weight:800;color:var(--text)}
.office-mini-lines{display:grid;gap:2px}
.office-mini-line{display:grid;gap:1px;padding-bottom:2px;border-bottom:1px dotted color-mix(in srgb,var(--line) 72%,transparent)}
.office-mini-line:last-child{border-bottom:0;padding-bottom:0}
.office-mini-line small{font-size:7px;color:var(--muted);line-height:1.2}
.office-mini-line b{font-size:9px;line-height:1.35}
.timeline-ditto{display:flex;align-items:center;justify-content:center;height:100%;min-height:48px;color:color-mix(in srgb,var(--muted) 72%,transparent);font-size:16px;font-weight:800}
.reference-layout-sheet .guide-emperor-cell .emperor-line,
.reference-layout-sheet .guide-power-struct .power-inline,
.reference-layout-sheet .guide-struct-cell .regime-line{margin:0}
.reference-layout-sheet .guide-emperor-cell .emperor-line small,
.reference-layout-sheet .guide-power-struct .power-inline small,
.reference-layout-sheet .guide-struct-cell .regime-line small{font-size:7px}
.reference-layout-sheet .guide-emperor-cell .emperor-line b,
.reference-layout-sheet .guide-struct-cell .regime-line b{font-size:9.5px;line-height:1.35}
.reference-layout-sheet .guide-power-struct .power-inline{padding:4px 5px;border-radius:6px}
.reference-layout-sheet .guide-power-struct .power-inline b{font-size:9.5px;line-height:1.3}
.reference-layout-sheet .guide-power-struct .power-inline em,
.reference-layout-sheet .guide-emperor-cell .emperor-line em{font-size:7px;line-height:1.25}
.reference-layout-sheet>.sheet-head{letter-spacing:0}
@media(min-width:701px){
  .reference-layout-sheet{grid-auto-rows:minmax(70px,auto)!important}
  .reference-layout-sheet>.sheet-head{font-size:9.5px;line-height:1.25;padding:8px 5px}
  .reference-layout-sheet .guide-date{padding:6px 5px}
  .reference-layout-sheet .guide-date b{font-size:11px}
  .reference-layout-sheet .guide-date small{font-size:7.5px;line-height:1.25}
  .reference-layout-sheet .guide-cell .sheet-event strong{font-size:9.8px}
  .reference-layout-sheet .guide-cell .sheet-event small{font-size:7.4px}
}
@media(max-width:700px){
  .mobile-role-stack{display:grid;gap:4px}
  .mobile-role-stack div{display:grid;gap:2px}
  .mobile-role-stack em{font-style:normal;color:var(--muted);font-size:10px}
}


.guide-gengo-band{position:relative;z-index:6;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:4px 3px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,#b58a2c 10%,var(--panel));overflow:hidden}
.guide-gengo-band small{font-size:7px;color:var(--muted);line-height:1.15}
.guide-gengo-band b{font-size:10px;line-height:1.25;color:var(--text)}
.guide-gengo-band span{font-size:6.5px;color:var(--muted);line-height:1.15;margin-top:3px}
.guide-gengo-band.court-south{width:50%;justify-self:start;border-right:1px dashed color-mix(in srgb,var(--line) 75%,transparent);background:color-mix(in srgb,#8c6b1f 10%,var(--panel))}
.guide-gengo-band.court-north{width:50%;justify-self:end;background:color-mix(in srgb,#5d7da8 10%,var(--panel))}
.reference-layout-sheet .gengo-head{background:color-mix(in srgb,#b58a2c 10%,var(--panel2))}


.half-century-band{position:relative;z-index:8;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:6px 4px;border-right:2px solid color-mix(in srgb,#4f8a4a 35%,var(--line));border-bottom:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,#6ea867 28%,var(--panel)),color-mix(in srgb,#6ea867 12%,var(--panel)))}
.half-century-band b{font-size:13px;line-height:1.2;color:#1f4a1b}
.half-century-band small{font-size:7px;line-height:1.25;color:color-mix(in srgb,#1f4a1b 65%,var(--muted))}
.prehistoric-band{background:linear-gradient(180deg,color-mix(in srgb,#88a67a 22%,var(--panel)),color-mix(in srgb,#88a67a 10%,var(--panel)))}
.guide-emperor-span{position:relative;z-index:7;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:5px 4px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,#7ea4d8 11%,var(--panel));cursor:pointer}
.guide-emperor-span.main{background:color-mix(in srgb,#7ea4d8 11%,var(--panel))}
.guide-emperor-span.north{width:50%;justify-self:end;background:color-mix(in srgb,#b8c8e4 18%,var(--panel));border-left:1px dashed color-mix(in srgb,var(--line) 75%,transparent)}
.guide-emperor-span small{font-size:7px;line-height:1.15;color:var(--muted)}
.guide-emperor-span b{font-size:10px;line-height:1.28;color:var(--text)}
.guide-emperor-span span{font-size:6.8px;line-height:1.2;color:var(--muted);margin-top:3px}
.guide-emperor-span em{font-style:normal;font-size:6.8px;line-height:1.2;color:var(--muted);margin-top:3px}
.reference-layout-sheet>.emperor-head{background:color-mix(in srgb,#7ea4d8 10%,var(--panel2))}
.reference-layout-sheet>.date-head{left:72px!important}
.reference-layout-sheet .guide-date{left:72px!important}

/* v6.0.6 STEP 6 — ONLY: show the 50-year green band on smartphone */
@media(max-width:700px){
  .v6-sheet{
    grid-template-columns:48px 76px minmax(0,1fr)!important;
    min-width:100%!important;
    width:100%!important;
    max-width:100%!important;
  }
  .v6-sheet>.half-century-band{
    display:flex!important;
    grid-column:1!important;
    width:auto!important;
    min-width:0!important;
    position:relative!important;
    left:auto!important;
    z-index:25!important;
    background:linear-gradient(180deg,#dcebd6,#c8dfc1)!important;
    border-right:2px solid #5d8f52!important;
    border-bottom:1px solid #8fad85!important;
    padding:4px 2px!important;
    color:#285123!important;
  }
  .v6-sheet>.half-century-band b{
    font-size:13px!important;
    line-height:1.15!important;
    color:#285123!important;
  }
  .v6-sheet>.half-century-band small{
    font-size:7px!important;
    line-height:1.2!important;
    color:#4c7047!important;
    writing-mode:vertical-rl;
    margin-top:4px;
  }
  .v6-sheet>.date-head{
    display:block!important;
    grid-column:2!important;
    left:48px!important;
    width:auto!important;
  }
  .v6-sheet .guide-date{
    grid-column:2!important;
    left:48px!important;
    width:auto!important;
    min-width:0!important;
  }
  .v6-sheet>.mobile-core-head{
    grid-column:3!important;
  }
  .v5-mobile-core-cell{
    grid-column:3!important;
  }
}


/* v6.0.7 STEP 7 — ONLY: smartphone columns = 50y | year | gengo | emperor | current content */
@media(max-width:700px){
  .v6-timeline .timeline-sheet-scroll{
    overflow-x:hidden!important;
    overscroll-behavior-x:none!important;
    width:100%!important;
  }
  .v6-sheet{
    grid-template-columns:42px 58px 72px 88px minmax(0,1fr)!important;
    min-width:100%!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* 50-year green band */
  .v6-sheet>.half-century-band{
    display:flex!important;
    grid-column:1!important;
    width:auto!important;
    min-width:0!important;
  }

  /* year */
  .v6-sheet>.date-head{
    display:block!important;
    grid-column:2!important;
    left:42px!important;
    width:auto!important;
    min-width:0!important;
    padding:7px 2px!important;
    font-size:9px!important;
    text-align:center!important;
  }
  .v6-sheet .guide-date{
    display:block!important;
    grid-column:2!important;
    left:42px!important;
    width:auto!important;
    min-width:0!important;
    padding:7px 3px!important;
    text-align:center!important;
  }
  .v6-sheet .guide-date b{
    font-size:11px!important;
    line-height:1.25!important;
  }
  .v6-sheet .guide-date small{
    display:none!important;
  }

  /* gengo: independent vertical band immediately after year */
  .v6-sheet>.gengo-head{
    display:block!important;
    grid-column:3!important;
    position:sticky!important;
    top:0!important;
    z-index:32!important;
    width:auto!important;
    min-width:0!important;
    padding:7px 2px!important;
    font-size:9px!important;
    text-align:center!important;
    background:color-mix(in srgb,#b58a2c 12%,var(--panel2))!important;
  }
  .v6-sheet>.guide-gengo-band{
    display:flex!important;
    grid-column:3!important;
    width:auto!important;
    min-width:0!important;
    position:relative!important;
    left:auto!important;
    z-index:20!important;
    padding:4px 2px!important;
  }
  .v6-sheet>.guide-gengo-band b{
    font-size:10px!important;
    line-height:1.25!important;
    overflow-wrap:anywhere;
  }
  .v6-sheet>.guide-gengo-band small{
    font-size:6.5px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-gengo-band span{
    font-size:6px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-gengo-band.court-south,
  .v6-sheet>.guide-gengo-band.court-north{
    width:50%!important;
  }

  /* emperor: independent vertical band immediately after gengo */
  .v6-sheet>.emperor-head{
    display:block!important;
    grid-column:4!important;
    position:sticky!important;
    top:0!important;
    z-index:32!important;
    width:auto!important;
    min-width:0!important;
    padding:7px 2px!important;
    font-size:9px!important;
    text-align:center!important;
    background:color-mix(in srgb,#7ea4d8 12%,var(--panel2))!important;
  }
  .v6-sheet>.guide-emperor-span{
    display:flex!important;
    grid-column:4!important;
    width:auto!important;
    min-width:0!important;
    position:relative!important;
    left:auto!important;
    z-index:21!important;
    padding:4px 2px!important;
  }
  .v6-sheet>.guide-emperor-span b{
    font-size:10px!important;
    line-height:1.25!important;
    overflow-wrap:anywhere;
  }
  .v6-sheet>.guide-emperor-span small{
    font-size:6.5px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-emperor-span span,
  .v6-sheet>.guide-emperor-span em{
    font-size:6px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-emperor-span.north{
    width:50%!important;
    justify-self:end!important;
  }

  /* existing contents stay at the right, still within one screen */
  .v6-sheet>.mobile-core-head{
    grid-column:5!important;
    width:auto!important;
    min-width:0!important;
    padding:7px 5px!important;
    font-size:9px!important;
  }
  .v5-mobile-core-cell{
    grid-column:5!important;
    width:auto!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  /* Gengo and emperor are now independent columns, so don't duplicate them in the right-hand mobile content. */
  .v5-mobile-core-cell>.mobile-gengo,
  .v5-mobile-core-cell>.mobile-emperor{
    display:none!important;
  }
}
@media(max-width:700px){
  .v6-sheet>.desktop-core-head.gengo-head{display:block!important;grid-column:3!important}
  .v6-sheet>.desktop-core-head.emperor-head{display:block!important;grid-column:4!important}
}

/* v6.0.8 — emperor/gengo completeness + Nanbokucho split */
.guide-emperor-span.south{
  width:50%;
  justify-self:start;
  border-right:1px dashed color-mix(in srgb,var(--line) 75%,transparent);
  background:color-mix(in srgb,#d6a8a8 16%,var(--panel));
}
.guide-emperor-span.north{
  width:50%;
  justify-self:end;
  background:color-mix(in srgb,#a9bddc 18%,var(--panel));
}
.emperor-historicity-note{
  display:block;
  margin-top:3px;
  font-style:normal;
  font-size:6.5px;
  line-height:1.2;
  color:var(--muted);
}
@media(max-width:700px){
  .v6-sheet>.guide-emperor-span.south{
    width:50%!important;
    justify-self:start!important;
  }
  .v6-sheet>.guide-emperor-span.north{
    width:50%!important;
    justify-self:end!important;
  }
  .v6-sheet>.guide-emperor-span.south b,
  .v6-sheet>.guide-emperor-span.north b{
    font-size:8px!important;
    line-height:1.2!important;
  }
  .v6-sheet>.guide-emperor-span.south small,
  .v6-sheet>.guide-emperor-span.north small{
    font-size:5.7px!important;
  }
  .v6-sheet>.guide-emperor-span.south span,
  .v6-sheet>.guide-emperor-span.north span{
    font-size:5.5px!important;
  }
  .v6-sheet>.guide-emperor-span .emperor-historicity-note{
    font-size:5.6px!important;
    line-height:1.15!important;
  }
}

/* v6.0.11 STEP 11 — specification item 3 only: 「50年帯」 */
.half-century-band{
  background:linear-gradient(180deg,#dcebd6,#c8dfc1)!important;
  border-right:2px solid #5d8f52!important;
  border-bottom:2px solid #7ea674!important;
}
.half-century-band b{font-weight:900!important;color:#285123!important}
.half-century-band small{color:#4c7047!important}

/* v6.0.13 STEP 13 — 元号列 only */
.guide-gengo-band.gengo-short small,
.guide-gengo-band.gengo-short span,
.guide-gengo-band.gengo-very-short small,
.guide-gengo-band.gengo-very-short span{display:none!important}
.guide-gengo-band.gengo-short,
.guide-gengo-band.gengo-very-short{padding:0 2px!important;justify-content:center!important;min-height:0!important}
.guide-gengo-band.gengo-short b{font-size:9px!important;line-height:1.05!important}
.guide-gengo-band.gengo-very-short b{font-size:8px!important;line-height:1!important;writing-mode:horizontal-tb!important}
.guide-gengo-band.gengo-none{background:color-mix(in srgb,var(--muted) 5%,var(--panel));border-right:1px dashed var(--line);color:var(--muted)}
.guide-gengo-band.gengo-none b{font-size:8px;color:var(--muted);font-weight:700}
@media(max-width:700px){
  .v6-sheet>.guide-gengo-band.gengo-short b{font-size:8px!important}
  .v6-sheet>.guide-gengo-band.gengo-very-short b{font-size:7px!important}
  .v6-sheet>.guide-gengo-band.gengo-none b{font-size:7px!important;line-height:1.05!important}
}


/* v6.0.14 STEP 14 — 南北朝期の元号だけを一時的に左右分割 */
.gengo-court-split-guide{
  position:relative;
  z-index:5;
  pointer-events:none;
  background:linear-gradient(90deg,
    color-mix(in srgb,#8c6b1f 4%,transparent) 0 50%,
    color-mix(in srgb,#5d7da8 4%,transparent) 50% 100%);
}
.gengo-court-split-guide::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  border-left:1px dashed color-mix(in srgb,var(--text) 28%,var(--line));
}
.gengo-court-split-guide>span{
  position:sticky;
  top:29px;
  display:block;
  width:50%;
  padding:2px 1px;
  font-size:6.5px;
  line-height:1.1;
  font-weight:900;
  text-align:center;
  color:var(--muted);
  background:color-mix(in srgb,var(--panel) 88%,transparent);
}
.gengo-court-split-guide>.south-label{float:left;color:#705313}
.gengo-court-split-guide>.north-label{float:right;color:#4a678d}
.guide-gengo-band.court-south{
  width:50%;
  justify-self:start;
  border-right:1px solid color-mix(in srgb,#8c6b1f 32%,var(--line));
}
.guide-gengo-band.court-north{
  width:50%;
  justify-self:end;
  border-left:1px solid color-mix(in srgb,#5d7da8 32%,var(--line));
}
@media(max-width:700px){
  .v6-sheet>.gengo-court-split-guide{display:block!important;grid-column:3!important;width:auto!important;min-width:0!important}
  .v6-sheet>.gengo-court-split-guide>span{top:25px;font-size:5.5px;padding:1px 0}
}

/* v6.0.15 STEP 15 — ONLY: 天皇列の在位帯を読みやすく固定 */
.guide-emperor-span.short-reign{padding:1px 2px;justify-content:center;overflow:hidden}
.guide-emperor-span.short-reign>small{display:none}
.guide-emperor-span.short-reign>b{font-size:8px!important;line-height:1!important;white-space:nowrap}
.guide-emperor-span.short-reign>span{font-size:5.8px!important;line-height:1!important;margin-top:1px!important;white-space:nowrap}
@media(max-width:700px){
  .v6-sheet>.guide-emperor-span.short-reign{padding:1px!important}
  .v6-sheet>.guide-emperor-span.short-reign>b{font-size:7.5px!important;line-height:1!important}
  .v6-sheet>.guide-emperor-span.short-reign>span{font-size:5.2px!important;line-height:1!important;white-space:nowrap!important}
}

/* v6.0.17 STEP 17 — specification item 9 only: 古代天皇の注記 */
.emperor-historicity-note{
  display:block;
  margin-top:3px;
  padding-top:3px;
  border-top:1px dotted color-mix(in srgb,var(--line) 75%,transparent);
  font-style:normal;
  font-size:6.5px;
  line-height:1.25;
  color:var(--muted);
}
.emperor-historicity-note.chronology-note{
  color:color-mix(in srgb,var(--muted) 86%,#7b6226);
}
@media(max-width:700px){
  .v6-sheet>.guide-emperor-span .emperor-historicity-note{
    font-size:5.7px!important;
    line-height:1.18!important;
    padding-top:2px!important;
  }
}

/* v6.0.18 STEP 18 — specification item 10 only: 南北朝期の天皇 */
.emperor-nanbokucho-guide{
  position:relative;
  z-index:5;
  pointer-events:none;
  display:grid;
  grid-template-columns:1fr 1fr;
  min-width:0;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  background:linear-gradient(90deg,
    color-mix(in srgb,#d6a8a8 12%,transparent) 0 50%,
    color-mix(in srgb,#a9bddc 14%,transparent) 50% 100%);
}
.emperor-nanbokucho-guide::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  border-left:1px dashed color-mix(in srgb,var(--text) 32%,var(--line));
}
.emperor-nanbokucho-guide>span{
  align-self:start;
  position:sticky;
  top:29px;
  z-index:1;
  padding:2px 1px;
  text-align:center;
  font-size:6.5px;
  line-height:1.15;
  font-weight:900;
  background:color-mix(in srgb,var(--panel) 90%,transparent);
}
.emperor-nanbokucho-guide .south-label{color:#8a4242}
.emperor-nanbokucho-guide .north-label{color:#415f91}
.guide-emperor-span.dual-claim-left{
  width:50%;
  justify-self:start;
  border-right:1px dashed color-mix(in srgb,var(--line) 75%,transparent);
}
.guide-emperor-span.north.precursor{
  width:50%;
  justify-self:end;
  background:color-mix(in srgb,#a9bddc 15%,var(--panel));
}
@media(max-width:700px){
  .v6-sheet>.emperor-nanbokucho-guide{display:grid!important;grid-column:4!important}
  .emperor-nanbokucho-guide>span{top:25px;font-size:5.4px}
  .v6-sheet>.guide-emperor-span.dual-claim-left{width:50%!important;justify-self:start!important}
  .v6-sheet>.guide-emperor-span.north.precursor{width:50%!important;justify-self:end!important}
}


/* v6.0.19 STEP 19 — independent shogun lane only */
.guide-shogun-band{
  position:relative;z-index:7;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;padding:5px 4px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  background:color-mix(in srgb,#6f6658 10%,var(--panel));color:var(--text);cursor:pointer;overflow:hidden;
}
.guide-shogun-band small{font-size:7px;line-height:1.15;color:var(--muted)}
.guide-shogun-band b{font-size:10px;line-height:1.25}
.guide-shogun-band span{font-size:6.8px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-shogun-band em{font-style:normal;font-size:6.5px;line-height:1.2;color:var(--muted);margin-top:2px}
.guide-shogun-band.short-tenure{padding:1px 3px}
.guide-shogun-band.short-tenure small{display:none}
.guide-shogun-band.short-tenure b{font-size:8px}
.guide-shogun-band.short-tenure span{font-size:5.8px;margin-top:0}
.reference-layout-sheet>.shogun-head{background:color-mix(in srgb,#6f6658 10%,var(--panel2))}
@media(max-width:700px){
  .v6-sheet>.guide-support-band,.v6-sheet>.guide-shogun-band,.v6-sheet>.guide-tenkabito-band{display:none!important}
}


/* v6.0.20 STEP 20 — supporting offices grouped into 朝廷政務 / 幕政担当 */
.reference-layout-sheet>.court-office-head{background:color-mix(in srgb,#8c6fb1 11%,var(--panel2))}
.reference-layout-sheet>.bakufu-office-head{background:color-mix(in srgb,#7b674c 11%,var(--panel2))}
.guide-support-band{
  position:relative;z-index:13;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;box-sizing:border-box;overflow:hidden;min-width:0;padding:4px 3px;
  border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;
  color:var(--text);cursor:pointer;background:var(--panel)
}
.guide-support-band small{font-size:6.8px;line-height:1.15;color:var(--muted);font-weight:800}
.guide-support-band b{font-size:9px;line-height:1.25;overflow-wrap:anywhere}
.guide-support-band span{font-size:6.2px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-support-band em{font-style:normal;font-size:6.2px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-support-band.short-tenure{padding:1px 2px}
.guide-support-band.short-tenure small{font-size:6px}.guide-support-band.short-tenure b{font-size:7.8px}.guide-support-band.short-tenure span{font-size:5.5px;margin-top:0}
/* 朝廷政務: 上皇・院 / 摂政 / 関白 are parallel sub-lanes inside one column. */
.guide-support-band.slot-third{width:33.333%;justify-self:start}
.guide-support-band.slot-third.slot-first{margin-left:0}
.guide-support-band.slot-third.slot-second{margin-left:33.333%}
.guide-support-band.slot-third.slot-third-pos{margin-left:66.666%}
.guide-support-band.court-insei{background:color-mix(in srgb,#8c6fb1 16%,var(--panel))}
.guide-support-band.court-sessho{background:color-mix(in srgb,#d5aa35 15%,var(--panel))}
.guide-support-band.court-kampaku{background:color-mix(in srgb,#497eb7 14%,var(--panel))}
/* 幕政担当: 執権 / 得宗 may coexist; 管領・江戸幕政 use the full lane. */
.guide-support-band.slot-half{width:50%;justify-self:start}
.guide-support-band.slot-half.slot-first{margin-left:0}
.guide-support-band.slot-half.slot-second-half{margin-left:50%}
.guide-support-band.slot-full{width:100%;justify-self:stretch;margin-left:0}
.guide-support-band.bakufu-regent{background:color-mix(in srgb,#ba3e48 13%,var(--panel))}
.guide-support-band.bakufu-tokusou{background:color-mix(in srgb,#8d2430 16%,var(--panel))}
.guide-support-band.bakufu-kanrei{background:color-mix(in srgb,#5c9bb6 15%,var(--panel))}
.guide-support-band.bakufu-edo{background:color-mix(in srgb,#8b6847 14%,var(--panel))}
@media(max-width:700px){
  .v6-sheet>.guide-support-band{display:none!important}
}


/* v6.0.21 STEP 21 — 天下人 / 政権担当者 */
.guide-tenkabito-band{
  position:relative;z-index:7;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  padding:5px 4px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  background:color-mix(in srgb,#a66a2c 11%,var(--panel));color:var(--text);cursor:pointer;overflow:hidden;
}
.guide-tenkabito-band small{font-size:7px;line-height:1.15;color:#8a5420}
.guide-tenkabito-band b{font-size:10px;line-height:1.25}
.guide-tenkabito-band span{font-size:6.8px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-tenkabito-band em{font-style:normal;font-size:6.5px;line-height:1.2;color:var(--muted);margin-top:2px}
.reference-layout-sheet>.government-head{background:color-mix(in srgb,#a66a2c 10%,var(--panel2))}


/* v6.0.22 STEP 22 — independent 内閣総理大臣 lane */
.reference-layout-sheet>.prime-minister-head{
  background:color-mix(in srgb,#294f7a 12%,var(--panel2));
  color:var(--text);
}
.guide-prime-minister-band{
  position:relative;z-index:8;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;box-sizing:border-box;overflow:hidden;min-width:0;padding:4px 3px;
  border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;
  background:color-mix(in srgb,#294f7a 11%,var(--panel));color:var(--text);cursor:pointer;
}
.guide-prime-minister-band small{font-size:6.8px;line-height:1.15;color:#294f7a;font-weight:850}
.guide-prime-minister-band b{font-size:9.5px;line-height:1.23;overflow-wrap:anywhere}
.guide-prime-minister-band span{font-size:6.2px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-prime-minister-band em{font-style:normal;font-size:6.2px;line-height:1.15;color:var(--muted);margin-top:2px}
.guide-prime-minister-band.short-tenure{padding:1px 2px}
.guide-prime-minister-band.short-tenure small{font-size:5.8px}
.guide-prime-minister-band.short-tenure b{font-size:7.5px}
.guide-prime-minister-band.short-tenure span{font-size:5.4px;margin-top:0}
@media(max-width:700px){
  /* Mobile keeps the first four vertical lanes readable; PM remains a dedicated labeled line in the mobile context column. */
  .v6-sheet>.guide-prime-minister-band{display:none!important}
}

/* v6.0.23 STEP 23 — specification item 15 only: 制度上トップ / 政治主導者を完全分離 */
.reference-layout-sheet>.institutional-top-head{
  background:color-mix(in srgb,#4b6078 12%,var(--panel2));
  color:var(--text);
}
.guide-institutional-top-band{
  position:relative;z-index:8;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;box-sizing:border-box;overflow:hidden;min-width:0;padding:4px 3px;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-left:3px solid #4b6078;
  background:color-mix(in srgb,#4b6078 8%,var(--panel));color:var(--text);
}
.guide-institutional-top-band small{font-size:6.8px;line-height:1.15;color:#4b6078;font-weight:900}
.guide-institutional-top-band b{font-size:9.5px;line-height:1.23;overflow-wrap:anywhere}
.guide-institutional-top-band em{font-style:normal;font-size:6.4px;line-height:1.15;color:#4b6078;font-weight:800;margin-top:2px}
.guide-institutional-top-band span{font-size:6.1px;line-height:1.15;color:var(--muted);margin-top:2px}
.mobile-institutional-top{border-left:3px solid #4b6078!important}
.mobile-institutional-top>small{color:#4b6078!important;font-weight:900!important}
@media(max-width:700px){
  /* Keep the fixed 50年帯｜西暦｜元号｜天皇 mobile columns unchanged; show 制度上トップ inside the context column only. */
  .v6-sheet>.guide-institutional-top-band{display:none!important}
}

/* v6.0.25 STEP 25 — political leadership may be plural / distributed */
.power-relation-chip{display:inline-flex;align-items:center;width:max-content;max-width:100%;margin:3px 3px 1px 0;padding:2px 6px;border:1px solid var(--line);border-radius:999px;background:var(--panel2);color:var(--muted);font-size:7px;font-weight:900;line-height:1.2;white-space:normal}
.power-inline.is-parallel{border-top:1px dashed color-mix(in srgb,var(--line) 85%,transparent)}
.power-inline.is-parallel:first-child{border-top:0}
.mobile-leader .power-relation-chip{font-size:7px;margin-top:1px}
.snapshot-power .power-relation-chip{margin-left:4px;vertical-align:middle}

/* v6.0.27 STEP 27 — specification item 19 only: 政治主導者の役割別固定色 */
.v5-timeline .power-type-legend{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--line);
  border-bottom:0;
  background:var(--panel);
}
.v5-timeline .power-type-legend span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  border-radius:999px;
  padding:3px 7px;
  border:1px solid currentColor;
  font-size:7px;
  font-weight:900;
  line-height:1.25;
  background:var(--panel);
}
.v5-timeline .power-type-legend i{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:currentColor;
}
.power-role-chip.power-type-court,.v5-timeline .power-type-legend .power-type-court{color:#2f7d4a!important;background:color-mix(in srgb,#2f7d4a 8%,var(--panel))!important}
.power-role-chip.power-type-sessho,.v5-timeline .power-type-legend .power-type-sessho{color:#b78900!important;background:color-mix(in srgb,#b78900 9%,var(--panel))!important}
.power-role-chip.power-type-kampaku,.v5-timeline .power-type-legend .power-type-kampaku{color:#2f66b0!important;background:color-mix(in srgb,#2f66b0 8%,var(--panel))!important}
.power-role-chip.power-type-insei,.v5-timeline .power-type-legend .power-type-insei{color:#7a4aa8!important;background:color-mix(in srgb,#7a4aa8 8%,var(--panel))!important}
.power-role-chip.power-type-regent,.v5-timeline .power-type-legend .power-type-regent{color:#b3262e!important;background:color-mix(in srgb,#b3262e 8%,var(--panel))!important}
.power-role-chip.power-type-kanrei,.v5-timeline .power-type-legend .power-type-kanrei{color:#2f8fa3!important;background:color-mix(in srgb,#2f8fa3 8%,var(--panel))!important}
.power-role-chip.power-type-edo,.v5-timeline .power-type-legend .power-type-edo{color:#8b5a2b!important;background:color-mix(in srgb,#8b5a2b 9%,var(--panel))!important}
.power-role-chip.power-type-shogun,.v5-timeline .power-type-legend .power-type-shogun{color:#4a5560!important;background:color-mix(in srgb,#4a5560 9%,var(--panel))!important}
.power-role-chip.power-type-prime-minister,.v5-timeline .power-type-legend .power-type-prime-minister{color:#173d78!important;background:color-mix(in srgb,#173d78 8%,var(--panel))!important}
.power-role-chip.power-type-emperor,.v5-timeline .power-type-legend .power-type-emperor{color:#a36d00!important;background:color-mix(in srgb,#a36d00 10%,var(--panel))!important}
.power-role-chip.power-type-other,.v5-timeline .power-type-legend .power-type-other{color:#68717b!important;background:color-mix(in srgb,#68717b 8%,var(--panel))!important}

/* The same role color must be visible in every political-leader surface. */
.guide-power-band.power-type-other{border-left-color:#68717b;background:color-mix(in srgb,#68717b 6%,var(--panel))}
.mobile-leader.power-type-court{border-left-color:#2f7d4a;color:#2f7d4a;background:color-mix(in srgb,#2f7d4a 6%,var(--panel))}
.mobile-leader.power-type-sessho{border-left-color:#b78900;color:#b78900;background:color-mix(in srgb,#b78900 7%,var(--panel))}
.mobile-leader.power-type-kampaku{border-left-color:#2f66b0;color:#2f66b0;background:color-mix(in srgb,#2f66b0 6%,var(--panel))}
.mobile-leader.power-type-insei{border-left-color:#7a4aa8;color:#7a4aa8;background:color-mix(in srgb,#7a4aa8 6%,var(--panel))}
.mobile-leader.power-type-regent{border-left-color:#b3262e;color:#b3262e;background:color-mix(in srgb,#b3262e 6%,var(--panel))}
.mobile-leader.power-type-kanrei{border-left-color:#2f8fa3;color:#2f8fa3;background:color-mix(in srgb,#2f8fa3 6%,var(--panel))}
.mobile-leader.power-type-edo{border-left-color:#8b5a2b;color:#8b5a2b;background:color-mix(in srgb,#8b5a2b 7%,var(--panel))}
.mobile-leader.power-type-shogun{border-left-color:#4a5560;color:#4a5560;background:color-mix(in srgb,#4a5560 7%,var(--panel))}
.mobile-leader.power-type-prime-minister{border-left-color:#173d78;color:#173d78;background:color-mix(in srgb,#173d78 6%,var(--panel))}
.mobile-leader.power-type-emperor{border-left-color:#a36d00;color:#a36d00;background:color-mix(in srgb,#a36d00 8%,var(--panel))}
.mobile-leader.power-type-other{border-left-color:#68717b;color:#68717b;background:color-mix(in srgb,#68717b 6%,var(--panel))}

@media(max-width:700px){
  .v5-timeline .power-type-legend{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:8px}
  .v5-timeline .power-type-legend span{flex:0 0 auto;font-size:7px}
}

/* v6.0.28 STEP 28 — 政治体制 is a period lane, never a person lane */
.reference-layout-sheet>.guide-regime-band{
  position:relative;
  z-index:10;
  align-self:stretch;
  justify-self:start;
  border-left:4px solid #557a5a;
  background:color-mix(in srgb,#557a5a 9%,var(--panel));
}
.reference-layout-sheet>.guide-regime-band.regime-parallel{
  border-right:1px dashed color-mix(in srgb,#557a5a 55%,var(--line));
}
.reference-layout-sheet>.guide-regime-band.short-regime{
  padding:2px 3px;
}
.reference-layout-sheet>.guide-regime-band.short-regime small{
  display:none;
}
.reference-layout-sheet>.guide-regime-band.short-regime b{
  font-size:8px;
  line-height:1.15;
}
.reference-layout-sheet>.guide-regime-band.short-regime span{
  font-size:6px;
  line-height:1.1;
}

/* =========================================================
   v6.0.31 STEP 31 — smartphone-first timeline only
   Keep the essential chronology readable without horizontal scrolling:
   50年帯 | 西暦 | 元号 | 天皇
   Other information remains accessible from 「この年の日本」.
   ========================================================= */
@media(max-width:700px){
  .v6-timeline{
    margin-left:-12px;
    margin-right:-12px;
  }
  .v6-timeline .guidebook-source-strip,
  .v6-timeline .guidebook-rule-note,
  .v6-timeline .power-type-legend{
    margin-left:12px;
    margin-right:12px;
  }
  .v6-timeline .timeline-sheet-scroll{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
    overscroll-behavior-x:none!important;
  }
  .v6-sheet{
    grid-template-columns:44px 56px minmax(82px,.9fr) minmax(110px,1.1fr)!important;
    min-width:100%!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* Only the four essential chronology lanes stay in the mobile sheet. */
  .v6-sheet>.mobile-core-head,
  .v6-sheet>.v5-mobile-core-cell,
  .v6-sheet>.v5-detail-head,
  .v6-sheet>.v5-detail-cell,
  .v6-sheet>.guide-support-band,
  .v6-sheet>.guide-shogun-band,
  .v6-sheet>.guide-tenkabito-band,
  .v6-sheet>.guide-prime-minister-band,
  .v6-sheet>.guide-regime-band,
  .v6-sheet>.guide-institutional-top-band,
  .v6-sheet>.guide-power-band,
  .v6-sheet>.desktop-core-head:not(.era-head):not(.gengo-head):not(.emperor-head){
    display:none!important;
  }

  .v6-sheet>.era-head{
    display:block!important;
    grid-column:1!important;
    left:0!important;
    width:auto!important;
    min-width:0!important;
    padding:8px 2px!important;
    font-size:9px!important;
    line-height:1.2!important;
  }
  .v6-sheet>.date-head{
    display:block!important;
    grid-column:2!important;
    left:44px!important;
    width:auto!important;
    min-width:0!important;
    padding:8px 2px!important;
    font-size:10px!important;
  }
  .v6-sheet>.gengo-head{
    display:block!important;
    grid-column:3!important;
    width:auto!important;
    min-width:0!important;
    padding:8px 3px!important;
    font-size:10px!important;
  }
  .v6-sheet>.emperor-head{
    display:block!important;
    grid-column:4!important;
    width:auto!important;
    min-width:0!important;
    padding:8px 3px!important;
    font-size:10px!important;
  }

  .v6-sheet>.half-century-band{
    display:flex!important;
    grid-column:1!important;
    width:auto!important;
    min-width:0!important;
  }
  .v6-sheet .guide-date{
    display:block!important;
    grid-column:2!important;
    left:44px!important;
    width:auto!important;
    min-width:0!important;
    padding:6px 2px!important;
    text-align:center!important;
  }
  .v6-sheet .guide-date b{
    font-size:12px!important;
    line-height:1.25!important;
  }
  .v6-sheet .guide-date small{
    display:none!important;
  }

  .v6-sheet>.guide-gengo-band,
  .v6-sheet>.gengo-court-split-guide{
    display:flex!important;
    grid-column:3!important;
    min-width:0!important;
  }
  .v6-sheet>.guide-gengo-band b{
    font-size:10px!important;
    line-height:1.2!important;
  }
  .v6-sheet>.guide-gengo-band small,
  .v6-sheet>.guide-gengo-band span{
    font-size:7.5px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-gengo-band.gengo-short b,
  .v6-sheet>.guide-gengo-band.gengo-very-short b,
  .v6-sheet>.guide-gengo-band.gengo-none b{
    font-size:9px!important;
    line-height:1.1!important;
  }

  .v6-sheet>.guide-emperor-span,
  .v6-sheet>.emperor-nanbokucho-guide{
    display:flex!important;
    grid-column:4!important;
    min-width:0!important;
  }
  .v6-sheet>.emperor-nanbokucho-guide{
    display:grid!important;
  }
  .v6-sheet>.guide-emperor-span b,
  .v6-sheet>.guide-emperor-span.short-reign>b,
  .v6-sheet>.guide-emperor-span.south b,
  .v6-sheet>.guide-emperor-span.north b{
    font-size:10px!important;
    line-height:1.15!important;
  }
  .v6-sheet>.guide-emperor-span small,
  .v6-sheet>.guide-emperor-span span,
  .v6-sheet>.guide-emperor-span em,
  .v6-sheet>.guide-emperor-span.short-reign>span{
    font-size:7.5px!important;
    line-height:1.1!important;
  }
  .v6-sheet>.guide-emperor-span .emperor-historicity-note{
    font-size:7px!important;
    line-height:1.15!important;
  }

  /* Tap targets remain usable even though the timeline itself is compact. */
  .v6-sheet .guide-date,
  .v6-sheet>.guide-gengo-band,
  .v6-sheet>.guide-emperor-span{
    touch-action:manipulation;
  }
}

/* v6.0.32 STEP 32 — continuous vertical lane for 政治主導者 */
.guide-power-band.short-power{padding:1px 2px;justify-content:center;min-height:0}
.guide-power-band.short-power>small{display:none}
.guide-power-band.short-power>b{font-size:7.8px!important;line-height:1!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guide-power-band.short-power>.power-role-chip,.guide-power-band.short-power>.power-relation-chip{display:none!important}
.guide-power-band.short-power>span{font-size:5.5px!important;line-height:1!important;margin-top:1px!important;white-space:nowrap}
.guide-power-band.short-power>em{display:none}


/* =========================================================
   v6.0.34 STEP 34 — compact event hierarchy, no giant cards
   The synchronized sheet is a chronology first: event title first,
   category/importance second, full explanation in the detail drawer.
   ========================================================= */
.guidebook-sheet .guide-cell{
  padding:3px 5px;
}
.guidebook-sheet .sheet-event{
  display:grid;
  grid-template-columns:14px minmax(0,1fr);
  column-gap:4px;
  align-items:start;
  padding:5px 3px 5px 2px;
  border:0;
  border-left:2px solid transparent;
  border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  min-height:0;
}
.guidebook-sheet .sheet-event:last-child{border-bottom:0}
.guidebook-sheet .sheet-event .event-icon{
  position:static;
  grid-column:1;
  grid-row:1 / span 2;
  width:14px;
  padding-top:1px;
  font-size:9px;
  line-height:1.25;
  text-align:center;
}
.guidebook-sheet .sheet-event strong{
  grid-column:2;
  display:block;
  margin:0;
  font-size:11px;
  font-weight:800;
  line-height:1.42;
  overflow-wrap:anywhere;
}
.guidebook-sheet .sheet-event small{
  grid-column:2;
  display:block;
  margin-top:1px;
  font-size:8.2px;
  line-height:1.25;
  color:var(--muted);
}
.guidebook-sheet .sheet-event .sheet-flow{display:none!important}
.guidebook-sheet .sheet-event.importance-trunk{
  border-left-width:3px;
  background:color-mix(in srgb,var(--accent) 4%,transparent);
}
.guidebook-sheet .sheet-event.importance-trunk strong{
  font-size:11.8px;
  font-weight:950;
}
.guidebook-sheet .sheet-event.importance-branch strong{
  font-size:11px;
  font-weight:800;
}
.guidebook-sheet .sheet-event.importance-leaf{
  opacity:.9;
}
.guidebook-sheet .sheet-event.importance-leaf strong{
  font-size:10.4px;
  font-weight:680;
}
.guidebook-sheet .sheet-event:hover,
.guidebook-sheet .sheet-event:focus-visible{
  background:color-mix(in srgb,var(--accent) 6%,var(--panel));
  outline:none;
}
.guidebook-sheet .sheet-more{
  margin-top:2px;
  padding:3px 4px;
  border-radius:4px;
  font-size:8.5px;
}

@media(max-width:700px){
  /* Detail lanes are hidden in the four-column smartphone timeline,
     but these sizes also apply when an individual field is shown. */
  .guidebook-sheet .sheet-event strong{font-size:11.5px}
  .guidebook-sheet .sheet-event.importance-trunk strong{font-size:12px}
  .guidebook-sheet .sheet-event.importance-leaf strong{font-size:10.8px}
  .guidebook-sheet .sheet-event small{font-size:8.5px}
}


/* v6.0.35 STEP35: selected-event causal highlighting only */
.guidebook-sheet .sheet-event.is-related.is-causal-cause{opacity:1!important;border-left-color:var(--warn);background:color-mix(in srgb,var(--warn) 8%,var(--panel))}
.guidebook-sheet .sheet-event.is-related.is-causal-result{opacity:1!important;border-left-color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--panel))}
.guidebook-sheet .sheet-event.is-related.is-causal-next{opacity:1!important;border-left-color:var(--accent2);background:color-mix(in srgb,var(--accent2) 8%,var(--panel))}
.tree-node.is-causal-cause .tree-main{border-color:color-mix(in srgb,var(--warn) 65%,var(--line))}
.tree-node.is-causal-result .tree-main{border-color:color-mix(in srgb,var(--good) 65%,var(--line))}
.tree-node.is-causal-next .tree-main{border-color:color-mix(in srgb,var(--accent2) 65%,var(--line))}
.causal-relation-section .relation-grid{gap:7px}
.relation-card.causal-card{position:relative;padding-left:62px;min-height:48px}
.relation-card.causal-card>span{position:absolute;left:7px;top:7px;display:inline-flex;align-items:center;justify-content:center;min-width:45px;border:1px solid var(--line);border-radius:999px;padding:3px 6px;font-size:8px;font-weight:950;background:var(--panel)}
.relation-card.causal-cause>span{color:var(--warn)}
.relation-card.causal-result>span{color:var(--good)}
.relation-card.causal-next>span{color:var(--accent2)}


/* =========================================================
   v6.0.38 STEP 37 — smartphone bottom detail panel
   Event detail stays in the current timeline view and opens from below.
   ========================================================= */
.primary-detail-section>h4{color:var(--accent2);font-weight:950}
@media(max-width:700px){
  body.drawer-open{overflow:hidden;overscroll-behavior:none}
  .timeline-drawer{
    top:auto!important;
    right:0!important;
    left:0!important;
    bottom:0!important;
    width:100vw!important;
    max-width:100vw!important;
    max-height:88dvh!important;
    border-left:0!important;
    border-radius:18px 18px 0 0!important;
    transform:translateY(105%)!important;
    box-shadow:0 -18px 50px rgba(0,0,0,.24)!important;
    overflow:hidden;
  }
  .timeline-drawer.open{transform:translateY(0)!important}
  .timeline-drawer-head{
    position:relative;
    flex:0 0 auto;
    padding:18px 14px 11px!important;
    background:var(--panel);
  }
  .timeline-drawer-head:before{
    content:"";
    position:absolute;
    top:6px;
    left:50%;
    transform:translateX(-50%);
    width:44px;
    height:4px;
    border-radius:99px;
    background:var(--line);
  }
  .timeline-drawer-head small{font-size:10px}
  .timeline-drawer-head b{font-size:15px;line-height:1.4}
  .timeline-drawer-body{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:12px 14px calc(28px + env(safe-area-inset-bottom))!important;
  }
  .primary-detail-sections>div,
  .primary-detail-section{scroll-margin-top:12px}
  .primary-detail-section h4{font-size:14px;line-height:1.45}
  .primary-detail-section p,
  .primary-detail-section li{font-size:14px;line-height:1.75}
  .timeline-drawer-backdrop{touch-action:none}
}


/* v6.0.38 STEP38: distinguish emperor / shogun / institutional top / regime / political leader */
.timeline-concept-guide{margin:8px 0 12px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 3%,var(--panel))}
.concept-guide-title{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:8px}.concept-guide-title b{font-size:13px}.concept-guide-title span{font-size:10px;color:var(--muted)}
.concept-guide-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.concept-guide-grid>div{min-width:0;padding:7px 8px;border-left:3px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:var(--panel2)}
.concept-guide-grid small{display:block;font-size:8px;color:var(--muted);font-weight:900}.concept-guide-grid b{display:block;font-size:11px;margin-top:1px}.concept-guide-grid p{margin:3px 0 0;font-size:9px;line-height:1.5;color:var(--muted)}
.snapshot-concept{position:relative;padding-top:20px!important}.snapshot-concept-tag{position:absolute;top:5px;right:6px;display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:1px 5px;background:var(--panel);font-size:8px;line-height:1.35;font-weight:900;color:var(--muted)}
.snapshot-concept-hint{display:block;margin-top:4px;font-size:8px!important;line-height:1.45!important;font-style:normal;color:var(--muted)}
.snapshot-power.snapshot-concept{padding-top:22px!important}
@media(max-width:700px){.timeline-concept-guide{margin:7px 0 10px;padding:9px 10px}.concept-guide-title b{font-size:14px}.concept-guide-title span{font-size:11px;line-height:1.45}.concept-guide-grid{grid-template-columns:1fr}.concept-guide-grid>div{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:8px;align-items:start;padding:7px 8px}.concept-guide-grid small{grid-column:1;font-size:10px}.concept-guide-grid b{grid-column:1;font-size:12px}.concept-guide-grid p{grid-column:2;grid-row:1 / span 2;margin:0;font-size:11px;line-height:1.5}.snapshot-concept-tag{font-size:9px}.snapshot-concept-hint{font-size:10px!important}}


/* Sheet view must be allowed to shrink to the phone viewport.
   Without this, the grid item's min-content width expands the whole timeline to ~900px
   even when the visible mobile lanes are only four columns. */
.master-timeline.display-sheet{min-width:0}
.master-timeline.display-sheet>.guidebook-timeline-shell{min-width:0;max-width:100%;width:100%}
.master-timeline.display-sheet .timeline-sheet-scroll{min-width:0;max-width:100%}

/* =========================================================
   v6.0.40 — screen-recording UX fix
   1) compress only the millennia-long prehistoric gaps
   2) prevent micro reign/era labels from overlapping
   3) keep the 4 essential lanes in iPhone landscape as well
   ========================================================= */
.prehistoric-summary-band{
  justify-content:flex-start!important;
  padding-top:8px!important;
  padding-bottom:8px!important;
  background:linear-gradient(180deg,color-mix(in srgb,#7aa06f 24%,var(--panel)),color-mix(in srgb,#7aa06f 10%,var(--panel)))!important;
}
.prehistoric-summary-band b{font-size:10px!important;line-height:1.2!important;word-break:keep-all}
.prehistoric-summary-band small{font-size:6.8px!important;writing-mode:vertical-rl;opacity:.8}
.guide-emperor-span.micro-reign,.guide-gengo-band.gengo-micro{padding:0!important;min-height:0!important;overflow:hidden!important}
.guide-emperor-span.micro-reign>* ,.guide-gengo-band.gengo-micro>*{display:none!important}
.guide-emperor-span.micro-reign:after,.guide-gengo-band.gengo-micro:after{
  content:"";display:block;width:72%;height:2px;min-height:2px;border-radius:999px;margin:auto;
}
.guide-emperor-span.micro-reign:after{background:#5577a7}
.guide-gengo-band.gengo-micro:after{background:#9a7323}

@media(max-width:950px){
  .v6-timeline{margin-left:-12px;margin-right:-12px}
  .v6-timeline .guidebook-source-strip,.v6-timeline .guidebook-rule-note,.v6-timeline .power-type-legend{margin-left:12px;margin-right:12px}
  .v6-timeline .timeline-sheet-scroll{width:100%!important;max-width:100%!important;overflow-x:hidden!important;overscroll-behavior-x:none!important}
  .v6-sheet{
    grid-template-columns:48px 64px minmax(92px,.9fr) minmax(124px,1.1fr)!important;
    min-width:100%!important;width:100%!important;max-width:100%!important;
  }
  .v6-sheet>.mobile-core-head,.v6-sheet>.v5-mobile-core-cell,.v6-sheet>.v5-detail-head,.v6-sheet>.v5-detail-cell,
  .v6-sheet>.guide-support-band,.v6-sheet>.guide-shogun-band,.v6-sheet>.guide-tenkabito-band,.v6-sheet>.guide-prime-minister-band,
  .v6-sheet>.guide-regime-band,.v6-sheet>.guide-institutional-top-band,.v6-sheet>.guide-power-band,
  .v6-sheet>.desktop-core-head:not(.era-head):not(.gengo-head):not(.emperor-head){display:none!important}
  .v6-sheet>.era-head{display:block!important;grid-column:1!important;left:0!important;width:auto!important;min-width:0!important;padding:7px 2px!important;font-size:9px!important}
  .v6-sheet>.date-head{display:block!important;grid-column:2!important;left:48px!important;width:auto!important;min-width:0!important;padding:7px 2px!important;font-size:10px!important}
  .v6-sheet>.gengo-head{display:block!important;grid-column:3!important;width:auto!important;min-width:0!important;padding:7px 3px!important;font-size:10px!important}
  .v6-sheet>.emperor-head{display:block!important;grid-column:4!important;width:auto!important;min-width:0!important;padding:7px 3px!important;font-size:10px!important}
  .v6-sheet>.half-century-band{display:flex!important;grid-column:1!important;width:auto!important;min-width:0!important}
  .v6-sheet .guide-date{display:block!important;grid-column:2!important;left:48px!important;width:auto!important;min-width:0!important;padding:5px 2px!important;text-align:center!important}
  .v6-sheet .guide-date b{font-size:12px!important;line-height:1.2!important}.v6-sheet .guide-date small{display:none!important}
  .v6-sheet>.guide-gengo-band,.v6-sheet>.gengo-court-split-guide{display:flex!important;grid-column:3!important;min-width:0!important}
  .v6-sheet>.guide-emperor-span,.v6-sheet>.emperor-nanbokucho-guide{display:flex!important;grid-column:4!important;min-width:0!important}
  .v6-sheet>.emperor-nanbokucho-guide{display:grid!important}
  .v6-sheet>.guide-gengo-band:not(.gengo-micro) b,.v6-sheet>.guide-emperor-span:not(.micro-reign) b{font-size:10px!important;line-height:1.15!important}
  .v6-sheet>.guide-gengo-band:not(.gengo-micro) small,.v6-sheet>.guide-gengo-band:not(.gengo-micro) span,
  .v6-sheet>.guide-emperor-span:not(.micro-reign) small,.v6-sheet>.guide-emperor-span:not(.micro-reign) span,.v6-sheet>.guide-emperor-span:not(.micro-reign) em{font-size:7.2px!important;line-height:1.1!important}
}

@media(max-width:950px) and (orientation:landscape){
  .timeline-hero{padding-top:8px!important;padding-bottom:8px!important}
  .timeline-hero p{display:none}
  .timeline-position{font-size:9px}
  .v6-timeline .guidebook-source-strip,.v6-timeline .guidebook-rule-note{font-size:9px!important;line-height:1.3!important}
}

/* =========================================================
   v6.0.41 — 100改善 P0-1 神武天皇以前の圧縮
   神武以前は50年帯を反復せず、旧石器・縄文・弥生の大区分で示す。
   ========================================================= */
.prehistory-period-band{
  min-height:0!important;
  padding:7px 2px!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  writing-mode:horizontal-tb!important;
}
.prehistory-period-band b{
  font-size:11px!important;
  line-height:1.15!important;
  writing-mode:horizontal-tb!important;
  word-break:keep-all!important;
}
.prehistory-period-band small{
  display:block!important;
  margin-top:3px!important;
  font-size:7px!important;
  line-height:1.15!important;
  writing-mode:horizontal-tb!important;
  white-space:normal!important;
}
.jimmu-transition-band{
  background:linear-gradient(180deg,color-mix(in srgb,#d5b54a 20%,var(--panel)),color-mix(in srgb,#d5b54a 8%,var(--panel)))!important;
  border-top:2px solid color-mix(in srgb,#b88b14 70%,var(--line))!important;
  padding:2px!important;
}
.jimmu-transition-band b{font-size:8px!important;line-height:1.05!important;word-break:keep-all!important}
.jimmu-transition-band small{font-size:6px!important;line-height:1.05!important;writing-mode:horizontal-tb!important}

/* =========================================================
   v6.0.42 — 100改善 P0-2 縦画面でも横スクロール
   スマホ縦画面でも、基本4列の右に政治・事件・世界史などを
   横スワイプで閲覧できるようにする。
   P0-3の固定列ルールは次STEPで整理する。
   ========================================================= */
.timeline-horizontal-hint{display:none}
@media(max-width:950px){
  .v6-timeline .timeline-sheet-scroll{
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain!important;
    touch-action:pan-x pan-y!important;
    scrollbar-width:thin;
  }
  .v6-timeline .timeline-sheet-scroll::-webkit-scrollbar{height:7px}
  .v6-timeline .timeline-sheet-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:99px}
  .v6-timeline .timeline-sheet-scroll::-webkit-scrollbar-track{background:color-mix(in srgb,var(--line) 35%,transparent)}

  /* Mobile horizontal sheet: essential chronology + combined government context + requested detail lanes. */
  .v6-sheet{
    --mobile-detail-count:9;
    grid-template-columns:48px 72px 116px 148px 244px repeat(var(--mobile-detail-count),180px)!important;
    width:max-content!important;
    min-width:max-content!important;
    max-width:none!important;
  }

  /* The mobile context column becomes the first horizontally-scrollable information lane. */
  .v6-sheet>.mobile-core-head{
    display:block!important;
    grid-column:5!important;
    position:sticky!important;
    top:0!important;
    z-index:31!important;
    padding:8px 10px!important;
    font-size:11px!important;
    text-align:left!important;
    background:color-mix(in srgb,var(--accent) 7%,var(--panel2))!important;
  }
  .v6-sheet>.v5-mobile-core-cell{
    display:grid!important;
    grid-column:5!important;
    width:auto!important;
    min-width:0!important;
    overflow:visible!important;
    gap:4px!important;
    padding:7px 8px!important;
    border-right:2px solid color-mix(in srgb,var(--accent) 24%,var(--line))!important;
    border-bottom:1px solid var(--line)!important;
    background:var(--panel)!important;
  }

  /* Event / world-history lanes are no longer removed on portrait phones. */
  .v6-sheet>.v5-detail-head,.v6-sheet>.v5-detail-cell{display:block!important}
  .v6-sheet>.v5-detail-head{position:sticky!important;top:0!important;z-index:29!important;font-size:11px!important;padding:8px 7px!important}
  .v6-sheet>.v5-detail-col-1{grid-column:6!important}
  .v6-sheet>.v5-detail-col-2{grid-column:7!important}
  .v6-sheet>.v5-detail-col-3{grid-column:8!important}
  .v6-sheet>.v5-detail-col-4{grid-column:9!important}
  .v6-sheet>.v5-detail-col-5{grid-column:10!important}
  .v6-sheet>.v5-detail-col-6{grid-column:11!important}
  .v6-sheet>.v5-detail-col-7{grid-column:12!important}
  .v6-sheet>.v5-detail-col-8{grid-column:13!important}
  .v6-sheet>.v5-detail-col-9{grid-column:14!important}
  .v6-sheet>.v5-detail-cell{width:auto!important;min-width:0!important;padding:7px!important}

  /* Keep the four chronology lanes at readable widths.  Their sticky behavior is finalized in P0-3. */
  .v6-sheet>.era-head,.v6-sheet>.half-century-band{grid-column:1!important}
  .v6-sheet>.date-head,.v6-sheet .guide-date{grid-column:2!important}
  .v6-sheet>.gengo-head,.v6-sheet>.guide-gengo-band,.v6-sheet>.gengo-court-split-guide{grid-column:3!important}
  .v6-sheet>.emperor-head,.v6-sheet>.guide-emperor-span,.v6-sheet>.emperor-nanbokucho-guide{grid-column:4!important}

  /* Do not duplicate the independent gengo/emperor lanes inside the combined mobile context. */
  .v6-sheet>.v5-mobile-core-cell>.mobile-gengo,
  .v6-sheet>.v5-mobile-core-cell>.mobile-emperor{display:none!important}

  .timeline-horizontal-hint{
    display:flex;
    align-items:center;
    gap:7px;
    margin:7px 12px 8px;
    padding:7px 9px;
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
    border-radius:9px;
    background:color-mix(in srgb,var(--accent) 4%,var(--panel));
    color:var(--muted);
    font-size:11px;
    line-height:1.4;
  }
  .timeline-horizontal-hint b{color:var(--text);font-size:11px}
}

/* =========================================================
   v6.0.43 — 100改善 P0-3 50年帯・西暦を左側に固定
   横スクロール中も年代の基準を見失わないよう、最初の2列だけ
   水平方向にsticky固定する。元号・天皇は固定しない。
   ========================================================= */
@media(max-width:950px){
  .v6-sheet{
    --p0-sticky-fifty-width:48px;
  }

  /* ヘッダー：縦スクロール時のtop固定 + 横スクロール時のleft固定 */
  .v6-sheet>.era-head{
    position:sticky!important;
    top:0!important;
    left:0!important;
    z-index:72!important;
    background:color-mix(in srgb,#6ea867 23%,var(--panel2))!important;
    border-right:1px solid color-mix(in srgb,#4f8a4a 48%,var(--line))!important;
  }
  .v6-sheet>.date-head{
    position:sticky!important;
    top:0!important;
    left:var(--p0-sticky-fifty-width)!important;
    z-index:71!important;
    background:color-mix(in srgb,var(--panel2) 96%,var(--panel))!important;
    border-right:2px solid color-mix(in srgb,var(--accent) 30%,var(--line))!important;
    box-shadow:5px 0 8px -8px rgba(20,32,52,.55)!important;
  }

  /* 本体：50年帯と西暦だけを固定。右側の全列は通常どおり横へ流れる。 */
  .v6-sheet>.half-century-band{
    position:sticky!important;
    left:0!important;
    z-index:52!important;
    background:linear-gradient(180deg,color-mix(in srgb,#6ea867 28%,var(--panel)),color-mix(in srgb,#6ea867 12%,var(--panel)))!important;
  }
  .v6-sheet .guide-date{
    position:sticky!important;
    left:var(--p0-sticky-fifty-width)!important;
    z-index:51!important;
    background:var(--panel)!important;
    border-right:2px solid color-mix(in srgb,var(--accent) 22%,var(--line))!important;
    box-shadow:5px 0 8px -8px rgba(20,32,52,.45)!important;
  }

  /* 先史圧縮帯も固定列として不透明に保ち、背後の文字が透けないようにする。 */
  .v6-sheet>.prehistory-period-band,
  .v6-sheet>.jimmu-transition-band{
    background-clip:padding-box!important;
  }
}

/* =========================================================
   v6.0.44 — 100改善 P0-4 列の最低幅
   スマホ縦画面で列を画面幅へ無理に圧縮せず、読み取りに必要な
   最低横幅を確保する。フォントサイズ自体はP0-5で扱う。
   ========================================================= */
@media(max-width:950px){
  .v6-sheet{
    --p0-col-fifty:56px;
    --p0-col-year:78px;
    --p0-col-gengo:150px;
    --p0-col-emperor:190px;
    --p0-col-context:280px;
    --p0-col-detail:220px;
    --p0-sticky-fifty-width:var(--p0-col-fifty);
    grid-template-columns:
      var(--p0-col-fifty)
      var(--p0-col-year)
      var(--p0-col-gengo)
      var(--p0-col-emperor)
      var(--p0-col-context)
      repeat(var(--mobile-detail-count),var(--p0-col-detail))!important;
  }

  /* 年代固定列も新しい最低幅に同期する。 */
  .v6-sheet>.era-head,
  .v6-sheet>.half-century-band{
    min-width:var(--p0-col-fifty)!important;
    width:var(--p0-col-fifty)!important;
  }
  .v6-sheet>.date-head,
  .v6-sheet .guide-date{
    min-width:var(--p0-col-year)!important;
    width:var(--p0-col-year)!important;
  }

  /* 元号・天皇は、文字が1文字幅まで潰れない横幅を必ず確保する。 */
  .v6-sheet>.gengo-head,
  .v6-sheet>.guide-gengo-band,
  .v6-sheet>.gengo-court-split-guide{
    min-width:var(--p0-col-gengo)!important;
  }
  .v6-sheet>.emperor-head,
  .v6-sheet>.guide-emperor-span,
  .v6-sheet>.emperor-nanbokucho-guide{
    min-width:var(--p0-col-emperor)!important;
  }

  /* 政治・制度の複合列と各出来事列にも最低幅を設定。 */
  .v6-sheet>.mobile-core-head,
  .v6-sheet>.v5-mobile-core-cell{
    min-width:var(--p0-col-context)!important;
  }
  .v6-sheet>.v5-detail-head,
  .v6-sheet>.v5-detail-cell{
    min-width:var(--p0-col-detail)!important;
  }

  /* 固定した西暦列のleft位置を拡張後の50年帯幅へ追従。 */
  .v6-sheet>.date-head,
  .v6-sheet .guide-date{
    left:var(--p0-col-fifty)!important;
  }
}
@media(max-width:950px){
  /* 南北朝の二分表示は列全体の最低幅を左右で分ける。 */
  .v6-sheet>.guide-gengo-band.court-south,
  .v6-sheet>.guide-gengo-band.court-north{
    min-width:75px!important;
  }
  .v6-sheet>.guide-emperor-span.dual-claim-left,
  .v6-sheet>.guide-emperor-span.north.precursor{
    min-width:95px!important;
  }
}

/* =========================================================
   v6.0.45 — 100改善 P0-5 最低文字サイズ
   スマホ年表で文字を帯の高さに合わせて極端に縮小しない。
   主情報は13〜14px、補助情報も11px未満にしない。
   短期間帯の外部ラベル化は次のP0-6で扱う。
   ========================================================= */
@media(max-width:950px){
  /* 列見出し */
  .v6-sheet>.era-head,
  .v6-sheet>.date-head,
  .v6-sheet>.gengo-head,
  .v6-sheet>.emperor-head,
  .v6-sheet>.mobile-core-head,
  .v6-sheet>.v5-detail-head{
    font-size:13px!important;
    line-height:1.35!important;
  }

  /* 年代 */
  .v6-sheet>.half-century-band b{font-size:14px!important;line-height:1.3!important}
  .v6-sheet>.half-century-band small,
  .v6-sheet>.prehistory-period-band small,
  .v6-sheet>.jimmu-transition-band small{
    font-size:11px!important;
    line-height:1.35!important;
  }
  .v6-sheet .guide-date b{font-size:14px!important;line-height:1.35!important}

  /* 元号：期間の短さを文字縮小で解決しない */
  .v6-sheet>.guide-gengo-band:not(.gengo-micro) b,
  .v6-sheet>.guide-gengo-band.gengo-short:not(.gengo-micro) b,
  .v6-sheet>.guide-gengo-band.gengo-very-short:not(.gengo-micro) b,
  .v6-sheet>.guide-gengo-band.gengo-none:not(.gengo-micro) b{
    font-size:14px!important;
    line-height:1.35!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }
  .v6-sheet>.guide-gengo-band:not(.gengo-micro) small,
  .v6-sheet>.guide-gengo-band:not(.gengo-micro) span{
    font-size:11px!important;
    line-height:1.35!important;
  }

  /* 天皇：短期在位でも人物名を小さくしない */
  .v6-sheet>.guide-emperor-span:not(.micro-reign) b,
  .v6-sheet>.guide-emperor-span.short-reign:not(.micro-reign)>b,
  .v6-sheet>.guide-emperor-span.south:not(.micro-reign) b,
  .v6-sheet>.guide-emperor-span.north:not(.micro-reign) b{
    font-size:14px!important;
    line-height:1.35!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }
  .v6-sheet>.guide-emperor-span:not(.micro-reign) small,
  .v6-sheet>.guide-emperor-span:not(.micro-reign) span,
  .v6-sheet>.guide-emperor-span:not(.micro-reign) em,
  .v6-sheet>.guide-emperor-span:not(.micro-reign) .emperor-historicity-note{
    font-size:11px!important;
    line-height:1.35!important;
  }

  /* 政治・制度のスマホ複合列 */
  .v6-sheet>.v5-mobile-core-cell .mobile-core-line>small,
  .v6-sheet>.v5-mobile-core-cell .mobile-role-stack em,
  .v6-sheet>.v5-mobile-core-cell .office-mini-line small,
  .v6-sheet>.v5-mobile-core-cell .mobile-leader em{
    font-size:11px!important;
    line-height:1.45!important;
  }
  .v6-sheet>.v5-mobile-core-cell .mobile-core-line>b,
  .v6-sheet>.v5-mobile-core-cell .mobile-role-stack b,
  .v6-sheet>.v5-mobile-core-cell .mobile-leader b{
    font-size:14px!important;
    line-height:1.45!important;
  }
  .v6-sheet>.v5-mobile-core-cell .office-mini-line b{
    font-size:13px!important;
    line-height:1.45!important;
  }
  .v6-sheet>.v5-mobile-core-cell .power-role-chip,
  .v6-sheet>.v5-mobile-core-cell .power-relation-chip{
    font-size:11px!important;
    line-height:1.3!important;
  }

  /* 国内政治・外交・文化・世界史などの出来事列 */
  .v6-sheet>.v5-detail-cell .sheet-event strong,
  .v6-sheet>.v5-mobile-core-cell .sheet-event strong{
    font-size:13px!important;
    line-height:1.5!important;
  }
  .v6-sheet>.v5-detail-cell .sheet-event small,
  .v6-sheet>.v5-mobile-core-cell .sheet-event small{
    font-size:11px!important;
    line-height:1.45!important;
  }

  /* 凡例・スワイプ案内も読める最低サイズを確保 */
  .v6-timeline .power-type-legend span,
  .v6-timeline .power-role-chip,
  .timeline-horizontal-hint,
  .timeline-horizontal-hint b{
    font-size:11px!important;
  }
}

/* =========================================================
   v6.0.46 — 100改善 P0-6 短期間の元号・天皇を外部ラベル化
   1〜2年の期間は実年代位置を細いマーカーで保ちつつ、名称は
   帯の高さに押し込まず、同じ列内の読みやすい外部ラベルで示す。
   重なり回避そのものは次のP0-7で扱う。
   ========================================================= */
.guide-gengo-band.has-external-period-label,
.guide-emperor-span.has-external-period-label{
  overflow:visible!important;
  padding:0!important;
  min-height:0!important;
  background:transparent!important;
  border-bottom:0!important;
}
.guide-gengo-band.has-external-period-label>small,
.guide-gengo-band.has-external-period-label>b,
.guide-gengo-band.has-external-period-label>span:not(.period-external-label),
.guide-emperor-span.has-external-period-label>small,
.guide-emperor-span.has-external-period-label>b,
.guide-emperor-span.has-external-period-label>span:not(.period-external-label),
.guide-emperor-span.has-external-period-label>em{
  display:none!important;
}
.guide-gengo-band.has-external-period-label::before,
.guide-emperor-span.has-external-period-label::before{
  content:"";
  position:absolute;
  left:3px;
  right:3px;
  top:50%;
  height:3px;
  transform:translateY(-50%);
  border-radius:999px;
  z-index:1;
  pointer-events:none;
}
.guide-gengo-band.has-external-period-label::before{background:#9a7323}
.guide-emperor-span.has-external-period-label::before{background:#5577a7}
.period-external-label{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  z-index:8;
  display:flex!important;
  align-items:baseline;
  gap:6px;
  max-width:calc(100% - 14px);
  min-height:30px;
  padding:4px 7px;
  border:1px solid var(--line);
  border-radius:7px;
  background:color-mix(in srgb,var(--panel) 95%,transparent);
  box-shadow:0 2px 7px rgba(0,0,0,.10);
  white-space:nowrap;
  overflow:hidden;
  pointer-events:none;
}
.period-external-label b{
  display:block!important;
  flex:0 1 auto;
  min-width:0;
  font-size:14px!important;
  line-height:1.25!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap!important;
  word-break:keep-all!important;
}
.period-external-label small{
  display:block!important;
  flex:0 0 auto;
  font-size:11px!important;
  line-height:1.25!important;
  color:var(--muted);
  white-space:nowrap!important;
}
.gengo-external-label{border-left:4px solid #9a7323}
.emperor-external-label{border-left:4px solid #5577a7}
.guide-gengo-band.court-south.has-external-period-label .gengo-external-label{max-width:calc(200% - 14px)}
.guide-gengo-band.court-north.has-external-period-label .gengo-external-label{max-width:calc(200% - 14px);left:10px}
.guide-emperor-span.south.has-external-period-label .emperor-external-label,
.guide-emperor-span.north.has-external-period-label .emperor-external-label{max-width:calc(200% - 14px)}

@media(max-width:950px){
  .period-external-label{min-height:34px;padding:5px 7px;gap:5px}
  .period-external-label b{font-size:14px!important}
  .period-external-label small{font-size:11px!important}
}

/* =========================================================
   v6.0.47 — 100改善 P0-7 元号・天皇ラベルの重なり回避
   実年代のマーカー位置は維持し、短期間の外部ラベルだけを
   時系列順を壊さない範囲で上下に退避。左右も交互にずらす。
   ========================================================= */
.period-external-label{
  transform:translateY(calc(-50% + var(--p07-label-shift,0px)))!important;
  overflow:visible!important;
}
.period-external-label.label-side-left{
  left:8px!important;
  right:auto!important;
  max-width:calc(100% - 18px)!important;
}
.period-external-label.label-side-right{
  left:auto!important;
  right:8px!important;
  max-width:calc(100% - 18px)!important;
}
.period-external-label b{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.period-label-connector{
  position:absolute;
  left:7px;
  width:1px;
  background:color-mix(in srgb,var(--muted) 55%,transparent);
  z-index:6;
  pointer-events:none;
  display:none;
}
.has-external-period-label>.period-label-connector.label-shift-down{
  display:block;
  top:50%;
  height:var(--p07-connector,0px);
}
.has-external-period-label>.period-label-connector.label-shift-up{
  display:block;
  bottom:50%;
  height:var(--p07-connector,0px);
}
.guide-gengo-band.has-external-period-label>.period-label-connector{background:#9a7323}
.guide-emperor-span.has-external-period-label>.period-label-connector{background:#5577a7}

@media(max-width:950px){
  .period-external-label.label-side-left{left:7px!important;right:auto!important}
  .period-external-label.label-side-right{left:auto!important;right:7px!important}
  .period-label-connector{left:6px}
}

/* P0-7: two readable label rails inside 元号／天皇 columns. */
.period-external-label.label-side-left,
.period-external-label.label-side-right{
  width:calc(50% - 12px)!important;
  max-width:calc(50% - 12px)!important;
  min-width:0!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:1px!important;
}
.period-external-label.label-side-left{left:7px!important;right:auto!important}
.period-external-label.label-side-right{left:auto!important;right:7px!important}
.period-external-label b,
.period-external-label small{max-width:100%!important}
.period-external-label small{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
/* 南北朝は元の帯自体が半幅なので、短期ラベルはその朝側の帯から
   列全体へ広げて読みやすさを優先する。 */
.guide-gengo-band.court-south.has-external-period-label .period-external-label,
.guide-gengo-band.court-north.has-external-period-label .period-external-label,
.guide-emperor-span.south.has-external-period-label .period-external-label,
.guide-emperor-span.north.has-external-period-label .period-external-label{
  width:calc(100% - 12px)!important;
  max-width:calc(200% - 14px)!important;
}
/* Keep two-line callouts within the 34px collision pitch without shrinking fonts. */
.period-external-label{
  min-height:32px!important;
  padding:3px 6px!important;
  gap:0!important;
}
.period-external-label b{line-height:1.05!important}
.period-external-label small{line-height:1.05!important}

/* v6.0.49 P0-9 — virtual timeline rendering / mobile performance */
.v6-sheet[data-virtualized="1"]>.guide-date,
.v6-sheet[data-virtualized="1"]>.v5-mobile-core-cell,
.v6-sheet[data-virtualized="1"]>.v5-detail-cell{content-visibility:auto;contain-intrinsic-size:1px 52px}
.virtual-render-note{display:inline-block;margin-left:8px;padding:2px 6px;border:1px solid var(--line);border-radius:999px;font-size:10px;color:var(--muted);background:var(--panel)}
@media(max-width:700px){.virtual-render-note{display:block;width:max-content;max-width:100%;margin:5px 0 0;font-size:10px}}

/* =========================================================
   v6.0.50 — 100改善 P0-10 縦画面／横画面を専用レイアウト化
   縦：読みやすい基本列＋横スクロールの情報列。
   横：モバイル複合政治列を使わず、政治役職を独立列へ戻して
       画面の横幅を情報量に使う。
   ========================================================= */
.p010-landscape-hint{display:none!important}

/* Portrait keeps the P0-2〜P0-7 smartphone reading layout. */
@media (max-width:950px) and (orientation:portrait){
  .p010-portrait-hint{display:inline!important}
  .p010-landscape-hint{display:none!important}
  .v6-timeline .timeline-sheet-scroll{scroll-snap-type:x proximity}
  .v6-sheet>.gengo-head,
  .v6-sheet>.emperor-head,
  .v6-sheet>.mobile-core-head,
  .v6-sheet>.v5-detail-head{scroll-snap-align:start}
}

/* Landscape is a dedicated multi-lane layout, not a stretched portrait sheet. */
@media (max-width:950px) and (orientation:landscape){
  .p010-portrait-hint{display:none!important}
  .p010-landscape-hint{display:inline!important}

  .v6-timeline .guidebook-rule-note{display:none!important}
  .v6-timeline .guidebook-source-strip{padding-top:6px!important;padding-bottom:6px!important}
  .v6-timeline .power-type-legend{max-height:38px;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;white-space:nowrap}
  .timeline-horizontal-hint{padding:5px 9px!important;margin-top:5px!important;margin-bottom:6px!important}

  .v6-timeline .timeline-sheet-scroll{
    overflow-x:auto!important;
    overflow-y:visible!important;
    overscroll-behavior-x:contain!important;
    touch-action:pan-x pan-y!important;
    scroll-snap-type:x proximity;
  }
  .v6-sheet{
    --p0-col-fifty:64px;
    --p0-col-year:86px;
    --p0-sticky-fifty-width:64px;
    grid-template-columns:var(--p010-landscape-grid)!important;
    min-width:var(--p010-landscape-min-width)!important;
    width:max-content!important;
    max-width:none!important;
  }

  /* In landscape use the independent office/political lanes. */
  .v6-sheet>.mobile-core-head,
  .v6-sheet>.v5-mobile-core-cell{display:none!important}
  .v6-sheet>.desktop-core-head,
  .v6-sheet>.desktop-core-head:not(.era-head):not(.gengo-head):not(.emperor-head),
  .v6-sheet>.date-head{display:block!important}
  .v6-sheet>.guide-support-band,
  .v6-sheet>.guide-shogun-band,
  .v6-sheet>.guide-tenkabito-band,
  .v6-sheet>.guide-prime-minister-band,
  .v6-sheet>.guide-regime-band,
  .v6-sheet>.guide-institutional-top-band,
  .v6-sheet>.guide-power-band{display:flex!important}

  /* Restore the real dynamic grid positions of the detail lanes. */
  .v6-sheet>.v5-detail-head,
  .v6-sheet>.v5-detail-cell{
    display:block!important;
    grid-column:var(--p010-col)!important;
    min-width:0!important;
  }

  /* Header row remains visible while reading down the timeline. */
  .v6-sheet>.sheet-head{position:sticky!important;top:0!important;z-index:34!important}
  .v6-sheet>.era-head{left:0!important;z-index:76!important;min-width:64px!important;width:64px!important}
  .v6-sheet>.date-head{left:64px!important;z-index:75!important;min-width:86px!important;width:86px!important}
  .v6-sheet>.half-century-band{left:0!important;min-width:64px!important;width:64px!important}
  .v6-sheet .guide-date{left:64px!important;min-width:86px!important;width:86px!important}

  /* The wide layout has room for independent gengo/emperor tracks; do not
     inherit portrait-only item minimum widths that would distort the grid. */
  .v6-sheet>.gengo-head,
  .v6-sheet>.guide-gengo-band,
  .v6-sheet>.gengo-court-split-guide,
  .v6-sheet>.emperor-head,
  .v6-sheet>.guide-emperor-span,
  .v6-sheet>.emperor-nanbokucho-guide,
  .v6-sheet>.guide-support-band,
  .v6-sheet>.guide-shogun-band,
  .v6-sheet>.guide-tenkabito-band,
  .v6-sheet>.guide-prime-minister-band,
  .v6-sheet>.guide-regime-band,
  .v6-sheet>.guide-institutional-top-band,
  .v6-sheet>.guide-power-band{min-width:0!important}

  .v6-sheet>.gengo-head,
  .v6-sheet>.emperor-head,
  .v6-sheet>.court-office-head,
  .v6-sheet>.bakufu-office-head,
  .v6-sheet>.shogun-head,
  .v6-sheet>.government-head,
  .v6-sheet>.prime-minister-head,
  .v6-sheet>.institutional-top-head,
  .v6-sheet>.power-head,
  .v6-sheet>.v5-detail-head{scroll-snap-align:start}
}

/* =========================================================
   v6.0.51 — 100改善 P1-1 スマホ縦画面のレーン切替
   基本 / 政治 / 社会・文化 / 東アジア・世界 を切り替え、
   縦画面で不要な列を一度に抱え込まない。
   ========================================================= */
.mobile-lane-switch{display:none}

@media(max-width:950px) and (orientation:portrait){
  /* 既存の細かな列フィルターは縦画面ではレーン切替に一本化。
     「読み」トグルは残す。 */
  .timeline-field-filter>button{display:none!important}
  .timeline-field-filter{justify-content:flex-end;margin-top:2px;margin-bottom:5px}

  .mobile-lane-switch{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    margin:7px 12px 8px;
    overflow:visible;
    padding:1px 0 3px;
    scrollbar-width:thin;
  }
  .mobile-lane-switch button{
    min-width:0;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--panel2);
    color:var(--muted);
    padding:7px 8px;
    text-align:left;
    cursor:pointer;
  }
  .mobile-lane-switch button b{display:block;font-size:12px;line-height:1.25;color:var(--text);white-space:nowrap}
  .mobile-lane-switch button small{display:block;margin-top:2px;font-size:9px;line-height:1.25;white-space:nowrap}
  .mobile-lane-switch button.active{
    border-color:var(--accent);
    background:color-mix(in srgb,var(--accent) 11%,var(--panel));
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent);
  }
  .mobile-lane-switch button.active b{color:var(--accent2)}

  /* まず全詳細レーンを閉じ、選択グループだけを下で開く。 */
  .v6-sheet[data-mobile-lane]>.v5-detail-head,
  .v6-sheet[data-mobile-lane]>.v5-detail-cell{display:none!important}

  /* 基本：50年帯｜西暦｜元号｜天皇 */
  .v6-sheet[data-mobile-lane="basic"]{
    grid-template-columns:var(--p0-col-fifty) var(--p0-col-year) var(--p0-col-gengo) var(--p0-col-emperor)!important;
    min-width:calc(var(--p0-col-fifty) + var(--p0-col-year) + var(--p0-col-gengo) + var(--p0-col-emperor))!important;
  }
  .v6-sheet[data-mobile-lane="basic"]>.mobile-core-head,
  .v6-sheet[data-mobile-lane="basic"]>.v5-mobile-core-cell{display:none!important}
  .v6-sheet[data-mobile-lane="basic"]>.gengo-head,
  .v6-sheet[data-mobile-lane="basic"]>.guide-gengo-band,
  .v6-sheet[data-mobile-lane="basic"]>.gengo-court-split-guide{display:flex!important;grid-column:3!important}
  .v6-sheet[data-mobile-lane="basic"]>.gengo-head{display:block!important}
  .v6-sheet[data-mobile-lane="basic"]>.emperor-head,
  .v6-sheet[data-mobile-lane="basic"]>.guide-emperor-span,
  .v6-sheet[data-mobile-lane="basic"]>.emperor-nanbokucho-guide{display:flex!important;grid-column:4!important}
  .v6-sheet[data-mobile-lane="basic"]>.emperor-head{display:block!important}
  .v6-sheet[data-mobile-lane="basic"]>.emperor-nanbokucho-guide{display:grid!important}

  /* 政治：50年帯｜西暦｜天皇｜政治・制度｜国内政治 */
  .v6-sheet[data-mobile-lane="politics"]{
    grid-template-columns:var(--p0-col-fifty) var(--p0-col-year) var(--p0-col-emperor) var(--p0-col-context) var(--p0-col-detail)!important;
    min-width:calc(var(--p0-col-fifty) + var(--p0-col-year) + var(--p0-col-emperor) + var(--p0-col-context) + var(--p0-col-detail))!important;
  }
  .v6-sheet[data-mobile-lane="politics"]>.gengo-head,
  .v6-sheet[data-mobile-lane="politics"]>.guide-gengo-band,
  .v6-sheet[data-mobile-lane="politics"]>.gengo-court-split-guide{display:none!important}
  .v6-sheet[data-mobile-lane="politics"]>.emperor-head,
  .v6-sheet[data-mobile-lane="politics"]>.guide-emperor-span,
  .v6-sheet[data-mobile-lane="politics"]>.emperor-nanbokucho-guide{display:flex!important;grid-column:3!important}
  .v6-sheet[data-mobile-lane="politics"]>.emperor-head{display:block!important}
  .v6-sheet[data-mobile-lane="politics"]>.emperor-nanbokucho-guide{display:grid!important}
  .v6-sheet[data-mobile-lane="politics"]>.mobile-core-head,
  .v6-sheet[data-mobile-lane="politics"]>.v5-mobile-core-cell{display:block!important;grid-column:4!important;min-width:var(--p0-col-context)!important}
  .v6-sheet[data-mobile-lane="politics"]>.v5-mobile-core-cell{display:grid!important}
  .v6-sheet[data-mobile-lane="politics"]>.v5-mobile-core-cell>.mobile-major{display:none!important}
  .v6-sheet[data-mobile-lane="politics"]>.v5-detail-lane-politics{display:block!important;grid-column:5!important}

  /* 社会・文化：50年帯｜西暦｜社会・経済｜文化 */
  .v6-sheet[data-mobile-lane="society"]{
    grid-template-columns:var(--p0-col-fifty) var(--p0-col-year) var(--p0-col-detail) var(--p0-col-detail)!important;
    min-width:calc(var(--p0-col-fifty) + var(--p0-col-year) + var(--p0-col-detail) + var(--p0-col-detail))!important;
  }
  .v6-sheet[data-mobile-lane="society"]>.gengo-head,
  .v6-sheet[data-mobile-lane="society"]>.guide-gengo-band,
  .v6-sheet[data-mobile-lane="society"]>.gengo-court-split-guide,
  .v6-sheet[data-mobile-lane="society"]>.emperor-head,
  .v6-sheet[data-mobile-lane="society"]>.guide-emperor-span,
  .v6-sheet[data-mobile-lane="society"]>.emperor-nanbokucho-guide,
  .v6-sheet[data-mobile-lane="society"]>.mobile-core-head,
  .v6-sheet[data-mobile-lane="society"]>.v5-mobile-core-cell{display:none!important}
  .v6-sheet[data-mobile-lane="society"]>.v5-detail-lane-society{display:block!important;grid-column:3!important}
  .v6-sheet[data-mobile-lane="society"]>.v5-detail-lane-culture{display:block!important;grid-column:4!important}

  /* 東アジア・世界：50年帯｜西暦｜外交｜中国｜朝鮮｜琉球｜北海道・蝦夷地｜世界史 */
  .v6-sheet[data-mobile-lane="world"]{
    grid-template-columns:var(--p0-col-fifty) var(--p0-col-year) repeat(6,var(--p0-col-detail))!important;
    min-width:calc(var(--p0-col-fifty) + var(--p0-col-year) + var(--p0-col-detail) + var(--p0-col-detail) + var(--p0-col-detail) + var(--p0-col-detail) + var(--p0-col-detail) + var(--p0-col-detail))!important;
  }
  .v6-sheet[data-mobile-lane="world"]>.gengo-head,
  .v6-sheet[data-mobile-lane="world"]>.guide-gengo-band,
  .v6-sheet[data-mobile-lane="world"]>.gengo-court-split-guide,
  .v6-sheet[data-mobile-lane="world"]>.emperor-head,
  .v6-sheet[data-mobile-lane="world"]>.guide-emperor-span,
  .v6-sheet[data-mobile-lane="world"]>.emperor-nanbokucho-guide,
  .v6-sheet[data-mobile-lane="world"]>.mobile-core-head,
  .v6-sheet[data-mobile-lane="world"]>.v5-mobile-core-cell{display:none!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-external{display:block!important;grid-column:3!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-china{display:block!important;grid-column:4!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-korea{display:block!important;grid-column:5!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-ryukyu{display:block!important;grid-column:6!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-hokkaido{display:block!important;grid-column:7!important}
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-world{display:block!important;grid-column:8!important}

  /* 選択レーンの最初の可動列へスナップしやすくする。 */
  .v6-sheet[data-mobile-lane="politics"]>.emperor-head,
  .v6-sheet[data-mobile-lane="society"]>.v5-detail-lane-society,
  .v6-sheet[data-mobile-lane="world"]>.v5-detail-lane-external{scroll-snap-align:start}
}

/* =========================================================
   v6.0.52 — 100改善 P1-2 年代固定ヘッダー
   縦スクロール中も現在年・50年帯・元号等を見失わない。
   ========================================================= */
#timelineView .timeline-position{
  --timeline-sticky-top:64px;
  position:sticky!important;
  top:var(--timeline-sticky-top)!important;
  z-index:88!important;
  margin:5px 0 8px!important;
  padding:7px 10px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:2px!important;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--panel) 96%,transparent)!important;
  box-shadow:0 7px 20px rgba(20,32,52,.12)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.timeline-position-main{display:flex;align-items:center;gap:7px;min-width:0;white-space:nowrap;overflow:hidden}
.timeline-position-main small{flex:0 0 auto;font-size:9px;font-weight:900;color:var(--muted);letter-spacing:.04em}
.timeline-position-main b{flex:0 0 auto;font-size:15px!important;line-height:1.25!important;color:var(--accent2);font-variant-numeric:tabular-nums}
.timeline-position-main span{flex:0 0 auto;font-size:11px!important;line-height:1.25!important;font-weight:800;color:var(--text)}
.timeline-position-main em{min-width:0;overflow:hidden;text-overflow:ellipsis;font-style:normal;font-size:10px;font-weight:800;color:var(--muted)}
.timeline-position-sub{min-width:0;overflow:hidden}
.timeline-position-sub span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px!important;line-height:1.35!important;color:var(--muted)}
@media(max-width:950px){
  #timelineView .timeline-position{margin-left:-4px!important;margin-right:-4px!important;padding:7px 9px!important;border-radius:10px!important}
  .timeline-position-main{gap:6px}
  .timeline-position-main b{font-size:14px!important}
  .timeline-position-main span{font-size:10.5px!important}
  .timeline-position-sub span{font-size:9.5px!important}
}

/* v6.0.53 P1-3: exact year jump */
.timeline-year-jump{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(260px,1.4fr);gap:7px 12px;align-items:end;margin:9px 0 10px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel2) 88%,transparent)}
.timeline-year-jump>label{display:flex;flex-direction:column;gap:2px;min-width:0}.timeline-year-jump>label b{font-size:12px}.timeline-year-jump>label span{font-size:10px;line-height:1.35;color:var(--muted)}
.timeline-year-jump-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.timeline-year-jump-row input{min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);padding:9px 10px;font:inherit;font-size:13px;font-variant-numeric:tabular-nums}.timeline-year-jump-row button{border:1px solid var(--accent);border-radius:10px;background:var(--accent);color:#fff;padding:8px 14px;font-weight:900;cursor:pointer;white-space:nowrap}.timeline-year-jump-status{grid-column:1/-1;min-height:1.35em;font-size:10px;color:var(--muted)}.timeline-year-jump-status.is-error{color:#b42318;font-weight:800}.timeline-year-jump-status.is-ok{color:var(--accent2);font-weight:800}
@media(max-width:700px){.timeline-year-jump{grid-template-columns:1fr;padding:8px;margin:8px 0}.timeline-year-jump>label span{font-size:9.5px}.timeline-year-jump-status{grid-column:auto}.timeline-year-jump-row input{font-size:14px;padding:10px}.timeline-year-jump-row button{min-width:64px;padding:9px 12px}}


/* v6.0.54 P1-4 — 人物名・元号から年代へジャンプ */
.timeline-name-jump{position:relative}
.timeline-name-jump-results{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:6px;max-height:230px;overflow:auto;overscroll-behavior:contain}
.timeline-name-jump-results:empty{display:none}
.timeline-name-jump-result{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 8px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);padding:8px 9px;cursor:pointer;min-width:0}
.timeline-name-jump-result:hover,.timeline-name-jump-result:focus-visible{border-color:var(--accent);outline:none;background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.timeline-name-jump-result b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.timeline-name-jump-result small{font-size:10px;color:var(--muted);white-space:nowrap}
.timeline-name-jump-result span{grid-column:1/-1;font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums}
@media(max-width:700px){.timeline-name-jump-results{grid-template-columns:1fr;max-height:260px}.timeline-name-jump-result{min-height:44px}.timeline-name-jump-result b{font-size:14px}.timeline-name-jump-result span{font-size:11px}}

/* v6.0.55 P1-5 — 選択した人物・元号の期間をハイライト */
.timeline-period-selected{
  position:relative;
  z-index:42!important;
  outline:3px solid #ffb000!important;
  outline-offset:-2px;
  box-shadow:0 0 0 3px color-mix(in srgb,#ffb000 30%,transparent),0 4px 14px rgba(0,0,0,.16)!important;
  filter:saturate(1.12) contrast(1.04);
}
.timeline-period-selected b{font-weight:950!important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}
@media(max-width:950px) and (orientation:portrait){
  .timeline-period-selected{outline-width:3px!important;box-shadow:0 0 0 4px color-mix(in srgb,#ffb000 28%,transparent)!important}
}


/* =========================================================
   v6.0.56 — 100改善 P1-6「この50年を拡大」
   50年帯をタップすると、その50年間だけを読書用倍率で表示する。
   ========================================================= */
.half-century-band[data-half-century-focus]{
  appearance:none;
  font:inherit;
  cursor:zoom-in;
  overflow:visible;
  /* P2-3: allow an intentional double tap without Safari page zoom taking over. */
  touch-action:manipulation;
}
.half-century-band[data-half-century-focus]:hover{filter:brightness(.98)}
.half-century-band[data-half-century-focus]:focus-visible{outline:3px solid var(--accent2);outline-offset:-3px}
.half-century-zoom-mark{
  display:inline-flex;align-items:center;justify-content:center;
  margin-top:4px;padding:2px 5px;border-radius:999px;
  font-size:9px;line-height:1;font-weight:900;
  color:#285123;background:color-mix(in srgb,#fff 72%,#7eb377 28%);
  border:1px solid color-mix(in srgb,#4f8a4a 35%,var(--line));
}
.half-century-band.is-half-century-focused{
  box-shadow:inset 0 0 0 3px color-mix(in srgb,#d6a700 75%,#fff);
  cursor:default;
}
.half-century-focus-banner{
  position:sticky;top:calc(var(--timeline-sticky-top,0px) + 62px);z-index:45;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:8px 0;padding:10px 12px;border:1px solid color-mix(in srgb,#d6a700 55%,var(--line));
  border-radius:12px;background:color-mix(in srgb,#fff8cf 88%,var(--panel));
  box-shadow:0 5px 16px rgba(0,0,0,.08);
}
.half-century-focus-banner div{display:grid;gap:2px;min-width:0}
.half-century-focus-banner small{font-size:10px;font-weight:900;color:#7a6300}
.half-century-focus-banner b{font-size:15px;line-height:1.25;color:var(--text)}
.half-century-focus-banner span{font-size:11px;line-height:1.4;color:var(--muted)}
.half-century-focus-banner button{
  flex:0 0 auto;border:1px solid color-mix(in srgb,#d6a700 60%,var(--line));
  border-radius:10px;padding:8px 10px;background:var(--panel);color:var(--text);font-weight:900;
}
@media(max-width:950px){
  .half-century-focus-banner{top:calc(var(--timeline-sticky-top,0px) + 58px);margin-inline:4px}
  .half-century-focus-banner span{display:none}
  .half-century-zoom-mark{font-size:9px!important}
}


/* =========================================================
   v6.0.58 — 100改善 P1-7「文字大モード」
   年代位置・行高・列幅は変えず、年表を読む文字だけ拡大する。
   P0-5 の最低文字サイズより後段で上書きし、明示px指定にも効かせる。
   ========================================================= */
html[data-timeline-text="large"] #timelineView .v6-sheet>.era-head,
html[data-timeline-text="large"] #timelineView .v6-sheet>.date-head,
html[data-timeline-text="large"] #timelineView .v6-sheet>.gengo-head,
html[data-timeline-text="large"] #timelineView .v6-sheet>.emperor-head,
html[data-timeline-text="large"] #timelineView .v6-sheet>.mobile-core-head,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-detail-head{
  font-size:15px!important;
  line-height:1.4!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.half-century-band b,
html[data-timeline-text="large"] #timelineView .v6-sheet .guide-date b,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-gengo-band:not(.gengo-micro) b,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-emperor-span:not(.micro-reign) b,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-core-line>b,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-role-stack b,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-leader b,
html[data-timeline-text="large"] #timelineView .period-external-label b{
  font-size:17px!important;
  line-height:1.45!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-gengo-band:not(.gengo-micro) small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-gengo-band:not(.gengo-micro) span,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-emperor-span:not(.micro-reign) small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-emperor-span:not(.micro-reign) span,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-emperor-span:not(.micro-reign) em,
html[data-timeline-text="large"] #timelineView .v6-sheet>.guide-emperor-span:not(.micro-reign) .emperor-historicity-note,
html[data-timeline-text="large"] #timelineView .v6-sheet>.half-century-band small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.prehistory-period-band small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.jimmu-transition-band small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-core-line>small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-role-stack em,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .office-mini-line small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .mobile-leader em,
html[data-timeline-text="large"] #timelineView .period-external-label small{
  font-size:13px!important;
  line-height:1.45!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .office-mini-line b{
  font-size:16px!important;
  line-height:1.45!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .power-role-chip,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .power-relation-chip,
html[data-timeline-text="large"] #timelineView .v6-timeline .power-role-chip{
  font-size:13px!important;
  line-height:1.35!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-detail-cell .sheet-event strong,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .sheet-event strong{
  font-size:16px!important;
  line-height:1.55!important;
}
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-detail-cell .sheet-event small,
html[data-timeline-text="large"] #timelineView .v6-sheet>.v5-mobile-core-cell .sheet-event small{
  font-size:13px!important;
  line-height:1.5!important;
}
html[data-timeline-text="large"] #timelineView .timeline-position-main b{font-size:17px!important}
html[data-timeline-text="large"] #timelineView .timeline-position-main span{font-size:13px!important}
html[data-timeline-text="large"] #timelineView .timeline-position-sub span{font-size:12px!important}
html[data-timeline-text="large"] #timelineView .mobile-lane-switch button b{font-size:14px!important}
html[data-timeline-text="large"] #timelineView .mobile-lane-switch button small{font-size:11px!important}
html[data-timeline-text="large"] #timelineView .timeline-horizontal-hint,
html[data-timeline-text="large"] #timelineView .timeline-horizontal-hint b,
html[data-timeline-text="large"] #timelineView .timeline-scroll-hint{font-size:13px!important;line-height:1.55!important}

/* 文字大でも年代スケールを変えない。文字だけは帯外へ読めるようにする。 */
html[data-timeline-text="large"] #timelineView .guide-gengo-band,
html[data-timeline-text="large"] #timelineView .guide-emperor-span,
html[data-timeline-text="large"] #timelineView .guide-power-band,
html[data-timeline-text="large"] #timelineView .guide-regime-band{
  overflow:visible!important;
}

/* v6.0.58 — 100改善 P1-8：画面回転時に閲覧年代を維持 */

/* =========================================================
   v6.0.59 — 100改善 P1-9 南北朝期だけ元号・天皇列を拡張
   1336〜1391年を画面中央で見ている間だけ、南朝／北朝の二分表示が
   1列内で窮屈にならないよう元号・天皇の横幅を一時拡張する。
   1392年以後は通常幅へ戻す。
   ========================================================= */

/* PC / wide layouts: only the active Nanbokucho reading window uses the wider grid. */
@media(min-width:951px){
  .v6-sheet.nanbokucho-width-expanded{
    grid-template-columns:var(--p1-nb-grid)!important;
    min-width:var(--p1-nb-min-width)!important;
  }
}

/* Portrait: existing P0/P1 grids are variable-based, so widening the two variables
   automatically enlarges the split lanes without changing any historical row. */
@media(max-width:950px) and (orientation:portrait){
  .v6-sheet.nanbokucho-width-expanded{
    --p0-col-gengo:240px;
    --p0-col-emperor:300px;
  }

  /* In the basic lane this gives each court roughly half of the enlarged column. */
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-gengo-band.court-south,
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-gengo-band.court-north{
    min-width:120px!important;
  }
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.south,
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.north,
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.dual-claim-left,
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.north.precursor{
    min-width:150px!important;
  }

  /* Politics lane hides gengo but still benefits from a wider dual-emperor track. */
  .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="politics"]{
    --p0-col-emperor:300px;
  }
}

/* Landscape: keep independent political columns, only substitute a wider gengo/emperor pair. */
@media(max-width:950px) and (orientation:landscape){
  .v6-sheet.nanbokucho-width-expanded{
    grid-template-columns:var(--p1-nb-landscape-grid)!important;
    min-width:var(--p1-nb-landscape-min-width)!important;
  }
}

/* =========================================================
   v6.0.60 — 100改善 P1-10 背景色・罫線の整理
   情報構造や役割色は残しつつ、面の塗りを弱めて文字を主役にする。
   年代位置・列幅・フォントサイズ・レーン構成は変更しない。
   ========================================================= */
#timelineView{
  --timeline-gridline:color-mix(in srgb,var(--line) 58%,transparent);
  --timeline-gridline-strong:color-mix(in srgb,var(--line) 82%,var(--text) 18%);
  --timeline-head-bg:color-mix(in srgb,var(--panel2) 96%,var(--panel));
}

/* ヘッダーはほぼ無彩色にして、列名を読みやすくする。 */
#timelineView .v6-sheet>.sheet-head,
#timelineView .v6-sheet>.desktop-core-head,
#timelineView .v6-sheet>.mobile-core-head,
#timelineView .v6-sheet>.v5-detail-head{
  background:var(--timeline-head-bg)!important;
  border-right-color:var(--timeline-gridline)!important;
  border-bottom-color:var(--timeline-gridline-strong)!important;
  box-shadow:none!important;
}

/* 固定年代列は識別できる程度だけ色を残す。 */
#timelineView .v6-sheet>.era-head{
  background:color-mix(in srgb,#6ea867 11%,var(--timeline-head-bg))!important;
}
#timelineView .v6-sheet>.date-head{
  background:var(--timeline-head-bg)!important;
}
#timelineView .v6-sheet>.gengo-head{
  background:color-mix(in srgb,#b58a2c 4%,var(--timeline-head-bg))!important;
}
#timelineView .v6-sheet>.emperor-head{
  background:color-mix(in srgb,#7ea4d8 4%,var(--timeline-head-bg))!important;
}

/* 50年帯：緑の意味は残すが、大きな色面を弱める。 */
#timelineView .v6-sheet>.half-century-band{
  background:linear-gradient(180deg,
    color-mix(in srgb,#6ea867 14%,var(--panel)),
    color-mix(in srgb,#6ea867 5%,var(--panel)))!important;
  border-right-color:color-mix(in srgb,#4f8a4a 28%,var(--timeline-gridline-strong))!important;
  border-bottom-color:var(--timeline-gridline)!important;
  box-shadow:none!important;
}
#timelineView .v6-sheet>.half-century-band b{color:color-mix(in srgb,#1f4a1b 82%,var(--text))!important}

/* 西暦は最もニュートラルな基準列。 */
#timelineView .v6-sheet .guide-date{
  background:var(--panel)!important;
  border-right-color:var(--timeline-gridline-strong)!important;
  border-bottom-color:var(--timeline-gridline)!important;
}

/* 元号・天皇：色面を半分程度に弱め、文字と期間線を優先。 */
#timelineView .v6-sheet>.guide-gengo-band{
  background:color-mix(in srgb,#b58a2c 5%,var(--panel))!important;
  border-right-color:var(--timeline-gridline)!important;
  border-bottom-color:var(--timeline-gridline)!important;
}
#timelineView .v6-sheet>.guide-gengo-band.court-south{
  background:color-mix(in srgb,#8c6b1f 6%,var(--panel))!important;
}
#timelineView .v6-sheet>.guide-gengo-band.court-north{
  background:color-mix(in srgb,#5d7da8 6%,var(--panel))!important;
}
#timelineView .v6-sheet>.guide-emperor-span{
  background:color-mix(in srgb,#7ea4d8 5%,var(--panel))!important;
  border-right-color:var(--timeline-gridline)!important;
  border-bottom-color:var(--timeline-gridline)!important;
  box-shadow:none!important;
}
#timelineView .v6-sheet>.guide-emperor-span.north,
#timelineView .v6-sheet>.guide-emperor-span.north.precursor{
  background:color-mix(in srgb,#9fb5d6 7%,var(--panel))!important;
}

/* 政治・制度の各帯は「色付き面」より「左線＋文字」で識別する。 */
#timelineView .guide-support-band,
#timelineView .guide-shogun-band,
#timelineView .guide-tenkabito-band,
#timelineView .guide-prime-minister-band,
#timelineView .guide-institutional-top-band,
#timelineView .guide-regime-band,
#timelineView .guide-power-band{
  border-right-color:var(--timeline-gridline)!important;
  border-bottom-color:var(--timeline-gridline)!important;
  box-shadow:none!important;
}
#timelineView .guide-shogun-band{background:color-mix(in srgb,#6f6658 4%,var(--panel))!important}
#timelineView .guide-tenkabito-band{background:color-mix(in srgb,#a66a2c 4%,var(--panel))!important}
#timelineView .guide-prime-minister-band{background:color-mix(in srgb,#294f7a 4%,var(--panel))!important}
#timelineView .guide-institutional-top-band{background:color-mix(in srgb,#4b6078 3%,var(--panel))!important}
#timelineView .guide-regime-band{background:color-mix(in srgb,#557a5a 4%,var(--panel))!important}
#timelineView .guide-support-band.court-insei{background:color-mix(in srgb,#8c6fb1 6%,var(--panel))!important}
#timelineView .guide-support-band.court-sessho{background:color-mix(in srgb,#d5aa35 6%,var(--panel))!important}
#timelineView .guide-support-band.court-kampaku{background:color-mix(in srgb,#497eb7 6%,var(--panel))!important}
#timelineView .guide-support-band.bakufu-regent{background:color-mix(in srgb,#ba3e48 5%,var(--panel))!important}
#timelineView .guide-support-band.bakufu-tokusou{background:color-mix(in srgb,#8d2430 6%,var(--panel))!important}
#timelineView .guide-support-band.bakufu-kanrei{background:color-mix(in srgb,#5c9bb6 6%,var(--panel))!important}
#timelineView .guide-support-band.bakufu-edo{background:color-mix(in srgb,#8b6847 5%,var(--panel))!important}

/* 政治主導者は役割色の左線を強く残し、面色だけ弱める。 */
#timelineView .guide-power-band.power-type-court{background:color-mix(in srgb,#2f7d4a 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-sessho{background:color-mix(in srgb,#b78900 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-kampaku{background:color-mix(in srgb,#2f66b0 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-insei{background:color-mix(in srgb,#7a4aa8 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-regent{background:color-mix(in srgb,#b3262e 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-kanrei{background:color-mix(in srgb,#2f8fa3 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-edo{background:color-mix(in srgb,#8b5a2b 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-shogun{background:color-mix(in srgb,#4a5560 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-prime-minister{background:color-mix(in srgb,#173d78 4%,var(--panel))!important}
#timelineView .guide-power-band.power-type-emperor{background:color-mix(in srgb,#a36d00 5%,var(--panel))!important}
#timelineView .guide-power-band.power-type-other{background:color-mix(in srgb,#68717b 3%,var(--panel))!important}

/* 出来事列：大きな色面を作らず、細い区切り線で読み進める。 */
#timelineView .v6-sheet>.v5-mobile-core-cell,
#timelineView .v6-sheet>.v5-detail-cell,
#timelineView .guidebook-sheet .guide-cell{
  background:var(--panel)!important;
  border-right-color:var(--timeline-gridline)!important;
  border-bottom-color:var(--timeline-gridline)!important;
}
#timelineView .guidebook-sheet .sheet-event{
  border-bottom-color:color-mix(in srgb,var(--line) 46%,transparent)!important;
}
#timelineView .guidebook-sheet .sheet-event.importance-trunk{
  background:color-mix(in srgb,var(--accent) 2%,transparent)!important;
}
#timelineView .guidebook-sheet .sheet-event:hover,
#timelineView .guidebook-sheet .sheet-event:focus-visible{
  background:color-mix(in srgb,var(--accent) 4%,var(--panel))!important;
}

/* 50年の境目や転換年だけは弱めず、構造を追えるようにする。 */
#timelineView .v6-sheet .guide-date.turning,
#timelineView .v6-sheet>.v5-mobile-core-cell.turning{
  border-top-color:color-mix(in srgb,var(--warn) 72%,var(--accent))!important;
}

/* 横スクロール案内も色面を弱める。 */
#timelineView .timeline-horizontal-hint{
  background:var(--panel)!important;
  border-color:var(--timeline-gridline-strong)!important;
  box-shadow:none!important;
}


/* ============================================================
   v6.0.61 — 100改善 P2-1 年代ミニマップ
   年表全体のどこを見ているかを右端で把握し、タップ移動できる。
   ============================================================ */
#timelineView .timeline-minimap{
  --timeline-minimap-top:160px;
  position:fixed;
  z-index:64;
  top:var(--timeline-minimap-top);
  right:max(5px,env(safe-area-inset-right));
  bottom:calc(72px + env(safe-area-inset-bottom));
  width:58px;
  opacity:0;
  transform:translateX(8px);
  pointer-events:none;
  transition:opacity .16s ease,transform .16s ease;
  display:grid;
  grid-template-rows:auto minmax(120px,1fr) auto;
  justify-items:end;
  gap:4px;
}
#timelineView .timeline-minimap.is-active{opacity:1;transform:none;pointer-events:auto}
#timelineView .timeline-minimap-title,
#timelineView .timeline-minimap-now{
  max-width:54px;
  padding:3px 5px;
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--panel) 94%,transparent);
  color:var(--text);
  font-size:11px;
  font-weight:900;
  line-height:1.2;
  box-shadow:0 2px 8px rgba(0,0,0,.07);
}
#timelineView .timeline-minimap-track{
  position:relative;
  width:54px;
  height:100%;
  min-height:120px;
  border:0;
  background:transparent;
  touch-action:manipulation;
  cursor:pointer;
}
#timelineView .timeline-minimap-track::before{
  content:"";
  position:absolute;
  top:0;bottom:0;right:8px;
  width:5px;
  border-radius:999px;
  background:color-mix(in srgb,var(--text) 13%,var(--panel));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text) 14%,transparent);
}
#timelineView .timeline-minimap-viewport{
  position:absolute;
  right:5px;
  width:11px;
  min-height:10px;
  border:2px solid color-mix(in srgb,var(--accent) 82%,#fff);
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 18%,transparent);
  pointer-events:none;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--panel) 78%,transparent);
}
#timelineView .timeline-minimap-current{
  position:absolute;
  right:2px;
  width:17px;
  height:3px;
  margin-top:-1px;
  border-radius:999px;
  background:var(--accent);
  pointer-events:none;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--panel) 84%,transparent);
}
#timelineView .timeline-minimap-point{
  position:absolute;
  top:var(--mini-p);
  right:0;
  transform:translateY(-50%);
  width:54px;
  height:24px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
  text-align:right;
}
#timelineView .timeline-minimap-point span{
  position:absolute;
  right:17px;
  top:50%;
  transform:translateY(-50%);
  max-width:34px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px;
  font-weight:850;
  line-height:1.1;
  padding:1px 2px;
  border-radius:4px;
  background:color-mix(in srgb,var(--panel) 88%,transparent);
}
#timelineView .timeline-minimap-point i{
  position:absolute;
  right:6px;top:50%;
  width:9px;height:9px;
  transform:translateY(-50%);
  border-radius:50%;
  background:color-mix(in srgb,var(--muted) 65%,var(--panel));
  border:2px solid var(--panel);
}
#timelineView .timeline-minimap-point:hover span,
#timelineView .timeline-minimap-point:focus-visible span{color:var(--text);background:var(--panel)}
#timelineView .timeline-minimap-point:hover i,
#timelineView .timeline-minimap-point:focus-visible i{background:var(--accent)}
@media(max-width:700px){
  #timelineView .timeline-minimap{right:max(2px,env(safe-area-inset-right));width:50px;bottom:calc(68px + env(safe-area-inset-bottom))}
  #timelineView .timeline-minimap-track,#timelineView .timeline-minimap-point{width:48px}
  #timelineView .timeline-minimap-title,#timelineView .timeline-minimap-now{font-size:11px;max-width:48px}
  #timelineView .timeline-minimap-point span{right:16px;max-width:30px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){#timelineView .timeline-minimap{transition:none}}

/* =========================================================
   v6.0.62 — 100改善 P2-2 ユーザー列幅調整
   元号 / 天皇 / 政治 / 出来事を独立して「狭め・標準・広め」に変更。
   50年帯・西暦の固定幅、年代位置、文字サイズは変更しない。
   ========================================================= */
.timeline-column-width-controls{
  display:grid;
  grid-template-columns:minmax(160px,1.5fr) repeat(4,minmax(92px,1fr));
  gap:7px;
  align-items:end;
  margin:8px 0 10px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:11px;
  background:color-mix(in srgb,var(--panel2) 88%,transparent);
}
.timeline-column-width-title{align-self:center;min-width:0}
.timeline-column-width-title b{display:block;font-size:11px}
.timeline-column-width-title span{display:block;font-size:8px;color:var(--muted);line-height:1.35;margin-top:2px}
.timeline-column-width-controls label{display:grid;gap:3px;font-size:9px;color:var(--muted);min-width:0}
.timeline-column-width-controls select{width:100%;min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);padding:6px 7px}

/* Portrait uses CSS variables, so each category can change without affecting the sticky year columns. */
@media(max-width:950px){
  html[data-timeline-width-gengo="narrow"] #timelineView .v6-sheet{--p0-col-gengo:128px}
  html[data-timeline-width-gengo="wide"] #timelineView .v6-sheet{--p0-col-gengo:188px}
  html[data-timeline-width-emperor="narrow"] #timelineView .v6-sheet{--p0-col-emperor:162px}
  html[data-timeline-width-emperor="wide"] #timelineView .v6-sheet{--p0-col-emperor:238px}
  html[data-timeline-width-politics="narrow"] #timelineView .v6-sheet{--p0-col-context:238px}
  html[data-timeline-width-politics="wide"] #timelineView .v6-sheet{--p0-col-context:350px}
  html[data-timeline-width-detail="narrow"] #timelineView .v6-sheet{--p0-col-detail:187px}
  html[data-timeline-width-detail="wide"] #timelineView .v6-sheet{--p0-col-detail:275px}
}

/* Nanbokucho keeps its extra room while still respecting the user's chosen width profile. */
@media(max-width:950px) and (orientation:portrait){
  html[data-timeline-width-gengo="narrow"] #timelineView .v6-sheet.nanbokucho-width-expanded{--p0-col-gengo:204px}
  html[data-timeline-width-gengo="wide"] #timelineView .v6-sheet.nanbokucho-width-expanded{--p0-col-gengo:300px}
  html[data-timeline-width-emperor="narrow"] #timelineView .v6-sheet.nanbokucho-width-expanded{--p0-col-emperor:255px}
  html[data-timeline-width-emperor="wide"] #timelineView .v6-sheet.nanbokucho-width-expanded{--p0-col-emperor:375px}
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-gengo-band.court-south,
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-gengo-band.court-north{min-width:calc(var(--p0-col-gengo)/2)!important}
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.south,
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.north,
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.dual-claim-left,
  #timelineView .v6-sheet.nanbokucho-width-expanded[data-mobile-lane="basic"]>.guide-emperor-span.north.precursor{min-width:calc(var(--p0-col-emperor)/2)!important}
}

@media(max-width:700px){
  .timeline-column-width-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .timeline-column-width-title{grid-column:1/-1}
  .timeline-column-width-title b{font-size:12px}
  .timeline-column-width-title span{font-size:9px}
  .timeline-column-width-controls label{font-size:10px}
}


/* =========================================================
   v6.0.63 — 100改善 P2-3「50年帯ダブルタップ拡大」
   通常タップを維持しつつ、ダブルタップ/ダブルクリックも同じ50年拡大へ接続。
   ========================================================= */
.half-century-band[data-half-century-focus] .half-century-zoom-mark::after{content:' / 2回タップ';font-size:8px;font-weight:800;opacity:.72}
@media(pointer:fine){.half-century-band[data-half-century-focus] .half-century-zoom-mark::after{content:' / ダブルクリック'}}

/* ============================================================
   v6.0.64 — 100改善 P2-4 長押しで年代固定
   固定した年代と、実際にスクロールしている現在年を分けて確認する。
   ============================================================ */
#timelineView .timeline-position.is-year-pinned{
  border-color:color-mix(in srgb,#c28a16 60%,var(--line))!important;
  background:color-mix(in srgb,#fff3cf 18%,var(--panel))!important;
  box-shadow:0 7px 20px rgba(120,86,18,.13)!important;
}
#timelineView .timeline-pin-badge{
  flex:0 0 auto;
  border:1px solid color-mix(in srgb,#c28a16 55%,var(--line));
  border-radius:999px;
  padding:2px 6px;
  background:color-mix(in srgb,#f0bd42 16%,var(--panel));
  color:color-mix(in srgb,#7a5200 82%,var(--text));
  font-size:10px;
  line-height:1.2;
  font-weight:900;
}
#timelineView .timeline-pin-clear{
  flex:0 0 auto;
  border:1px solid color-mix(in srgb,#c28a16 45%,var(--line));
  border-radius:8px;
  padding:3px 7px;
  background:var(--panel);
  color:var(--text);
  font:inherit;
  font-size:10px;
  line-height:1.25;
  font-weight:900;
  cursor:pointer;
}
#timelineView .timeline-pin-clear:active{transform:translateY(1px)}
#timelineView .sheet-date,
#timelineView .half-century-band[data-half-century-focus]{
  -webkit-touch-callout:none;
  user-select:none;
}
@media(max-width:700px){
  #timelineView .timeline-position.is-year-pinned .timeline-position-main{overflow-x:auto;scrollbar-width:none}
  #timelineView .timeline-position.is-year-pinned .timeline-position-main::-webkit-scrollbar{display:none}
  #timelineView .timeline-pin-badge{font-size:9px;padding:2px 5px}
  #timelineView .timeline-pin-clear{font-size:9px;padding:3px 6px}
}

/* =========================================================
   v6.0.65 — 100改善 P2-5 情報密度に応じた自動ズーム
   Dense years receive extra chronological display rows in JS.
   Keep the treatment quiet: the extra space is for reading, not decoration.
   ========================================================= */
#timelineView .v6-sheet>.auto-density-year{
  align-self:stretch;
  min-height:0;
}
#timelineView .v6-sheet>.sheet-date.auto-density-year{
  justify-content:flex-start;
}
#timelineView .auto-density-note{
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin-left:6px;
  padding:2px 6px;
  border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 5%,var(--panel));
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}

/* =========================================================
   v6.0.66 — 100改善 P2-6 2本指ピンチで年表の縦倍率を変更
   ページ全体ではなく、年表の実年代グリッドだけを拡大・縮小する。
   ========================================================= */
#timelineView .timeline-sheet-scroll[data-timeline-pinch-surface="1"]{
  /* single-finger horizontal/vertical pan is allowed; native page pinch-zoom is not */
  touch-action:pan-x pan-y!important;
}
#timelineView .timeline-sheet-scroll.timeline-pinch-zooming{
  scroll-snap-type:none!important;
  overscroll-behavior:contain!important;
}
#timelineView .v6-sheet.timeline-pinch-zooming{
  user-select:none;
  -webkit-user-select:none;
}
#timelineView .timeline-pinch-badge{
  position:fixed;
  left:50%;
  top:calc(var(--topbar-h,64px) + 72px);
  transform:translate(-50%,-8px) scale(.96);
  z-index:130;
  padding:7px 11px;
  border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--panel) 94%,transparent);
  color:var(--text);
  font-size:12px;
  font-weight:900;
  line-height:1;
  box-shadow:0 5px 18px rgba(0,0,0,.13);
  opacity:0;
  pointer-events:none;
  transition:opacity .13s ease,transform .13s ease;
}
#timelineView .timeline-pinch-badge.is-active{
  opacity:1;
  transform:translate(-50%,0) scale(1);
}
#timelineView .timeline-pinch-badge.is-changing{
  border-color:color-mix(in srgb,var(--accent) 70%,var(--line));
}
@media (min-width:951px){
  #timelineView .timeline-pinch-badge{display:none}
}

/* =========================================================
   v6.0.67 — 100改善 P2-7 高度なラベル衝突回避
   年代計算だけでなく、実際に描画されたラベルの高さ・列幅を測定して
   元号／天皇の外部ラベルを再配置する。短い政治・制度帯は補助情報だけ
   折りたたみ、人物名を最優先して文字同士の衝突を防ぐ。
   ========================================================= */
#timelineView .period-external-label{
  transform:translateY(calc(-50% + var(--p07-label-shift,0px) + var(--p27-runtime-shift,0px)))!important;
}
#timelineView .period-external-label.collision-moved{
  box-shadow:0 3px 10px rgba(0,0,0,.13)!important;
}
/* 密集時は年代レンジだけを一時的に畳み、元号名・天皇名は縮小しない。 */
#timelineView .period-external-label.collision-compact{
  min-height:26px!important;
  padding-top:3px!important;
  padding-bottom:3px!important;
}
#timelineView .period-external-label.collision-compact>small{
  display:none!important;
}
#timelineView .period-external-label.collision-compact>b{
  font-size:14px!important;
  line-height:1.2!important;
}
html[data-timeline-text="large"] #timelineView .period-external-label.collision-compact>b{
  font-size:17px!important;
}

/* 実寸が短い政治・制度帯は、名前だけを優先して内部テキストの重なりを防ぐ。 */
#timelineView .collision-label-compact{
  padding:3px 5px!important;
  justify-content:center!important;
  overflow:hidden!important;
}
#timelineView .collision-label-compact>small,
#timelineView .collision-label-compact>span,
#timelineView .collision-label-compact>em,
#timelineView .collision-label-compact>.power-role-chip,
#timelineView .collision-label-compact>.power-relation-chip{
  display:none!important;
}
#timelineView .collision-label-compact>b{
  display:block!important;
  font-size:14px!important;
  line-height:1.2!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#timelineView .collision-label-name-only>b{
  white-space:nowrap!important;
}
html[data-timeline-text="large"] #timelineView .collision-label-compact>b{
  font-size:17px!important;
}


/* =========================================================
   v6.0.68 — 100改善 #71 スクロール中は不要な視覚効果を停止
   年表の縦／横スクロール中だけ、影・ぼかし・アニメーションなど
   読解に不要な描画負荷を一時停止し、停止後140msで自動復帰する。
   ========================================================= */
#timelineView.timeline-scrolling .sheet-event,
#timelineView.timeline-scrolling .period-external-label,
#timelineView.timeline-scrolling .guide-gengo-band,
#timelineView.timeline-scrolling .guide-emperor-span,
#timelineView.timeline-scrolling .guide-support-band,
#timelineView.timeline-scrolling .guide-shogun-band,
#timelineView.timeline-scrolling .guide-tenkabito-band,
#timelineView.timeline-scrolling .guide-prime-minister-band,
#timelineView.timeline-scrolling .guide-regime-band,
#timelineView.timeline-scrolling .guide-institutional-top-band,
#timelineView.timeline-scrolling .guide-power-band,
#timelineView.timeline-scrolling .timeline-minimap-thumb,
#timelineView.timeline-scrolling .timeline-pinch-badge{
  transition:none!important;
  animation:none!important;
}
#timelineView.timeline-scrolling .timeline-position,
#timelineView.timeline-scrolling .timeline-minimap,
#timelineView.timeline-scrolling .timeline-sheet-era,
#timelineView.timeline-scrolling .period-external-label,
#timelineView.timeline-scrolling .sheet-event,
#timelineView.timeline-scrolling .timeline-pinch-badge{
  box-shadow:none!important;
  filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#timelineView.timeline-scrolling .sheet-event:hover,
#timelineView.timeline-scrolling .sheet-office-band:hover{
  transform:none!important;
  filter:none!important;
}


/* =========================================================
   v6.0.69 — 100改善 #72 横操作と縦操作を明確に判定
   1本指スワイプは移動量と優勢軸を見て方向をロックする。
   横意図では年表Xだけ、縦意図ではページYだけを優先する。
   ========================================================= */
#timelineView .timeline-sheet-scroll[data-timeline-pinch-surface="1"]{
  /* Native vertical pan stays available; horizontal movement is handled after JS intent-lock. */
  touch-action:pan-y!important;
}
#timelineView .timeline-sheet-scroll.timeline-pan-x{
  scroll-snap-type:none!important;
  overscroll-behavior-x:contain!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}
#timelineView .timeline-sheet-scroll.timeline-pan-y{
  overscroll-behavior-y:auto!important;
}


/* =========================================================
   v6.0.70 — 100改善 #73 iPhone斜めスクロールのガタつき防止
   横意図を4px段階で先読みし、確定後はX軸を保持。
   Safariの端バウンドと微小なサブピクセル揺れも抑える。
   ========================================================= */
#timelineView .timeline-sheet-scroll.timeline-pan-x-guard,
#timelineView .timeline-sheet-scroll.timeline-pan-x{
  scroll-behavior:auto!important;
  overscroll-behavior-x:none!important;
  overscroll-behavior-inline:none!important;
}
#timelineView .timeline-sheet-scroll.timeline-pan-x-guard{
  -webkit-user-select:none!important;
  user-select:none!important;
}


/* =========================================================
   v6.0.71 — 100改善 #85 スマホ上部の設定UIをコンパクト化
   機能は隠さず、スマホ縦画面だけ高さを削減する。
   PC / 横画面 / 年代位置 / 列幅そのもの / 文字大モードは変更しない。
   ========================================================= */
@media(max-width:700px) and (orientation:portrait){
  #timelineView .timeline-controls.v4-controls{
    padding:9px 8px;
  }
  #timelineView .timeline-controls.v4-controls>.section-title{
    margin-bottom:5px;
    min-height:24px;
  }
  #timelineView .timeline-controls.v4-controls>.section-title h3{
    margin:0;
    font-size:14px;
    line-height:1.2;
  }
  #timelineView .timeline-controls.v4-controls>.section-title span{
    font-size:10px;
  }

  /* 5つの表示モードは2段にせず、横1列のコンパクト切替にする。 */
  #timelineView .v4-mode-switch{
    display:flex;
    grid-template-columns:none;
    gap:5px;
    overflow-x:auto;
    overflow-y:hidden;
    margin:0 0 6px;
    padding:0 0 2px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  #timelineView .v4-mode-switch::-webkit-scrollbar{display:none}
  #timelineView .v4-mode-switch button{
    flex:0 0 auto;
    min-width:82px;
    min-height:34px;
    padding:6px 8px;
    border-radius:9px;
    scroll-snap-align:start;
    text-align:center;
    white-space:nowrap;
  }
  #timelineView .v4-mode-switch button b{
    font-size:11px;
    line-height:1.15;
  }
  #timelineView .v4-mode-switch button span{display:none}

  /* 表示密度 / 時間ズーム / 行間 / 文字サイズを1段に集約。 */
  #timelineView .v4-option-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px;
    margin:0 0 6px;
  }
  #timelineView .v4-option-grid label{
    gap:2px;
    min-width:0;
    font-size:8.5px;
    line-height:1.15;
    white-space:nowrap;
  }
  #timelineView .v4-option-grid select{
    min-width:0;
    width:100%;
    padding:5px 2px;
    border-radius:8px;
    font-size:10.5px;
  }

  /* 列幅もタイトル1行＋4項目1段にして縦寸法を抑える。 */
  #timelineView .timeline-column-width-controls{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px;
    margin:5px 0 6px;
    padding:6px;
  }
  #timelineView .timeline-column-width-title{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:16px;
  }
  #timelineView .timeline-column-width-title b{font-size:10px}
  #timelineView .timeline-column-width-title span{display:none}
  #timelineView .timeline-column-width-controls label{
    gap:2px;
    min-width:0;
    font-size:8.5px;
    line-height:1.15;
  }
  #timelineView .timeline-column-width-controls select{
    min-width:0;
    width:100%;
    padding:5px 2px;
    font-size:10.5px;
  }

  /* フリーワードは全幅、3つの絞り込みはその下の1段。 */
  #timelineView .v4-search-tools{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
    margin:5px 0 6px;
  }
  #timelineView .v4-search-tools .search-input{
    grid-column:1/-1;
    min-width:0;
    padding:8px 9px;
    font-size:12px;
  }
  #timelineView .v4-search-tools select{
    min-width:0;
    width:100%;
    margin-top:0;
    padding:6px 3px;
    border-radius:8px;
    font-size:10.5px;
  }

  /* レーン切替の読みトグル周辺も余白だけ縮める。 */
  #timelineView .timeline-field-filter{
    margin-top:2px;
    margin-bottom:4px;
  }
  #timelineView .timeline-reading-toggle{
    padding:4px 7px;
    font-size:9.5px;
  }
}

/* =========================================================
   v6.0.72 — 100改善 #86 実サイト確認後：年表設定の自動折りたたみ
   年表を読み始めたら設定群を畳み、現在の設定概要だけ残す。
   ボタンでいつでも再展開でき、横画面では導入部もさらに圧縮する。
   ========================================================= */
#timelineView .timeline-controls-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
#timelineView .timeline-controls-title>div{
  display:flex;
  align-items:baseline;
  gap:8px;
  min-width:0;
}
#timelineView .timeline-controls-title>div>span{white-space:nowrap}
#timelineView .timeline-controls-toggle{
  flex:0 0 auto;
  min-height:34px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--panel2);
  color:var(--accent2);
  padding:5px 9px;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
#timelineView .timeline-controls-body{display:block}
#timelineView .timeline-controls-collapsed-summary{
  display:none;
  margin-top:2px;
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#timelineView.timeline-controls-collapsed .timeline-controls-body{display:none}
#timelineView.timeline-controls-collapsed .timeline-controls-collapsed-summary{display:block}
#timelineView.timeline-controls-collapsed .timeline-controls.v4-controls{
  padding-top:8px;
  padding-bottom:8px;
}
#timelineView.timeline-controls-collapsed .timeline-controls.v4-controls>.section-title{margin-bottom:2px}

@media(max-width:800px){
  #timelineView .timeline-controls-toggle{min-height:32px;padding:4px 8px;font-size:9.5px}
  #timelineView.timeline-controls-collapsed .timeline-controls.v4-controls{
    position:relative;
    margin-top:7px;
    margin-bottom:7px;
  }
}

/* 実サイトのiPhone横画面では導入カードが年表領域を圧迫していたため、
   横向き・低い画面だけ説明を最小化。年表の機能や本文は削除しない。 */
@media(orientation:landscape) and (max-height:520px){
  #timelineView .timeline-hero{
    margin:2px 0 6px!important;
    padding:7px 12px!important;
    min-height:0!important;
    border-radius:16px!important;
  }
  #timelineView .timeline-hero .pill{
    padding:2px 7px!important;
    font-size:9px!important;
    line-height:1.25!important;
  }
  #timelineView .timeline-hero h2{
    margin:5px 0 0!important;
    font-size:18px!important;
    line-height:1.15!important;
  }
  #timelineView .timeline-hero h2 small{font-size:9px!important}
  #timelineView .timeline-hero p{display:none!important}
  #timelineView .timeline-position{margin-top:4px!important;margin-bottom:5px!important}
  #timelineView .timeline-controls.v4-controls{margin-top:5px!important}
}

/* =========================================================
   v6.0.73 — 実年表構造改善 + 100改善 #87
   年表本体を最優先。スマホは設定を1ボタンへまとめ、
   表示レーンだけ常時操作可能にする。概要・凡例・5概念は
   本体後段の「年表の見方・補助情報」へ集約する。
   ========================================================= */
#timelineView .timeline-primary-lanes{
  margin:7px 0 9px;
  padding:7px 9px;
  border:1px solid var(--line);
  border-radius:12px;
  background:color-mix(in srgb,var(--panel) 96%,transparent);
}
#timelineView .timeline-primary-lanes-title{
  display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  margin:0 2px 4px;
}
#timelineView .timeline-primary-lanes-title b{font-size:11px;color:var(--accent2)}
#timelineView .timeline-primary-lanes-title span{font-size:9px;color:var(--muted)}
#timelineView .timeline-primary-lanes .timeline-field-filter{margin:0;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
#timelineView .timeline-primary-lanes .timeline-field-filter::-webkit-scrollbar{display:none}
#timelineView .timeline-primary-lanes .timeline-field-filter button,
#timelineView .timeline-primary-lanes .timeline-reading-toggle{flex:0 0 auto;white-space:nowrap}
#timelineView #timelineAuxPanel:empty{display:none}
#timelineView #masterTimeline{margin-top:7px}

#timelineView .timeline-learning-support{margin-top:12px;padding:0;overflow:hidden}
#timelineView .timeline-learning-support>summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:46px;padding:10px 13px;font-weight:900;color:var(--accent2);
}
#timelineView .timeline-learning-support>summary::-webkit-details-marker{display:none}
#timelineView .timeline-learning-support>summary:after{content:'＋';font-size:18px;line-height:1;color:var(--muted)}
#timelineView .timeline-learning-support[open]>summary:after{content:'−'}
#timelineView .timeline-learning-support>summary span{font-size:10px;font-weight:700;color:var(--muted);margin-left:auto}
#timelineView .timeline-learning-support-body{padding:0 10px 10px;border-top:1px solid var(--line)}
#timelineView .timeline-learning-support .timeline-overview{margin:10px 0;padding:12px;box-shadow:none;background:var(--panel2)}
#timelineView .timeline-learning-support .timeline-legend{position:static!important;top:auto!important;margin:8px 0;padding:7px 2px;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#timelineView .timeline-learning-support .timeline-concept-guide{margin:8px 0}
#timelineView .timeline-learning-support .timeline-scroll-hint{margin:8px 2px 2px}

@media(max-width:800px){
  /* 「サイトを開いたらまず年表」が分かるよう、導入カードを説明文ではなく見出し化。 */
  #timelineView .timeline-hero{margin:2px 0 6px!important;padding:9px 11px!important;min-height:0!important;border-radius:16px!important}
  #timelineView .timeline-hero .pill{padding:2px 7px!important;font-size:9px!important;line-height:1.25!important}
  #timelineView .timeline-hero h2{margin:5px 0 0!important;font-size:19px!important;line-height:1.18!important}
  #timelineView .timeline-hero h2 small{font-size:9px!important}
  #timelineView .timeline-hero p{display:none!important}
  #timelineView .timeline-controls.v4-controls{margin:6px 0!important;padding:8px 9px!important}
  #timelineView .timeline-controls-toggle{min-width:52px;min-height:32px!important;padding:4px 9px!important;font-size:10px!important}
  #timelineView.timeline-controls-collapsed .timeline-controls-title h3{font-size:13px}
  #timelineView.timeline-controls-collapsed .timeline-controls-title>div>span{font-size:9px}
  #timelineView .timeline-controls-collapsed-summary{font-size:9.5px;line-height:1.35}
  #timelineView .timeline-primary-lanes{margin:5px 0 7px;padding:6px 7px}
  #timelineView .timeline-primary-lanes-title{display:none}
  #timelineView .timeline-primary-lanes .timeline-field-filter{gap:5px}
  #timelineView .timeline-primary-lanes .timeline-field-filter button{min-height:32px;padding:5px 9px;font-size:10px}
  #timelineView .timeline-primary-lanes .timeline-reading-toggle{min-height:32px;display:flex;align-items:center;font-size:10px}
  #timelineView #masterTimeline{margin-top:4px}
  #timelineView .timeline-learning-support>summary{min-height:44px;padding:9px 11px}
  #timelineView .timeline-learning-support>summary b{font-size:12px}
  #timelineView .timeline-learning-support>summary span{font-size:9px}
}
