/* 0.7.22: Ticketportal design system for every portal area.
   Presentation only. Hidden/open states, action hooks and print geometry stay
   with the existing components. Brand, font, density, contrast and motion
   preferences remain operational. */
html.visual722 {
 --ui-ink722:var(--ink,#172942);--ui-muted722:var(--muted,#52657d);
 --ui-surface722:var(--surface,#fff);--ui-soft722:var(--soft,#f3f7fc);
 --ui-brand722:var(--brand,#1556c7);--ui-line722:var(--line,#d6e0ec);
 --ui-edge722:color-mix(in srgb,var(--ui-line722) 96%,var(--ui-brand722));
 --ui-tint-soft722:#e6f7fc;--ui-tint-inset722:#c7def4;
 --ui-card722:linear-gradient(145deg,var(--ui-surface722) 12%,var(--ui-surface722) 54%,color-mix(in srgb,var(--ui-soft722) 75%,var(--ui-tint-soft722)) 100%);
 --ui-inset722:linear-gradient(180deg,var(--ui-surface722),color-mix(in srgb,var(--ui-soft722) 75%,var(--ui-tint-inset722)));
 --ui-shadow722:0 5px 14px #274e7520,0 1px 3px #274e7518;
 --ui-shadow-hover722:0 7px 20px #274e752b,0 1px 4px #274e7520;
 --ui-radius722:13px;--ui-focus722:var(--link,#1556c7);
}
html.visual722[data-theme="dark"]{--ui-tint-soft722:var(--soft);--ui-tint-inset722:var(--soft)}
@media(prefers-color-scheme:dark){html.visual722[data-theme="auto"]{--ui-tint-soft722:var(--soft);--ui-tint-inset722:var(--soft)}}
@media screen {
 html.visual722 body{color:var(--ui-ink722);background-color:var(--bg,#edf2f8)}
 html.visual722 :is(h1,h2,h3,h4){line-height:1.3;letter-spacing:-.015em}
 html.visual722 h2{font-weight:700}
 html.visual722 :is(.page-content,.settings-content714,.dashboard-main,.dashboard-rail,.auth-main){min-width:0}
 /* Authentication retains its independent palette in portal dark mode. */
 html.visual722 .auth-main{
  --ui-ink722:var(--ink,#172942);--ui-muted722:var(--muted,#52657d);
  --ui-surface722:var(--surface,#fff);--ui-soft722:var(--soft,#f3f7fc);--ui-line722:var(--line,#d6e0ec);
  --ui-edge722:color-mix(in srgb,var(--ui-line722) 96%,var(--ui-brand722));
  --ui-tint-soft722:#e6f7fc;--ui-tint-inset722:#c7def4;
  --ui-card722:linear-gradient(145deg,var(--ui-surface722) 12%,var(--ui-surface722) 54%,color-mix(in srgb,var(--ui-soft722) 75%,var(--ui-tint-soft722)) 100%);
  --ui-inset722:linear-gradient(180deg,var(--ui-surface722),color-mix(in srgb,var(--ui-soft722) 75%,var(--ui-tint-inset722)));
 }
 html.visual722 :is(.card,.panel66,.list-card75,.chart-card65,.wizard-panel721,.account-panel74,.setup-card,.settings-form-card714){background:var(--ui-card722);border-color:var(--ui-edge722);border-radius:var(--ui-radius722);box-shadow:var(--ui-shadow722);min-width:0;transition:border-color .18s ease,box-shadow .18s ease}
 html.visual722 :is(.card,.panel66,.list-card75,.chart-card65,.wizard-panel721,.account-panel74):hover{border-color:color-mix(in srgb,var(--ui-line722) 74%,var(--ui-brand722));box-shadow:var(--ui-shadow-hover722)}
 html.visual722 :is(.filter-panel,.saved-search,.access-editor,.operation-item,.tool-panel711,.favorite-panel64,.label-preview-panel713,.label-controls713,.branding-upload714,.settings-defaults714,.review-device721,.config-question721,.ticket-toolbar720,.selection-toolbar70,.selection-bar68,.selection-actions65,.selection-actions69,.bulk-toolbar,.quantity-summary65,.accessory-panel71){border-color:var(--ui-edge722);border-radius:10px;background:var(--ui-inset722);box-shadow:0 2px 6px #274e7512}
 html.visual722 :is(.form-grid,.filter-grid,.settings-fields714,.ticket-fields719,.device-fields72,.user-fields77,.quantity-fields65,.lease-fields65){min-width:0}
 html.visual722 :is(.heading722,.section-heading,.catalog-head){gap:12px}
 html.visual722 .heading722{display:flex;align-items:center}
 html.visual722 :is(.heading-icon722,.small-icon721){display:inline-flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--ui-edge722);border-radius:9px;color:color-mix(in srgb,var(--ui-brand722) 55%,var(--ui-muted722));background:var(--ui-inset722);box-shadow:inset 0 1px #ffffff40,0 2px 3px #244d7020}
 html.visual722 .heading-icon722 .icon{width:24px;height:24px}
 html.visual722 :is(.category-grid,.operation-grid){gap:12px}
 html.visual722 .category-tile{color:var(--ui-ink722);background:var(--ui-inset722);border:1px solid var(--ui-edge722);border-radius:10px;box-shadow:0 2px 6px #274e7514;gap:12px;padding:13px 14px;min-height:68px;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
 html.visual722 .category-tile:hover{color:var(--ui-ink722);background:var(--ui-inset722);border-color:color-mix(in srgb,var(--ui-edge722) 55%,var(--ui-brand722));box-shadow:0 4px 10px #274e7522}
 html.visual722 .category-tile>:is(svg,.icon){box-sizing:content-box;color:color-mix(in srgb,var(--ui-tile-color722,var(--ui-brand722)) 60%,var(--ui-muted722));width:25px;height:25px;flex:0 0 25px;padding:8px;border:1px solid var(--ui-edge722);border-radius:9px;background:var(--ui-inset722);box-shadow:0 2px 3px #244d7018}
 html.visual722 .category-tile>span{min-width:0;flex:1;overflow-wrap:anywhere;line-height:1.35;font-weight:600}
 html.visual722 .tile-count722{flex:0 0 auto;min-width:40px;border-radius:18px;padding:4px 9px;text-align:center;font-size:.82rem;font-weight:700;color:var(--ui-ink722);background:color-mix(in srgb,var(--ui-soft722) 85%,var(--ui-brand722));box-shadow:inset 0 1px #ffffff40}
 html.visual722 .tile-populated722 .tile-count722{color:var(--on-brand,#fff);background:var(--ui-brand722)}
 html.visual722 :is(.button,button:not(.favorite-button)):not(.nav-toggle):not(.nav-close):not(.nav-backdrop){box-sizing:border-box;font:inherit;font-size:.875rem;line-height:1.4;min-height:44px;padding:10px 14px;border-radius:8px;vertical-align:middle;gap:8px;box-shadow:inset 0 1px #ffffff40,0 1px 2px #274e7514;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}
 html.visual722 .button{display:inline-flex;align-items:center;justify-content:center;text-align:center}
 html.visual722 .button:where(.secondary,.ghost,:not(.primary):not(.danger):not(.portal-open66)):not(.is-saved){background:var(--ui-inset722);color:var(--ui-ink722);border-color:var(--ui-edge722)}
 html.visual722 .button.primary{background:linear-gradient(var(--ui-action-top722,#6294c2),var(--ui-action-bottom722,#3c73aa));color:var(--on-brand,#fff);border-color:var(--ui-action-edge722,#487eb0)}
 html.visual722 .button.danger{background:linear-gradient(var(--ui-surface722),var(--error-bg,#ffebea));color:var(--error-ink,#96332d);border-color:color-mix(in srgb,var(--error-ink,#96332d) 45%,var(--ui-surface722))}
 html.visual722 .favorite-button.is-saved{color:var(--warning-ink,#674608);background:var(--warning-bg,#fff4d6)}
 html.visual722 .button:hover:not(:disabled):not([aria-disabled="true"]){box-shadow:inset 0 1px #ffffff60,0 3px 7px #274e7525}
 html.visual722 .button:disabled{box-shadow:none}
 html.visual722 .button .icon{width:18px;height:18px;flex:0 0 18px}
 html.visual722 :is(.button-row,.form-actions,.actions64,.actions715,.settings-actions714,.editor-actions713,.admin-actions,.download-actions,.device-actions68,.selection-controls721,.print-actions715){align-items:center;gap:10px}
 html.visual722 :is(.button-row,.form-actions,.actions64,.actions715,.admin-actions,.download-actions,.device-actions68,.print-actions715)>form{margin:0;align-self:center}
 html.visual722 :is(.button-row,.actions64,.actions715,.device-actions68,.print-actions715) .button{margin:0;min-height:44px}
 html.visual722 :is(input,select,textarea):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]){color:var(--ui-ink722);background-color:var(--ui-surface722);border-color:var(--ui-edge722);border-radius:8px;box-shadow:inset 0 1px 2px #274e7508;min-height:44px;max-width:100%;transition:border-color .18s ease,box-shadow .18s ease}
 html.visual722 :is(input,select,textarea):focus{border-color:var(--ui-focus722)}
 html.visual722 input[type="file"]::file-selector-button{font:inherit;margin-right:10px;padding:8px 12px;border:1px solid var(--ui-edge722);border-radius:7px;color:var(--ui-ink722);background:var(--ui-inset722)}
 html.visual722 :is(input[type="checkbox"],input[type="radio"],progress){accent-color:var(--ui-brand722)}
 html.visual722 :is(fieldset,.audience-list,.ticket-extra719,.config-question721){border-color:var(--ui-edge722);border-radius:9px}
 html.visual722 legend{font-weight:700;color:var(--ui-ink722)}
 html.visual722 :is(.help,.muted,.cell-sub,.file-meta,.file-kicker){color:var(--ui-muted722)}
 html.visual722 :is(.table-wrap,.table-scroll,.comparison,.audience-list){border-color:var(--ui-edge722);border-radius:9px}
 html.visual722 table{color:var(--ui-ink722)}
 html.visual722 th{background-color:var(--ui-soft722);color:var(--ui-ink722);font-weight:700;border-color:var(--ui-edge722)}
 html.visual722 td{border-color:var(--ui-edge722)}
 html.visual722 tbody tr:nth-child(even){background-color:color-mix(in srgb,var(--ui-soft722) 45%,var(--ui-surface722))}
 html.visual722 tbody tr:hover{background-color:var(--ui-soft722)}
 html.visual722 tbody tr:is([aria-selected="true"],.selected,.is-selected){background-color:color-mix(in srgb,var(--ui-soft722) 90%,var(--ui-brand722))}
 html.visual722 :is(.download-row,.notification-row,.audience-row,.repair715,.compact-list64 li,.plain-list li,.rail-notification,.backup-entry){border-color:var(--ui-edge722)}
 html.visual722 :is(.download-row,.notification-row,.audience-row):hover{background-color:var(--ui-soft722)}
 html.visual722 .notification-row.is-unread{border-left-color:var(--ui-brand722);background-color:var(--ui-soft722)}
 html.visual722 :is(.tabs64,.personal-tabs,.record-tabs70,.admin-tabs75,.settings-tabs72){border-color:var(--ui-edge722);gap:8px}
 html.visual722 :is(.tabs64,.personal-tabs,.record-tabs70,.admin-tabs75,.settings-tabs72) a{border-radius:8px;min-height:42px;padding:10px 13px;color:var(--link,#1556c7)}
 html.visual722 :is(.tabs64,.personal-tabs,.record-tabs70,.admin-tabs75,.settings-tabs72) a[aria-current]{color:var(--on-brand,#fff);background:var(--ui-brand722);box-shadow:inset 0 1px #ffffff50,0 2px 4px #274e7520}
 html.visual722 :is(.settings-nav,.settings-nav714,.settings-nav72){border-color:var(--ui-edge722)}
 html.visual722 :is(.settings-nav,.settings-nav714,.settings-nav72) a{border-radius:8px}
 html.visual722 :is(.settings-nav,.settings-nav714,.settings-nav72) a[aria-current]{color:var(--on-brand,#fff);background:var(--ui-brand722);box-shadow:inset 0 1px #ffffff50,0 2px 4px #274e7520}
 html.visual722 :is(.notice,.one-time-secret,.status-warning,.empty64,.empty-area,.empty66){border-radius:10px;border-color:var(--ui-edge722)}
 html.visual722 :is(.tag,.pill,.reserve-chip66,.filter-chips a){border-radius:18px}
 html.visual722 .tag:not(.ok):not(.error):not(.warning){color:var(--ui-ink722);background:var(--ui-soft722)}
 html.visual722 :is(.action-menu64,.ticket-menu-items721,.menu70,.column-menu68,.account-menu nav,.list-menu75){border-color:var(--ui-edge722);border-radius:10px;box-shadow:var(--ui-shadow-hover722);background-color:var(--ui-surface722)}
 html.visual722 dialog{color:var(--ui-ink722);border:1px solid var(--ui-edge722);border-radius:var(--ui-radius722);background:var(--ui-card722);box-shadow:0 16px 48px #10274440}
 html.visual722 dialog::backdrop{background:#10274470}
 html.visual722 :is(.modal,.modal-content,.dialog-content,.confirmation-panel){border-color:var(--ui-edge722);border-radius:var(--ui-radius722);background-color:var(--ui-surface722)}
 html.visual722 :is(.repair-work715,.text-preview,.image-preview,.pdf-surface,.manual-secret,.review-confirm721,.draft-files721 li,.file-mark,.empty-symbol){border-color:var(--ui-edge722);border-radius:9px}
 html.visual722 :is(.metric,.metric64){border-color:var(--ui-edge722);border-radius:10px;box-shadow:0 2px 6px #274e7514;background:var(--ui-inset722)}
 html.visual722 :is(.portal-summary66,.ticket-kind719,.alert64){border-color:var(--ui-edge722);border-radius:11px;box-shadow:var(--ui-shadow722)}
 html.visual722 :is(.auth-form-card,.public68 section,.legal-page){color:var(--ui-ink722);border-color:var(--ui-edge722);border-radius:var(--ui-radius722);background:var(--ui-card722);box-shadow:var(--ui-shadow722)}
 html.visual722 .auth714.auth715.login-layout-classic .auth-form-card{padding:24px;border:1px solid var(--ui-edge722)}
 html.visual722 .auth714.auth715.login-layout-classic .auth-main{background:var(--bg,#edf2f8)}
 html.visual722 .auth-intro .brand-logo{border:1px solid #d3e2ef;box-shadow:0 4px 12px #10274420;border-radius:10px}
 html.visual722 .public68 main{min-width:0}
 html.visual722 .public68 header{border-color:var(--ui-edge722);border-radius:10px;box-shadow:var(--ui-shadow722)}
 html.visual722 .public68 :is(dt,dd){overflow-wrap:anywhere}
 html.visual722 .sidebar{background:linear-gradient(160deg,color-mix(in srgb,var(--nav,#102744) 80%,var(--ui-brand722)),var(--nav,#102744) 68%,color-mix(in srgb,var(--nav,#102744) 90%,var(--ui-brand722)));box-shadow:inset -1px 0 #ffffff14,2px 0 8px #1027440e}
 html.visual722 .sidebar .brand-logo{background:#fff;border:1px solid #d3e2ef;border-radius:10px;box-shadow:0 4px 12px #061b3630;padding:10px}
 html.visual722 .sidebar .workspace-label{color:#b3d0f0;letter-spacing:.045em}
 html.visual722 .sidebar-navigation{gap:5px}
 html.visual722 .sidebar-navigation :is(a,summary){min-height:44px;padding:10px 12px;border-radius:9px;gap:12px;line-height:1.4}
 html.visual722 .sidebar-navigation :is(a,summary) .icon{width:20px;height:20px;flex:0 0 20px}
 html.visual722 .sidebar-navigation :is(a,summary):hover{background-color:#ffffff10}
 html.visual722 .sidebar-navigation a[aria-current]{background:linear-gradient(160deg,color-mix(in srgb,var(--ui-brand722) 85%,#426b96),var(--ui-brand722));color:var(--on-brand,#fff);border:1px solid #ffffff2b;box-shadow:inset 0 1px #ffffff30,0 3px 8px #061b3630;font-weight:700}
 html.visual722 .sidebar-navigation .nav-children{border-color:#b3d0f040}
 html.visual722 .sidebar-note{border-color:#b3d0f035}
 html.visual722 .sidebar .pill{color:#eef6ff;border-color:#b3d0f050;background:#ffffff08}
 html.visual722 .sidebar-user{border-color:#b3d0f035;padding-top:12px}
 html.visual722 .sidebar .avatar{background:linear-gradient(#4b7fae,#2c527e);box-shadow:inset 0 1px #ffffff30,0 2px 4px #061b3620}
 html.visual722 .sidebar .button{color:#eef6ff;background:linear-gradient(#ffffff10,#ffffff04);border-color:#b3d0f04d}
 html.visual722 .topbar{border-color:var(--ui-edge722);box-shadow:0 1px 4px #274e7508}
 html.visual722 .notification-bell{border-radius:9px}
 html.visual722 .topbar-actions select{border-radius:8px}
 html.visual722 .page-footer{border-color:var(--ui-edge722);color:var(--ui-muted722)}
 html.visual722 :focus-visible{outline:3px solid var(--ui-focus722);outline-offset:3px}
 html.visual722 .sidebar :focus-visible{outline-color:#b3d0f0}
 /* Existing dashboard/metric palettes from the accepted Ticketportal. */
 html.visual722 .dashboard721 .portal-card721{color:#fff;background:linear-gradient(155deg,#ffffff45 0%,transparent 46%),linear-gradient(180deg,color-mix(in srgb,var(--portal721) 85%,white),var(--portal721))}
 html.visual722 .ticket719 .ticket-metric720{color:#fff}
 html.visual722 .ticket719 .metric721-open{background:linear-gradient(150deg,#ffffff40,transparent 55%),linear-gradient(#7894ad,#56728d)}
 html.visual722 .ticket719 .metric721-resolved{background:linear-gradient(150deg,#ffffff40,transparent 55%),linear-gradient(#659b91,#397b73)}
 html.visual722 .ticket719 .metric721-closed{background:linear-gradient(150deg,#ffffff40,transparent 55%),linear-gradient(#8096a7,#567084)}
 html.visual722 .portal-card721 .portal-open66{background:linear-gradient(#fff,#e8f0f7);color:var(--portal721);border-color:#ffffffa0}
}
@media screen and (max-width:750px){
 html.visual722 .category-tile{padding:12px;gap:10px;min-height:68px}
 html.visual722 .category-tile>:is(svg,.icon){width:22px;height:22px;flex-basis:22px;padding:7px}
 html.visual722 :is(.button-row,.actions64,.actions715,.device-actions68,.print-actions715){gap:10px}
 html.visual722 .button{white-space:normal;overflow-wrap:anywhere}
 html.visual722 :is(.form-grid,.filter-grid,.settings-fields714)>*{min-width:0}
 html.visual722 .heading722{align-items:flex-start}
 html.visual722 .heading-icon722{width:34px;height:34px;flex-basis:34px}
 html.visual722 .auth714.auth715.login-layout-classic .auth-form-card{padding:20px 16px}
 html.visual722 .auth714.auth715 .auth-main .button{min-height:48px}
 html.visual722 :is(input,select,textarea):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]){font-size:max(1rem,16px)}
}
@media screen and (max-width:480px){
 html.visual722 .tile-count722{min-width:34px;padding:4px 7px}
 html.visual722 .category-tile{gap:9px}
 html.visual722 .heading722{font-size:1.15rem}
}
@media screen and (prefers-reduced-motion:reduce){html.visual722 *,html.visual722 *::before,html.visual722 *::after{transition:none!important;animation:none!important}}
@media screen and (forced-colors:active){html.visual722 :is(.card,.category-tile,.button,dialog,.heading-icon722){border:1px solid CanvasText;box-shadow:none}html.visual722 :focus-visible,html.visual722 .sidebar :focus-visible{outline-color:Highlight}}
@media print{html.visual722 .heading-icon722{display:none}}