
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@500;600;700&display=swap');

:root{
  --bg:#07090d;--bg2:#0a0d12;--surface:#0d1118;--surface2:#111720;--surface3:#161d28;
  --line:#202936;--line2:#2a3543;--text:#f7f8fa;--sub:#b9c0c9;--muted:#7f8996;--muted2:#59636f;
  --red:#ef3038;--red2:#ff4c53;--redSoft:rgba(239,48,56,.12);--green:#41d989;--blue:#5d9cff;
  --orange:#ffae4d;--purple:#a66dff;--pink:#ff67a2;--rail:84px;--top:76px;--radius:16px;
}
*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--text);font-family:"Manrope",system-ui,sans-serif;background:radial-gradient(900px 520px at 75% -15%,rgba(239,48,56,.08),transparent 62%),var(--bg)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 78%)}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}.case-icon{width:19px;height:19px;display:inline-grid;place-items:center;flex:0 0 auto}.case-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* loading + motion */
#case-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#07090d;transition:opacity .42s ease,visibility .42s ease}#case-loader.hide{opacity:0;visibility:hidden}.loader-wrap{text-align:center}.loader-mark{width:58px;height:42px;margin:0 auto 16px;position:relative;border-radius:9px;background:linear-gradient(145deg,#ff5057,#d91e26);animation:ticketFloat 1.35s ease-in-out infinite;box-shadow:0 16px 45px rgba(239,48,56,.28)}.loader-mark:before,.loader-mark:after{content:"";position:absolute;top:13px;width:14px;height:16px;border-radius:50%;background:#07090d}.loader-mark:before{left:-8px}.loader-mark:after{right:-8px}.loader-mark b{position:absolute;inset:0;display:grid;place-items:center;font:700 22px "Sora"}.loader-dots{display:flex;justify-content:center;gap:6px}.loader-dots i{width:5px;height:5px;border-radius:50%;background:#5a626d;animation:dotPulse 1s infinite}.loader-dots i:nth-child(2){animation-delay:.15s}.loader-dots i:nth-child(3){animation-delay:.3s}@keyframes ticketFloat{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-7px) rotate(2deg)}}@keyframes dotPulse{0%,100%{opacity:.3;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}
.page-enter{animation:pageIn .42s cubic-bezier(.2,.8,.2,1) both}@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.stagger>*{animation:cardIn .42s ease both}.stagger>*:nth-child(2){animation-delay:.04s}.stagger>*:nth-child(3){animation-delay:.08s}.stagger>*:nth-child(4){animation-delay:.12s}.stagger>*:nth-child(5){animation-delay:.16s}.stagger>*:nth-child(6){animation-delay:.20s}@keyframes cardIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* icon rail */
.shell{min-height:100vh}.rail{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:100;display:flex;flex-direction:column;align-items:center;background:rgba(7,9,13,.96);border-right:1px solid var(--line);backdrop-filter:blur(18px)}.rail-logo{width:46px;height:34px;margin:20px 0 16px;position:relative;display:grid;place-items:center;border-radius:8px;background:linear-gradient(145deg,#ff5057,#d91e26);box-shadow:0 10px 28px rgba(239,48,56,.22);transform:rotate(-5deg)}.rail-logo:before,.rail-logo:after{content:"";position:absolute;top:10px;width:11px;height:13px;border-radius:50%;background:#07090d}.rail-logo:before{left:-6px}.rail-logo:after{right:-6px}.rail-logo b{transform:rotate(5deg);font:700 18px "Sora"}.rail-divider{width:34px;height:1px;background:var(--line);margin:4px 0 10px}.rail-nav{width:100%;display:grid;gap:5px;justify-items:center}.rail-link{width:48px;height:48px;position:relative;display:grid;place-items:center;border-radius:13px;color:#7f8995;transition:.2s ease}.rail-link:hover{color:#dce1e6;background:#11161e;transform:translateY(-1px)}.rail-link.active{color:white;background:var(--redSoft);box-shadow:inset 0 0 0 1px rgba(239,48,56,.28)}.rail-link.active:before{content:"";position:absolute;left:-18px;width:4px;height:24px;border-radius:0 4px 4px 0;background:var(--red)}.rail-link .tip{position:absolute;left:62px;top:50%;transform:translateY(-50%) translateX(-4px);padding:7px 10px;border:1px solid var(--line2);border-radius:8px;background:#111720;color:#eef1f4;font-size:11px;font-weight:700;white-space:nowrap;opacity:0;visibility:hidden;transition:.15s;box-shadow:0 12px 30px rgba(0,0,0,.35);pointer-events:none}.rail-link:hover .tip{opacity:1;visibility:visible;transform:translateY(-50%)}.rail-bottom{margin-top:auto;padding-bottom:18px;display:grid;gap:7px}

/* main */
.main{min-height:100vh;margin-left:var(--rail)}.topbar{height:var(--top);position:sticky;top:0;z-index:80;display:flex;align-items:center;justify-content:space-between;padding:0 26px;border-bottom:1px solid var(--line);background:rgba(7,9,13,.82);backdrop-filter:blur(20px)}.crumb{display:flex;align-items:center;gap:10px}.crumb .brand-mini{font:700 14px "Sora"}.crumb .slash{color:#454e58}.crumb strong{font-size:13px}.top-actions{display:flex;align-items:center;gap:10px}.server-pill{min-width:245px;height:44px;padding:0 12px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;background:#0c1118}.server-avatar{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#2e1518;color:#ff6268;font-size:12px;font-weight:800}.server-pill strong{display:block;font-size:11px}.server-pill small{display:block;margin-top:2px;color:var(--green);font-size:9px}.server-pill .down{margin-left:auto;color:#747e89}.circle-btn{width:40px;height:40px;border:1px solid transparent;border-radius:11px;background:transparent;color:#8d97a3;display:grid;place-items:center}.circle-btn:hover{background:#10151d;color:white;border-color:var(--line)}.user-mini{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#ff5057,#d91e26);font-size:12px;font-weight:800}.content{padding:34px 34px 60px}.wrap{width:min(1480px,100%);margin:0 auto}

/* titles */
.hero-head{text-align:center;margin:10px auto 30px;max-width:760px}.hero-head .eyebrow{color:var(--red2);font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.hero-head h1{margin:8px 0 8px;font:700 clamp(28px,3vw,42px) "Sora";letter-spacing:-.05em}.hero-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.page-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:22px}.page-head h1{margin:0;font:700 28px "Sora";letter-spacing:-.035em}.page-head p{margin:6px 0 0;color:var(--muted);font-size:12px}.page-kicker{color:var(--red2);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.head-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}

/* shared */
.card{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,#0e131a,#0b1016);box-shadow:0 14px 38px rgba(0,0,0,.12);transition:border-color .2s,transform .2s,box-shadow .2s}.card.hover:hover{transform:translateY(-2px);border-color:#303b49;box-shadow:0 20px 48px rgba(0,0,0,.2)}.pad{padding:20px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.card-head h3{margin:0;font:700 14px "Sora"}.card-head p{margin:4px 0 0;color:var(--muted);font-size:10px}.btn{min-height:40px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:10px;background:#0f151d;color:#d8dde3;font-size:11px;font-weight:800;transition:.18s ease}.btn:hover{transform:translateY(-1px);border-color:#34404d;background:#141b24}.btn.primary{color:white;background:linear-gradient(180deg,#ff474e,#e5262e);border-color:#ff555b;box-shadow:0 8px 22px rgba(239,48,56,.18)}.btn.danger{color:#ff787d;background:#1a0d10;border-color:#5d2024}.btn.ghost{background:transparent}.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid var(--line);border-radius:7px;background:#121821;color:#aab3bd;font-size:9px;font-weight:800}.badge.green{color:#62e49c;background:rgba(65,217,137,.10);border-color:rgba(65,217,137,.22)}.badge.red{color:#ff7278;background:var(--redSoft);border-color:rgba(239,48,56,.25)}.dot{width:6px;height:6px;border-radius:50%;background:currentColor}.empty{padding:54px 20px;text-align:center;color:var(--muted)}.empty .empty-icon{width:52px;height:52px;margin:0 auto 12px;display:grid;place-items:center;border-radius:16px;background:#121922;color:#6f7a86}.empty strong{display:block;color:#d9dee4;font-size:13px}.empty span{display:block;margin-top:5px;font-size:10px}

/* server selector */
.server-toolbar{max-width:940px;margin:0 auto 20px;display:flex;gap:10px}.search-wrap{position:relative;flex:1}.search-wrap .case-icon{position:absolute;left:13px;top:12px;color:#65707c}.search-input{width:100%;height:44px;padding:0 14px 0 42px;border:1px solid var(--line);border-radius:12px;background:#0b1016;color:white;outline:none}.search-input:focus{border-color:rgba(239,48,56,.45);box-shadow:0 0 0 3px rgba(239,48,56,.07)}.view-toggle{display:flex;padding:4px;border:1px solid var(--line);border-radius:12px;background:#0b1016}.view-toggle button{width:36px;border:0;border-radius:8px;background:transparent;color:#687380}.view-toggle button.active{background:#171e28;color:white}.server-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;max-width:1180px;margin:0 auto}.server-card{padding:18px;min-height:190px;display:flex;flex-direction:column}.server-card-top{display:flex;align-items:center;justify-content:space-between}.server-logo-big{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#221417,#35171b);color:#ff656b;font:700 18px "Sora"}.server-card h3{margin:18px 0 5px;font:700 15px "Sora"}.server-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.55}.server-card .btn{margin-top:auto;width:100%}

/* overview */
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.metric{padding:17px}.metric-icon{width:38px;height:38px;margin-bottom:14px;border-radius:11px;display:grid;place-items:center;background:var(--redSoft);color:var(--red2)}.metric-icon.blue{background:rgba(93,156,255,.10);color:var(--blue)}.metric-icon.green{background:rgba(65,217,137,.10);color:var(--green)}.metric-icon.orange{background:rgba(255,174,77,.10);color:var(--orange)}.metric label{display:block;color:var(--muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.metric strong{display:block;margin:6px 0 4px;font:700 25px "Sora"}.metric small{color:#66717d;font-size:9px}.overview-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.65fr);gap:14px}.chart-card{padding:20px}.chart-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.chart-head h3{margin:0;font:700 14px "Sora"}.chart-legend{display:flex;gap:12px;color:var(--muted);font-size:9px}.chart-legend i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.chart-wrap{height:260px;position:relative}.chart-wrap svg{width:100%;height:100%;overflow:visible}.chart-gridline{stroke:#1d2631;stroke-width:1}.chart-area{fill:url(#areaFill)}.chart-line{fill:none;stroke:var(--red2);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 3px 7px rgba(239,48,56,.25))}.quick-grid{display:grid;gap:10px}.quick-card{padding:14px;display:flex;align-items:center;gap:12px}.quick-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#151d27;color:#aeb7c1}.quick-card strong{display:block;font-size:11px}.quick-card span{display:block;margin-top:3px;color:var(--muted);font-size:9px}.quick-card .case-icon:last-child{margin-left:auto;color:#5f6a76}.recent-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}

/* tables */
.table-shell{overflow:hidden}.table-toolbar{padding:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);flex-wrap:wrap}.filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.table-wrap{overflow:auto}table{width:100%;min-width:760px;border-collapse:collapse}th,td{padding:12px 14px;border-bottom:1px solid #1b242f;text-align:left}th{color:#697480;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}td{color:#d0d6dc;font-size:10px}td strong{color:white}.row-user{display:flex;align-items:center;gap:8px}.tiny-avatar{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:#171f29;color:#9aa5b0;font-size:9px}.row-actions{display:flex;gap:4px}.icon-small{width:31px;height:31px;border:1px solid var(--line);border-radius:8px;background:#0e151d;color:#75808b;display:grid;place-items:center}.icon-small:hover{color:white;border-color:#394552}

/* forms/builders */
.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:14px;align-items:start}.builder-tabs{display:flex;gap:4px;padding:5px;margin-bottom:12px;border:1px solid var(--line);border-radius:12px;background:#0b1016;overflow:auto}.builder-tab{min-height:37px;padding:0 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:#8e98a3;font-size:9px;font-weight:800;white-space:nowrap}.builder-tab.active{color:#ff6b70;background:var(--redSoft);border-color:rgba(239,48,56,.22)}.section-card{padding:20px}.section-title{margin-bottom:17px;padding-bottom:14px;border-bottom:1px solid var(--line)}.section-title h3{margin:0;font:700 14px "Sora"}.section-title p{margin:5px 0 0;color:var(--muted);font-size:9px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.field.full{grid-column:1/-1}.field label{display:block;margin-bottom:6px;color:#dce1e6;font-size:9px;font-weight:800}.field .hint{display:block;margin-top:5px;color:#606b77;font-size:8px;line-height:1.45}.input,textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:#090e14;color:#edf0f3;outline:none;transition:.16s}.input{height:42px;padding:0 12px}textarea{min-height:98px;padding:11px;resize:vertical;line-height:1.5}.input:focus,textarea:focus{border-color:rgba(239,48,56,.42);box-shadow:0 0 0 3px rgba(239,48,56,.06)}.toggle{min-height:52px;padding:8px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #1a232d}.toggle-copy strong{display:block;font-size:10px}.toggle-copy span{display:block;margin-top:3px;color:var(--muted);font-size:8px}.switch{position:relative;width:40px;height:23px;flex:0 0 40px}.switch input{position:absolute;opacity:0}.switch span{position:absolute;inset:0;border-radius:999px;background:#29343f;transition:.18s}.switch span:after{content:"";position:absolute;left:3px;top:3px;width:17px;height:17px;border-radius:50%;background:#aab2ba;transition:.18s}.switch input:checked+span{background:var(--red)}.switch input:checked+span:after{transform:translateX(17px);background:white}.question-list{display:grid;gap:8px}.question-row{padding:10px;display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:8px;align-items:center;border:1px solid var(--line);border-radius:11px;background:#0b1118}.ticket-type-row{grid-template-columns:minmax(180px,1.2fr) minmax(120px,.65fr) minmax(180px,1fr) auto}.routing-category-row{grid-template-columns:minmax(0,1fr) auto}.builder-add-row{margin-top:10px;display:flex;align-items:center;gap:8px}.builder-add-row .btn{border-color:rgba(201,55,64,.35);background:rgba(201,55,64,.08);color:#f4c7ca}.builder-add-row .btn:hover{background:rgba(201,55,64,.14);transform:translateY(-1px)}.preview-sticky{position:sticky;top:calc(var(--top) + 18px);display:grid;gap:12px}.preview-card{padding:16px}.discord-preview{padding:15px;position:relative;border:1px solid #293440;border-radius:12px;background:#161d26;overflow:hidden}.discord-preview:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red2)}.preview-title{display:flex;align-items:center;gap:9px}.preview-logo{width:35px;height:35px;border-radius:10px;display:grid;place-items:center;background:var(--redSoft);color:var(--red2)}.preview-title strong{font-size:11px}.preview-title span{display:block;margin-top:2px;color:#9ba5af;font-size:8px}.preview-desc{margin:11px 0;color:#c4cbd2;font-size:9px;line-height:1.55}.preview-image{width:100%;max-height:180px;object-fit:contain;border-radius:9px;margin:10px 0;background:#0d131a}.preview-button{width:100%;height:38px;border:1px solid #35404c;border-radius:9px;background:#202833;color:white;font-size:9px;font-weight:800}

/* custom select */
.case-select{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}.select-ui{position:relative}.select-btn{width:100%;height:42px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:10px;background:#090e14;color:#edf0f3;font-size:9px;text-align:left}.select-ui.open .select-btn{border-color:#3c4755;background:#0c1219}.select-arrow{width:7px;height:7px;border-right:1.5px solid #7b8692;border-bottom:1.5px solid #7b8692;transform:rotate(45deg) translateY(-2px);transition:.18s}.select-ui.open .select-arrow{transform:rotate(225deg)}.select-menu{position:absolute;z-index:800;left:0;right:0;top:calc(100% + 6px);max-height:220px;padding:5px;overflow:auto;border:1px solid #333f4c;border-radius:10px;background:#0d141c;box-shadow:0 18px 48px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(-5px) scale(.98);transition:.15s}.select-ui.open .select-menu{opacity:1;visibility:visible;transform:none}.select-option{min-height:36px;padding:0 9px;display:flex;align-items:center;border-radius:7px;color:#bec6ce;font-size:9px}.select-option:hover{background:#151e28;color:white}.select-option.selected{color:#ff7075;background:var(--redSoft)}

/* upload */
.upload-zone{min-height:130px;padding:18px;border:1px dashed #394654;border-radius:13px;background:#0a0f15;display:grid;place-items:center;text-align:center;color:#7a8591;transition:.2s}.upload-zone:hover,.upload-zone.drag{border-color:rgba(239,48,56,.5);background:rgba(239,48,56,.035)}.upload-zone strong{display:block;color:#d9dee3;font-size:10px}.upload-zone span{display:block;margin-top:5px;font-size:8px}.upload-thumb{width:100%;max-height:220px;margin-top:10px;object-fit:contain;border:1px solid var(--line);border-radius:12px;background:#090d12}

/* panels/forms/cards */
.panel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:13px}.panel-card{padding:17px;min-height:210px;display:flex;flex-direction:column}.panel-card-top{display:flex;justify-content:space-between;align-items:flex-start}.panel-art{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--redSoft);color:var(--red2)}.panel-card h3{margin:18px 0 6px;font:700 14px "Sora"}.panel-card p{margin:0;color:var(--muted);font-size:9px;line-height:1.55}.panel-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}.panel-card .card-actions{margin-top:auto;padding-top:15px;display:flex;gap:8px}.panel-card .card-actions .btn{flex:1}

/* accordions/settings */
.accordion{display:grid;gap:9px}.acc{border:1px solid var(--line);border-radius:13px;background:#0d1219;overflow:hidden}.acc-head{width:100%;min-height:58px;padding:0 16px;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:white;text-align:left}.acc-head .case-icon{color:#84909c}.acc-head strong{font-size:11px}.acc-head span{display:block;margin-top:2px;color:var(--muted);font-size:8px}.acc-head .chev{margin-left:auto;transition:.2s}.acc.open .acc-head .chev{transform:rotate(180deg)}.acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}.acc.open .acc-body{grid-template-rows:1fr}.acc-inner{overflow:hidden}.acc-content{padding:0 16px 16px;border-top:1px solid var(--line)}

/* management pages */
.integration-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:13px}.integration{padding:17px}.integration-logo{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#151c25;color:#b3bdc7}.integration h3{margin:14px 0 5px;font-size:12px}.integration p{margin:0;color:var(--muted);font-size:9px;line-height:1.55}.integration .btn{margin-top:16px;width:100%}.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:13px}.team-card{padding:17px}.team-top{display:flex;align-items:center;gap:11px}.team-badge{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#151d27;color:#9ca7b2}.team-card h3{margin:0;font-size:12px}.team-card p{margin:3px 0 0;color:var(--muted);font-size:8px}.member-stack{display:flex;margin-top:14px}.member-stack i{width:29px;height:29px;margin-left:-6px;border:2px solid #0d1219;border-radius:50%;display:grid;place-items:center;background:#1b2430;color:#aab4be;font-style:normal;font-size:8px}.member-stack i:first-child{margin-left:0}.blacklist-tabs{display:flex;gap:5px;padding:5px;border:1px solid var(--line);border-radius:11px;background:#0b1016;width:max-content}.blacklist-tabs button{min-height:34px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:#7f8995;font-size:9px;font-weight:800}.blacklist-tabs button.active{background:var(--redSoft);color:#ff7075}

/* toast */
.toast-stack{position:fixed;right:20px;bottom:20px;z-index:10000;display:grid;gap:8px}.toast{min-width:280px;padding:12px 14px;border:1px solid #303b48;border-radius:11px;background:#101720;color:#dfe4e9;box-shadow:0 18px 50px rgba(0,0,0,.4);animation:toastIn .28s ease both;font-size:10px}.toast.success{border-color:rgba(65,217,137,.3)}.toast.error{border-color:rgba(239,48,56,.35)}@keyframes toastIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}

@media(max-width:1150px){.metric-grid{grid-template-columns:repeat(2,1fr)}.overview-grid,.builder-layout{grid-template-columns:1fr}.preview-sticky{position:static}.recent-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}

.ticket-type-list{display:grid;gap:10px}.ticket-type-card{border:1px solid var(--line);border-radius:14px;background:#0a1017;padding:12px}.ticket-type-top{display:grid;grid-template-columns:minmax(220px,1.25fr) minmax(190px,.65fr) minmax(260px,1fr) 42px;gap:10px;align-items:center}.ticket-type-expand{margin-top:9px;width:100%;border:0;background:transparent;color:#9ba8b5;display:flex;align-items:center;gap:8px;font-weight:800;font-size:10px;padding:8px 4px;text-align:left}.ticket-type-expand span:last-child{margin-left:auto}.ticket-type-details{padding:12px 2px 2px;border-top:1px solid var(--line);margin-top:5px}.role-access-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.role-check-list{margin-top:9px;max-height:230px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:8px;background:#0b1118}.role-check{display:flex;align-items:center;gap:9px;padding:8px;border-radius:8px;color:#c7d0d8;font-size:10px}.role-check:hover{background:#111a24}.role-check input{accent-color:var(--brand,#c9333d)}.publish-panel-box{border:1px dashed #344454;border-radius:13px;padding:12px;background:rgba(255,255,255,.015)}@media(max-width:980px){.ticket-type-top{grid-template-columns:1fr 1fr}.ticket-type-top>.icon-small{grid-column:2}.role-access-grid{grid-template-columns:1fr}}
@media(max-width:760px){:root{--rail:64px}.rail-link{width:42px;height:42px}.content{padding:22px 14px 45px}.topbar{padding:0 12px}.server-pill{display:none}.metric-grid{grid-template-columns:1fr 1fr}.server-toolbar{flex-wrap:wrap}.server-grid{grid-template-columns:1fr}.page-head{align-items:flex-start;flex-direction:column}.question-row{grid-template-columns:1fr}.builder-tabs{margin-left:-5px;margin-right:-5px}}


/* ==========================================================
   CASE V11 — CUSTOM STUDIO VISUAL OVERRIDES
   Inspired by clean management dashboards, not a clone.
   ========================================================== */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Sora:wght@500;600;700&display=swap');

html{font-size:calc(16px * (var(--ui-scale,100) / 100))}
body{
  font-family:var(--user-font,"Plus Jakarta Sans"),"Plus Jakarta Sans",system-ui,sans-serif!important;
  background:
    radial-gradient(900px 540px at 84% -5%,color-mix(in srgb,var(--brand,#ff4047) 10%,transparent),transparent 68%),
    var(--page-user,#0f151d)!important;
  color:#f7f9fc;
}
h1,h2,h3,.hero-head h1,.page-head h1,.brand-mini,.section-title h3,.card-head h3{
  font-family:var(--heading-font,"Sora"),"Sora","Plus Jakarta Sans",sans-serif!important;
  letter-spacing:-.035em;
}
.wrap{max-width:var(--content-max,1480px)!important;width:min(calc(100% - 48px),var(--content-max,1480px))!important}
.card,.section-card,.preview-card,.table-shell,.acc,.server-finder-shell,.server-result-card{
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface-user,#18212c) 96%,white 4%),var(--surface-user,#18212c))!important;
  border-color:var(--stroke-user,#2b3948)!important;
  border-radius:var(--radius-user,15px)!important;
}
.topbar,.rail{background:color-mix(in srgb,var(--page-user,#0f151d) 94%,transparent)!important;border-color:var(--stroke-user,#2b3948)!important}
.input,textarea,.select-btn,.search-input,.upload-zone{
  background:color-mix(in srgb,var(--surface2-user,#1e2936) 74%,#070b10 26%)!important;
  border-color:color-mix(in srgb,var(--stroke-user,#2b3948) 92%,white 8%)!important;
  color:#f5f7fb!important;
}
.select-menu{background:var(--surface2-user,#1e2936)!important;border-color:var(--stroke-user,#2b3948)!important}
.select-option:hover{background:color-mix(in srgb,var(--brand,#ff4047) 13%,var(--surface2-user,#1e2936))!important}
.btn.primary,.preview-button{background:linear-gradient(180deg,var(--brand2,#ff6670),var(--brand,#ff4047))!important;border-color:color-mix(in srgb,var(--brand,#ff4047) 80%,white 20%)!important}
.badge.red,.rail-link.active{border-color:color-mix(in srgb,var(--brand,#ff4047) 55%,transparent)!important}
.page-kicker,.eyebrow{color:var(--brand2,#ff6670)!important}

.case-emoji{
  width:2rem;height:2rem;display:inline-grid;place-items:center;flex:0 0 auto;border-radius:.62rem;
  border:1px solid color-mix(in srgb,currentColor 20%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 .35rem 1rem rgba(0,0,0,.12)
}
.case-emoji svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ce-red{color:#ff6870;background:rgba(255,64,71,.12)}.ce-blue{color:#63a9ff;background:rgba(75,143,255,.12)}
.ce-purple{color:#b884ff;background:rgba(168,104,255,.12)}.ce-pink{color:#ff76bd;background:rgba(255,95,177,.12)}
.ce-green{color:#5ade9a;background:rgba(69,218,145,.12)}.ce-orange{color:#ffb55d;background:rgba(255,172,73,.12)}
.ce-cyan{color:#55d8df;background:rgba(60,204,214,.12)}.ce-slate{color:#aab7c5;background:rgba(138,153,170,.10)}
.case-emoji.mini{width:1.6rem;height:1.6rem;border-radius:.48rem}.case-emoji.mini svg{width:.86rem;height:.86rem}
.case-emoji.big{width:3rem;height:3rem;border-radius:.9rem}.case-emoji.big svg{width:1.35rem;height:1.35rem}

/* Finder */
.server-finder{max-width:1320px;margin:0 auto}
.finder-hero{text-align:center;padding:34px 0 24px}.finder-hero .case-emoji{margin:0 auto 12px}.finder-hero h1{font-size:clamp(2rem,3vw,3rem);margin:0}.finder-hero p{max-width:680px;margin:10px auto 0;color:var(--muted);line-height:1.7;font-size:.9rem}
.server-finder-shell{padding:18px;margin-top:18px}
.finder-bar{display:grid;grid-template-columns:minmax(300px,1fr) auto auto;gap:10px;align-items:center}
.finder-search{position:relative}.finder-search .case-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#8d9aaa}.finder-search input{padding-left:42px;height:48px}
.finder-tabs{display:flex;gap:5px;padding:5px;border:1px solid var(--stroke-user,#2b3948);border-radius:11px;background:rgba(6,10,15,.22)}
.finder-tab{height:36px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:#9ca8b5;font-weight:700;font-size:.72rem}.finder-tab.active{background:color-mix(in srgb,var(--brand,#ff4047) 16%,transparent);color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand,#ff4047) 35%,transparent)}
.finder-view{display:flex;gap:5px}.finder-view button{width:42px;height:42px;border:1px solid var(--stroke-user,#2b3948);border-radius:10px;background:var(--surface2-user,#1e2936);color:#9eabb7}.finder-view button.active{color:#fff;border-color:color-mix(in srgb,var(--brand,#ff4047) 50%,var(--stroke-user,#2b3948));background:color-mix(in srgb,var(--brand,#ff4047) 14%,var(--surface2-user,#1e2936))}
.finder-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 4px}.finder-stat{padding:12px 14px;border:1px solid var(--stroke-user,#2b3948);border-radius:11px;background:rgba(255,255,255,.018)}.finder-stat strong{font-size:1.05rem}.finder-stat span{display:block;color:var(--muted);font-size:.65rem;margin-top:2px}
.server-group{margin-top:24px}.server-group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.server-group-head h2{font-size:1rem;margin:0;display:flex;align-items:center;gap:9px}.server-group-head span{color:var(--muted);font-size:.7rem}
.server-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.server-results.list{grid-template-columns:1fr}.server-results.list .server-result-card{grid-template-columns:auto 1fr auto;align-items:center}.server-results.list .server-card-copy p{display:none}.server-results.list .server-card-actions{margin:0}
.server-result-card{padding:14px;display:grid;gap:12px;position:relative;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.server-result-card:before{content:"";position:absolute;inset:0;background:radial-gradient(320px 140px at 0% 0%,color-mix(in srgb,var(--brand,#ff4047) 7%,transparent),transparent 70%);pointer-events:none}.server-result-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--brand,#ff4047) 30%,var(--stroke-user,#2b3948))!important;box-shadow:0 18px 45px rgba(0,0,0,.18)}
.server-icon-real{width:54px;height:54px;border-radius:15px;object-fit:cover;background:#263241;box-shadow:0 8px 18px rgba(0,0,0,.2)}.server-icon-fallback{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font:700 1.15rem "Sora";background:linear-gradient(145deg,color-mix(in srgb,var(--brand,#ff4047) 28%,#222d39),#222d39)}
.server-card-top2{display:flex;align-items:center;gap:12px}.server-card-copy{min-width:0}.server-card-copy h3{margin:0;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.server-card-copy small{display:flex;align-items:center;gap:5px;margin-top:4px;color:var(--muted);font-size:.63rem}.server-card-copy p{margin:10px 0 0;color:var(--muted);font-size:.7rem;line-height:1.55}.server-card-actions{display:flex;gap:7px;margin-top:2px}.server-card-actions .btn{flex:1}.server-card-actions .btn.disabled{opacity:.45;pointer-events:none}
.server-pill .server-avatar-img{width:31px;height:31px;border-radius:9px;object-fit:cover}.server-pill .server-avatar{overflow:hidden}

/* Custom Studio builders */
.studio-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:7px;border:1px solid var(--stroke-user,#2b3948);border-radius:13px;background:rgba(5,9,14,.2);margin-bottom:12px}.studio-tab{min-height:39px;padding:0 13px;display:flex;align-items:center;gap:8px;border:0;border-radius:9px;background:transparent;color:#9da9b5;font-size:.7rem;font-weight:800}.studio-tab .case-emoji{width:1.55rem;height:1.55rem;border-radius:.45rem}.studio-tab .case-emoji svg{width:.78rem;height:.78rem}.studio-tab.active{color:#fff;background:color-mix(in srgb,var(--brand,#ff4047) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand,#ff4047) 34%,transparent)}
.studio-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.55fr);gap:12px;align-items:start}.studio-panel{padding:18px}.studio-section-head{display:flex;align-items:center;gap:11px;padding-bottom:13px;margin-bottom:14px;border-bottom:1px solid var(--stroke-user,#2b3948)}.studio-section-head h3{margin:0;font-size:.9rem}.studio-section-head p{margin:3px 0 0;color:var(--muted);font-size:.64rem}.subcard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.subcard{padding:13px;border:1px solid var(--stroke-user,#2b3948);border-radius:12px;background:rgba(255,255,255,.016)}.subcard h4{margin:0 0 9px;font-size:.72rem}.option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.option-card{padding:12px;border:1px solid var(--stroke-user,#2b3948);border-radius:11px;background:rgba(5,10,15,.24);cursor:pointer;transition:.18s}.option-card:hover{border-color:color-mix(in srgb,var(--brand,#ff4047) 35%,var(--stroke-user,#2b3948))}.option-card strong{display:block;font-size:.68rem}.option-card span{display:block;margin-top:4px;color:var(--muted);font-size:.57rem;line-height:1.45}.builder-summary{position:sticky;top:88px;display:grid;gap:10px}.summary-list{display:grid;gap:8px}.summary-line{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--stroke-user,#2b3948);font-size:.65rem}.summary-line:first-child{border-top:0}.summary-line span{color:var(--muted)}
.emoji-picker-mini{display:flex;gap:7px;flex-wrap:wrap}.emoji-choice{width:36px;height:36px;border:1px solid var(--stroke-user,#2b3948);border-radius:9px;background:rgba(255,255,255,.02);display:grid;place-items:center;font-size:1rem}.emoji-choice:hover{border-color:var(--brand,#ff4047);transform:translateY(-1px)}

/* builder presentation */
.theme-preview{min-height:250px;padding:18px;border:1px solid var(--stroke-user,#2b3948);border-radius:15px;background:linear-gradient(145deg,var(--page-user,#0f151d),color-mix(in srgb,var(--surface-user,#18212c) 70%,var(--page-user,#0f151d)));overflow:hidden;position:relative}.theme-preview:before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--brand,#ff4047) 24%,transparent),transparent 68%);right:-80px;top:-120px}.theme-preview .fake-card{position:relative;padding:14px;border:1px solid var(--stroke-user,#2b3948);border-radius:var(--radius-user,15px);background:var(--surface-user,#18212c);margin-top:12px}.range-line{display:grid;grid-template-columns:1fr 65px;gap:10px;align-items:center}.range-line input[type=range]{accent-color:var(--brand,#ff4047)}

/* lighter page rhythm */
.hero-head,.page-head{padding-top:8px}.content{padding-top:26px!important}.metric,.panel-card,.quick-card{background:var(--surface-user,#18212c)!important}.metric:hover,.quick-card:hover{background:color-mix(in srgb,var(--surface-user,#18212c) 92%,white 8%)!important}

@media(max-width:1100px){.server-results{grid-template-columns:repeat(2,1fr)}.finder-bar{grid-template-columns:1fr auto}.finder-tabs{grid-column:1/-1}.studio-grid{grid-template-columns:1fr}.builder-summary{position:static}}
@media(max-width:720px){.server-results{grid-template-columns:1fr}.finder-bar{grid-template-columns:1fr}.finder-tabs,.finder-view{width:100%}.finder-stats{grid-template-columns:1fr}.option-grid,.subcard-grid{grid-template-columns:1fr}.wrap{width:min(calc(100% - 24px),var(--content-max,1480px))!important}}


/* ============================================================
   CASE V13 — POLISHED STUDIO
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap');

:root{
  --v12-footer:#0c1219;
  --v12-soft:#111a24;
  --v12-soft2:#16212d;
  --v12-line:#2a3847;
  --v12-text:#f7f9fb;
  --v12-muted:#8d9aaa;
}

/* cleaner typography */
body{
  font-family:"Inter",system-ui,sans-serif!important;
  letter-spacing:-.005em;
}
h1,h2,h3,h4,.page-head h1,.finder-hero h1,.brand-mini{
  font-family:"Manrope","Inter",sans-serif!important;
  letter-spacing:-.035em!important;
}

/* Custom Case icons/emojis are now backgroundless.
   They are still bespoke inline SVGs, just without the colored boxes. */
.case-emoji,
.case-emoji.mini,
.case-emoji.big{
  width:auto!important;
  height:auto!important;
  min-width:1.15rem;
  display:inline-grid;
  place-items:center;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
}
.case-emoji svg{
  width:1.08rem!important;
  height:1.08rem!important;
  stroke-width:1.9!important;
}
.case-emoji.big svg{width:1.75rem!important;height:1.75rem!important}
.case-emoji.mini svg{width:.95rem!important;height:.95rem!important}
.metric-icon,.quick-icon,.panel-art,.empty-icon,.preview-logo,.integration-logo{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* richer surfaces */
.card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),transparent 26%),
    color-mix(in srgb,var(--surface-user,#18212c) 94%,#0b1118 6%)!important;
  border-color:color-mix(in srgb,var(--stroke-user,#2b3948) 88%,white 12%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 18px 55px rgba(0,0,0,.14)!important;
}
.card.hover:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--brand,#ff4047) 24%,var(--stroke-user,#2b3948))!important;
  box-shadow:0 24px 72px rgba(0,0,0,.2)!important;
}
.section-card,.subcard,.acc,.server-result-card{
  position:relative;
  overflow:hidden;
}
.section-card:before,.subcard:before,.acc:before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
}

/* server finder — less copy-like, more Case */
.finder-hero{
  text-align:left!important;
  padding:28px 0 18px!important;
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:18px;
  align-items:center;
}
.finder-hero .case-emoji{
  grid-row:1/5;
  width:64px!important;
  height:64px!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(255,64,71,.13),rgba(255,64,71,.035))!important;
  border:1px solid rgba(255,64,71,.18)!important;
  display:grid!important;
}
.finder-hero .case-emoji svg{width:27px!important;height:27px!important}
.finder-hero .eyebrow,.finder-hero h1,.finder-hero p{margin-left:0!important;margin-right:0!important}
.finder-hero p{max-width:780px!important}
.server-finder-shell{
  background:
    radial-gradient(580px 180px at 70% -30%,rgba(255,64,71,.09),transparent 70%),
    var(--surface-user,#18212c)!important;
}
.server-result-card{
  min-height:210px;
  padding:18px!important;
}
.server-result-card:after{
  content:"";
  position:absolute;
  right:-48px;bottom:-48px;
  width:130px;height:130px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,64,71,.06),transparent 66%);
  pointer-events:none;
}
.server-icon-real,.server-icon-fallback{
  width:54px!important;height:54px!important;border-radius:16px!important;
  box-shadow:0 10px 26px rgba(0,0,0,.22);
}
.server-card-copy h3{font-size:.98rem!important}
.server-card-copy p{line-height:1.65!important}
.server-card-actions{position:relative;z-index:2}

/* application control summary */
.application-control-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.control-stat{
  padding:12px;
  border:1px solid var(--stroke-user,#2b3948);
  border-radius:11px;
  background:rgba(255,255,255,.018);
}
.control-stat span{display:block;color:var(--muted);font-size:.62rem;margin-bottom:4px}
.control-stat strong{font-size:.83rem}
.workflow-steps{display:grid;gap:8px;margin-top:10px}
.workflow-step{
  display:grid;grid-template-columns:24px 1fr auto;gap:9px;align-items:center;
  padding:10px 0;border-top:1px solid rgba(255,255,255,.055);
}
.workflow-step:first-child{border-top:0}
.workflow-index{
  width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  border:1px solid color-mix(in srgb,var(--brand,#ff4047) 35%,var(--stroke-user,#2b3948));
  color:var(--brand2,#ff6670);font-size:.62rem;font-weight:800;
}
.workflow-step strong{font-size:.7rem}.workflow-step span{color:var(--muted);font-size:.59rem}

/* Dedicated settings pages */
.settings-hero-strip{
  display:grid;grid-template-columns:1.35fr .65fr;gap:12px;margin-bottom:12px;
}
.detail-card{padding:18px}
.detail-card .detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.detail-head h3{margin:0;font-size:.9rem}.detail-head p{margin:4px 0 0;color:var(--muted);font-size:.64rem;line-height:1.55}
.detail-number{font:800 2rem "Manrope";color:color-mix(in srgb,var(--brand,#ff4047) 65%,white)}
.info-rows{display:grid;gap:0}
.info-row{
  min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  border-top:1px solid rgba(255,255,255,.055);
}
.info-row:first-child{border-top:0}.info-row span{color:var(--muted);font-size:.64rem}.info-row strong{font-size:.67rem}
.permission-matrix{width:100%;border-collapse:collapse}
.permission-matrix th,.permission-matrix td{padding:11px 10px}
.permission-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border-radius:999px;border:1px solid var(--stroke-user,#2b3948);font-size:.59rem}
.permission-chip.ok{color:#68dfa0;border-color:rgba(68,214,143,.25);background:rgba(68,214,143,.06)}
.permission-chip.warn{color:#ffbd68;border-color:rgba(255,181,83,.25);background:rgba(255,181,83,.06)}
.preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.preset-card{padding:14px;border:1px solid var(--stroke-user,#2b3948);border-radius:12px;background:rgba(255,255,255,.018)}
.preset-card h4{margin:0 0 5px;font-size:.73rem}.preset-card p{margin:0;color:var(--muted);font-size:.6rem;line-height:1.55}

/* Help / commands */
.help-hero{
  padding:28px 0 18px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
}
.help-hero h1{font-size:2.2rem;margin:4px 0 7px}.help-hero p{margin:0;max-width:760px;color:var(--muted);line-height:1.65}
.command-search{max-width:560px;margin-bottom:14px;position:relative}
.command-search .case-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#8794a2}
.command-search input{padding-left:40px}
.command-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.command-group{padding:17px}
.command-group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.command-group-head h3{margin:0;font-size:.86rem}
.command-list{display:grid;gap:7px}
.command-item{
  padding:10px 11px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.014)
}
.command-item code{color:#fff;font-weight:800;font-size:.65rem}
.command-item p{margin:4px 0 0;color:var(--muted);font-size:.59rem;line-height:1.45}

/* legal/status */
.legal-shell{max-width:980px;margin:0 auto}
.legal-card{padding:28px}
.legal-card h1{font-size:2.15rem;margin:0 0 8px}.legal-card h2{font-size:1rem;margin:24px 0 7px}
.legal-card p,.legal-card li{color:#a4afba;font-size:.72rem;line-height:1.75}
.status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.status-service{padding:14px;border:1px solid var(--stroke-user,#2b3948);border-radius:11px;background:rgba(255,255,255,.018)}
.status-service strong{display:block;font-size:.7rem}.status-service span{display:block;margin-top:4px;color:#55db94;font-size:.6rem}

/* Footer */
.case-footer{
  margin-top:44px;
  padding:24px 4px 10px;
  border-top:1px solid color-mix(in srgb,var(--stroke-user,#2b3948) 75%,transparent);
}
.footer-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:22px;flex-wrap:wrap;
}
.footer-brand{max-width:420px}
.footer-brand strong{font:800 1rem "Manrope";display:block}
.footer-brand p{margin:5px 0 0;color:var(--muted);font-size:.61rem;line-height:1.55}
.footer-links{display:flex;gap:15px;flex-wrap:wrap}
.footer-links a{color:#a9b4bf;font-size:.62rem;font-weight:700}
.footer-links a:hover{color:white}
.footer-bottom{
  margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.045);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:#6e7a87;font-size:.57rem;
}
.powered{display:flex;gap:10px;flex-wrap:wrap}.powered b{color:#98a4b0;font-weight:700}
@media(max-width:1000px){
  .command-groups,.settings-hero-strip{grid-template-columns:1fr}
  .preset-grid,.status-grid,.application-control-grid{grid-template-columns:1fr}
}



/* ============================================================
   CASE V13 — POLISH / BUG FIXES
   ============================================================ */
:root{--red:#c93740!important;--red2:#df525a!important;--redSoft:rgba(201,55,64,.105)!important}
.btn.primary{background:linear-gradient(180deg,#d84b53,#bd3039)!important;border-color:#df5960!important;box-shadow:0 8px 22px rgba(190,45,54,.14)!important}
.user-mini,.rail-logo,.loader-mark{background:linear-gradient(145deg,#d44850,#b92e37)!important}

/* no bright native scrollbars */
*{scrollbar-width:thin;scrollbar-color:#344352 #0b1118}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-track{background:#0b1118;border-radius:999px}
*::-webkit-scrollbar-thumb{background:#344352;border:2px solid #0b1118;border-radius:999px}
*::-webkit-scrollbar-thumb:hover{background:#435568}
.recent-grid .table-wrap{overflow:hidden!important}
.recent-grid table{width:100%!important;min-width:0!important;table-layout:fixed}
.recent-grid th,.recent-grid td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* switches: perfectly centered knob */
.switch{display:block;position:relative;width:42px!important;height:24px!important;flex:0 0 42px!important}
.switch span{position:absolute!important;inset:0!important;border-radius:999px!important}
.switch span:after{width:18px!important;height:18px!important;left:3px!important;top:50%!important;transform:translate(0,-50%)!important;box-shadow:0 1px 3px rgba(0,0,0,.32)}
.switch input:checked+span:after{transform:translate(18px,-50%)!important}

/* custom dropdown — deduped and stable */
.select-ui{z-index:4}.select-ui.open{z-index:850}.select-btn{min-height:42px;height:auto!important}.select-menu{z-index:1200!important;transform-origin:top center}.select-option{cursor:pointer}

/* emoji picker */
.emoji-picker{position:relative}.emoji-trigger{width:100%;min-height:42px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:#0b1118;color:#edf1f4;display:flex;align-items:center;gap:9px;text-align:left}.emoji-trigger:hover,.emoji-picker.open .emoji-trigger{border-color:#465567;background:#0e1620}.emoji-trigger [data-emoji-current]{min-width:24px;font-size:17px;text-align:center}.emoji-trigger-copy{flex:1;color:#aeb8c2;font-size:10px}.emoji-trigger .case-icon{width:13px;height:13px;color:#667382;transition:.18s}.emoji-picker.open .emoji-trigger .case-icon{transform:rotate(90deg)}.emoji-popover{position:absolute;z-index:1800;left:0;top:calc(100% + 7px);width:min(420px,92vw);padding:11px;border:1px solid #344352;border-radius:13px;background:#111a24;box-shadow:0 24px 70px rgba(0,0,0,.48);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.985);transition:.16s}.emoji-picker.open .emoji-popover{opacity:1;visibility:visible;transform:none}.emoji-popover-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:3px 3px 9px}.emoji-popover-head strong{font-size:11px}.emoji-popover-head span{color:var(--muted);font-size:8px}.emoji-tabs{display:flex;gap:4px;margin-bottom:8px;padding:4px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:#0c131b}.emoji-tabs button{height:29px;padding:0 11px;border:0;border-radius:7px;background:transparent;color:#8e9aa7;font-size:9px;font-weight:800}.emoji-tabs button.active{background:rgba(201,55,64,.12);color:#ec6870}.emoji-pane{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;max-height:230px;overflow:auto}.emoji-choice{min-height:38px;border:1px solid transparent;border-radius:8px;background:#0c131b;color:white;display:grid;place-items:center;font-size:18px}.emoji-choice:hover{border-color:#3a4a5b;background:#17222e;transform:translateY(-1px)}.emoji-choice.custom{grid-column:span 2;grid-template-columns:30px 1fr;gap:6px;padding:5px 7px;text-align:left;font-size:9px}.emoji-choice.custom img{width:24px;height:24px;object-fit:contain}.emoji-choice.custom span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.emoji-empty{grid-column:1/-1;padding:22px 10px;text-align:center;color:var(--muted);font-size:9px}

/* custom color control */
.case-color{display:grid;grid-template-columns:54px minmax(130px,190px) 1fr;gap:9px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:11px;background:#0b1118}.color-preview{width:54px;height:42px;border-radius:9px;background:var(--picked);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}.color-hex{height:42px!important;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;text-transform:uppercase}.color-presets{display:flex;gap:6px;flex-wrap:wrap}.color-swatch{width:27px;height:27px;border:2px solid transparent;border-radius:8px;background:var(--swatch);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:.15s}.color-swatch:hover{transform:translateY(-2px) scale(1.05)}.color-swatch.active{border-color:white;box-shadow:0 0 0 2px var(--swatch)}

/* notification center */
.notification-wrap{position:relative}.notification-dot{position:absolute;right:8px;top:8px;width:7px;height:7px;border-radius:50%;background:#d84b53;box-shadow:0 0 0 2px #080d13}.notification-panel{position:absolute;right:-10px;top:calc(100% + 10px);width:370px;z-index:2000;border:1px solid #334151;border-radius:14px;background:#111a24;box-shadow:0 26px 80px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-7px) scale(.985);transition:.18s}.notification-wrap.open .notification-panel{opacity:1;visibility:visible;transform:none}.notification-head{padding:13px 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.055)}.notification-head strong{display:block;font-size:11px}.notification-head span{display:block;margin-top:2px;color:var(--muted);font-size:8px}.tiny-btn,.link-button{border:0;background:transparent;color:#9da9b6;font-size:8px;font-weight:800}.tiny-btn{padding:7px 9px;border:1px solid #334151;border-radius:8px}.tiny-btn:hover,.link-button:hover{color:white}.notification-list{max-height:390px;overflow:auto;padding:6px}.notification-item{display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;padding:10px;border-radius:9px;color:inherit}.notification-item:hover{background:#17222d}.notification-item.unread{background:rgba(201,55,64,.055)}.notification-icon{width:30px;height:30px;display:grid;place-items:center;color:#d95a62}.notification-copy strong{display:block;font-size:9px}.notification-copy span{display:block;margin-top:3px;color:var(--muted);font-size:8px;line-height:1.35}.notification-new{width:6px;height:6px;border-radius:50%;background:#d84b53}.notification-loading{padding:28px 12px;text-align:center;color:var(--muted);font-size:9px}.notification-foot{padding:10px 13px;border-top:1px solid rgba(255,255,255,.055);display:flex;align-items:center;justify-content:space-between;gap:10px}.notification-foot span{color:#6f7c89;font-size:7px}

/* activity animation */
.chart-line{stroke-dasharray:1250;stroke-dashoffset:1250;animation:caseChartDraw 1.8s cubic-bezier(.2,.8,.2,1) .2s forwards}.chart-area{opacity:0;animation:caseAreaIn 1.3s ease .55s forwards}.chart-gridline{opacity:0;animation:caseGridIn .45s ease forwards}.chart-gridline:nth-of-type(2){animation-delay:.08s}.chart-gridline:nth-of-type(3){animation-delay:.14s}.chart-gridline:nth-of-type(4){animation-delay:.20s}.chart-gridline:nth-of-type(5){animation-delay:.26s}.chart-runner{fill:#e65a62;filter:drop-shadow(0 0 5px rgba(217,74,82,.6))}@keyframes caseChartDraw{to{stroke-dashoffset:0}}@keyframes caseAreaIn{to{opacity:1}}@keyframes caseGridIn{to{opacity:1}}

@media(max-width:760px){.case-color{grid-template-columns:44px 1fr}.color-presets{grid-column:1/-1}.notification-panel{position:fixed;left:12px;right:12px;top:70px;width:auto}.emoji-pane{grid-template-columns:repeat(6,1fr)}}


/* ============================================================
   CASE V14 — PICKER + PUBLIC HOME
   ============================================================ */

/* Ticket-builder popovers must be allowed outside their cards. */
.studio-panel,
.studio-grid,
.section-card,
.subcard,
.form-grid,
.field{
  overflow:visible!important;
}
.emoji-picker{
  position:relative!important;
  z-index:20;
}
.emoji-picker.open{
  z-index:5000!important;
}
.emoji-picker.open .emoji-popover{
  display:block!important;
  pointer-events:auto!important;
  z-index:99999!important;
}
.emoji-popover{
  pointer-events:none;
}
.emoji-picker.open .emoji-popover{
  pointer-events:auto;
}
.subcard:has(.emoji-picker.open),
.field:has(.emoji-picker.open){
  z-index:9999!important;
  position:relative!important;
}
.select-ui.open{
  z-index:4500!important;
}
.select-menu{
  z-index:5000!important;
}

/* Cleaner current emoji presentation */
.emoji-trigger [data-emoji-current]{
  width:24px;
  min-width:24px;
  height:24px;
  display:grid;
  place-items:center;
  overflow:hidden;
  line-height:1;
}
.emoji-trigger [data-emoji-current] img{
  width:21px;
  height:21px;
  object-fit:contain;
}
.emoji-popover{
  width:min(440px,calc(100vw - 36px))!important;
}
@media(max-width:720px){
  .emoji-popover{
    left:auto!important;
    right:0!important;
    width:min(390px,calc(100vw - 24px))!important;
  }
}

/* ---------- Public landing page ---------- */
.public-home{
  min-height:100vh;
  color:#f4f6f8;
  background:
    radial-gradient(900px 520px at 72% 4%,rgba(182,41,50,.13),transparent 62%),
    radial-gradient(700px 420px at 12% 86%,rgba(118,33,41,.08),transparent 70%),
    #0d131a;
}
.public-nav{
  height:76px;
  max-width:1240px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.public-brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:"Manrope","Inter",sans-serif;
  font-weight:800;
  font-size:18px;
}
.public-brand-mark{
  width:38px;
  height:28px;
  position:relative;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:linear-gradient(145deg,#c6343d,#91232b);
  box-shadow:0 12px 34px rgba(140,31,39,.24);
  transform:rotate(-6deg);
}
.public-brand-mark:before,
.public-brand-mark:after{
  content:"";
  position:absolute;
  top:8px;
  width:8px;
  height:11px;
  border-radius:50%;
  background:#0d131a;
}
.public-brand-mark:before{left:-4px}
.public-brand-mark:after{right:-4px}
.public-brand-mark b{
  transform:rotate(6deg);
  font-size:13px;
}
.public-nav-links{
  display:flex;
  align-items:center;
  gap:18px;
}
.public-nav-links a{
  color:#98a4b0;
  font-size:12px;
  font-weight:700;
}
.public-nav-links a:hover{color:white}
.public-nav-actions{
  display:flex;
  align-items:center;
  gap:9px;
}
.home-btn{
  min-height:42px;
  padding:0 16px;
  border:1px solid #2b3743;
  border-radius:11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#141d27;
  color:#e8edf2;
  font-size:12px;
  font-weight:800;
  transition:.18s ease;
}
.home-btn:hover{
  transform:translateY(-2px);
  border-color:#40505f;
  background:#192430;
}
.home-btn.primary{
  border-color:#b32d36;
  background:linear-gradient(180deg,#c93a43,#a5262f);
  color:#fff;
  box-shadow:0 12px 30px rgba(130,28,36,.20);
}
.home-btn.primary:hover{
  background:linear-gradient(180deg,#d14049,#ad2932);
  box-shadow:0 16px 36px rgba(130,28,36,.27);
}
.public-hero{
  max-width:1240px;
  margin:0 auto;
  padding:92px 24px 74px;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(430px,.95fr);
  gap:66px;
  align-items:center;
}
.public-eyebrow{
  display:flex;
  align-items:center;
  gap:8px;
  color:#d85b62;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.public-eyebrow i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#55d992;
  box-shadow:0 0 14px rgba(85,217,146,.45);
}
.public-hero h1{
  margin:16px 0 17px;
  max-width:720px;
  font:800 clamp(46px,6vw,76px)/.98 "Manrope","Inter",sans-serif;
  letter-spacing:-.055em;
}
.public-hero h1 span{
  color:#ce444c;
}
.public-hero p{
  max-width:650px;
  margin:0;
  color:#9ba7b4;
  font-size:16px;
  line-height:1.8;
}
.public-hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:28px;
}
.public-proof{
  margin-top:30px;
  display:flex;
  gap:24px;
  flex-wrap:wrap;
}
.proof-item strong{
  display:block;
  font-size:14px;
}
.proof-item span{
  display:block;
  margin-top:3px;
  color:#6f7d8b;
  font-size:11px;
}
.home-window{
  padding:13px;
  border:1px solid #2a3744;
  border-radius:20px;
  background:linear-gradient(180deg,#18222d,#131b24);
  box-shadow:
    0 34px 90px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.035);
  transform:perspective(1200px) rotateY(-3deg) rotateX(1deg);
}
.home-window-bar{
  height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 7px 0 3px;
}
.window-dots{
  display:flex;
  gap:5px;
}
.window-dots i{
  width:7px;height:7px;border-radius:50%;
  background:#45515e;
}
.window-status{
  display:flex;
  align-items:center;
  gap:6px;
  color:#6ddb9d;
  font-size:9px;
  font-weight:800;
}
.home-window-body{
  border:1px solid #2a3744;
  border-radius:14px;
  padding:17px;
  background:#10171f;
}
.home-window-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  margin-bottom:14px;
}
.home-window-head strong{font-size:15px}
.home-window-head span{color:#798694;font-size:10px}
.home-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.home-stat{
  padding:11px;
  border:1px solid #25313d;
  border-radius:10px;
  background:#151e28;
}
.home-stat span{
  color:#707d89;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
}
.home-stat strong{
  display:block;
  margin-top:5px;
  font-size:18px;
}
.home-chart{
  height:160px;
  margin-top:10px;
  padding:13px;
  border:1px solid #25313d;
  border-radius:11px;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    #151e28;
  background-size:100% 34px;
  overflow:hidden;
}
.home-chart svg{
  width:100%;
  height:100%;
}
.home-chart-path{
  stroke-dasharray:600;
  stroke-dashoffset:600;
  animation:homeChartDraw 1.8s .25s cubic-bezier(.2,.8,.2,1) forwards;
}
.home-chart-area{
  opacity:0;
  animation:homeChartArea .9s 1s ease forwards;
}
@keyframes homeChartDraw{to{stroke-dashoffset:0}}
@keyframes homeChartArea{to{opacity:1}}

.public-features{
  max-width:1240px;
  margin:0 auto;
  padding:18px 24px 82px;
}
.public-section-head{
  max-width:680px;
  margin-bottom:20px;
}
.public-section-head span{
  color:#ce4b53;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.public-section-head h2{
  margin:7px 0 0;
  font:800 31px "Manrope","Inter",sans-serif;
  letter-spacing:-.035em;
}
.public-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.public-feature{
  min-height:190px;
  padding:19px;
  border:1px solid #26323e;
  border-radius:15px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),transparent),
    #151e28;
  transition:.18s ease;
}
.public-feature:hover{
  transform:translateY(-4px);
  border-color:#3a4856;
}
.public-feature .case-emoji{
  color:#d7575e!important;
}
.public-feature h3{
  margin:15px 0 7px;
  font-size:15px;
}
.public-feature p{
  margin:0;
  color:#8895a2;
  font-size:12px;
  line-height:1.7;
}
.public-footer{
  max-width:1240px;
  margin:0 auto;
  padding:24px;
  border-top:1px solid #202b35;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.public-footer strong{
  font-size:13px;
}
.public-footer span,
.public-footer a{
  color:#6f7d8a;
  font-size:10px;
}
.public-footer-links{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.public-footer a:hover{color:#c8d0d8}

@media(max-width:980px){
  .public-nav-links{display:none}
  .public-hero{grid-template-columns:1fr;padding-top:58px}
  .home-window{transform:none}
  .public-feature-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .public-nav{padding:0 15px}
  .public-brand span{display:none}
  .public-hero{padding-left:15px;padding-right:15px}
  .public-hero h1{font-size:44px}
  .home-stat-grid{grid-template-columns:1fr 1fr}
  .public-features{padding-left:15px;padding-right:15px}
}


.role-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}.role-choice{position:relative;display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid var(--stroke);border-radius:12px;background:rgba(255,255,255,.018);cursor:pointer;transition:.18s ease}.role-choice:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--brand) 48%,var(--stroke))}.role-choice input{position:absolute;opacity:0;pointer-events:none}.role-choice .role-dot{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.035)}.role-choice span:nth-of-type(2){display:flex;flex-direction:column;min-width:0}.role-choice strong{font-size:13px}.role-choice small{font-size:10px;color:var(--muted)}.role-choice i{margin-left:auto;font-style:normal;opacity:0;color:#5ee6a8}.role-choice:has(input:checked){background:color-mix(in srgb,var(--brand) 10%,var(--surface));border-color:color-mix(in srgb,var(--brand) 58%,var(--stroke))}.role-choice:has(input:checked) i{opacity:1}.embed-field-row{display:grid;grid-template-columns:1fr 1.3fr auto;gap:10px;align-items:end;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}.mini-check{height:44px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid var(--stroke);border-radius:10px;background:var(--surface)}.discord-preview.embed-live{position:relative;display:flex;overflow:hidden;padding:0!important}.embed-live-bar{width:4px;background:#c9333d;flex:0 0 4px}.embed-live-body{padding:15px 16px;width:100%;min-width:0}.embed-live-author{font-size:11px;font-weight:700;color:#dce5ef;margin-bottom:5px}.embed-live-body h3{margin:0 0 8px;font-size:16px}.embed-live-body p{white-space:pre-wrap;color:#c6d0dc;margin:0 0 12px}.embed-live-footer{margin-top:14px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06);font-size:10px;color:var(--muted)}
