:root{
  /* Core interface palette */
  --dmc-blue:#0000A0;
  --dmc-blue-hi:#0000F8;
  --dmc-green:#18B820;
  --dmc-gold:#F8B038;

  --bg:#070814;
  --bg2:#04050C;
  --panel:#0B1026;
  --panel2:#0E1736;
  --text:#E7ECFF;
  --muted:rgba(231,236,255,.72);
  --faint:rgba(231,236,255,.55);
  --border:rgba(231,236,255,.12);
  --border2:rgba(231,236,255,.18);
  --shadow: 0 18px 40px rgba(0,0,0,.45);

  --radius:16px;
  --radius-sm:12px;

  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --sans: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";

  /* Brand assets (can be overridden inline by layout.php) */
  --header-bg: url('brand/header.jpg');
}

/* Theme presets (selected by html[data-theme="..."]) */
html[data-theme="default"]{
  --bg:#070814;
  --bg2:#04050C;
  --panel:#0B1026;
  --panel2:#0E1736;
  --text:#E7ECFF;
  --muted:rgba(231,236,255,.72);
  --faint:rgba(231,236,255,.55);
  --border:rgba(231,236,255,.12);
  --border2:rgba(231,236,255,.18);
  --dmc-blue:#7abcff;
  --dmc-blue-hi:#a6d7ff;
  --dmc-green:#66d6ff;
  --dmc-gold:#f6c15c;
}

html[data-theme="crucible"]{
  --bg:#030d1d;
  --bg2:#061224;
  --panel:#09182b;
  --panel2:#0d2039;
  --text:#eef8ff;
  --muted:rgba(238,248,255,.74);
  --faint:rgba(238,248,255,.56);
  --border:rgba(127,216,255,.16);
  --border2:rgba(174,223,255,.24);
  --dmc-blue:#7fd8ff;
  --dmc-blue-hi:#b7edff;
  --dmc-green:#63f0ff;
  --dmc-gold:#f3d37b;
}

html[data-theme="neon"]{
  --bg:#140805;
  --bg2:#1c0d08;
  --panel:#25100a;
  --panel2:#31140d;
  --text:#fff2e6;
  --muted:rgba(255,242,230,.74);
  --faint:rgba(255,242,230,.56);
  --border:rgba(255,174,68,.16);
  --border2:rgba(255,210,127,.24);
  --dmc-blue:#ffae44;
  --dmc-blue-hi:#ffd27f;
  --dmc-green:#ff9047;
  --dmc-gold:#ffe1a3;
}

html[data-theme="dashboard"]{
  --bg:#060b14;
  --bg2:#0a1220;
  --panel:#0c1524;
  --panel2:#132035;
  --text:#edf6ff;
  --muted:rgba(237,246,255,.74);
  --faint:rgba(237,246,255,.56);
  --border:rgba(120,205,255,.16);
  --border2:rgba(82,247,255,.24);
  --dmc-blue:#78cdff;
  --dmc-blue-hi:#52f7ff;
  --dmc-green:#66d8ff;
  --dmc-gold:#9fe9ff;
}

html[data-theme="combat"]{
  --bg:#120906;
  --bg2:#1e0f0a;
  --panel:#1b0f0b;
  --panel2:#26120d;
  --text:#fff0e7;
  --muted:rgba(255,240,231,.74);
  --faint:rgba(255,240,231,.56);
  --border:rgba(255,182,92,.16);
  --border2:rgba(255,118,56,.24);
  --dmc-blue:#ffb65c;
  --dmc-blue-hi:#ffc78b;
  --dmc-green:#ff8f50;
  --dmc-gold:#ffd28a;
}

html[data-theme="station"]{
  --bg:#051014;
  --bg2:#08181d;
  --panel:#0a171c;
  --panel2:#102128;
  --text:#ebfbff;
  --muted:rgba(235,251,255,.74);
  --faint:rgba(235,251,255,.56);
  --border:rgba(90,238,222,.16);
  --border2:rgba(191,242,255,.22);
  --dmc-blue:#5aeede;
  --dmc-blue-hi:#bff2ff;
  --dmc-green:#7ef1dd;
  --dmc-gold:#8fdfff;
}

html[data-theme="custom"]{
  --bg:#070814;
  --bg2:#04050C;
  --panel:#0B1026;
  --panel2:#0E1736;
  --text:#E7ECFF;
  --muted:rgba(231,236,255,.72);
  --faint:rgba(231,236,255,.56);
  --border:rgba(231,236,255,.12);
  --border2:rgba(231,236,255,.18);
  --dmc-blue:#7abcff;
  --dmc-blue-hi:#a6d7ff;
  --dmc-green:#66d6ff;
  --dmc-gold:#f6c15c;
}

