/* Truck Manager: shared visual system, layered over functional styles. */
:root,[data-theme="light"]{--bg:#f3f6fb;--bg2:#fff;--bg3:#edf2f8;--bg4:#dfe8f3;--border:#dce4ee;--text:#182b46;--text2:#60718a;--accent:#2563eb;--success:#128361;--danger:#cc384f;--warn:#996b12;--radius:14px;--sidebar-w:252px;--shadow:0 6px 24px #182b4607}
[data-theme="dark"]{--bg:#0e1726;--bg2:#162237;--bg3:#1e2e46;--bg4:#2c405c;--border:#2d3e55;--text:#edf3ff;--text2:#a5b4ca;--accent:#6799ff;--success:#49c9a0;--danger:#ff8596;--warn:#efc367;--shadow:0 6px 24px #0002}
body{font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.55;background:var(--bg)}
button,input,textarea,select{font-family:inherit}button,a,input,textarea,select{ -webkit-tap-highlight-color:transparent}button{touch-action:manipulation}
:focus-visible{outline:3px solid #639bff;outline-offset:3px}button:disabled{opacity:.5;cursor:not-allowed;transform:none!important}
.sidebar{background:#101e33;color:#d9e5f6;border:0;padding:12px;overflow-y:auto}
.sidebar-brand{padding:21px 10px 29px;border-bottom:1px solid #ffffff12;gap:12px}.brand-icon{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#3777f4;color:white;font-size:15px;box-shadow:0 5px 18px #2563eb33;padding:0;flex-shrink:0}.brand-name{font-size:14px;text-transform:none;letter-spacing:-.3px;color:#fff}
.brand-name small{display:block;color:#92a7c4;font-size:10px;letter-spacing:1.8px;text-transform:uppercase;margin-top:3px;font-weight:500}
.sidebar-nav{padding:22px 0;gap:6px}.nav-caption{font-size:10px;letter-spacing:1.8px;color:#8ca1be;text-transform:uppercase;padding:0 15px 10px;font-weight:600}.nav-item{padding:13px 15px;border-radius:10px;color:#a9bad2;font-size:13px;gap:12px;transition:background .2s,color .2s,transform .2s}.nav-item:hover{background:#ffffff0b;color:#fff;transform:translateX(2px)}.nav-item.active{background:#2864de;color:#fff;box-shadow:0 5px 18px #0002}.nav-item svg{width:19px;height:19px;flex-shrink:0}
.sidebar-footer{border-color:#ffffff12;padding:16px 8px 6px;color:#91a5c0}.sidebar-user{border-color:#ffffff12;padding-bottom:16px;margin-bottom:14px}.sb-nickname{color:#fff;font-size:13px}.sb-username{color:#92a7c4;font-size:11px}.sidebar-footer .btn-secondary{background:#ffffff06;border-color:#ffffff15;color:#cbd8ea}.sidebar-footer .btn-secondary:hover{background:#ffffff12}.sb-avatar,.member-avatar,.modal-avatar,.account-avatar,.acc-avatar,.chat-msg-avatar{border-radius:50%}
.main{padding:0 36px 36px;min-width:0;background:var(--bg);scroll-behavior:smooth}.workspace-bar{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);margin-bottom:32px;gap:16px}.workspace-label{font-size:12px;color:var(--text2)}.workspace-label strong{color:var(--text);font-weight:600}.workspace-label span{margin:0 10px;color:var(--text2)}.workspace-tag{font-size:11px;padding:6px 11px;background:var(--bg2);border:1px solid var(--border);border-radius:30px;color:var(--text2)}
.section-header{margin-bottom:26px;gap:18px;flex-wrap:wrap;align-items:center}.section-header h1{font-size:30px;letter-spacing:-1.1px;text-transform:none;line-height:1.2}.section-description{font-size:13px;color:var(--text2);margin-top:8px;font-weight:400;letter-spacing:0;max-width:650px}.section.active{animation:section-in .35s ease both}.tab-content.active{animation:section-in .22s ease both}
.search-bar input{width:260px;max-width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:11px 14px;font-size:13px;box-shadow:var(--shadow)}
.members-grid{grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:18px}.member-card{border-radius:16px;background:var(--bg2);padding:27px 18px 23px;gap:12px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s,box-shadow .2s}.member-card:hover{transform:translateY(-4px);background:var(--bg2);border-color:var(--accent);box-shadow:0 12px 28px #23457514}.member-avatar{width:62px;height:62px;border:4px solid var(--bg3)}.member-name{font-size:14px;overflow-wrap:anywhere}.member-role-badge,.member-warns,.role-badge,.activity-type,.qm-scope-badge{border-radius:20px;padding:4px 9px}.member-warns{background:color-mix(in srgb,var(--warn) 10%,transparent)}
.card{border-radius:16px;box-shadow:var(--shadow);padding:24px;min-width:0}.card .card{box-shadow:none}.card-title{font-size:12px;padding-bottom:13px;margin-bottom:20px;border-color:var(--border)}.tabs,.modal-tabs{gap:5px;padding:5px;background:var(--bg3);border:0;border-radius:11px;overflow-x:auto}.tab{padding:10px 15px;white-space:nowrap;border-radius:8px!important;font-size:12px;transition:background .2s,color .2s}.tab.active{background:var(--bg2);color:var(--accent);box-shadow:0 2px 5px #152b4910}.ticket-main-tabs,.user-main-tabs{padding:7px!important;border-radius:16px 16px 0 0}
.form-group{gap:7px;margin-bottom:18px}.form-group label{font-size:12px;text-transform:none;letter-spacing:0;font-weight:600;color:var(--text)}.form-group input,.form-group textarea,.form-group select,.rank-select,.qm-name-input,.qm-content-input{border-radius:9px;padding:10px 12px;font-size:13px;background:var(--bg2);transition:border-color .2s,box-shadow .2s}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{box-shadow:0 0 0 3px #3777f419}.form-group input[type="color"]{height:40px}input,select,textarea{max-width:100%;min-width:0}input[type="checkbox"]{accent-color:var(--accent)}
.btn{border-radius:9px;padding:10px 15px;font-size:12px;font-weight:600;transition:transform .18s,background .18s,box-shadow .18s;line-height:1.4}.btn:hover{filter:none;transform:translateY(-1px);box-shadow:0 3px 9px #152b4912}.btn:active{transform:translateY(0)}.btn-primary{background:#2563eb;border-color:#2563eb;color:#fff}.btn-primary:hover{background:#1d54cf;filter:none}.btn-secondary{background:var(--bg2);border-color:var(--border)}.btn-sm{padding:7px 10px;font-size:11px}
.ticket-item,.preset-item,.image-library-item,.image-manager-item,.qm-item,.perm-check-item,.rank-help-panel,.chat-msg,.feedback{border-radius:10px}.ticket-item{padding:16px}.ticket-name{font-size:14px}.ticket-meta,.hint{font-size:12px}.closed-ticket-item{padding:16px 12px}.modal-overlay{backdrop-filter:blur(6px);background:#081426a6}.modal{border-radius:20px;box-shadow:0 25px 90px #0004;max-width:calc(100vw - 28px);animation:section-in .24s ease}.modal-header{padding:20px 24px}.modal-body{padding:24px}.modal-close{border-radius:8px}.toast{border-radius:12px;box-shadow:0 12px 40px #0002;padding:15px 22px;max-width:calc(100vw - 32px)}.loading{grid-column:1/-1;padding:65px 20px;font-size:14px}.loading::before{content:"";display:block;width:25px;height:25px;margin:0 auto 14px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
.mobile-menu{display:none}.sidebar-scrim{display:none}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}
body.login-page{height:100dvh;min-height:600px;overflow:auto;background:var(--bg);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(420px,1fr);align-items:stretch}.login-story{position:relative;overflow:hidden;background:#101e33;padding:60px 12%;display:flex;flex-direction:column;justify-content:space-between;color:white}.login-story::before,.login-story::after{content:"";position:absolute;width:500px;height:500px;border:1px solid #82adff20;border-radius:50%;right:-240px;bottom:-200px;pointer-events:none}.login-story::after{width:650px;height:650px;right:-315px;bottom:-275px;animation:orbit 12s ease-in-out infinite alternate}.login-story .story-brand{display:flex;align-items:center;gap:13px;font-weight:650;font-size:17px}.story-copy{position:relative;margin:75px 0;z-index:1}.story-eyebrow{font-size:11px;letter-spacing:2px;color:#7fa9f8;text-transform:uppercase}.story-copy h2{font-size:clamp(34px,4vw,62px);line-height:1.08;letter-spacing:-2px;font-weight:600;margin:22px 0}.story-copy h2 em{font-style:normal;color:#81adff}.story-copy p{color:#a4b7d1;max-width:350px;font-size:15px;line-height:1.8}.story-footer{font-size:11px;color:#8fa6c5;letter-spacing:1px}.login-page .login-box{align-self:center;justify-self:center;width:min(420px,calc(100% - 48px));padding:32px 12px;border:0;background:transparent;animation:section-in .5s ease}.login-page .login-logo{text-align:left;margin-bottom:35px}.login-page .login-logo .brand-icon{display:none}.login-page .login-logo h1{text-transform:none;letter-spacing:-1px;font-size:30px}.login-page .login-logo p{font-size:14px;margin-top:10px}.login-page .form-group{margin-bottom:22px}.login-page .form-group label{font-size:13px}.login-page .form-group input{padding:13px 14px;font-size:14px}.login-page .btn{padding:14px;font-size:14px}.login-footnote{font-size:12px;color:var(--text2);margin-top:24px;text-align:center}
@keyframes section-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes orbit{to{transform:translate(-25px,-25px)}}
@media(min-width:1450px){.main{padding-left:48px;padding-right:48px}.members-grid{grid-template-columns:repeat(auto-fill,minmax(205px,1fr))}}
@media(max-width:1100px){:root{--sidebar-w:220px}.main{padding:0 22px 24px}.users-layout{flex-direction:column}.users-left{flex:auto}.embeds-layout,.ticket-embeds-layout,.welcome-layout,.images-layout{grid-template-columns:1fr}.section-header>div{flex-wrap:wrap}}
@media(max-width:720px){.sidebar{position:fixed;inset:0 auto 0 0;width:260px;z-index:1100;transform:translateX(-100%);transition:transform .25s ease}.sidebar-open .sidebar{transform:translateX(0)}.sidebar-open .sidebar-scrim{display:block;position:fixed;inset:0;background:#07132388;z-index:1099;border:0}.mobile-menu{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;font-size:19px}.main{padding:0 16px 24px}.workspace-bar{height:66px;margin-bottom:24px}.workspace-tag{display:none}.workspace-label{margin-right:auto}.section-header h1{font-size:26px}.section-header>div{width:100%;gap:8px!important}.search-bar{flex:1;min-width:140px}.search-bar input{width:100%}.members-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.member-card{padding:20px 10px}.card{padding:16px}.form-row,.input-with-btn,.embed-actions,.embed-save-row,.linkbtn-row{flex-wrap:wrap}.tickets-layout{grid-template-columns:1fr}.action-grid{grid-template-columns:1fr}.modal-body{padding:16px}.login-page .login-story{display:none}body.login-page{display:flex;min-height:100dvh;align-items:center;justify-content:center}.login-page .login-logo .brand-icon{display:inline-grid;margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}