/* TSports visual language: bright surfaces, teal actions, readable hierarchy. */
@media screen {
    :root { --primary:#0f766e; --primary-dark:#115e59; --page:#f3f6fa; --text:#152b3c; --muted:#52667a; --border:#dfe7ee; --radius:18px; --shadow:0 6px 24px #102a4306; }
    body { -webkit-font-smoothing:antialiased; }
    .page-content { max-width:1680px; padding:28px 30px 40px; }
    .page-content h1 { color:#112c3e; font-size:clamp(26px,2.7vw,34px); letter-spacing:-.04em; line-height:1.2; }
    .page-content h2 { letter-spacing:-.025em; line-height:1.35; }
    .page-content p { color:#52667a; }
    .eyebrow { color:#0f766e; font-size:10px; letter-spacing:.12em; }
    .button { border-radius:11px; min-height:42px; font-weight:650; gap:7px; transition:background .15s,border-color .15s,box-shadow .15s; }
    .button.primary { color:#fff; background:#0f766e; border-color:#0f766e; box-shadow:0 3px 8px #0f766e12; }
    .button.primary:hover:enabled { background:#115e59; border-color:#115e59; }
    .button.secondary { color:#244052; background:#fff; border:1px solid #cbd8e4; }
    .button.danger, .button.danger-soft { color:#b42332; background:#fff1f2; border:1px solid #fecdd3; }
    .button.danger:hover:enabled { color:#fff; background:#b42332; border-color:#b42332; }
    .input-control { min-height:43px; border:1px solid #cbd8e4; border-radius:10px; color:#152b3c; background:#fff; padding:10px 12px; }
    .input-control:disabled { background:#f1f5f9; color:#64748b; }
    .field-group > label { color:#334c60; font-size:12px; font-weight:650; margin-bottom:7px; }
    .status-pill { font-size:11px; padding:5px 9px; font-weight:700; border-radius:999px; }
    .status-pill.empty { color:#0f766e; background:#e6f7f1; }
    .status-pill.booked { color:#92400e; background:#fff3d6; }
    .status-pill.playing { color:#1e40af; background:#eaf2ff; }
    .alert { border-radius:12px; padding:13px 16px; font-size:13px; line-height:1.6; }
    .alert.error { color:#9f2234; background:#fff1f2; border:1px solid #fecdd3; }
    .alert.success { color:#115e59; background:#ecfdf5; border:1px solid #a7f3d0; }
    .page-content :is(.panel,.program-section,.customer-toolbar,.settings-card,.table-panel,.report-panel,.log-panel) { border-radius:18px; border-color:#dfe7ee; box-shadow:0 5px 22px #0f172a03; }
    .page-content :is(.heading-actions,.row-actions,.form-actions) { gap:9px; flex-wrap:wrap; }
    .sidebar { background:linear-gradient(180deg,#102b3c,#0d2232); }
    .sidebar-brand { padding-bottom:20px; border-bottom:1px solid #ffffff0d; }
    .nav-section-label { color:#8ea9ba; font-size:9px; letter-spacing:.12em; font-weight:750; margin:22px 12px 9px; }
    .sidebar-nav .nav-item { min-height:42px; color:#c2d2df; margin:3px 0; border-radius:11px; font-size:13px; }
    .sidebar-nav .nav-item.active { color:#fff; background:#0f766e; box-shadow:0 4px 12px #00000012; }
    .sidebar-account { border-top:1px solid #ffffff12; }
    .workspace-heading { background:#ffffffec; border-bottom:1px solid #e2e8f0; padding:18px 30px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
    .workspace-eyebrow { display:block; font-size:9px; font-weight:750; letter-spacing:.1em; color:#718599; margin-bottom:5px; }
    .workspace-heading > div > strong { font-size:15px; }
    .workspace-user { display:flex; gap:10px; align-items:center; }
    .workspace-user strong { font-size:12px; }
    .workspace-user small { display:block; font-size:11px; color:#64748b; margin-top:3px; }
    .workspace-avatar { width:34px; height:34px; display:grid; place-items:center; background:#e2f3f0; color:#0f766e; border-radius:11px; font-weight:750; font-size:12px; }
    .action-launcher { padding:22px; display:flex; flex-direction:column; align-items:flex-start; gap:10px; background:#fff; border:1px solid #dfe7ee; border-radius:18px; }
    .action-launcher p { max-width:550px; font-size:13px; line-height:1.7; }
    .login-card { border:1px solid #dfe7ee; border-radius:24px; box-shadow:0 16px 60px #0f172a0c; }
    .login-security-note small { color:#52667a; }
    .editor-dialog { border:1px solid #dbe5ed; color:#152b3c; width:min(940px,calc(100vw - 48px)); max-width:none; max-height:90dvh; padding:0; margin:auto; background:white; border-radius:22px; box-shadow:0 24px 100px #0b172640; overflow:hidden; }
    .editor-dialog[open] { display:flex; flex-direction:column; }
    .editor-dialog::backdrop { background:#10263899; backdrop-filter:blur(4px); }
    .dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; padding:23px 26px; border-bottom:1px solid #e6edf3; background:linear-gradient(110deg,#f8fbfd,#fff); flex-shrink:0; }
    .dialog-eyebrow { display:block; font-size:9px; letter-spacing:.14em; font-weight:800; color:#0f766e; margin-bottom:7px; }
    .dialog-heading h2 { font-size:23px; letter-spacing:-.035em; margin:0; }
    .dialog-heading p { color:#64748b; font-size:12px; margin:7px 0 0; }
    .dialog-close { width:36px; height:36px; min-width:36px; border:1px solid #dbe5ed; border-radius:11px; background:#fff; color:#52667a; font:inherit; font-size:24px; line-height:1; cursor:pointer; }
    .dialog-close:hover:enabled { background:#fff1f2; color:#b42332; border-color:#fecdd3; }
    .dialog-content { padding:24px 26px; overflow-y:auto; overscroll-behavior:contain; min-height:0; }
    .dialog-fields { border:0; padding:0; margin:0; min-width:0; }
    .dialog-saving { color:#0f766e; background:#f0fdfa; border-radius:10px; padding:11px 14px; margin-bottom:14px; font-size:12px; }
    body dialog.editor-dialog .dialog-fields > :is(div,section) { width:auto; max-width:none; max-height:none; margin:0; padding:0; background:#fff; border:0; border-radius:0; box-shadow:none; overflow:visible; }
    .dialog-fields > :is(div,section) > :is(.editor-heading,.section-title-row,.section-heading-row,.section-head-row,.social-dialog-heading,h2:first-child) { display:none; }
    .dialog-fields :is(.editor-grid,.customer-form-grid,.court-form-grid,.booking-form-grid,.walkin-grid,.employee-form-grid,.social-form-grid,.password-grid) { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
    .dialog-fields :is(.field-note,.wide,.field-wide) { grid-column:1/-1; }
    .dialog-fields .field-group { min-width:0; margin-bottom:14px; }
    .dialog-fields .mini-editor { display:grid; gap:12px; }
    .dialog-fields :is(.participant-form,.service-add-form,.player-service-form) { display:flex; flex-direction:column; gap:12px; }
    .dialog-fields :is(.stock-card,.general-setting-grid) { display:block; }
    .dialog-fields .form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:22px; padding-top:18px; border-top:1px solid #e6edf3; }
    .dialog-fields .preserved-gifts { margin:14px 0; }
    .dialog-fields .toggle-row { align-items:center; gap:12px; flex-wrap:wrap; }
    .dialog-fields .toggle-row > strong { flex:1; min-width:130px; }
    .dialog-fields .pos-modal > h2:first-child, .dialog-fields .social-payment-modal > h2:first-child { display:none; }
}
@media screen and (max-width:959px) {
    .workspace-heading { display:none; }
    .page-content { padding:22px 18px calc(100px + env(safe-area-inset-bottom)); }
}
@media screen and (max-width:640px) {
    .page-content { padding-inline:14px; }
    .page-content h1 { font-size:26px; }
    .input-control { font-size:16px; min-height:46px; }
    .button, .button.compact { min-height:44px; }
    .editor-dialog { width:100%; max-width:100%; max-height:94dvh; margin:auto 0 0; border-radius:22px 22px 0 0; border-bottom:0; }
    .dialog-heading { padding:20px 17px 16px; }
    .dialog-heading h2 { font-size:21px; }
    .dialog-close { width:40px; height:40px; min-width:40px; }
    .dialog-content { padding:18px 17px calc(22px + env(safe-area-inset-bottom)); }
    .dialog-fields :is(.editor-grid,.customer-form-grid,.court-form-grid,.booking-form-grid,.walkin-grid,.employee-form-grid,.social-form-grid,.password-grid,.group-layout,.tier-layout) { grid-template-columns:1fr; }
    .dialog-fields .form-actions { position:sticky; bottom:-22px; background:white; padding-bottom:16px; margin-bottom:-6px; z-index:1; }
    .dialog-fields .form-actions > .button { flex:1; }
    .dialog-fields .toggle-row { padding-block:12px; border-bottom:1px solid #edf2f7; }
    .dialog-fields .toggle-row .input-control { width:85px; }
    .dialog-fields .choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .action-launcher { padding:18px; }
}
@media (prefers-reduced-motion:reduce) { .button { transition:none; } }

@media screen {
    /* Keep explanations and protected-account notes while removing duplicate titles. */
    .dialog-fields > :is(div,section) > :is(.editor-heading,.section-title-row,.section-heading-row,.section-head-row,.social-dialog-heading):has(small,p) { display:block; padding:0; border:0; margin:0 0 16px; }
    .dialog-fields > :is(div,section) > :is(.editor-heading,.section-title-row,.section-heading-row,.section-head-row,.social-dialog-heading) > :is(button,.close-button,.icon-close) { display:none; }
    .dialog-fields > :is(div,section) > :is(.editor-heading,.section-title-row,.section-heading-row,.section-head-row,.social-dialog-heading) :is(h2,h3,.eyebrow) { display:none; }
    .dialog-fields > :is(div,section) > :is(.editor-heading,.section-title-row,.section-heading-row,.section-head-row,.social-dialog-heading) :is(small,p) { display:block; font-size:12px; color:#52667a; line-height:1.7; margin:0; }
    .dialog-fields .role-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
}
@media screen and (max-width:640px) { .dialog-fields .role-form-grid { grid-template-columns:1fr; } }
@media screen {
    .editor-dialog.dialog-compact { width:min(600px,calc(100vw - 48px)); }
    .dialog-compact .dialog-fields :is(.editor-grid,.customer-form-grid,.password-grid,.social-price-form-grid) { grid-template-columns:1fr; }
}
@media screen and (max-width:640px) { .editor-dialog.dialog-compact { width:100%; } }
@media print { .workspace-heading, .editor-dialog { display:none !important; } }

.request-loading-indicator { position:sticky; top:12px; z-index:20; display:flex; align-items:center; justify-content:center; gap:12px; padding:12px 18px; margin-bottom:14px; border:1px solid #5eead4; border-radius:12px; background:#f0fdfa; color:#115e59; box-shadow:0 4px 18px #0f766e12; font-size:13px; font-weight:600; }
.request-loading-indicator .spinner { width:20px; height:20px; margin:0; flex-shrink:0; }
@media print { .request-loading-indicator { display:none; } }