/* Universal Theme Kit — optional shared component classes. */
.ui-scope { min-height:100%; color:var(--ui-text); background:var(--ui-page); font:calc(16px * var(--ui-scale))/1.5 var(--ui-font); }
.ui-scope *, .ui-scope *::before, .ui-scope *::after { box-sizing:border-box; }
.ui-scope button,.ui-scope input,.ui-scope select,.ui-scope textarea { font:inherit; }
.ui-scope :focus-visible { outline:0; box-shadow:var(--ui-focus); }
.ui-pressable { position:relative; isolation:isolate; overflow:hidden; -webkit-tap-highlight-color:transparent; }.ui-pressable:not(:disabled) { transition-timing-function:var(--ui-ease-out); }.ui-pressable:not(:disabled):active { transform:scale(var(--ui-press-scale)); }
.ui-btn { position:relative; overflow:hidden; min-height:var(--ui-control); display:inline-flex; align-items:center; justify-content:center; gap:var(--ui-space-2); padding:0 var(--ui-space-4); border:1px solid transparent; border-radius:var(--ui-radius); cursor:pointer; font-size:calc(14px * var(--ui-scale)); font-weight:680; transition:transform var(--ui-fast) var(--ui-ease-out),background var(--ui-fast) var(--ui-ease-out),border-color var(--ui-fast) var(--ui-ease-out),color var(--ui-fast) var(--ui-ease-out),box-shadow var(--ui-fast) var(--ui-ease-out); }
.ui-btn:hover { transform:translateY(-1px); box-shadow:var(--ui-shadow-sm); }.ui-btn:active { transform:translateY(1px) scale(var(--ui-press-scale)); box-shadow:none; }.ui-btn:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.ui-btn-primary { color:var(--ui-on-brand); background:var(--ui-brand); }.ui-btn-primary:hover { background:var(--ui-brand-hover); }
.ui-btn-accent { color:var(--ui-on-brand); background:var(--ui-accent); }.ui-btn-accent:hover { background:color-mix(in srgb,var(--ui-accent) 84%,var(--ui-ink)); }
.ui-btn-secondary { color:var(--ui-text); background:var(--ui-surface); border-color:var(--ui-border); }.ui-btn-secondary:hover { background:var(--ui-surface-subtle); border-color:var(--ui-border-strong); }
.ui-btn-ghost { color:var(--ui-text-secondary); background:transparent; }.ui-btn-ghost:hover { color:var(--ui-text); background:var(--ui-surface-subtle); }
.ui-btn-danger { color:#fff; background:var(--ui-danger); }
.ui-icon-btn { width:var(--ui-control); height:var(--ui-control); padding:0; }
.ui-card { padding:var(--ui-space-5); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius); color:var(--ui-text); background:var(--ui-surface); box-shadow:var(--ui-shadow-sm); transition:border-color var(--ui-motion) var(--ui-ease-out),box-shadow var(--ui-motion) var(--ui-ease-out),transform var(--ui-motion) var(--ui-ease-out); }.ui-card[data-ui-card-interactive] { cursor:pointer; }.ui-card[data-ui-card-interactive]:hover { border-color:var(--ui-border-strong); box-shadow:var(--ui-shadow-lg); transform:translateY(-2px); }.ui-card[data-ui-card-interactive]:active { transform:translateY(0) scale(.995); }
.ui-input,.ui-select-native,.ui-textarea { width:100%; min-height:var(--ui-control); padding:0 var(--ui-space-3); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius-sm); outline:0; color:var(--ui-text); background:var(--ui-surface); transition:border-color var(--ui-fast) var(--ui-ease-out),box-shadow var(--ui-fast) var(--ui-ease-out),background var(--ui-fast) var(--ui-ease-out),transform var(--ui-fast) var(--ui-ease-out); }
.ui-textarea { min-height:120px; padding-block:var(--ui-space-3); resize:vertical; }.ui-input::placeholder,.ui-textarea::placeholder { color:var(--ui-muted); }.ui-input:hover,.ui-select-native:hover,.ui-textarea:hover { border-color:var(--ui-border-strong); }.ui-input:focus,.ui-select-native:focus,.ui-textarea:focus { border-color:var(--ui-brand); box-shadow:var(--ui-focus); }
.ui-select { position:relative; z-index:5; width:100%; }.ui-select-trigger { position:relative; width:100%; min-height:var(--ui-control); padding:0 var(--ui-space-10,40px) 0 var(--ui-space-3); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius-sm); color:var(--ui-text); background:var(--ui-surface); cursor:pointer; overflow:hidden; text-align:left; transition:border-color var(--ui-fast) var(--ui-ease-out),box-shadow var(--ui-fast) var(--ui-ease-out),transform var(--ui-fast) var(--ui-ease-out),background var(--ui-fast) var(--ui-ease-out); }.ui-select-trigger::after { content:""; position:absolute; right:var(--ui-space-4); top:50%; width:7px; height:7px; border-right:2px solid var(--ui-muted); border-bottom:2px solid var(--ui-muted); rotate:45deg; translate:0 -70%; transition:rotate var(--ui-motion) var(--ui-ease-out),translate var(--ui-motion) var(--ui-ease-out); }.ui-select.is-open .ui-select-trigger { border-color:var(--ui-brand); box-shadow:var(--ui-focus); }.ui-select.is-open .ui-select-trigger::after { rotate:225deg; translate:2px -25%; }.ui-select-menu { position:absolute; z-index:20; top:calc(100% + var(--ui-space-2)); right:0; left:0; display:grid; gap:var(--ui-space-1); padding:var(--ui-space-2); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius); color:var(--ui-text); background:var(--ui-surface-elevated); box-shadow:var(--ui-shadow-lg); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-8px) scale(.97); transform-origin:top center; transition:opacity var(--ui-fast) var(--ui-ease-out),transform var(--ui-motion) var(--ui-ease-pop),visibility var(--ui-motion); }.ui-select.is-open .ui-select-menu { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1); }.ui-select-option { position:relative; min-height:var(--ui-control-sm); overflow:hidden; padding:0 var(--ui-space-3); border:0; border-radius:var(--ui-radius-sm); color:var(--ui-text-secondary); background:transparent; cursor:pointer; text-align:left; transition:color var(--ui-fast) var(--ui-ease-out),background var(--ui-fast) var(--ui-ease-out),transform var(--ui-fast) var(--ui-ease-out); }.ui-select-option:hover,.ui-select-option:focus-visible { color:var(--ui-text); background:var(--ui-surface-subtle); transform:translateX(2px); }.ui-select-option[aria-selected="true"] { color:var(--ui-brand); background:var(--ui-brand-soft); font-weight:700; }
.ui-badge { display:inline-flex; align-items:center; min-height:24px; padding:0 var(--ui-space-2); border-radius:var(--ui-pill); color:var(--ui-text-secondary); background:var(--ui-surface-subtle); font-size:calc(12px * var(--ui-scale)); font-weight:700; }.ui-badge-accent { color:var(--ui-brand); background:var(--ui-brand-soft); }.ui-badge-success { color:var(--ui-success); background:color-mix(in srgb,var(--ui-success) 14%,var(--ui-surface)); }
.ui-tabs { display:flex; gap:var(--ui-space-1); padding:var(--ui-space-1); border-radius:var(--ui-radius); background:var(--ui-surface-subtle); }.ui-tab { position:relative; min-height:var(--ui-control-sm); flex:1; overflow:hidden; border:0; border-radius:var(--ui-radius-sm); color:var(--ui-text-secondary); background:transparent; cursor:pointer; transition:background var(--ui-fast) var(--ui-ease-out),color var(--ui-fast) var(--ui-ease-out),box-shadow var(--ui-fast) var(--ui-ease-out),transform var(--ui-fast) var(--ui-ease-out); }.ui-tab[aria-selected="true"] { color:var(--ui-text); background:var(--ui-surface); box-shadow:var(--ui-shadow-sm); }
.ui-switch { position:relative; width:44px; height:26px; appearance:none; border:0; border-radius:var(--ui-pill); background:var(--ui-border-strong); cursor:pointer; transition:background var(--ui-fast); }.ui-switch::before { content:""; position:absolute; top:4px; left:4px; width:18px; height:18px; border-radius:50%; background:var(--ui-surface); box-shadow:var(--ui-shadow-sm); transition:translate var(--ui-fast); }.ui-switch:checked { background:var(--ui-brand); }.ui-switch:checked::before { translate:18px 0; }
.ui-topbar { min-height:var(--ui-topbar-height); display:flex; align-items:center; gap:var(--ui-space-4); padding:0 var(--ui-space-6); border-bottom:var(--ui-border-width) solid var(--ui-border); background:color-mix(in srgb,var(--ui-surface) 92%,transparent); backdrop-filter:blur(var(--ui-topbar-blur)); }.ui-brand { color:var(--ui-ink); text-decoration:none; font-weight:760; }.ui-page { width:min(100%,var(--ui-content-max)); margin-inline:auto; padding:var(--ui-space-8); }.ui-text-adjustable { font-size:calc(1em * var(--ui-content-scale)); }
.ui-alert { display:flex; gap:var(--ui-space-3); padding:var(--ui-space-3) var(--ui-space-4); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius); color:var(--ui-text-secondary); background:var(--ui-surface); }.ui-alert-accent { border-color:color-mix(in srgb,var(--ui-brand) 35%,var(--ui-border)); background:var(--ui-brand-soft); }
.ui-dialog-backdrop { position:fixed; inset:0; display:grid; place-items:center; padding:var(--ui-space-4); background:rgba(0,0,0,.42); }.ui-dialog { width:min(480px,100%); padding:var(--ui-space-6); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius-lg); background:var(--ui-surface-elevated); box-shadow:var(--ui-shadow-lg); }
.ui-noUi.noUi-target { height:6px; margin:14px 10px; border:0; border-radius:var(--ui-pill); background:var(--ui-surface-subtle); box-shadow:none; }.ui-noUi .noUi-connects { overflow:hidden; border-radius:var(--ui-pill); }.ui-noUi .noUi-connect { background:var(--ui-brand); }.ui-noUi.noUi-horizontal .noUi-handle { top:-7px; right:-10px; width:20px; height:20px; border:3px solid var(--ui-surface); border-radius:50%; background:var(--ui-brand); box-shadow:0 0 0 2px var(--ui-brand); cursor:grab; transition:scale var(--ui-fast) var(--ui-ease-out),box-shadow var(--ui-fast) var(--ui-ease-out); }.ui-noUi .noUi-handle::before,.ui-noUi .noUi-handle::after { display:none; }.ui-noUi .noUi-touch-area { position:absolute; inset:-12px; width:auto; height:auto; border-radius:50%; }.ui-noUi .noUi-handle:hover,.ui-noUi .noUi-handle:focus { scale:1.06; outline:0; box-shadow:0 0 0 2px var(--ui-brand),var(--ui-focus); }.ui-noUi .noUi-active { cursor:grabbing; scale:1.1; }.ui-noUi.noUi-state-tap .noUi-connect,.ui-noUi.noUi-state-tap .noUi-origin { transition:transform var(--ui-fast) var(--ui-ease-out); }
.ui-ripple { position:absolute; z-index:2; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:color-mix(in srgb,currentColor 22%,transparent); pointer-events:none; animation:ui-ripple var(--ui-ripple) var(--ui-ease-out) forwards; }@keyframes ui-ripple { from { opacity:.75; transform:scale(0); } to { opacity:0; transform:scale(18); } }
@media (max-width:700px) { .ui-topbar { padding-inline:var(--ui-space-4); }.ui-page { padding:var(--ui-space-4); } }