#site-update-toggle[hidden], #site-patch-note button[hidden] { display: none; }
#site-update-toggle { position: fixed; right: max(16px,env(safe-area-inset-right)); bottom: max(16px,env(safe-area-inset-bottom)); z-index: 100; display: grid; place-items: center; width: 48px; height: 48px; min-height: 48px; margin: 0; padding: 12px; border: 1px solid #2364bd; border-radius: 50%; background: #2563c4; color: #fff; cursor: pointer; box-shadow: 0 4px 16px #0003; }
#site-update-toggle svg { width: 24px; height: 24px; }
#site-update-toggle[data-state="current"] { background: var(--surface,#fffefa); color: #2563c4; }
html[data-edition="gn"] #site-update-toggle[data-state="current"] { color: #8cb9ff; border-color: #8cb9ff; }
#site-update-toggle[data-state="current"] .update-arrow, #site-update-toggle[data-state="available"] .update-check { display: none; }
#site-patch-note { box-sizing: border-box; width: min(800px,calc(100vw - 32px)); height: min(640px,calc(100dvh - 32px)); max-width: none; max-height: none; margin: auto; padding: 0; overflow: hidden; border: 1px solid var(--line,#b4c7c0); border-radius: 18px; background: var(--surface,#fffefa); color: var(--ink,#253d45); box-shadow: 0 16px 64px #0004; font: 14px/1.6 system-ui,sans-serif; }
#site-patch-note::backdrop { background: #13272f99; }
.patch-layout { display: grid; grid-template-columns: 168px minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto; height: 100%; }
.patch-header { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-bottom: 1px solid var(--line,#b4c7c0); }
#site-patch-note h2 { margin: 0; font: 600 22px/1.3 system-ui,sans-serif; letter-spacing: normal; }
#patch-beta { border-radius: 20px; padding: 2px 10px; background: var(--wash,#e9f0ed); font-size: 12px; }
#patch-note-versions { min-height: 0; overflow-y: auto; padding: 12px; border-right: 1px solid var(--line,#b4c7c0); background: var(--wash,#e9f0ed); }
#site-patch-note button { box-sizing: border-box; min-height: 44px; width: auto; margin: 0; padding: 8px 16px; border: 1px solid var(--line,#b4c7c0); border-radius: 10px; background: var(--surface,#fffefa); color: inherit; font: inherit; cursor: pointer; }
#site-patch-note #patch-note-versions button { display: block; width: 100%; margin-bottom: 8px; padding: 8px; text-align: left; border-color: transparent; background: transparent; }
#patch-note-versions button span { display: block; font-size: 11px; }
#site-patch-note #patch-note-versions button[aria-current="true"] { border-color: #2563c4; background: var(--surface,#fffefa); color: var(--ink,#253d45); font-weight: 600; }
.patch-content { min-width: 0; min-height: 0; padding: 24px; overflow-y: auto; overflow-wrap: anywhere; }
#patch-note-version { margin: 0 0 6px; color: var(--accent,#35765b); font-weight: 600; }
#site-patch-note h3 { margin: 0 0 12px; font: 600 20px/1.4 system-ui,sans-serif; text-transform: none; letter-spacing: normal; color: inherit; }
#patch-note-date, #patch-note-source { font-size: 12px; color: var(--muted,#5b6f73); }
#site-patch-note .patch-category { margin: 20px 0; }
#site-patch-note .patch-category h4 { margin: 0 0 8px; color: var(--accent,#35765b); font: 600 14px/1.6 system-ui,sans-serif; text-transform: none; letter-spacing: normal; }
#site-patch-note .patch-category ul { margin: 0; padding-left: 20px; list-style: disc; }
#site-patch-note .patch-category li { margin: 0 0 8px; padding-left: 2px; white-space: pre-wrap; }
#site-patch-note .patch-footer { grid-column: 1 / -1; display: block; max-width: none; margin: 0; padding: 16px 24px; border-top: 1px solid var(--line,#b4c7c0); color: inherit; font-size: 14px; }
.patch-footer p { margin: 0 0 10px; }
.patch-footer > div { display: flex; gap: 8px; }
#site-patch-note #update-refresh { background: #2563c4; border-color: #2364bd; color: #fff; }
#update-feedback:empty { display: none; }
#site-patch-note #update-feedback { margin: 10px 0 0; }
#site-update-toggle:focus-visible, #site-patch-note button:focus-visible, .patch-content:focus-visible { outline: 3px solid #568de0; outline-offset: 2px; }
@media (max-width: 520px) { .patch-layout { grid-template-columns: 104px minmax(0,1fr); } .patch-header, #site-patch-note .patch-footer { padding: 12px 16px; } #patch-note-versions { padding: 8px; } .patch-content { padding: 16px; } #site-patch-note h3 { font-size: 18px; } }
@media print { #site-update-toggle, #site-patch-note { display: none; } }