html[data-theme="default"] body{
  background:
    radial-gradient(1200px 700px at 10% 0%, rgba(122,188,255,.16), transparent 55%),
    radial-gradient(900px 600px at 90% 5%, rgba(246,193,92,.12), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
html[data-theme="crucible"] body{
  background:
    radial-gradient(1100px 700px at 14% 0%, rgba(255,120,60,.16), transparent 55%),
    radial-gradient(900px 650px at 88% 8%, rgba(255,194,107,.12), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
html[data-theme="neon"] body,
html[data-theme="dashboard"] body{
  background:
    radial-gradient(1200px 700px at 12% 0%, rgba(102,227,255,.16), transparent 55%),
    radial-gradient(900px 650px at 88% 8%, rgba(82,247,255,.10), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
html[data-theme="combat"] body{
  background:
    radial-gradient(1200px 700px at 12% 0%, rgba(255,182,92,.17), transparent 55%),
    radial-gradient(900px 650px at 88% 8%, rgba(255,118,56,.10), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
html[data-theme="station"] body{
  background:
    radial-gradient(1200px 700px at 12% 0%, rgba(90,238,222,.15), transparent 55%),
    radial-gradient(900px 650px at 88% 8%, rgba(191,242,255,.10), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}

/* Light theme polish */
html[data-theme="light"] body{
  background:
    radial-gradient(1200px 700px at 10% 0%, rgba(37,99,235,.12), transparent 55%),
    radial-gradient(900px 600px at 90% 5%, rgba(34,197,94,.10), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
html[data-theme="light"] a{color:rgba(11,18,32,.86)}
html[data-theme="light"] a:hover{color:#000}
html[data-theme="light"] .topnav__link{border-color:rgba(11,18,32,.18); background:rgba(255,255,255,.62); color:rgba(11,18,32,.86)}
html[data-theme="light"] .topnav__link:hover{background:rgba(255,255,255,.78)}
html[data-theme="light"] .card{background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72))}
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="date"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] textarea,
html[data-theme="light"] select{background:rgba(255,255,255,.85)}
html[data-theme="light"] .table th{background:rgba(255,255,255,.86)}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:linear-gradient(180deg, var(--bg), var(--bg2));
}

a{color:rgba(231,236,255,.92); text-decoration:none}
a:hover{color:#fff; text-decoration:underline}

.container{max-width:1120px; margin:0 auto; padding:0 18px}
.content{padding:26px 18px 30px}

/* Top bar */
.topbar{position:relative; overflow:hidden; border-bottom:1px solid rgba(0,0,0,.35)}
.topbar__bg{
  position:absolute; inset:0;
  background-image: var(--header-bg);
  background-size:cover;
  background-position:left center;
  filter:saturate(1.05) contrast(1.05);
  transform:scale(1.02);
}
.topbar__bg::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.58), rgba(0,0,0,.22) 55%, rgba(0,0,0,.62)),
    linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.35));
}

.topbar__inner{position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0}

.brandmark{display:flex; align-items:center; gap:12px; min-width:0}
.brandmark__logo{
  width:44px; height:44px;
  border-radius:10px;
  box-shadow: 0 10px 22px rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.25);
  flex:0 0 auto;
}
.brandmark__text{min-width:0}
.brandmark__org{font-weight:800; letter-spacing:.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.brandmark__app{color:rgba(231,236,255,.78); font-size:.92rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.topnav{display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end}
.topnav__link{
  font-family:var(--mono);
  font-size:.82rem;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.28);
  color:rgba(231,236,255,.88);
  backdrop-filter: blur(6px);
}
.topnav__link:hover{background:rgba(0,0,0,.42); text-decoration:none}

/* Nav strip (buttons BELOW header banner) */
.navstrip{position:relative; z-index:40; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.25));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.navstrip__inner{display:flex; align-items:center; justify-content:flex-start; gap:12px; padding:10px 0}
.navstrip__left,.navstrip__right{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.navstrip__left{flex:1; justify-content:center}
.navstrip__right{flex:0 0 auto; margin-left:auto}
@media(max-width:720px){.navstrip__inner{flex-wrap:wrap}.navstrip__left{flex:1 1 100%; justify-content:center}.navstrip__right{width:100%; justify-content:center; margin-left:0}}


/* Reusable pill buttons (used in hero + nav strip) */
.pill{display:inline-flex; align-items:center; justify-content:center; padding:7px 12px; border-radius:999px;
  border:1px solid rgba(255,255,255,.18); background:rgba(0,0,0,.28); color:var(--text);
  text-decoration:none; font-weight:800; font-size:13px; letter-spacing:.2px;
}
.pill:hover{background:rgba(0,0,0,.40); border-color:rgba(255,255,255,.28)}

/* Dropdown menus in nav strip */
.dd{position:relative}
.dd > summary{list-style:none; cursor:pointer}
.dd > summary::-webkit-details-marker{display:none}
.dd[open] > summary{border-color:rgba(255,255,255,.34); background:rgba(0,0,0,.42)}
.dd__menu{position:absolute; right:0; top:calc(100% + 8px); min-width:200px;
  background:rgba(10,14,22,.92); border:1px solid rgba(255,255,255,.12);
  border-radius:14px; padding:8px; box-shadow: 0 18px 55px rgba(0,0,0,.55);
}
.dd__menu a{display:block; padding:10px 10px; border-radius:12px; color:var(--text); text-decoration:none; font-weight:700}
.dd__menu a:hover{background:rgba(255,255,255,.08)}
.dd__menu--wide{min-width:250px; max-width:300px}
.dd__label{padding:6px 10px 4px; font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--faint); font-weight:900}
.dd__divider{height:1px; margin:6px 4px; background:rgba(255,255,255,.08)}

/* Admin shell */
.admin-shell-head{display:flex; flex-direction:column; gap:12px; margin:0 0 16px}
.admin-shell-head__title{margin:0; font-size:1.7rem}
.admin-shell-head__intro{margin:0; color:var(--muted)}
.admin-subnav{display:flex; gap:8px; flex-wrap:wrap; padding:10px 12px; border-radius:16px; border:1px solid var(--border); background:rgba(0,0,0,.18)}
.admin-subnav__link{display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:var(--text); text-decoration:none; font-weight:800; font-size:13px}
.admin-subnav__link:hover{background:rgba(255,255,255,.08); text-decoration:none}
.admin-subnav__link.is-active{background:#fff; color:#111; border-color:#fff}

.settings-shell{display:grid; grid-template-columns:minmax(0,1fr); gap:14px; margin-bottom:16px}
@media(min-width:1080px){.settings-shell{grid-template-columns:minmax(0,1fr) 280px}}
.settings-shell__main,.settings-shell__side{display:flex; flex-direction:column; gap:14px}
.settings-card-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(170px,1fr)); gap:10px}
.settings-card{display:block; padding:14px; border-radius:14px; border:1px solid var(--border); background:rgba(0,0,0,.18); color:var(--text); text-decoration:none}
.settings-card:hover{background:rgba(255,255,255,.06); text-decoration:none}
.settings-card__title{display:block; font-weight:900}
.settings-card__meta{display:block; margin-top:6px; font-size:12px; color:var(--muted)}
.settings-jump{position:sticky; top:16px}
.settings-jump h3{margin:0 0 10px}
.settings-jump a{display:block; padding:9px 10px; border-radius:12px; color:var(--text); text-decoration:none}
.settings-jump a:hover{background:rgba(255,255,255,.08)}

.admin-grid{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:12px}
.admin-span-12{grid-column:span 12}
.admin-span-8{grid-column:span 8}
.admin-span-6{grid-column:span 6}
.admin-span-4{grid-column:span 4}
@media(max-width:1080px){.admin-span-8,.admin-span-6,.admin-span-4{grid-column:span 12}}
.admin-panel{padding:16px; border-radius:16px; border:1px solid var(--border); background:rgba(0,0,0,.20)}
.admin-panel h2{margin:0 0 8px}
.admin-panel__sub{margin:0 0 12px; font-size:12px; color:var(--muted)}
.admin-tile-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px}
.admin-tile{padding:12px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.04)}
.admin-tile__k{font-size:12px; color:var(--muted)}
.admin-tile__v{margin-top:6px; font-size:1.35rem; font-weight:1000}
.admin-link-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px}
.admin-link-card{display:block; padding:14px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); text-decoration:none}
.admin-link-card:hover{background:rgba(255,255,255,.08); text-decoration:none}
.admin-link-card__title{display:block; font-weight:900}
.admin-link-card__meta{display:block; margin-top:6px; font-size:12px; color:var(--muted)}
.admin-list{display:flex; flex-direction:column; gap:10px}
.admin-list-row{display:grid; grid-template-columns:1.2fr .9fr auto; gap:10px; align-items:center; padding:12px; border-radius:14px; border:1px solid var(--border); background:rgba(0,0,0,.16)}
@media(max-width:760px){.admin-list-row{grid-template-columns:1fr}}
.admin-list-row__title{font-weight:900}
.admin-list-row__meta{font-size:12px; color:var(--muted); margin-top:4px}
.admin-badge{display:inline-flex; align-items:center; gap:6px; padding:4px 9px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.06); font-size:12px}
.admin-badge.ok{background:rgba(80,255,140,.10); border-color:rgba(80,255,140,.22)}
.admin-badge.warn{background:rgba(255,200,80,.10); border-color:rgba(255,200,80,.22)}
.admin-badge.bad{background:rgba(255,80,80,.10); border-color:rgba(255,80,80,.22)}

