/* Shared semantic palette; status colors and client identities remain distinct. */
.annual-pulse-card { position: relative; overflow: hidden; }
.annual-pulse-card[hidden] { display: none; }
.annual-source { font-size: 10px; letter-spacing: .12em; color: var(--ink-soft); }
.annual-period { color: var(--ink-soft); font-size: 12px; margin-top: 24px; }
.annual-values { display: grid; gap: 28px; padding: 18px 0 30px; }
.annual-values > div { min-width: 0; }
.annual-lane-label { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 12px; }
.annual-values span { color: var(--ink-soft); display: block; font-size: 13px; font-weight: 700; }
.annual-values strong { display: block; font-size: clamp(16px, 1.35vw, 25px); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.annual-track { height: 18px; border-radius: 4px; background: var(--surface-alt); }
.annual-fill { height: 100%; width: 0; border-radius: 4px; position: relative; overflow: hidden; }
.annual-fill-current { background: #f5c400; }
.annual-fill-previous { background: #68b8dd; }
.annual-fill-current::after { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 30%, #fff9 50%, transparent 70%); opacity: 0; transform: translateX(-100%); }
.annual-change { display: grid; gap: 7px; padding: 18px 0 10px; border-top: 1px solid var(--line); }
.annual-change strong { font-size: clamp(20px, 1.6vw, 29px); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.annual-change #annual-variation { font-size: 16px; font-weight: 700; }
.annual-change span, .annual-rule, .annual-update { font-size: 11px; line-height: 1.5; color: var(--ink-soft); }
.annual-pulse-card[data-direction="up"] .annual-change strong { color: var(--green); }
.annual-pulse-card[data-direction="down"] .annual-change strong { color: var(--red); }
.annual-rule { margin-bottom: 0; }
.annual-update { color: var(--green); min-height: 17px; margin: 8px 0 0; }
.annual-pulse-card.is-growing .annual-fill-current::after { animation: annual-shine 1600ms linear; }
.annual-pulse-card.is-growing #annual-current { animation: annual-value-rise 250ms cubic-bezier(.23,1,.32,1); }
@keyframes annual-value-rise { from { transform: translateY(.2em); opacity: .5; } to { transform: translateY(0); opacity: 1; } }
@keyframes annual-shine { 0% { transform: translateX(-100%); opacity: 0; } 15%,85% { opacity: .8; } 100% { transform: translateX(100%); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .annual-pulse-card.is-growing .annual-fill-current::after, .annual-pulse-card.is-growing #annual-current { animation: none; } }
.login-divider-glint { position: absolute; top: 0; left: calc(100% - 1px); width: 70px; height: 100%; z-index: 2; overflow: visible; pointer-events: none; }
.login-divider-glint path { fill: none; stroke: #ffe033; stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-dasharray: 4 108; opacity: 0; filter: drop-shadow(0 0 1px #946000) drop-shadow(0 0 4px #ffd500cc); }
:root[data-theme="dark"] .login-divider-glint path { stroke: #d4e0e8; filter: drop-shadow(0 0 3px #9aafc180); }
@media (max-width: 760px), (prefers-reduced-motion: reduce) { .login-divider-glint { display: none; } }
@property --signal-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.penna-login .login-signal span { position: relative; border-radius: 4px; box-shadow: 5px 5px 10px #0008, -3px -3px 8px #ffffff12, inset 1px 1px 2px #ffffff60, inset -2px -2px 4px #0005; }
.penna-login .login-signal span::after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 2px; background: conic-gradient(from var(--signal-angle), transparent 0deg 270deg, #ffffff20 300deg, #fff7cb 340deg, transparent 360deg); mask: linear-gradient(#fff 0 0) content-box exclude, linear-gradient(#fff 0 0); pointer-events: none; animation: signal-orbit 4s linear infinite; }
@keyframes signal-orbit { to { --signal-angle: 360deg; } }
.penna-login .brand-login .brand-symbol { position: relative; box-shadow: 5px 5px 10px #0008, -3px -3px 8px #ffffff12, inset 1px 1px 2px #ffffff60, inset -2px -2px 4px #0005; text-shadow: 1px 1px 1px #ffffff40; }
.penna-login .brand-login .brand-symbol::after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 2px; background: conic-gradient(from var(--signal-angle), transparent 0deg 270deg, #ffffff20 300deg, #fff7cb 340deg, transparent 360deg); mask: linear-gradient(#fff 0 0) content-box exclude, linear-gradient(#fff 0 0); pointer-events: none; animation: signal-orbit 4s linear infinite; }
.penna-login .brand-login .brand-copy strong,
.penna-login .brand-login .brand-copy small,
.penna-login .login-identity > p { text-shadow: 2px 3px 4px #000c, -1px -1px 1px #ffffff30; }
@media (prefers-reduced-motion: reduce) { .penna-login .brand-login .brand-symbol::after { animation: none; opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .penna-login .login-signal span::after { animation: none; opacity: .35; } }
:root[data-theme="dark"] {
    color-scheme: dark;
    --ink: #edf1f5; --ink-soft: #bcc6cf; --muted: #a1afbb;
    --line: #10161b; --line-strong: #52606b;
    --surface: #20272e; --surface-alt: #28323b; --canvas: #141a20;
    --sidebar: #10151a; --sidebar-soft: #252e36;
    --yellow: #f5c400; --yellow-dark: #d6ae21; --yellow-soft: #423919;
    --green: #72d5a0; --green-soft: #173b2b;
    --red: #ff9b93; --red-soft: #432725;
    --amber: #f2cd69; --amber-soft: #40351c;
    --blue: #88c9ed; --blue-soft: #203b4c;
    --shadow: 0 8px 28px #0004;
}
.theme-switch { flex: 0 0 32px; width: 32px; height: 32px; padding: 7px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.theme-switch svg { display: block; width: 16px; height: 16px; }
[data-theme-toggle]:focus-visible { outline: 3px solid var(--yellow-dark); outline-offset: 4px; }
.penna-login .emboss-emblem { position: relative; border: 0; padding: 0; background: var(--login-bg); cursor: pointer; box-shadow: 7px 7px 15px var(--login-shadow), -7px -7px 15px var(--login-light); }
.penna-login .emboss-emblem::before { content: ''; position: absolute; inset: 7px; border-radius: 50%; background: #000; box-shadow: inset 2px 2px 5px #0006; }
.penna-login .penna-shield { position: relative; z-index: 1; width: 44px; height: 52px; }
.penna-login .emboss-emblem:hover { transform: translateY(-2px); }
.penna-login .emboss-submit:is(:hover, :focus-visible) { animation-direction: alternate; animation-timing-function: ease-in-out; }
:root[data-theme="dark"] .penna-login { --login-bg: #242d36; --login-shadow: #10161c; --login-light: #35424f; --login-gold: #f5c400; color: var(--ink); }
:root[data-theme="dark"] .emboss-emblem::before { background: #fff; }
:root[data-theme="dark"] .penna-shield { filter: grayscale(1) invert(1) contrast(2) blur(.25px); }
:root[data-theme="dark"] .emboss-card::before,
:root[data-theme="dark"] .emboss-card::after,
:root[data-theme="dark"] .emboss-orb { box-shadow: 10px 10px 22px var(--login-shadow), -10px -10px 22px var(--login-light); }
:root[data-theme="dark"] .emboss-field input { color: var(--ink); background: var(--login-bg); box-shadow: inset 5px 5px 9px var(--login-shadow), inset -5px -5px 9px var(--login-light); }
:root[data-theme="dark"] .emboss-field input:focus { border-color: var(--yellow-dark); }
:root[data-theme="dark"] .emboss-field input:-webkit-autofill { -webkit-text-fill-color: var(--ink); box-shadow: inset 0 0 0 100px var(--login-bg); }
:root[data-theme="dark"] .emboss-field label,
:root[data-theme="dark"] .emboss-form header > p:last-child,
:root[data-theme="dark"] .ownership-mark { color: var(--ink-soft); }
:root[data-theme="dark"] .emboss-submit { color: var(--yellow); background: var(--login-bg); border-color: var(--line); box-shadow: 5px 5px 12px var(--login-shadow), -5px -5px 12px var(--login-light); }
:root[data-theme="dark"] .penna-login .emboss-submit:not(:hover):not(:focus-visible):not(:active) { color: var(--yellow); }
:root[data-theme="dark"] .penna-login .emboss-submit:is(:hover, :focus-visible) { color: #edf1f5; background: linear-gradient(115deg, #080c10, #35414c, #10171e, #080c10) 0 0 / 300% 100%; border-color: #475563; box-shadow: 0 7px 20px #0009, -3px -3px 14px #64788a30, inset 0 1px 1px #a7b8c633; }
:root[data-theme="dark"] .penna-login .emboss-submit:focus-visible { outline-color: #a7b8c6; }
:root[data-theme="dark"] .penna-login .emboss-submit:active { color: #edf1f5; background: #0c1117; box-shadow: inset 3px 3px 8px #0009, inset -2px -2px 6px #64788a30; }
:root[data-theme="dark"] .penna-login .ownership-mark span,
:root[data-theme="dark"] .penna-login .password-toggle { color: var(--ink-soft); }
:root[data-theme="dark"] :is(dialog, .app-dialog, .workshop-candidate, .workshop-order-preview, .workshop-calendar, .workshop-day, .production-card, .rescue-card, .user-popover, .period-picker, .seller-picker) { background-color: var(--surface); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] :is(input, select, textarea) { color: var(--ink); background-color: var(--surface-alt); border-color: var(--line-strong); }
:root[data-theme="dark"] :is(input, textarea)::placeholder { color: var(--muted); }
:root[data-theme="dark"] :is(table th, thead, .product-ranking-position, .kpi-explanation-trigger) { background: var(--surface-alt); color: var(--ink-soft); }
:root[data-theme="dark"] .product-ranking-list li:first-child .product-ranking-position { background: var(--yellow); color: #17191b; }
:root[data-theme="dark"] :is(.button-primary, .brand-symbol, .user-avatar, .nav-item.is-active) { color: #17191b; }
:root[data-theme="dark"] .workshop-event { background: color-mix(in srgb, var(--event), #172027 78%); color: #f2f5f7; border-left-color: var(--event); }
:root[data-theme="dark"] .workshop-day.is-today .workshop-day-number { background: var(--yellow); color: #17191b; }
:root[data-theme="dark"] .workshop-order-preview { background: var(--surface-alt); }
:root[data-theme="dark"] dialog::backdrop { background: #0009; }
:root[data-theme="dark"] .topbar { background: #20272efa; color: var(--ink); }
:root[data-theme="dark"] :where(.app-body, .admin-body) :where(button, .button):not(:where(.sidebar *, .workshop-event, .is-ready)) { box-shadow: 2px 3px 6px #0004, inset 1px 1px 0 #ffffff0a; }
:root[data-theme="dark"] :is(tbody tr:hover td, .production-order-row:hover, .production-order-row:focus-within, .production-metric:hover) { background: var(--surface-alt); }
:root[data-theme="dark"] .production-months button[aria-pressed="true"] { background: var(--yellow-soft); color: var(--yellow); }
:root[data-theme="dark"] .kpi-explanation-tip { color: #fff; }
:root[data-theme="dark"] :is(.rescue-settings, .rescue-row) { background: var(--surface); color: var(--ink); }
:root[data-theme="dark"] .rescue-row:not(.rescue-overdue) { border-color: var(--line); border-top-color: var(--yellow-dark); }
:root[data-theme="dark"] :is(.rescue-settings, .rescue-participant, .rescue-row dl) { border-color: var(--line); }
:root[data-theme="dark"] :is(.rescue-heading p, .rescue-settings p, .rescue-row summary small, .rescue-row dt) { color: var(--ink-soft); }
:root[data-theme="dark"] .rescue-phone { background: var(--amber-soft); color: var(--amber); }
:root[data-theme="dark"] .rescue-phone.valid { background: var(--green-soft); color: var(--green); }
:root[data-theme="dark"] :is(.rescue-warning, .rescue-error) { color: var(--red); }
:root[data-theme="dark"] .workshop-view { --workshop-line: var(--line); }
:root[data-theme="dark"] .workshop-weekdays { background: var(--surface-alt); border-color: var(--line); }
:root[data-theme="dark"] .workshop-day.is-other-month { background: var(--canvas); }
:root[data-theme="dark"] .workshop-actions .button strong { background: var(--canvas); color: var(--ink); }
:root[data-theme="dark"] .penna-login .emboss-form .ownership-mark { border-color: var(--line); }
:root[data-theme="dark"] hr { border-color: var(--line); }
:root[data-theme="dark"] :is(th, td, .split-lists li, .scale-row, .source-row, .definition-panel dl > div, .product-ranking-list li) { border-bottom-color: var(--line); }
:root[data-theme="dark"] :is(.sidebar, .sidebar-head, .sidebar-footer, .sidebar-admin) { border-color: var(--line); }
@media (prefers-reduced-motion: reduce) { .penna-login .emboss-emblem { transition: none; } }