/* RB002-VISUAL-20261107-v1. Presentation only; explicitly opted-in pages.
   Pair every text colour with an opaque surface. Decorative gradients occur
   outside text panels. Existing copy, route/region data and calculations stay intact. */
html[data-nlive-visual="20261107"] {
  --v-canvas:#f5f3ed;--v-paper:#fffdf8;--v-panel:#ffffff;--v-soft:#f4f3ee;
  --v-ink:#20364b;--v-muted:#4b5d6b;--v-line:#c6cfca;--v-strong-line:#708579;
  --v-accent:#245e69;--v-warm:#a14561;--v-tint:#eaf3f5;
  --v-field:#ffffff;--v-field-ink:#20364b;--v-focus:#934a31;
  --v-gold:#d5ac6e;--v-shadow:0 15px 40px #213b4c12;--v-small-shadow:0 4px 15px #213b4c0c;
  --frame-paper:var(--v-canvas);--frame-surface:var(--v-paper);--frame-ink:var(--v-ink);
  --frame-green:var(--v-accent);--frame-line:var(--v-line);--frame-soft:var(--v-tint);
  color-scheme:light;background:var(--v-canvas);color:var(--v-ink);
}
html[data-nlive-visual="20261107"][data-nlive-tone="night"] {
  --v-canvas:#0e1728;--v-paper:#172538;--v-panel:#203149;--v-soft:#24384d;
  --v-ink:#f6f4ee;--v-muted:#ced9e5;--v-line:#536a81;--v-strong-line:#90a7bd;
  --v-accent:#a8e2ed;--v-warm:#ffc0d4;--v-tint:#20394b;
  --v-field:#102136;--v-field-ink:#f6f4ee;--v-focus:#ffdc99;
  --v-gold:#e2bb7b;--v-shadow:0 18px 44px #050b1655;--v-small-shadow:0 6px 18px #050b1633;
  color-scheme:dark;
}
html[data-nlive-visual] body[data-frame-page] {
  background:var(--v-canvas);color:var(--v-ink);
  background-image:radial-gradient(ellipse at 0 0,var(--v-tint),transparent 42rem),radial-gradient(ellipse at 100% 18rem,var(--v-tint),transparent 36rem);
}
html[data-nlive-visual] body[data-frame-page] :is(.nf-head,.nf-foot) {
  background:var(--v-paper);color:var(--v-ink);border-color:var(--v-line);
}
html[data-nlive-visual] body[data-frame-page] .nf-head {border-top:4px solid var(--v-accent);box-shadow:var(--v-small-shadow)}
html[data-nlive-visual] body[data-frame-page] :is(.nf-brand,.nf-brand strong,.nf-nav a,.nf-foot a,.nt-picker) {color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] :is(.nf-brand span,.nf-foot-credit,.nf-crumb,.nf-crumb [aria-current],.nf-divider) {color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] .nf-crumb a {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] .nf-nav a:hover {background:var(--v-tint);color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] :is(.nt-picker select,.nt-picker option) {background:var(--v-field);color:var(--v-field-ink);border-radius:8px}
html[data-nlive-visual] body[data-frame-page] #main {
  --color:var(--v-accent);--ink:var(--v-ink);--deep:var(--v-accent);--edge:var(--v-line);
  --wash:var(--v-tint);--tint:var(--v-tint);--cw-section-ink:var(--v-ink);--cw-accent:var(--v-tint);
  color:var(--v-ink);
}
html[data-nlive-visual] body[data-frame-page] #main :is(.pr-detail,.sr-city) {
  --pr-ink:var(--v-ink);--pr-muted:var(--v-muted);--pr-link:var(--v-accent);--pr-line:var(--v-line);
  --pr-paper:var(--v-paper);--pr-panel:var(--v-panel);--pr-mist:var(--v-tint);--pr-rule:var(--v-strong-line);
  --pr-action:var(--v-accent);--pr-action-ink:var(--v-paper);
  --sr-paper:var(--v-paper);--sr-ink:var(--v-ink);--sr-muted:var(--v-muted);--sr-link:var(--v-accent);
  --sr-line:var(--v-line);--sr-wash:var(--v-tint);--sr-soft:var(--v-soft);--sr-sand:var(--v-tint);
  --sr-warm:var(--v-warm);--sr-gold:var(--v-gold);--sr-deep:var(--v-accent);
  --city-tint:var(--v-tint);--city-ink:var(--v-ink);--city-accent:var(--v-accent);
  color:var(--v-ink);background:var(--v-paper);
}
html[data-nlive-visual] body[data-frame-page] #main .pr-detail {box-shadow:var(--v-shadow);border-radius:20px 20px 0 0}
html[data-nlive-visual] body[data-frame-page] #main .hc-section {
  --hc-ink:var(--v-ink);--hc-paper:var(--v-panel);--hc-wash:var(--v-tint);--hc-line:var(--v-line);--hc-link:var(--v-accent);
}
html[data-nlive-visual] body[data-frame-page] #main .hp-section {
  --hp-ink:var(--v-ink);--hp-paper:var(--v-panel);--hp-wash:var(--v-tint);--hp-line:var(--v-line);--hp-link:var(--v-accent);
}
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-section,.ha-reading) {
  --ha-ink:var(--v-ink);--ha-paper:var(--v-paper);--ha-wash:var(--v-tint);--ha-line:var(--v-line);--ha-link:var(--v-accent);
}
html[data-nlive-visual] body[data-frame-page] #main .ha-reading {border-top:5px solid var(--v-accent);border-radius:18px 18px 0 0;box-shadow:var(--v-shadow)}
html[data-nlive-visual] body[data-frame-page] #main .ha-reading h1 {color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .ha-checklist {border-radius:14px}
/* The formerly white inputs used the inherited white night ink. This rule is
   more specific than frame-sections.css and sets BOTH sides of the colour pair. */