/* Typography */
h1,h2,h3{margin:0 0 10px 0; line-height:1.2}
h1{font-size:1.7rem}
h2{font-size:1.2rem}
h3{font-size:1.05rem}
p{color:var(--muted); line-height:1.55; margin:0 0 12px}
.small{font-size:.92rem; color:var(--muted)}

/* Cards */
.card{
  background:
    radial-gradient(900px 260px at 20% 0%, rgba(0,0,248,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px;
}
.card.tight{padding:14px}

 /* Collapsible cards (User Management) */
.card.collapsible{padding:0}
.card.collapsible > summary{list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 18px;}
.card.collapsible > summary::-webkit-details-marker{display:none}
.card.collapsible > summary .sum-title{font-size:18px; font-weight:900; letter-spacing:.2px}
.card.collapsible > summary .sum-hint{margin-top:3px; font-size:12px; color:var(--muted)}
.card.collapsible > summary .sum-icon{width:34px; height:34px; border-radius:999px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); background:rgba(0,0,0,.24); font-size:18px; font-weight:900; transition:transform .15s ease, background .15s ease, border-color .15s ease;}
.card.collapsible[open] > summary{border-bottom:1px solid var(--border)}
.card.collapsible[open] > summary .sum-icon{transform:rotate(45deg); background:rgba(0,0,0,.34); border-color:rgba(255,255,255,.26)}
.card.collapsible .collapsible-body{padding:18px}




/* Compact "info" sub-cards used on request detail pages */
.subcard{
  margin-top:14px;
  padding:14px;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:rgba(0,0,0,.18);
}
.subcard label{margin:8px 0 6px; font-size:.9rem}
.subcard input[type="text"], .subcard input[type="email"], .subcard input[type="date"], .subcard input[type="password"], .subcard input[type="number"], .subcard textarea, .subcard select{
  padding:9px 10px;
}
textarea.notearea{min-height:120px; font-family:var(--mono)}
.hr{height:1px; background:var(--border); margin:14px 0}

/* Layout helpers */
.grid{display:grid; grid-template-columns:1fr; gap:14px}
@media(min-width:900px){
  .grid-2{grid-template-columns:1.2fr .8fr}
  .grid-3{grid-template-columns:repeat(3, 1fr)}
}

/* Small stat cards (admin) */
.statgrid{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:720px){.statgrid{grid-template-columns:repeat(3,1fr)}}
.statgrid.even-4{grid-template-columns:1fr}
@media(min-width:720px){.statgrid.even-4{grid-template-columns:repeat(2, 1fr)}}
@media(min-width:1060px){.statgrid.even-4{grid-template-columns:repeat(4, 1fr)}}
.stat{
  padding:14px;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:rgba(0,0,0,.18);
}
.stat__k{color:rgba(231,236,255,.72); font-size:.85rem; font-family:var(--mono)}
.stat__v{font-size:1.35rem; font-weight:900; margin-top:6px}
.stat__v .hint{font-size:.95rem; font-weight:700; color:rgba(231,236,255,.78)}

.row{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:720px){
  .row-2{grid-template-columns:1fr 1fr}
  .row-3{grid-template-columns:1fr 1fr 1fr}
}

/* Forms */
label{display:block; margin:10px 0 6px; font-weight:700; color:rgba(231,236,255,.92)}
input[type="text"], input[type="email"], input[type="date"], input[type="password"], input[type="number"], textarea, select{
  width:100%;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:rgba(0,0,0,.26);
  color:var(--text);
  outline:none;
}
input:focus, textarea:focus, select:focus{border-color:rgba(0,0,248,.55); box-shadow:0 0 0 3px rgba(0,0,248,.18)}
textarea{min-height:140px; font-family:var(--mono)}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(24,184,32,.34), rgba(24,184,32,.18));
  color:rgba(255,255,255,.95);
  font-weight:800;
  cursor:pointer;
  gap:8px;
}
.btn:hover{filter:brightness(1.06)}
.btn:active{transform:translateY(1px)}
.btn.secondary{background: linear-gradient(180deg, rgba(0,0,248,.30), rgba(0,0,248,.14))}
.btn.ghost{background:rgba(0,0,0,.18)}
.btn.danger{background: linear-gradient(180deg, rgba(255,77,77,.26), rgba(255,77,77,.12))}
.btn.small{padding:7px 10px; font-size:.85rem}

