/* ==========================================================================
   portal-merged.css
   Combined from app.css + dashboard.css
   Priority rule: app.css wins for overlapping global/theme/base styles.
   Dashboard-specific components retained and organized below.
   ========================================================================== */

/* =========================================================
   1) APP.CSS PRIMARY THEME TOKENS / BASE
   =======================================================*/
:root{
  --bg:#0d0d0f;
  --bg-card:#1a1a1d;
  --bg-header:#111114;
  --border:#2c2c33;
  --text:#e6e6f0;
  --text-dim:#a0a0ac;
  --link:#4da6ff;
  --link-hover:#80c1ff;
  --brand:#46d4ff;
  --brand-soft:#1f6cff;
  --brand2:#c55bff;
  --accent:#ff4fd8;
  --accent-2:#26d6ff;
  --ok:#22c55e;
  --warn:#f59e0b;
  --danger:#ef4444;
  --gp-time-color:#0e1224;
  --panel:#0f1118;
  --panel-soft:#131828;
  --panel2:#141a26;
  --ink:#e6ecff;
  --muted:#8d99b8;
  --border-subtle:rgba(255,255,255,.06);
  --borderSoft:rgba(255,255,255,.08);
  --radius:22px;
  --radius2:16px;
  --radius-md:12px;
  --shadow:0 18px 55px rgba(0,0,0,.55);
  --shadow-soft:0 18px 45px rgba(0,0,0,.5);
  --shadowSoft:0 10px 30px rgba(0,0,0,.45);
  --focus:0 0 0 3px rgba(70,212,255,.25);
  --card-bg:#121212;
  --card-radius:12px;
  --card-border-weight:1px;
  --igc-border-gradient: linear-gradient(90deg, var(--brand) 0%, var(--accent) 55%, var(--brand-soft) 100%);
  --igc-card-border: var(--igc-border-gradient);
  --cardA: rgba(255,255,255,.035);
  --cardB: rgba(255,255,255,.012);
  --field-bg: rgba(20,26,38,.92);
  --field-bg2: rgba(15,17,24,.92);
  --field-border: rgba(255,255,255,.14);
  --field-border2: rgba(70,212,255,.35);
  --field-ink: rgba(233,238,252,.96);
  --field-muted: rgba(167,176,200,.95);
  --field-shadow: 0 0 0 4px rgba(70,212,255,.08);
  --fz: 13px;
  --fz-sm: 12.5px;
  --pad: 6px;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
  font-size:16px;
  line-height:1.5;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html,body{ height:100%; max-width:100%; overflow-x:hidden; }
body{
  background:var(--bg);
  color:var(--text);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img{ max-width:100%; height:auto; }
a{ color:var(--link); text-decoration:none; }
a:hover{ color:var(--link-hover); text-decoration:underline; }
h1,h2,h3{ margin:0; line-height:1.15; }
p{ margin:0; }
ul{ margin:0; padding:0; }
li{ list-style:none; }
.wrap{ max-width:1200px; margin:0 auto; padding:16px; width:100%; }
.container{ width:min(1400px, calc(100% - 44px)); margin:22px auto 60px; }
.grid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; }
.col-4{ grid-column:span 4 / span 4; }
.col-6{ grid-column:span 6 / span 6; }
.col-12{ grid-column:span 12 / span 12; }

/* =========================================================
   2) APP.CSS HEADER / NAV
   =======================================================*/
.site-header{
  position:sticky; top:0; z-index:1000;
  background:
    linear-gradient(180deg, rgba(31,108,255,.14), rgba(255,79,216,.12)),
    linear-gradient(180deg, var(--panel), rgba(14,17,25,.65));
  border-bottom:1px solid var(--border-subtle);
  backdrop-filter:blur(8px);
  overflow:visible;
}
.site-header .container{
  max-width:1200px;
  width:100%;
  margin:0 auto;
  padding-inline:16px;
}
.site-header.full .container{
  max-width:none;
  width:100%;
  padding-inline:24px;
}
.site-header::before{
  content:"";
  position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg, var(--brand), var(--accent), var(--brand-soft));
  opacity:.75;
}
.header-row{ display:flex; align-items:center; gap:1rem; min-height:72px; }
.brand{ display:flex; align-items:center; gap:14px; text-decoration:none; overflow:visible; }
.brand-mark{ width:96px; height:96px; filter:drop-shadow(0 6px 18px rgba(70,212,255,.15)); }
.brand-stack{ display:flex; flex-direction:column; line-height:1.15; white-space:nowrap; }
.brand-word{ font-weight:700; letter-spacing:.2px; font-size:clamp(1.15rem, 1.4vw + .9rem, 1.65rem); }
.brand-tag{ font-size:.78rem; color:var(--muted); }
.igc-gradient-text{
  background:linear-gradient(90deg, var(--brand) 0%, var(--accent) 60%, var(--brand-soft) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.main-nav{ display:flex; align-items:center; gap:.5rem; margin-left:auto; }
.nav.pill{
  --outline: rgba(255,255,255,.08);
  color:var(--ink);
  text-decoration:none;
  padding:.45rem .8rem;
  border:1px solid var(--outline);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)),
    radial-gradient(120% 200% at -10% 0%, rgba(70,212,255,.10), transparent 40%),
    radial-gradient(120% 200% at 110% 0%, rgba(255,79,216,.10), transparent 40%);
  transition:transform .15s ease, border-color .2s ease, box-shadow .2s ease;
}
.nav.pill:hover{
  border-color:rgba(255,255,255,.16);
  box-shadow:0 6px 22px rgba(31,108,255,.15), inset 0 0 0 999px rgba(255,255,255,.01);
  transform:translateY(-1px);
}
.nav.pill.active{
  border-color:transparent;
  color:#0b0e17;
  background:linear-gradient(90deg, var(--brand), var(--accent)) border-box;
  box-shadow:0 8px 28px rgba(255,79,216,.18), 0 4px 12px rgba(70,212,255,.12);
}
.nav-toggle{
  color:var(--ink);
  background:transparent;
  border:1px solid var(--border-subtle);
  border-radius:10px;
  padding:.35rem;
  display:none;
}
.avatar-ring{
  position:relative; display:inline-grid; place-items:center; padding:2px; border-radius:999px;
  background:linear-gradient(90deg, var(--brand), var(--accent));
}
.user-area .avatar{ width:28px; height:28px; border-radius:999px; display:block; }
.user-menu summary{ list-style:none; display:flex; align-items:center; gap:.4rem; cursor:pointer; }
.user-menu summary::-webkit-details-marker{ display:none; }
.user-menu .chev{ opacity:.7; }
.user-menu[open] .chev{ transform:rotate(180deg); transition:.15s; }
.user-menu .menu{
  position:absolute; right:0; margin-top:.6rem; min-width:180px; padding:.5rem;
  background:linear-gradient(180deg, var(--panel-soft), var(--panel));
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);
}
.user-menu .menu a{ display:block; padding:.5rem .6rem; color:var(--ink); text-decoration:none; border-radius:10px; }
.user-menu .menu a:hover{ background:rgba(255,255,255,.04); }
.user-menu .menu hr{ border:0; border-top:1px solid var(--border-subtle); margin:.4rem 0; }

/* =========================================================
   3) DASHBOARD HEADER / FOOTER CLASSES
   =======================================================*/
.ikonic-header{
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 18px;
  flex-wrap:wrap;
  background:
    radial-gradient(800px 180px at 20% -60px, rgba(70,212,255,.12), transparent 60%),
    radial-gradient(800px 180px at 80% -60px, rgba(197,91,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border-bottom:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.ikonic-header-left,.ikonic-header-right{ display:flex; align-items:center; }
.ikonic-header-left{ gap:12px; min-width:0; }
.ikonic-header-right{ gap:14px; }
.ikonic-logo{
  width:38px; height:38px; object-fit:contain; border-radius:10px; margin-right:0;
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));
}
.ikonic-portal-title{
  font-size:22px; font-weight:900; letter-spacing:.2px; color:var(--brand);
  text-shadow:0 10px 24px rgba(0,0,0,.45);
}
.ikonic-user-info{
  display:flex; align-items:center; gap:10px; padding:6px 10px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10);
}
.ikonic-avatar{
  width:34px; height:34px; border-radius:999px; object-fit:cover;
  border:2px solid rgba(70,212,255,.55); box-shadow:0 10px 20px rgba(0,0,0,.35);
}
.ikonic-username{ font-weight:800; color:rgba(233,238,252,.95); }
.ikonic-logout,.ikonic-login{
  display:inline-flex; align-items:center; gap:.45rem; padding:.55rem .9rem; border-radius:999px;
  font-weight:900; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.ikonic-logout:hover,.ikonic-login:hover{
  transform:translateY(-1px); background:rgba(255,255,255,.09); border-color:rgba(70,212,255,.25);
  text-decoration:none;
}
.ikonic-footer{
  margin-top:50px; padding:18px 16px; border-top:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.02); color:rgba(167,176,200,.85); text-align:center;
}
.ikonic-footer a{ color:var(--link); text-decoration:none; }
.ikonic-footer a:hover{ color:var(--link-hover); text-decoration:underline; }

/* =========================================================
   4) GLOBAL CARDS / BUTTONS / FORMS / TABLES
   app.css stays primary
   =======================================================*/
.card{
  position:relative;
  border:var(--card-border-weight) solid transparent;
  border-radius:12px;
  background:
    linear-gradient(var(--bg-card), var(--bg-card)) padding-box,
    var(--igc-card-border) border-box;
  padding:20px;
  margin:20px 0;
  box-shadow:0 2px 6px rgba(0,0,0,.4);
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.55rem .95rem;
  border-radius:14px;
  font-weight:900;
  font-size:13px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:var(--ink);
  cursor:pointer;
  transition:transform .15s ease, background .15s ease, border-color .15s ease, filter .15s ease;
}

.btn:hover{
  transform:translateY(-1px);
  border-color:rgba(70,212,255,.25);
}

.btn.primary{
  background: linear-gradient(90deg, rgba(70,212,255,.18), rgba(197,91,255,.14));
  border-color: rgba(70,212,255,.28);
  color: var(--ink);
}

.btn.primary:hover{
  background: linear-gradient(90deg, rgba(70,212,255,.24), rgba(197,91,255,.20));
  filter: brightness(1.05);
}

.btn.success{
  background: rgba(34,197,94,.14);
  border-color: rgba(34,197,94,.28);
  color: rgba(214,255,231,.95);
}

