/* Existing cross-skin hiding contract; component rules below are cabin-scoped. */
:root:not([data-skin="alice"]) .cabin-only { display: none !important; }
/* Alice app.css .num/.tile/.gauge/.bar/.tag; views/home.css .hm-tri/.hm-mini.
 * Orbitron is the Alice wordmark; data and clocks deliberately use Alice's --mono stack. */
:root[data-skin="alice"] .ck-tone-neutral { --ck-tone: var(--ac-tx); --ck-peer: var(--ac-tx2); }
:root[data-skin="alice"] .ck-tone-cyan { --ck-tone: var(--ac-cy); --ck-peer: var(--ac-bl); }
:root[data-skin="alice"] .ck-tone-blue { --ck-tone: var(--ac-bl); --ck-peer: var(--ac-cy); }
:root[data-skin="alice"] .ck-tone-violet { --ck-tone: var(--ac-vi); --ck-peer: var(--ac-bl); }
:root[data-skin="alice"] .ck-tone-amber { --ck-tone: var(--ac-am); --ck-peer: var(--ac-or); }
:root[data-skin="alice"] .ck-tone-up { --ck-tone: var(--up); --ck-peer: var(--up); }
:root[data-skin="alice"] .ck-tone-down { --ck-tone: var(--down); --ck-peer: var(--down); }
:root[data-skin="alice"] :is(.ck-number, .home-metric strong) { font: 700 28px/1.2 var(--mono); font-variant-numeric: tabular-nums; letter-spacing: 0; }
:root[data-skin="alice"] .ck-number { display: inline-flex; align-items: baseline; gap: 4px; color: var(--ac-tx); min-width: 0; flex-wrap: wrap; }
:root[data-skin="alice"] .ck-number small { font: 500 12px/1.6 var(--mono); color: var(--ac-tx2); }
:root[data-skin="alice"] .ck-label { font-size: 12px; line-height: 1.6; letter-spacing: 1.2px; color: var(--ac-tx2); }
:root[data-skin="alice"] .ck-hint { font-size: 12px; line-height: 1.6; color: var(--ac-tx2); overflow-wrap: anywhere; }
:root[data-skin="alice"] .ck-stat { position: relative; display: grid; gap: 8px; padding: 16px 20px; min-width: 0; border: 1px solid var(--ac-glass-rim); border-radius: 12px; background: var(--cabin-data-surface); box-shadow: inset 0 1px 0 var(--ac-glass-hi); }
:root[data-skin="alice"] .ck-stat::before { content: ''; position: absolute; inset: 16px auto 16px 0; width: 3px; border-radius: 3px; background: linear-gradient(180deg, var(--ck-tone), transparent); }
:root[data-skin="alice"] :is(.ck-tone-up,.ck-tone-down).ck-stat .ck-number { color: var(--ck-tone); }
:root[data-skin="alice"] .ck-pill { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; gap: 4px; padding: 4px 12px; border: 1px solid var(--ac-line2); border-radius: 999px; background: rgba(var(--ac-fg-rgb), .03); color: var(--ck-tone); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
:root[data-skin="alice"] .ck-ring { width: 108px; max-width: 100%; text-align: center; }
:root[data-skin="alice"] .ck-dial { position: relative; width: 108px; height: 108px; }
:root[data-skin="alice"] .ck-dial svg { width: 108px; height: 108px; transform: rotate(-90deg); }
:root[data-skin="alice"] .ck-dial circle { fill: none; stroke-width: 8; }
:root[data-skin="alice"] .ck-track { stroke: rgba(var(--ac-sl-rgb), .13); }
:root[data-skin="alice"] .ck-arc { stroke: var(--ck-tone); stroke-linecap: round; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--ck-tone) 55%, transparent)); }
:root[data-skin="alice"] .ck-ring-value { position: absolute; inset: 0; display: grid; align-content: center; justify-items: center; }
:root[data-skin="alice"] .ck-ring-value .ck-number { font-size: 22px; }
:root[data-skin="alice"] .ck-ring-value > small { color: var(--ac-tx2); font: 12px/1.6 var(--mono); }
:root[data-skin="alice"] .ck-bar { display: grid; gap: 8px; min-width: 0; }
:root[data-skin="alice"] .ck-bar-caption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 12px; line-height: 1.6; color: var(--ac-tx2); }
:root[data-skin="alice"] .ck-bar-caption b { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 500; color: var(--ac-tx); }
:root[data-skin="alice"] .ck-track-bar { height: 6px; border-radius: 6px; background: rgba(var(--ac-sl-rgb), .14); overflow: hidden; }
:root[data-skin="alice"] .ck-track-bar > i { display: block; width: calc(100% * var(--ck-ratio)); height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--ck-tone), var(--ck-peer)); transform-origin: left; }
:root[data-skin="alice"] .ck-spark { display: block; width: 100%; height: 46px; min-width: 0; color: var(--ck-tone); }
:root[data-skin="alice"] .ck-spark svg { width: 100%; height: 100%; overflow: visible; }
:root[data-skin="alice"] .ck-empty { color: var(--ac-tx2); }
:root[data-skin="alice"]:not([data-navfx="none"]) .ck-track-bar > i { animation: ck-fill .6s cubic-bezier(.2,.8,.2,1) both; }
@keyframes ck-fill { from { transform: scaleX(0); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  :root[data-skin="alice"] :is(.ck-stat,.ck-ring,.ck-spark,.ck-track-bar > i) { animation: none !important; }
}
/* Alice app.css .tile:hover (-2px/.2s), .dot (8px, blink 2s), pagein;
 * entrance distance/stagger and the decorative energy SVG follow the cabin motion contract. */
:root[data-skin="alice"] .ck-live { color: var(--ac-tx2); gap: 8px; }
:root[data-skin="alice"] .ck-live > i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--ck-tone); box-shadow: 0 0 8px color-mix(in srgb, var(--ck-tone) 40%, transparent); }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-live > i { animation: ck-breathe 2s ease-in-out infinite; }
:root[data-skin="alice"]:not([data-dim="space"]):not([data-navfx="none"]) .ck-entering { animation: ck-arrive .45s cubic-bezier(.2,.8,.2,1) var(--ck-delay, 0ms) both; }
:root[data-skin="alice"]:not([data-dim="space"]):not([data-navfx="none"]) body .card { transition: transform .2s, border-color .2s; }
@media (hover: hover) {
  :root[data-skin="alice"]:not([data-dim="space"]):not([data-navfx="none"]) body .card:not(.cx[data-motion="off"] .card):hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--ac-cy) 40%, var(--ac-glass-rim)); }
}
:root[data-skin="alice"] .ck-flow { position: relative; width: 400px; max-width: 100%; color: var(--ac-bl); }
:root[data-skin="alice"] .ck-flow svg { display: block; width: 100%; height: auto; overflow: visible; }
:root[data-skin="alice"] .ck-flow small { position: absolute; top: 0; right: 0; font-size: 12px; line-height: 16px; color: var(--ac-tx2); }
:root[data-skin="alice"] .ck-flow-lines { stroke: currentColor; stroke-width: 1; opacity: .45; fill: none; }
:root[data-skin="alice"] .ck-flow-node { fill: var(--ac-glass-2); stroke: var(--ac-glass-rim); }
:root[data-skin="alice"] .ck-flow-icons { fill: none; stroke: var(--ac-cy); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
:root[data-skin="alice"] .ck-flow-charge { fill: var(--ac-vi); opacity: .5; transform: scaleY(.55); transform-box: fill-box; transform-origin: center bottom; }
:root[data-skin="alice"] .ck-flow-forward { fill: var(--ac-cy); }
:root[data-skin="alice"] .ck-flow-back { fill: var(--ac-vi); }
:root[data-skin="alice"] .ck-flow-labels { fill: var(--ac-tx2); text-anchor: middle; font-size: 12px; }
/* Sized flow only: the no-argument diagram retains its original geometry/material. */
:root[data-skin="alice"] .ck-flow-lg { width: 360px; }
:root[data-skin="alice"] .ck-flow-md { width: 264px; }
:root[data-skin="alice"] .ck-flow-sized .ck-flow-node { fill: var(--ac-glass-2); stroke: var(--ac-bl); stroke-opacity: .65; stroke-width: 1.5; filter: drop-shadow(0 0 6px rgba(var(--ac-bl-rgb), .25)); }
:root[data-skin="alice"] .ck-flow-sized .ck-flow-icons { stroke-width: 2; stroke: var(--ac-tx); }
:root[data-skin="alice"] .ck-flow-sized .ck-flow-lines { stroke-width: 2; opacity: .6; filter: drop-shadow(0 0 4px var(--ac-bl)); }
:root[data-skin="alice"] .ck-flow-sized :is(.ck-flow-forward,.ck-flow-back) { filter: drop-shadow(0 0 4px var(--ac-cy)); }
:root[data-skin="alice"] .ck-flow-sized .ck-flow-charge { fill: var(--ac-bl); opacity: .55; }
:root[data-skin="alice"] .ck-flow-sized .ck-flow-labels { font-size: 14px; fill: var(--ac-tx); }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-flow-forward { animation: ck-energy-forward 2.6s linear infinite; }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-flow-back { animation: ck-energy-back 2.6s linear -1.3s infinite; }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-flow-charge { animation: ck-charge 5.2s ease-in-out infinite; }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-flow-sized .ck-flow-forward { animation-name: ck-sized-forward; }
:root[data-skin="alice"]:not([data-navfx="none"]):not([data-ck-hidden]) .ck-flow-sized .ck-flow-back { animation-name: ck-sized-back; }
@keyframes ck-sized-forward { 0% { transform: translateX(0); opacity: 0; } 15%,85% { opacity: 1; } 100% { transform: translateX(48px); opacity: 0; } }
@keyframes ck-sized-back { 0% { transform: translateX(0); opacity: 0; } 15%,85% { opacity: .8; } 100% { transform: translateX(-48px); opacity: 0; } }
:root[data-skin="alice"] :is(.cx[data-motion="off"], [data-ck-static]) :is(.ck-entering,.ck-live > i,.ck-flow-forward,.ck-flow-back,.ck-flow-charge,.ck-track-bar > i),
:root[data-skin="alice"][data-ck-hidden] :is(.ck-entering,.ck-live > i,.ck-flow-forward,.ck-flow-back,.ck-flow-charge,.ck-track-bar > i),
:root[data-skin="alice"][data-navfx="none"] :is(.ck-entering,.ck-live > i,.ck-flow-forward,.ck-flow-back,.ck-flow-charge,.ck-track-bar > i) { animation: none !important; }
@keyframes ck-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ck-breathe { 50% { opacity: .3; } }
@keyframes ck-energy-forward { 0% { transform: translateX(0); opacity: 0; } 15%,85% { opacity: 1; } 100% { transform: translateX(74px); opacity: 0; } }
@keyframes ck-energy-back { 0% { transform: translateX(0); opacity: 0; } 15%,85% { opacity: .8; } 100% { transform: translateX(-74px); opacity: 0; } }
@keyframes ck-charge { 50% { transform: scaleY(.9); opacity: .75; } }
@media (prefers-reduced-motion: reduce) {
  :root[data-skin="alice"] :is(.ck-entering,.ck-live > i,.ck-flow-forward,.ck-flow-back,.ck-flow-charge) { animation: none !important; }
  :root[data-skin="alice"]:not([data-dim="space"]) body .card:hover { transform: none !important; }
}