/* Badges / pills */
.badge{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--mono);
  font-size:.82rem;
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(0,0,0,.20);
  color:rgba(231,236,255,.85);
}
.pill{display:inline-flex; align-items:center; gap:8px}
.pill .badge{border-color:rgba(255,255,255,.14)}

.pillset{display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; align-items:center}
.page-title{margin:0 0 4px 0}
.sub{color:rgba(231,236,255,.72); font-size:.92rem; line-height:1.3}
.mono{font-family:var(--mono)}

/* Notices */
.notice{
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:rgba(0,0,248,.10);
  color:rgba(231,236,255,.92);
}
.notice.warn{background:rgba(248,176,56,.12)}
.notice.danger{background:rgba(255,77,77,.12)}
.notice.ok{background:rgba(24,184,32,.12)}

/* Code blocks */
.code{font-family:var(--mono); font-size:.92rem; background:rgba(0,0,0,.28); border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 12px; overflow:auto}

/* Tables */
.tablewrap{overflow-x:auto; overflow-y:visible; border-radius:var(--radius-sm); border:1px solid var(--border)}
.table{
  width:100%;
  border-collapse:collapse;
  min-width:640px;
}
.table th,.table td{padding:10px 10px; border-bottom:1px solid rgba(231,236,255,.10); vertical-align:top}
.table th{position:sticky; top:0; background:rgba(0,0,0,.28); color:rgba(231,236,255,.78); text-align:left; font-weight:800; font-size:.85rem}
.table tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.table tr:last-child td{border-bottom:none}



/* User management table column sizing */
.users-table .col-role,
.users-table .col-evemail{
  width:1%;
  white-space:nowrap;
}
.users-table .mini-form{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
}
.users-table .col-role select{min-width:120px}
.users-table .col-evemail select{min-width:90px}
.users-table .mini-form .btn.small{padding:7px 10px}

/* Spreadsheet-style toggles (manager board) */
.chk{width:20px; height:20px; accent-color: var(--dmc-green); cursor:pointer}
.chk[disabled]{opacity:.45; cursor:not-allowed}

/* Utility: inline mini-forms inside tables */
form.inline{display:inline; margin:0; padding:0}
form.inline button{vertical-align:middle}

