/* Adapted from the approved site-proposal-2026-11-10/r9.css: preserve the approved composition and interaction. Production routes, accessibility and language changes stay here. */

.g-view { position: absolute; z-index: 4; top: var(--space-4, 16px); right: var(--space-4, 16px);
  font: inherit; font-size: var(--t-small-size); line-height: 1.2; padding: 10px 16px; min-height: 44px; cursor: pointer;
  color: var(--rikyu-kuro); background: color-mix(in srgb, var(--rikyu-shiro) 92%, transparent);
  border: 1px solid color-mix(in srgb, var(--rikyu-kuro) 30%, transparent); border-radius: 999px;
  box-shadow: 0 2px 10px color-mix(in srgb, var(--rikyu-kuro) 22%, transparent); }
.g-view:hover { background: var(--rikyu-shiro); }
.g-view:focus-visible { outline: var(--focus-w, 2px) solid var(--rikyu-kuro); outline-offset: 3px; }
.g-labels { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.g-lab { position: absolute; left: 0; top: 0; opacity: 0; white-space: nowrap; text-align: center; line-height: 1.15;
  padding: 4px 10px 5px; border-radius: 999px; color: var(--rikyu-kuro);
  background: color-mix(in srgb, var(--rikyu-shiro) 92%, transparent);
  box-shadow: 0 1px 6px color-mix(in srgb, var(--rikyu-kuro) 25%, transparent); }
.g-lab b { display: block; font-weight: 600; font-size: 13px; letter-spacing: .01em; }
.g-lab span { display: block; font-size: 11px; }
.g-lab.is-lit { background: color-mix(in srgb, var(--rikyu-sabi) 38%, var(--rikyu-shiro));
  box-shadow: 0 0 0 2px var(--rikyu-kuro), 0 0 0 6px color-mix(in srgb, var(--rikyu-shiro) 55%, transparent); }
.band-dark:has([data-garden][data-state="fallback"]) .g-hint { visibility: visible; }
.g-note { margin: 0; font-size: var(--t-small-size); color: var(--rikyu-shiro); }
@media (max-width: 759px) {
  .g-view { top: var(--space-3, 12px); right: var(--space-3, 12px); padding: 8px 12px; }
  .g-lab { padding: 3px 7px 4px; } .g-lab b { font-size: 12px; } .g-lab span { font-size: 10px; }
}