:root{
  --bg:#02060b;
  --panel:#07111a;
  --panel2:#0a1824;
  --text:#f3f8fb;
  --muted:#8da3b1;
  --cyan:#57e5ff;
  --cyan-bright:#8ff2ff;
  --blue:#168cff;
  --violet:#7f8bff;
  --violet-premium:#c879ff;
  --green:#75f17a;
  --gold:#ffc04d;
  --red:#ff6b7a;
  --line:rgba(97,221,255,.18);
  --line2:rgba(97,221,255,.40);
  --sidebar-collapsed:76px;
  --sidebar-expanded:230px;
  --topbar-h:76px;
  --status-h:32px;
  --grid:56px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 76% 15%,rgba(22,140,255,.12),transparent 24%),
    linear-gradient(180deg,#010409,#030912 58%,#02060a);
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-3;
  background-image:
    linear-gradient(to bottom,rgba(91,219,255,.042) 1px,transparent 1px),
    linear-gradient(to right,rgba(91,219,255,.042) 1px,transparent 1px);
  background-size:var(--grid) var(--grid);
  mask-image:radial-gradient(ellipse at center,rgba(0,0,0,.35),rgba(0,0,0,.75) 75%,#000);
}

button,input{font:inherit}
a{color:inherit;text-decoration:none}

.neo-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:var(--sidebar-collapsed) minmax(0,1fr);
  transition:grid-template-columns .28s ease;
}

.neo-shell.sidebar-open{
  grid-template-columns:var(--sidebar-expanded) minmax(0,1fr);
}

.neo-sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:var(--sidebar-collapsed);
  border-right:1px solid var(--line);
  background:rgba(2,7,12,.90);
  backdrop-filter:blur(18px);
  z-index:80;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transition:width .28s ease;
}

.neo-shell.sidebar-open .neo-sidebar{width:var(--sidebar-expanded)}

.sidebar-brand{
  height:76px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 12px;
  border-bottom:1px solid var(--line);
}

.brand-mark{
  width:50px;height:50px;flex:0 0 50px;
  display:grid;place-items:center;
  border:1px solid var(--line2);
  background:linear-gradient(145deg,#132a3c,#06101a);
  color:var(--cyan);
  font-weight:1000;
  letter-spacing:-.06em;
  box-shadow:inset 0 0 20px rgba(53,213,255,.12),0 0 18px rgba(36,190,255,.12);
}

.brand-copy{
  opacity:0;
  transform:translateX(-8px);
  transition:.22s ease;
  white-space:nowrap;
}
.neo-shell.sidebar-open .brand-copy{opacity:1;transform:none}
.brand-copy strong{display:block;font-size:.82rem;letter-spacing:.16em}
.brand-copy small{display:block;color:var(--cyan);font-size:.56rem;letter-spacing:.20em;margin-top:4px}

.sidebar-nav{
  padding:18px 10px;
  display:flex;
  flex-direction:column;
  gap:7px;
  overflow:auto;
  flex:1;
}

.nav-item{
  min-height:48px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:0 11px;
  border:1px solid transparent;
  color:#738a99;
  position:relative;
  overflow:hidden;
  transition:.22s ease;
}
.nav-item:hover,.nav-item.active{
  color:var(--cyan);
  border-color:var(--line2);
  background:rgba(68,213,255,.07);
}
.nav-item.active::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:var(--cyan);
  box-shadow:0 0 12px var(--cyan);
}
.nav-index{width:30px;flex:0 0 30px;text-align:center;font-size:.63rem;font-weight:900;letter-spacing:.10em}
.nav-label{
  opacity:0;
  transform:translateX(-6px);
  white-space:nowrap;
  transition:.22s ease;
  font-size:.76rem;
  letter-spacing:.04em;
  font-weight:800;
}
.neo-shell.sidebar-open .nav-label{opacity:1;transform:none}

.sidebar-bottom{
  padding:12px 10px 16px;
  border-top:1px solid var(--line);
}

.sidebar-toggle{
  width:100%;
  min-height:42px;
  border:1px solid var(--line);
  color:var(--cyan);
  background:rgba(8,21,32,.58);
  cursor:pointer;
}

.neo-main{
  grid-column:2;
  min-width:0;
}

.neo-topbar{
  position:fixed;
  top:0;
  left:var(--sidebar-collapsed);
  right:0;
  height:var(--topbar-h);
  padding:0 28px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  border-bottom:1px solid rgba(97,221,255,.10);
  background:linear-gradient(180deg,rgba(2,7,12,.96),rgba(2,7,12,.78));
  backdrop-filter:blur(16px);
  z-index:70;
  transition:left .28s ease;
}
.neo-shell.sidebar-open .neo-topbar{left:var(--sidebar-expanded)}

.topbar-title strong{display:block;font-size:.82rem;letter-spacing:.14em}
.topbar-title small{display:block;color:var(--cyan);font-size:.56rem;letter-spacing:.18em;margin-top:4px}

.topbar-center{
  display:flex;
  align-items:center;
  gap:14px;
  color:#aabdc8;
  font-size:.68rem;
  letter-spacing:.05em;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  border:1px solid var(--line);
  background:rgba(8,21,32,.52);
}
.status-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--green);
  box-shadow:0 0 10px rgba(117,241,122,.8);
}

.topbar-actions{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:9px;
}

.wallet-button{
  min-height:42px;
  padding:0 14px;
  border:1px solid var(--line2);
  color:#eafaff;
  background:rgba(8,22,33,.72);
  cursor:pointer;
  font-weight:800;
  font-size:.72rem;
}

