/* Shared button states and required labels across supported platform pages. */
button,a.btn,a.button{border-radius:var(--r-sm);transition:background-color .15s,border-color .15s,box-shadow .15s,color .15s;letter-spacing:.01em}
button:not(.textbtn):not(.quiet):not(.link):not(.close),a.btn,a.button{box-shadow:var(--sh-1);font-weight:var(--fw-strong)}
button:hover:not(:disabled),a.btn:hover,a.button:hover{box-shadow:var(--sh-2)}
button.primary:not(:disabled),a.primary,a.btn.primary,a.button.primary{background:var(--c-brand);border-color:var(--c-brand);color:var(--c-on-brand);font-weight:var(--fw-strong)}
button.primary:hover:not(:disabled),a.primary:hover,a.btn.primary:hover,a.button.primary:hover{background:var(--c-brand-hover);border-color:var(--c-brand);color:var(--c-on-brand);filter:none}
button.primary:active:not(:disabled),a.primary:active{box-shadow:inset 0 1px 3px color-mix(in srgb,var(--c-ink) 13%,transparent)}
button.primary:disabled{background:var(--c-brand);color:var(--c-on-brand);opacity:.55}
button:disabled{box-shadow:none;cursor:not-allowed}
button:focus-visible,a.btn:focus-visible,a.button:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.required-marker{color:var(--c-danger);font-size:1em;font-weight:var(--fw-strong);white-space:nowrap}
.field-label-text{display:inline}
@media(prefers-reduced-motion:reduce){button,a.btn,a.button{transition:none}}

/* Programmatic heading focus announces a step; inputs retain their focus ring. */
#auth-title[tabindex="-1"]:focus{outline:none}
/* Focus belongs to controls, not the dialog/main/heading containing them. */
dialog:focus,main[tabindex="-1"]:focus,h1[tabindex="-1"]:focus,h2[tabindex="-1"]:focus{outline:none}
html[data-input-modality=pointer] :is(button,a,summary,[role=tab]):focus{outline:none}
[data-read-pending=true]{position:relative}
[data-read-pending=true]::after{content:'更新中…';position:absolute;top:var(--sp-2);right:var(--sp-2);padding:var(--sp-1) var(--sp-2);background:var(--c-panel);color:var(--c-muted);border:var(--border);border-radius:var(--r-xs);font-size:var(--fs-xs);pointer-events:none}
.cmd-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-4)}
.cmd-heading h2{font-size:var(--fs-lg);margin:0}
.cmd-close{padding:var(--sp-1) var(--sp-2)}
.page-skeleton{min-height:360px;display:grid;gap:var(--sp-5);align-content:start}
.page-skeleton :is(span,.skeleton-title,.skeleton-panel){display:block;background:var(--c-raised);border:var(--border);border-radius:var(--r-sm)}
.skeleton-title{width:40%;height:var(--sp-6)}
.skeleton-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-5)}
.skeleton-cards span{height:140px}
.skeleton-panel{height:180px}
@media(max-width:720px){.skeleton-cards{gap:var(--sp-3)}.skeleton-cards span{height:100px}}

/* One anchored explanation style across all platform pages. */
.info-button{display:inline-grid;place-items:center;vertical-align:middle;width:var(--sp-5);height:var(--sp-5);min-height:0;margin-left:var(--sp-2);padding:0;border:0;border-radius:var(--r-full);background:transparent;color:var(--c-muted);font-size:var(--fs-sm);box-shadow:none!important;font-weight:var(--fw-base)}
.info-button:hover:not(:disabled){background:var(--c-brand-tint);color:var(--c-brand-ink);box-shadow:none}
.metric-help{position:fixed;inset:auto;margin:0;width:max-content;max-width:min(360px,calc(100vw - var(--sp-6)));padding:var(--sp-4);border:var(--border);border-radius:var(--r-md);background:color-mix(in srgb,var(--c-panel) 96%,transparent);backdrop-filter:blur(var(--sp-2));color:var(--c-ink);font-size:var(--fs-sm);font-weight:var(--fw-base);line-height:var(--lh-base);box-shadow:var(--sh-2);overflow:visible;z-index:60;opacity:0;transform:translateY(var(--sp-1));transition:opacity var(--dur-2) var(--ease-1),transform var(--dur-2) var(--ease-1)}
.metric-help:popover-open{opacity:1;transform:translateY(0);animation:metric-help-enter var(--dur-2) var(--ease-1)}
.metric-help::before{content:'';position:absolute;left:var(--help-anchor,var(--sp-4));width:var(--sp-2);height:var(--sp-2);background:var(--c-panel);border-left:var(--border);border-top:var(--border);transform:translateX(-50%) rotate(45deg);top:calc(-1 * var(--sp-1) - 1px)}
.metric-help[data-side=above]::before{top:auto;bottom:calc(-1 * var(--sp-1) - 1px);transform:translateX(-50%) rotate(225deg)}
@keyframes metric-help-enter{from{opacity:0;transform:translateY(var(--sp-1))}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.metric-help,.metric-help:popover-open{transition:none;transform:none;animation:none}}
.check-row{display:flex;align-items:center;gap:var(--sp-2);font-weight:var(--fw-base);line-height:var(--lh-base)}
.check-row input[type=checkbox]{flex:none;width:var(--sp-4);height:var(--sp-4);min-height:0;margin:0;padding:0;accent-color:var(--c-brand-ink)}