.sheet-toolbar{display:flex; gap:10px; flex-wrap:wrap; align-items:end}
.sheet-toolbar .grow{flex:1; min-width:240px}
.cell-center{display:flex; align-items:center; justify-content:center}
.sheet-note{max-width:340px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

/* Spreadsheet-style tables */
.table-sheet{table-layout:fixed; width:100%}
.table-sheet th,.table-sheet td{padding:8px 10px}

/* Cost editor (sheet tables) */
.costform{display:grid; grid-template-columns: 1fr auto; gap:8px; align-items:center; margin:0}
.costinput{width:100%; max-width:100%; min-width:0; font-family:var(--mono); text-align:right}
.costsaved{min-width:48px; text-align:right; color:var(--muted); font-size:.8rem}

/* Manager board note editor (spreadsheet style) */
.noteform{display:grid; grid-template-columns: 1fr auto; gap:8px; align-items:start; margin:0}
.noteinput{
  width:100%;
  max-width:100%;
  min-height:46px;
  resize:vertical;
  font-family:var(--sans);
}
.noteinput.expanded{min-height:140px}

/* Keep sheet rows compact (2 lines tall) while still allowing an expanded editor */
.table-sheet .notes-cell{position:relative}
.table-sheet .noteform{position:relative}
.table-sheet .noteinput{
  height:2.6em;
  min-height:2.6em;
  max-height:2.6em;
  resize:none;
  overflow:hidden;
  white-space:pre-wrap;
}
.table-sheet .noteinput.expanded{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:180px;
  max-height:280px;
  z-index:80;
  resize:vertical;
  overflow:auto;
  background:rgba(0,0,0,.78);
  border:1px solid rgba(231,236,255,.16);
  box-shadow:0 14px 34px rgba(0,0,0,.35);
}

/* Compact one-line editor (admin request line items) */
.noteinput.compact{
  min-height:34px;
  height:34px;
  resize:none;
  overflow:hidden;
  white-space:nowrap;
  overflow-x:auto;
}
.noteinput.compact.expanded{
  height:auto;
  min-height:120px;
  resize:vertical;
  white-space:pre-wrap;
  overflow:auto;
}

/* In sheet tables, compact notes should still stay 2-lines tall and expand as an overlay (no row growth). */
.table-sheet .noteinput.compact{
  height:2.6em;
  min-height:2.6em;
  max-height:2.6em;
  resize:none;
  overflow:hidden;
  white-space:pre-wrap;
  overflow-x:hidden;
}
.table-sheet .noteinput.compact.expanded{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:180px;
  max-height:280px;
  z-index:80;
  resize:vertical;
  overflow:auto;
  background:rgba(0,0,0,.78);
  border:1px solid rgba(231,236,255,.16);
  box-shadow:0 14px 34px rgba(0,0,0,.35);
}
.notesaved{min-width:48px; text-align:right; color:var(--muted); font-size:.8rem; align-self:start}

/* Items builder (request form) */
.items-table input[type="text"],
.items-table input[type="number"]{
  padding:8px 10px;
  min-height:0;
}
.items-table input[type="number"]{font-family:var(--mono)}
.items-table td{padding:8px 8px}
.items-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.pastebox textarea{min-height:110px; font-family:var(--mono)}

/* Item builder (request form) */
.items-table input[type="text"],
.items-table input[type="number"]{
  padding:8px 10px;
  border-radius:12px;
  min-height:0;
}
.items-table input[type="text"]{font-family:var(--sans)}
.items-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.pastebox textarea{min-height:120px}

/* Key/Value grid */
.kv{display:grid; grid-template-columns: 180px 1fr; gap:10px}
@media(max-width:720px){.kv{grid-template-columns:1fr}}
.kv .k{color:var(--faint); font-family:var(--mono); font-size:.85rem}
.kv .v{color:rgba(231,236,255,.95)}

/* Status timeline */
.timeline, .steps{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.step{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(0,0,0,.18);
  color:rgba(231,236,255,.82);
}
.step .dot{width:10px; height:10px; border-radius:999px; background:rgba(231,236,255,.28)}
.step.active,
.step[data-state="current"]{border-color:rgba(0,0,248,.55); background:rgba(0,0,248,.10); color:#fff}
.step.active .dot,
.step[data-state="current"] .dot{background:var(--dmc-blue-hi)}
.step.done,
.step[data-state="done"]{border-color:rgba(24,184,32,.55); background:rgba(24,184,32,.10)}
.step.done .dot,
.step[data-state="done"] .dot{background:var(--dmc-green)}
.step[data-state="todo"]{opacity:.78}

/* Simple content lists (status updates) */
.list{display:flex; flex-direction:column; gap:10px}
.list__item{padding:10px 12px; border:1px solid var(--border); border-radius:var(--radius-sm); background:rgba(0,0,0,.16)}
.list__meta{color:rgba(231,236,255,.62); font-size:.82rem; font-family:var(--mono)}
.list__title{margin-top:4px; font-weight:850}
.list__body{margin-top:6px; color:rgba(231,236,255,.85); line-height:1.35}

/* Footer */
.footer{margin-top:26px; padding:16px 0 22px; border-top:1px solid rgba(231,236,255,.10); background:rgba(0,0,0,.10)}
.footer__inner{display:flex; flex-direction:column; gap:6px}
.footer__title{font-weight:900; letter-spacing:.2px}
.footer__text{color:rgba(231,236,255,.70); font-size:.9rem; line-height:1.4}
.footer__links{display:flex; gap:14px; flex-wrap:wrap; margin-top:4px}
.footer__links a{color:rgba(231,236,255,.86); text-decoration:none}
.footer__links a:hover{color:#fff; text-decoration:underline}

/* Modal (used for claim confirmations) */
.modal-backdrop{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.62);
  z-index:220;
}
.modal-backdrop.show{display:flex}
.modal{max-width:560px; width:100%}
.modal__title{font-weight:900; font-size:1.05rem; margin-bottom:8px}
.modal__body{color:var(--muted); line-height:1.45}
.modal__actions{display:flex; justify-content:flex-end; gap:10px; margin-top:14px; flex-wrap:wrap}
body.modal-open{overflow:hidden}
@keyframes modalPop{from{transform:translateY(8px) scale(.98); opacity:0}to{transform:translateY(0) scale(1); opacity:1}}
.modal-backdrop.show .modal{animation:modalPop .12s ease-out}

/* Utility */
.center{display:flex; align-items:center; justify-content:center}


/* Utility helpers */
label.check{display:flex; gap:10px; align-items:flex-start; margin:10px 0 6px; font-weight:700; color:rgba(231,236,255,.92)}
label.check input{margin-top:4px; width:auto}

ul.clean{list-style:none; padding-left:0; margin:0}
ul.clean li{margin:10px 0; color:rgba(231,236,255,.78)}

/* Admin preview helpers */
.brandpreview{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:720px){.brandpreview{grid-template-columns:1fr 1fr}}
.brandpreview__item{border:1px solid var(--border); border-radius:var(--radius-sm); background:rgba(0,0,0,.12); padding:12px}
.brandpreview__label{font-family:var(--mono); font-size:.82rem; color:var(--muted); margin-bottom:8px}
.brandpreview img{width:100%; height:auto; border-radius:var(--radius-sm); border:1px solid var(--border)}
.brandpreview .icon{max-width:88px}

/* =========================
   New Request Page — “Badass” submission UI
   (ties into theme variables)
   ========================= */

:root{
  --accent: var(--dmc-green);
  --accent2: var(--dmc-blue-hi);
  --warning: var(--dmc-gold);
  --danger: #ff4d4d;
  --hero-bg: var(--header-bg);
}

/* Slightly wider canvas for forms */
.container{max-width:1200px}

.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

.hero{
  position:relative;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:calc(var(--radius) + 4px);
  box-shadow:var(--shadow);
  margin:10px 0 16px;
}
.hero__bg{
  position:absolute; inset:0;
  background-image: var(--hero-bg);
  background-size: cover;
  background-position: center;
  transform:scale(1.03);
  filter:saturate(1.05) contrast(1.05);
}
.hero__bg::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(900px 360px at 18% 10%, color-mix(in srgb, var(--accent2) 28%, transparent), transparent 60%),
    radial-gradient(900px 360px at 85% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 62%),
    linear-gradient(90deg, rgba(0,0,0,.62), rgba(0,0,0,.24) 55%, rgba(0,0,0,.70)),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.55));
}
.hero__inner{
  position:relative;
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
  padding:18px;
}
@media(min-width:900px){
  .hero__inner{grid-template-columns: 1.15fr .85fr; align-items:end; padding:22px}
}
.hero__title{
  font-size:1.9rem;
  margin:0 0 6px 0;
  letter-spacing:.2px;
}
.hero__sub{
  margin:0;
  color:rgba(231,236,255,.82);
  max-width:64ch;
}
.hero__cta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.hero__cta .btn{padding:10px 14px}
.hero__chips{
  display:flex;
  gap:10px;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
  overflow-x:auto;
  padding-bottom:4px;
}
.hero__chip{
  display:inline-flex; align-items:center; gap:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.28);
  padding:8px 12px;
  font-family:var(--mono);
  font-size:.82rem;
  color:rgba(231,236,255,.88);
  backdrop-filter: blur(8px);
  white-space:nowrap;
  flex:0 0 auto;
}
.hero__chip b{color:#fff}

@media(max-width:720px){
  .hero__chips{flex-wrap:wrap; justify-content:center; overflow-x:visible}
}

.shell{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
}
@media(min-width:980px){
  .shell{grid-template-columns: 1.22fr .78fr; align-items:start}
}

.formcard{
  padding:0;
  overflow:hidden;
}
.formcard__body{padding:18px}
@media(min-width:900px){.formcard__body{padding:20px}}

.section{padding:16px 0}
.section + .section{border-top:1px solid var(--border)}
.section__head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px}
.section__head h2{margin:0; font-size:1.12rem}
.section__hint{font-family:var(--mono); font-size:.82rem; color:var(--muted)}