.global-status{
  position:fixed;
  left:var(--sidebar-collapsed);
  right:0;
  top:var(--topbar-h);
  height:var(--status-h);
  z-index:65;
  display:flex;
  align-items:center;
  padding:0 28px;
  gap:16px;
  border-bottom:1px solid rgba(97,221,255,.10);
  background:rgba(3,10,16,.92);
  color:#9eb3bf;
  font-size:.60rem;
  letter-spacing:.10em;
  white-space:nowrap;
  overflow:hidden;
  transition:left .28s ease;
}
.neo-shell.sidebar-open .global-status{left:var(--sidebar-expanded)}
.global-status b{color:var(--green)}
.status-separator{color:#3f5e70}

.neo-page{
  width:min(1540px,100%);
  margin:0 auto;
  padding:calc(var(--topbar-h) + var(--status-h) + 30px) 34px 72px;
}

.dashboard-header{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(300px,.7fr);
  gap:18px;
  margin-bottom:18px;
}

.metric-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}

.quick-actions{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  margin-bottom:14px;
}

.dashboard-grid-2{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:14px;
  margin-bottom:14px;
}

.dashboard-grid-3{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}

@media(max-width:1180px){
  .neo-topbar{grid-template-columns:1fr auto}
  .topbar-center{display:none}
  .metric-grid{grid-template-columns:repeat(2,1fr)}
  .quick-actions{grid-template-columns:repeat(3,1fr)}
  .dashboard-grid-2,.dashboard-grid-3{grid-template-columns:1fr}
}

@media(max-width:820px){
  :root{--grid:42px}
  .neo-shell,.neo-shell.sidebar-open{grid-template-columns:1fr}
  .neo-sidebar{transform:translateX(-100%);width:230px}
  .neo-shell.sidebar-open .neo-sidebar{transform:none}
  .neo-main{grid-column:1}
  .neo-topbar,.neo-shell.sidebar-open .neo-topbar,
  .global-status,.neo-shell.sidebar-open .global-status{left:0}
  .neo-topbar{padding:0 16px}
  .global-status{padding:0 16px}
  .neo-page{padding-left:16px;padding-right:16px}
  .dashboard-header,.metric-grid,.quick-actions{grid-template-columns:1fr}
  .topbar-actions .wallet-button.secondary{display:none}
}


/* PREMONEON_MOBILE_HAMBURGER_V1_SAFE_START */

/*
 * PREMONEON MOBILE NAVIGATION
 *
 * The button is mobile-only.
 * The existing sidebar remains canonical.
 * No Unicode icon characters are used.
 */

.neo-mobile-menu-toggle {
    display: none;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:820px) {

    .neo-topbar {
        grid-template-columns:
            auto minmax(0,1fr) auto;

        column-gap:
            12px;
    }


    .neo-mobile-menu-toggle {
        width:
            42px;

        height:
            42px;

        display:
            grid;

        place-items:
            center;

        flex:
            0 0 42px;

        padding:
            0;

        margin:
            0;

        border:
            1px solid var(--line2);

        background:
            linear-gradient(
                145deg,
                rgba(19,42,60,.88),
                rgba(6,16,26,.92)
            );

        color:
            var(--cyan);

        cursor:
            pointer;

        position:
            relative;

        box-shadow:
            inset 0 0 18px rgba(53,213,255,.08),
            0 0 14px rgba(36,190,255,.08);

        -webkit-tap-highlight-color:
            transparent;

        transition:
            border-color .2s ease,
            background .2s ease,
            box-shadow .2s ease,
            transform .15s ease;
    }


    .neo-mobile-menu-toggle:hover {
        border-color:
            var(--cyan);

        background:
            rgba(68,213,255,.08);

        box-shadow:
            inset 0 0 18px rgba(53,213,255,.10),
            0 0 16px rgba(36,190,255,.12);
    }


    .neo-mobile-menu-toggle:active {
        transform:
            scale(.96);
    }


    .neo-mobile-menu-toggle:focus-visible {
        outline:
            1px solid var(--cyan);

        outline-offset:
            2px;
    }


    /*
     * Pure CSS hamburger.
     */

    .neo-mobile-menu-icon {
        width:
            19px;

        height:
            14px;

        display:
            flex;

        flex-direction:
            column;

        justify-content:
            space-between;

        pointer-events:
            none;
    }


    .neo-mobile-menu-icon > i {
        width:
            100%;

        height:
            1px;

        display:
            block;

        margin:
            0;

        padding:
            0;

        border:
            0;

        background:
            currentColor;

        box-shadow:
            0 0 7px rgba(53,213,255,.50);

        pointer-events:
            none;
    }


    /*
     * Keep the page title contained.
     */

    .topbar-title {
        min-width:
            0;
    }


    .topbar-title strong,
    .topbar-title small {
        overflow:
            hidden;

        text-overflow:
            ellipsis;

        white-space:
            nowrap;
    }

}


/* ============================================================
   DESKTOP SAFETY
   ============================================================ */

@media(min-width:821px) {

    .neo-mobile-menu-toggle {
        display:
            none !important;
    }

}

/* PREMONEON_MOBILE_HAMBURGER_V1_SAFE_END */


/* PREMONEON_SIDEBAR_TOGGLE_ICON_CLEANUP_V1_START */

/*
 * Canonical sidebar toggle icon.
 * Pure CSS.
 * No Unicode glyph dependency.
 */

.sidebar-toggle {
    display:grid;
    place-items:center;
}


.sidebar-toggle-icon {
    width:18px;
    height:13px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    margin:auto;

    pointer-events:none;
}


.sidebar-toggle-icon > i {
    display:block;

    width:100%;
    height:1px;

    margin:0;
    padding:0;

    border:0;

    background:currentColor;

    box-shadow:
        0 0 6px rgba(53,213,255,.48);

    pointer-events:none;
}

/* PREMONEON_SIDEBAR_TOGGLE_ICON_CLEANUP_V1_END */