
:root{
  color-scheme:dark;
  --bg:#070909;
  --bg-soft:#0b0e0d;
  --panel:#101513;
  --panel-2:#0c100f;
  --panel-hover:#141b18;
  --line:#26312c;
  --line-strong:#3d5147;
  --text:#e7eee9;
  --muted:#83918a;
  --muted-2:#5e6b65;
  --signal:#a8c5b2;
  --signal-bright:#d7e7dc;
  --signal-dim:rgba(168,197,178,.09);
  --good:#91b79b;
  --warn:#c8ae75;
  --bad:#cc776e;
  --shadow:0 24px 70px rgba(0,0,0,.28);
  --mono:"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-family:var(--sans);
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;min-height:100vh;color:var(--text);
  background:
    radial-gradient(circle at 18% -10%,rgba(109,145,122,.12),transparent 36rem),
    radial-gradient(circle at 100% 40%,rgba(82,109,94,.06),transparent 30rem),
    linear-gradient(rgba(7,9,9,.975),rgba(7,9,9,.995)),
    repeating-linear-gradient(0deg,transparent,transparent 4px,rgba(255,255,255,.012) 5px);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:100;
  background:linear-gradient(90deg,transparent 49.8%,rgba(255,255,255,.007) 50%,transparent 50.2%);
  opacity:.45;
}
::selection{background:rgba(168,197,178,.24);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#090c0b}
::-webkit-scrollbar-thumb{background:#29352f;border:2px solid #090c0b}

.shell{width:min(1520px,calc(100% - 42px));margin:auto;padding:30px 0 24px}
.hero{
  display:flex;align-items:end;justify-content:space-between;gap:28px;
  border:1px solid var(--line);border-left:3px solid var(--signal);
  padding:24px 26px;margin-bottom:14px;position:relative;overflow:hidden;
  background:linear-gradient(120deg,rgba(20,27,24,.96),rgba(9,12,11,.97));box-shadow:var(--shadow)
}
.hero:after{content:"DS // 01";position:absolute;right:25%;top:-15px;font:800 7rem/1 var(--mono);letter-spacing:-.08em;color:rgba(255,255,255,.018);pointer-events:none}
h1,h2,h3,p{margin-top:0}
h1{font:800 clamp(2.65rem,6vw,5.3rem)/.86 var(--sans);letter-spacing:-.065em;margin:0 0 13px;text-transform:uppercase}
h2{font-size:1.2rem;letter-spacing:-.02em;margin-bottom:15px}
h3{font-size:.96rem;margin-bottom:6px}
.subtitle,.muted,.hint,footer{color:var(--muted)}
.subtitle{margin:0;font-size:.86rem;letter-spacing:.035em}
.eyebrow{color:var(--signal);letter-spacing:.2em;font:800 .66rem/1.35 var(--mono);margin-bottom:9px;text-transform:uppercase}
.owner-line{margin:.15rem 0 .45rem;letter-spacing:.16em;font:700 .7rem/1.4 var(--mono);color:var(--muted);text-transform:uppercase}
.owner-line strong{font-weight:800;color:var(--signal-bright)}
.connection-stack{display:flex;flex-direction:column;align-items:flex-end;gap:.42rem;min-width:170px}
.node-label{font:700 .57rem/1 var(--mono);letter-spacing:.18em;color:var(--muted-2)}
.signed-in{font:700 .65rem/1.35 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right;max-width:280px}
.status{border:1px solid var(--line-strong);padding:9px 13px;font:800 .67rem/1 var(--mono);letter-spacing:.14em;min-width:112px;text-align:center;background:#090c0b;color:var(--muted)}
.status:before{content:"●";margin-right:8px;font-size:.72rem;color:var(--bad)}
.status.online{color:var(--signal-bright);border-color:#60796b;background:rgba(92,125,106,.08)}
.status.online:before{color:var(--good);text-shadow:0 0 12px rgba(145,183,155,.55)}

.card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(17,22,20,.98),rgba(10,13,12,.98));box-shadow:var(--shadow)}
.login{max-width:780px;margin:70px auto 90px;padding:30px;border-top:2px solid var(--signal);position:relative}
.login:before{content:"AUTHORIZATION REQUIRED";position:absolute;right:20px;top:17px;color:var(--muted-2);font:700 .55rem/1 var(--mono);letter-spacing:.16em}
.login .row{margin-top:6px}
.oauth-login,.password-login{margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}
.password-login input{margin-bottom:10px}
.password-login button{margin-top:4px}
.oauth-hint{font:600 .62rem/1.5 var(--mono);margin:12px 0 0;word-break:break-all}

/* Desktop command-console layout */
#app{display:grid;grid-template-columns:230px minmax(0,1fr);grid-template-rows:auto 1fr;gap:12px 14px;align-items:start}
#app.hidden{display:none!important}
.metrics{grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(6,minmax(105px,1fr));gap:8px;margin:0}
.tabs{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column;overflow:visible;margin:0;position:sticky;top:16px;padding:9px 0;box-shadow:var(--shadow)}
.tabs:before{content:"NAVIGATION // DS-01";padding:9px 15px 13px;color:var(--muted-2);font:800 .57rem/1 var(--mono);letter-spacing:.16em;border-bottom:1px solid var(--line);margin-bottom:4px}
.tabs button{position:relative;border:0;border-left:2px solid transparent;border-bottom:1px solid rgba(38,49,44,.55);background:transparent;color:var(--muted);white-space:nowrap;padding:12px 16px;text-align:left;font:750 .71rem/1.1 var(--mono);letter-spacing:.07em;text-transform:uppercase;transition:.15s ease}
.tabs button:before{content:">";display:inline-block;width:18px;color:var(--muted-2)}
.tabs button:hover{background:rgba(168,197,178,.045);color:var(--text);filter:none}
.tabs button.active{background:linear-gradient(90deg,rgba(168,197,178,.12),transparent);color:var(--signal-bright);border-left-color:var(--signal)}
.tabs button.active:before{content:"■";color:var(--signal);font-size:.55rem}
.tab{display:none;grid-column:2;grid-row:2;min-width:0}
.tab.active{display:block}

.metric{padding:13px 14px;min-height:82px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;box-shadow:none}
.metric:after{content:"";position:absolute;right:-18px;bottom:-22px;width:58px;height:58px;border:1px solid rgba(168,197,178,.08);transform:rotate(45deg)}
.metric span{font:800 .57rem/1 var(--mono);letter-spacing:.13em;color:var(--muted);text-transform:uppercase}
.metric strong{font:800 1.45rem/1 var(--mono);color:var(--signal-bright)}

.panel{padding:19px;position:relative;box-shadow:none}
.panel:before{content:"";position:absolute;left:-1px;top:-1px;width:22px;height:2px;background:var(--signal)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.space{margin-top:12px}
.section-heading{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}
.section-heading h2{margin-bottom:0}
.row,.actions{display:flex;gap:8px;align-items:center}
.row input{flex:1}

label{display:block;color:var(--muted);font:700 .68rem/1.35 var(--mono);letter-spacing:.045em;margin:12px 0 7px;text-transform:uppercase}
input,select,textarea,button,.button{border:1px solid var(--line);border-radius:0;background:#080b0a;color:var(--text);font:inherit}
input,select,textarea{width:100%;padding:10px 11px;outline:none;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
input:focus,select:focus,textarea:focus{border-color:#657c6f;background:#0b100e;box-shadow:inset 2px 0 0 var(--signal)}
input::placeholder,textarea::placeholder{color:#53605a}
textarea{resize:vertical;min-height:90px;line-height:1.45}
button,.button{cursor:pointer;width:auto;padding:9px 13px;font:800 .67rem/1 var(--mono);text-transform:uppercase;letter-spacing:.075em;background:var(--signal-bright);color:#101512;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:35px;transition:.15s ease}
button:hover,.button:hover{filter:none;background:#edf5ef;box-shadow:0 0 0 1px rgba(215,231,220,.16),0 0 22px rgba(168,197,178,.08)}
button:active,.button:active{transform:translateY(1px)}
button.secondary{background:transparent;color:var(--text)}
button.secondary:hover{background:var(--signal-dim);border-color:var(--line-strong)}
button.danger{background:transparent;color:#e4a39c;border-color:#693f3a}
button.danger:hover{background:rgba(204,119,110,.08);border-color:#945850}
.logout-button{padding:.42rem .72rem;font-size:.62rem;min-height:auto;min-width:auto;background:transparent;color:var(--muted)}

.stack{display:grid;gap:8px}
.item{border:1px solid var(--line);padding:12px 13px;background:rgba(0,0,0,.12);position:relative}
.item:hover{border-color:#34423b;background:rgba(168,197,178,.025)}
.item:before{content:"";position:absolute;left:-1px;top:12px;bottom:12px;width:1px;background:rgba(168,197,178,.28)}
.item-head{display:flex;gap:10px;justify-content:space-between;align-items:start}
.meta{color:var(--muted);font:600 .68rem/1.4 var(--mono)}
.body{white-space:pre-wrap;color:#c8d2cc;font-size:.84rem;line-height:1.55;margin-top:8px}
.badge{font:800 .57rem/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;border:1px solid var(--line);padding:5px 7px;color:var(--muted)}
.badge.good{color:var(--good);border-color:rgba(145,183,155,.38);background:rgba(145,183,155,.055)}
.badge.warn{color:var(--warn);border-color:rgba(200,174,117,.38);background:rgba(200,174,117,.055)}
.badge.bad{color:var(--bad);border-color:rgba(204,119,110,.38);background:rgba(204,119,110,.055)}
.actions{flex-wrap:wrap;margin-top:10px}
.actions button{padding:7px 9px;font-size:.59rem;min-height:30px}
.scroll{max-height:650px;overflow:auto}
.check{display:flex;gap:8px;align-items:center;color:var(--text);font-family:var(--sans);text-transform:none;letter-spacing:0}
.check input{width:auto;accent-color:#8eaa99}
.form-row{display:grid;grid-template-columns:1fr 105px 90px auto auto;gap:6px;align-items:center}
.rank-row{display:grid;grid-template-columns:1fr 1.5fr auto;gap:7px}
hr{border:0;border-top:1px solid var(--line);margin:22px 0}

/* Modal / dossier */
.modal{position:fixed;inset:0;background:rgba(1,3,2,.86);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:20}
.modal-card{width:min(760px,100%);max-height:90vh;overflow:auto;padding:22px;border-top:2px solid var(--signal);box-shadow:0 30px 100px #000}
.modal-card>.section-heading{padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:13px}
.modal-card>.section-heading h2:before{content:"DS // ";color:var(--signal);font:800 .62rem/1 var(--mono);letter-spacing:.12em}
.hidden{display:none!important}
#toast{position:fixed;right:20px;bottom:20px;max-width:390px;background:#d9e5dc;color:#101310;padding:11px 15px;display:none;font:800 .69rem/1.35 var(--mono);letter-spacing:.035em;z-index:30;box-shadow:0 15px 45px #000;border-left:3px solid #738e7d}
#toast.error{background:#d59a93;border-left-color:#8d4f49}

/* Personnel dossier */
.member-profile-card{display:grid;gap:1rem}
.profile-identity{padding:3px 0 15px;border-bottom:1px solid var(--line);position:relative}
.profile-identity:after{content:"PERSONNEL // AUTHORIZED VIEW";position:absolute;right:0;top:2px;color:var(--muted-2);font:700 .52rem/1 var(--mono);letter-spacing:.12em}
.profile-identity h2{margin:.15rem 0 .5rem;font-size:1.85rem;letter-spacing:-.035em;text-transform:uppercase}
.profile-badges,.profile-chips{display:flex;gap:.45rem;flex-wrap:wrap}
.profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.profile-stat{padding:.78rem;border:1px solid var(--line);border-radius:0;background:rgba(168,197,178,.025);min-height:80px}
.profile-stat span{display:block;font:800 .56rem/1 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:.42rem}
.profile-stat strong{display:block;font:750 .94rem/1.25 var(--mono);color:var(--signal-bright)}
.profile-stat small{display:block;margin-top:.25rem;color:var(--muted);font-size:.67rem}
.profile-section{padding-top:.35rem}
.profile-section h3{margin:0 0 .65rem;font:800 .67rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--signal)}
.profile-chip{display:inline-block;padding:.38rem .58rem;border:1px solid var(--line);border-radius:0;font:700 .71rem/1 var(--mono);background:rgba(168,197,178,.035)}
.profile-row{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:1px solid rgba(38,49,44,.8)}
.profile-row span{color:var(--muted);text-align:right;font-size:.76rem}
.officer-only{border-left:2px solid var(--warn);padding:.75rem .8rem;background:rgba(200,174,117,.035)}

.achievement-card{width:100%;text-align:left;display:flex;justify-content:space-between;gap:12px;align-items:center;background:transparent;color:var(--text)}
.achievement-card span{opacity:.65;font-size:.8em}
.achievement-members{max-height:420px;overflow:auto;border:1px solid var(--line);padding:8px;margin-bottom:12px}
.member-check{display:flex;gap:8px;align-items:center;padding:7px;margin:0;border-bottom:1px solid var(--line)}
.member-check:last-child{border-bottom:0}
#taskEditor textarea{min-height:180px}
.permission-hidden{display:none!important}
.access-permissions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin:.75rem 0 1rem}
.permission-check{display:flex;gap:.5rem;align-items:center;padding:.55rem .65rem;border:1px solid var(--line);border-radius:0;background:rgba(168,197,178,.02)}
.permission-check input{width:auto;margin:0;accent-color:#8eaa99}
footer{text-align:center;padding-top:18px;font:700 .57rem/1.4 var(--mono);letter-spacing:.13em;color:var(--muted-2)}

@media(max-width:1180px){
  #app{grid-template-columns:195px minmax(0,1fr)}
  .metrics{grid-template-columns:repeat(3,1fr)}
  .three{grid-template-columns:1fr}
}
@media(max-width:860px){
  .shell{width:min(100% - 24px,1200px);padding-top:16px}
  .hero{align-items:flex-start;flex-direction:column;padding:20px}
  .connection-stack{align-items:flex-start}.signed-in{text-align:left}
  #app{display:block}
  .tabs{position:static;display:flex;flex-direction:row;overflow:auto;margin-bottom:12px;padding:0}
  .tabs:before{display:none}
  .tabs button{border-left:0;border-right:1px solid var(--line);border-bottom:0;padding:12px 13px}
  .tabs button:before{display:none}
  .tabs button.active{border-left:0;border-bottom:2px solid var(--signal);background:rgba(168,197,178,.08)}
  .metrics{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:12px}
  .two{grid-template-columns:1fr}
}
@media(max-width:600px){
  .shell{width:calc(100% - 16px)}
  h1{font-size:2.55rem}
  .hero:after{display:none}
  .login{margin:24px 0;padding:20px}
  .login:before{display:none}
  .metrics{grid-template-columns:repeat(2,1fr)}
  .row{flex-direction:column;align-items:stretch}
  .form-row,.rank-row{grid-template-columns:1fr}
  .item-head{flex-direction:column}
  .profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-row{display:block}.profile-row span{display:block;text-align:left;margin-top:.15rem}
  .profile-identity:after{display:none}
  .access-permissions{grid-template-columns:1fr}
}

/* v1.6 Treasury test */
.treasury-metrics h2{font-size:1.8rem;margin:.25rem 0}
#treasuryLedger .body{white-space:pre-line}

#maintenanceBanner{margin:12px 0;padding:12px 16px;border:1px solid currentColor}
#featureControls{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin:12px 0 16px}
.quick-language{display:flex;align-items:center;gap:8px;font:700 .58rem/1 var(--mono);letter-spacing:.12em;color:var(--muted);z-index:2}
.quick-language select{width:auto;min-width:145px;margin:0;padding:7px 28px 7px 9px;font-size:.7rem}
.announcement-language{border:1px solid var(--line);padding:14px;background:rgba(0,0,0,.12)}
.announcement-language.primary{border-left:3px solid var(--signal)}
.announcement-language h3{margin-bottom:4px}.announcement-language textarea{margin-top:8px}
.channel-route{display:grid;grid-template-columns:minmax(140px,1fr) minmax(220px,2fr);gap:12px;align-items:center}
@media(max-width:700px){.channel-route{grid-template-columns:1fr}.quick-language{align-items:flex-start;flex-direction:column}}


/* v3.0.1 customer support */
.support-contact{grid-column:2;grid-row:auto;min-width:0;width:100%;margin-top:18px;padding:16px 18px;display:flex;justify-content:space-between;gap:18px;align-items:center;border-left:3px solid var(--signal)}
.support-contact p{margin:.25rem 0 0}.support-contact strong{font:800 .9rem/1.2 var(--mono);letter-spacing:.04em;text-transform:uppercase}
.support-filters{max-width:260px;margin-bottom:14px}.support-ticket .body{white-space:normal;line-height:1.55;margin:10px 0}.support-ticket .officer-only{margin:10px 0}
@media(max-width:860px){.support-contact{grid-column:auto;width:100%}}
@media(max-width:700px){.support-contact{align-items:stretch;flex-direction:column}.support-contact button{width:100%}}

.network-guild-card{display:grid;gap:.85rem}.network-entitlements{border-top:1px solid var(--line);padding-top:.85rem}.network-entitlements .access-permissions{margin-top:.55rem}.permission-check small{margin-left:auto;font-size:.68rem;letter-spacing:.08em;opacity:.72}.permission-check.staged{opacity:.72}.permission-check.locked{opacity:.78}.permission-check.locked input{cursor:not-allowed}


.achievement-sort-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.achievement-sort-row.selected{border-color:#657c6f}
.achievement-sort-actions{white-space:nowrap}
.achievement-sort-actions button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:700px){.achievement-sort-row{grid-template-columns:1fr}.achievement-sort-actions{justify-content:flex-end}}

.workspace-access-check{display:flex;align-items:center;gap:8px}.workspace-access-check input{width:auto;margin:0}.workspace-access-check small{margin-left:auto;color:var(--muted-2)}


/* v3.1.11 compact network registry */
.network-summary{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 16px}
.network-summary span{border:1px solid var(--line);padding:7px 10px;font:700 .66rem/1 var(--mono);letter-spacing:.06em;color:var(--muted)}
.network-summary strong{color:var(--text);margin-right:4px}
.network-summary-alert{border-color:#7d4c4c!important}
.network-server-list{display:grid;gap:6px}
.network-server-row{display:grid;grid-template-columns:minmax(220px,1fr) auto 90px auto;gap:10px;align-items:center;border:1px solid var(--line);background:rgba(0,0,0,.12);padding:10px 12px}
.network-server-row.selected{border-color:var(--signal);background:rgba(86,116,94,.10)}
.network-server-identity{display:flex;min-width:0;flex-direction:column;gap:4px}
.network-server-identity strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.network-server-plan{font:700 .65rem/1 var(--mono);letter-spacing:.08em;color:var(--muted);text-align:center}
.network-detail-heading{display:flex;align-items:center;gap:8px}
.network-disconnected-warning{border:1px solid #7d4c4c;border-left:3px solid #9d5f5f;padding:12px 14px;margin:8px 0 14px;background:rgba(120,50,50,.08)}
.network-disconnected-warning strong{font:800 .75rem/1 var(--mono);letter-spacing:.1em}
.network-disconnected-warning p{margin:.45rem 0;line-height:1.45}
#networkGuildDetail .network-entitlements{margin-top:14px}
@media(max-width:760px){
  .network-server-row{grid-template-columns:minmax(0,1fr) auto}
  .network-server-plan{display:none}
  .network-server-row button{grid-column:1/-1;width:100%}
  .network-detail-heading{align-items:flex-end;flex-direction:column}
}

.network-danger-zone{margin-top:18px;padding:14px;border:1px solid #7d4c4c;background:rgba(120,50,50,.06)}
.network-danger-zone h3{margin:.25rem 0 .5rem}.danger-action{border-color:#8b4f4f!important}

/* v3.2.0 customer identity user directory */
.user-directory-tools{display:grid;grid-template-columns:minmax(220px,1fr) 220px 220px;gap:10px;margin:14px 0}
.user-directory-row .meta{margin-top:4px}
@media(max-width:860px){.user-directory-tools{grid-template-columns:1fr}}

/* v3.2.1 subscriptions and server slots */
.user-directory-row .actions{flex-wrap:wrap}

/* v3.2.5 customer onboarding */
.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}

.login-result{min-height:1.25rem;margin:.55rem 0 0;font-size:.9rem}.login-result.error{font-weight:700}.login-result.success{font-weight:700}


/* v3.2.12 account portal */
.portal-hero{margin-bottom:16px}
.portal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.portal-card{display:flex;flex-direction:column;min-height:210px}
.portal-card h3{margin:.2rem 0 .5rem}
.portal-card .portal-actions{margin-top:auto;padding-top:18px;display:flex;gap:8px;flex-wrap:wrap}
.portal-server-list{display:grid;gap:10px;margin-top:12px}
.portal-server-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);background:rgba(255,255,255,.015)}
.portal-server-row .meta{overflow-wrap:anywhere}
.portal-server-row button{white-space:nowrap}
@media(max-width:700px){.portal-server-row{align-items:flex-start;flex-direction:column}.portal-server-row button{width:100%}}

.mode-hidden{display:none!important}
#managementModeBanner{margin-bottom:14px}


/* v3.2.15 compact plan catalogue */
.plan-manager{min-height:420px}
.plan-summary{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:8px;margin:18px 0 12px}
.plan-summary>div{border:1px solid var(--line);background:rgba(0,0,0,.12);padding:11px 13px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.plan-summary span{font:800 .58rem/1.2 var(--mono);letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.plan-summary strong{font:800 1rem/1 var(--mono);color:var(--signal-bright)}
.plan-toolbar{display:grid;grid-template-columns:minmax(260px,1fr) 190px;gap:10px;align-items:end;margin-bottom:12px;padding:10px 12px;border:1px solid var(--line);background:rgba(0,0,0,.1)}
.plan-toolbar label{margin:0}
.plan-toolbar input,.plan-toolbar select{margin-top:7px}
.plan-list{display:grid;gap:7px}
.plan-row{border:1px solid var(--line);background:rgba(0,0,0,.12)}
.plan-row:hover{border-color:var(--line-strong);background:rgba(168,197,178,.025)}
.plan-row-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 14px}
.plan-identity{min-width:0}
.plan-title-line{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.plan-title-line strong{font-size:.94rem}
.plan-description{margin:7px 0 0;line-height:1.45;max-width:900px}
.plan-row-actions{display:flex;gap:7px;align-items:center;white-space:nowrap}
.plan-feature-details{border-top:1px solid var(--line);padding:10px 14px;background:rgba(0,0,0,.13)}
.plan-feature-list{display:flex;gap:6px;flex-wrap:wrap}
.plan-editor-grid{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(320px,1.2fr);gap:18px}
.plan-feature-heading{align-items:flex-end;margin-top:7px}
.plan-feature-heading label{margin:0 0 4px}
.plan-feature-heading .hint{margin:0}
.plan-feature-picker{max-height:370px;overflow:auto;padding-right:4px}
.plan-feature-option{margin:0}
.plan-editor-actions{justify-content:flex-end;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
@media(max-width:900px){
  .plan-summary{grid-template-columns:repeat(2,1fr)}
  .plan-toolbar,.plan-editor-grid{grid-template-columns:1fr}
  .plan-row-main{grid-template-columns:1fr}
  .plan-row-actions{flex-wrap:wrap}
  .plan-row-actions button{flex:1}
}
@media(max-width:560px){.plan-summary{grid-template-columns:1fr}.plan-row-actions{display:grid;grid-template-columns:1fr 1fr}.plan-row-actions .danger{grid-column:1/-1}}


/* v3.2.17 customer plan catalogue */
.customer-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch}
.customer-plan-card{border:1px solid var(--line);background:rgba(0,0,0,.18);padding:18px;display:flex;flex-direction:column;min-height:440px;position:relative;overflow:hidden}
.customer-plan-card:hover{border-color:var(--line-strong)}
.customer-plan-card.current{box-shadow:inset 0 0 0 1px var(--line-strong)}
.customer-plan-card.free-plan:before,.customer-plan-card.paid-plan:before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--line-strong)}
.customer-plan-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.customer-plan-top h3{font-size:1.25rem;margin:.3rem 0 .2rem}
.plan-tier-label{font-size:.68rem;letter-spacing:.12em;color:var(--muted)}
.customer-plan-price{font-size:1.55rem;font-weight:800;letter-spacing:.02em;margin:.7rem 0}
.customer-plan-slots{padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:8px 0 12px}
.customer-plan-features{display:grid;gap:7px;margin-bottom:16px}
.customer-feature{font-size:.88rem;padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.06)}
.customer-plan-action{margin-top:auto;padding-top:12px}
.customer-plan-action button{width:100%}
@media(max-width:1000px){.customer-plan-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.customer-plan-grid{grid-template-columns:1fr}.customer-plan-card{min-height:auto}}