/* “Job submission” items repeater */
.items-panel{
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:
    radial-gradient(900px 260px at 20% 0%, rgba(0,0,248,.09), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  padding:12px;
}
.items-head{display:none}
@media(min-width:860px){
  .items-head{
    display:grid;
    grid-template-columns: 1.2fr 120px 1fr 96px;
    gap:10px;
    padding:6px 6px 10px;
    color:rgba(231,236,255,.70);
    font-family:var(--mono);
    font-size:.82rem;
  }
}

.items-list{display:flex; flex-direction:column; gap:10px}
.itemrow{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
  border:1px solid rgba(231,236,255,.12);
  border-radius:var(--radius);
  background:rgba(0,0,0,.16);
  padding:10px;
}
@media(min-width:860px){
  .itemrow{
    grid-template-columns: 1.2fr 120px 1fr 96px;
    align-items:center;
    padding:10px;
  }

.itemrow__name,.itemrow__note,.ta-wrap{min-width:0}
.ta-wrap input{width:100%}
}

.itemrow label{margin:0 0 6px; font-size:.82rem; font-family:var(--mono); color:rgba(231,236,255,.70)}
@media(min-width:860px){
  .itemrow label{display:none}
}

.itemrow input[type="text"],
.itemrow input[type="number"]{
  background:rgba(0,0,0,.30);
  border:1px solid rgba(231,236,255,.14);
  border-radius:14px;
  padding:10px 12px;

  /* Some browsers don't reliably inherit input text color for number fields */
  color:var(--text) !important;

  width:100%;
  box-sizing:border-box;
}


.itemrow input[type="number"]{font-family:var(--mono)}

/* Typeahead (EVE ESI live search) */
.ta-wrap{position:relative}
.ta-menu{
  position:absolute;
  left:0; right:0;
  top:calc(100% + 8px);
  z-index:60;
  border:1px solid var(--border2);
  border-radius:14px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 92%, transparent), color-mix(in srgb, var(--panel2) 88%, transparent));
  box-shadow: var(--shadow);
  overflow:hidden;
  max-height:280px;
  display:none;
}
.ta-menu.open{display:block}
.ta-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  cursor:pointer;
  border-top:1px solid rgba(255,255,255,.06);
}
.ta-item:first-child{border-top:none}
.ta-item:hover,
.ta-item.active{background:rgba(255,255,255,.06)}
.ta-name{font-weight:750; color:rgba(231,236,255,.94)}
.ta-id{font-family:var(--mono); font-size:.78rem; color:var(--faint)}
.ta-meta{font-family:var(--mono); font-size:.78rem; color:var(--muted)}
.ta-empty{padding:10px 12px; color:var(--muted); font-size:.92rem}