html[data-nlive-visual] body[data-frame-page] #main :is(textarea,select,input:not([type="radio"]):not([type="checkbox"]):not([type="range"])) {
  background:var(--v-field);color:var(--v-field-ink);-webkit-text-fill-color:var(--v-field-ink);
  border:1px solid var(--v-strong-line);border-radius:9px;caret-color:var(--v-field-ink);
}
html[data-nlive-visual] body[data-frame-page] #main :is(input,textarea)::placeholder {color:var(--v-muted);opacity:1}
html[data-nlive-visual] body[data-frame-page] #main select option {background:var(--v-field);color:var(--v-field-ink)}
html[data-nlive-visual] body[data-frame-page] #main :is(textarea,select,input:not([type="radio"]):not([type="checkbox"]):not([type="range"])):disabled {opacity:1;background:var(--v-soft);color:var(--v-muted);-webkit-text-fill-color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] #main :is(textarea,select,input:not([type="radio"]):not([type="checkbox"]):not([type="range"]))[aria-invalid="true"] {border:2px dashed var(--v-warm)}
html[data-nlive-visual] body[data-frame-page] :is(a,button,summary,input,select,textarea):focus-visible {outline:3px solid var(--v-focus);outline-offset:3px}
html[data-nlive-visual] body[data-frame-page] #main :is(a,button,summary,input,select,textarea):focus-visible {outline:3px solid var(--v-focus);outline-offset:3px}
/* Panoramic original art remains intact. Sheet-cell coordinates are never reset. */
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-hero {
  padding:clamp(14px,2.6vw,32px);gap:clamp(14px,2.5vw,32px);border:0;
  border-top:5px solid var(--v-accent);border-radius:20px 20px 0 0;
  background-color:var(--v-tint);background-image:none;overflow:hidden;
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-lead {padding:12px 4px;align-self:center}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-lead h1 {letter-spacing:.02em;line-height:1.35;color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-city-name {color:var(--v-accent);font-size:.64em;margin-bottom:.4em}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-location {color:var(--v-muted);font-size:.8rem}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-banner {
  height:auto;min-height:0;aspect-ratio:auto;align-self:center;display:flex;flex-direction:column;
  border:5px solid var(--v-panel);border-radius:16px;box-shadow:var(--v-shadow);background:var(--v-panel);overflow:hidden;
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-banner > img {
  position:static;inset:auto;display:block;width:100%;height:auto;min-height:0;max-height:none;object-fit:contain;transform:none;
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-banner figcaption {
  position:static;inset:auto;max-width:100%;margin:0;padding:9px 11px;border:0;
  color:var(--v-muted);background:var(--v-panel);font-size:.76rem;line-height:1.6;
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city > .sr-actions {padding-block:20px;background:var(--v-paper)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-toc {
  border-block:1px solid var(--v-line);background:var(--v-panel);gap:.65rem 1rem;padding-block:16px;
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-toc ul {gap:6px}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-toc li {border:0}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-toc a {
  padding:8px 12px;border:1px solid var(--v-line);border-radius:999px;background:var(--v-soft);color:var(--v-accent);font-size:.84rem;
}
/* Consistent editorial hierarchy without changing section order or text. */
html[data-nlive-visual] body[data-frame-page] #main :is(.sr-section,.hc-directory) {color:var(--v-ink);background:var(--v-paper)}
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-flow,.ng-plan,.sr-setup,.th-search,.hp-search) {background:var(--v-soft)}
html[data-nlive-visual] body[data-frame-page] #main :is(.sr-heading h2,.hc-directory h2,.ha-section h2) {
  padding:0 0 .7rem 1rem;margin-bottom:1rem;line-height:1.55;color:var(--v-ink);
  border-bottom:1px solid var(--v-line);border-inline-start:5px solid var(--v-accent);
}
html[data-nlive-visual] body[data-frame-page] #main .sr-heading h2::after {display:none}
html[data-nlive-visual] body[data-frame-page] #main :is(.sr-heading p,.sr-section > p,.th-hero p,.hc-guide-copy p) {color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] #main :is(.sr-scenarios > div,.hc-highlights a,.hc-highlights > div,.hp-place-group,.th-memberships) {
  padding:1rem 1.15rem;border:1px solid var(--v-line);border-radius:14px;background:var(--v-panel);color:var(--v-ink);box-shadow:var(--v-small-shadow);
}
html[data-nlive-visual] body[data-frame-page] #main .sr-scenarios > div {border-top:4px solid var(--v-gold)}
html[data-nlive-visual] body[data-frame-page] #main :is(.hc-eyebrow,.hc-highlights strong,.hc-guide-copy h3,.hc-guide-link) {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main :is(.hc-local-scope,.th-local-note,.sp-support) {
  background:var(--v-tint);color:var(--v-ink);border-inline-start:4px solid var(--v-accent);border-radius:0 12px 12px 0;
}
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-flow-list li,.ha-checklist li) {border-color:var(--v-line)}
html[data-nlive-visual] body[data-frame-page] #main .ha-flow-list li::marker {color:var(--v-accent);font-weight:700}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-calc {background:var(--v-paper)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-row {
  background:var(--v-panel);border:1px solid var(--v-line);border-radius:14px;padding:1.1rem;margin-top:.75rem;box-shadow:var(--v-small-shadow);
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-row legend {padding:0 .25rem;color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-row label {color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-result {
  background:var(--v-tint);color:var(--v-ink);border:1px solid var(--v-line);border-top:4px solid var(--v-accent);
  border-radius:15px;padding:clamp(17px,2.6vw,28px);box-shadow:var(--v-small-shadow);
}
html[data-nlive-visual] body[data-frame-page] #main .sr-city :is(.sp-money,.sp-result h3) {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city :is(.sp-caveat,.sp-zero,.sp-message,.sp-breakdown) {color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city button.sp-add {color:var(--v-accent);background:var(--v-panel);border:1px solid var(--v-strong-line);border-radius:999px;padding:.55rem 1rem}
html[data-nlive-visual] body[data-frame-page] #main .sr-city button.sp-remove {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-terms {border-top:4px solid var(--v-accent);border-radius:14px;overflow:hidden}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-terms dt {background:var(--v-tint);color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-terms dd {background:var(--v-panel);color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-questions {border:0;display:grid;gap:9px}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-questions details {border:1px solid var(--v-line);border-radius:12px;background:var(--v-panel);padding-inline:14px}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-questions summary {color:var(--v-ink);padding-block:15px}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-questions details[open] {border-color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-questions details[open] p {color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] #main .sr-contact-strip {border:1px solid var(--v-line);border-radius:15px;background:var(--v-tint);box-shadow:var(--v-small-shadow)}
/* Region selectors remain readable place names, not pictorial substitutes. */
html[data-nlive-visual] body[data-frame-page] #main :is(.th-hero,.ng-head) {
  background:var(--v-tint);color:var(--v-ink);border:0;border-top:5px solid var(--v-accent);border-radius:20px 20px 0 0;
}
html[data-nlive-visual] body[data-frame-page] #main .th-hero {padding:clamp(14px,2.6vw,30px);gap:clamp(14px,2.4vw,28px)}
html[data-nlive-visual] body[data-frame-page] #main .th-hero-copy {padding:8px 4px}
html[data-nlive-visual] body[data-frame-page] #main :is(.th-hero h1,.ng-head h1) {color:var(--v-ink);letter-spacing:.02em}
html[data-nlive-visual] body[data-frame-page] #main .th-hero figure {border:5px solid var(--v-panel);border-radius:16px;overflow:hidden;box-shadow:var(--v-shadow)}
html[data-nlive-visual] body[data-frame-page] #main .th-hero figcaption {color:var(--v-muted);background:var(--v-panel);padding:9px 11px;line-height:1.6}
html[data-nlive-visual] body[data-frame-page] #main .th-kicker {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main .th-hero-search {color:var(--v-accent);background:var(--v-panel);border:1px solid var(--v-strong-line);border-radius:999px}
html[data-nlive-visual] body[data-frame-page] #main .ng-head {padding:clamp(18px,3vw,36px);gap:24px}
html[data-nlive-visual] body[data-frame-page] #main .hk-zone-scene {flex-basis:38%;border:5px solid var(--v-panel);border-radius:15px;box-shadow:var(--v-shadow);overflow:hidden}
html[data-nlive-visual] body[data-frame-page] #main .hk-zone-scene img {height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
html[data-nlive-visual] body[data-frame-page] #main .hk-zone-scene figcaption {position:static;color:var(--v-muted);background:var(--v-panel);padding:8px 10px;line-height:1.6}
html[data-nlive-visual] body[data-frame-page] #main :is(.th-pref-card,.th-zone-card,.th-city-grid a,.th-result-list a,.ng-places a,.hp-region-links a) {
  color:var(--v-accent);background:var(--v-panel);border:1px solid var(--v-line);border-radius:12px;box-shadow:var(--v-small-shadow);
}
html[data-nlive-visual] body[data-frame-page] #main :is(.th-pref-card,.th-zone-card) {border-top:4px solid var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main :is(.th-pref-card span,.th-zone-card p,.th-city-grid span,.th-result-list span,.ng-places i) {color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] #main .hp-region-links a {padding:9px 12px;min-height:44px}
html[data-nlive-visual] body[data-frame-page] #main :is(.ng-group h3,.hp-region-group h3,.th-group h3) {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main :is(.ng-direct,.th-all-regions) {color:var(--v-ink);background:var(--v-panel);border-color:var(--v-line);border-radius:12px}
html[data-nlive-visual] body[data-frame-page] #main :is(.ng-direct summary,.th-all-regions summary) {color:var(--v-accent)}
/* Existing article imagery creates visual rhythm; its content/targets stay intact. */
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-article-card,.hc-guide-card) {background:var(--v-panel);color:var(--v-ink);border:1px solid var(--v-line);border-radius:15px;overflow:hidden;box-shadow:var(--v-small-shadow)}
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-article-card h3,.ha-article-card strong) {color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #main :is(.ha-article-card p,.ha-article-card small,.ha-article-meta) {color:var(--v-muted)}
/* Shared guide/consultation surfaces use the same night pairs. */
html[data-nlive-visual] body[data-frame-page] #main > section.block {background:var(--v-paper);color:var(--v-ink);border-top:1px solid var(--v-line)}
html[data-nlive-visual] body[data-frame-page] #main > section.block:nth-child(even) {background:var(--v-soft)}
html[data-nlive-visual] body[data-frame-page] #main :is(.work-summary,.lead,.ag-gateway > p,#rb-local) {color:var(--v-muted)}
html[data-nlive-visual] body[data-frame-page] #main .block :is(.work-preparation,.sk-result,.sk-choice,.picture-choice,.cards article) {background:var(--v-panel);color:var(--v-ink);border:1px solid var(--v-line);border-radius:12px;padding:14px}
html[data-nlive-visual] body[data-frame-page] #main :is(.sk-result p,.sk-result strong,.cw-say,.cw-copy p,.sd-pay-intro p) {color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #main :is(.cw-act,.ag-region[open] summary) {background:var(--v-tint);color:var(--v-accent)}
html[data-nlive-visual] body[data-frame-page] #apply .contact-methods a {color:var(--v-accent);background:var(--v-panel);border:1px solid var(--v-strong-line);border-radius:999px}
html[data-nlive-visual] body[data-frame-page] #apply .contact-methods .line {background:#087343;color:#fff;border-color:#087343}
html[data-nlive-visual] body[data-frame-page] #main :is(.consult-memo,.ag-region) {color:var(--v-ink);border-color:var(--v-line)}
html[data-nlive-visual] body[data-frame-page] #main :is(.consult-memo summary,.consult-memo label,.ag-region summary) {color:var(--v-accent)}
/* The established green LINE dock remains unchanged and above the decoration. */
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-line {background:#087343;color:#fff;border-color:#087343}
html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-line:hover {background:#075d39;color:#fff}
html[data-nlive-visual] body[data-frame-page] #main #home-top.dh-home {
  --dh-paper:var(--v-paper);--dh-ink:var(--v-ink);--dh-muted:var(--v-muted);--dh-green:var(--v-accent);--dh-rule:var(--v-line);
  --night-panel:var(--v-panel);--night-raised:var(--v-soft);--night-accent:var(--v-accent);
}
html[data-nlive-visual] body[data-frame-page] #home-top.dh-home :is(.dh-hero,.dh-intro,.dh-contact) {background:var(--v-tint);color:var(--v-ink)}
html[data-nlive-visual] body[data-frame-page] #home-top.dh-home .dh-hero-photo {border-radius:20px;box-shadow:var(--v-shadow)}
html[data-nlive-visual] body[data-frame-page] #home-top.dh-home .dh-quick a {border-radius:13px;background:var(--v-panel);color:var(--v-ink);border:1px solid var(--v-line);box-shadow:var(--v-small-shadow)}
html[data-nlive-visual] body[data-frame-page] #home-top.dh-home :is(.dh-pay,.dh-comparison thead th,.dh-comparison tbody th,.dr-row h3) {background:var(--v-tint);color:var(--v-ink)}
@container nliveCity (min-width:650px) {
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-hero {grid-template-columns:minmax(0,52%) minmax(0,1fr)}
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-lead h1 {font-size:clamp(1.8rem,3.1cqw,2.8rem)}
}
@media(max-width:760px) {
  html[data-nlive-visual] body[data-frame-page] #main .th-hero {gap:16px;padding:16px}
  html[data-nlive-visual] body[data-frame-page] #main .th-hero-copy {padding:4px}
  html[data-nlive-visual] body[data-frame-page] #main .ng-head {flex-direction:column;align-items:stretch;gap:16px}
  html[data-nlive-visual] body[data-frame-page] #main .hk-zone-scene {width:100%;flex-basis:auto;max-width:100%;align-self:stretch}
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-banner {border-width:4px;border-radius:13px}
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-lead h1 {font-size:clamp(1.65rem,6.3vw,2.3rem)}
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sr-toc a {padding:8px 10px;font-size:.81rem}
  html[data-nlive-visual] body[data-frame-page] #main .sr-city .sp-row {padding:.85rem}
}
@media(prefers-reduced-motion:reduce) {
  html[data-nlive-visual] {scroll-behavior:auto}
}

html[data-nlive-visual="20261107"][data-nlive-palette="chugoku"]{--v-accent:#5c438b;--v-tint:#f0ebf7;--v-warm:#a03d5b}
html[data-nlive-visual="20261107"][data-nlive-palette="chugoku"][data-nlive-tone="night"]{--v-accent:#d8bbff;--v-tint:#342947;--v-warm:#ffc0d2}
html[data-nlive-visual="20261107"][data-nlive-palette="shikoku"]{--v-accent:#176453;--v-tint:#e9f4ed;--v-warm:#a24240}
html[data-nlive-visual="20261107"][data-nlive-palette="shikoku"][data-nlive-tone="night"]{--v-accent:#9de4cd;--v-tint:#183c3a;--v-warm:#ffc5ad}
html[data-nlive-visual="20261107"][data-nlive-palette="tottori"]{--v-accent:#79435f;--v-tint:#f7eaf0;--v-warm:#8b561d}
html[data-nlive-visual="20261107"][data-nlive-palette="tottori"][data-nlive-tone="night"]{--v-accent:#edbed8;--v-tint:#412b40;--v-warm:#f6d69e}
html[data-nlive-visual="20261107"][data-nlive-palette="shimane"]{--v-accent:#3d5a49;--v-tint:#edf2e8;--v-warm:#8c4a35}
html[data-nlive-visual="20261107"][data-nlive-palette="shimane"][data-nlive-tone="night"]{--v-accent:#c0e3af;--v-tint:#2b3c30;--v-warm:#efc098}
html[data-nlive-visual="20261107"][data-nlive-palette="okayama"]{--v-accent:#814454;--v-tint:#faedef;--v-warm:#69511d}
html[data-nlive-visual="20261107"][data-nlive-palette="okayama"][data-nlive-tone="night"]{--v-accent:#ffc3d0;--v-tint:#422c39;--v-warm:#e9d49c}
html[data-nlive-visual="20261107"][data-nlive-palette="hiroshima"]{--v-accent:#155d80;--v-tint:#e7f2f8;--v-warm:#a13f51}
html[data-nlive-visual="20261107"][data-nlive-palette="hiroshima"][data-nlive-tone="night"]{--v-accent:#a4dcff;--v-tint:#1b354f;--v-warm:#ffbbd2}
html[data-nlive-visual="20261107"][data-nlive-palette="yamaguchi"]{--v-accent:#176268;--v-tint:#e6f4f1;--v-warm:#8a4b7e}
html[data-nlive-visual="20261107"][data-nlive-palette="yamaguchi"][data-nlive-tone="night"]{--v-accent:#9ee6df;--v-tint:#173b43;--v-warm:#e9bdf2}
html[data-nlive-visual="20261107"][data-nlive-palette="tokushima"]{--v-accent:#634c88;--v-tint:#f1edf7;--v-warm:#885022}
html[data-nlive-visual="20261107"][data-nlive-palette="tokushima"][data-nlive-tone="night"]{--v-accent:#d5c5f6;--v-tint:#342d49;--v-warm:#f5d0a5}
html[data-nlive-visual="20261107"][data-nlive-palette="kagawa"]{--v-accent:#79435f;--v-tint:#f7eaf0;--v-warm:#8b561d}
html[data-nlive-visual="20261107"][data-nlive-palette="kagawa"][data-nlive-tone="night"]{--v-accent:#edbed8;--v-tint:#412b40;--v-warm:#f6d69e}
html[data-nlive-visual="20261107"][data-nlive-palette="ehime"]{--v-accent:#814454;--v-tint:#faedef;--v-warm:#69511d}
html[data-nlive-visual="20261107"][data-nlive-palette="ehime"][data-nlive-tone="night"]{--v-accent:#ffc3d0;--v-tint:#422c39;--v-warm:#e9d49c}
html[data-nlive-visual="20261107"][data-nlive-palette="kochi"]{--v-accent:#176453;--v-tint:#e9f4ed;--v-warm:#a24240}
html[data-nlive-visual="20261107"][data-nlive-palette="kochi"][data-nlive-tone="night"]{--v-accent:#9de4cd;--v-tint:#183c3a;--v-warm:#ffc5ad}
/* The retained prefecture articles keep their original markup and content.
   This stylesheet is included only in the ChugokuShikoku visual asset. */
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading {
  margin:clamp(1.5rem,4vw,3rem) 0;
  padding:clamp(1.25rem,4vw,3rem);
  color:var(--v-ink);
  background:var(--v-paper);
  border:1px solid var(--v-line);
  border-top:5px solid var(--v-accent);
  border-radius:18px;
  box-shadow:var(--v-small-shadow);
  scroll-margin-top:6rem;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading :is(h2,h3,p,li) {
  color:var(--v-ink);
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading .pr-kicker {
  color:var(--v-accent);
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading :is(.lead,.pr-story-head) {
  background:transparent;
  color:var(--v-ink);
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading ul {
  padding-inline-start:1.4rem;
  line-height:1.9;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading li + li {
  margin-top:.6rem;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading .prompt {
  margin-top:1.5rem;
  padding:clamp(1rem,3vw,1.5rem);
  background:var(--v-tint);
  color:var(--v-ink);
  border:1px solid var(--v-line);
  border-radius:12px;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading a {
  color:var(--v-accent);
  text-decoration:underline;
  text-underline-offset:.2em;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading a.try {
  display:flex;
  gap:1rem;
  align-items:center;
  padding:.8rem;
  background:var(--v-panel);
  border:1px solid var(--v-line);
  border-radius:10px;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading a.try img {
  width:clamp(5rem,20vw,10rem);
  height:auto;
  border-radius:8px;
}
html[data-nlive-visual="20261107"] body[data-frame-page] #main #area-reading :focus-visible {
  outline:3px solid var(--v-focus);
  outline-offset:4px;
}
