.view-switcher{margin:10px 0 20px;font-family:"Yu Gothic UI","Hiragino Sans",system-ui,sans-serif;color:var(--ink)}
.view-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-width:640px}
.view-nav a{display:block;padding:9px 12px;background:var(--panel,var(--paper));border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--ink);min-width:0}
.view-nav a:hover{border-color:var(--accent,var(--green))}.view-nav a[aria-current=page]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.view-name{display:block;font-size:13px;font-weight:600}.view-purpose{display:block;font-size:10px;line-height:1.6;opacity:.75;margin-top:2px}
.view-state-bar{display:none;align-items:center;gap:12px;margin:10px 0 6px}.view-state-bar p{font-size:11px;color:var(--muted);margin:0;flex:1;overflow-wrap:anywhere}
.view-state-bar button{background:transparent;color:var(--accent,var(--green));font:inherit;font-size:11px;border:0;padding:4px 0;cursor:pointer}
.shared-options{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}.shared-options label{display:flex;gap:6px;align-items:center;font-size:11px;color:var(--muted)}
.shared-options select{font:inherit;font-size:11px;background:var(--panel,var(--paper));color:var(--ink);border:1px solid var(--line);padding:4px 8px;border-radius:4px;max-width:100%}
.shared-options input{accent-color:var(--accent,var(--green));margin:0}.view-notice{display:none;font-size:11px;color:var(--muted);margin:8px 0 0;border-left:2px solid var(--line);padding-left:8px}
.view-switcher a:focus-visible,.view-switcher button:focus-visible,.view-switcher select:focus-visible{outline:2px solid var(--accent,var(--green));outline-offset:3px}
.with-view-switcher .modes,.with-view-switcher .view-controls,.with-view-switcher .options,.with-view-switcher .navigator-options label,.with-view-switcher .overview-head label,.with-view-switcher label:has(#more),.with-view-switcher label:has(#outside),.with-view-switcher .control:has(#depth){display:none}
.with-view-switcher:not(.trace-page) .controls:has(#depth){grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr)}
.with-view-switcher .brand-bar>a:not(.brand),.with-view-switcher .masthead>.text-button{display:none}
.now-focus,.trace-focus{font:inherit;color:inherit;text-align:left;background:none;border:0;padding:0;cursor:pointer}.now-focus{display:block;width:100%;font-weight:600}.trace-focus{font-family:inherit;font-weight:inherit}.frame.focused,.now-list li.focused{outline:2px solid var(--accent);outline-offset:2px}
.topic-actions-bar{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.topic-action-link,.topic-save-btn{display:inline-flex;align-items:center;min-height:28px;padding:3px 10px;border:1px solid var(--line);border-radius:14px;background:var(--panel,var(--paper));color:var(--ink);font-size:11px;text-decoration:none;cursor:pointer;white-space:nowrap}
.topic-action-link.primary,.topic-save-btn{border-color:var(--accent,var(--green));color:var(--accent,var(--green));font-weight:700}
.topic-action-link:hover,.topic-save-btn:hover{border-color:var(--ink)}
.topic-save-btn:disabled{opacity:.5;cursor:default}
.topic-save-status{font-size:11px;color:var(--muted)}
@media(max-width:720px){.view-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.view-nav a{padding:8px}.view-state-bar{align-items:start}.view-purpose{font-size:10px}.with-view-switcher:not(.trace-page) .controls:has(#depth){grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.view-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.view-state-bar{display:block}.view-state-bar button{margin-top:4px}}

/* 根拠の範囲は、画面の切り替えと同じ行に置く */
.view-switcher{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
.view-switcher .view-nav{flex:0 1 640px}
.view-switcher .shared-options{flex:1 1 auto;justify-content:space-between}