html[data-theme="light"] .ta-menu{
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.88));
}
html[data-theme="light"] .ta-item{border-top:1px solid rgba(11,18,32,.08)}
html[data-theme="light"] .ta-item:hover,
html[data-theme="light"] .ta-item.active{background:rgba(11,18,32,.06)}
html[data-theme="light"] .ta-name{color:rgba(11,18,32,.92)}
html[data-theme="light"] .ta-id{color:rgba(11,18,32,.55)}

.itemrow__remove{display:flex; align-items:end}
@media(min-width:860px){.itemrow__remove{align-items:center; justify-content:flex-end}}

.btn.icon{
  width:44px; height:40px;
  padding:0;
  justify-content:center;
}

/* Stronger primary CTA */
.btn.primary{
  border-color: color-mix(in srgb, var(--accent) 55%, rgba(255,255,255,.18));
  background:
    radial-gradient(900px 260px at 20% 0%, color-mix(in srgb, var(--accent2) 16%, transparent), transparent 60%),
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 55%, rgba(255,255,255,.10)), color-mix(in srgb, var(--accent) 28%, rgba(0,0,0,.10)));
}

/* Sidebar “how it works” */
.sidecard .list{gap:10px}
.milestones{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:10px;
}
.milestones li{
  display:flex; gap:10px; align-items:flex-start;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:rgba(0,0,0,.16);
}
.milestones .n{
  width:26px; height:26px;
  border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono);
  font-size:.82rem;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.25);
  color:rgba(231,236,255,.88);
  flex:0 0 auto;
}
.milestones .t{font-weight:850; color:rgba(231,236,255,.92)}
.milestones .d{color:var(--muted); font-size:.92rem; line-height:1.35}

/* Theme-specific tweaks */
html[data-theme="light"] .hero__chip{background:rgba(255,255,255,.74); color:rgba(11,18,32,.86); border-color:rgba(11,18,32,.18)}
html[data-theme="light"] .hero__chip b{color:#000}
html[data-theme="light"] .items-panel{background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.78))}
html[data-theme="light"] .itemrow{background:rgba(255,255,255,.78)}
html[data-theme="light"] .itemrow input[type="text"],
html[data-theme="light"] .itemrow input[type="number"]{background:rgba(255,255,255,.92)}

/* Admin request list (cards view) */
.reqcards{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:920px){.reqcards{grid-template-columns:repeat(2, 1fr)}}
.reqcard{
  display:block;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:rgba(0,0,0,.14);
  text-decoration:none;
  transition:transform .08s ease, filter .08s ease, background .08s ease;
}
.reqcard:hover{transform:translateY(-1px); filter:brightness(1.06); background:rgba(0,0,0,.18); text-decoration:none}
.reqcard__top{display:flex; align-items:center; justify-content:space-between; gap:10px}
.reqcard__id{font-family:var(--mono); font-weight:900; letter-spacing:.2px}
.reqcard__title{font-size:1.05rem; font-weight:900; margin-top:6px; color:rgba(231,236,255,.94)}
.reqcard__meta{margin-top:10px; display:grid; grid-template-columns:1fr 1fr; gap:8px; color:var(--muted); font-size:.92rem}
@media(max-width:560px){.reqcard__meta{grid-template-columns:1fr}}

.details{border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 12px; background:rgba(0,0,0,.10)}
.details__summary{cursor:pointer; font-weight:900; color:rgba(231,236,255,.92)}
.details__summary::marker{color:rgba(231,236,255,.65)}

/* Landing page screenshot grid */
.shotgrid{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:860px){.shotgrid{grid-template-columns:repeat(2, minmax(0, 1fr));}}
.shot{margin:0; padding:10px; border:1px solid var(--border); border-radius:var(--radius); background:rgba(0,0,0,.14)}
.shot img{width:100%; height:auto; border-radius:calc(var(--radius) - 4px); border:1px solid rgba(231,236,255,.14); display:block}
.shot figcaption{margin-top:10px; font-weight:900; color:rgba(231,236,255,.92)}


/* Ellipsis cell with hover expansion box */
.cell-item{max-width:none}
.ellip{display:block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; position:relative}
.ellip:hover::after{
  content: attr(data-full);
  position:absolute;
  left:0;
  top:100%;
  margin-top:6px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(0,0,0,.85);
  border:1px solid rgba(231,236,255,.16);
  color:rgba(231,236,255,.96);
  white-space:normal;
  width:max-content;
  max-width:640px;
  z-index:50;
  box-shadow:0 12px 32px rgba(0,0,0,.35);
}

/* Cron Manager */
.cron-shell{display:grid; grid-template-columns:minmax(260px,320px) minmax(0,1fr); gap:12px; align-items:start}
@media(max-width:1080px){.cron-shell{grid-template-columns:1fr}}
.cron-sidebar{position:sticky; top:16px; display:flex; flex-direction:column; gap:10px}
.cron-script-list{display:flex; flex-direction:column; gap:10px; max-height:calc(100vh - 220px); overflow:auto; padding-right:4px}
.cron-script-card{display:block; padding:14px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); text-decoration:none}
.cron-script-card:hover{background:rgba(255,255,255,.08); text-decoration:none}
.cron-script-card.is-active{border-color:rgba(122,188,255,.42); box-shadow:0 0 0 1px rgba(122,188,255,.16) inset; background:rgba(122,188,255,.08)}
.cron-script-card__top{display:flex; align-items:flex-start; justify-content:space-between; gap:10px}
.cron-script-card__meta{margin-top:6px; font-size:12px; color:var(--muted)}
.cron-main{display:flex; flex-direction:column; gap:12px; min-width:0}
.cron-main-panel{overflow:hidden}
.cron-main-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap}
.cron-main-head__badges{display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end}
.cron-action-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.cron-editor{min-height:520px; font-family:var(--mono); font-size:.9rem; line-height:1.45; tab-size:2; white-space:pre}
.cron-code,.cron-log-tail{max-height:520px; overflow:auto; white-space:pre-wrap; word-break:break-word}
.cron-quick-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px}
.cron-workbench{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr); gap:12px; margin-top:12px}
@media(max-width:1180px){.cron-workbench{grid-template-columns:1fr}}
.cron-section-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px}
.cron-inline-save{margin-left:auto}
.cron-editor{min-height:460px}