.btn.pink{
  background: linear-gradient(90deg, rgba(255,79,216,.18), rgba(197,91,255,.14));
  border-color: rgba(255,79,216,.28);
  color: var(--ink);
}
input,textarea,select{
  width:100%; padding:10px; border-radius:6px; border:1px solid var(--border);
  background:#101012; color:var(--text); font-size:1rem;
}
input:focus,textarea:focus,select:focus{
  outline:2px solid var(--accent); outline-offset:0; border-color:var(--accent);
}
input::placeholder,textarea::placeholder{ color:#6b7280; }
.flash{ display:block; padding:12px; border-radius:6px; margin:12px 0; }
.flash.ok{ background:rgba(34,197,94,.15); border:1px solid var(--ok); color:var(--ok); }
.flash.err{ background:rgba(239,68,68,.15); border:1px solid var(--danger); color:var(--danger); }
table{ border-collapse:collapse; width:100%; margin:10px 0; font-size:.95rem; }
th,td{ border:1px solid var(--border); padding:8px 12px; text-align:left; }
th{ background:#1f1f24; font-weight:600; }
tr:nth-child(even){ background:#141418; }

.button{ padding:.5rem 1rem; border-radius:.375rem; font-weight:bold; cursor:pointer; }
.button-blue{ background-color:#3b82f6; color:white; }
.button-blue:hover{ background-color:#2563eb; text-decoration:none; }
.button-green{ background-color:#22c55e; color:black; }
.button-green:hover{ background-color:#16a34a; text-decoration:none; }
.button-yellow{
  background-color:#facc15; color:black; padding:.5rem 1rem; border-radius:.375rem;
  font-weight:bold; cursor:pointer; transition:background-color .2s;
}
.button-yellow:hover{ background-color:#eab308; text-decoration:none; }
.button-gray{ background-color:#6b7280; color:white; }
.button-gray:hover{ background-color:#4b5563; text-decoration:none; }
.button-red{
  background-color:#ef4444; color:white; padding:.5rem 1rem; border-radius:.375rem;
  font-weight:bold; cursor:pointer; transition:background-color .2s; display:inline-block;
  text-align:center; border:none; text-decoration:none;
}
.button-red:hover{ background-color:#dc2626; color:white; text-decoration:none; }
.button-darkred{
  background-color:#b91c1c; color:white; padding:.5rem 1rem; border-radius:.375rem;
  font-weight:bold; cursor:pointer; transition:background-color .2s;
}
.button-darkred:hover{ background-color:#991b1b; text-decoration:none; }
.back-button{
  background-color:#60a5fa; color:white; font-weight:600; padding:.5rem 1rem;
  border-radius:.375rem; text-decoration:none; display:inline-block; margin-left:.5rem;
  transition:background-color .2s;
}
.back-button:hover{ background-color:#3b82f6; text-decoration:none; }

/* =========================================================
   5) UTILITIES / HELPERS
   =======================================================*/
.text-cyan-300{ color:#22d3ee; }
.text-cyan-400{ color:#06b6d4; }
.text-cyan-500{ color:#0891b2; }
.text-gold-400{ color:#d4af23; }
.hidden,.is-hidden{ display:none !important; }
.mt-2{ margin-top:.5rem; }
.mt-3{ margin-top:.75rem; }
.w-full{ width:100%; }
.w-32{ width:8rem; }
.max-w-md{ max-width:28rem; }
.h-auto{ height:auto; }
.h-screen{ min-height:100svh; }
.p-2{ padding:.5rem; }
.p-8{ padding:2rem; }
.p-responsive{ padding:1rem; }
.border{ border:1px solid var(--border); }
.border-cyan-500{ border-color:rgba(70,212,255,.45); }
.mb-3{ margin-bottom:.75rem; }
.mb-4{ margin-bottom:1rem; }
.text-center{ text-align:center; }
.text-yellow-400{ color:#ffd37a; }
.text-sm{ font-size:.875rem; }
.items-center{ align-items:center; }
.justify-center{ justify-content:center; }
.muted{ color:rgba(167,176,200,.75); }
.ok{ color:rgba(125,243,177,.95); }
.warn{ color:rgba(255,211,122,.95); }
.bad{ color:rgba(255,123,123,.95); }
.red-dot{
  position:absolute; top:-6px; right:-10px; height:12px; width:12px;
  background-color:red; border-radius:50%; display:inline-block;
}
*{
  scrollbar-width:thin;
  scrollbar-color:rgba(120,140,180,.55) rgba(10,12,18,.55);
}
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background:rgba(10,12,18,.55); border-radius:999px; }
*::-webkit-scrollbar-thumb{ background:rgba(120,140,180,.45); border-radius:999px; }
*::-webkit-scrollbar-thumb:hover{ background:rgba(120,140,180,.65); }
.timeline-scroll::-webkit-scrollbar{ height:6px; }
.timeline-scroll::-webkit-scrollbar-thumb{ background-color:#4b5563; border-radius:4px; }

/* =========================================================
   6) DASHBOARD LISTS / ROWS / BADGES
   =======================================================*/
.cardHead{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px;
}
.iconTitle{ display:flex; gap:12px; align-items:flex-start; }
.iconTitle > span{
  display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center;
  border-radius:12px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10);
}
.h2{ font-size:20px; font-weight:950; letter-spacing:.2px; color:rgba(233,238,252,.98); }
.sub{ margin-top:6px; font-size:13px; color:rgba(167,176,200,.92); line-height:1.35; }
.actions{ display:flex; gap:10px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.actions-right{ justify-content:flex-end; }
.list{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.row{
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px;
  border-radius:var(--radius2); border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.04);
}
.row:hover{ border-color:rgba(70,212,255,.20); background:rgba(70,212,255,.06); }
.rowMain{ display:flex; align-items:center; gap:10px; min-width:0; }
.smallLink{ font-weight:900; color:rgba(233,238,252,.96); }
.smallLink:hover{ text-decoration:underline; }
.truncate{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;
}
.date{ font-weight:900; font-size:13px; white-space:nowrap; opacity:.95; }
.badge{
  display:inline-flex; align-items:center; padding:2px 9px; border-radius:999px; font-size:12px;
  font-weight:950; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05);
}
.badge.active{ border-color:rgba(34,197,94,.25); background:rgba(34,197,94,.12); color:rgba(125,243,177,.95); }
.badge.paused{ border-color:rgba(245,158,11,.25); background:rgba(245,158,11,.12); color:rgba(255,211,122,.95); }
.badge.completed{ border-color:rgba(70,212,255,.25); background:rgba(70,212,255,.10); color:rgba(70,212,255,.95); }
.badge.archived{ border-color:rgba(167,176,200,.20); background:rgba(167,176,200,.08); color:rgba(167,176,200,.85); }
.badge.green{ background:rgba(16,185,129,.15); border-color:rgba(16,185,129,.35); color:#b7f7da; }
.badge.yellow{ background:rgba(245,158,11,.15); border-color:rgba(245,158,11,.35); color:#fde68a; }
.badge.gray{ background:rgba(148,163,184,.12); border-color:rgba(148,163,184,.3); color:#e5e7eb; }
.badge.never{ opacity:.8; background:rgba(255,255,255,.03); }
.badge.live{ border-color:rgba(89,208,255,.25); background:rgba(89,208,255,.10); }
.pulse{
  width:10px; height:10px; border-radius:999px; background:rgba(70,212,255,.95);
  box-shadow:0 0 0 0 rgba(70,212,255,.45); animation:pulse-igc 1.4s ease-in-out infinite;
}
@keyframes pulse-igc{
  0%{ box-shadow:0 0 0 0 rgba(70,212,255,.35); opacity:.75; transform:scale(1); }
  50%{ box-shadow:0 0 0 10px rgba(70,212,255,0); opacity:1; transform:scale(1.06); }
  100%{ box-shadow:0 0 0 0 rgba(70,212,255,0); opacity:.75; transform:scale(1); }
}
.noticeBar{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.toolsGrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; }
.toolBtn{
  display:flex; align-items:center; justify-content:center; padding:12px 14px; border-radius:16px;
  font-weight:950; border:1px solid rgba(70,212,255,.22); background:rgba(70,212,255,.10);
  box-shadow:0 10px 25px rgba(0,0,0,.35); transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.toolBtn:hover{
  transform:translateY(-1px); background:rgba(70,212,255,.14); border-color:rgba(70,212,255,.30);
  text-decoration:none;
}

/* =========================================================
   7) TABLE / FORM HELPERS / TOMSELECT
   =======================================================*/
.notification-email{ background-color:#374151; color:#d1d5db; }
.notification-system{ background-color:#2563eb; color:#ffffff; }
.notification-task{ background-color:#22c55e; color:#000000; }
.notification-project{ background-color:#facc15; color:#000000; }
.notification-urgent{ background-color:#ef4444; color:#ffffff; }
.table{ width:100%; border-collapse:collapse; margin-top:1rem; }
.table th,.table td{ padding:.5rem; border-bottom:1px solid #4b5563; }
.table th{ background-color:#374151; color:#d1d5db; text-transform:uppercase; }
.table tr:hover{ background-color:#4b5563; }
.table thead th{ color:#c7d2fe; background:rgba(99,102,241,.08); border-bottom-color:#384361; }
.table tbody tr:hover{ background:rgba(34,211,238,.06); }
.input{
  width:100%; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.10);
  background:rgba(10,12,18,.38); color:var(--ink); outline:none;
}
.input:focus{ border-color:rgba(70,212,255,.45); box-shadow:0 0 0 3px rgba(70,212,255,.10); }
.form-stack{ display:grid; gap:14px; }
.field{ display:flex; flex-direction:column; gap:7px; }
.label{
  font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:rgba(233,238,252,.70);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.check{ display:flex; align-items:center; gap:10px; color:rgba(233,238,252,.82); font-size:14px; }
.form-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; }
.form-alert{
  border:1px solid rgba(239,68,68,.35); background:rgba(239,68,68,.12); color:#ffd7d7;
  padding:10px 12px; border-radius:14px; margin:10px 0 14px;
}
.ts-wrapper{ width:100%; background-color:transparent; color:#ffffff; border-radius:.375rem; }
.ts-control{
  border-radius:14px !important; border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(10,12,18,.38) !important; color:var(--ink) !important;
  padding:10px 12px !important; min-height:46px; box-shadow:none !important;
}
.ts-control .item{
  border-radius:999px !important; border:1px solid rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.06) !important; color:rgba(233,238,252,.92) !important;
}
.ts-dropdown{
  background:rgba(8,10,16,.96) !important; border:1px solid rgba(255,255,255,.10) !important;
  border-radius:14px !important; color:#ffffff; backdrop-filter:blur(14px); overflow:hidden;
}
.ts-dropdown .option{ color:rgba(233,238,252,.88) !important; padding:10px 12px !important; }
.ts-dropdown .option.active{ background:rgba(70,212,255,.10) !important; color:#ffffff; }
.ts-wrapper .remove{ color:#f87171; }
.ts-wrapper .remove:hover{ color:#ef4444; }

/* =========================================================
   8) FILES / FOLDERS / PREVIEW
   =======================================================*/
.personal-folder a{ color:#3b82f6; text-decoration:underline; }
.personal-folder a:hover{ color:#2563eb; }
.folder-block{
  border:1px solid #4B5563; border-radius:6px; margin-bottom:12px; background-color:#1F2937; padding:0;
}
.folder-header{
  background-color:#111827; color:#FACC15; font-weight:bold; padding:8px 12px; display:flex;
  justify-content:space-between; align-items:center; border-bottom:1px solid #374151;
}
.folder-indent-0{ margin-left:0; }
.folder-indent-1{ margin-left:20px; }
.folder-indent-2{ margin-left:40px; }
.folder-indent-3{ margin-left:60px; }
.folder-indent-4{ margin-left:80px; }
.folder-indent-5{ margin-left:100px; }
.folder-block table{
  width:100%; border-collapse:collapse; background-color:#1F2937;
}
.folder-block th{
  background-color:#374151; color:#9CA3AF; text-transform:uppercase; font-size:.875rem; padding:8px 12px;
}
.folder-block td{ padding:8px 12px; }
.folder-block tr:nth-child(even){ background-color:#2D3748; }
.folder-block tr:hover{ background-color:#4B5563; }
.no-files{ color:#9CA3AF; padding:8px 12px; }
.parent-folder-select option{ color:#ffffff; background-color:#374151; }
.custom-dropzone{
  border:4px dashed #60a5fa; background-color:#f9fafb; padding:2rem; border-radius:1rem;
  text-align:center; font-size:1.125rem; font-weight:500; color:#4b5563; transition:border-color .3s ease;
}
.custom-dropzone:hover{ border-color:#3b82f6; background-color:#f0f9ff; }
.custom-dropzone .dz-message{ font-size:1.25rem; font-weight:600; color:#6b7280; padding:2rem; }
.custom-dropzone .dz-upload{ background:#3b82f6; height:8px; border-radius:4px; margin-top:8px; }
.folder-toggle{ cursor:pointer; user-select:none; transition:background-color .2s ease; }
.folder-toggle:hover{ background-color:#374151; }
.toggle-arrow{
  display:inline-block; width:1.25rem; text-align:center; margin-right:.5rem; transition:transform .2s ease;
}
.folder-toggle.collapsed .toggle-arrow{ transform:rotate(-90deg); }
#previewModal{
  display:none; position:fixed; z-index:9999; left:0; top:0; width:100%; height:100%;
  background-color:rgba(0,0,0,0.9); align-items:center; justify-content:center;
}
#previewModalInner{
  max-width:90%; max-height:90%; display:flex; align-items:center; justify-content:center;
}
#previewModalContent,#previewModalVideo{
  max-width:100%; max-height:100%; object-fit:contain; border-radius:8px; background-color:#000;
}
#previewModalClose{
  position:absolute; top:20px; right:35px; color:#fff; font-size:40px; font-weight:bold; cursor:pointer; z-index:10000;
}
#previewModalClose:hover{ color:#bbb; }

/* =========================================================
   9) SERVER STATUS / TABLE PROJECTS / CHAT INPUT
   =======================================================*/
.server-status-dot{
  display:inline-block; width:12px; height:12px; border-radius:9999px; margin-right:.5rem;
}
.server-status-dot.online{ background-color:#34D399; }
.server-status-dot.offline{ background-color:#F87171; }
.table-projects th:nth-child(1),.table-projects td:nth-child(1){
  width:30%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.table-projects th:nth-child(2),.table-projects td:nth-child(2),
.table-projects th:nth-child(3),.table-projects td:nth-child(3){ width:12%; }
.table-projects th:nth-child(4),.table-projects td:nth-child(4){ width:10%; text-align:center; }
.table-projects th:nth-child(5),.table-projects td:nth-child(5),
.table-projects th:nth-child(6),.table-projects td:nth-child(6){ width:20%; }
.table-projects th:nth-child(7),.table-projects td:nth-child(7){ width:10%; text-align:center; white-space:nowrap; }
.table-projects th{ white-space:nowrap; vertical-align:middle; }
.table-projects th span[id^="sort-icon-"]{ display:inline-block; margin-left:4px; }
.chat-input-container textarea{ min-height:80px; }
.chatBoxScroll{ overflow-y:auto; overscroll-behavior:contain; }
.chatShell{ height:calc(100vh - 220px); min-height:520px; }
.roomItem:hover{ background:rgba(255,255,255,.04) !important; }

/* =========================================================
   10) WEBSITES VIEW / TOGGLES / HERO
   =======================================================*/
.container-websites{
  width:min(1400px, calc(100% - 44px)); margin:22px auto 60px; padding:14px; font-size:var(--fz);
}
.websites-bar{
  display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px;
}
.websites-card{
  background:#121826; border:1px solid #2d3748; border-radius:10px; overflow-x:hidden; box-shadow:0 2px 8px rgba(0,0,0,.5);
}
.websites-table{ width:100%; border-collapse:collapse; table-layout:auto; }
.websites-table th,.websites-table td{
  padding:var(--pad) 10px; border-bottom:1px solid #243043; text-align:left; vertical-align:middle;
}
.websites-table th{
  font-weight:700; font-size:calc(var(--fz) - 1px); background:#0f172a; color:#cfe9e6; letter-spacing:.01em;
}
.websites-table td{ font-size:var(--fz); }
.websites-table tr:hover{ background:rgba(45,212,191,0.06); }
.websites-table .code,.code{
  color:#cbd5e1; font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace; font-size:12px;
}
.col-prod .code,.col-stage .code{
  display:block; max-width:420px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.col-actions{ width:260px; text-align:right; }
.col-actions .actions{ justify-content:flex-end; }
.inline-form{ display:inline; }
.del-wrap{ display:flex; align-items:center; gap:6px; flex-wrap:nowrap; }
.purge-tip{ flex-basis:100%; color:#fca5a5; font-size:11.5px; margin-left:2px; }
.btn-primary{ background:#10b981; border-color:#2dd4bf; color:#041b17; }
.btn-primary:hover{ filter:brightness(1.06); text-decoration:none; }
.btn-soft{ background:#1f2937; border-color:#374151; color:#e5e7eb; }
.btn-soft:hover{ background:#2b3647; text-decoration:none; }
.btn-danger{ background:#7f1d1d; border-color:#dc2626; color:#fee2e2; }
.btn-danger:hover{ filter:brightness(1.05); text-decoration:none; }
.chip{
  padding:2px 8px; border-radius:999px; font-size:11.5px; font-weight:700; letter-spacing:.02em;
}
.chip-active{ background:rgba(16,185,129,.15); color:#34d399; border:1px solid rgba(45,212,191,.35); }
.chip-archived{ background:rgba(127,29,29,.18); color:#fca5a5; border:1px solid rgba(220,38,38,.45); }
.flash-ok{
  background:#064e3b; color:#d1fae5; padding:8px 10px; border-radius:8px; margin-bottom:10px;
  border:1px solid rgba(45,212,191,.4); font-size:var(--fz);
}
.flash-err{
  background:#3f1d1d; color:#fecaca; padding:8px 10px; border-radius:8px; margin-bottom:10px;
  border:1px solid rgba(220,38,38,.5); font-size:var(--fz);
}
.websites-view{
  --bg:#0b1020; --bg-2:#0f172a; --card:#111827; --muted:#9ca3af; --text:#e5e7eb; --border:#223043;
  --accent:#22d3ee; --accent-2:#3b82f6; --success:#10b981; --warn:#f59e0b; --danger:#ef4444;
  color:var(--text);
}
.websites-view .container-websites{ max-width:1100px; margin:0 auto; padding:24px; }
.websites-view .card{ background:var(--card); border:1px solid var(--border); border-radius:14px; padding:18px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.websites-view .muted{ color:var(--muted); }
.websites-view code{ color:#cbd5e1; }
.websites-view .tabs{ display:flex; gap:10px; margin:14px 0 18px; flex-wrap:wrap; }
.websites-view .tabs a{
  padding:9px 14px; border:1px solid var(--border); border-radius:999px; text-decoration:none; color:var(--text);
  background:linear-gradient(180deg,var(--bg-2),#0b1222); transition:box-shadow .2s,border-color .2s;
}
.websites-view .tabs a:hover{ border-color:var(--accent); box-shadow:0 0 0 2px rgba(34,211,238,.2) inset; }
.websites-view .tabs a.active{
  background:linear-gradient(180deg,#0f172a,#13203a); border-color:var(--accent-2); box-shadow:0 6px 24px rgba(59,130,246,.25);
}
.websites-view .btn,.websites-view .btn-secondary{
  display:inline-block; padding:10px 14px; border-radius:10px; text-decoration:none; cursor:pointer;
  transition:transform .05s ease, box-shadow .2s ease;
}
.websites-view .btn{ border:1px solid var(--accent); background:var(--success); color:#031b13; font-weight:700; }
.websites-view .btn:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(16,185,129,.25); }
.websites-view .btn-secondary{ border:1px solid var(--border); background:#1f2937; color:var(--text); }
.websites-view .btn-secondary:hover{ border-color:var(--accent); box-shadow:0 8px 20px rgba(34,211,238,.15); }
.websites-view input[type=text],
.websites-view input[type=password],
.websites-view input[type=email],
.websites-view select,
.websites-view textarea{
  width:100%; padding:10px 12px; border-radius:10px; border:1px solid var(--border); background:#0b1222; color:var(--text); outline:none;
}
.websites-view input::placeholder,.websites-view textarea::placeholder{ color:#6b7280; }
.websites-view input:focus,.websites-view select:focus,.websites-view textarea:focus{
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(34,211,238,.15);
}
.websites-view .table{ width:100%; border-collapse:separate; border-spacing:0; }
.websites-view .table th,.websites-view .table td{
  padding:10px 12px; border-bottom:1px solid var(--border); text-align:left;
}
.websites-view .table thead th{
  color:#c7d2fe; background:rgba(99,102,241,.08); border-bottom-color:#384361;
}
.websites-view .table tbody tr:hover{ background:rgba(34,211,238,.06); }
.websites-view .badge{
  display:inline-block; padding:4px 10px; border-radius:999px; font-size:.8rem; border:1px solid var(--border); background:#0e162a;
}
.websites-view .badge.green{ background:rgba(16,185,129,.15); border-color:rgba(16,185,129,.35); color:#b7f7da; }
.websites-view .badge.yellow{ background:rgba(245,158,11,.15); border-color:rgba(245,158,11,.35); color:#fde68a; }
.websites-view .badge.gray{ background:rgba(148,163,184,.12); border-color:rgba(148,163,184,.3); color:#e5e7eb; }
.websites-view .site-meta{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.websites-view .site-meta .row{ display:flex; gap:10px; align-items:center; }
.websites-view .grid{ display:grid; gap:16px; }
.websites-view .grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.websites-view .grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.websites-view .flash{ margin:12px 0; padding:12px 14px; border-radius:10px; }
.websites-view .flash.ok{ background:#12321f; color:#d1fae5; border:1px solid #14532d; }
.websites-view .flash.err{ background:#3f1d1d; color:#fecaca; border:1px solid #7f1d1d; }
.websites-view .hero-bar{
  margin-bottom:14px; border-radius:12px; padding:12px 14px;
  background:
    radial-gradient(1200px 300px at 0% 0%, rgba(34,211,238,.15), transparent),
    radial-gradient(900px 250px at 100% 20%, rgba(59,130,246,.18), transparent),
    linear-gradient(180deg,#0f172a,#0b1222);
  border:1px solid var(--border);
}
.pill input[type=text]{
  background:#0b1222; border:0; outline:0; color:#e5e7eb; padding:0 8px; height:28px; min-width:180px; border-radius:6px;
}
.pill-select{
  display:block !important; width:180px !important; height:34px !important; padding:4px 28px 4px 10px !important;
  background:#0b1222 !important; color:#e5e7eb !important; border:1px solid #334155 !important; border-radius:18px !important;
  line-height:1.2 !important; appearance:none !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20' fill='%23cbd5e1'><path d='M5.5 7l4.5 5 4.5-5z'/></svg>");
  background-repeat:no-repeat; background-position:right 10px center; background-size:12px;
}
.pill-select:focus{ outline:2px solid #10b981 !important; outline-offset:2px !important; }
.pill-select option{ color:#e5e7eb !important; background:#0b1222 !important; }
.badge-root{ padding:6px 10px; border-radius:8px; background:#0f172a; border:1px solid #334155; color:#e5e7eb; }
#hideCompletedTrack{
  position:relative; width:40px; height:20px; border-radius:9999px; background:#4b5563; transition:background-color .2s ease;
}
#hideCompletedKnob{
  position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:9999px; background:#fff;
  transition:transform .2s ease, left .2s ease;
}
#hideCompletedWrap.is-on{ box-shadow:0 0 0 2px rgba(34,211,238,.8); background:rgba(8,51,68,.4); }
#hideCompletedWrap.is-on #hideCompletedTrack{ background:#06b6d4; }
#hideCompletedWrap.is-on #hideCompletedKnob{ transform:translateX(20px); }
#viewToggle .vt-btn.is-active{
  background:rgba(6,182,212,0.25); color:#a5f3fc; font-weight:600; box-shadow:0 0 0 1px rgba(6,182,212,0.8) inset;
}
#viewToggle .vt-btn.is-active:hover{ background:rgba(6,182,212,0.35); }
.galaxy-label{
  transition:transform .3s ease, box-shadow .3s ease; box-shadow:0 0 10px rgba(0,153,255,.4);
  background-color:#1d4ed8; padding:4px 8px; border-radius:6px; color:white; cursor:pointer;
}
.galaxy-label:hover{ transform:scale(1.1); box-shadow:0 0 15px rgba(0,255,255,.7); }
.galaxy-label:active{ animation:pulse-click .4s; }
.fade-in{ opacity:0; animation:fade-in-soft 2s ease forwards; }
.animate-fade-in{ animation:fade-in-soft 1.2s ease-out; }
.float-glow{ animation:floatGlow 6s ease-in-out infinite; }
#galaxy-map{ transform:scale(1); animation:zoomIn 12s ease-out forwards; }
.fade-out{ animation:fadeOut .3s forwards; }
@keyframes fade-in-soft{ from{ opacity:0; transform:scale(1.05); } to{ opacity:1; transform:scale(1); } }
@keyframes floatGlow{ 0%{ transform:translateY(0px); } 50%{ transform:translateY(-3px); } 100%{ transform:translateY(0px); } }
@keyframes zoomIn{ from{ transform:scale(1.08); opacity:.8; } to{ transform:scale(1); opacity:1; } }
@keyframes pulse-click{ 0%{ transform:scale(1); } 50%{ transform:scale(1.2); } 100%{ transform:scale(1); } }
@keyframes fadeOut{ to{ opacity:0; } }
.gradTitle{
  background:linear-gradient(90deg, var(--brand,#46d4ff), var(--brand2,#c55bff), var(--accent,#ff4fd8));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* =========================================================
   11) DASHBOARD SECTION ROWS / HALO / PROJECTS / IDEAS / TASK CREATE / PLAYER / NEWS
   Kept concise but complete enough to cover major page components.
   =======================================================*/
.sectionRow{
  grid-column:span 12 / span 12; padding:14px 16px; border-radius:18px; border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(900px 220px at 15% -60px, rgba(70,212,255,.08), transparent 60%),
    radial-gradient(900px 220px at 85% -60px, rgba(197,91,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  box-shadow:0 14px 40px rgba(0,0,0,.45);
}
.sectionRow .kicker{ display:flex; align-items:center; gap:10px; font-weight:950; letter-spacing:.2px; font-size:14px; }
.sectionRow .kicker .dot{
  width:10px; height:10px; border-radius:999px; background:rgba(70,212,255,.95); box-shadow:0 0 0 6px rgba(70,212,255,.12);
}
.sectionRow .subline{ margin-top:6px; color:rgba(167,176,200,.9); font-size:13px; line-height:1.35; }
.sectionRow.hr{ padding:10px 16px; background:rgba(255,255,255,.02); }
.sectionRow.hr .line{
  height:2px; border-radius:999px;
  background:linear-gradient(90deg, rgba(70,212,255,0), rgba(70,212,255,.65), rgba(197,91,255,.65), rgba(255,79,216,.45), rgba(70,212,255,0));
  opacity:.9;
}
.card > .btn{ margin-left:auto; display:inline-flex; width:fit-content; }
.shortcutCard{ display:flex; flex-direction:column; }
.shortcutCard > .btn,.shortcutCard .actions{ margin-top:auto; margin-left:auto; }

.halo-fab{
  position:fixed; right:18px; bottom:18px; z-index:9999; display:inline-flex; align-items:center; gap:10px;
  padding:12px 16px; border-radius:999px; font-weight:950; color:var(--ink);
  border:1px solid rgba(70,212,255,.30); background:linear-gradient(90deg, rgba(70,212,255,.20), rgba(197,91,255,.16));
  box-shadow:0 18px 45px rgba(0,0,0,.55); cursor:pointer;
  transition:transform .15s ease, filter .15s ease, border-color .15s ease;
}
.halo-fab:hover{ transform:translateY(-2px); filter:brightness(1.08); border-color:rgba(70,212,255,.45); }
.halo-fab:focus{ outline:none; box-shadow:var(--focus), 0 18px 45px rgba(0,0,0,.55); }
.halo-fab-text{ letter-spacing:.3px; }

.projShell{ padding:18px; }
.projTop{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:12px;
}
.projTitle{ display:flex; align-items:center; gap:12px; min-width:0; }
.projIcon{
  width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:rgba(70,212,255,.08); border:1px solid rgba(70,212,255,.18);
}
.projNew{ margin-left:10px; }
.projTotal{ color:rgba(70,212,255,.95); font-weight:950; }
.projSearch{ width:min(360px, 100%); flex:0 1 360px; }
.projSearch input{
  width:100%; min-height:44px; padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05); color:var(--ink); outline:none;
}
.projSearch input::placeholder{ color:rgba(167,176,200,.7); }
.projSearch input:focus{ box-shadow:var(--focus); border-color:rgba(70,212,255,.28); }
.projControls{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding-top:10px; border-top:1px solid rgba(255,255,255,.08);
}
.seg{
  display:inline-flex; border-radius:14px; overflow:hidden; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04);
}
.segBtn{
  appearance:none; border:0; background:transparent; color:rgba(233,238,252,.92); padding:10px 12px; font-weight:900; cursor:pointer;
}
.segBtn + .segBtn{ border-left:1px solid rgba(255,255,255,.10); }
.segBtn:hover{ background:rgba(255,255,255,.06); }
.segBtn.is-active{ background:rgba(70,212,255,.12); color:rgba(70,212,255,.95); }
.ctrl{
  display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border-radius:14px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04);
}
.ctrlLabel{
  font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:rgba(167,176,200,.85); font-weight:950;
}
.ctrl select{
  min-height:34px; border-radius:10px; border:1px solid rgba(255,255,255,.10); background:rgba(10,12,18,.55); color:var(--ink); padding:6px 10px; outline:none;
}
.ctrl select:focus{ box-shadow:var(--focus); border-color:rgba(70,212,255,.28); }
.togglePill{
  display:inline-flex; align-items:center; gap:10px; padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); cursor:pointer;
}
.toggleText{ font-weight:900; color:rgba(233,238,252,.92); }
.projCards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:14px; }
.projCard{
  border-radius:18px; padding:14px; border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(700px 220px at 30% -40px, rgba(70,212,255,.08), transparent 60%),
    radial-gradient(700px 220px at 80% -40px, rgba(197,91,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  box-shadow:var(--shadowSoft);
}
.projCard:hover{ border-color:rgba(70,212,255,.22); box-shadow:var(--shadow); }
.projTableWrap{
  margin-top:14px; border-radius:18px; overflow:hidden; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); box-shadow:var(--shadowSoft);
}
.projTable{
  width:100%; border-collapse:collapse; font-size:13px; min-width:900px;
}
.projTable thead th{
  text-align:left; padding:12px; color:rgba(70,212,255,.92); background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.10); font-weight:950; white-space:nowrap;
}
.projTable tbody td{
  padding:12px; border-bottom:1px solid rgba(255,255,255,.08); color:rgba(233,238,252,.90); vertical-align:top;
}
.projTable tbody tr:hover{ background:rgba(255,255,255,.03); }
.projRowParent{ background:rgba(70,212,255,.04); }
.projRowChild{ background:rgba(255,255,255,.015); }
.projRowParent td:first-child,.projRowChild td:first-child{ position:relative; padding-left:16px; }
.projRowParent td:first-child::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; border-radius:4px;
  background:linear-gradient(180deg, rgba(70,212,255,.95), rgba(197,91,255,.75)); opacity:.9;
}
.projRowChild td:first-child::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; border-radius:4px; background:rgba(255,255,255,.08); opacity:.7;
}
.parent-row{ background:#0e1525; }
.child-row{ background:#0a1220; }
.card-parent{ border:1px solid rgba(34,197,94,.35); }
.card-child{ border:1px solid rgba(59,130,246,.35); }
.priBadge{
  display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px;
  font-weight:950; font-size:12px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); letter-spacing:.1px;
}
.pri-sm{ padding:4px 8px; font-size:11px; }
.pri-low{ color:rgba(125,243,177,.95); border-color:rgba(34,197,94,.30); background:rgba(34,197,94,.12); }
.pri-medium{ color:rgba(255,211,122,.95); border-color:rgba(245,158,11,.32); background:rgba(245,158,11,.12); }
.pri-high{ color:rgba(255,162,122,.95); border-color:rgba(249,115,22,.35); background:rgba(249,115,22,.12); }
.pri-critical{ color:rgba(255,123,123,.96); border-color:rgba(239,68,68,.38); background:rgba(239,68,68,.12); }
.projActions{ text-align:right; white-space:nowrap; }
.actBtn{
  display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border-radius:12px; font-weight:950; font-size:12px;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:rgba(233,238,252,.92); margin-left:8px;
  transition:transform .15s ease, filter .15s ease, border-color .15s ease, background .15s ease;
}
.actBtn:hover{ transform:translateY(-1px); filter:brightness(1.06); text-decoration:none; }
.actEdit{ border-color:rgba(245,158,11,.35); background:rgba(245,158,11,.12); color:rgba(255,211,122,.95); }
.actDelete{ border-color:rgba(239,68,68,.38); background:rgba(239,68,68,.12); color:rgba(255,123,123,.96); }
.projView{ max-width:1200px; margin:24px auto; padding:0 18px; }
.projView__wrap{
  border:1px solid rgba(255,255,255,.10); border-radius:18px; background:rgba(15,17,23,.55);
  box-shadow:0 24px 70px rgba(0,0,0,.55); backdrop-filter:blur(10px); padding:18px;
}
.projView__title{
  margin:4px 0 14px; font-size:34px; font-weight:950; letter-spacing:.2px; color:rgba(70,212,255,.95);
}
.flash--ok{ background:rgba(34,197,94,.16); color:rgba(214,255,231,.95); border-color:rgba(34,197,94,.28); }
.flash--warn{ background:rgba(245,158,11,.18); color:rgba(255,234,186,.95); border-color:rgba(245,158,11,.28); }
.flash--bad{ background:rgba(239,68,68,.16); color:rgba(255,210,210,.95); border-color:rgba(239,68,68,.28); }
.flash--info{ background:rgba(59,130,246,.16); color:rgba(219,234,254,.95); border-color:rgba(59,130,246,.28); }
.projTabs{
  display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 16px;
}
.projTabs__btn{
  appearance:none; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:rgba(233,238,252,.92);
  padding:10px 14px; border-radius:12px; font-weight:900; cursor:pointer;
  transition:transform .15s ease, filter .15s ease, border-color .15s ease, background .15s ease; position:relative;
}
.projTabs__btn:hover{ transform:translateY(-1px); filter:brightness(1.06); }
.projTabs__btn.is-active{
  border-color:rgba(70,212,255,.35); background:rgba(70,212,255,.10); color:rgba(70,212,255,.98);
}
.dot{
  display:inline-block; width:10px; height:10px; border-radius:999px; background:rgba(239,68,68,.95); margin-left:8px; vertical-align:middle;
}
.dot--pulse{ animation:dotPulse 1.2s infinite; }
@keyframes dotPulse{ 0%{ transform:scale(1); opacity:.8; } 50%{ transform:scale(1.35); opacity:1; } 100%{ transform:scale(1); opacity:.8; } }
.projCard__head{ margin-bottom:12px; }
.projCard__head--row{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.projCard__title{ margin:0; font-size:20px; font-weight:950; color:rgba(70,212,255,.92); }
.projSection{ margin-top:16px; }
.projDesc{
  border:1px solid rgba(255,255,255,.10); border-radius:16px; background:rgba(255,255,255,.03); padding:14px; margin-bottom:14px;
}
.projDesc__main{ margin:0; color:rgba(233,238,252,.92); font-weight:800; }
.projDesc__sub{ margin:10px 0 0; color:rgba(167,176,200,.92); }
.projMeta{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.projMeta__item{
  border:1px solid rgba(255,255,255,.10); border-radius:16px; background:rgba(255,255,255,.03); padding:12px; min-height:64px;
}
.projMeta__label{
  font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; color:rgba(167,176,200,.90); margin-bottom:6px;
}
.projMeta__value{ color:rgba(233,238,252,.92); font-weight:850; line-height:1.25; }
.projMeta__hint{ margin-left:10px; font-size:12px; font-weight:900; color:rgba(125,243,177,.95); }
.projInput,.projSelect{
  width:100%; border-radius:12px; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.28);
  color:rgba(233,238,252,.92); padding:10px 12px; outline:none;
}
.projInput:focus,.projSelect:focus{ border-color:rgba(70,212,255,.35); box-shadow:0 0 0 3px rgba(70,212,255,.12); }
.projLabel{
  display:block; margin:10px 0 6px; color:rgba(167,176,200,.92); font-weight:900; font-size:12px; letter-spacing:.1em; text-transform:uppercase;
}
.projLink{ color:rgba(70,212,255,.92); text-decoration:none; font-weight:900; }
.projLink:hover{ text-decoration:underline; }
.linkBtn{
  appearance:none; border:none; background:none; padding:6px 0 0; cursor:pointer; color:rgba(70,212,255,.92); font-weight:900; font-size:12px;
}
.linkBtn:hover{ text-decoration:underline; }
.linkWarn{ color:rgba(255,211,122,.95); font-weight:900; text-decoration:none; }
.linkWarn:hover{ text-decoration:underline; }
.linkDanger{ color:rgba(255,123,123,.96); font-weight:900; text-decoration:none; }
.linkDanger:hover{ text-decoration:underline; }
.btn--sm{ padding:8px 10px; border-radius:12px; font-size:12px; }
.btn--ok{ border-color:rgba(34,197,94,.28); background:rgba(34,197,94,.14); color:rgba(214,255,231,.95); }
.btn--warn{ border-color:rgba(245,158,11,.28); background:rgba(245,158,11,.14); color:rgba(255,234,186,.95); }
.btn--bad{ border-color:rgba(239,68,68,.28); background:rgba(239,68,68,.14); color:rgba(255,210,210,.95); }
.btn--info{ border-color:rgba(59,130,246,.28); background:rgba(59,130,246,.14); color:rgba(219,234,254,.95); }
.projToolbar{ display:flex; flex-wrap:wrap; gap:12px; margin:10px 0 12px; }
.projToolbar__group{ display:flex; align-items:center; gap:10px; }
.tableWrap{ overflow:auto; border-radius:16px; border:1px solid rgba(255,255,255,.10); }
.cell-muted{ color:rgba(167,176,200,.92); }
.cell-strong{ font-weight:950; }
.nowrap{ white-space:nowrap; }
.pillLink{
  display:inline-flex; width:100%; padding:10px 12px; border-radius:14px; background:rgba(70,212,255,.14);
  border:1px solid rgba(70,212,255,.22); color:rgba(233,238,252,.95); text-decoration:none; font-weight:950;
}
.pillLink:hover{ background:rgba(70,212,255,.18); }
.statusPill{
  display:inline-flex; padding:6px 10px; border-radius:999px; background:rgba(59,130,246,.14);
  border:1px solid rgba(59,130,246,.22); color:rgba(219,234,254,.95); font-weight:950; font-size:12px; text-transform:capitalize; white-space:nowrap;
}
.statusPill--accepted{ color:#34d399; border-color:rgba(52,211,153,.25); }
.statusPill--rejected{ color:#fb7185; border-color:rgba(251,113,133,.25); }
.statusPill--converted{ color:#60a5fa; border-color:rgba(96,165,250,.25); }
.statusPill--submitted,.statusPill--reviewed{ color:#fbbf24; border-color:rgba(251,191,36,.25); }
.statusPill--archived,.statusPill--deleted{ border-color:rgba(255,255,255,.18); }
.noteBox{
  margin-top:10px; border:1px solid rgba(255,255,255,.10); border-radius:14px; background:rgba(0,0,0,.22); padding:10px;
}
.noteBox__form{ margin-bottom:10px; }
.noteBox__text{
  width:100%; border-radius:12px; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.28);
  color:rgba(233,238,252,.92); padding:10px 12px; outline:none; margin-bottom:8px;
}
.noteList{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.noteItem{
  border-radius:12px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); padding:10px;
}
.noteItem__meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12px; }
.noteItem__body{ margin-top:6px; color:rgba(233,238,252,.92); }
.noteReply{ margin-top:8px; }
.noteReplies{ margin:10px 0 0; padding:0 0 0 14px; display:flex; flex-direction:column; gap:8px; }
.noteReplyItem{
  border-radius:12px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.02); padding:10px;
}
.uploadForm{
  margin-top:10px; border:1px solid rgba(255,255,255,.10); border-radius:16px; background:rgba(255,255,255,.02); padding:12px;
}
.fileList{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:12px; }
.fileItem{
  border-radius:16px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); padding:12px;
}
.fileItem__row{ display:flex; gap:12px; align-items:flex-start; }
.fileThumb img{
  width:64px; height:64px; border-radius:12px; object-fit:cover; border:1px solid rgba(255,255,255,.14);
}
.fileItem__meta{ flex:1; }
.fileItem__name{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; font-weight:950; }
.fileItem__notes{ margin-top:6px; color:rgba(167,176,200,.92); }
.fileItem__foot{ margin-top:8px; font-size:12px; color:rgba(167,176,200,.92); }
.fileItem__actions{ margin-top:10px; display:flex; gap:14px; align-items:center; }
.tagPill{
  display:inline-flex; padding:4px 8px; border-radius:999px; background:rgba(59,130,246,.14);
  border:1px solid rgba(59,130,246,.22); color:rgba(219,234,254,.95); font-weight:950; font-size:12px;
}
.chipRow{ display:flex; flex-wrap:wrap; gap:10px; }
.chip__dot{ width:10px; height:10px; border-radius:999px; }
.chip__text{ font-weight:950; }
.mileGrid{ display:flex; flex-direction:column; gap:14px; margin-top:10px; }
.mile{
  border-radius:16px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); padding:12px;
}
.mile--ok{ border-color:rgba(34,197,94,.28); background:rgba(34,197,94,.10); }
.mile--bad{ border-color:rgba(239,68,68,.28); background:rgba(239,68,68,.10); }
.mile__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.mile__title{ font-weight:950; color:rgba(70,212,255,.92); }
.mile__date{ color:rgba(167,176,200,.92); font-weight:900; margin-left:8px; }
.mile__actions{ display:flex; gap:12px; align-items:center; white-space:nowrap; }
.mile__list{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.mile__list li{ display:flex; align-items:center; gap:10px; color:rgba(233,238,252,.90); }
.teamList{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.teamList__item{
  border-radius:14px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); padding:10px 12px;
  display:flex; gap:12px; align-items:baseline; flex-wrap:wrap;
}
.teamList__name{ font-weight:950; }
.teamList__status{ color:rgba(167,176,200,.92); font-weight:900; }
.teamList__reason{ color:rgba(167,176,200,.92); }
.teamList__item--owner .teamList__name{ color:rgba(197,91,255,.92); }
.teamList__item--group .teamList__name{ color:rgba(70,212,255,.92); }
.teamList__item--user .teamList__name{ color:rgba(255,211,122,.95); }
.tlWrap{
  border:1px solid rgba(255,255,255,.08); border-radius:16px; overflow:auto; background:rgba(0,0,0,.22); box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.tlTable{
  border-collapse:separate; border-spacing:0; width:max-content; min-width:100%;
}
.tlTable th,.tlTable td{
  border-bottom:1px solid rgba(255,255,255,.06); border-right:1px solid rgba(255,255,255,.05); padding:8px 10px;
  font-size:12px; color:rgba(255,255,255,.86); white-space:nowrap; text-align:center; vertical-align:middle;
}
.tlSticky{
  position:sticky; left:0; z-index:6; text-align:left !important;
  background:linear-gradient(180deg, rgba(16,18,26,.98), rgba(10,12,20,.98));
  border-right:1px solid rgba(70,212,255,.20); min-width:280px;
}
.tlHead th{
  position:sticky; top:0; z-index:5;
  background:linear-gradient(180deg, rgba(12,14,24,.98), rgba(8,10,18,.98));
}
.tlHead .tlSticky{ z-index:7; }
.tlSmall{ font-size:10px; color:rgba(255,255,255,.55); margin-top:6px; }
.tlW0{ background:rgba(255,255,255,.02); }
.tlW1{ background:rgba(255,255,255,.05); }
.tlWeekend{ background:rgba(255,255,255,.08) !important; }
.tlToday{ outline:2px solid rgba(70,212,255,.55); outline-offset:-2px; box-shadow:inset 0 0 0 2px rgba(70,212,255,.55); }
.tlTaskLink{
  display:block; padding:10px 12px; border-radius:12px; background:rgba(70,212,255,.16);
  color:#e9f8ff; text-decoration:none; font-weight:800; border:1px solid rgba(70,212,255,.20);
}
.tlTaskLink:hover{ background:rgba(70,212,255,.26); }
.tlEmpty{ background:rgba(255,255,255,.01); }
.tlBarCell{ padding:0; border:0 !important; outline:0 !important; box-shadow:none !important; }
.tlBar{
  height:32px; display:flex; align-items:center; gap:10px; padding:0 12px; border-radius:12px; font-weight:900; margin:6px;
}
.tlBar--ok{ background:rgba(34,197,94,.88); color:rgba(0,0,0,.86); }
.tlBar--warn{ background:rgba(250,204,21,.90); color:rgba(0,0,0,.86); }
.tlBar--bad{ background:rgba(239,68,68,.90); color:rgba(0,0,0,.90); }
.tlBar--done{ background:rgba(59,130,246,.92); color:rgba(255,255,255,.92); }
.tlBarMeta{ font-weight:900; }
.tlMonthCell{
  text-align:center !important; font-weight:900; letter-spacing:.4px; border-bottom:1px solid rgba(255,255,255,.09);
}
.tlM{ color:rgba(255,255,255,.95); }
.tlM--jan{ background:rgba(89,208,255,.18); border-top:1px solid rgba(34,211,238,.35); }
.tlM--feb{ background:rgba(59,130,246,.16); border-top:1px solid rgba(59,130,246,.35); }
.tlM--mar{ background:rgba(34,197,94,.14); border-top:1px solid rgba(34,197,94,.30); }
.tlM--apr{ background:rgba(20,184,166,.14); border-top:1px solid rgba(20,184,166,.30); }
.tlM--may{ background:rgba(99,102,241,.14); border-top:1px solid rgba(99,102,241,.30); }
.tlM--jun{ background:rgba(244,63,94,.14); border-top:1px solid rgba(244,63,94,.30); }
.tlM--jul{ background:rgba(168,85,247,.14); border-top:1px solid rgba(168,85,247,.30); }
.tlM--aug{ background:rgba(245,158,11,.14); border-top:1px solid rgba(245,158,11,.30); }
.tlM--sep{ background:rgba(234,179,8,.14); border-top:1px solid rgba(234,179,8,.30); }
.tlM--oct{ background:rgba(236,72,153,.14); border-top:1px solid rgba(236,72,153,.30); }
.tlM--nov{ background:rgba(249,115,22,.14); border-top:1px solid rgba(249,115,22,.30); }
.tlM--dec{ background:rgba(197,91,255,.18); border-top:1px solid rgba(132,204,22,.30); }
.calendar-col{ width:40px; min-width:40px; max-width:40px; }
.today-highlight{
  position:relative; outline:2px solid #facc15; outline-offset:-2px; z-index:20;
}
.ikonWrap{ max-width:1200px; margin:0 auto; padding:22px 18px 34px; }
.ikonHead{
  display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:14px;
}
.ikonTitle{
  font-size:32px; font-weight:900; letter-spacing:.2px; margin:0 0 4px; line-height:1.1;
  background:linear-gradient(90deg, var(--brand,#46d4ff), var(--brand2,#c55bff), var(--accent,#ff4fd8));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.ikonSub{ margin:0; color:rgba(255,255,255,.75); }
.ikonActions{ display:flex; align-items:center; gap:10px; }
.ikonFoot{
  margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.roomGrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:14px; }
.roomCard{
  background:rgba(15,18,28,.72); border:1px solid rgba(255,255,255,.10); border-radius:18px; box-shadow:0 10px 30px rgba(0,0,0,.25);
  overflow:hidden; transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.roomCard:hover{ transform:translateY(-1px); border-color:rgba(70,212,255,.24); box-shadow:0 14px 36px rgba(0,0,0,.35); }
.roomPad{ padding:16px; }
.roomTop{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px;
}
.roomName{
  margin:0; font-size:18px; font-weight:900; color:rgba(110,231,255,.95); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.roomDesc{
  margin:6px 0 0; color:rgba(255,255,255,.78); line-height:1.35; font-size:13px; min-height:34px;
}
.presenceBadge{
  display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; font-size:12px;
  font-weight:800; border:1px solid rgba(255,255,255,.12); white-space:nowrap; user-select:none;
}
.presenceBadge.isOn{ background:rgba(34,197,94,.18); color:rgba(255,255,255,.95); }
.presenceBadge.isOff{ background:rgba(239,68,68,.14); color:rgba(255,255,255,.95); }
.badgeDot{
  width:8px; height:8px; border-radius:999px; display:inline-block; box-shadow:0 0 12px rgba(0,0,0,.25);
}
.badgeDot.isOn{ background:#22c55e; }
.badgeDot.isOff{ background:#ef4444; }
.presenceSection{ margin-top:10px; }
.presenceLabel{ margin:0 0 6px; font-size:12px; color:rgba(255,255,255,.70); }
.presenceEmpty{ margin:0; font-size:12px; color:rgba(255,255,255,.55); }
.userChips{ display:flex; flex-wrap:wrap; gap:6px; }
.roomActions{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px;
}
.btnLite{
  display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border-radius:12px;
  border:1px solid rgba(255,255,255,.14); background:rgba(70,212,255,.14); color:rgba(255,255,255,.92);
  font-weight:800; text-decoration:none; cursor:pointer;
}
.btnLite:hover{ background:rgba(70,212,255,.22); text-decoration:none; }
.linkLite{
  background:transparent; border:none; padding:0; color:rgba(255,255,255,.70); text-decoration:underline; cursor:pointer; font-size:12px;
}
.linkLite:hover{ color:rgba(255,255,255,.92); }
.ideasWrap{ max-width:1200px; margin:0 auto; padding:26px 18px; }
.ideasTitle{
  margin:0 0 14px; font-size:32px; font-weight:1000;
  background:linear-gradient(90deg, var(--brand,#46d4ff), var(--brand2,#c55bff), var(--accent,#ff4fd8));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.ideaCard{
  background:rgba(15,17,24,.58); border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.22); margin-bottom:12px;
}
.ideaMeta{ margin-top:4px; font-size:13px; color:rgba(233,238,252,.62); }
.ideaBody{ margin-top:12px; color:rgba(233,238,252,.88); line-height:1.45; white-space:normal; }
.ideaActions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; align-items:center; }
.ideaBtn{
  appearance:none; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); color:rgba(233,238,252,.95);
  border-radius:12px; padding:9px 12px; font-weight:900; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px; transition:.15s ease;
}
.ideaBtn:hover{
  background:rgba(255,255,255,.08); border-color:rgba(70,212,255,.28); transform:translateY(-1px); text-decoration:none;
}
.ideaBtn--ok{ background:rgba(34,197,94,.18); border-color:rgba(34,197,94,.28); }
.ideaBtn--warn{ background:rgba(250,204,21,.14); border-color:rgba(250,204,21,.22); color:rgba(255,245,200,.95); }
.ideaBtn--bad{ background:rgba(239,68,68,.14); border-color:rgba(239,68,68,.22); }
.ideaBtn--link{ background:rgba(59,130,246,.16); border-color:rgba(59,130,246,.22); }
.ideaForm{
  background:rgba(15,17,24,.58); border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.22);
}
.ideaFormGrid{ display:grid; grid-template-columns:1fr; gap:10px; }
.ideaInput,.ideaTextarea{
  width:100%; border-radius:14px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.06);
  color:rgba(233,238,252,.95); padding:10px 12px; outline:none;
}
.ideaTextarea{ min-height:110px; resize:vertical; }
.ideaInput:focus,.ideaTextarea:focus{ border-color:rgba(70,212,255,.28); box-shadow:0 0 0 3px rgba(70,212,255,.12); }
.ideaFormActions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:12px; }
.taskCreateWrap{ width:min(900px, 100%); margin:0 auto; }
.taskCreateWrap form{ width:100%; }
.taskCreateWrap .taskPanel{
  background:rgba(15,17,24,.72); border:1px solid rgba(255,255,255,.10); border-radius:20px; padding:22px; box-shadow:0 18px 45px rgba(0,0,0,.35);
}
.taskCreateWrap .taskGradTitle{
  background:linear-gradient(90deg, var(--brand,#46d4ff), var(--brand2,#c55bff), var(--accent,#ff4fd8));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.taskCreateWrap .taskFormCard{
  max-width:720px; margin:0 auto; padding:18px; border-radius:18px; background:rgba(20,24,36,.65); border:1px solid rgba(255,255,255,.10);
}
.taskCreateWrap .taskField{ margin-bottom:14px; }
.taskCreateWrap .taskLabel{ display:block; margin-bottom:6px; font-weight:800; color:rgba(233,238,252,.9); }
.taskCreateWrap .taskInput,
.taskCreateWrap .taskTextarea,
.taskCreateWrap .taskSelect,
.taskCreateWrap input,
.taskCreateWrap textarea,
.taskCreateWrap select{
  width:100% !important; border-radius:12px !important; padding:10px 12px !important; background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.12) !important; color:rgba(233,238,252,.95) !important; outline:none !important; box-shadow:none !important;
  background-image:none !important;
}
.taskCreateWrap .taskInput:focus,
.taskCreateWrap .taskTextarea:focus,
.taskCreateWrap .taskSelect:focus,
.taskCreateWrap input:focus,
.taskCreateWrap textarea:focus,
.taskCreateWrap select:focus{ border-color:rgba(70,212,255,.35) !important; }
.taskCreateWrap .taskCheckRow{ display:flex; align-items:center; gap:10px; margin-top:6px; margin-bottom:16px; }
.taskCreateWrap .taskCheckbox{ width:16px; height:16px; }
.taskCreateWrap .taskCheckLabel{ color:rgba(233,238,252,.9); font-weight:700; }
.taskCreateWrap .taskActions{ display:flex; gap:12px; align-items:center; padding-top:6px; }
.taskCreateWrap label{ display:block; margin-top:10px; margin-bottom:6px; font-weight:800; color:rgba(233,238,252,.9); }
.taskCreateWrap .ts-control{
  background:rgba(255,255,255,.06) !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:14px !important;
  padding:8px 10px !important; box-shadow:none !important; min-height:44px;
}
.taskCreateWrap .ts-control input{ color:rgba(233,238,252,.95) !important; }
.taskCreateWrap .ts-dropdown{
  background:rgba(15,17,24,.98) !important; border:1px solid rgba(255,255,255,.10) !important; border-radius:14px !important;
}
.taskCreateWrap .ts-dropdown .option{ color:rgba(233,238,252,.92) !important; }
.taskCreateWrap .ts-dropdown .option.active{ background:rgba(70,212,255,.16) !important; }
.taskCreateWrap .ts-wrapper.multi .ts-control > div{
  background:rgba(70,212,255,.14) !important; border:1px solid rgba(70,212,255,.20) !important; color:rgba(233,238,252,.95) !important; border-radius:999px !important;
}
.page-wrap{ max-width:1200px; margin:0 auto; padding:18px; }
.page-card{
  border-radius:18px; padding:18px; background:rgba(0,0,0,.10); border:1px solid var(--border, rgba(255,255,255,.08)); box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.page-bar{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px;
}
.page-title{
  margin:0; font-size:34px; line-height:1.15; letter-spacing:.2px; display:flex; align-items:center; gap:10px;
}
.page-title .emoji{ font-size:28px; }
.page-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.page-title span:last-child{
  background:linear-gradient(90deg, var(--brand,#46d4ff), var(--accent,#ff4fd8));
  -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 0 12px rgba(197,91,255,.18));
}
.table-wrap{
  overflow-x:auto; border-radius:14px; border:1px solid var(--border, rgba(255,255,255,.08));
  background:
    radial-gradient(900px 220px at 20% -40px, rgba(89,208,255,.12), transparent 60%),
    radial-gradient(700px 220px at 80% -40px, rgba(197,91,255,.12), transparent 60%),
    rgba(0,0,0,.10);
}
.igc-table{ width:100%; border-collapse:collapse; min-width:980px; }
.igc-table thead th{
  text-align:left; font-size:12px; letter-spacing:.08em; text-transform:uppercase; padding:12px 14px;
  border-bottom:1px solid var(--border, rgba(255,255,255,.08)); background:rgba(255,255,255,.03); color:var(--muted, rgba(255,255,255,.75));
}
.igc-table tbody td{
  padding:14px; border-bottom:1px solid rgba(255,255,255,.06); vertical-align:middle; color:var(--ink,#e9eefc);
}
.igc-table tbody tr:hover{ background:rgba(255,255,255,.03); }
.mono{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size:12.5px; opacity:.95;
}
.bg-gray-700{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10); color:var(--ink); }
.bg-gray-700::placeholder{ color:rgba(167,176,200,.8); }
.bg-green-500{ background:rgba(34,197,94,.26); border:1px solid rgba(34,197,94,.32); }
.hover\:bg-green-600:hover,.hover\:bg-green-500:hover,.hover\:bg-green-700:hover{ filter:brightness(1.10); }
form.bg-gray-800{
  border-radius:18px;
  background:
    radial-gradient(700px 220px at 30% -40px, rgba(70,212,255,.10), transparent 60%),
    radial-gradient(700px 220px at 80% -40px, rgba(197,91,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  box-shadow:var(--shadow);
}
form img{ max-width:180px; height:auto; }
.auth-page{
  display:flex; align-items:center; justify-content:center; min-height:calc(100svh - 64px); padding:16px;
}
.auth-page form.bg-gray-800{
  width:100%; max-width:28rem; border-radius:18px; border:1px solid rgba(70,212,255,.45); padding:24px;
}
.auth-page input[type="email"],.auth-page input[type="password"]{
  width:100%; min-height:44px; font-size:16px; padding:10px 12px; border-radius:12px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:var(--ink); outline:none;
}
.auth-page input[type="email"]::placeholder,.auth-page input[type="password"]::placeholder{ color:rgba(167,176,200,.8); }
.auth-page input[type="email"]:focus,.auth-page input[type="password"]:focus{
  box-shadow:var(--focus); border-color:rgba(70,212,255,.35);
}
.auth-page button[type="submit"]{
  width:100%; min-height:46px; margin-top:10px; border-radius:14px; font-weight:900;
  border:1px solid rgba(34,197,94,.32); background:rgba(34,197,94,.26); color:var(--ink); cursor:pointer;
}
.auth-page button[type="submit"]:hover{ filter:brightness(1.10); }
.auth-page .text-yellow-400 a{ color:#ffd37a; font-weight:800; }
.auth-page .auth-logo-wrap{
  width:100%; display:flex; justify-content:center; align-items:center; margin:0 0 14px 0;
}
.auth-page .auth-logo{ display:block; max-width:180px; height:auto; }
.igm-has-player{ padding-bottom:76px; }
#globalPlayer{ position:fixed; left:0; right:0; bottom:0; z-index:2147483000; }
#globalPlayer,#globalPlayer *{ pointer-events:auto; }
#gp-bar{ padding:0; background:transparent; }
#gp-bar .gp-surface{
  width:clamp(340px, 92vw, 1200px); margin:0 auto; border-top-left-radius:18px; border-top-right-radius:18px;
  overflow:hidden; background:linear-gradient(135deg, var(--brand-soft) 0%, var(--brand) 38%, var(--accent) 100%);
  border-top:1px solid #2b2d3a; box-shadow:0 -10px 28px rgba(0,0,0,.45), 0 -1px 0 rgba(255,255,255,.03) inset;
}
#gp-bar .gp-surface > .wrap{
  padding:10px 12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
#globalPlayer .iconbtn{
  width:34px; height:34px; border-radius:12px; border:1px solid #2b2d3a; background:#10121a; color:#f0f1f7;
  display:inline-flex; align-items:center; justify-content:center; transition:background .15s ease, transform .05s ease, box-shadow .12s ease;
}
#globalPlayer .iconbtn:hover{ background:#161927; }
#globalPlayer .iconbtn:active{ transform:translateY(1px); }
#btn-shuffle[aria-pressed="true"]{ box-shadow:0 0 0 2px #4e44a8 inset; background:#1c1542; }
#globalPlayer .chip{
  padding:6px 12px; border:1px solid #2b2d3a; border-radius:10px; background:#0f1014; color:#eaeaea; cursor:pointer;
}
#globalPlayer .gp-now{ display:flex; align-items:center; gap:10px; min-width:200px; flex:1; }
#gp-art{
  width:28px; height:28px; border-radius:6px; border:1px solid rgba(255,255,255,.06); background:#0f0f12; object-fit:cover; display:block;
}
#gp-title{
  flex:1; color:#f0f1f7; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:120px; font-weight:600; letter-spacing:.2px;
}
#globalPlayer .meter{ display:flex; align-items:center; gap:10px; min-width:260px; flex:0 0 auto; max-width:540px; }
#gp-time{
  color:var(--gp-time-color); font-variant-numeric:tabular-nums; white-space:nowrap; line-height:1;
  text-shadow:0 1px 0 rgba(255,255,255,.18), 0 0 6px rgba(0,0,0,.25); mix-blend-mode:multiply;
}
#globalPlayer input[type="range"]{
  appearance:none; height:8px; border-radius:999px; outline:none; border:1px solid #00000040;
  background:linear-gradient(90deg, var(--accent) var(--fill,0%), #202231 var(--fill,0%));
}
#globalPlayer input[type="range"]::-webkit-slider-thumb{
  appearance:none; width:16px; height:16px; border-radius:50%; background:#ffffff; border:2px solid #9a86ff; box-shadow:0 0 0 3px rgba(124,97,255,.18);
}
#globalPlayer input[type="range"]::-moz-range-thumb{
  width:16px; height:16px; border-radius:50%; background:#fff; border:2px solid #9a86ff; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
#gp-list{ flex:1 1 auto; overflow:auto; -webkit-overflow-scrolling:touch; }
#gp-list .row-played{ opacity:.55; }
#globalPlayer.remote #gp-title::after{
  content:" (other tab)"; color:#8f8fa3; font-weight:400; margin-left:6px; font-size:.95em;
}
.gp-drawer{
  position:fixed; left:50%; transform:translateX(-50%); bottom:64px; display:none; max-height:44vh;
  min-width:360px; max-width:860px; background:#141414; border:1px solid #2a2a2a; border-radius:12px;
  box-shadow:0 12px 28px #000a; z-index:2147483600; overflow:hidden; overflow-x:hidden; flex-direction:column; -webkit-overflow-scrolling:touch;
}
.gp-drawer-head{
  position:sticky; top:0; z-index:5; display:flex; gap:8px; align-items:center; justify-content:space-between;
  padding:8px 10px; border-bottom:1px solid #2a2a2a;
  background:linear-gradient(135deg, var(--brand-soft) 0%, var(--brand) 38%, var(--accent) 100%);
  border-top-left-radius:12px; border-top-right-radius:12px;
}
.gp-drawer-head #gp-plname,.gp-drawer-head .gp-actions .chip{ color:#fff; }
.gp-drawer-head .chip{ background:rgba(0,0,0,.22); border-color:rgba(255,255,255,.22); }
.gp-drawer-head .chip:hover{ background:rgba(0,0,0,.32); }
.gp-actions{ display:flex; gap:6px; flex-wrap:wrap; }
.quick-cards{ margin-top:16px; }
.qc-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:14px; }
.qc-card{
  display:block; padding:14px 16px; border:var(--card-border-weight) solid transparent; border-radius:12px;
  background:linear-gradient(var(--card-bg), var(--card-bg)) padding-box, var(--igc-card-border) border-box;
  box-shadow:0 2px 6px rgba(0,0,0,.35); color:var(--text); text-decoration:none;
  transition:transform .08s ease, box-shadow .15s ease, filter .15s ease;
}
.qc-card:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 10px rgba(0,0,0,.35), 0 8px 28px rgba(31,108,255,.15), 0 8px 28px rgba(255,79,216,.12);
  text-decoration:none;
}
.qc-title{ font-weight:700; margin-bottom:.25rem; }
.qc-copy{ color:var(--text-dim); }
body.igc-border-solid{ --igc-card-border: linear-gradient(var(--brand), var(--brand)); }
body.igc-border-accent{ --igc-card-border: linear-gradient(var(--accent), var(--accent)); }
.album-card,.playlist-card,.media-card{
  position:relative; border:var(--card-border-weight) solid transparent; border-radius:12px;
  background:linear-gradient(var(--card-bg), var(--card-bg)) padding-box, var(--igc-card-border) border-box;
  overflow:hidden; transition:transform .08s ease, box-shadow .15s ease, filter .15s ease;
}
.album-card:hover,.playlist-card:hover,.media-card:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 10px rgba(0,0,0,.35), 0 8px 28px rgba(31,108,255,.15), 0 8px 28px rgba(255,79,216,.12);
}
.pl-art{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:12px; background:#0f0f12; }
.btn-sm{ padding:6px 10px; font-size:.9rem; border-radius:8px; }
#party-banner.card{ padding:14px; }
.news-article{ padding:18px; }
.news-hero{ display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.news-title{
  margin:0; font-size:clamp(1.7rem, 2.6vw, 2.6rem); letter-spacing:.2px; line-height:1.12;
}
.news-meta{
  display:flex; gap:10px; align-items:center; flex-wrap:wrap; color:var(--text-dim); font-size:.95rem;
}
.news-pill{
  display:inline-flex; align-items:center; gap:8px; padding:7px 11px; border-radius:999px;
  border:1px solid rgba(255,255,255,.12); background:rgba(12,12,18,.45); backdrop-filter:blur(10px);
}
.news-divider{
  height:1px; background:linear-gradient(90deg, transparent, rgba(70,212,255,.6), rgba(255,79,216,.6), transparent);
  opacity:.85; margin:12px 0 18px;
}
.news-body{ color:var(--text); line-height:1.72; font-size:1.02rem; max-width:78ch; }
.news-body > *{ margin:0 0 12px; }
.news-body p{ margin:0 0 14px; color:rgba(230,230,240,.92); }
.news-body p:first-child{ font-size:1.08rem; font-weight:600; color:#fff; letter-spacing:.2px; }
.news-body h3{
  margin:18px 0 10px; font-size:1.18rem; line-height:1.25; letter-spacing:.2px; color:#fff; position:relative; padding-left:12px;
}
.news-body h3::before{
  content:""; position:absolute; left:0; top:.25em; width:4px; height:1.05em; border-radius:99px;
  background:linear-gradient(180deg, var(--accent-2), var(--accent)); opacity:.9;
}
.news-body ol,.news-body ul{ margin:10px 0 16px 1.25rem; padding:0; }
.news-body li{ margin:8px 0; padding-left:4px; }
.news-body ol li::marker{ font-weight:800; color:rgba(70,212,255,.9); }
.news-body a{
  color:var(--link); text-decoration:none; border-bottom:1px solid rgba(77,166,255,.38); padding-bottom:1px;
}
.news-body a:hover{ border-bottom-color:rgba(128,193,255,.95); }
.news-body strong{ color:#fff; font-weight:800; }
.news-body em,.news-body i{ color:rgba(255,255,255,.92); font-style:italic; }
.news-body a[target="_blank"]::after{ content:"↗"; font-size:.9em; margin-left:6px; opacity:.7; }
.news-actions{ display:flex; gap:10px; margin-top:18px; }

/* =========================================================
   12) MOBILE
   =======================================================*/
button,.btn,.toolBtn,a{ -webkit-tap-highlight-color:transparent; }
@media (min-width: 961px){
  .site-header.is-scrolled .header-row{ min-height:60px; transition:min-height .18s ease; }
  .site-header.is-scrolled .brand-mark{ width:44px; height:44px; transition:.18s; }
  .site-header.is-scrolled .brand-word{ font-size:1.05rem; }
}
@media (max-width: 1200px){ .col-prod,.col-stage{ display:none; } }
@media (max-width: 1100px){
  .col-4{ grid-column:span 6 / span 6; }
  .toolsGrid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .projCards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 980px){
  .projMeta{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ikonWrap{ padding-top:26px; }
  .roomPad{ padding:18px; }
  .roomName{ font-size:19px; }
}
@media (max-width: 960px){
  .nav-toggle{ display:inline-flex; }
  .main-nav{ display:none; }
  .main-nav[data-mobile]{
    position:absolute; top:calc(100% + 8px); right:16px; left:auto; width:min(90vw, 320px); max-height:70vh;
    flex-direction:column; align-items:stretch; gap:.5rem; padding:10px;
    background:linear-gradient(180deg, var(--panel-soft), var(--panel)); border:1px solid var(--border-subtle);
    border-radius:12px; box-shadow:0 18px 45px rgba(0,0,0,.55); z-index:1100; overflow:auto;
  }
  .nav-toggle[aria-expanded="true"] + .main-nav[data-mobile]{ display:flex; }
  .main-nav[data-mobile] .nav.pill{ display:block; width:100%; text-align:left; }
}
@media (max-width: 900px){
  .col-domain{ display:none; }
  .websites-view .site-meta,
  .websites-view .grid2,
  .websites-view .grid-3{ grid-template-columns:1fr; }
}
@media (max-width: 820px){
  .container{ width:calc(100% - 20px); margin:14px auto 48px; }
  .grid{ gap:12px; }
  .col-4,.col-6,.col-12{ grid-column:span 12 / span 12; }
  .ikonic-header{ padding:10px 12px; gap:10px; flex-wrap:wrap; }
  .ikonic-header-left{ flex:1 1 auto; min-width:0; }
  .ikonic-logo{ width:30px; height:30px; border-radius:10px; }
  .ikonic-portal-title{ font-size:18px; white-space:nowrap; }
  .ikonic-header-right{ width:100%; justify-content:space-between; gap:10px; }
  .ikonic-user-info{ padding:6px 10px; flex:1 1 auto; min-width:0; }
  .ikonic-username{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:140px; }
  .ikonic-logout,.ikonic-login{ padding:.55rem .8rem; font-size:13px; white-space:nowrap; }
  .card{ margin:14px 0; padding:16px; }
  .cardHead{ flex-direction:column; align-items:flex-start; }
  .actions,.actions-right{ width:100%; justify-content:flex-start; }
  .btn{ width:auto; min-height:44px; padding:.7rem 1rem; border-radius:14px; }
  .toolBtn{ min-height:48px; padding:14px; }
  .toolsGrid{ grid-template-columns:1fr; gap:10px; }
  .row{ flex-direction:column; align-items:stretch; gap:8px; }
  .rowMain{ width:100%; }
  .date{ align-self:flex-start; }
  .card > .btn,.shortcutCard > .btn,.shortcutCard .actions{ width:100%; margin-left:0; }
  .shortcutCard .actions .btn{ width:100%; }
  .halo-fab{ right:14px; bottom:14px; padding:12px 14px; }
  .projNew{ margin-left:0; }
  .projSearch{ flex:1 1 100%; }
  .projControls{ gap:8px; }
  .ctrl{ width:100%; justify-content:space-between; }
  .seg{ width:100%; }
  .segBtn{ flex:1 1 50%; justify-content:center; }
  .projCards{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .auth-page{ min-height:calc(100svh - 64px); padding:14px; }
  .p-responsive{ padding:16px; }
  .max-w-md{ max-width:92vw; }
  .login-logo,.login-hero,.login-brand,.auth-logo,.auth-hero{
    display:block; margin:18px auto 14px; max-width:320px;
  }
  input[type="email"],input[type="text"],input[type="password"],input[type="number"],select,textarea{
    width:100%; min-height:44px; font-size:16px; padding:10px 12px; border-radius:12px;
  }
  .login-actions button,.login-actions .btn,form button[type="submit"]{
    width:100%; min-height:46px; margin-top:10px;
  }
  form{ max-width:420px; margin:0 auto; }
  .auth-footer,.login-footer,footer{
    padding:14px 12px; text-align:center; color:rgba(167,176,200,.85);
  }
}
@media (max-width: 800px){ .chatShell{ height:auto; } }
@media (max-width: 768px){
  .chat-input-container{ flex-direction:column; align-items:stretch; }
  .chat-input-container textarea{ width:100%; margin-bottom:.5rem; min-height:80px; }
  .chat-input-container input[type="file"]{ margin-bottom:.5rem; }
  .chat-input-container button{ width:100%; }
}
@media (max-width: 720px){ .page-title{ font-size:26px; } }
@media (max-width: 640px){ .wrap{ padding:12px; } .projMeta{ grid-template-columns:1fr; } }

/* =========================================================
   13) IGM ADMIN PAGES
   =======================================================*/

.igm-page{
  --igm-page-accent: var(--brand);
  --igm-page-accent-soft: rgba(70,212,255,.18);
  --igm-page-accent-border: rgba(70,212,255,.30);
  --igm-page-accent-glow: rgba(70,212,255,.18);
}

.igm-page.igm-theme-blue{
  --igm-page-accent: #59d0ff;
  --igm-page-accent-soft: rgba(89,208,255,.18);
  --igm-page-accent-border: rgba(89,208,255,.34);
  --igm-page-accent-glow: rgba(89,208,255,.22);
}

.igm-page.igm-theme-purple{
  --igm-page-accent: #8c7dff;
  --igm-page-accent-soft: rgba(140,125,255,.18);
  --igm-page-accent-border: rgba(140,125,255,.34);
  --igm-page-accent-glow: rgba(140,125,255,.22);
}

.igm-page.igm-theme-pink{
  --igm-page-accent: #ff4fd8;
  --igm-page-accent-soft: rgba(255,79,216,.18);
  --igm-page-accent-border: rgba(255,79,216,.34);
  --igm-page-accent-glow: rgba(255,79,216,.22);
}

.igm-page.igm-theme-green{
  --igm-page-accent: #22c55e;
  --igm-page-accent-soft: rgba(34,197,94,.18);
  --igm-page-accent-border: rgba(34,197,94,.34);
  --igm-page-accent-glow: rgba(34,197,94,.22);
}

.igm-page.igm-theme-orange{
  --igm-page-accent: #f97316;
  --igm-page-accent-soft: rgba(249,115,22,.18);
  --igm-page-accent-border: rgba(249,115,22,.34);
  --igm-page-accent-glow: rgba(249,115,22,.22);
}

.igm-page.igm-theme-yellow{
  --igm-page-accent: #eab308;
  --igm-page-accent-soft: rgba(234,179,8,.18);
  --igm-page-accent-border: rgba(234,179,8,.34);
  --igm-page-accent-glow: rgba(234,179,8,.22);
}

/* Shared admin page shell */
.igm-admin-page-wrap{
  max-width:1200px;
  margin:0 auto;
  padding:24px;
}

.igm-admin-card{
  background:
    radial-gradient(900px 260px at 10% -10%, var(--igm-page-accent-soft), transparent 60%),
    linear-gradient(145deg,#0f172a,#0b1220);
  border:1px solid var(--igm-page-accent-border);
  border-radius:18px;
  padding:18px;
  color:#eef4ff;
  margin-bottom:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}

.igm-admin-page-title{
  margin:0;
  font-size:clamp(1.9rem,2.8vw,2.7rem);
  line-height:1.05;
  font-weight:1000;
  color:var(--igm-page-accent);
}

.igm-admin-page-subtitle{
  margin-top:8px;
  color:rgba(220,228,255,.78);
  font-size:.98rem;
}

.igm-admin-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.igm-admin-toolbar-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.igm-page .btn:hover{
  border-color:var(--igm-page-accent-border);
  color:var(--igm-page-accent);
  box-shadow:0 0 0 1px var(--igm-page-accent-glow) inset;
}

.igm-page input:focus,
.igm-page select:focus,
.igm-page textarea:focus{
  outline:none;
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
}

.igm-admin-tier-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
}

.igm-admin-tier-box{
  position:relative;
  border-radius:16px;
  padding:16px;
  background:linear-gradient(145deg,#0b1324,#0a1020);
  border:1px solid var(--igm-page-accent-border);
  transition:all .25s ease;
  overflow:hidden;
}

.igm-admin-tier-box::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:16px;
  padding:1px;
  background:linear-gradient(120deg, var(--igm-page-accent), transparent 60%);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.28;
}

.igm-admin-tier-box:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 30px rgba(0,0,0,.45);
}

.igm-admin-tier-name{
  font-size:1.1rem;
  font-weight:900;
  color:var(--igm-page-accent);
}

.igm-admin-tier-price{
  font-size:1.2rem;
  font-weight:900;
  color:#fff;
  margin:8px 0 6px;
}

.igm-admin-tier-price small{
  font-size:.75rem;
  color:#9fb0d2;
}

.igm-admin-kv{
  font-size:.92rem;
  margin-top:8px;
  display:grid;
  gap:4px;
  color:#dbe7ff;
}

.igm-admin-muted{
  color:#8fa3c7;
  font-size:.9rem;
}

@media (max-width: 720px){
  .igm-admin-page-wrap{ padding:16px 12px 28px; }
  .igm-admin-card{ padding:16px; }
}


.igm-dashboard-wrap{
  max-width:1320px;
  margin:0 auto;
  padding:24px 18px 36px;
}

.igm-dashboard-hero{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(70,212,255,.24);
  background:
    radial-gradient(900px 260px at 0% -10%, rgba(70,212,255,.12), transparent 60%),
    radial-gradient(900px 260px at 100% -10%, rgba(197,91,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.38);
  padding:28px 26px;
  margin-bottom:22px;
}

.igm-dashboard-hero::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, var(--brand), var(--accent), var(--brand-soft));
  opacity:.95;
}

.igm-dashboard-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(233,238,252,.82);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
}

.igm-dashboard-title{
  margin:0;
  font-size:clamp(2rem, 3vw, 3rem);
  line-height:1.05;
  font-weight:1000;
  letter-spacing:.2px;
  background:linear-gradient(90deg, var(--brand), var(--brand2), var(--accent));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.igm-dashboard-sub{
  margin-top:10px;
  color:rgba(233,238,252,.82);
  font-size:1.02rem;
  line-height:1.5;
  max-width:820px;
}

.igm-dashboard-card{
  border-radius:22px;
  border:1px solid rgba(70,212,255,.18);
  background:
    radial-gradient(900px 260px at 10% -10%, rgba(70,212,255,.08), transparent 60%),
    radial-gradient(900px 260px at 90% -10%, rgba(197,91,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.34);
  padding:20px;
}

.igm-dashboard-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.igm-dashboard-head-title{
  margin:0;
  font-size:1.4rem;
  font-weight:950;
  color:rgba(233,238,252,.96);
}

.igm-dashboard-head-copy{
  margin-top:4px;
  color:rgba(167,176,200,.86);
  font-size:.95rem;
}

.igm-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:16px;
}

.igm-tile{
  display:flex;
  flex-direction:column;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(70,212,255,.07), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(197,91,255,.07), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  box-shadow:0 10px 24px rgba(0,0,0,.25);
  text-decoration:none !important;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.igm-tile:hover{
  transform:translateY(-3px);
  text-decoration:none !important;
}

.igm-icon-shell{
  height:90px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:10px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 30% 20%, rgba(70,212,255,.14), transparent 42%),
    radial-gradient(circle at 70% 80%, rgba(255,79,216,.12), transparent 44%),
    linear-gradient(135deg, rgba(13,17,26,.95), rgba(20,24,36,.88));
}

.igm-icon{
  font-size:2.4rem;
}

.igm-tile-title{
  font-size:1.05rem;
  margin:0 0 4px;
  font-weight:900;
  color:rgba(255,255,255,.95);
}

.igm-tile-copy{
  color:rgba(200,210,235,.75);
}

.igm-tile-foot{
  color:rgba(167,176,200,.6);
  margin-top:auto;
  padding-top:8px;
}

/* Tile variants */
.igm-tile.blue{
  border-color:rgba(70,212,255,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(70,212,255,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(70,212,255,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.igm-tile.purple{
  border-color:rgba(140,125,255,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(140,125,255,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(140,125,255,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.igm-tile.pink{
  border-color:rgba(255,79,216,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(255,79,216,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(255,79,216,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.igm-tile.green{
  border-color:rgba(34,197,94,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(34,197,94,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(34,197,94,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.igm-tile.orange{
  border-color:rgba(249,115,22,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(249,115,22,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(249,115,22,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.igm-tile.yellow{
  border-color:rgba(234,179,8,.35);
  background:
    radial-gradient(700px 200px at 20% -10%, rgba(234,179,8,.08), transparent 60%),
    radial-gradient(700px 200px at 80% -10%, rgba(234,179,8,.05), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}

/* icon/title color by tile */
.igm-tile.blue .igm-icon,
.igm-tile.blue .igm-tile-title{ color:#59d0ff; }

.igm-tile.purple .igm-icon,
.igm-tile.purple .igm-tile-title{ color:#8c7dff; }

.igm-tile.pink .igm-icon,
.igm-tile.pink .igm-tile-title{ color:#ff4fd8; }

.igm-tile.green .igm-icon,
.igm-tile.green .igm-tile-title{ color:#22c55e; }

.igm-tile.orange .igm-icon,
.igm-tile.orange .igm-tile-title{ color:#f97316; }

.igm-tile.yellow .igm-icon,
.igm-tile.yellow .igm-tile-title{ color:#eab308; }

/* hover glow by tile */
.igm-tile.blue:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(70,212,255,.25);
}
.igm-tile.purple:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(140,125,255,.25);
}
.igm-tile.pink:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(255,79,216,.25);
}
.igm-tile.green:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(34,197,94,.25);
}
.igm-tile.orange:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(249,115,22,.25);
}
.igm-tile.yellow:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.40), 0 0 20px rgba(234,179,8,.25);
}

@media (max-width:1100px){
  .igm-dashboard-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width:720px){
  .igm-dashboard-wrap{
    padding:16px 12px 28px;
  }

  .igm-dashboard-hero{
    padding:20px 18px;
    border-radius:18px;
  }

  .igm-dashboard-card{
    padding:16px;
    border-radius:18px;
  }

  .igm-dashboard-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .igm-tile{
    min-height:auto;
    padding:16px;
    border-radius:18px;
  }

  .igm-icon{
    font-size:3rem;
  }

  .igm-dashboard-head{
    margin-bottom:14px;
  }
}

/* =========================================================
   IGM CONTENT PAGES
   =======================================================*/

.igm-content-wrap{
  max-width:1080px;
  margin:0 auto;
  padding:24px 18px 36px;
}

.igm-content-hero{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(900px 260px at 0% -10%, var(--igm-page-accent-soft), transparent 60%),
    radial-gradient(900px 260px at 100% -10%, rgba(197,91,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.34);
  padding:26px 24px;
  margin-bottom:20px;
}

.igm-content-hero::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, var(--igm-page-accent), var(--brand2), var(--accent));
  opacity:.95;
}

.igm-content-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(233,238,252,.82);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
}

.igm-content-title{
  margin:0;
  font-size:clamp(1.9rem, 3vw, 2.6rem);
  line-height:1.05;
  font-weight:1000;
  letter-spacing:.2px;
  color:var(--igm-page-accent);
}

.igm-content-sub{
  margin-top:10px;
  color:rgba(233,238,252,.80);
  font-size:1rem;
  line-height:1.5;
  max-width:760px;
}

.igm-content-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}

.igm-content-link-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:rgba(233,238,252,.92);
  font-weight:800;
  text-decoration:none !important;
  transition:all .15s ease;
}

.igm-content-link-btn:hover{
  transform:translateY(-1px);
  border-color:var(--igm-page-accent-border);
  background:var(--igm-page-accent-soft);
  box-shadow:0 0 16px var(--igm-page-accent-glow);
  color:var(--igm-page-accent);
}

.igm-content-form-card{
  border-radius:22px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(900px 260px at 10% -10%, var(--igm-page-accent-soft), transparent 60%),
    radial-gradient(900px 260px at 90% -10%, rgba(197,91,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.30);
  padding:22px;
}

.igm-content-form-head{
  margin-bottom:18px;
}

.igm-content-form-title{
  margin:0;
  font-size:1.35rem;
  font-weight:950;
  color:rgba(233,238,252,.96);
}

.igm-content-form-copy{
  margin-top:6px;
  color:rgba(167,176,200,.84);
  font-size:.95rem;
}

.igm-content-flash-ok{
  margin-bottom:16px;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(34,197,94,.30);
  background:rgba(34,197,94,.10);
  color:#d1fae5;
  font-weight:700;
}

.igm-content-form{
  display:grid;
  gap:16px;
}

.igm-content-field{
  display:grid;
  gap:8px;
}

.igm-content-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(233,238,252,.72);
  font-weight:800;
}

.igm-content-input,
.igm-content-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:14px;
  padding:12px 14px;
  font-size:14px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-content-textarea{
  min-height:220px;
  resize:vertical;
  line-height:1.5;
}

.igm-content-input:hover,
.igm-content-textarea:hover{
  border-color:rgba(255,255,255,.18);
}

.igm-page .igm-content-input:focus,
.igm-page .igm-content-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:
    0 0 0 3px var(--igm-page-accent-soft),
    0 0 18px var(--igm-page-accent-glow);
  background:rgba(10,12,18,.60);
}

.igm-content-form-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-top:4px;
}

.igm-content-help{
  color:rgba(167,176,200,.76);
  font-size:.9rem;
}

@media (max-width:720px){
  .igm-content-wrap{
    padding:16px 12px 28px;
  }

  .igm-content-hero,
  .igm-content-form-card{
    padding:18px;
    border-radius:18px;
  }

  .igm-content-form-footer{
    align-items:flex-start;
    flex-direction:column;
  }

  .igm-content-textarea{
    min-height:180px;
  }
}

/* =========================================================
   IGM TRACKS PAGE
   =======================================================*/

.igm-page-wrap{
  max-width:1200px;
  margin:0 auto;
  padding:24px 18px 36px;
}

.igm-page-hero{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(900px 260px at 0% -10%, var(--igm-page-accent-soft), transparent 60%),
    radial-gradient(900px 260px at 100% -10%, rgba(197,91,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.34);
  padding:26px 24px;
  margin-bottom:20px;
}

.igm-page-hero::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, var(--igm-page-accent), var(--brand2), var(--accent));
  opacity:.95;
}

.igm-page-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(233,238,252,.82);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
}

.igm-page-title{
  margin:0;
  font-size:clamp(1.9rem, 3vw, 2.6rem);
  line-height:1.05;
  font-weight:1000;
  letter-spacing:.2px;
  color:var(--igm-page-accent);
}

.igm-page-sub{
  margin-top:10px;
  color:rgba(233,238,252,.80);
  font-size:1rem;
  line-height:1.5;
  max-width:760px;
}

.igm-page-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}

.igm-link-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:rgba(233,238,252,.92);
  font-weight:800;
  text-decoration:none !important;
  transition:all .15s ease;
}

.igm-link-btn:hover{
  transform:translateY(-1px);
  border-color:var(--igm-page-accent-border);
  background:var(--igm-page-accent-soft);
  box-shadow:0 0 16px var(--igm-page-accent-glow);
  color:var(--igm-page-accent);
}

.igm-card{
  border-radius:22px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(900px 260px at 10% -10%, var(--igm-page-accent-soft), transparent 60%),
    radial-gradient(900px 260px at 90% -10%, rgba(197,91,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  box-shadow:0 18px 50px rgba(0,0,0,.30);
  padding:22px;
  margin-bottom:18px;
}

.igm-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.igm-card-title{
  margin:0;
  font-size:1.35rem;
  font-weight:950;
  color:rgba(233,238,252,.96);
}

.igm-card-copy{
  margin-top:6px;
  color:rgba(167,176,200,.84);
  font-size:.95rem;
}

.igm-flash{
  margin-bottom:16px;
  padding:14px 16px;
  border-radius:16px;
  font-weight:700;
  border:1px solid rgba(255,255,255,.14);
}

.igm-flash.ok{
  border-color:rgba(34,197,94,.30);
  background:rgba(34,197,94,.10);
  color:#d1fae5;
}

.igm-flash.err{
  border-color:rgba(239,68,68,.30);
  background:rgba(239,68,68,.10);
  color:#fee2e2;
}

.igm-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.igm-field{
  display:grid;
  gap:8px;
}

.igm-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(233,238,252,.72);
  font-weight:800;
}

.igm-input,
.igm-select,
.igm-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:14px;
  padding:12px 14px;
  font-size:14px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-textarea{
  min-height:140px;
  resize:vertical;
  line-height:1.5;
}

.igm-textarea.lyrics{
  min-height:260px;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
}

.igm-input:hover,
.igm-select:hover,
.igm-textarea:hover{
  border-color:rgba(255,255,255,.18);
}

.igm-page .igm-input:focus,
.igm-page .igm-select:focus,
.igm-page .igm-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:
    0 0 0 3px var(--igm-page-accent-soft),
    0 0 18px var(--igm-page-accent-glow);
  background:rgba(10,12,18,.60);
}

.igm-btn-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.igm-kpi-list{
  display:grid;
  gap:10px;
}

.igm-kpi-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(255,255,255,.03);
  padding:12px 14px;
}

.igm-rank{
  min-width:52px;
  text-align:center;
  padding:8px 10px;
  border-radius:12px;
  background:var(--igm-page-accent-soft);
  border:1px solid var(--igm-page-accent-border);
  color:var(--igm-page-accent);
  font-weight:950;
}

.igm-chip{
  display:inline-flex;
  align-items:center;
  padding:5px 9px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#eaf0ff;
}

.igm-chip--genre{
  border-color:rgba(89,208,255,.25);
  background:rgba(89,208,255,.10);
  color:#9ae6ff;
}

.igm-chip--category{
  border-color:rgba(140,125,255,.28);
  background:rgba(140,125,255,.12);
  color:#d5cfff;
}

.igm-chip--tag{
  border-color:rgba(255,79,216,.24);
  background:rgba(255,79,216,.10);
  color:#ffd0f2;
}

.igm-table-wrap{
  overflow:auto;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
}

.igm-table{
  width:100%;
  min-width:1200px;
  border-collapse:collapse;
}

.igm-table th,
.igm-table td{
  padding:12px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  text-align:left;
  vertical-align:top;
}

.igm-table th{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(167,176,200,.88);
  background:rgba(255,255,255,.03);
  white-space:nowrap;
}

.igm-table th a{
  color:inherit;
  text-decoration:none;
}

.igm-table th a:hover{
  color:var(--igm-page-accent);
}

.igm-table tr:hover td{
  background:rgba(255,255,255,.025);
}

.igm-table .col-check{ width:46px; }
.igm-table .col-id{ width:70px; }
.igm-table .col-play{ width:180px; }
.igm-table .col-title{ min-width:260px; }
.igm-table .col-genre{ width:140px; }
.igm-table .col-album{ width:180px; }
.igm-table .col-duration{ width:100px; }
.igm-table .col-plays{ width:90px; }
.igm-table .col-last{ width:180px; }
.igm-table .col-actions{ width:180px; }

.igm-audio{
  width:160px;
  height:34px;
}

.igm-track-title{
  font-weight:900;
  color:#f2f6ff;
  line-height:1.3;
}

.igm-track-sub{
  color:rgba(167,176,200,.82);
  font-size:.92rem;
  margin-top:4px;
}

.igm-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.igm-mini-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 10px;
  border-radius:10px;
  text-decoration:none;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#eef4ff;
  font-weight:800;
  font-size:.88rem;
  transition:all .15s ease;
}

.igm-mini-btn:hover{
  border-color:var(--igm-page-accent-border);
  color:var(--igm-page-accent);
  background:var(--igm-page-accent-soft);
}

.igm-mini-btn.danger{
  border-color:rgba(239,68,68,.28);
  background:rgba(239,68,68,.10);
  color:#fecaca;
}

.igm-mini-btn.danger:hover{
  border-color:rgba(239,68,68,.40);
  background:rgba(239,68,68,.16);
  color:#fff1f2;
}

#uploadOverlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.66);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

#uploadOverlay .box{
  min-width:240px;
  max-width:90vw;
  padding:20px;
  border-radius:18px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(500px 180px at 50% -10%, var(--igm-page-accent-soft), transparent 60%),
    linear-gradient(145deg,#111827,#0b1220);
  color:#eef4ff;
  text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,.45);
}

#uploadOverlay .spinner{
  width:32px;
  height:32px;
  margin:0 auto 12px;
  border:3px solid rgba(255,255,255,.16);
  border-top-color:var(--igm-page-accent);
  border-radius:999px;
  animation:igmSpin .8s linear infinite;
}

@keyframes igmSpin{
  to{ transform:rotate(360deg); }
}

.igm-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.72);
  z-index:10000;
  padding:20px;
}

.igm-modal-box{
  width:min(900px, 96vw);
  max-height:85vh;
  overflow:auto;
  border-radius:20px;
  border:1px solid var(--igm-page-accent-border);
  background:
    radial-gradient(700px 220px at 10% -10%, var(--igm-page-accent-soft), transparent 60%),
    linear-gradient(145deg,#0f172a,#0b1220);
  box-shadow:0 18px 50px rgba(0,0,0,.45);
  padding:20px;
}

.igm-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.igm-modal-title{
  margin:0;
  font-size:1.2rem;
  font-weight:950;
  color:#f2f6ff;
}

.igm-modal-pre{
  white-space:pre-wrap;
  line-height:1.6;
  color:#dbe7ff;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
}

@media (max-width: 900px){
  .igm-grid-2{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  .igm-page-wrap{
    padding:16px 12px 28px;
  }

  .igm-page-hero,
  .igm-card{
    padding:18px;
    border-radius:18px;
  }

  .igm-card-head,
  .igm-btn-row{
    align-items:flex-start;
    flex-direction:column;
  }

  .igm-kpi-row{
    grid-template-columns:1fr;
  }

  .igm-actions{
    justify-content:flex-start;
  }
}



/* =========================================================
   IGM ALBUMS PAGE
   =======================================================*/

.igm-album-form{
  display:grid;
  gap:14px;
  max-width:720px;
}

.igm-album-cover-preview{
  max-width:280px;
  max-height:280px;
  border-radius:10px;
  object-fit:cover;
  box-shadow:0 0 0 1px rgba(0,0,0,.25);
}

.igm-album-empty{
  color:#888;
  font-size:.9rem;
}


.igm-album-fieldset{
  border:1px dashed var(--igm-page-accent-border);
  border-radius:14px;
  padding:14px;
  background:
    radial-gradient(600px 160px at 20% -20%, var(--igm-page-accent-soft), transparent 60%),
    rgba(255,255,255,.02);
  position:relative;
}


.igm-album-legend{
  padding:0 10px;
  font-size:.8rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(200,210,235,.6);
  background:transparent;
}


fieldset{
  border: none;
  margin: 0;
  padding: 0;
  min-inline-size: unset;
}

legend{
  width: auto;
}

.igm-album-row{
  margin-bottom:10px;
}

.igm-album-table img{
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:6px;
}

/* =========================================================
   IGM ALBUMS TABLE TIGHTENING
   =======================================================*/

.igm-album-table{
  width:100%;
  min-width:0;
  table-layout:fixed;
}

.igm-album-table th,
.igm-album-table td{
  vertical-align:middle;
}

.igm-album-table th:nth-child(1),
.igm-album-table td:nth-child(1){
  width:64px; /* ID */
}

.igm-album-table th:nth-child(2),
.igm-album-table td:nth-child(2){
  width:92px; /* cover */
}

.igm-album-table th:nth-child(3),
.igm-album-table td:nth-child(3){
  width:28%; /* title */
}

.igm-album-table th:nth-child(4),
.igm-album-table td:nth-child(4){
  width:32%; /* slug */
}

.igm-album-table th:nth-child(5),
.igm-album-table td:nth-child(5){
  width:180px; /* created */
  white-space:nowrap;
}

.igm-album-table th:nth-child(6),
.igm-album-table td:nth-child(6){
  width:120px; /* actions */
  text-align:right;
  white-space:nowrap;
}

.igm-album-table td:nth-child(3),
.igm-album-table td:nth-child(4){
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.igm-album-table code{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:100%;
}

.igm-album-table img{
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:6px;
  display:block;
}

@media (max-width: 900px){
  .igm-album-table{
    min-width:720px;
  }
}

/* Tracks table only */
.igm-tracks-table{
  width:100%;
  min-width:1040px;
  table-layout:fixed;
}

.igm-tracks-table th,
.igm-tracks-table td{
  vertical-align:middle;
}

.igm-tracks-table .col-check{ width:42px; }
.igm-tracks-table .col-play{ width:96px; }
.igm-tracks-table .col-title{ width:310px; }
.igm-tracks-table .col-genre{ width:100px; }
.igm-tracks-table .col-album{ width:130px; }
.igm-tracks-table .col-duration{ width:75px; }
.igm-tracks-table .col-plays{ width:55px; }
.igm-tracks-table .col-last{ width:100px; }
.igm-tracks-table .col-actions{ width:200px; }

.igm-tracks-table td{
  overflow:hidden;
}

.igm-tracks-table .igm-track-title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.igm-tracks-table .igm-track-sub{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.igm-tracks-table audio.igm-audio{
  width:88px !important;
  height:30px;
  max-width:100%;
  display:block;
}

.igm-tracks-table td:last-child{
  white-space:nowrap;
}

.igm-tracks-table .igm-actions{
  display:flex;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:nowrap;
}

.igm-tracks-table .igm-mini-btn{
  min-height:30px;
  padding:5px 8px;
  font-size:.78rem;
  flex:0 0 auto;
}

@media (max-width: 1200px){
  .igm-tracks-table{
    min-width:980px;
  }
}

.igm-list{
  margin:10px 0 0 20px;
  padding-left:.5rem;
}

.igm-list li{
  list-style:disc;
  margin:0 0 6px;
}

.igm-note-card{
  margin-top:14px;
  margin-bottom:0;
  border-style:dashed;
}

.igm-note-card .igm-admin-page-subtitle{
  margin-top:0;
}

/* Listener tiers page helpers */
.igm-admin-form{
  display:grid;
  gap:12px;
}

.igm-admin-form-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}

.igm-admin-section-title{
  margin-top:0;
}

.igm-admin-tier-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.igm-admin-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background:linear-gradient(90deg,#7da8ff,#f472b6);
  color:#fff;
  font-size:.75rem;
  font-weight:600;
}

.igm-admin-tier-desc{
  margin-top:6px;
}

.igm-admin-tier-price{
  font-size:1.2rem;
  font-weight:800;
  color:#7dd3fc;
  margin:6px 0;
}

.igm-admin-tier-price-unit{
  font-size:.75rem;
  color:#9fb0d2;
}

.igm-admin-table-title{
  margin-top:0;
}

.igm-admin-form{
  display:grid;
  gap:14px;
}

.igm-admin-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.igm-admin-grid-3{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}

.igm-admin-field{
  display:grid;
  gap:8px;
}

.igm-admin-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(233,238,252,.72);
  font-weight:800;
}

.igm-admin-input,
.igm-admin-select,
.igm-admin-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-admin-textarea{
  min-height:110px;
  resize:vertical;
}

.igm-page .igm-admin-input:focus,
.igm-page .igm-admin-select:focus,
.igm-page .igm-admin-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
  background:rgba(10,12,18,.60);
}

.igm-admin-checkbox-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}

.igm-admin-checkbox-row{
  display:flex;
  align-items:center;
  gap:8px;
  color:#eef4ff;
}

.igm-admin-checkbox-row input{
  width:auto;
  margin:0;
}

.igm-admin-form-actions,
.igm-admin-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}

.igm-admin-section-title{
  margin-top:0;
}

.igm-admin-empty{
  color:#9fb0d2;
}

.igm-admin-tier-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
  flex-wrap:wrap;
}

.igm-admin-tier-sub{
  color:#9fb0d2;
  font-size:.92rem;
  margin-top:4px;
}

.igm-admin-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:8px 0;
}

.igm-admin-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 9px;
  border-radius:999px;
  border:1px solid #2a3348;
  background:#11192a;
  font-size:.82rem;
}

.igm-admin-tier-description{
  color:#9fb0d2;
  margin-bottom:10px;
}

.igm-admin-tier-price-inline{
  font-weight:700;
  color:#eef4ff;
}

.btn.small{
  min-height:34px;
  padding:7px 10px;
  border-radius:10px;
  font-size:.92rem;
}

.igm-admin-inline-form{
  display:inline;
}

@media (max-width: 900px){
  .igm-admin-grid-2,
  .igm-admin-grid-3,
  .igm-admin-checkbox-grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   IGM ARTIST MANAGER
   =======================================================*/

.igm-artist-grid{
  display:grid;
  grid-template-columns:420px minmax(0,1fr);
  gap:18px;
}

.igm-artist-form{
  display:grid;
  gap:12px;
}

.igm-artist-field{
  display:grid;
  gap:6px;
}

.igm-artist-label{
  display:block;
  font-weight:700;
  color:rgba(233,238,252,.92);
}

.igm-artist-input,
.igm-artist-select,
.igm-artist-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:12px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-artist-textarea{
  min-height:110px;
  resize:vertical;
}

.igm-page .igm-artist-input:focus,
.igm-page .igm-artist-select:focus,
.igm-page .igm-artist-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
  background:rgba(10,12,18,.60);
}

.igm-artist-checks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:8px 0 16px;
}

.igm-artist-check{
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(13,19,32,.9);
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  padding:10px 12px;
  color:rgba(233,238,252,.92);
}

.igm-artist-check input{
  width:auto;
  margin:0;
}

.igm-artist-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.igm-artist-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:14px;
  color:rgba(167,176,200,.85);
}

.igm-artist-table-wrap{
  overflow-x:auto;
}

.igm-artist-table{
  width:100%;
  border-collapse:collapse;
}

.igm-artist-table th,
.igm-artist-table td{
  text-align:left;
  padding:12px 10px;
  border-bottom:1px solid rgba(255,255,255,.10);
  vertical-align:top;
}

.igm-artist-table th{
  color:#dbe7ff;
  font-size:.92rem;
}

.igm-artist-name{
  font-weight:800;
  font-size:1rem;
}

.igm-artist-meta{
  margin-top:4px;
  color:rgba(167,176,200,.88);
  font-size:.92rem;
}

.igm-artist-badge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.8rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  margin:2px 6px 2px 0;
}

.igm-artist-badge.good{
  border-color:rgba(34,197,94,.35);
  color:#dffbe8;
}

.igm-artist-badge.featured{
  border-color:rgba(255,79,216,.35);
  color:#ffe2f6;
}

.igm-artist-badge.verify{
  border-color:rgba(70,212,255,.35);
  color:#dff8ff;
}

.igm-artist-badge.off{
  opacity:.7;
}

.igm-artist-table-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.igm-inline-form{
  display:inline;
}

@media (max-width: 1100px){
  .igm-artist-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 700px){
  .igm-artist-checks{
    grid-template-columns:1fr;
  }

  .igm-artist-table{
    min-width:980px;
  }
}

.igm-tracks-table td:nth-child(7){
  text-align:center;
}

/* =========================================================
   IGM ARTIST APPLICATIONS
   =======================================================*/

.igm-app-filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.igm-app-card-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:16px;
}

.igm-app-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.igm-app-title{
  margin:0 0 6px;
  font-size:1.35rem;
  font-weight:900;
  color:rgba(233,238,252,.96);
}

.igm-app-meta{
  color:rgba(167,176,200,.88);
  font-size:.95rem;
}

.igm-app-label{
  font-weight:800;
  margin-top:12px;
  margin-bottom:4px;
  color:rgba(233,238,252,.92);
}

.igm-app-value{
  color:rgba(233,238,252,.96);
  word-break:break-word;
}

.igm-app-badge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.8rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  margin:2px 6px 2px 0;
}

.igm-app-badge.new{
  border-color:rgba(70,212,255,.35);
  color:#dff8ff;
}

.igm-app-badge.reviewing{
  border-color:rgba(245,158,11,.35);
  color:#ffe9c7;
}

.igm-app-badge.approved{
  border-color:rgba(34,197,94,.35);
  color:#dffbe8;
}

.igm-app-badge.rejected{
  border-color:rgba(239,68,68,.35);
  color:#ffd9de;
}

.igm-app-review-title{
  margin-top:0;
  margin-bottom:12px;
  font-size:1.1rem;
  font-weight:900;
  color:rgba(233,238,252,.96);
}

.igm-app-form{
  display:grid;
  gap:12px;
}

.igm-app-field{
  display:grid;
  gap:6px;
}

.igm-app-field label{
  display:block;
  font-weight:700;
  color:rgba(233,238,252,.92);
}

.igm-app-select,
.igm-app-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:12px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-app-textarea{
  min-height:120px;
  resize:vertical;
}

.igm-page .igm-app-select:focus,
.igm-page .igm-app-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
  background:rgba(10,12,18,.60);
}

.igm-app-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.igm-app-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:14px;
  color:rgba(167,176,200,.85);
}

@media (max-width: 980px){
  .igm-app-card-grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   IGM DISCOVERY MANAGER
   =======================================================*/

.igm-discovery-grid{
  display:grid;
  grid-template-columns:440px minmax(0,1fr);
  gap:18px;
}

.igm-discovery-form{
  display:grid;
  gap:12px;
}

.igm-discovery-field{
  display:grid;
  gap:6px;
}

.igm-discovery-label{
  display:block;
  font-weight:700;
  color:rgba(233,238,252,.92);
}

.igm-discovery-input,
.igm-discovery-select,
.igm-discovery-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:12px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-discovery-textarea{
  min-height:110px;
  resize:vertical;
}

.igm-page .igm-discovery-input:focus,
.igm-page .igm-discovery-select:focus,
.igm-page .igm-discovery-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
  background:rgba(10,12,18,.60);
}

.igm-discovery-row-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.igm-discovery-check{
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(13,19,32,.9);
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  padding:10px 12px;
  margin:8px 0 16px;
  color:rgba(233,238,252,.92);
}

.igm-discovery-check input{
  width:auto;
  margin:0;
}

.igm-discovery-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.igm-discovery-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:14px;
  color:rgba(167,176,200,.85);
}

.igm-discovery-table-wrap{
  overflow-x:auto;
}

.igm-discovery-table{
  width:100%;
  border-collapse:collapse;
}

.igm-discovery-table th,
.igm-discovery-table td{
  text-align:left;
  padding:12px 10px;
  border-bottom:1px solid rgba(255,255,255,.10);
  vertical-align:top;
}

.igm-discovery-table th{
  color:#dbe7ff;
  font-size:.92rem;
}

.igm-discovery-track-name{
  font-weight:800;
  font-size:1rem;
}

.igm-discovery-track-meta{
  margin-top:4px;
  color:rgba(167,176,200,.88);
  font-size:.92rem;
}

.igm-discovery-badge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.8rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  margin:2px 6px 2px 0;
}

.igm-discovery-badge.good{
  border-color:rgba(34,197,94,.35);
  color:#dffbe8;
}

.igm-discovery-badge.off{
  opacity:.7;
}

.igm-discovery-badge.tag{
  border-color:rgba(70,212,255,.35);
  color:#dff8ff;
}

.igm-discovery-table-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

@media (max-width: 1150px){
  .igm-discovery-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 760px){
  .igm-discovery-row-2{
    grid-template-columns:1fr;
  }

  .igm-discovery-table{
    min-width:1100px;
  }
}

/* =========================================================
   IGM TRACK SUBMISSIONS
   =======================================================*/

.igm-submissions-filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.igm-submissions-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:16px;
}

.igm-submissions-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.igm-submissions-title{
  margin:0 0 6px;
  font-size:1.35rem;
  font-weight:900;
  color:rgba(233,238,252,.96);
}

.igm-submissions-meta{
  color:rgba(167,176,200,.88);
  font-size:.95rem;
}

.igm-submissions-label{
  font-weight:800;
  margin-top:12px;
  margin-bottom:4px;
  color:rgba(233,238,252,.92);
}

.igm-submissions-value{
  word-break:break-word;
  color:rgba(233,238,252,.96);
}

.igm-submissions-badge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.8rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  margin:2px 6px 2px 0;
}

.igm-submissions-badge.pending{
  border-color:rgba(70,212,255,.35);
  color:#dff8ff;
}

.igm-submissions-badge.needs_changes{
  border-color:rgba(245,158,11,.35);
  color:#ffe9c7;
}

.igm-submissions-badge.approved{
  border-color:rgba(34,197,94,.35);
  color:#dffbe8;
}

.igm-submissions-badge.rejected{
  border-color:rgba(239,68,68,.35);
  color:#ffd9de;
}

.igm-submissions-preview{
  width:100%;
  max-width:260px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:#10131a;
  display:block;
  aspect-ratio:1 / 1;
  object-fit:cover;
  margin-top:8px;
}

.igm-submissions-review-title{
  margin-top:0;
  margin-bottom:12px;
  font-size:1.1rem;
  font-weight:900;
  color:rgba(233,238,252,.96);
}

.igm-submissions-form{
  display:grid;
  gap:12px;
}

.igm-submissions-field{
  display:grid;
  gap:6px;
}

.igm-submissions-field label{
  display:block;
  font-weight:700;
  color:rgba(233,238,252,.92);
}

.igm-submissions-input,
.igm-submissions-select,
.igm-submissions-textarea{
  width:100%;
  background:rgba(10,12,18,.45);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ink);
  border-radius:12px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.igm-submissions-textarea{
  min-height:120px;
  resize:vertical;
}

.igm-page .igm-submissions-input:focus,
.igm-page .igm-submissions-select:focus,
.igm-page .igm-submissions-textarea:focus{
  border-color:var(--igm-page-accent-border);
  box-shadow:0 0 0 3px var(--igm-page-accent-soft);
  background:rgba(10,12,18,.60);
}

.igm-submissions-check{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(233,238,252,.92);
}

.igm-submissions-check input{
  width:auto;
  margin:0;
}

.igm-submissions-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.igm-submissions-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:14px;
  color:rgba(167,176,200,.85);
}

@media (max-width: 980px){
  .igm-submissions-grid{
    grid-template-columns:1fr;
  }
}

.igm-form{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.igm-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

@media(max-width:768px){
  .igm-grid-2{
    grid-template-columns:1fr;
  }
}

.igm-field label{
  display:block;
  font-size:13px;
  color:#9ca3af;
  margin-bottom:4px;
}

.igm-input{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  background:#111827;
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
}

.igm-input:focus{
  border-color:#46d4ff;
  outline:none;
  box-shadow:0 0 0 2px rgba(70,212,255,.15);
}

.igm-help{
  font-size:12px;
  color:#6b7280;
  margin-top:4px;
}

.igm-card-subtle{
  padding:14px;
  border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
}

.igm-checkbox{
  display:flex;
  gap:8px;
  margin-top:10px;
  font-size:13px;
}

.igm-btn.primary{
  background:linear-gradient(135deg,#46d4ff,#c55bff);
  border:none;
  padding:12px;
  border-radius:12px;
  font-weight:700;
  color:#000;
  cursor:pointer;
}

.igm-page-hero,
.igm-admin-tier-box,
.igm-admin-actions {
  position: relative;
}

.igm-page-hero::before,
.igm-page-hero::after {
  pointer-events: none;
}

.igm-admin-tier-box > *,
.igm-admin-actions > * {
  position: relative;
  z-index: 2;
}

/* =========================================================
   PROJECT INDEX REFRESH
   =======================================================*/

.projectsPage .projShell{
  padding:26px;
  border-radius:24px;
  overflow:hidden;
  background:
    radial-gradient(900px 260px at 0% -20%, rgba(70,212,255,.14), transparent 60%),
    radial-gradient(900px 260px at 100% -20%, rgba(255,79,216,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:0 20px 55px rgba(0,0,0,.45);
}

.projectsPage .projTop{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,380px);
  gap:22px;
  align-items:start;
  margin-bottom:20px;
}

.projectsPage .projTitle{
  display:grid;
  grid-template-columns:56px minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  width:100%;
}

.projectsPage .projIcon{
  width:56px;
  height:56px;
  border-radius:18px;
  font-size:26px;
  background:
    radial-gradient(circle at 30% 20%, rgba(70,212,255,.24), transparent 50%),
    linear-gradient(135deg, rgba(70,212,255,.12), rgba(255,79,216,.10));
  border:1px solid rgba(70,212,255,.30);
}

.projectsPage .projTitle .h2{
  font-size:clamp(28px, 3vw, 42px);
  line-height:1;
  background:linear-gradient(90deg, var(--brand), var(--brand2), var(--accent));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.projectsPage .projTitle .sub{
  margin-top:10px;
  font-size:14px;
}

.projectsPage .projNew{
  margin-left:0;
  align-self:center;
  white-space:nowrap;
}

.projectsPage .projSearch{
  width:100%;
  flex:none;
}

.projectsPage .projSearch input{
  min-height:52px;
  border-radius:18px;
  padding:14px 16px;
  background:rgba(10,12,18,.55);
  border:1px solid rgba(255,255,255,.14);
}

.projectsPage .projControls{
  display:grid;
  grid-template-columns:auto minmax(220px,1fr) minmax(220px,1fr) auto auto;
  gap:12px;
  align-items:center;
  padding-top:18px;
}

.projectsPage .seg,
.projectsPage .ctrl,
.projectsPage .togglePill{
  min-height:48px;
}

.projectsPage .ctrl{
  width:100%;
}

.projectsPage .ctrl select{
  min-width:0;
}

.projectsPage .projSave{
  white-space:nowrap;
}

/* Project cards get a little more project-card energy */
.projectsPage .projCards{
  gap:18px;
  margin-top:20px;
}

.projectsPage .projCard{
  padding:18px;
  border-radius:22px;
}

.projectsPage .projCard h2{
  margin-bottom:12px;
}

.projectsPage .projCard a[href*="/projects/view.php"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:12px;
  padding:8px 12px;
  border-radius:12px;
  background:rgba(70,212,255,.12);
  border:1px solid rgba(70,212,255,.24);
  color:rgba(220,245,255,.98);
  font-weight:900;
  text-decoration:none;
}

/* Mobile sanity, because tiny screens are punishment enough */
@media (max-width: 1100px){
  .projectsPage .projTop{
    grid-template-columns:1fr;
  }

  .projectsPage .projControls{
    grid-template-columns:1fr 1fr;
  }

  .projectsPage .projSave,
  .projectsPage .togglePill,
  .projectsPage .seg{
    width:100%;
  }
}

@media (max-width: 720px){
  .projectsPage .projShell{
    padding:18px;
    border-radius:20px;
  }

  .projectsPage .projTitle{
    grid-template-columns:48px minmax(0,1fr);
  }

  .projectsPage .projIcon{
    width:48px;
    height:48px;
  }

  .projectsPage .projNew{
    grid-column:1 / -1;
    width:100%;
  }

  .projectsPage .projControls{
    grid-template-columns:1fr;
  }

  .projectsPage .ctrl,
  .projectsPage .togglePill,
  .projectsPage .projSave{
    width:100%;
  }
}

/* =========================================================
   PROJECT INDEX CONTROL BAR FIX
   =======================================================*/

.projectsPage .projControls{
  display:grid;
  grid-template-columns: 170px minmax(320px, 390px) minmax(320px, 390px) 190px 140px;
  gap:12px;
  align-items:center;
}

.projectsPage .seg{
  width:170px;
}

.projectsPage .segBtn{
  white-space:nowrap;
  padding:10px 14px;
}

.projectsPage .ctrl{
  min-width:0;
  width:100%;
  padding:8px 10px;
}

.projectsPage .ctrlLabel{
  flex:0 0 auto;
}

.projectsPage .ctrl select{
  flex:1 1 auto;
  width:100%;
  min-width:0;
}

.projectsPage .togglePill{
  width:190px;
  min-width:190px;
  max-width:190px;
  justify-content:center;
  padding:8px 12px;
  gap:10px;
}

.projectsPage .togglePill input{
  width:auto;
  min-height:0;
}

.projectsPage #hideCompletedTrack{
  flex:0 0 40px;
}

.projectsPage .toggleText{
  font-size:13px;
  line-height:1.1;
  white-space:normal;
  max-width:96px;
}

.projectsPage .projSave{
  width:140px;
  min-width:140px;
  white-space:nowrap;
}

/* Stop random mobile/global form rules from bloating controls */
.projectsPage .projControls form,
.projectsPage .projControls select,
.projectsPage .projControls button{
  max-width:none;
}

@media (max-width: 1250px){
  .projectsPage .projControls{
    grid-template-columns: 170px 1fr 1fr;
  }

  .projectsPage .togglePill,
  .projectsPage .projSave{
    width:100%;
    min-width:0;
    max-width:none;
  }
}

@media (max-width: 820px){
  .projectsPage .projControls{
    grid-template-columns:1fr;
  }

  .projectsPage .seg,
  .projectsPage .ctrl,
  .projectsPage .togglePill,
  .projectsPage .projSave{
    width:100%;
    min-width:0;
    max-width:none;
  }

  .projectsPage .togglePill{
    justify-content:flex-start;
  }

  .projectsPage .toggleText{
    max-width:none;
    white-space:nowrap;
  }
}