:root{color-scheme:light;--brand: #28368a;--brand-deep: #1e2a6e;--brand-mid: #4050a8;--brand-soft: #e9ecf8;--brand-tint: #f2f4fb;--bg: #f4f5f8;--bg-subtle: #eceef4;--surface: #fcfcfe;--border: #e2e4ec;--border-strong: #cbcfdd;--text: #1a1c24;--text-secondary: #5b6070;--text-tertiary: #878b99;--accent: var(--brand);--accent-hover: var(--brand-deep);--accent-soft: var(--brand-soft);--success: #1f7038;--success-soft: #ebf5ee;--danger: #a3231c;--danger-soft: #fbeceb;--warn: #8a5a00;--warn-soft: #fbf4e6;--font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--step-1: .75rem;--step-2: .8125rem;--step-3: .9375rem;--step-4: 1.0625rem;--step-5: 1.3125rem;--step-6: 1.75rem;--step-7: 2.5rem;--r-xs: 4px;--r-sm: 6px;--r-md: 10px;--r-lg: 14px;--r-xl: 20px;--r-pill: 999px;--r-full: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-8: 48px;--space-10: 64px;--shadow-xs: 0 1px 2px rgba(26, 28, 36, .04);--shadow-sm: 0 1px 2px rgba(26, 28, 36, .04), 0 1px 1px rgba(26, 28, 36, .03);--shadow-md: 0 2px 4px rgba(26, 28, 36, .04), 0 8px 24px rgba(26, 28, 36, .06);--shadow-lg: 0 12px 32px rgba(26, 28, 36, .12), 0 2px 6px rgba(26, 28, 36, .06);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease: cubic-bezier(.25, .1, .25, 1);--fast: .15s;--base: .25s;--tap: 44px;--shell-max: 1080px;--content-max: 680px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*,*:before,*:after{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:var(--step-4);line-height:1.5;-webkit-font-smoothing:antialiased}#root{min-height:100dvh}h1,h2,h3{margin:0;color:var(--text);font-weight:600;line-height:1.15}h1{font-size:var(--step-6);letter-spacing:-.015em}h2{font-size:var(--step-5);letter-spacing:-.015em}h3{font-size:var(--step-4);letter-spacing:-.011em}p{margin:0;max-width:62ch}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}img{display:block;max-width:100%}ul,ol{margin:0;padding:0;list-style:none}table{border-collapse:collapse}kbd{padding:1px 5px;background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-xs);font-family:var(--font-mono);font-size:.85em}:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 32%,transparent);border-radius:var(--r-sm)}::selection{background:var(--accent-soft)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.skip-link{position:absolute;top:var(--space-2);left:var(--space-2);z-index:60;padding:var(--space-2) var(--space-4);background:var(--accent);color:#fff;border-radius:var(--r-sm);transform:translateY(-200%)}.skip-link:focus-visible{transform:translateY(0)}.stack{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}.row{display:flex;align-items:center;gap:var(--space-2);min-width:0}.row--wrap{flex-wrap:wrap}.text-muted{color:var(--text-secondary)}.meta{color:var(--text-tertiary);font-size:var(--step-2)}.mono{font-family:var(--font-mono);font-size:var(--step-1);color:var(--text-tertiary)}.eyebrow{color:var(--text-tertiary);font-size:var(--step-1);font-weight:600;letter-spacing:.06em;text-transform:uppercase}.num{font-variant-numeric:tabular-nums}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--tap);padding:0 var(--space-4);border:1px solid transparent;border-radius:var(--r-md);background:var(--bg-subtle);color:var(--text);font-size:var(--step-3);font-weight:500;white-space:nowrap;transition:background var(--fast) var(--ease-out),border-color var(--fast) var(--ease-out),transform var(--fast) var(--ease-out)}.btn:hover:not(:disabled){background:var(--brand-soft)}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--accent-hover)}.btn--ghost{background:transparent;border-color:var(--border-strong)}.btn--quiet{background:transparent;color:var(--text-secondary);padding:0 var(--space-2)}.btn--quiet:hover:not(:disabled){background:var(--bg-subtle);color:var(--text)}.btn--icon{width:var(--tap);padding:0}.btn--lg{min-height:48px;font-size:var(--step-4)}.btn--block{width:100%}.btn--small{min-height:32px;padding:0 var(--space-3);font-size:var(--step-2);border-radius:var(--r-sm)}.field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}.field__label{font-size:var(--step-2);font-weight:500;color:var(--text-secondary)}.field__hint{font-size:var(--step-2);color:var(--text-tertiary)}.field__error{font-size:var(--step-2);font-weight:500;color:var(--danger)}.input{width:100%;min-height:var(--tap);padding:0 var(--space-3);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-md);font-size:var(--step-4);transition:border-color var(--fast) var(--ease-out)}.input::placeholder{color:var(--text-tertiary)}.input:hover{border-color:var(--text-tertiary)}.input:focus{border-color:var(--accent)}.input[aria-invalid=true]{border-color:var(--danger)}input[type=search]::-webkit-search-cancel-button{appearance:none}.search-wrap{position:relative;display:flex;align-items:center}.search-wrap__icon{position:absolute;left:var(--space-4);display:flex;color:var(--text-tertiary);pointer-events:none}.input--search{padding-left:44px}.search-wrap__clear{position:absolute;right:var(--space-2);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:var(--r-full);background:transparent;color:var(--text-tertiary)}.search-wrap__clear:hover{background:var(--bg-subtle);color:var(--text)}.form-grid{display:grid;gap:var(--space-4);max-width:520px}.field-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--space-4)}.form-actions{display:flex;gap:var(--space-3);flex-wrap:wrap}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:var(--space-1);min-height:22px;padding:0 var(--space-2);border-radius:var(--r-full);background:var(--bg-subtle);color:var(--text-secondary);font-size:var(--step-1);font-weight:500;white-space:nowrap}.badge--blue{background:var(--accent-soft);color:var(--accent)}.badge--green{background:var(--success-soft);color:var(--success)}.badge--red{background:var(--danger-soft);color:var(--danger)}.badge--amber{background:var(--warn-soft);color:var(--warn)}.badge--muted{background:transparent;border:1px solid var(--border);color:var(--text-tertiary)}.live-dot{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--step-2);color:var(--text-secondary)}.live-dot:before{content:"";width:8px;height:8px;border-radius:var(--r-full);background:var(--success)}.live-dot--paused:before{background:var(--text-tertiary)}.banner{display:flex;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg-subtle);font-size:var(--step-3)}.banner--info{background:var(--brand-tint);border-color:color-mix(in srgb,var(--accent) 22%,var(--border))}.banner--warn{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 26%,var(--border));color:var(--warn)}.banner--error{background:var(--danger-soft);border-color:color-mix(in srgb,var(--danger) 26%,var(--border));color:var(--danger)}.banner__icon{flex:none;margin-top:2px}.banner__body{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}.banner__title{font-weight:600}.cover{display:flex;align-items:center;justify-content:center;flex:none;overflow:hidden;border-radius:var(--r-sm);background:var(--bg-subtle);color:var(--text-tertiary)}.cover img{width:100%;height:100%;object-fit:cover}.spinner{display:inline-block;width:16px;height:16px;border:2px solid color-mix(in srgb,var(--accent) 25%,transparent);border-top-color:var(--accent);border-radius:var(--r-full);animation:spin .7s linear infinite}.spinner--lg{width:24px;height:24px;border-width:2.5px}@keyframes spin{to{transform:rotate(360deg)}}.skeleton{display:block;background:linear-gradient(90deg,var(--bg-subtle),var(--border),var(--bg-subtle));background-size:200% 100%;border-radius:var(--r-sm);animation:shimmer 1.4s linear infinite}.skeleton--line{height:12px;border-radius:var(--r-xs)}.skeleton--cover{width:44px;height:44px}@keyframes shimmer{to{background-position:-200% 0}}.empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-8) var(--space-4);color:var(--text-secondary);text-align:center}.empty h3{color:var(--text)}.empty__icon{display:flex;color:var(--text-tertiary)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}.card--pad{padding:var(--space-5)}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}.section-head h2{font-size:var(--step-2);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary)}.panel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap;margin-bottom:var(--space-5)}.panel-head h1{font-size:var(--step-5);letter-spacing:-.015em}.panel-head p{margin-top:var(--space-1);color:var(--text-secondary);font-size:var(--step-3)}.panel-head__actions{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.tabs{display:inline-flex;padding:2px;background:var(--bg-subtle);border-radius:var(--r-md)}.tabs__tab{min-height:36px;padding:0 var(--space-3);border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-secondary);font-size:var(--step-2);font-weight:500;transition:background var(--fast) var(--ease-out),color var(--fast) var(--ease-out)}.tabs__tab:hover:not(:disabled){color:var(--text)}.tabs__tab[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-xs)}.tabs__tab:disabled{opacity:.5;cursor:not-allowed}.table-card{overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}.table-scroll{overflow-x:auto}.table{width:100%;font-size:var(--step-3)}.table thead th{position:sticky;top:0;z-index:1;padding:var(--space-3);background:var(--surface);border-bottom:1px solid var(--border);color:var(--text-tertiary);font-size:var(--step-2);font-weight:500;text-align:left;white-space:nowrap}.table tbody td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border);vertical-align:middle}.table tbody tr:last-child td{border-bottom:0}.table tbody tr:hover{background:var(--bg-subtle)}.table tbody tr[data-completed=true]{color:var(--text-secondary)}.cell-time,.cell-num{font-variant-numeric:tabular-nums;white-space:nowrap}.cell-num{text-align:right}.cell-singer{max-width:200px}.cell-actions{text-align:right;white-space:nowrap}.cell-song{display:flex;align-items:center;gap:var(--space-3);min-width:220px}.cell-song__text{display:flex;flex-direction:column;min-width:0}.cell-song__title{font-weight:500;letter-spacing:-.011em}.cell-song__artist{color:var(--text-secondary);font-size:var(--step-2)}.table-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);color:var(--text-tertiary);font-size:var(--step-2);flex-wrap:wrap}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-5) var(--space-4);padding:var(--space-4) 0;margin-bottom:var(--space-6);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.kpi{display:flex;flex-direction:column;gap:2px;min-width:0}.kpi__label{color:var(--text-secondary);font-size:var(--step-2)}.kpi__value{font-size:var(--step-6);font-weight:600;letter-spacing:-.015em;font-variant-numeric:tabular-nums;line-height:1.15}.kpi__value--text{font-size:var(--step-4);font-weight:500;letter-spacing:-.011em;white-space:nowrap}.kpi__hint{color:var(--text-tertiary);font-size:var(--step-1)}.progress{height:6px;overflow:hidden;background:var(--bg-subtle);border-radius:var(--r-full)}.progress__bar{height:100%;background:var(--accent);border-radius:var(--r-full);transition:width var(--base) var(--ease-out)}.progress__bar--indeterminate{width:40%!important;animation:slide 1.2s var(--ease) infinite}@keyframes slide{0%{transform:translate(-100%)}to{transform:translate(250%)}}.sync-item{display:grid;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--border)}.sync-item:last-child{border-bottom:0}.sync-item__title{font-weight:500;letter-spacing:-.011em}.sync-item__meta{color:var(--text-secondary);font-size:var(--step-2)}.sync-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:var(--space-3)}.sheet-backdrop{position:fixed;inset:0;z-index:40;background:#0f122066;animation:fade var(--base) var(--ease-out)}.sheet{position:fixed;z-index:41;left:0;right:0;bottom:0;display:flex;flex-direction:column;max-height:92dvh;padding-bottom:var(--safe-bottom);background:var(--surface);border-top:1px solid var(--border);border-radius:var(--r-xl) var(--r-xl) 0 0;animation:sheet-up var(--base) var(--ease-out)}.sheet__grip{width:36px;height:4px;margin:var(--space-3) auto 0;background:var(--border-strong);border-radius:var(--r-full)}.sheet__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-4) var(--space-2)}.sheet__head h2{font-size:var(--step-4);font-weight:500;letter-spacing:-.011em}.sheet__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--space-2) var(--space-4) var(--space-4)}.sheet__foot{padding:var(--space-3) var(--space-4) var(--space-5);border-top:1px solid var(--border);background:var(--surface)}@keyframes sheet-up{0%{transform:translateY(12px);opacity:.6}to{transform:translateY(0);opacity:1}}@keyframes fade{0%{opacity:0}to{opacity:1}}@media(min-width:720px){.sheet{inset:50% auto auto 50%;width:420px;max-height:84dvh;border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);transform:translate(-50%,-50%);animation:none}}.toast-host{position:fixed;left:50%;bottom:calc(var(--space-5) + var(--safe-bottom));z-index:50;display:flex;flex-direction:column;gap:var(--space-2);width:min(420px,calc(100vw - 32px));transform:translate(-50%);pointer-events:none}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-md);font-size:var(--step-3);animation:sheet-up var(--base) var(--ease-out)}.toast--success{color:var(--success)}.toast--error{color:var(--danger)}.login-shell{display:flex;align-items:center;justify-content:center;min-height:100dvh;padding:var(--space-5);background:var(--bg-subtle)}.login-card{display:grid;gap:var(--space-4);width:min(368px,100%);padding:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}.login-card__head{display:flex;align-items:center;gap:var(--space-3)}.login-card__mark{width:44px;height:44px;flex:none}.login-card h1{font-size:var(--step-5)}.login-card__sub{color:var(--text-secondary);font-size:var(--step-2)}.public-shell{display:flex;flex-direction:column;min-height:100dvh;background:var(--bg)}.masthead{position:sticky;top:0;z-index:30;padding-top:var(--safe-top);background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--border)}.masthead__inner{display:flex;align-items:center;gap:var(--space-3);width:min(100%,var(--content-max));min-height:56px;margin:0 auto;padding:var(--space-2) var(--space-4)}.masthead__mark{width:28px;height:28px;flex:none}.masthead__titles{display:flex;flex-direction:column;min-width:0}.masthead__club{color:var(--brand);font-size:var(--step-2);font-weight:600;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.masthead__app{color:var(--text-tertiary);font-size:var(--step-2)}.masthead__spacer{flex:1}.status-pill{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--step-2);color:var(--text-secondary);white-space:nowrap}.status-pill__dot{width:8px;height:8px;border-radius:var(--r-full);background:var(--text-tertiary)}.status-pill--open .status-pill__dot{background:var(--success)}.status-pill--closed .status-pill__dot{background:var(--danger)}.admin-link{display:none;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--r-md);color:var(--text-tertiary);transition:background var(--fast) var(--ease-out),color var(--fast) var(--ease-out)}.admin-link:hover{background:var(--bg-subtle);color:var(--text);text-decoration:none}@media(min-width:1024px){.admin-link{display:inline-flex}}.public-main{display:flex;flex-direction:column;gap:var(--space-5);width:min(100%,var(--content-max));margin:0 auto;padding:var(--space-6) var(--space-4) var(--space-10)}.search-panel{position:relative}.search-dropdown{position:absolute;top:calc(100% + var(--space-2));left:0;right:0;z-index:20;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-md)}.song-list{max-height:min(58dvh,420px);overflow-y:auto;overscroll-behavior:contain}.song-row{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:var(--space-3);width:100%;min-height:60px;padding:var(--space-2) var(--space-3);background:transparent;border:0;border-bottom:1px solid var(--border);text-align:left;transition:background var(--fast) var(--ease-out)}.song-row:last-child{border-bottom:0}.song-row:hover,.song-row:focus-visible{background:var(--bg-subtle)}.song-row__cover{width:44px;height:44px}.song-row__main{display:flex;flex-direction:column;gap:1px;min-width:0}.song-row__title{font-size:var(--step-4);font-weight:500;letter-spacing:-.011em}.song-row__artist{color:var(--text-secondary);font-size:var(--step-3)}.song-row__title,.song-row__artist{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.song-row__tags{display:flex;gap:var(--space-1);margin-top:2px;flex-wrap:wrap}.song-row__chevron{color:var(--text-tertiary)}.song-row__aside{display:flex;align-items:center;gap:var(--space-2)}.song-row__year{color:var(--text-tertiary);font-size:var(--step-2);font-variant-numeric:tabular-nums}.queue-note{display:inline-flex;align-items:center;gap:var(--space-1);padding:3px var(--space-2);background:var(--accent-soft);border-radius:var(--r-full);color:var(--accent);font-size:var(--step-1);font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}.queue-note--plain{background:transparent;color:var(--accent);padding:0}.search-state{padding:var(--space-4);color:var(--text-secondary);font-size:var(--step-3);text-align:center}.search-more{display:flex;justify-content:center;padding:var(--space-3);border-top:1px solid var(--border);background:var(--surface)}.song-detail{display:flex;gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--border)}.song-detail__cover{width:96px;height:96px}.song-detail__meta{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}.song-detail__title{font-size:var(--step-5);letter-spacing:-.015em}.song-detail__artist{color:var(--text-secondary);font-size:var(--step-3)}.song-detail .queue-note,.sheet .queue-note{align-self:flex-start;margin-top:var(--space-2);padding:4px var(--space-3);font-size:var(--step-2)}.confirm{display:grid;gap:var(--space-4);justify-items:center;padding:var(--space-6) var(--space-5);text-align:center}.confirm__check{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--success-soft);border-radius:var(--r-full);color:var(--success)}.confirm__song{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3);background:var(--bg-subtle);border-radius:var(--r-md);text-align:left}.closed-view{display:grid;gap:var(--space-4);justify-items:center;padding:var(--space-8) var(--space-4);text-align:center}.closed-view__plate{width:96px;opacity:.9}.closed-view__text{display:grid;gap:var(--space-2);justify-items:center}.closed-view__text h1{font-size:var(--step-5)}.closed-view__text p{color:var(--text-secondary);font-size:var(--step-3)}.closed-view__stamp{color:var(--text-tertiary);font-size:var(--step-2)}.wish-list{display:grid}.wish-item{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border)}.wish-item:last-child{border-bottom:0}.wish-item__main{display:flex;flex-direction:column;min-width:0}.wish-item__title{font-weight:500;letter-spacing:-.011em}.wish-item__meta{color:var(--text-secondary);font-size:var(--step-2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.public-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:min(100%,var(--content-max));margin:0 auto;padding:var(--space-5) var(--space-4) calc(var(--space-5) + var(--safe-bottom));color:var(--text-tertiary);font-size:var(--step-2)}.public-footer__brand{display:inline-flex;align-items:center;gap:var(--space-2)}.public-footer__crest{width:20px;height:20px;opacity:.8}@media(max-width:480px){.masthead__app{display:none}}@media(min-width:720px){.public-main{padding-top:var(--space-8)}}