:root{color-scheme:dark;--page:#080b12;--surface:#0e1420;--surface-raised:#121a29;--stroke:#202c3d;--stroke-bright:#2a3a50;--ink:#f2f6ff;--muted:#9aa8bb;--faint:#637187;--accent:#45d6bd;--accent-soft:rgba(69,214,189,.13);--blue:#758bff;--danger:#ff7484;--shadow:0 28px 90px rgba(0,0,0,.34);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
/* Keep the support portal calm and consistent with the main site's blue accent. */
:root{--accent:#6f8cff;--accent-soft:rgba(111,140,255,.12)}
*:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;background:radial-gradient(ellipse at 64% 10%,rgba(36,83,117,.2),transparent 38%),var(--page);color:var(--ink);font-size:14px;line-height:1.5}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}[hidden]{display:none!important}
.support-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,64px);border-bottom:1px solid rgba(120,150,183,.14);background:rgba(8,11,18,.78);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:11px;font-size:15px;font-weight:800;letter-spacing:.04em}.brand img{border-radius:12px;object-fit:cover}.brand b{color:var(--accent)}.brand small{display:block;margin-top:1px;color:var(--faint);font-size:9px;letter-spacing:.19em;font-weight:700}.header-actions{display:flex;align-items:center;gap:25px;color:var(--muted);font-size:12px}.privacy-indicator{display:flex;align-items:center;gap:8px}.privacy-indicator i,.online-dot{width:7px;height:7px;display:inline-block;border-radius:50%;background:var(--accent);box-shadow:0 0 12px rgba(69,214,189,.65)}.home-link{transition:color .18s}.home-link:hover{color:var(--ink)}
.support-shell{width:min(1370px,calc(100% - 48px));min-height:calc(100vh - 124px);margin:24px auto 32px}.login-view{display:grid;min-height:calc(100vh - 135px);place-items:center}.login-card{position:relative;width:min(540px,100%);padding:55px clamp(25px,6vw,64px) 33px;text-align:center;background:linear-gradient(145deg,rgba(19,29,44,.97),rgba(11,16,26,.98));border:1px solid var(--stroke);border-radius:23px;box-shadow:var(--shadow);overflow:hidden}.login-card:before{position:absolute;top:-185px;left:50%;width:380px;height:310px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(69,214,189,.15),transparent 67%);content:"";pointer-events:none}.eyebrow{position:relative;display:inline-flex;align-items:center;gap:9px;color:#adbed0;font-size:10px;font-weight:700;letter-spacing:.18em}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}.hero-mark{display:grid;place-items:center;width:70px;height:70px;margin:27px auto 19px;border:1px solid rgba(69,214,189,.25);border-radius:21px;background:var(--accent-soft);color:var(--accent);box-shadow:0 0 35px rgba(69,214,189,.1)}.hero-mark svg{width:39px;height:39px}.login-card h1{position:relative;margin:0;font-size:clamp(29px,5vw,39px);letter-spacing:-.05em}.login-copy{max-width:370px;margin:12px auto 26px;color:var(--muted);font-size:14px;line-height:1.75}.discord-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;min-height:54px;border:1px solid #7688fa;border-radius:12px;background:#5865f2;color:#fff;font-weight:700;box-shadow:0 10px 28px rgba(88,101,242,.2);transition:transform .18s,background .18s}.discord-button:hover{transform:translateY(-2px);background:#6572ff}.discord-button svg{width:21px;height:21px}.trust-row{display:flex;justify-content:center;gap:15px;margin-top:28px;padding:19px 0;border-top:1px solid var(--stroke);border-bottom:1px solid var(--stroke);color:#b1bdcd;font-size:10px}.trust-row span{display:flex;align-items:center;gap:5px;white-space:nowrap}.trust-row b{color:var(--accent);font-size:9px}.legal-copy{margin:19px 0 0;color:var(--faint);font-size:10px;line-height:1.7}.legal-copy a{color:#aab9ff}.inline-error{min-height:17px;margin:9px 0 -12px;color:var(--danger);font-size:12px}
.portal-view{display:grid;grid-template-columns:300px minmax(0,1fr);height:min(820px,calc(100vh - 130px));min-height:570px;overflow:hidden;border:1px solid var(--stroke);border-radius:19px;background:rgba(11,16,25,.96);box-shadow:var(--shadow)}.request-sidebar{display:flex;flex-direction:column;min-width:0;background:rgba(13,19,30,.88);border-right:1px solid var(--stroke)}.profile-card{display:flex;align-items:center;gap:11px;padding:19px 17px;border-bottom:1px solid var(--stroke)}.profile-avatar,.profile-fallback{width:39px;height:39px;flex:none;border:1px solid var(--stroke-bright);border-radius:13px;object-fit:cover}.profile-fallback{display:grid;place-items:center;background:var(--surface-raised);color:var(--accent);font-weight:800}.profile-copy{display:grid;flex:1;min-width:0;gap:2px}.profile-copy strong{overflow:hidden;color:var(--ink);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.profile-copy span{color:var(--faint);font-size:10px}.icon-button,.new-request-button{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--stroke);border-radius:10px;background:transparent;color:var(--muted)}.icon-button:hover,.new-request-button:hover{border-color:var(--accent);color:var(--accent)}.sidebar-heading{display:flex;align-items:center;justify-content:space-between;padding:23px 17px 14px}.eyebrow-label{color:var(--faint);font-size:9px;font-weight:700;letter-spacing:.16em}.sidebar-heading h2{margin:3px 0 0;font-size:18px;letter-spacing:-.03em}.new-request-button{border-color:rgba(69,214,189,.3);background:var(--accent-soft);color:var(--accent);font-size:21px}.ticket-list{flex:1;overflow:auto;padding:0 10px}.ticket-empty{padding:28px 10px;color:var(--faint);text-align:center;font-size:12px}.ticket-item{display:block;width:100%;margin:3px 0;padding:12px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--ink);text-align:left;transition:background .16s,border-color .16s}.ticket-item:hover{background:rgba(255,255,255,.025)}.ticket-item.active{border-color:rgba(69,214,189,.18);background:rgba(69,214,189,.07)}.ticket-item-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.ticket-item strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.ticket-item time{flex:none;color:var(--faint);font-size:9px}.ticket-item-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:8px;color:var(--faint);font-size:10px}.tiny-status{display:inline-flex;align-items:center;gap:6px}.tiny-status i{width:6px;height:6px;border-radius:50%;background:var(--accent)}.tiny-status.waiting i{background:#ffbe6b}.tiny-status.closed i{background:#738197}.sidebar-foot{display:flex;align-items:center;gap:9px;padding:15px 17px;border-top:1px solid var(--stroke);color:var(--muted);font-size:10px}
.work-area{position:relative;display:grid;min-width:0;min-height:0;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,rgba(41,81,100,.1),transparent 58%),#0a101a}.welcome-panel{position:relative;max-width:500px;padding:50px 28px;text-align:center}.welcome-orbit{position:absolute;top:90px;left:50%;width:250px;height:250px;transform:translateX(-50%);border:1px solid rgba(69,214,189,.075);border-radius:50%;pointer-events:none}.orbit-two{width:330px;height:330px;top:50px;border-color:rgba(117,139,255,.07)}.welcome-icon{position:relative;display:grid;place-items:center;width:72px;height:72px;margin:0 auto 27px;border:1px solid rgba(69,214,189,.22);border-radius:23px;background:linear-gradient(145deg,rgba(69,214,189,.16),rgba(69,214,189,.04));color:var(--accent);box-shadow:0 12px 40px rgba(69,214,189,.07)}.welcome-icon svg{width:39px;height:39px}.welcome-panel h1{margin:14px 0;font-size:clamp(34px,5vw,52px);line-height:1.08;letter-spacing:-.06em}.welcome-panel h1 span{color:var(--accent)}.welcome-panel>p{max-width:410px;margin:0 auto 25px;color:var(--muted);line-height:1.8}.kb-search-container{display:flex;gap:8px;margin:24px auto 25px;max-width:420px}.kb-search-input{flex:1;min-height:44px;padding:0 14px;border:1px solid var(--stroke-bright);border-radius:11px;background:var(--surface);color:var(--ink);font-size:12px;outline:none;transition:border-color .18s}.kb-search-input:focus{border-color:var(--accent)}.kb-search-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--stroke-bright);border-radius:11px;background:var(--surface-raised);color:var(--muted);transition:border-color .18s,color .18s}.kb-search-button:hover{border-color:var(--accent);color:var(--accent)}.kb-search-button svg{width:18px;height:18px}.kb-results{margin:20px auto 25px;max-width:500px;text-align:left}.kb-results-item{display:block;padding:12px 14px;margin:0 0 8px;border:1px solid var(--stroke);border-radius:11px;background:var(--surface);color:var(--ink);text-decoration:none;transition:border-color .18s,background .18s}.kb-results-item:hover{border-color:var(--accent);background:var(--surface-raised)}.kb-results-item h4{margin:0 0 4px;font-size:13px;font-weight:700}.kb-results-item p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}.kb-results-item .kb-tag{display:inline-block;margin:0 0 6px;padding:3px 7px;border-radius:6px;background:var(--accent-soft);color:var(--accent);font-size:9px;font-weight:700}.kb-no-results{padding:20px;text-align:center;color:var(--faint);font-size:12px}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:48px;padding:0 19px;border:1px solid rgba(69,214,189,.58);border-radius:11px;background:var(--accent);color:#05211d;font-size:12px;font-weight:800;transition:transform .18s,box-shadow .18s}.primary-button:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(69,214,189,.2)}.primary-button span{font-size:17px}.welcome-meta{display:flex;justify-content:center;gap:18px;margin-top:23px;color:var(--faint);font-size:10px}.welcome-meta span:first-child{display:flex;align-items:center;gap:7px}.welcome-meta i{width:6px;height:6px;border-radius:50%;background:var(--accent)}.status-badge{display:inline-block;margin-left:8px;padding:2px 6px;border-radius:4px;background:var(--accent-soft);color:var(--accent);font-size:9px;font-weight:700}.ticket-item-status{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:6px;font-size:9px;font-weight:700}.ticket-item-status.open{background:rgba(69,214,189,.15);color:var(--accent)}.ticket-item-status.waiting{background:rgba(255,190,107,.15);color:#ffbe6b}.ticket-item-status.resolved{background:rgba(115,129,255,.15);color:var(--blue)}.ticket-item-status.closed{background:rgba(115,129,255,.1);color:var(--muted)}.ticket-item-status i{width:5px;height:5px;border-radius:50%;background:currentColor}.ticket-item-status.open i{background:var(--accent)}.ticket-item-status.waiting i{background:#ffbe6b}.ticket-item-status.resolved i{background:var(--blue)}.ticket-item-status.closed i{background:#738197}
.request-form{width:min(700px,100%);height:100%;overflow:auto;padding:clamp(22px,5vw,48px)}.form-topline{display:flex;align-items:center;justify-content:space-between}.text-button{border:0;background:transparent;color:var(--muted);font-size:11px}.text-button:hover{color:var(--accent)}.form-heading{margin:45px 0 29px}.step-count{color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.13em}.form-heading h1{margin:9px 0;font-size:clamp(27px,4vw,38px);letter-spacing:-.05em}.form-heading p{margin:0;color:var(--muted);font-size:13px}.field-label{display:block;margin-bottom:8px;color:#dfe7f2;font-size:11px;font-weight:700}.field-control{width:100%;min-height:48px;padding:0 13px;border:1px solid var(--stroke-bright);border-radius:10px;outline:none;background:#0d1521;color:var(--ink);font-size:12px}.field-control:focus{border-color:var(--accent)}.question-fields{display:grid;gap:17px;margin-top:20px}.question-fields label{display:grid;gap:7px;color:#dfe7f2;font-size:11px;font-weight:700}.question-fields small{color:var(--faint);font-size:10px;font-weight:400}.question-fields input,.question-fields textarea{width:100%;padding:12px;border:1px solid var(--stroke-bright);border-radius:10px;outline:none;background:#0d1521;color:var(--ink);font-size:12px;resize:vertical}.question-fields input:focus,.question-fields textarea:focus{border-color:var(--accent)}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:30px;padding-top:20px;border-top:1px solid var(--stroke);color:var(--faint);font-size:10px}.form-footer .primary-button{flex:none}
.chat-view{display:flex;flex-direction:column;width:100%;height:100%;min-height:0}.chat-header{display:flex;align-items:center;gap:13px;padding:19px 25px;border-bottom:1px solid var(--stroke);background:rgba(14,21,33,.72)}.chat-avatar{display:grid;place-items:center;width:43px;height:43px;flex:none;border:1px solid rgba(69,214,189,.22);border-radius:14px;background:var(--accent-soft);color:var(--accent)}.chat-avatar svg{width:27px;height:27px}.chat-title{flex:1;min-width:0}.chat-title h2{margin:2px 0;font-size:14px}.chat-title p{margin:0;color:var(--faint);font-size:10px}.status-pill{display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(255,190,107,.2);border-radius:20px;background:rgba(255,190,107,.07);color:#ffcb84;font-size:10px;white-space:nowrap}.status-pill i{width:6px;height:6px;border-radius:50%;background:#ffbe6b}.status-pill.open{border-color:rgba(69,214,189,.19);background:var(--accent-soft);color:var(--accent)}.status-pill.open i{background:var(--accent)}.status-pill.closed{border-color:var(--stroke);background:rgba(255,255,255,.035);color:var(--muted)}.status-pill.closed i{background:#738197}.chat-transcript{display:flex;flex:1;flex-direction:column;gap:16px;min-height:0;overflow:auto;padding:24px clamp(16px,4vw,40px)}.chat-day{text-align:center;color:var(--faint);font-size:9px}.message-row{display:flex;align-items:flex-end;gap:9px;max-width:min(76%,560px)}.message-row.customer{align-self:flex-end;flex-direction:row-reverse}.message-row.staff{align-self:flex-start}.message-avatar{width:28px;height:28px;flex:none;border:1px solid var(--stroke);border-radius:10px;object-fit:cover;background:var(--surface-raised)}.message-bubble{padding:10px 13px;border:1px solid var(--stroke);border-radius:13px 13px 13px 4px;background:#111a28}.customer .message-bubble{border-color:rgba(69,214,189,.2);border-radius:13px 13px 4px 13px;background:rgba(69,214,189,.1)}.message-meta{display:flex;gap:9px;margin-bottom:4px;color:var(--muted);font-size:9px}.message-meta time{color:var(--faint)}.message-text{overflow-wrap:anywhere;white-space:pre-wrap;color:#e4ebf5;font-size:12px;line-height:1.7}.system-message{align-self:center;max-width:85%;padding:9px 13px;border:1px solid rgba(117,139,255,.15);border-radius:20px;background:rgba(117,139,255,.055);color:#b5c0f5;text-align:center;font-size:10px;line-height:1.7}.waiting-banner{display:flex;align-items:center;gap:13px;margin:0 25px 13px;padding:13px 15px;border:1px solid rgba(255,190,107,.18);border-radius:12px;background:rgba(255,190,107,.055)}.waiting-banner>div{display:grid;gap:2px}.waiting-banner strong{color:#f5cb94;font-size:11px}.waiting-banner span:not(.waiting-pulse){color:var(--muted);font-size:10px}.waiting-pulse{display:flex;gap:4px}.waiting-pulse i{width:5px;height:5px;border-radius:50%;background:#ffbe6b;animation:pulse 1.2s infinite}.waiting-pulse i:nth-child(2){animation-delay:.15s}.waiting-pulse i:nth-child(3){animation-delay:.3s}@keyframes pulse{0%,70%,100%{opacity:.3;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}.message-form{position:relative;display:flex;align-items:flex-start;gap:9px;margin:0 20px 19px;padding:12px 13px 30px;border:1px solid var(--stroke-bright);border-radius:13px;background:#0d1521}.message-form:focus-within{border-color:rgba(69,214,189,.45)}.message-form textarea{flex:1;min-height:42px;max-height:140px;padding:10px 2px;border:0;outline:none;background:transparent;color:var(--ink);font-size:12px;line-height:1.55;resize:none}.message-form textarea::placeholder{color:var(--faint)}.message-form textarea:disabled{cursor:not-allowed}.message-form button{display:grid;place-items:center;width:37px;height:37px;flex:none;border:0;border-radius:10px;background:var(--accent);color:#05211d}.message-form button:disabled{cursor:not-allowed;opacity:.32}.message-form button svg{width:19px;height:19px}.composer-foot{position:absolute;right:13px;bottom:7px;left:13px;display:flex;justify-content:space-between;color:var(--faint);font-size:9px}.composer-foot span:first-child{color:#d9b17a}
.slash-command-menu{position:absolute;z-index:5;right:12px;bottom:calc(100% + 8px);left:12px;display:grid;gap:4px;max-height:min(260px,45vh);overflow-y:auto;padding:6px;border:1px solid var(--stroke-bright);border-radius:12px;background:#101a28;box-shadow:var(--shadow)}.slash-command-menu[hidden]{display:none}.slash-command-option{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;width:100%;padding:10px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--ink);text-align:left;cursor:pointer}.slash-command-option:hover,.slash-command-option[aria-selected=true]{border-color:rgba(69,214,189,.22);background:var(--accent-soft)}.slash-command-option code{color:var(--accent);font-size:11px;font-weight:800}.slash-command-option span{color:var(--muted);font-size:10px;line-height:1.5}.support-error-guidance{display:grid;gap:5px}.support-error-guidance strong{color:var(--ink)}.support-error-guidance p,.support-error-guidance small{margin:0;color:var(--muted);font-size:10px;line-height:1.6}.support-error-guidance details{margin-top:4px;padding-top:6px;border-top:1px solid var(--stroke)}.support-error-guidance summary{color:var(--accent);font-size:10px;font-weight:700;cursor:pointer}.support-error-guidance details p{margin-top:5px}.toast.error{height:auto;max-height:45vh;overflow-y:auto}
.toast{position:fixed;right:22px;bottom:22px;z-index:10;max-width:min(420px,calc(100% - 44px));padding:12px 15px;transform:translateY(14px);border:1px solid var(--stroke-bright);border-radius:11px;background:#131c2a;color:var(--ink);box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-size:12px}.toast.visible{transform:translateY(0);opacity:1}.toast.error{border-color:rgba(255,116,132,.4);color:#ffc0c7}.toast.success{border-color:rgba(69,214,189,.4);color:#a3f0df}
@media(max-width:800px){.support-shell{width:calc(100% - 28px);margin:14px auto 20px}.portal-view{grid-template-columns:235px minmax(0,1fr);height:calc(100dvh - 106px);min-height:520px}.request-sidebar{min-width:0}.welcome-panel{padding:35px 18px}.welcome-meta{flex-direction:column;gap:7px;align-items:center}.form-footer{align-items:flex-start;flex-direction:column}.form-footer .primary-button{width:100%}.chat-header{padding:15px}.chat-title p{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
@media(max-width:560px){.support-header{height:62px;padding:0 15px}.brand{font-size:13px}.brand img{width:34px;height:34px}.privacy-indicator{display:none}.header-actions{gap:0;font-size:11px}.support-shell{width:100%;margin:0}.portal-view{position:relative;display:flex;height:calc(100dvh - 62px);min-height:0;border:0;border-radius:0}.request-sidebar{width:100%;border:0}.portal-view:has(.chat-view:not([hidden])) .request-sidebar{display:none}.work-area{display:none}.portal-view:has(.chat-view:not([hidden])) .work-area{display:flex;position:absolute;inset:0}.chat-view{height:100dvh}.chat-header{gap:9px;padding:12px}.chat-avatar{width:37px;height:37px}.chat-title h2{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-pill{gap:5px;padding:6px 8px;font-size:9px}.status-pill span{max-width:94px;overflow:hidden;text-overflow:ellipsis}.chat-transcript{padding:18px 13px}.message-row{max-width:89%}.waiting-banner{margin:0 11px 10px;padding:11px}.message-form{margin:0 9px 10px;padding:8px 9px 28px}.composer-foot{right:9px;left:9px;font-size:8px}.composer-foot span:last-child{display:none}.request-form{padding:21px 18px}.form-heading{margin:36px 0 24px}.form-footer{margin-top:22px}.welcome-panel h1{font-size:39px}.welcome-panel>p{font-size:12px}.trust-row{gap:10px;font-size:9px}.trust-row span{gap:3px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.chat-back{display:none;width:30px;height:30px;flex:none;border:1px solid var(--stroke);border-radius:9px;background:transparent;color:var(--muted)}
@media(max-width:560px){.portal-view.mobile-work-active .request-sidebar{display:none}.portal-view.mobile-work-active .work-area{display:flex;position:absolute;inset:0}.portal-view.mobile-work-active .chat-view{height:100%}.portal-view.mobile-work-active .request-form{overflow-y:auto}.chat-back{display:block}}
:root[data-theme=light]{color-scheme:light;--page:#f2f5f9;--surface:#fff;--surface-raised:#e9eef5;--stroke:#d7e0ea;--stroke-bright:#bdcad8;--ink:#162334;--muted:#526477;--faint:#68798a;--accent:#087f72;--accent-soft:rgba(8,127,114,.1);--blue:#5368ce;--danger:#c43d53;--shadow:0 24px 70px rgba(32,52,77,.13)}
:root[data-theme=light] body{background:radial-gradient(ellipse at 64% 10%,rgba(74,139,170,.12),transparent 38%),var(--page)}
:root[data-theme=light] .support-header{border-color:var(--stroke);background:rgba(255,255,255,.82)}
:root[data-theme=light] .login-card{background:linear-gradient(145deg,#fff,#f7f9fc)}
:root[data-theme=light] .eyebrow{color:#506275}
:root[data-theme=light] .trust-row{color:#43576b}
:root[data-theme=light] .portal-view{border-color:var(--stroke);background:rgba(255,255,255,.96)}
:root[data-theme=light] .request-sidebar{background:#f7f9fc}
:root[data-theme=light] .work-area{background:radial-gradient(ellipse at 50% 38%,rgba(41,109,133,.07),transparent 58%),#f3f6fa}
:root[data-theme=light] .field-label,:root[data-theme=light] .question-fields label{color:#24374b}
:root[data-theme=light] .field-control,:root[data-theme=light] .question-fields input,:root[data-theme=light] .question-fields textarea{background:#fff;color:var(--ink)}
:root[data-theme=light] .message-bubble{background:#f1f5f9}
:root[data-theme=light] .message-text{color:#24374b}
:root[data-theme=light] .message-form{background:#fff}
:root[data-theme=light] .message-form textarea{color:var(--ink)}
:root[data-theme=light] .toast{background:#fff}
.theme-toggle{min-height:32px;padding:0 10px;border:1px solid var(--stroke);border-radius:9px;background:var(--surface);color:var(--muted);font-size:10px;font-weight:700;white-space:nowrap}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}
.ticket-feedback{flex:none;margin:0 20px 18px;padding:16px;border:1px solid var(--stroke);border-radius:13px;background:var(--surface)}
.ticket-rating-form{display:grid;grid-template-columns:1fr auto;align-items:center;gap:9px 12px}
.ticket-rating-form>div{display:grid;gap:3px;grid-column:1/-1}
.ticket-rating-form strong{color:var(--ink);font-size:12px}
.ticket-rating-form span,.ticket-rating-form label{color:var(--muted);font-size:10px}
.ticket-rating-form select,.ticket-rating-form textarea{min-width:0;padding:9px 10px;border:1px solid var(--stroke-bright);border-radius:9px;background:var(--page);color:var(--ink);font-size:11px}
.ticket-rating-form textarea{grid-column:1/-1;resize:vertical}
.rating-submit{min-height:36px;padding:0 13px;border:0;border-radius:9px;background:var(--accent);color:#05211d;font-size:10px;font-weight:800}
.ticket-feedback>strong{color:var(--accent);font-size:12px}
.ticket-feedback>p{margin:5px 0 0;color:var(--muted);font-size:11px;white-space:pre-wrap}
@media(max-width:650px){.ticket-feedback{margin:0 10px 12px}.ticket-rating-form{grid-template-columns:1fr}.ticket-rating-form>div,.ticket-rating-form textarea{grid-column:auto}}
.chat-actions{display:flex;gap:6px;margin-left:auto}.chat-request-action{min-height:32px;padding:0 10px;border:1px solid var(--stroke-bright);border-radius:8px;background:var(--page);color:var(--ink);font-size:10px;font-weight:700}.chat-request-action.danger{border-color:rgba(248,113,113,.35);color:#f87171}
@media(max-width:650px){.chat-header{flex-wrap:wrap}.chat-actions{width:100%;margin-left:44px}.chat-request-action{flex:1}}
.ticket-item-group{margin:3px 0;padding:3px;border:1px solid transparent;border-radius:13px;transition:border-color .16s,background .16s}.ticket-item-group:hover{border-color:var(--stroke);background:rgba(255,255,255,.018)}.ticket-item-group .ticket-item{margin:0}.ticket-list-delete{display:block;margin:1px 10px 3px auto;padding:4px 8px;border:1px solid rgba(255,116,132,.2);border-radius:7px;background:rgba(255,116,132,.06);color:var(--danger);font-size:9px;font-weight:700;transition:background .16s,border-color .16s}.ticket-list-delete:hover{border-color:rgba(255,116,132,.45);background:rgba(255,116,132,.12)}
.restriction-notice{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px 16px;margin:20px auto 0;border:1px solid rgba(255,116,132,.3);border-radius:12px;background:rgba(255,116,132,.08);color:#ffc0c7;font-size:11px}.appeal-intro{display:flex;align-items:center;gap:15px;padding:20px;margin:25px 0;border:1px solid var(--stroke);border-radius:14px;background:var(--surface)}.appeal-icon{display:grid;place-items:center;width:48px;height:48px;flex:none;border:1px solid rgba(255,116,132,.25);border-radius:12px;background:rgba(255,116,132,.08);color:var(--danger)}.appeal-icon svg{width:28px;height:28px}.appeal-intro h3{margin:0 0 4px;color:var(--ink);font-size:13px}.appeal-intro p{margin:0;color:var(--muted);font-size:11px;line-height:1.6}.field-hint{display:block;margin:4px 0 0;color:var(--faint);font-size:10px;line-height:1.5}

.request-form-error,.ticket-load-error{display:grid;gap:8px;padding:13px;border:1px solid rgba(255,116,132,.28);border-radius:11px;background:rgba(255,116,132,.07);color:#ffc0c7;font-size:11px;line-height:1.6}
.ticket-load-error{margin:10px 3px}.ticket-load-error strong{color:var(--ink)}.ticket-load-error button{justify-self:start;padding:7px 11px;border:1px solid rgba(69,214,189,.35);border-radius:8px;background:var(--accent-soft);color:var(--accent);font-size:10px;font-weight:700}
.request-confirm-dialog{width:min(430px,calc(100% - 32px));padding:0;border:1px solid var(--stroke-bright);border-radius:18px;background:linear-gradient(145deg,#131d2b,#0c121d);color:var(--ink);box-shadow:var(--shadow)}
.request-confirm-dialog::backdrop{background:rgba(2,5,10,.72);backdrop-filter:blur(5px)}
.request-confirm-dialog form{padding:26px}.request-confirm-dialog h2{margin:10px 0 7px;font-size:21px;letter-spacing:-.035em}.request-confirm-dialog p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}
.request-confirm-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}.request-confirm-actions button{min-height:39px;padding:0 13px;border:1px solid var(--stroke-bright);border-radius:9px;background:var(--surface);color:var(--ink);font-size:11px;font-weight:700}.request-confirm-actions .request-confirm-delete{border-color:rgba(255,116,132,.4);background:rgba(255,116,132,.1);color:#ff9eaa}
.question-fields textarea{min-height:110px;line-height:1.6}.question-fields input:focus-visible,.question-fields textarea:focus-visible,.field-control:focus-visible{outline:2px solid rgba(69,214,189,.45);outline-offset:2px}
.field-control:is(select),.question-fields select{appearance:none;padding-inline-end:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='m4 6 4 4 4-4' stroke='%239aa8bb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px}
.field-control option,.question-fields select option,.ticket-rating-form select option{background:#111a28;color:#f2f6ff}
.restriction-notice,.ticket-limit-notice{margin:0 auto 18px;padding:13px 15px;border:1px solid rgba(255,116,132,.26);border-radius:12px;background:rgba(255,116,132,.08);color:#ffc1c9;font-size:12px;line-height:1.65;text-align:left}
.restriction-notice.restriction-warning{border-color:rgba(255,190,107,.35);background:rgba(255,190,107,.12);color:#ffdaa7}
.restriction-notice.restriction-danger{border-color:rgba(255,116,132,.35);background:rgba(255,116,132,.12);color:#ffc1c9}
.ticket-limit-notice{border-color:rgba(255,190,107,.28);background:rgba(255,190,107,.08);color:#ffdaa7}
.primary-button[hidden],.new-request-button[hidden]{display:none}
.evidence-upload-button{display:grid;place-items:center;width:37px;height:37px;flex:none;border:1px solid var(--stroke-bright);border-radius:10px;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}.evidence-upload-button[hidden]{display:none}.message-form .evidence-upload-button{background:transparent}.message-form .evidence-upload-button:focus-within{outline:2px solid rgba(69,214,189,.45)}.support-attachment{display:block;max-width:min(360px,75vw);margin-top:8px}.support-attachment img{display:block;max-height:240px;border:1px solid var(--stroke);border-radius:10px;object-fit:contain}.support-attachment span{display:block;margin-top:3px;color:var(--muted);font-size:9px}


/* ===================== EMAIL PREFERENCE ===================== */
.email-pref-section {
  margin: 20px 0;
  padding: 16px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.email-pref-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  color: var(--text);
  font-size: 0.9rem;
}

.email-pref-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.email-pref-note {
  display: block;
  margin-top: 8px;
  color: var(--text-muted);
  font-size: 0.8rem;
}

/* ===================== APPEAL FORM ===================== */
.appeal-form-section {
  padding: 24px;
  background: var(--bg-card2);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin: 20px 0;
}

.appeal-form-section h3 {
  margin-bottom: 16px;
  color: var(--text);
  font-size: 1.1rem;
}

.appeal-form-section p {
  color: var(--text-muted);
  font-size: 0.9rem;
  margin-bottom: 16px;
}

.appeal-form-section label {
  display: block;
  margin-bottom: 8px;
  color: var(--text);
  font-size: 0.85rem;
  font-weight: 600;
}

.appeal-form-section textarea {
  width: 100%;
  min-height: 120px;
  padding: 12px;
  border: 1px solid var(--stroke-bright);
  border-radius: 8px;
  background: var(--page);
  color: var(--ink);
  font-size: 0.9rem;
  resize: vertical;
}

.appeal-form-section textarea:focus {
  border-color: var(--accent);
  outline: none;
}

.appeal-form-section button {
  min-height: 40px;
  padding: 0 20px;
  border: none;
  border-radius: 8px;
  background: var(--accent);
  color: #05211d;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}

.appeal-form-section button:hover {
  background: var(--accent-glow2);
  transform: translateY(-1px);
}

.appeal-form-section button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.appeal-success {
  padding: 12px;
  background: rgba(69, 214, 189, 0.1);
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: var(--accent);
  font-size: 0.9rem;
  margin-top: 12px;
}

.appeal-error {
  padding: 12px;
  background: rgba(255, 116, 132, 0.1);
  border: 1px solid var(--danger);
  border-radius: 8px;
  color: var(--danger);
  font-size: 0.9rem;
  margin-top: 12px;
}



/* ===================== EMAIL PREFERENCE ===================== */
.email-pref-section {
  margin: 20px 0;
  padding: 16px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.email-pref-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  color: var(--text);
  font-size: 0.9rem;
}

.email-pref-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.email-pref-note {
  display: block;
  margin-top: 8px;
  color: var(--text-muted);
  font-size: 0.8rem;
}

/* ===================== APPEAL FORM ===================== */
.appeal-form-section {
  padding: 24px;
  background: var(--bg-card2);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin: 20px 0;
}

.appeal-form-section h3 {
  margin-bottom: 16px;
  color: var(--text);
  font-size: 1.1rem;
}

.appeal-form-section p {
  color: var(--text-muted);
  font-size: 0.9rem;
  margin-bottom: 16px;
}

.appeal-form-section label {
  display: block;
  margin-bottom: 8px;
  color: var(--text);
  font-size: 0.85rem;
  font-weight: 600;
}

.appeal-form-section textarea {
  width: 100%;
  min-height: 120px;
  padding: 12px;
  border: 1px solid var(--stroke-bright);
  border-radius: 8px;
  background: var(--page);
  color: var(--ink);
  font-size: 0.9rem;
  resize: vertical;
}

.appeal-form-section textarea:focus {
  border-color: var(--accent);
  outline: none;
}

.appeal-form-section button {
  min-height: 40px;
  padding: 0 20px;
  border: none;
  border-radius: 8px;
  background: var(--accent);
  color: #05211d;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}

.appeal-form-section button:hover {
  background: var(--accent-glow2);
  transform: translateY(-1px);
}

.appeal-form-section button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.appeal-success {
  padding: 12px;
  background: rgba(69, 214, 189, 0.1);
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: var(--accent);
  font-size: 0.9rem;
  margin-top: 12px;
}

.appeal-error {
  padding: 12px;
  background: rgba(255, 116, 132, 0.1);
  border: 1px solid var(--danger);
  border-radius: 8px;
  color: var(--danger);
  font-size: 0.9rem;
  margin-top: 12px;
}

/* ===================== ENHANCED MANAGER ONBOARDING & SPECIAL TICKET STYLING ===================== */
.ticket-item[data-category="staff_access"],
.category-badge-staff-access {
  border: 1px solid rgba(255, 198, 93, 0.35) !important;
  background: linear-gradient(135deg, rgba(255, 198, 93, 0.08), rgba(69, 214, 189, 0.05)) !important;
}

.ticket-item[data-category="staff_access"] strong::before {
  content: "⭐ [MANAGER ONLY] ";
  color: #ffc65d;
  font-size: 10px;
  font-weight: 800;
}

.manager-only-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  margin: 0 0 16px;
  border: 1px solid rgba(255, 198, 93, 0.35);
  border-radius: 12px;
  background: rgba(255, 198, 93, 0.09);
  color: #ffda89;
  font-size: 12px;
}

.manager-only-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(255, 198, 93, 0.18);
  border: 1px solid rgba(255, 198, 93, 0.35);
  color: #ffc65d;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.kb-library-link{display:block;width:fit-content;margin:-13px auto 23px;color:var(--accent);font-size:11px;font-weight:700}
.kb-library-link:hover{text-decoration:underline}
.support-ai-box{max-width:470px;margin:0 auto 23px;padding:15px;border:1px solid rgba(117,139,255,.25);border-radius:14px;background:linear-gradient(145deg,rgba(117,139,255,.08),rgba(17,25,39,.85));text-align:left}
.support-ai-box>label{display:block;color:var(--ink);font-size:13px;font-weight:750}
.support-ai-box>p{margin:5px 0 11px;color:var(--muted);font-size:10px;line-height:1.55}
.support-ai-box>textarea{display:block;width:100%;min-height:75px;resize:vertical;padding:10px 11px;border:1px solid var(--stroke-bright);border-radius:10px;background:var(--surface);color:var(--ink);font-size:11px;outline:none}
.support-ai-box>textarea:focus,.support-ai-actions select:focus{border-color:var(--blue)}
.support-ai-actions{display:flex;align-items:center;gap:8px;margin-top:9px}
.support-ai-actions select{min-width:0;flex:1;min-height:38px;padding:0 9px;border:1px solid var(--stroke);border-radius:9px;background:var(--surface-raised);color:var(--ink);font-size:10px}
.support-ai-actions button{min-height:38px;padding:0 12px;border:1px solid rgba(117,139,255,.4);border-radius:9px;background:rgba(117,139,255,.15);color:#dce2ff;font-size:10px;font-weight:750}
.support-ai-actions button:hover:not(:disabled){background:rgba(117,139,255,.25)}
.support-ai-actions button:disabled{cursor:wait;opacity:.65}
.support-ai-result{margin-top:11px;padding:11px;border:1px solid var(--stroke);border-radius:10px;background:rgba(6,10,17,.55);color:#d9e3f2;font-size:11px;line-height:1.7;overflow-wrap:anywhere}
.support-ai-result p{margin:0 0 8px;white-space:normal}
.support-ai-result a{color:var(--accent);text-decoration:underline}
.support-ai-result small{display:block;margin-top:7px;color:var(--muted);font-size:9px}
.support-ai-result .support-ai-disclaimer{color:#f0c77a}
@media(max-width:520px){.support-ai-actions{align-items:stretch;flex-direction:column}.support-ai-actions select,.support-ai-actions button{width:100%;min-height:42px}}