@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base,components;@layer utilities{.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.table{display:table}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.w-9{width:calc(var(--spacing) * 9)}.w-full{width:100%}.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.items-center{align-items:center}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing) * 2)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-input{border-color:var(--input)}.bg-background{background-color:var(--background)}.bg-destructive{background-color:var(--destructive)}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-destructive-foreground{color:var(--destructive-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.uppercase{text-transform:uppercase}.underline-offset-4{text-underline-offset:4px}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--destructive) 90%, transparent)}}.hover\:bg-primary\/90:hover{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--primary) 90%, transparent)}}.hover\:bg-secondary\/80:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--secondary) 80%, transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:underline:hover{text-decoration-line:underline}}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--ring)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:opacity-50:disabled{opacity:.5}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}}:root{--background:var(--surface);--foreground:var(--text);--primary:var(--kt-navy);--primary-foreground:#fff;--secondary:var(--gray-bg);--secondary-foreground:var(--text);--muted:var(--gray-bg);--muted-foreground:var(--text-soft);--accent:var(--surface-2);--accent-foreground:var(--text);--destructive:var(--red);--destructive-foreground:#fff;--input:var(--border);--ring:var(--kt-blue)}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@keyframes pulse{50%{opacity:.5}}
:root{--kt-blue:#01a6e7;--kt-blue-600:#0090cc;--kt-navy:#003a70;--kt-navy-700:#002a52;--kt-navy-800:#001e3c;--brand:var(--kt-navy);--brand-accent:var(--kt-blue);--bg:#f0f5fa;--surface:#fff;--surface-2:#f8fafc;--border:#e3e8ef;--text:#1a2433;--text-soft:#5b6878;--text-faint:#8a96a6;--green:#1a9d5a;--green-bg:#e7f6ee;--amber:#c9820a;--amber-bg:#fdf3e0;--red:#d23b3b;--red-bg:#fdeaea;--gray-bg:#eef1f5;--purple:#6b46c1;--purple-bg:#f0ebfb;--radius:12px;--radius-sm:8px;--shadow:0 1px 3px #1018280f, 0 1px 2px #1018280a;--shadow-md:0 4px 16px #10182814;--font-sans:"Anuphan Variable", "Sarabun", "Noto Sans Thai", ui-sans-serif, system-ui, sans-serif;--font-doc:"Sarabun", "Anuphan Variable", ui-sans-serif, sans-serif;font-family:var(--font-sans);color:var(--text)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);font-size:.9375rem;line-height:1.55}a{color:var(--brand-accent);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4{margin:0 0 .4em;font-weight:700;line-height:1.3}h1{font-size:1.5rem}h2{font-size:1.2rem}h3{font-size:1.02rem}p{margin:0 0 .8em}.btn{border-radius:var(--radius-sm);font:inherit;cursor:pointer;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:9px 16px;font-size:.92rem;font-weight:600;transition:all .12s;display:inline-flex}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--kt-blue);color:#fff;font-family:var(--font-sans);border-radius:999px;padding:11px 20px;font-size:.96rem;font-weight:500;box-shadow:0 4px 12px #01a6e729}.btn-primary:hover:not(:disabled){background:var(--kt-blue-600);box-shadow:0 6px 16px #01a6e742}.btn-new-complaint{background:var(--kt-blue);color:#fff;font-family:var(--font-sans);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.92rem;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 12px #01a6e729}.btn-new-complaint:hover{background:var(--kt-blue-600);opacity:.96;color:#fff;transform:translateY(-1.5px);box-shadow:0 6px 16px #01a6e742;text-decoration:none!important}.btn-new-complaint svg{flex-shrink:0;transition:transform .25s}.btn-new-complaint:hover svg{transform:rotate(90deg)}.btn-add-staff{background:var(--kt-blue);color:#fff;font-family:var(--font-sans);cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.92rem;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 12px #01a6e729}.btn-add-staff:hover{background:var(--kt-blue-600);opacity:.96;color:#fff;transform:translateY(-1.5px);box-shadow:0 6px 16px #01a6e742;text-decoration:none!important}.btn-add-staff svg{flex-shrink:0;transition:transform .25s}.btn-add-staff:hover svg{transform:rotate(90deg)}.btn-agent-queue{background:var(--kt-blue);color:#fff;font-family:var(--font-sans);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.92rem;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 12px #01a6e729}.btn-agent-queue:hover{background:var(--kt-blue-600);opacity:.96;color:#fff;transform:translateY(-1.5px);box-shadow:0 6px 16px #01a6e742;text-decoration:none!important}.btn-agent-queue svg{flex-shrink:0;transition:transform .25s}.btn-agent-queue:hover svg{transform:translate(4px)}.btn-navy{background:var(--brand);color:#fff}.btn-navy:hover:not(:disabled){background:var(--kt-navy-700)}.btn-ghost{background:var(--surface);color:var(--text);border-color:var(--border)}.btn-ghost:hover:not(:disabled){background:var(--surface-2)}.btn-login{color:#fff;font-family:var(--font-sans);cursor:pointer;background:linear-gradient(90deg,#0a2540 0%,#0076b6 100%);border:none;border-radius:12px;padding:12px 20px;font-size:.96rem;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #01a6e729}.btn-login:hover:not(:disabled){background:linear-gradient(90deg,#0d3257 0%,#0087cf 100%);transform:translateY(-1px);box-shadow:0 6px 16px #01a6e742}.btn-demo-login{background:var(--surface);color:var(--text-soft);border:1px solid var(--border);cursor:pointer;text-align:center;border-radius:12px;padding:8px 12px;font-size:.85rem;font-weight:500;transition:all .15s}.btn-demo-login:hover:not(:disabled){background:var(--surface-2);border-color:var(--text-faint);color:var(--text);box-shadow:0 2px 6px #0000000d}.btn-success{background:var(--green);color:#fff}.btn-success:hover:not(:disabled){filter:brightness(.95)}.btn-danger{background:var(--red);color:#fff}.btn-danger:hover:not(:disabled){filter:brightness(.95)}.btn-sm{padding:6px 11px;font-size:.85rem}.btn-block{width:100%}.field{margin-bottom:14px}.field label{color:var(--text);margin-bottom:5px;font-size:.88rem;font-weight:600;display:block}.field .hint{color:var(--text-faint);margin-top:4px;font-size:.8rem}input,select,textarea{border:1px solid var(--border);width:100%;font:inherit;background:var(--surface);color:var(--text);border-radius:12px;padding:10px 12px;font-size:.92rem;transition:border-color .12s}select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%235b6878' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");background-position:right 12px center;background-repeat:no-repeat;background-size:15px;padding-right:36px}input:focus,select:focus,textarea:focus{border-color:var(--brand-accent);outline:none;box-shadow:0 0 0 3px #01a6e71f}textarea{resize:vertical;min-height:96px}input.locked-field{color:var(--text-soft);cursor:not-allowed;background:#f1f5f9a6;border-color:#e2e8f0}input.locked-field:focus{box-shadow:none;border-color:#e2e8f0}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.card-pad{padding:18px 20px}.muted{color:var(--text-soft)}.faint{color:var(--text-faint)}.row{gap:12px;display:flex}.row-between{justify-content:space-between;align-items:center;gap:12px;display:flex}.wrap{flex-wrap:wrap}.stack{flex-direction:column;gap:12px;display:flex}.grid{gap:14px;display:grid}.badge{border-radius:999px;align-items:center;gap:5px;padding:3px 10px;font-size:.78rem;font-weight:600;line-height:1.5;display:inline-flex}.badge .dot{background:currentColor;border-radius:50%;width:7px;height:7px}.badge-green{background:var(--green-bg);color:var(--green)}.badge-amber{background:var(--amber-bg);color:var(--amber)}.badge-red{background:var(--red-bg);color:var(--red)}.badge-gray{background:var(--gray-bg);color:var(--text-soft)}.badge-blue{color:var(--kt-blue-600);background:#e4f3fc}.badge-navy{color:var(--brand);background:#e3ebf4}.badge-purple{background:var(--purple-bg);color:var(--purple)}.table{border-collapse:collapse;width:100%;font-size:.9rem}.table th{text-align:left;color:var(--text-soft);text-transform:uppercase;letter-spacing:.02em;border-bottom:1px solid var(--border);padding:10px 12px;font-size:.8rem;font-weight:600}.table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:12px}.table tbody tr{cursor:pointer;transition:background .1s}.table tbody tr:hover{background:var(--surface-2)}.table tbody tr:last-child td{border-bottom:none}.shell{min-height:100vh;display:flex}.sidebar{color:#fff;background:linear-gradient(#0a1128,#111827);flex-direction:column;flex-shrink:0;width:248px;height:100vh;display:flex;position:sticky;top:0}.sidebar .brand{border-bottom:1px solid #ffffff26;flex-shrink:0;padding:22px 20px 18px}.sidebar .brand .logo{letter-spacing:.01em;color:#fff;font-size:1.08rem;font-weight:700}.sidebar .brand .sub{color:#ffffffbf;align-items:center;gap:6px;margin-top:4px;font-size:.76rem;display:flex}.sidebar nav{flex:1;padding:16px 12px;overflow-y:auto}.no-scrollbar::-webkit-scrollbar{display:none}.sidebar nav a{color:#ffffffbf;border-radius:8px;align-items:center;gap:12px;margin-bottom:4px;padding:9px 12px;font-size:.875rem;font-weight:500;transition:all .2s;display:flex}.sidebar nav a:hover{color:#fff;background:#ffffff14;text-decoration:none}.sidebar nav a.active{color:#01a6e7;background:#ffffff1c;border-radius:10px;font-weight:600;box-shadow:inset 0 0 0 1px #01a6e738}.sidebar nav a.active .ico{opacity:1;color:#fff}.sidebar nav a .ico{opacity:.85;color:#fff;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex}.sidebar nav a .ico svg{width:100%;height:100%;display:block;stroke-width:1.8px!important}.sidebar .who{border-top:1px solid #ffffff26;flex-shrink:0;margin-top:auto;padding:12px 16px;font-size:.84rem}.sidebar .who .name{color:#fff;font-size:.875rem;font-weight:600}.sidebar .who .role{color:#ffffffa6;margin-top:2px;font-size:.75rem}.btn-sidebar-logout{color:#fff;cursor:pointer;background:0 0;border:1px solid #ffffff59;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:7px 12px;font-family:inherit;font-size:.8125rem;font-weight:500;transition:all .22s cubic-bezier(.4,0,.2,1);display:flex}.btn-sidebar-logout:hover{color:var(--sidebar-bg-end,var(--kt-blue));background:#fff;border-color:#fff}.main{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{background:var(--surface);border-bottom:2px solid #0000;border-image:linear-gradient(to right, var(--sidebar-bg-start,var(--kt-blue)), var(--sidebar-bg-end,var(--kt-blue-600))) 1;z-index:50;justify-content:space-between;align-items:center;padding:12px 26px;display:flex;position:sticky;top:0;box-shadow:0 1px 3px #1018280d}.content{width:100%;max-width:1180px;margin:0 auto;padding:24px 26px}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px}.kpi .label{color:var(--text-soft);font-size:.82rem}.kpi .value{margin-top:2px;font-size:1.7rem;font-weight:700}.kpi .value.small{font-size:1.25rem}.divider{background:var(--border);border:none;height:1px;margin:16px 0}.spinner{border:3px solid var(--border);border-top-color:var(--brand-accent);border-radius:50%;width:26px;height:26px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.center-screen{place-items:center;min-height:100vh;display:grid}.alert{border-radius:var(--radius-sm);margin-bottom:14px;padding:11px 14px;font-size:.9rem}.alert-error{background:var(--red-bg);color:var(--red)}.alert-success{background:var(--green-bg);color:var(--green)}.alert-info{color:var(--kt-blue-600);background:#e4f3fc}.alert-warn{background:var(--amber-bg);color:var(--amber)}.pill-tab{background:var(--gray-bg);border-radius:999px;gap:4px;padding:4px;display:inline-flex}.pill-tab button{font:inherit;cursor:pointer;color:var(--text-soft);background:0 0;border:none;border-radius:999px;padding:6px 14px;font-size:.86rem;font-weight:600}.pill-tab button.active{background:var(--surface);color:var(--brand);box-shadow:var(--shadow)}.timeline{margin:0;padding:0;list-style:none}.timeline li{border-left:1px solid var(--border);padding:0 0 16px 22px;position:relative}.timeline li:last-child{border-left-color:#0000;padding-bottom:0}.timeline li:before{content:"";background:var(--brand-accent);border-radius:50%;width:10px;height:10px;position:absolute;top:3px;left:-6px}.timeline .t-action{font-size:.86rem;font-weight:600}.timeline .t-meta{color:var(--text-faint);font-size:.78rem}.bar-track{background:var(--gray-bg);border-radius:999px;height:10px;overflow:hidden}.bar-fill{background:var(--brand-accent);border-radius:999px;height:100%}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.86em}.tag{background:var(--gray-bg);color:var(--text-soft);border-radius:6px;margin:0 4px 4px 0;padding:2px 7px;font-size:.76rem;display:inline-block}.portal-header{color:#fff;background:linear-gradient(135deg,#0a1f3d 0%,#1a4d85 100%);position:relative}.portal-header:before{content:"";pointer-events:none;background:radial-gradient(80% 60% at 50% 0,#01a6e724 0%,#0000 70%);position:absolute;inset:0}.portal-nav{z-index:1;box-sizing:border-box;justify-content:space-between;align-items:center;width:100%;padding:16px clamp(24px,5vw,64px);display:flex;position:relative}.portal-brand{font-family:var(--font-sans);letter-spacing:.02em;color:#fff;align-items:center;gap:9px;font-size:1rem;font-weight:600;display:flex}.portal-staff-btn{-webkit-backdrop-filter:blur(8px);color:#ffffffeb;font-family:var(--font-sans);white-space:nowrap;background:#ffffff14;border:1px solid #ffffff38;border-radius:999px;align-items:center;gap:10px;padding:5px 18px 5px 5px;font-size:.85rem;font-weight:500;text-decoration:none;transition:background .18s,border-color .18s,color .18s;display:inline-flex}.portal-staff-btn:hover{color:#fff;background:#ffffff2e;border-color:#fff6;text-decoration:none}.portal-staff-icon-ring{width:30px;height:30px;color:var(--kt-navy);background:#ffffffe6;border-radius:50%;flex-shrink:0;place-items:center;transition:background .15s,color .15s;display:grid}.portal-staff-btn:hover .portal-staff-icon-ring{color:var(--kt-blue);background:#fff}.portal-hero{text-align:center;z-index:1;flex-direction:column;justify-content:flex-start;align-items:center;padding:24px 0 80px;display:flex;position:relative}.portal-hero-icon{-webkit-backdrop-filter:blur(8px);color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:22px;place-items:center;width:88px;height:88px;margin:0 auto 20px;display:grid}.portal-hero-title{font-family:var(--font-sans);color:#fff;letter-spacing:normal;text-align:center;margin:0 0 16px;font-size:1.75rem;font-weight:500;line-height:1.3}.portal-hero-slogan{letter-spacing:2px;color:#ffffff8c;margin-bottom:24px;font-size:.8125rem;font-weight:500}.portal-hero-sub{color:#ffffffb8;max-width:600px;margin:0 auto;font-size:.95rem;line-height:1.8}.landing{background:var(--bg);place-items:center;min-height:100vh;padding:28px 16px;display:grid}.landing-inner{width:720px;max-width:95vw}.landing-head{text-align:center;margin-bottom:26px}.landing-logo{font-size:2.4rem;line-height:1}.landing-head h1{margin:8px 0 4px;font-size:1.65rem}.landing-head p{margin:0}.role-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.role-card{text-align:left;cursor:pointer;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--rc,var(--brand)) 16%, transparent);flex-direction:column;align-items:flex-start;gap:5px;padding:22px;transition:transform .14s,box-shadow .14s,background .14s,color .14s;display:flex}.role-card:hover:not(:disabled){background:var(--rc,var(--brand));color:#fff;border-color:var(--rc,var(--brand));box-shadow:var(--shadow-md);transform:translateY(-2px)}.role-card:disabled{opacity:.6;cursor:default}.role-ico{font-size:1.7rem}.role-name{font-size:1.08rem;font-weight:700}.role-tag{color:var(--text-soft);font-size:.85rem}.role-card:hover:not(:disabled) .role-tag{color:#ffffffeb}.landing-foot{text-align:center;margin-top:24px;font-size:.9rem}.dot-sep{color:var(--text-faint);margin:0 10px}.portal-cta{border-radius:var(--radius);background:var(--brand);color:#fff;align-items:center;gap:14px;margin-top:16px;padding:16px 20px;text-decoration:none;transition:transform .14s,box-shadow .14s;display:flex}.portal-cta:hover{box-shadow:var(--shadow-md);color:#fff;text-decoration:none;transform:translateY(-2px)}.portal-cta-ico{font-size:1.6rem;line-height:1}.portal-cta-title{font-weight:700;display:block}.portal-cta-sub{opacity:.85;margin-top:2px;font-size:.84rem;display:block}.portal-cta-arrow{margin-left:auto;font-size:1.3rem}@media (max-width:560px){.role-grid{grid-template-columns:1fr}}.portal-nav{z-index:50;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0}.portal-nav-inner{align-items:center;gap:18px;max-width:1080px;height:56px;margin:0 auto;padding:0 20px;display:flex}.portal-nav-brand{color:var(--brand);white-space:nowrap;font-weight:700;text-decoration:none}.portal-nav-brand:hover{text-decoration:none}.portal-nav-links{scrollbar-width:none;flex:1;gap:4px;display:flex;overflow-x:auto}.portal-nav-links::-webkit-scrollbar{display:none}.portal-nav-links a{border-radius:var(--radius-sm);color:var(--text-soft);white-space:nowrap;padding:8px 12px;font-size:.92rem;font-weight:600;text-decoration:none;transition:background .12s,color .12s}.portal-nav-links a:hover{background:var(--surface-2);color:var(--brand);text-decoration:none}.portal-nav-links a.is-active{color:var(--kt-blue-600);background:#e4f3fc}.portal-nav-staff{color:var(--text-soft);white-space:nowrap;font-size:.9rem;font-weight:600;text-decoration:none}.portal-nav-staff:hover{color:var(--brand-accent)}@media (max-width:640px){.portal-nav-brand span,.portal-nav-staff{display:none}}@media (max-width:820px){.sidebar{width:64px}.sidebar .brand{place-items:center;min-height:72px;padding:16px 10px;display:grid}.sidebar .brand .logo{letter-spacing:0;font-size:0}.sidebar .brand .logo:before{content:"ธ";color:#fff;background:#ffffff1a;border-radius:12px;place-items:center;width:36px;height:36px;font-size:1rem;font-weight:800;display:grid}.sidebar .brand .sub,.sidebar nav a span:not(.ico),.sidebar .who .detail{display:none}.sidebar .who{align-items:center;padding:10px 12px}.sidebar .who>div>div:nth-child(2){display:none!important}.sidebar .who button{border-radius:999px!important;width:40px!important;min-width:40px!important;height:40px!important;padding:0!important;font-size:0!important}.content{padding:16px}}.verify-section{animation:.35s both fadeSlideUp}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.step-indicator{justify-content:center;align-items:center;gap:0;margin-bottom:28px;display:flex}.step-indicator .step-item{align-items:center;gap:0;display:flex}.step-indicator .step-circle{color:#94a3b8;background:var(--surface);border:2.5px solid #cbd5e1;border-radius:50%;flex-shrink:0;place-items:center;width:34px;height:34px;font-size:.88rem;font-weight:700;transition:all .25s;display:grid}.step-indicator .step-circle.active{border-color:var(--brand-accent);color:#fff;background:var(--brand-accent)}.step-indicator .step-circle.done{border-color:var(--green);color:#fff;background:var(--green)}.step-indicator .step-label{color:var(--text-faint);white-space:nowrap;margin-left:6px;font-size:.78rem;font-weight:600;transition:color .25s}.step-indicator .step-label.active{color:var(--brand-accent)}.step-indicator .step-label.done{color:var(--green)}.step-indicator .step-line{background:#e2e8f0;border-radius:2px;flex-shrink:0;width:48px;height:3.5px;margin:0 10px;transition:background .25s}.step-indicator .step-line.active{background:var(--kt-blue)}.step-indicator .step-line.done{background:var(--green)}@media (max-width:560px){.step-indicator .step-label{display:none}.step-indicator .step-line{width:32px;height:3px;margin:0 6px}}.vf-hero{text-align:center;margin-bottom:24px}.vf-hero-icon{width:56px;height:56px;color:var(--kt-blue);background:#01a6e714;border-radius:16px;place-items:center;margin:0 auto 12px;display:grid}.vf-hero-icon svg{width:26px;height:26px;display:block}.vf-hero-icon.success{color:var(--green);background:#1a9d5a14}.vf-hero h2{font-family:var(--font-sans);color:var(--text);letter-spacing:-.01em;margin:0 0 6px;font-size:1.25rem;font-weight:500}.vf-hero p{color:#6b7280;margin:0;font-size:.86rem;line-height:1.55}.vf-field{margin-bottom:14px}.vf-field label{color:var(--text-soft);letter-spacing:.01em;text-transform:uppercase;margin-bottom:5px;font-size:.78rem;font-weight:600;display:block}.vf-input-wrap{position:relative}.vf-input-wrap .vf-ico{pointer-events:none;color:var(--kt-blue);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;top:50%;left:13px;transform:translateY(-50%)}.vf-input-wrap .vf-ico svg{width:17px;height:17px;display:block}.vf-input-wrap input{padding-left:38px}.vf-input-wrap.no-ico input{padding-left:12px}.vf-hint{color:var(--text-faint);margin-top:4px;font-size:.76rem}.vf-optional{color:var(--text-faint);background:var(--gray-bg);vertical-align:middle;letter-spacing:0;text-transform:none;border-radius:4px;margin-left:5px;padding:1px 5px;font-size:.68rem;font-weight:500;display:inline-block}.vf-divider{color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:10px;margin:18px 0 14px;font-size:.75rem;font-weight:600;display:flex}.vf-divider:before,.vf-divider:after{content:"";background:var(--border);flex:1;height:1px}.consent-row{border-radius:var(--radius-sm);background:var(--surface);border:1.5px solid var(--border);cursor:pointer;align-items:flex-start;gap:12px;margin-bottom:10px;padding:12px 14px;transition:border-color .15s,background .15s;display:flex}.consent-row:hover{border-color:var(--brand-accent);background:#f6fbfe}.consent-row.checked{border-color:var(--brand-accent);background:#f0faff}.consent-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--brand-accent);cursor:pointer;flex-shrink:0;margin-top:2px}.consent-row .consent-text{font-size:.86rem;line-height:1.5}.consent-row .consent-text strong{color:var(--text);font-size:.88rem}.consent-row .consent-text .ct-sub{color:var(--text-soft);margin-top:2px;font-size:.78rem}.consent-row .consent-text a{color:var(--brand-accent);text-decoration:underline}.otp-group{justify-content:center;gap:10px;margin:22px 0 18px;display:flex}.otp-group input{text-align:center;width:50px;height:58px;color:var(--text);background:#f8fafc;border:1.5px solid #cbd5e1;border-radius:10px;padding:0;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:1.5rem;font-weight:700;transition:border-color .15s,box-shadow .15s,background .15s}.otp-group input:focus{border-color:var(--kt-blue);background:#fff;outline:none;box-shadow:0 0 0 4px #01a6e71f}.otp-group input.filled{border-color:var(--green);background:var(--green-bg);color:var(--green)}.otp-phone-card{text-align:center;background:#f8fafca6;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:14px;padding:12px 16px}.otp-phone-card .opc-label{color:var(--text-soft);margin-bottom:3px;font-size:.76rem}.otp-phone-card .opc-phone{font-size:1.15rem;font-weight:500;font-family:var(--font-sans);color:var(--text)}.otp-phone-card .opc-ref{color:var(--text-faint);margin-top:2px;font-size:.74rem}.verify-section .btn-primary{background:var(--kt-blue);font-family:var(--font-sans);border-radius:999px;padding:11px 20px;font-size:.96rem;font-weight:500;box-shadow:0 4px 12px #01a6e729}.verify-section .btn-primary:hover:not(:disabled){background:var(--kt-blue-600);box-shadow:0 6px 16px #01a6e742}.countdown{color:var(--text-soft);text-align:center;margin:10px 0 16px;font-size:.85rem}.countdown .time{color:var(--brand-accent);font-family:ui-monospace,monospace;font-weight:700}.proto-pill{color:#856010;background:#fff8e6;border:1px solid #f0d080;border-radius:999px;align-items:center;gap:6px;margin-bottom:14px;padding:5px 12px;font-size:.78rem;display:inline-flex}.verified-badge{background:var(--green-bg);color:var(--green);font-size:.83rem;font-weight:500;font-family:var(--font-sans);border:none;border-radius:999px;align-items:center;gap:6px;padding:6px 14px;display:inline-flex}.verify-summary{background:#f8fafca6;border:1px solid #e2e8f0;border-radius:14px;margin:0 auto;overflow:hidden;box-shadow:0 2px 10px #00000005}.verify-summary .vs-row{justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;font-size:.88rem;display:flex}.verify-summary .vs-row:not(:last-child){border-bottom:1px solid #f1f5f9}.verify-summary .vs-label{color:var(--text-soft);font-size:.82rem;font-family:var(--font-sans)}.verify-summary .vs-value{text-align:right;color:var(--text);font-weight:500;font-family:var(--font-sans)}.id-field-group{position:relative}.id-field-group .id-icon{opacity:.35;pointer-events:none;font-size:1rem;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.skip-verify{text-align:center;color:var(--text-soft);cursor:pointer;font-size:.86rem;font:inherit;background:0 0;border:none;margin-top:18px;font-weight:500;transition:color .15s;display:block}.skip-verify:hover{color:var(--kt-blue);text-decoration:underline}.success-icon-wrap{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:56px;height:56px;margin:0 auto 18px;display:grid;box-shadow:0 4px 12px #1a9d5a40}.success-check-svg{width:24px;height:24px}.success-case-card{background:var(--surface);border:1px solid #e3e8ef;border-radius:16px;margin:12px auto 20px;padding:16px 36px;display:inline-block;box-shadow:0 2px 8px #00000008}.success-case-card .label{color:var(--text-soft);font-size:.8rem;font-family:var(--font-sans);margin-bottom:4px;font-weight:500}.success-case-card .value{color:var(--kt-navy);font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:1.35rem;font-weight:700}.success-info-banner{color:var(--kt-blue-600);text-align:left;background:#e4f3fc;border:1.5px solid #d0ebfa;border-radius:12px;align-items:center;gap:12px;margin:16px 0 24px;padding:12px 18px;font-size:.85rem;line-height:1.5;display:flex}.success-info-banner .sib-icon{color:var(--kt-blue-600);flex-shrink:0;justify-content:center;align-items:center;display:flex}.success-info-banner .sib-icon svg{width:18px;height:18px}.success-info-banner .sib-text{font-family:var(--font-sans);font-weight:400}.btn-success-primary{background:var(--kt-blue);color:#fff;font-family:var(--font-sans);cursor:pointer;border:none;border-radius:12px;padding:12px 24px;font-size:.95rem;font-weight:500;transition:all .15s;box-shadow:0 4px 12px #01a6e729}.btn-success-primary:hover{background:var(--kt-blue-600);box-shadow:0 6px 16px #01a6e742}.btn-success-secondary{background:var(--surface);color:var(--text-soft);font-family:var(--font-sans);cursor:pointer;border:1px solid #cbd5e1;border-radius:12px;padding:12px 24px;font-size:.95rem;font-weight:500;transition:all .15s}.btn-success-secondary:hover{background:var(--surface-2);border-color:var(--text-faint);color:var(--text)}.track-hero-icon{width:36px;height:36px;color:var(--kt-blue);background:#01a6e714;border-radius:10px;flex-shrink:0;place-items:center;display:grid}.track-hero-icon svg{width:18px;height:18px;display:block}.btn-track-search{background:var(--kt-blue);color:#fff;font:inherit;font-family:var(--font-sans);cursor:pointer;white-space:nowrap;border:none;border-radius:12px;justify-content:center;align-items:center;padding:10px 18px;font-size:.92rem;font-weight:500;transition:background .13s,box-shadow .13s;display:inline-flex;box-shadow:0 4px 10px #01a6e726}.btn-track-search:hover:not(:disabled){background:var(--kt-blue-600);box-shadow:0 6px 14px #01a6e740}.btn-track-search:disabled{opacity:.55;cursor:not-allowed}.track-result-header{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;padding:12px 14px;display:flex}.track-info-stack{flex-direction:column;gap:14px;padding:4px 2px;display:flex}.intent-card{text-align:center;cursor:pointer;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);font:inherit;color:var(--text);flex-direction:column;align-items:center;gap:0;padding:22px 16px 18px;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex}.intent-card:hover{border-color:var(--ic-color,var(--border));transform:translateY(-3px);box-shadow:0 8px 24px #1018281a}.intent-card--active{border-color:var(--ic-color,var(--brand-accent));box-shadow:0 6px 20px #1018281a}.intent-icon-wrap{background:var(--ic-bg,#01a6e714);width:48px;height:48px;color:var(--ic-color,var(--kt-blue));border-radius:14px;place-items:center;margin-bottom:14px;transition:background .15s;display:grid}.intent-card:hover .intent-icon-wrap,.intent-card--active .intent-icon-wrap{background:var(--ic-color,var(--kt-blue));color:#fff}.intent-icon-wrap svg{width:22px;height:22px;display:block}.intent-name{font-family:var(--font-sans);color:var(--text);margin-bottom:5px;font-size:.95rem;font-weight:500;line-height:1.3}.intent-tag{color:var(--text-faint);font-size:.76rem;line-height:1.4}.track-case-input::placeholder{color:#64748b;opacity:1}.customer-page{flex-direction:column;gap:16px;display:flex}.customer-page-header{justify-content:space-between;align-items:flex-start;gap:18px;padding:2px 2px 0;display:flex}.customer-page-header h1{color:var(--kt-navy-800);letter-spacing:-.01em;margin-bottom:4px;font-size:1.55rem}.customer-page-header p{max-width:58ch;margin:0}.customer-case-toolbar{grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:14px;display:grid}.customer-case-search-form{grid-template-columns:minmax(260px,1fr) auto auto;align-items:center;gap:10px;display:grid}.customer-track-card{background:radial-gradient(circle at 100% 0,#01a6e71a,#0000 36%),linear-gradient(#fff 0%,#f9fcff 100%);border-color:#dbe7f3;border-radius:18px;box-shadow:0 10px 28px #003a7014;padding:18px!important}.customer-track-card-head{align-items:center;gap:12px;margin-bottom:12px;display:flex}.customer-track-icon{box-shadow:none;border-radius:14px;width:42px!important;height:42px!important;margin:0!important}.customer-track-title{color:var(--kt-navy);font-weight:800;line-height:1.25}.customer-track-subtitle{margin-top:2px;font-size:.85rem}.customer-search-button{min-height:44px;font-weight:800}.customer-new-complaint-card{text-align:center;border-radius:18px;flex-direction:column;align-self:stretch;gap:10px;min-width:170px;min-height:100%;padding:18px 20px;font-size:.96rem}.customer-case-results,.customer-case-list{margin-top:14px}.customer-case-list .case-table-card,.customer-case-results .case-table-card{border-color:#dbe7f3;border-radius:18px;box-shadow:0 8px 22px #003a700f}.customer-case-list .table th,.customer-case-results .table th{color:#4b6078;text-transform:none;letter-spacing:0;background:#f8fbff;padding:12px 16px;font-size:.82rem}.customer-case-list .table td,.customer-case-results .table td{padding:15px 16px}.customer-case-list .table tbody tr,.customer-case-results .table tbody tr{transition:background .16s,box-shadow .16s}.customer-case-list .table tbody tr:hover,.customer-case-results .table tbody tr:hover{background:#f6fbff}@media (max-width:760px){.customer-page-header{flex-direction:column;align-items:stretch}.customer-case-toolbar,.customer-case-search-form{grid-template-columns:1fr}.customer-new-complaint-card,.customer-search-button{justify-content:center;width:100%}.customer-new-complaint-card{flex-direction:row;min-height:52px}.customer-case-list .case-table-card,.customer-case-results .case-table-card{overflow-x:auto!important}.customer-case-list .table,.customer-case-results .table{min-width:720px}}.process-flow-container{flex-wrap:wrap;justify-content:center;align-items:stretch;gap:16px;margin-top:14px;display:flex}.process-flow-card{word-break:keep-all;overflow-wrap:break-word;flex-direction:column;flex:190px;min-width:180px;height:auto;display:flex}.new-complaint-grid{grid-template-columns:1fr;gap:24px;display:grid}@media (min-width:992px){.new-complaint-grid{grid-template-columns:3fr 2fr;gap:32px}}.login-split-container{background:radial-gradient(circle at 18% 12%, #01a6e742, transparent 24rem), linear-gradient(180deg, #0a3763 0 230px, var(--bg) 230px 100%);flex-direction:column;width:100%;min-height:100vh;display:flex;overflow-x:hidden}.login-left-pane{color:#fff;text-align:center;background:radial-gradient(circle at 82% 24%,#01a6e747,#0000 20rem),linear-gradient(135deg,#092845 0%,#004f8f 100%);flex-direction:column;flex:none;justify-content:center;align-items:center;min-height:230px;padding:34px 24px 84px;display:flex;position:relative;overflow:hidden}.login-left-pane:before{content:"";opacity:.45;pointer-events:none;background-color:#0000;background-image:linear-gradient(90deg,#ffffff14 1px,#0000 1px),linear-gradient(0deg,#ffffff0f 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:56px 56px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#00000073,#0000 86%);mask-image:linear-gradient(#00000073,#0000 86%)}.login-left-content{z-index:1;max-width:820px}.login-left-content h1{text-wrap:balance;margin-bottom:10px!important;font-size:2.1rem!important;line-height:1.18!important}.login-left-content p{text-wrap:pretty;color:#ffffffd6!important;font-size:1rem!important}.login-right-pane{background:0 0;flex-direction:column;flex:1 0 auto;justify-content:flex-start;align-items:center;width:100%;margin-top:-72px;padding:0 20px 52px;display:flex}.login-form-wrapper{width:100%}.auth-login .login-form-wrapper{max-width:520px}.auth-register .login-form-wrapper{max-width:760px}.login-right-pane .card.card-pad{border:1px solid #dbe7f3!important;border-radius:24px!important;padding:24px!important;box-shadow:0 22px 50px #002a5224,0 4px 14px #002a520f!important}.login-right-pane h2{letter-spacing:-.01em;color:var(--kt-navy-800)!important}@media (min-width:992px){.login-left-pane{min-height:260px;padding:42px 48px 96px}.login-left-content h1{font-size:2.35rem!important}}@media (max-width:640px){.login-split-container{background:radial-gradient(circle at 14% 10%, #01a6e738, transparent 18rem), linear-gradient(180deg, #0a3763 0 210px, var(--bg) 210px 100%)}.login-left-pane{min-height:210px;padding:30px 20px 76px}.login-left-content h1{font-size:1.75rem!important}.login-right-pane{margin-top:-62px;padding-inline:14px}.login-right-pane .card.card-pad{border-radius:20px!important;padding:18px!important}}.demo-role-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;display:grid}.demo-role-card{cursor:pointer;text-align:left;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;flex-direction:row;align-items:center;gap:10px;min-height:54px;padding:9px 11px;font-family:inherit;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.demo-role-card:hover{background:#f0f8ff;border-color:#8dd8f5;transform:translateY(-1px);box-shadow:0 8px 18px #0165a214}.demo-role-card:focus-visible{outline-offset:2px;outline:3px solid #01a6e738}.demo-role-icon{background:#fff;border-radius:8px;flex-shrink:0;place-items:center;width:32px;height:32px;display:grid;box-shadow:0 1px 4px #0000000a}.demo-role-label{color:var(--text);font-size:.8rem;font-weight:600;font-family:var(--font-sans);line-height:1.25}.demo-role-sub{color:var(--text-faint);margin-top:1px;font-size:.7rem;line-height:1.2}.login-input-field{margin-bottom:20px}.login-input-field label{color:var(--kt-navy-800);margin-bottom:6px;font-size:.88rem;font-weight:650;display:block}.premium-input input{box-sizing:border-box;width:100%;border:1.5px solid #dbe5ef!important;border-radius:14px!important;min-height:44px!important;padding:11px 14px!important;font-size:.94rem!important;transition:all .2s!important;box-shadow:0 1px 2px #00000008!important}.premium-input input:focus{border-color:var(--kt-blue)!important;outline:none!important;box-shadow:0 0 0 4px #01a6e724!important}.login-footer-link{color:#44546a;opacity:1;text-wrap:balance;justify-content:center;align-items:center;gap:6px;font-size:.88rem;font-weight:650;text-decoration:none;transition:all .2s;display:inline-flex}.login-footer-link:hover{color:var(--kt-blue);opacity:1;text-decoration:underline}.premium-login-btn{background:var(--kt-blue)!important;color:#fff!important;border-radius:999px!important;transition:all .2s cubic-bezier(.4,0,.2,1)!important;box-shadow:0 10px 22px #007cdb38!important}.premium-login-btn:hover:not(:disabled){background:var(--kt-blue-600)!important;transform:translateY(-1px)!important;box-shadow:0 12px 24px #007cdb4d!important}.premium-login-btn:active:not(:disabled){transform:translateY(0)!important}.premium-secondary-btn{color:#007cdb!important;background:#01a6e71f!important;border:none!important;border-radius:999px!important;transition:all .2s cubic-bezier(.4,0,.2,1)!important}.premium-secondary-btn:hover:not(:disabled){background:#01a6e733!important;transform:scale(1.01)!important}.premium-secondary-btn:active:not(:disabled){transform:scale(.99)!important}@media (max-width:720px){.demo-role-grid{grid-template-columns:1fr}.login-right-pane form>div[style*=grid-template-columns]{grid-template-columns:1fr!important}}@media (prefers-reduced-motion:reduce){.btn,.btn-new-complaint,.demo-role-card,.premium-login-btn,.login-footer-link,input,select,textarea{transition-duration:.01ms!important}}
html.a11y-font-lg{font-size:112.5%}html.a11y-font-xl{font-size:125%}html.a11y-contrast{--text:#000;--text-soft:#1f2937;--text-faint:#374151;--border:#475569;--bg:#fff;--surface-2:#fff}html.a11y-contrast a{text-decoration:underline}html.a11y-contrast :focus-visible{outline:3px solid var(--kt-navy);outline-offset:2px}html.a11y-reduce-motion *,html.a11y-reduce-motion :before,html.a11y-reduce-motion :after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.a11y-fab{z-index:90;background:var(--kt-navy);color:#fff;cursor:pointer;width:48px;height:48px;box-shadow:var(--shadow-md);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;display:flex;position:fixed;bottom:20px;right:20px}.a11y-fab:hover{background:var(--kt-navy-700)}.a11y-fab:focus-visible{outline:3px solid var(--kt-blue);outline-offset:2px}.a11y-panel{z-index:90;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:264px;box-shadow:var(--shadow-md);padding:14px;position:fixed;bottom:76px;right:20px}.a11y-panel h2{color:var(--text);margin:0 0 10px;font-size:.9rem}.a11y-row{margin-bottom:10px}.a11y-row-label{color:var(--text-soft);margin-bottom:4px;font-size:.8rem;display:block}.a11y-seg{gap:6px;display:flex}.a11y-btn{font-size:.85rem;font-family:var(--font-sans);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);cursor:pointer;flex:1;padding:6px 8px}.a11y-btn[aria-pressed=true]{background:var(--kt-navy);border-color:var(--kt-navy);color:#fff}.a11y-btn:focus-visible{outline:3px solid var(--kt-blue);outline-offset:1px}.a11y-btn--wide{width:100%}.a11y-reset{width:100%;font-size:.8rem;font-family:var(--font-sans);border-radius:var(--radius-sm);background:var(--gray-bg);color:var(--text-soft);cursor:pointer;border:none;padding:6px 8px}.a11y-reset:focus-visible{outline:3px solid var(--kt-blue);outline-offset:1px}