/* 線上計數器頁專用樣式；共用元件沿用 site.css */
.cnt-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.cnt-tab { flex: 0 1 auto; max-width: 100%; min-height: 44px; padding: 4px 12px; border: 2px solid var(--line); border-radius: 10px; background: #fff; font: inherit; font-size: 1rem; font-weight: 600; color: var(--fg); cursor: pointer; display: inline-flex; gap: 8px; align-items: center; }
.cnt-tab[aria-pressed="true"] { border-color: var(--brand); background: #eff4ff; color: var(--brand); }
.cnt-tab .cnt-tab-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 9em; }
.cnt-tab .cnt-tab-val { font-variant-numeric: tabular-nums; opacity: .8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 7em; }
.cnt-stage { background: #fff; border-radius: 12px; padding: 8px 4px; text-align: center; }
.cnt-stage:fullscreen { display: flex; flex-direction: column; justify-content: center; padding: 24px; overflow: auto; }
.cnt-stage:fullscreen .cnt-value { font-size: min(24vw, 34vh); }
.cnt-stage:fullscreen .cnt-value[data-len="m"] { font-size: min(14vw, 24vh); }
.cnt-stage:fullscreen .cnt-value[data-len="s"] { font-size: min(8vw, 16vh); }
.cnt-name { margin: 0; font-weight: 700; color: var(--muted); overflow-wrap: anywhere; min-height: 1.5em; }
.cnt-value { display: block; font-variant-numeric: tabular-nums; font-weight: 800; color: var(--brand-dark); line-height: 1.15; margin: 4px 0; overflow-wrap: anywhere; word-break: break-all; font-size: clamp(3.5rem, 22vw, 7rem); }
.cnt-value[data-len="m"] { font-size: clamp(2.2rem, 12vw, 4.5rem); }
.cnt-value[data-len="s"] { font-size: clamp(1.4rem, 7vw, 3rem); }
.cnt-goal { margin: 0 0 8px; color: var(--muted); min-height: 1.5em; }
.cnt-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 8px 0; }
.cnt-big { min-height: 110px; border: 0; border-radius: 16px; font: inherit; font-size: 3rem; font-weight: 800; color: #fff; cursor: pointer; touch-action: manipulation; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.cnt-plus { background: var(--brand); }
.cnt-minus { background: #64748b; }
.cnt-plus:active { background: var(--brand-dark); }
.cnt-minus:active { background: #475569; }
.cnt-small { display: flex; gap: 10px; margin: 10px 0; }
.cnt-small .btn { flex: 1 1 0; }
.cnt-alert { margin: 8px 0; background: #ecfdf5; border: 2px solid var(--ok); border-radius: 12px; padding: 10px 14px; }
.cnt-alert[hidden] { display: none; }
.cnt-alert strong { display: block; font-size: 1.25rem; color: var(--ok); margin-bottom: 6px; }
.cnt-row { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 0 12px; }
.cnt-row > * { min-width: 0; }
.cnt-btns .cnt-big:focus-visible, .cnt-tab:focus-visible { outline: 3px solid #93b4ff; outline-offset: 2px; }
@media (max-width: 600px) { .cnt-row { grid-template-columns: 1fr; } }
.qr-check[hidden], .btn[hidden] { display: none; }