/* TEAR SUPORTE — visual system. Shared by all application screens. */
:root {
  --red:#e72e37;
  --red-dark:#ca222c;
  --ink:#202632;
  --muted:#697484;
  --line:#e5e8ee;
  --bg:#f4f5f8;
  --green:#16816b;
  --radius:18px;
  font-family:"Segoe UI",Arial,sans-serif;
  font-size:15px;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
}
body { background:var(--bg); }
::selection { background:#fbd2d5; color:#7d1520; }
:focus-visible { outline:3px solid #e72e3770; outline-offset:4px; }
h1 { font-size:34px; letter-spacing:-1.2px; font-weight:700; line-height:1.18; }
h2 { font-size:19px; letter-spacing:-.35px; }
.eyebrow { font-size:11px; letter-spacing:1.7px; }
.icon { width:20px; height:20px; }
.layout { grid-template-columns:258px minmax(0,1fr); }
.sidebar {
  width:258px; padding:26px 17px 20px;
  background:#22262e; border:0; color:#f5f6fa;
  overflow-y:auto; scrollbar-width:thin; scrollbar-color:#4d5360 transparent;
}
.brand { padding:0 15px 24px; display:flex; align-items:center; gap:14px; flex-shrink:0; }
.brand-logo { width:91px; height:55px; padding:7px; border-radius:9px; background:white; display:grid; place-items:center; }
.brand img { width:77px; height:auto; }
.brand-wordmark { display:flex; flex-direction:column; gap:4px; }
.brand-wordmark small { font-size:10px; font-weight:650; letter-spacing:3px; color:#9da5b4; }
.brand-wordmark strong { font-size:24px; letter-spacing:-.7px; line-height:1; font-weight:650; }
.brand-sub { display:none; }
.nav-label { padding:20px 15px 12px; color:#929aa9; font-size:10px; letter-spacing:1.6px; }
.nav-link { padding:12px 15px; min-height:45px; gap:12px; margin-bottom:4px; font-size:13px; font-weight:500; color:#bbc1cd; border-radius:9px; transition:background .18s,color .18s; flex-shrink:0; width:100%; text-align:left; }
.nav-link .icon { width:18px; height:18px; color:#919baa; }
.nav-link:hover { background:#ffffff09; color:white; }
.nav-link.active { background:var(--red); color:white; box-shadow:0 5px 16px #0e101733; }
.nav-link.active .icon { color:white; }
.nav-link.active:after { background:#ffffffb3; width:5px; height:5px; }
.sidebar-bottom { padding-top:22px; flex-shrink:0; }
.sidebar-tip { display:flex; gap:11px; padding:15px 13px; margin:0 2px 15px; border:1px solid #ffffff13; background:#ffffff04; border-radius:10px; font-size:11px; line-height:1.6; color:#aab3c2; }
.sidebar-tip .icon { color:#ee777d; width:18px; margin-top:2px; }
.sidebar-tip strong { display:block; font-size:12px; color:#e4e7ed; margin-bottom:3px; font-weight:550; }
.sidebar-foot { margin:17px 14px 0; border-top:1px solid #ffffff10; padding:17px 0 0; color:#9aa3b2; font-size:10px; letter-spacing:.2px; }
.sidebar-foot .dot { background:#65c0a7; }
.topbar { height:82px; padding:0 38px; gap:25px; background:#fff; }
.breadcrumb { font-size:13px; color:#788393; gap:13px; }
.breadcrumb .icon { width:15px; height:15px; color:#aab2c0; }
.breadcrumb strong { color:#374152; font-weight:550; }
.global-search { width:310px; gap:11px; padding:10px 12px; background:#f5f6f9; border:1px solid #edf0f5; border-radius:9px; }
.global-search input { font-size:12px; color:var(--ink); }
.global-search input::placeholder { color:#7f8998; }
.global-search:focus-within { border-color:#ed9ca2; box-shadow:0 0 0 3px #e72e370a; }
.kbd { background:white; color:#788393; font-size:10px; padding:2px 5px; }
.profile { gap:12px; padding-left:24px; }
.profile .avatar { width:39px; height:39px; background:#fff0f1; color:#d32934; border:1px solid #fbdde0; border-radius:12px; }
.profile-name { font-size:13px; }
.profile-role { font-size:11px; color:#7e8796; margin-top:4px; }
.content { padding:33px 38px 22px; max-width:1720px; }
.page-head { margin-bottom:25px; align-items:center; }
.page-head p { font-size:14px; line-height:1.7; max-width:650px; }
.page-head .eyebrow { margin-bottom:10px; color:#8992a0; }
.date-label { color:#727e8f; font-size:12px; padding-right:4px; }
.date-label .icon { width:16px; }
.btn { font-size:13px; font-weight:650; padding:12px 18px; border-radius:9px; min-height:43px; transition:background .16s,box-shadow .16s,transform .16s; }
.btn:not(.secondary):not(.ghost) { box-shadow:0 4px 10px #d32a3420; }
.btn:hover { transform:translateY(-1px); box-shadow:0 6px 14px #d32a3429; }
.btn:active { transform:translateY(0); }
.btn.secondary { border-color:#dfe4ec; color:#435064; }
.btn.secondary:hover { box-shadow:0 3px 9px #26314308; background:#fafbfc; }
.btn.small { min-height:33px; padding:7px 11px; font-size:12px; }
.btn .icon { width:17px; height:17px; }
.hero {
  background:#282d37; color:white; border-radius:18px; padding:29px 32px;
  display:flex; justify-content:space-between; align-items:center; gap:24px;
  position:relative; overflow:hidden; margin-bottom:23px; min-height:164px;
  box-shadow:0 7px 20px #1820300a;
}
.hero:before { content:""; position:absolute; inset:0 0 0 auto; width:330px; background:repeating-linear-gradient(135deg,transparent 0 18px,#ffffff04 18px 19px,transparent 19px 38px),linear-gradient(115deg,transparent,#e72e371f); pointer-events:none; }
.hero:after { content:""; position:absolute; top:0; left:0; bottom:0; width:4px; background:var(--red); }
.hero-content,.hero-action { z-index:1; position:relative; }
.hero-kicker { display:flex; gap:9px; align-items:center; color:#eeb3b9; text-transform:uppercase; letter-spacing:1.7px; font-size:10px; font-weight:600; margin-bottom:12px; }
.hero-kicker .icon { width:14px; height:14px; }
.hero h2 { font-size:28px; letter-spacing:-.7px; margin-bottom:9px; font-weight:600; }
.hero p { font-size:13px; color:#bdc4d0; max-width:580px; line-height:1.8; margin:0; }
.hero p strong { color:white; font-weight:600; }
.hero-action { text-align:right; flex-shrink:0; }
.hero-action .btn { background:white; color:#353e4d; border-color:transparent; box-shadow:0 5px 20px #11151c20; }
.hero-action small { display:block; font-size:10px; color:#adb5c5; margin-top:11px; }
.stats { gap:18px; margin-bottom:23px; }
.stat { border:1px solid #e5e8ef; border-radius:14px; padding:21px 22px; box-shadow:0 3px 8px #1e293b02; transition:box-shadow .2s,transform .2s,border-color .2s; }
a.stat:hover { transform:translateY(-3px); box-shadow:0 8px 23px #2433470a; border-color:#cfd6e1; }
.stat-top { font-size:13px; font-weight:500; color:#6b7687; gap:10px; }
.stat-icon { width:37px; height:37px; border-radius:11px; }
.stat-icon.red { color:#dc3a45; background:#fff0f2; }
.stat-icon.amber { color:#bc852c; background:#fff6e9; }
.stat-icon.green { color:#19846e; background:#eaf7f3; }
.stat-value { font-size:37px; letter-spacing:-1.1px; font-weight:650; margin:10px 0; }
.stat-sub { font-size:11px; line-height:1.6; color:#8590a0; }
.quick-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:28px; }
.quick-action { display:flex; align-items:center; gap:14px; padding:17px 19px; background:#fff; border:1px solid var(--line); border-radius:12px; transition:border-color .18s,box-shadow .18s; min-width:0; }
.quick-action:hover { border-color:#eeafb4; box-shadow:0 5px 16px #4b2c3305; }
.quick-action-icon { width:40px; height:40px; background:#f6f7fa; border:1px solid #edf0f5; color:#6c7a90; border-radius:11px; display:grid; place-items:center; flex-shrink:0; }
.quick-action:first-child .quick-action-icon { color:var(--red); background:#fff5f5; border-color:#ffe4e6; }
.quick-action strong { display:block; font-size:13px; font-weight:600; margin-bottom:5px; }
.quick-action p { font-size:11px; color:#8590a0; margin:0; line-height:1.5; }
.quick-action>.icon { margin-left:auto; width:16px; height:16px; color:#9aa4b2; }
.dashboard-grid { grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr); gap:22px; align-items:stretch; margin-bottom:22px; }
.dashboard-grid>.panel { margin-bottom:0; }
.panel { border-radius:15px; border-color:#e4e8ef; box-shadow:0 3px 10px #202b4002; }
.panel-head { padding:23px 25px 21px; gap:16px; }
.panel-head h2 { font-size:16px; font-weight:650; letter-spacing:-.3px; }
.panel-head p { font-size:12px; color:#8791a1; margin-top:7px; line-height:1.6; }
.panel-head>.icon { color:#8e98a7; }
.panel-body { padding:0 25px 25px; }
.panel-icon-heading { display:flex; align-items:center; gap:10px; }
.panel-icon-heading>.icon { width:18px; height:18px; color:#8b96a6; }
.chart-area { height:198px; border-color:#e7ebf1; background:repeating-linear-gradient(to top,transparent 0 48px,#f1f3f7 48px 49px); }
.bar { background:#f5b3b8; border-radius:5px 5px 0 0; }
.bar-group:nth-child(3n) .bar { background:#e8545f; }
.bar-label { font-size:10px; color:#7f8a9a; }
.chart-footer { font-size:11px; color:#8892a1; padding-top:34px; gap:7px; }
.chart-empty { min-height:235px; padding:38px 20px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border:1px dashed #e1e6ef; border-radius:11px; background:linear-gradient(180deg,#fafbfd,#fff); }
.chart-empty .empty-icon { margin-bottom:14px; }
.chart-empty h3 { margin-bottom:8px; font-size:14px; font-weight:600; }
.chart-empty p { max-width:330px; color:#8792a1; font-size:12px; margin-bottom:0; line-height:1.8; }
.distribution { padding:6px 0 23px; gap:25px; min-height:191px; }
.ring,.ring svg { width:143px; height:143px; }
.ring-center strong { font-size:33px; color:#344053; }
.ring-center span { font-size:10px; color:#8d97a6; }
.legend { gap:14px; font-size:12px; }
.legend-row { color:#7b8798; gap:8px; }
.legend-row strong { font-size:12px; color:#49576b; }
.legend-dot { width:7px; height:7px; }
.satisfaction { gap:12px; padding-top:19px; font-size:12px; color:#8993a2; }
.satisfaction strong { font-size:22px; color:#3e4b5f; }
.satisfaction .tiny { font-size:11px; margin-top:5px; }
.department-row { margin:18px 0; }
.department-label { font-size:12px; margin-bottom:10px; line-height:1.6; }
.line-progress { height:6px; background:#f0f2f6; }
.line-progress span { background:linear-gradient(90deg,#f3939b,#e73541); }
.radar-panel .empty { padding:35px 25px 31px; }
.empty { font-size:13px; color:#8692a3; line-height:1.85; padding:46px 26px; }
.empty-icon { width:54px; height:54px; border-radius:16px; background:#f4f6fa; border:1px solid #e9edf4; display:inline-grid; place-items:center; margin-bottom:17px; }
.empty .empty-icon>.icon,.chart-empty .empty-icon>.icon { width:25px; height:25px; color:#91a0b6; margin:0; }
.empty h3 { font-size:15px; font-weight:600; color:#536176; margin-bottom:7px; }
.empty p { margin:0 auto; max-width:380px; font-size:12px; color:#8993a2; }
.empty .text-link { display:inline-flex; align-items:center; gap:7px; margin-top:17px; font-size:12px; }
.empty .text-link .icon { width:14px; height:14px; color:var(--red); margin:0; }
.panel-foot { padding:14px 24px; color:#8b96a5; font-size:11px; background:#fcfdfe; gap:10px; }
.text-link { font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:7px; }
.text-link .icon { width:15px; height:15px; }
.service-note { display:flex; gap:12px; padding:18px 0 0; margin-top:20px; border-top:1px solid var(--line); color:#8b95a4; font-size:11px; line-height:1.8; }
.service-note>.icon { color:#97a4b7; flex-shrink:0; width:19px; }
.service-note strong { color:#59677c; display:block; font-size:12px; font-weight:550; }
.footer { padding:9px 1px 3px; font-size:11px; line-height:1.8; color:#8d97a6; gap:20px; }
.footer b { color:#7f8999; }
th { font-size:11px; font-weight:600; background:#f9fafc; color:#7f8a9b; padding:14px 21px; letter-spacing:.5px; }
td { font-size:13px; padding:19px 21px; }
.ticket-subject { font-size:13px; font-weight:600; }
.ticket-code { font-size:11px; color:#8a96a8; margin-bottom:6px; }
.sub-line { font-size:11px; color:#8994a4; margin-top:6px; }
.badge { padding:6px 9px; font-size:11px; border-radius:6px; font-weight:550; }
.badge.open { color:#416bab; background:#edf3fc; }
.badge.progress { color:#99712e; background:#fff6e8; }
.badge.waiting { color:#8561af; background:#f4effb; }
.badge.resolved { color:#207d64; background:#eaf6f0; }
.priority,.sla { font-size:11px; }
.filters { padding:19px 23px; gap:12px; background:#fcfdfe; }
.filters input,.filters select { padding:10px 13px; font-size:13px; border-radius:8px; }
.filters input::placeholder { color:#8b95a5; }
.tabs { padding:0 25px; gap:27px; }
.tab { padding:18px 0; font-size:13px; font-weight:550; }
.form-card { padding:30px; max-width:950px; }
.form-card h2 { font-size:19px; margin-bottom:12px; }
.field { margin-bottom:21px; }
.field label { font-size:13px; color:#4d5b70; margin-bottom:9px; }
.field input,.field textarea,.field select,.input { font-size:14px; border-radius:9px; border-color:#dfe4ed; padding:12px 14px; }
.field input::placeholder,.field textarea::placeholder { color:#98a2b1; }
.field small,.tiny { font-size:12px; line-height:1.7; }
.field input[type=file] { padding:10px; font-size:12px; background:#fafbfd; }
input[type=file]::file-selector-button { background:#fff; border:1px solid #dfe4ed; border-radius:6px; padding:7px 10px; color:#5c6b80; margin-right:11px; cursor:pointer; }
.notice { padding:17px 20px; font-size:13px; border-radius:10px; color:#758196; background:#f8fafd; }
.form-actions { padding-top:23px; gap:12px; }
.detail-layout { grid-template-columns:minmax(0,1fr) 325px; gap:23px; }
.details-row { font-size:12px; margin-bottom:20px; }
.message { padding:25px; gap:15px; }
.message .avatar { width:36px; height:36px; border-radius:11px; font-size:11px; }
.message-head { font-size:13px; }
.message-head time { font-size:11px; }
.message-text { color:#5f6b7e; font-size:14px; }
.message.note { background:#fffcf1; box-shadow:inset 3px 0 #f0dc9c; }
.reply { padding:25px; }
.attachment { padding:10px 13px; font-size:12px; border-radius:8px; }
.history-item { font-size:12px; padding-bottom:23px; }
.history-item time { font-size:11px; }
.board-col { border:1px solid #e2e7ef; background:#edf0f5; padding:15px; border-radius:13px; }
.board-card { border-radius:10px; padding:18px; }
.board-card h3 { font-size:13px; }
.board-card:hover { border-color:#f3afb5; box-shadow:0 5px 16px #24304708; }
.board-card-foot { flex-wrap:wrap; font-size:11px; }
#view { container-type:inline-size; }
.board { grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; overflow:visible; padding-bottom:0; align-items:stretch; }
.board-col { min-width:0; min-height:240px; }
.board-head { gap:10px; min-height:44px; padding:0 0 16px; }
.board-head>.badge { min-width:0; font-size:10px; padding:6px 8px; }
.board-head>span:last-child { flex-shrink:0; font-size:11px; }
.board-card { min-width:0; padding:15px; }
.board-card h3,.board-card .sub-line,.board-card-foot>span { overflow-wrap:anywhere; }
.board-empty { border:1px dashed #d9e0e9; border-radius:9px; background:#ffffff60; color:#8b97a8; text-align:center; padding:27px 14px; font-size:11px; line-height:1.8; }
@container(max-width:1020px) { .board { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@container(max-width:680px) { .board { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container(max-width:440px) { .board { grid-template-columns:minmax(0,1fr); } .board-col { min-height:170px; } }
.article-card { border-radius:15px; padding:28px; box-shadow:0 3px 10px #202b4002; }
.article-card h2 { font-size:18px; margin-top:13px; }
.article-card p { font-size:13px; color:#8490a2; }
.article-card>.icon { padding:10px; box-sizing:content-box; border-radius:12px; background:#fff1f2; }
.article-body { font-size:15px; }
dialog { border:0; border-radius:18px; padding:30px; box-shadow:0 30px 100px #17253833; }
.modal-head h2 { font-size:21px; }
.close { width:33px; height:33px; background:#f5f6f9; border-radius:8px; display:grid; place-items:center; }
.error { font-size:13px; padding:15px 18px; border-radius:9px; }
.login-art { background:#252a33; }
.login-art h1 { font-size:51px; font-weight:600; }
.login-form h2 { font-size:30px; }
.login-form { max-width:385px; }
.login-form p { font-size:14px; }
.login-form-foot { font-size:12px; }
.nav-backdrop { display:none; }
@media(min-width:1500px) {
  .content { padding:38px 46px 24px; }
  .topbar { padding:0 46px; }
  .dashboard-grid { grid-template-columns:minmax(0,1.65fr) minmax(350px,1fr); }
}
@media(max-height:850px) and (min-width:721px) {
  .sidebar { padding-top:22px; }
  .brand { padding-bottom:14px; }
  .nav-label { padding-top:14px; padding-bottom:10px; }
  .nav-link { padding-top:10px; padding-bottom:10px; min-height:41px; }
  .sidebar-tip { display:none; }
  .sidebar-bottom { padding-top:15px; }
}
@media(max-width:1250px) {
  .layout { grid-template-columns:235px minmax(0,1fr); }
  .sidebar { width:235px; padding-right:13px; padding-left:13px; }
  .brand { gap:11px; padding-left:12px; }
  .brand-wordmark strong { font-size:22px; }
  .content { padding:28px; }
  .topbar { padding:0 28px; gap:18px; }
  .global-search { width:255px; }
  .date-label { display:none; }
  .stat { padding:19px; }
  .stat-top { font-size:12px; }
  .stat-sub { font-size:10px; }
  .hero { padding:27px; }
  .hero h2 { font-size:26px; }
  .quick-action { padding:16px; gap:11px; }
  .quick-action p { font-size:10px; }
  .quick-action>.icon { display:none; }
  .dashboard-grid { grid-template-columns:minmax(0,1.2fr) minmax(300px,1fr); gap:18px; }
  .panel-head { padding:21px; }
  .panel-body { padding:0 21px 23px; }
  .distribution { gap:17px; }
  .ring,.ring svg { width:122px; height:122px; }
  .legend { font-size:11px; }
}
@media(max-width:1050px) {
  .layout { grid-template-columns:220px minmax(0,1fr); }
  .sidebar { width:220px; }
  .nav-link { font-size:12px; gap:10px; }
  .brand-logo { width:80px; }
  .brand img { width:68px; }
  .brand-wordmark strong { font-size:21px; }
  .global-search { width:215px; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stat-sub { font-size:11px; }
  .dashboard-grid { grid-template-columns:minmax(0,1fr); }
  .distribution { justify-content:center; gap:30px; }
  .legend { max-width:235px; font-size:12px; }
  .ring,.ring svg { width:143px; height:143px; }
  .hero-action { display:none; }
  .quick-actions { gap:11px; }
  .quick-action { flex-direction:column; text-align:center; align-items:center; padding:17px 12px; }
  .quick-action p { font-size:10px; }
  .detail-layout { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:800px) and (min-width:721px) {
  .profile-text { display:none; }
  .breadcrumb { font-size:12px; }
  .global-search { width:190px; }
  .topbar { padding:0 22px; gap:14px; }
  .profile { padding-left:15px; }
}
@media(max-width:720px) {
  .layout { display:block; }
  .sidebar { width:258px; padding:25px 17px 20px; z-index:41; box-shadow:none; }
  .sidebar.visible { box-shadow:12px 0 45px #10182735; }
  .sidebar .brand { gap:14px; }
  .brand-logo { width:91px; }
  .brand img { width:77px; }
  .brand-wordmark strong { font-size:24px; }
  .nav-link { font-size:13px; min-height:43px; }
  .sidebar-tip { display:none; }
  .sidebar-bottom { padding-top:18px; }
  .sidebar.visible+.nav-backdrop { display:block; position:fixed; inset:0; background:#17203385; backdrop-filter:blur(2px); z-index:40; }
  .topbar { height:72px; padding:0 17px; gap:12px; }
  .breadcrumb { display:none; }
  .mobile-toggle { padding:6px 0; color:#5d6b80; }
  .global-search { padding:9px 10px; width:100%; gap:8px; }
  .global-search input { font-size:12px; }
  .global-search .kbd { display:none; }
  .global-search>.icon { width:16px; }
  .profile { padding-left:12px; }
  .profile .avatar { width:34px; height:34px; font-size:11px; border-radius:10px; }
  .profile-text { display:none; }
  .content { padding:25px 18px 20px; }
  h1,.page-head h1 { font-size:28px; letter-spacing:-.8px; }
  .page-head { gap:12px; margin-bottom:23px; }
  .page-head p { font-size:12px; line-height:1.75; }
  .page-head .eyebrow { font-size:9px; letter-spacing:1.3px; margin-bottom:8px; }
  .page-head>.actions { flex-shrink:0; align-self:center; }
  .page-head .btn { font-size:11px; padding:10px 12px; min-height:38px; gap:6px; }
  .page-head .btn>.icon { width:14px; }
  .hero { padding:23px 22px; border-radius:14px; min-height:165px; margin-bottom:18px; }
  .hero:before { width:170px; opacity:.65; }
  .hero-kicker { font-size:9px; margin-bottom:14px; letter-spacing:1.2px; }
  .hero h2 { font-size:24px; }
  .hero p { font-size:12px; max-width:100%; line-height:1.9; }
  .stats { gap:12px; margin-bottom:18px; }
  .stat { padding:16px; border-radius:12px; }
  .stat-top { font-size:11px; gap:6px; align-items:flex-start; line-height:1.5; }
  .stat-icon { width:29px; height:29px; border-radius:8px; flex-shrink:0; }
  .stat-icon>.icon { width:16px; height:16px; }
  .stat-value { font-size:31px; margin:10px 0 8px; }
  .stat-sub { font-size:10px; line-height:1.65; }
  .quick-actions { grid-template-columns:minmax(0,1fr); gap:9px; margin-bottom:23px; }
  .quick-action { flex-direction:row; padding:13px 15px; gap:13px; text-align:left; }
  .quick-action-icon { width:35px; height:35px; border-radius:10px; }
  .quick-action strong { font-size:12px; margin-bottom:3px; }
  .quick-action p { font-size:11px; }
  .quick-action>.icon { display:block; width:15px; }
  .panel { border-radius:13px; }
  .panel-head { padding:20px; align-items:center; gap:10px; }
  .panel-head h2 { font-size:14px; }
  .panel-head p { font-size:11px; }
  .panel-head>.badge { font-size:9px; padding:5px 7px; }
  .panel-body { padding:0 20px 22px; }
  .panel-foot { padding:13px 18px; font-size:10px; flex-wrap:wrap; }
  .chart-empty { min-height:220px; padding:30px 17px; }
  .chart-empty h3 { font-size:13px; }
  .chart-empty p { font-size:11px; }
  .distribution { gap:22px; }
  .ring,.ring svg { width:125px; height:125px; }
  .ring-center strong { font-size:29px; }
  .legend { font-size:11px; gap:13px; }
  .legend-row strong { font-size:11px; }
  .empty { padding:35px 20px; font-size:12px; }
  .empty h3 { font-size:14px; }
  .empty p { font-size:11px; }
  .footer { display:flex; flex-direction:column; text-align:center; gap:5px; font-size:10px; padding-top:13px; }
  .filters { padding:16px; gap:10px; }
  .filters input,.filters select { font-size:12px; padding:10px; }
  .filters input { min-width:100%; }
  .form-card { padding:23px; }
  .field label { font-size:12px; }
  .field input,.field textarea,.field select { font-size:14px; }
  .form-actions { flex-wrap:wrap; }
  .tabs { padding:0 20px; gap:23px; }
  .tab { font-size:12px; }
  .message { padding:20px; gap:11px; }
  .message-text { font-size:13px; }
  .reply { padding:20px; }
  .details-row { font-size:12px; }
  .login-art h1 { font-size:29px; }
  .login-form h2 { font-size:26px; }
  .login-form p { font-size:13px; }
  dialog { padding:24px; }
  .modal-head h2 { font-size:19px; }
}
@media(max-width:375px) {
  .content { padding-left:13px; padding-right:13px; }
  .page-head { flex-wrap:wrap; }
  .page-head>.actions { width:100%; align-items:flex-start; }
  .stat { padding:13px; }
  .stat-top { font-size:10px; }
  .distribution { gap:14px; }
  .ring,.ring svg { width:113px; height:113px; }
  .panel-head h2 { font-size:13px; }
}
/* Sidebar: keep all standard labels on one line and account controls accessible. */
.layout { grid-template-columns:280px minmax(0,1fr); }
.sidebar { width:280px; overflow:hidden; padding:24px 16px 17px; }
.brand { padding-bottom:18px; }
.sidebar-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:#515a6a transparent; scrollbar-gutter:stable; }
.sidebar-nav::-webkit-scrollbar { width:5px; }
.sidebar-nav::-webkit-scrollbar-thumb { background:#515a6a; border-radius:5px; }
.sidebar-nav::-webkit-scrollbar-track { background:transparent; }
.nav-link { white-space:nowrap; flex-wrap:nowrap; padding:11px 12px; gap:11px; font-size:13px; line-height:1.4; min-height:42px; margin-bottom:3px; }
.nav-link>.icon,.nav-link.active:after { flex-shrink:0; }
.nav-label { white-space:nowrap; padding:16px 12px 10px; font-size:9px; letter-spacing:1.3px; }
.sidebar-bottom { flex:0 0 auto; padding-top:12px; margin-top:12px; border-top:1px solid #ffffff12; }
.sidebar-tip { display:none; }
.sidebar-foot { margin:11px 12px 0; padding:10px 0 0; line-height:1.5; font-size:10px; white-space:nowrap; }
@media(max-width:1250px) and (min-width:721px) {
  .layout { grid-template-columns:272px minmax(0,1fr); }
  .sidebar { width:272px; padding-left:14px; padding-right:14px; }
}
@media(max-width:1050px) and (min-width:721px) {
  .layout { grid-template-columns:264px minmax(0,1fr); }
  .sidebar { width:264px; }
}
@media(max-height:720px) {
  .sidebar { padding-top:18px; padding-bottom:13px; }
  .brand { padding-bottom:11px; }
  .nav-label { padding-top:12px; padding-bottom:8px; }
  .nav-link { min-height:38px; padding-top:9px; padding-bottom:9px; }
  .sidebar-bottom { margin-top:8px; padding-top:8px; }
  .sidebar-foot { margin-top:7px; padding-top:8px; }
}
@media(max-height:540px) {
  .sidebar-foot { display:none; }
  .brand-logo { height:45px; }
  .sidebar-bottom .nav-link { min-height:34px; padding-top:7px; padding-bottom:7px; }
}
@media(max-width:720px) {
  .layout { display:block; }
  .sidebar { width:min(280px,calc(100vw - 46px)); }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
@media print {
  .sidebar,.topbar,.quick-actions,.hero-action,.nav-backdrop { display:none!important; }
  .layout { display:block; }
  .content { padding:0; }
  .hero { background:white; color:#202632; border:1px solid #dfe4ed; box-shadow:none; }
  .hero p,.hero p strong,.hero-kicker { color:#59677c; }
  .panel,.stat { box-shadow:none; break-inside:avoid; }
}
.panorama-panel .distribution { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:18px 24px; min-height:0; padding:7px 0 20px; }
.workspace .panorama-panel .ring,.workspace .panorama-panel .ring svg { width:200px; height:200px; flex-shrink:0; }
.panorama-ring-group { position:relative; display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
.panorama-chart-tooltip { position:absolute; z-index:3; left:50%; bottom:20px; transform:translateX(-50%); width:max-content; max-width:205px; padding:9px 12px; border-radius:9px; background:#354a64; color:#fff; box-shadow:0 5px 20px #243a5720; font-size:11px; line-height:1.8; text-align:center; pointer-events:none; }
.panorama-chart-tooltip[hidden] { display:none; }
.panorama-scale-note { margin:-9px 0 16px; color:#92a0b2; font-size:10px; line-height:1.7; text-align:center; }
.panorama-scale-note[hidden] { display:none; }
.panorama-panel .panel-head { flex-wrap:wrap; gap:14px; align-items:center; padding-bottom:12px; }
.panorama-panel .panel-head>div { min-width:0; }
.panorama-period-control { display:flex; align-items:center; gap:8px; margin-left:auto; }
.panorama-period-control>span { font-size:11px; color:#8799ae; }
.panorama-period-control select { padding:8px 25px 8px 10px; border:1px solid #e1e7f0; border-radius:8px; background:#f8fafd; color:#617893; font-size:11px; max-width:100%; }
.panorama-period-control select:focus-visible { outline:2px solid #c18a99; outline-offset:2px; }
.panorama-panel[aria-busy=true] { opacity:.7; }
.panorama-period-caption { color:#8b9cb0; font-size:11px; margin:0 0 13px; line-height:1.7; }
.ticket-period-note { color:#788ea8; font-size:12px; padding:7px 10px; border:1px solid #e5eaf2; border-radius:7px; background:#f8fafd; }
.panorama-ring-segment { transition:filter .15s; }
.panorama-ring-segment.is-highlighted { filter:brightness(.86); }
.panorama-ring-segment:focus-visible { outline:none; filter:brightness(.8); }
.panorama-panel .ring-center { width:139px; height:139px; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:50%; background:linear-gradient(145deg,#fff,#f7fafc); box-shadow:inset 0 0 0 1px #edf2f6; }
.panorama-panel .ring-center strong { font-size:36px; font-weight:650; letter-spacing:-1.4px; line-height:1.2; margin:3px 0; color:#354c64; font-variant-numeric:tabular-nums; }
.panorama-panel .ring-center strong.ring-total-compact { font-size:27px; letter-spacing:-1px; }
.panorama-panel .ring-center strong.ring-total-long { font-size:21px; letter-spacing:-.5px; }
.workspace .panorama-panel .ring-center .ring-total-label { max-width:none; margin:0; font-size:9px; font-weight:600; line-height:1.6; text-transform:uppercase; letter-spacing:1.7px; color:#8a9aaa; }
.workspace .panorama-panel .ring-center .ring-total-unit { max-width:none; margin:0; font-size:12px; line-height:1.6; color:#788da2; }
.workspace .panorama-panel .legend { flex:1; min-width:min(100%,190px); gap:2px; }
.panorama-panel .panorama-status { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 9px; border-radius:8px; transition:background .15s; }
.panorama-status:hover { background:#f7f9fc; }
.panorama-status:focus-visible { outline:2px solid #c18a99; outline-offset:1px; }
.panorama-status-name { display:flex; align-items:center; gap:9px; font-size:12px; line-height:1.7; color:#61748e; min-width:0; }
.panorama-status .legend-dot { width:7px; height:7px; flex-shrink:0; }
.panorama-status-numbers { display:flex; flex-direction:column; align-items:flex-end; flex-shrink:0; min-width:47px; font-variant-numeric:tabular-nums; }
.panorama-panel .panorama-status strong { font-size:13px; font-weight:600; color:#435b77; line-height:1.5; }
.panorama-status small { font-size:11px; color:#7e91a9; line-height:1.5; }
.panorama-summary { display:flex; align-items:center; gap:11px; padding:13px 14px; border:1px solid #e3eee9; background:#f5faf8; border-radius:11px; margin-bottom:20px; }
.panorama-summary-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; background:#e9f4ef; color:#76a393; flex-shrink:0; }
.panorama-summary-icon .icon { width:16px; height:16px; }
.panorama-summary strong { display:block; font-size:12px; font-weight:600; color:#567b6f; line-height:1.7; }
.panorama-summary p { margin:2px 0 0; font-size:11px; color:#849d94; line-height:1.7; }
.workspace .panorama-panel .panorama-satisfaction { display:block; padding-top:17px; border-top:1px solid #e7ecf3; }
.panorama-rating-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:7px 14px; font-size:12px; color:#667a94; line-height:1.8; }
.panorama-rating-heading>strong { font-size:21px; color:#50637d; font-weight:600; }
.panorama-rating-heading strong small { font-size:12px; font-weight:400; color:#93a1b3; }
.panorama-rating-pending { font-size:10px; color:#98a4b4; padding:3px 7px; background:#f6f8fb; border:1px solid #e9edf3; border-radius:6px; }
.panorama-rating-body { display:flex; flex-wrap:wrap; align-items:center; gap:9px 14px; margin-top:11px; }
.panorama-rating-body p { margin:0; font-size:11px; line-height:1.8; color:#8899af; flex:1; min-width:min(100%,175px); }
.panorama-stars { position:relative; width:97px; height:17px; flex-shrink:0; }
.panorama-stars-base,.panorama-stars-fill { display:flex; gap:3px; width:97px; height:17px; }
.panorama-stars .icon { width:17px; height:17px; flex-shrink:0; }
.panorama-panel .panorama-stars-base .icon { color:#d4dce7; }
.panorama-panel .panorama-stars-fill { position:absolute; top:0; left:0; overflow:hidden; color:#d6ab70; }
.panorama-panel .panorama-stars-fill .icon { color:#d6ab70; fill:#d6ab70; }
@media(max-width:470px) {
 .panorama-panel .distribution { gap:19px; }
 .panorama-panel .legend { flex-basis:100%; }
 .panorama-panel .panorama-status { padding:7px 4px; }
 .panorama-status-numbers { flex-direction:row; align-items:center; gap:10px; }
 .panorama-status-numbers small { min-width:42px; text-align:right; }
 .panorama-summary { padding:12px; }
}
