:root {
  --turno-ink: #17233d;
  --turno-muted: #667085;
  --turno-primary: #4054d6;
  --turno-primary-dark: #2f3da5;
  --turno-teal: #13a99a;
  --turno-surface: #ffffff;
  --turno-background: #f5f7fb;
  --turno-border: #e4e8f1;
  --turno-radius: 1rem;
}

html { font-size: 16px; position: relative; min-height: 100%; }
body { min-height: 100vh; margin: 0; background: var(--turno-background); color: var(--turno-ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
h1, h2, h3, h4 { font-weight: 750; letter-spacing: -.025em; }
a { color: var(--turno-primary); text-decoration-thickness: .08em; text-underline-offset: .18em; }
.container { max-width: 1180px; }
.site-header { position: sticky; top: 0; z-index: 1030; background: rgba(255,255,255,.88); border-bottom: 1px solid rgba(228,232,241,.85); backdrop-filter: blur(18px); }
.company-banner { padding: .65rem 0; background: var(--turno-ink); color: #fff; }
.company-banner .container { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem .85rem; }
.company-caption { font-size: .65rem; letter-spacing: .13em; color: #b9c1ff; }
.company-name { min-width: 0; font-size: .95rem; line-height: 1.5; overflow-wrap: anywhere; }
.navbar { min-height: 76px; }
.navbar-brand { color: var(--turno-ink) !important; letter-spacing: -.03em; text-decoration: none; }
.brand-mark { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-right: .35rem; border-radius: 10px; background: linear-gradient(135deg, var(--turno-primary), #6977f0); color: #fff; box-shadow: 0 6px 16px rgba(64,84,214,.25); }
.brand-label { vertical-align: middle; }
.navbar-nav { gap: .25rem; }
.navbar-nav .nav-link { border-radius: 10px; padding: .55rem .8rem !important; color: #4b5568 !important; font-size: .93rem; font-weight: 600; text-decoration: none; transition: .2s ease; }
.navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus { background: #eef0ff; color: var(--turno-primary) !important; }
.navbar-nav form { margin: 0; }
.btn { border-radius: .7rem; font-weight: 650; padding: .62rem 1rem; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { border-color: var(--turno-primary); background: var(--turno-primary); box-shadow: 0 6px 14px rgba(64,84,214,.18); }
.btn-primary:hover, .btn-primary:focus { border-color: var(--turno-primary-dark); background: var(--turno-primary-dark); }
.btn-light { color: var(--turno-ink); }
.form-control, .form-select { border-color: #d9deea; border-radius: .65rem; padding: .7rem .85rem; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: #8d99ed; box-shadow: 0 0 0 .22rem rgba(64,84,214,.14); }
.form-label { color: #344054; font-size: .9rem; font-weight: 650; }
.card, .surface-card { border: 1px solid var(--turno-border); border-radius: var(--turno-radius); background: var(--turno-surface); box-shadow: 0 12px 30px rgba(23,35,61,.045); }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin: 2rem 0 1.5rem; }
.page-heading h1 { margin: .3rem 0 .35rem; }
.page-heading p { margin: 0; color: var(--turno-muted); }
.eyebrow { color: var(--turno-primary); font-size: .72rem; font-weight: 800; letter-spacing: .15em; }
.hero { position: relative; background: radial-gradient(circle at 90% 15%, rgba(132,149,255,.32), transparent 34%), linear-gradient(120deg, #17233d, #303e9d); color: white; overflow: hidden; box-shadow: 0 22px 42px rgba(35,48,123,.18); }
.hero::after { position: absolute; width: 300px; height: 300px; right: -130px; bottom: -180px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; content: ""; }
.hero .eyebrow { color: #b9c1ff; }
.accent-text { color: #aeb7ff; }
.hero-card { border: 0; border-radius: 1.1rem; background: rgba(255,255,255,.97); color: var(--turno-ink); padding: 1.5rem; }
.ticket-number { color: var(--turno-primary); font-size: 4rem; line-height: 1; font-weight: 800; letter-spacing: .05em; }
.status-dot { color: #119b78; font-size: .8rem; font-weight: 700; }
.feature-card { height: 100%; border: 1px solid var(--turno-border); border-radius: var(--turno-radius); background: white; padding: 1.5rem; transition: transform .2s ease, box-shadow .2s ease; }
.feature-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(23,35,61,.08); }
.feature-card p { color: var(--turno-muted); margin-bottom: 0; }
.feature-icon { display: inline-grid; place-items: center; width: 2.2rem; height: 2.2rem; margin-bottom: 1.25rem; border-radius: .7rem; background: #eef0ff; color: var(--turno-primary); font-size: .75rem; font-weight: 800; }
.cta-panel { border: 1px solid #dce1ff; background: linear-gradient(110deg, #eef0ff, #f8f9ff); }
.site-footer { margin-top: 4rem; padding: 1.75rem 0; border-top: 1px solid var(--turno-border); color: var(--turno-muted); font-size: .88rem; }
.table { margin-bottom: 0; }
.table thead th { border-bottom-width: 1px; color: #667085; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.table tbody td { border-color: #edf0f5; color: #344054; }
.table tbody tr:last-child td { border-bottom: 0; }
.badge { border-radius: 99px; padding: .45rem .65rem; font-weight: 700; }
.user-editor-modal-content { overflow: hidden; border: 0; border-radius: 1rem; box-shadow: 0 24px 70px rgba(16,24,40,.25); }
.user-editor-modal-content .modal-header { border-bottom: 1px solid var(--turno-border); padding: 1rem 1.25rem; }
.user-editor-modal-content .modal-body { min-height: 70vh; }
.user-editor-modal-content iframe { display: block; width: 100%; height: min(76vh, 760px); border: 0; }
.dialog-body { min-height: 100vh; margin: 0; background: linear-gradient(135deg, #f5f7fb, #eef1f8); }
.dialog-main { max-width: 1100px; margin: 0 auto; padding: 2rem clamp(1rem, 4vw, 3rem); }
.user-editor-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--turno-border); }
.user-editor-header h1 { margin: .35rem 0 .25rem; color: var(--turno-ink); }
.user-editor-header p { margin: 0; color: var(--turno-muted); }
.user-editor-form { padding: clamp(1rem, 3vw, 1.75rem); border: 1px solid var(--turno-border); border-radius: var(--turno-radius); background: white; box-shadow: 0 .5rem 1.5rem rgba(23,35,61,.07); }
.user-editor-form fieldset { padding-top: 1.25rem; border-top: 1px solid var(--turno-border); }
.user-editor-form legend { color: var(--turno-ink); font-size: 1rem; font-weight: 750; }
.user-editor-actions { display: flex; justify-content: flex-end; gap: .75rem; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--turno-border); }
.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder { color: var(--bs-secondary-color); text-align: end; }
.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder { text-align: start; }
@media (max-width: 991px) { .navbar-nav { padding-top: 1rem; } .navbar-nav .nav-item { margin-bottom: .25rem; } .page-heading { align-items: flex-start; flex-direction: column; } }
@media (max-width: 575px) { .hero h1 { font-size: 2.45rem; } .ticket-number { font-size: 3.2rem; } .user-editor-header { flex-direction: column; } }