/* Member management rebuild */
.members-shell{display:flex;flex-direction:column;gap:16px}
.members-hero{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;align-items:flex-end}
.members-hero__title{margin:0;font-size:2rem;font-weight:1000;letter-spacing:.2px}
.members-hero__sub{max-width:74ch;margin:6px 0 0;color:var(--muted)}
.members-actions{display:flex;gap:8px;flex-wrap:wrap}
.members-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
@media(max-width:1080px){.members-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.members-stats{grid-template-columns:1fr}}
.member-stat{padding:14px;border-radius:18px;border:1px solid var(--border);background:rgba(0,0,0,.18)}
.member-stat__k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.member-stat__v{margin-top:8px;font-size:1.5rem;font-weight:1000}
.members-toolbar{display:flex;flex-direction:column;gap:12px}
.members-toolbar__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.members-search{flex:1 1 280px;min-width:220px}
.members-filter-pills,.member-alpha{display:flex;gap:8px;flex-wrap:wrap}
.members-filter-pills .btn,.member-alpha .btn{padding:8px 11px}
.member-alpha .btn{min-width:40px}
.members-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:1120px){.members-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.members-grid{grid-template-columns:1fr}}
.member-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:16px;border-radius:20px;border:1px solid var(--border);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));box-shadow:var(--shadow)}
.member-card.is-pending{border-color:rgba(255,200,80,.28);background:radial-gradient(900px 260px at 20% 0%, rgba(248,176,56,.10), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03))}
.member-card__top{display:flex;gap:14px;align-items:center}
.member-card__portrait,.member-profile__portrait{width:68px;height:68px;border-radius:18px;overflow:hidden;border:1px solid var(--border);background:rgba(0,0,0,.26);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:1000;flex:0 0 auto}
.member-profile__portrait{width:92px;height:92px;border-radius:24px}
.member-card__portrait img,.member-profile__portrait img{width:100%;height:100%;object-fit:cover;display:block}
.member-card__name{margin:0;font-size:1.12rem;font-weight:1000}
.member-card__meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.member-role{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.02em;border:1px solid var(--border);background:rgba(255,255,255,.06)}
.member-role.role-admin{background:rgba(122,188,255,.12);border-color:rgba(122,188,255,.28)}
.member-role.role-manager{background:rgba(102,214,255,.11);border-color:rgba(102,214,255,.24)}
.member-role.role-viewer{background:rgba(246,193,92,.12);border-color:rgba(246,193,92,.22)}
.member-role.role-member{background:rgba(255,255,255,.05)}
.member-role.role-provisional_member{background:rgba(248,176,56,.12);border-color:rgba(248,176,56,.28)}
.member-status{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.02em;border:1px solid var(--border);background:rgba(255,255,255,.05)}
.member-status.status-active{background:rgba(24,184,32,.12);border-color:rgba(24,184,32,.24)}
.member-status.status-pending{background:rgba(248,176,56,.14);border-color:rgba(248,176,56,.28)}
.member-status.status-suspended{background:rgba(255,77,77,.14);border-color:rgba(255,77,77,.28)}
.member-card__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.member-fact{padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:rgba(0,0,0,.16)}
.member-fact__k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.member-fact__v{margin-top:5px;font-size:.94rem;font-weight:700;word-break:break-word}
.member-card__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.member-pending-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(max-width:860px){.member-pending-strip{grid-template-columns:1fr}}
.member-profile{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.95fr);gap:16px;align-items:start}
@media(max-width:1080px){.member-profile{grid-template-columns:1fr}}

.member-section,.member-aside,.card,.table-wrap{min-width:0}
.table-wrap{width:100%;overflow:auto}
.onboarding-workbench{grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr)}
@media(max-width:1380px){.onboarding-workbench{grid-template-columns:1fr}}
.member-profile__hero{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.member-profile__heading{display:flex;flex-direction:column;gap:8px}
.member-profile__title{margin:0;font-size:2rem;font-weight:1000}
.member-profile__crumbs{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.member-section{display:flex;flex-direction:column;gap:12px}
.member-section__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.member-section__title{margin:0;font-size:1.08rem;font-weight:1000}
.member-section__sub{margin:4px 0 0;font-size:.92rem;color:var(--muted)}
.member-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.member-form-grid--single{grid-template-columns:1fr}
@media(max-width:760px){.member-form-grid{grid-template-columns:1fr}}
.member-aside{display:flex;flex-direction:column;gap:16px}
.member-detail-list{display:flex;flex-direction:column;gap:10px}
.member-detail{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.member-detail:last-child{border-bottom:none;padding-bottom:0}
.member-detail__k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.member-detail__v{text-align:right;font-weight:700;max-width:60%}
.member-snapshot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.member-snapshot .member-fact{min-height:82px}
.member-empty{padding:24px;border-radius:18px;border:1px dashed rgba(255,255,255,.18);text-align:center;color:var(--muted);background:rgba(0,0,0,.14)}
.member-notes{min-height:220px;font-family:var(--sans)}
.member-mini-list{display:flex;flex-direction:column;gap:10px}
.member-mini-list a{text-decoration:none}
.member-topbar{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}