/* =========================================================
   Digi Idle — Digivice Toolbar (rail / dock / float)
   Default: vertical rail on the RIGHT
   ========================================================= */

:root{
  --dd-orange:#ff9a2e;
  --dd-orange-2:#ff6b1a;
  --dd-cyan:#4fd6ff;
  --dd-bg:#0a101c;
  --dd-panel:#101828;
  --dd-text:#eaf2ff;
  --dd-muted:#8b9bb3;
  --dd-line:rgba(79,214,255,.22);
  --dd-font:"Rajdhani","Segoe UI",system-ui,sans-serif;
  --dd-display:"Orbitron","Rajdhani",system-ui,sans-serif;
  --tb-btn:32px;
  --tb-gap:3px;
  --tb-pad:8px;
  --tb-radius:0;
  --tb-label:8px;
  --tb-thickness:76px;
  --tb-len:auto;
  --bar-left:0px;
  --bar-right:0px;
  --hud-left:0px;
  --hud-right:0px;
}

/* Body insets for chat / floats / hud clearance */
body[data-toolbar-pos="top"],
body:not([data-toolbar-pos]){
  --bar-top:var(--bar-space,70px);
  --bar-bottom:0px;
  --bar-left:0px;
  --bar-right:0px;
}
body[data-toolbar-pos="bottom"]{
  --bar-top:0px;
  --bar-bottom:var(--bar-space,70px);
  --bar-left:0px;
  --bar-right:0px;
}
body[data-toolbar-pos="left"]{
  --bar-top:0px;
  --bar-bottom:0px;
  --bar-left:var(--bar-space,86px);
  --bar-right:0px;
}
body[data-toolbar-pos="right"]{
  --bar-top:0px;
  --bar-bottom:0px;
  --bar-left:0px;
  --bar-right:var(--bar-space,86px);
}
body[data-toolbar-pos="float"]{
  --bar-top:0px;
  --bar-bottom:0px;
  --bar-left:0px;
  --bar-right:0px;
}

/* —— Base rail —— */
.toolbar.toolbar-digi{
  position:fixed;
  z-index:30;
  box-sizing:border-box;
  display:flex;
  align-items:stretch;
  gap:var(--tb-gap);
  padding:var(--tb-pad);
  font-family:var(--dd-font);
  color:var(--dd-text);
  container-type:size;
  container-name:tbrail;
  background:
    linear-gradient(180deg,rgba(255,154,46,.14),transparent 36%),
    linear-gradient(180deg,#152033 0%,var(--dd-bg) 100%);
  border:1px solid var(--dd-line);
  box-shadow:
    0 0 0 1px rgba(255,154,46,.08) inset,
    0 14px 36px rgba(0,0,0,.55),
    0 0 28px rgba(79,214,255,.08);
  backdrop-filter:blur(14px) saturate(1.25);
  overflow:auto;
  scrollbar-width:thin;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}

/* Shared rail metrics (posição vem dos modos dock) */
.toolbar.toolbar-digi{
  transform:none;
}

/* Right: vertical sidebar docked */
body[data-toolbar-pos="right"] .toolbar.toolbar-digi{
  top:0;
  right:0;
  bottom:0;
  left:auto;
  height:auto;
  width:var(--tb-thickness);
  max-width:min(160px,42vw);
  min-width:58px;
  max-height:100dvh;
  flex-direction:column;
  border-radius:0;
  border-right:0;
  border-top:0;
  border-bottom:0;
}

body[data-toolbar-pos="left"] .toolbar.toolbar-digi{
  top:0;
  left:0;
  right:auto;
  bottom:0;
  transform:none;
  width:var(--tb-thickness);
  height:auto;
  max-width:min(160px,42vw);
  min-width:58px;
  flex-direction:column;
  border-radius:0;
  border-left:0;
  border-top:0;
  border-bottom:0;
}

body[data-toolbar-pos="top"] .toolbar.toolbar-digi,
body:not([data-toolbar-pos]) .toolbar.toolbar-digi{
  top:0;
  /* Respeita sidebar docked: não cobre --hud-left / --hud-right */
  left:var(--hud-left, 0px);
  right:var(--hud-right, 0px);
  bottom:auto;
  transform:none;
  width:auto;
  --tb-bar-min:72px;
  height:max(var(--tb-bar-min), var(--tb-thickness));
  min-height:var(--tb-bar-min);
  max-height:120px;
  max-width:none;
  min-width:0;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  padding-top:6px;
  padding-bottom:6px;
  border-radius:0;
  border-top:0;
  border-left:0;
  border-right:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
body[data-toolbar-pos="top"] .toolbar.toolbar-digi::-webkit-scrollbar,
body:not([data-toolbar-pos]) .toolbar.toolbar-digi::-webkit-scrollbar{display:none}

body[data-toolbar-pos="bottom"] .toolbar.toolbar-digi{
  top:auto;
  left:var(--hud-left, 0px);
  right:var(--hud-right, 0px);
  bottom:0;
  transform:none;
  width:auto;
  --tb-bar-min:72px;
  height:max(var(--tb-bar-min), var(--tb-thickness));
  min-height:var(--tb-bar-min);
  max-height:120px;
  max-width:none;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  padding-top:6px;
  padding-bottom:6px;
  border-radius:0;
  border-bottom:0;
  border-left:0;
  border-right:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
body[data-toolbar-pos="bottom"] .toolbar.toolbar-digi::-webkit-scrollbar{display:none}

body[data-toolbar-pos="float"] .toolbar.toolbar-digi{
  top:var(--tb-float-y,72px);
  left:var(--tb-float-x,auto);
  right:var(--tb-float-r,16px);
  bottom:auto;
  transform:none;
  width:var(--tb-thickness);
  height:var(--tb-float-h,min(70vh,560px));
  max-height:min(86vh,720px);
  min-width:58px;
  min-height:var(--tb-float-min-h, 100px);
  flex-direction:column;
  border-radius:16px;
  /* Scroll só no cluster-main — dock/cmds/sys ficam fixos */
  overflow-x:hidden;
  overflow-y:hidden;
  touch-action:pan-y;
}
/* Durante o arraste: força layout de aba (coluna), left/top inline movem */
.toolbar.toolbar-digi.is-tb-dragging,
.toolbar.toolbar-digi.is-tb-float-morph{
  right:auto !important;
  bottom:auto !important;
  max-height:none !important;
  max-width:min(200px, 42vw) !important;
  min-width:58px !important;
  min-height:100px !important;
  border-radius:16px !important;
  z-index:40;
  flex-direction:column !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;
  overflow-x:hidden !important;
  overflow-y:hidden !important;
  touch-action:pan-y !important;
  padding-top:8px !important;
  padding-bottom:8px !important;
  transform:none !important;
}
.toolbar.toolbar-digi.is-tb-dragging .tb-dock-switch.tb-dock-pad,
.toolbar.toolbar-digi.is-tb-float-morph .tb-dock-switch.tb-dock-pad,
body[data-toolbar-pos="float"] .toolbar-digi .tb-dock-switch.tb-dock-pad{
  order:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:none !important;
  flex-direction:column !important;
}
.toolbar.toolbar-digi.is-tb-dragging .tb-dock-compass,
.toolbar.toolbar-digi.is-tb-float-morph .tb-dock-compass,
body[data-toolbar-pos="float"] .toolbar-digi .tb-dock-compass{
  width:100%;
  max-width:min(64px, 100%);
  height:auto;
  aspect-ratio:1;
}
.toolbar.toolbar-digi.is-tb-dragging .toolbar-cluster,
.toolbar.toolbar-digi.is-tb-float-morph .toolbar-cluster,
.toolbar.toolbar-digi.is-tb-dragging .toolbar-sep,
.toolbar.toolbar-digi.is-tb-float-morph .toolbar-sep{
  margin-left:0 !important;
  margin-right:0 !important;
  flex:0 0 auto;
}
.toolbar.toolbar-digi.is-tb-dragging .toolbar-cluster-main,
.toolbar.toolbar-digi.is-tb-float-morph .toolbar-cluster-main{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  touch-action:pan-y !important;
}
body[data-toolbar-pos="float"] .toolbar-digi .tb-dock-float,
body[data-toolbar-pos="float"] .toolbar-digi .tb-resize,
.toolbar.toolbar-digi.is-tb-dragging .tb-dock-float,
.toolbar.toolbar-digi.is-tb-float-morph .tb-dock-float,
.toolbar.toolbar-digi.is-tb-dragging .tb-resize,
.toolbar.toolbar-digi.is-tb-float-morph .tb-resize{
  touch-action:none;
}

/* —— Drag handle legado (removido; arraste no tb-dock-float) —— */
.toolbar-digi .tb-drag-handle{
  display:none !important;
}

/* —— Dock pad (Digivice compass) —— */
.toolbar-digi .tb-dock-switch.tb-dock-pad{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:clamp(2px, 6%, 5px);
  border-radius:12px;
  border:1px solid rgba(79,214,255,.2);
  background:
    radial-gradient(ellipse at 50% 0%,rgba(255,154,46,.12),transparent 55%),
    linear-gradient(180deg,rgba(16,24,40,.95),rgba(8,12,22,.98));
  box-shadow:
    0 0 0 1px rgba(0,0,0,.35) inset,
    0 6px 14px rgba(0,0,0,.35);
}
.toolbar-digi .tb-dock-compass{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:1fr 1fr 1fr;
  grid-template-areas:
    ". n ."
    "w c e"
    ". s .";
  gap:clamp(1px, 4%, 3px);
  width:100%;
  max-width:min(64px, 100%);
  aspect-ratio:1;
  margin:0 auto;
  padding:clamp(1px, 3%, 2px);
  border-radius:10px;
  box-sizing:border-box;
  background:
    radial-gradient(circle at 50% 50%,rgba(79,214,255,.08),transparent 62%),
    rgba(0,0,0,.28);
  box-shadow:0 0 0 1px rgba(79,214,255,.1) inset;
}

.toolbar-digi .tb-dock-btn{
  appearance:none;
  margin:0;
  padding:0;
  border:1px solid rgba(79,214,255,.16);
  background:
    linear-gradient(180deg,rgba(255,255,255,.06),transparent 45%),
    rgba(12,18,30,.9);
  color:var(--dd-muted);
  border-radius:8px;
  cursor:pointer;
  display:grid;
  place-items:center;
  position:relative;
  min-width:0;
  min-height:0;
  transition:
    border-color .15s ease,
    background .15s ease,
    color .15s ease,
    box-shadow .15s ease,
    transform .12s ease;
}
.toolbar-digi .tb-dock-btn:hover{
  color:var(--dd-text);
  border-color:rgba(255,154,46,.45);
  background:
    linear-gradient(180deg,rgba(255,154,46,.14),transparent 50%),
    rgba(16,24,40,.95);
  transform:scale(1.04);
}
.toolbar-digi .tb-dock-btn:focus-visible{
  outline:2px solid var(--dd-cyan);
  outline-offset:1px;
}
.toolbar-digi .tb-dock-btn.on{
  color:#1a0e05;
  border-color:rgba(255,179,90,.85);
  background:
    linear-gradient(180deg,#ffc078 0%,var(--dd-orange) 55%,var(--dd-orange-2) 100%);
  box-shadow:
    0 0 0 1px rgba(255,154,46,.35),
    0 0 14px rgba(255,154,46,.45),
    0 2px 0 rgba(0,0,0,.25) inset;
}
.toolbar-digi .tb-dock-btn.on:hover{ transform:scale(1.02); }

/* Directional chevrons via CSS */
.toolbar-digi .tb-dock-ico{
  display:block;
  width:7px;
  height:7px;
  border-style:solid;
  border-width:0 2px 2px 0;
  border-color:currentColor;
  opacity:.9;
}
.toolbar-digi .tb-dock-top .tb-dock-ico{ transform:rotate(-135deg); margin-top:3px; }
.toolbar-digi .tb-dock-right .tb-dock-ico{ transform:rotate(-45deg); margin-left:-2px; }
.toolbar-digi .tb-dock-bottom .tb-dock-ico{ transform:rotate(45deg); margin-bottom:3px; }
.toolbar-digi .tb-dock-left .tb-dock-ico{ transform:rotate(135deg); margin-right:-2px; }

/* Center float gem — também handle de arraste da barra */
.toolbar-digi .tb-dock-float{
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  cursor:grab;
  touch-action:none;
}
.toolbar-digi .tb-dock-float:active,
.toolbar-digi .tb-dock-float.is-dragging{
  cursor:grabbing;
}
.toolbar-digi .tb-dock-float.is-dragging{
  transform:scale(1.08);
  box-shadow:0 0 0 1px rgba(79,214,255,.45), 0 0 12px rgba(79,214,255,.35);
}
.toolbar-digi .tb-dock-float .tb-dock-ico-float{
  width:8px;
  height:8px;
  background:currentColor;
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);
  box-shadow:0 0 6px rgba(79,214,255,.35);
}
.toolbar-digi .tb-dock-float.on .tb-dock-ico-float{
  box-shadow:0 0 8px rgba(26,14,5,.35);
}

/* Horizontal toolbar: compact side-by-side pad */
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-switch.tb-dock-pad,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-switch.tb-dock-pad,
body:not([data-toolbar-pos]) .toolbar-digi .tb-dock-switch.tb-dock-pad{
  flex-direction:row;
  align-items:center;
  align-self:center;
  gap:0;
  padding:3px;
  width:auto;
  max-width:none;
  height:50px;
  max-height:50px;
  box-sizing:border-box;
  flex-shrink:0;
}
/* Topo/rodapé: dock à direita (após Sistema / Mais) */
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-switch.tb-dock-pad,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-switch.tb-dock-pad,
body:not([data-toolbar-pos]) .toolbar-digi .tb-dock-switch.tb-dock-pad{
  order:100;
  margin-left:6px;
}
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-compass,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-compass,
body:not([data-toolbar-pos]) .toolbar-digi .tb-dock-compass{
  width:44px;
  max-width:44px;
  min-width:44px;
  height:44px;
  aspect-ratio:1;
  margin:0;
  gap:2px;
  flex-shrink:0;
}
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-btn,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-btn{
  border-radius:6px;
  min-height:0;
}
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-ico,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-ico{
  width:5px;
  height:5px;
  border-width:0 1.5px 1.5px 0;
}
body[data-toolbar-pos="top"] .toolbar-digi .tb-dock-float .tb-dock-ico-float,
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-dock-float .tb-dock-ico-float{
  width:6px;
  height:6px;
}

.toolbar-digi .toolbar-sep{
  flex:0 0 auto;
  width:70%;
  height:1px;
  margin:6px auto;
  align-self:center;
  background:linear-gradient(90deg,transparent,rgba(79,214,255,.4),transparent);
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-sep,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-sep,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-sep{
  width:1px;
  height:28px;
  margin:0 5px;
  align-self:center;
  background:linear-gradient(180deg,transparent,rgba(79,214,255,.4),transparent);
}

/* Sep entre cmds e main: afasta os dois blocos de forma responsiva (grupo continua centralizado) */
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-cmds + .toolbar-sep,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-cmds + .toolbar-sep,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster-cmds + .toolbar-sep{
  flex:0 0 auto;
  width:1px;
  margin-left:clamp(10px, 3.5vw, 56px);
  margin-right:clamp(10px, 3.5vw, 56px);
}

.toolbar-digi .toolbar-cluster{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  flex:0 0 auto;
  width:100%;
}
/* Vertical: inventário preenche o meio */
.toolbar-digi .toolbar-cluster-main{
  flex:1 1 auto;
  justify-content:flex-start;
  min-height:0;
}
.toolbar-digi .toolbar-cluster-cmds,
.toolbar-digi .toolbar-cluster-sys{
  flex:0 0 auto;
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster{
  flex-direction:row;
  width:auto;
  align-items:center;
}

/* Topo/rodapé: cmds+main centralizados entre dock e sys (responsivo) */
body[data-toolbar-pos="top"] .toolbar.toolbar-digi,
body[data-toolbar-pos="bottom"] .toolbar.toolbar-digi,
body:not([data-toolbar-pos]) .toolbar.toolbar-digi{
  justify-content:flex-start;
}

body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-cmds,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-cmds,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster-cmds{
  flex:0 0 auto;
  order:0;
  margin-left:auto; /* empurra o bloco cmds→main para o centro */
  justify-content:center;
  gap:var(--tb-gap, 3px);
}

body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-main,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-main,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster-main{
  flex:0 0 auto; /* não estica — evita buraco entre cmds e main */
  justify-content:center;
  min-width:0;
  gap:var(--tb-gap, 3px);
}

/* Sep após o main absorve o espaço à direita → sys fica ancorado */
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-main + .toolbar-sep,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-main + .toolbar-sep,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster-main + .toolbar-sep{
  margin-left:auto;
}

body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-sys,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-sys,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-cluster-sys{
  flex:0 0 auto;
  margin-left:0;
  justify-content:center;
  gap:var(--tb-gap, 3px);
}

/* Sep antes do sys some para evitar espaço duplo */
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-cluster-sys ~ .toolbar-sep,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-cluster-sys ~ .toolbar-sep{
  display:none;
}

/* Estreito: reduz gaps; scroll horizontal da barra resolve overflow */
@container tbrail (max-height: 90px){
  .toolbar-cluster-cmds,
  .toolbar-cluster-main{
    gap:1px;
  }
}

/* Scrollable middle for many buttons */
.toolbar-digi .tb-scroll{
  display:contents;
}

/* Buttons */
.toolbar-digi .toolbar-btn{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  width:100%;
  min-width:0;
  height:auto;
  min-height:44px;
  padding:5px 4px 4px;
  border:1px solid transparent;
  border-radius:11px;
  background:transparent;
  color:var(--dd-muted);
  cursor:pointer;
  transition:background .14s,border-color .14s,color .14s,transform .12s,box-shadow .14s;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  flex:0 0 auto;
  flex-shrink:0;
  box-sizing:border-box;
  overflow:visible;
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-btn,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-btn,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-btn{
  width:auto;
  min-width:44px;
  max-width:none;
  min-height:50px;
  height:50px;
  max-height:50px;
  padding:2px 5px;
  gap:1px;
  flex:0 0 auto;
  flex-shrink:0;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:center !important;
  overflow:visible;
  box-sizing:border-box;
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-label,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-label,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-label{
  display:block;
  width:100%;
  max-width:52px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
  line-height:1.1;
  padding-bottom:0;
  flex:0 0 auto;
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-btn-face,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-btn-face,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-btn-face{
  flex:0 0 auto;
  margin:0;
}
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-more,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-more,
body:not([data-toolbar-pos]) .toolbar-digi .toolbar-more{
  width:auto;
  height:50px;
  align-items:center;
  align-self:center;
}
.toolbar-digi .toolbar-btn:hover{
  color:var(--dd-text);
  background:rgba(79,214,255,.08);
  border-color:rgba(79,214,255,.2);
}
.toolbar-digi .toolbar-btn:active{ transform:translateY(1px); }
.toolbar-digi .toolbar-btn.on{
  color:var(--dd-text);
  background:linear-gradient(180deg,rgba(255,154,46,.2),rgba(255,154,46,.08));
  border-color:rgba(255,154,46,.45);
  box-shadow:0 0 0 1px rgba(255,154,46,.12) inset,0 0 14px rgba(255,154,46,.15);
}
.toolbar-digi .toolbar-btn.on .toolbar-label{ color:var(--dd-orange); }

.toolbar-digi .toolbar-btn-face{
  display:grid;
  place-items:center;
  width:var(--tb-btn);
  height:var(--tb-btn);
  min-width:var(--tb-btn);
  min-height:var(--tb-btn);
  flex:0 0 auto;
  border-radius:10px;
  background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.06);
}
.toolbar-digi .toolbar-btn.on .toolbar-btn-face{
  border-color:rgba(255,154,46,.35);
  background:rgba(255,154,46,.12);
  box-shadow:0 0 10px rgba(255,154,46,.2);
}
.toolbar-digi .toolbar-ico{
  font-size:calc(var(--tb-btn) * .55);
  line-height:1;
}
.toolbar-digi .toolbar-ico-img{
  width:calc(var(--tb-btn) - 10px);
  height:calc(var(--tb-btn) - 10px);
  object-fit:contain;
  image-rendering:pixelated;
  filter:drop-shadow(0 0 4px rgba(79,214,255,.15));
}
.toolbar-digi .toolbar-label{
  font-family:var(--dd-display);
  font-size:var(--tb-label);
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  line-height:1;
  color:inherit;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:center;
}
.toolbar-digi .toolbar-badge{
  position:absolute;
  top:2px;
  right:4px;
  min-width:15px;
  height:15px;
  padding:0 4px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-family:var(--dd-display);
  font-size:8px;
  font-weight:700;
  color:#fff;
  background:linear-gradient(180deg,#ff6b7a,#e23b4b);
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 2px 8px rgba(226,59,75,.45);
  z-index:2;
}
.toolbar-digi .toolbar-btn.logout:hover{
  color:#ff8a96;
  background:rgba(255,93,108,.1);
  border-color:rgba(255,93,108,.35);
}

/* More — abre como aba (float-win) Digivice */
.toolbar-digi .toolbar-more{ position:relative; display:flex; width:100%; }
body[data-toolbar-pos="top"] .toolbar-digi .toolbar-more,
body[data-toolbar-pos="bottom"] .toolbar-digi .toolbar-more{ width:auto; }

.float-win.toolbar-more-win,
.float-win.more-win{
  --dd-shell:#e88928;
  --dd-shell-2:#c45f12;
  --dd-shell-hi:#ffb45a;
  --dd-cyan:#3ecfff;
  --dd-lcd:#07141a;
  --dd-text:#d7f4ff;
  --dd-muted:#6f93a3;
  --dd-font:"Rajdhani","Segoe UI",system-ui,sans-serif;
  --dd-display:"Orbitron","Rajdhani",system-ui,sans-serif;

  width:min(220px, calc(100vw - 24px)) !important;
  min-width:min(220px, calc(100vw - 16px)) !important;
  max-width:min(360px, calc(100vw - 16px)) !important;
  font-family:var(--dd-font) !important;
  color:var(--dd-text) !important;
  background:
    radial-gradient(120% 80% at 12% 0%,rgba(255,180,90,.35),transparent 42%),
    linear-gradient(165deg,var(--dd-shell-hi) 0%,var(--dd-shell) 38%,var(--dd-shell-2) 100%) !important;
  border:2px solid #8a4a10 !important;
  border-radius:16px !important;
  box-shadow:
    0 0 0 1px rgba(255,220,160,.35) inset,
    0 0 0 4px rgba(0,0,0,.22) inset,
    0 18px 40px rgba(0,0,0,.5) !important;
  overflow:hidden;
  display:flex !important;
  flex-direction:column !important;
  container-type:inline-size;
  container-name:moremenu;
}

.float-win.toolbar-more-win .float-head,
.float-win.more-win .float-head{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center;
  gap:8px;
  padding:7px 8px 7px 10px !important;
  min-height:36px;
  background:linear-gradient(180deg,rgba(255,220,160,.22),rgba(0,0,0,.18)) !important;
  border-bottom:1px solid rgba(0,0,0,.28) !important;
}
.float-win.toolbar-more-win .float-title,
.float-win.more-win .float-title{
  flex:1 1 auto;
  margin:0 !important;
  font-family:var(--dd-display) !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase;
  color:#1a0e05 !important;
  text-shadow:0 1px 0 rgba(255,230,180,.35);
}
.float-win.toolbar-more-win .float-title::before,
.float-win.more-win .float-title::before{
  content:"D-MORE";
  display:inline-block;
  margin-right:7px;
  padding:2px 6px;
  border-radius:5px;
  border:1px solid rgba(0,0,0,.25);
  background:linear-gradient(180deg,#0c1f28,#07141a);
  color:var(--dd-cyan);
  font-size:8px;
  letter-spacing:.1em;
  text-shadow:none;
  vertical-align:middle;
}
.float-win.toolbar-more-win .float-close,
.float-win.more-win .float-close,
.float-win.toolbar-more-win .float-head button:last-child,
.float-win.more-win .float-head button:last-child{
  width:28px !important;
  height:28px !important;
  border-radius:8px !important;
  border:1px solid #8a4a10 !important;
  background:linear-gradient(180deg,#ffe0a8,#e88928) !important;
  color:#1a0e05 !important;
  font-size:15px !important;
  line-height:1 !important;
  opacity:1 !important;
}

.float-win.toolbar-more-win .float-body,
.float-win.more-win .float-body{
  flex:1 1 auto !important;
  min-height:0 !important;
  padding:8px !important;
  overflow:auto !important;
  background:
    linear-gradient(180deg,rgba(7,20,26,.75),rgba(7,20,26,.94)),
    repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.1) 2px,rgba(0,0,0,.1) 3px),
    var(--dd-lcd) !important;
  border-top:1px solid rgba(62,207,255,.12);
}

/* Lista vertical de apps (não grade de cards) */
.toolbar-more-grid{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0;
  padding:0;
}

.toolbar-more-item{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:0;
  padding:8px 10px 8px 8px;
  border-radius:10px;
  border:1px solid rgba(62,207,255,.14);
  background:
    linear-gradient(90deg,rgba(62,207,255,.06),transparent 42%),
    linear-gradient(180deg,rgba(16,36,48,.95),rgba(8,18,26,.98));
  color:var(--dd-text);
  font-family:var(--dd-font);
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-align:left;
  cursor:pointer;
  transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .12s ease;
  box-shadow:inset 0 1px 0 rgba(62,207,255,.05);
}
.toolbar-more-item::after{
  content:"›";
  grid-column:3;
  font-size:18px;
  font-weight:700;
  color:var(--dd-muted);
  line-height:1;
  opacity:.7;
}
.toolbar-more-item:hover{
  background:
    linear-gradient(90deg,rgba(255,154,46,.12),transparent 50%),
    linear-gradient(180deg,rgba(24,40,52,.98),rgba(10,20,28,.98));
  border-color:rgba(255,154,46,.4);
  transform:none;
  box-shadow:0 0 0 1px rgba(255,180,90,.12) inset;
}
.toolbar-more-item:hover::after{
  color:var(--dd-shell-hi, #ffb45a);
  opacity:1;
}
.toolbar-more-item.on{
  background:
    linear-gradient(90deg,rgba(255,154,46,.22),transparent 55%),
    linear-gradient(180deg,rgba(40,28,12,.55),rgba(16,24,32,.95));
  border-color:rgba(255,154,46,.5);
  color:#ffe0a8;
  box-shadow:0 0 16px rgba(255,154,46,.15);
}
.toolbar-more-item.on::after{
  color:#ffe0a8;
  opacity:1;
}
.toolbar-more-item.toolbar-more-logout{
  margin-top:4px;
  border-color:rgba(248,113,113,.28);
  color:#fca5a5;
  background:
    linear-gradient(90deg,rgba(248,113,113,.1),transparent 45%),
    linear-gradient(180deg,rgba(32,16,18,.95),rgba(12,10,12,.98));
}
.toolbar-more-item.toolbar-more-logout::after{
  color:#f87171;
}
.toolbar-more-item.toolbar-more-logout:hover{
  border-color:rgba(248,113,113,.55);
  background:rgba(248,113,113,.14);
  color:#fecaca;
  transform:none;
}

.toolbar-more-item .toolbar-ico,
.toolbar-more-item .toolbar-ico-img{
  grid-column:1;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  border:1px solid rgba(62,207,255,.18);
  background:rgba(0,0,0,.35);
  font-size:18px;
  line-height:1;
  object-fit:contain;
  image-rendering:pixelated;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.toolbar-more-item.on .toolbar-ico,
.toolbar-more-item.on .toolbar-ico-img{
  border-color:rgba(255,154,46,.4);
  background:rgba(255,154,46,.12);
}
.toolbar-more-item > span:last-child{
  grid-column:2;
  line-height:1.2;
  font-family:var(--dd-display);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  min-width:0;
}

@container moremenu (max-width: 240px) {
  .toolbar-more-item{
    grid-template-columns:32px minmax(0,1fr) auto;
    gap:8px;
    padding:7px 8px 7px 6px;
  }
  .toolbar-more-item .toolbar-ico,
  .toolbar-more-item .toolbar-ico-img{
    width:30px;
    height:30px;
    font-size:15px;
  }
  .toolbar-more-item > span:last-child{
    font-size:10px;
  }
}

@media (max-width: 420px){
  .float-win.toolbar-more-win,
  .float-win.more-win{
    width:min(100vw - 16px, 220px) !important;
  }
}

/* —— Resize handles —— */
.toolbar-digi .tb-resize{
  position:absolute;
  z-index:5;
  touch-action:none;
  background:transparent;
  display:none; /* só a aresta útil do dock atual */
}
.toolbar-digi .tb-resize.edge-w,
.toolbar-digi .tb-resize.edge-e{
  top:24px;
  bottom:24px;
  width:8px;
  cursor:ew-resize;
}
.toolbar-digi .tb-resize.edge-n,
.toolbar-digi .tb-resize.edge-s{
  left:16px;
  right:16px;
  height:8px;
  cursor:ns-resize;
}

/* Direita: grip na borda interna esquerda */
body[data-toolbar-pos="right"] .toolbar-digi .tb-resize.edge-w{
  display:block;
  left:0;
  right:auto;
}

/* Esquerda: grip na borda interna direita */
body[data-toolbar-pos="left"] .toolbar-digi .tb-resize.edge-e{
  display:block;
  right:0;
  left:auto;
}

/* Topo (padrão): grip na borda inferior */
body[data-toolbar-pos="top"] .toolbar-digi .tb-resize.edge-s,
body:not([data-toolbar-pos]) .toolbar-digi .tb-resize.edge-s{
  display:block;
  bottom:0;
  top:auto;
}

/* Rodapé: grip na borda superior */
body[data-toolbar-pos="bottom"] .toolbar-digi .tb-resize.edge-n{
  display:block;
  top:0;
  bottom:auto;
  left:16px;
  right:16px;
}

/* Float: 4 arestas */
body[data-toolbar-pos="float"] .toolbar-digi .tb-resize.edge-w{
  display:block;
  left:0;
  right:auto;
}
body[data-toolbar-pos="float"] .toolbar-digi .tb-resize.edge-e{
  display:block;
  right:0;
  left:auto;
}
body[data-toolbar-pos="float"] .toolbar-digi .tb-resize.edge-s{
  display:block;
  bottom:0;
  top:auto;
}
body[data-toolbar-pos="float"] .toolbar-digi .tb-resize.edge-n{
  display:block;
  top:0;
  bottom:auto;
  left:16px;
  right:16px;
}

.toolbar-digi .tb-resize.edge-w::after,
.toolbar-digi .tb-resize.edge-e::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:3px;
  height:36px;
  transform:translate(-50%,-50%);
  border-radius:99px;
  background:linear-gradient(180deg,rgba(79,214,255,.15),rgba(255,154,46,.55),rgba(79,214,255,.15));
  opacity:.55;
}
.toolbar-digi .tb-resize.edge-n::after,
.toolbar-digi .tb-resize.edge-s::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:36px;
  height:3px;
  transform:translate(-50%,-50%);
  border-radius:99px;
  background:linear-gradient(90deg,rgba(79,214,255,.15),rgba(255,154,46,.55),rgba(79,214,255,.15));
  opacity:.55;
}
.toolbar-digi .tb-resize:hover::after{ opacity:1; }

/* Responsive viewport */
@media (max-width:900px){
  :root{ --tb-btn:30px; --tb-label:7px; --tb-thickness:68px; }
}
@media (max-width:640px){
  :root{ --tb-thickness:58px; --tb-btn:28px; }
  body:not([data-toolbar-pos="float"]) .toolbar-digi .toolbar-label{ display:none; }
  body:not([data-toolbar-pos="float"]) .toolbar-digi .toolbar-btn{ min-height:40px; padding:4px; }
  .toolbar-digi .tb-dock-switch.tb-dock-pad{
    padding:2px;
    gap:0;
  }
  .toolbar-digi .tb-dock-compass{
    max-width:min(48px, 100%);
    gap:2px;
  }
}

/* Vertical rails (left / right / float): não esmagar itens — scroll no meio */
body[data-toolbar-pos="left"] .toolbar.toolbar-digi,
body[data-toolbar-pos="right"] .toolbar.toolbar-digi{
  overflow-x:hidden;
  overflow-y:hidden;
  touch-action:pan-y;
}
body[data-toolbar-pos="left"] .toolbar-digi .toolbar-cluster-main,
body[data-toolbar-pos="right"] .toolbar-digi .toolbar-cluster-main{
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  touch-action:pan-y;
  justify-content:flex-start;
  gap:var(--tb-gap, 4px);
}
body[data-toolbar-pos="left"] .toolbar-digi .toolbar-btn,
body[data-toolbar-pos="right"] .toolbar-digi .toolbar-btn,
body[data-toolbar-pos="float"] .toolbar-digi .toolbar-btn,
.toolbar.toolbar-digi.is-tb-float-morph .toolbar-btn,
.toolbar.toolbar-digi.is-tb-dragging .toolbar-btn{
  flex:0 0 auto !important;
  flex-shrink:0 !important;
  min-height:max(44px, calc(var(--tb-btn) + 16px)) !important;
  height:auto !important;
  max-height:none !important;
}
body[data-toolbar-pos="left"] .toolbar-digi .toolbar-cluster,
body[data-toolbar-pos="right"] .toolbar-digi .toolbar-cluster,
body[data-toolbar-pos="float"] .toolbar-digi .toolbar-cluster{
  gap:max(4px, var(--tb-gap, 4px));
}
body[data-toolbar-pos="left"] .toolbar-digi .toolbar-cluster-cmds,
body[data-toolbar-pos="right"] .toolbar-digi .toolbar-cluster-cmds,
body[data-toolbar-pos="float"] .toolbar-digi .toolbar-cluster-cmds,
body[data-toolbar-pos="left"] .toolbar-digi .toolbar-cluster-sys,
body[data-toolbar-pos="right"] .toolbar-digi .toolbar-cluster-sys,
body[data-toolbar-pos="float"] .toolbar-digi .toolbar-cluster-sys{
  flex:0 0 auto;
  flex-shrink:0;
}

/* —— Float / vertical: itens acompanham largura e altura da barra —— */
body[data-toolbar-pos="float"] .toolbar.toolbar-digi{
  --tb-btn: clamp(24px, calc(var(--tb-thickness) * 0.42), 44px);
  --tb-label: clamp(6px, calc(var(--tb-thickness) * 0.11), 11px);
  --tb-pad: clamp(4px, calc(var(--tb-thickness) * 0.1), 10px);
  --tb-gap: clamp(2px, calc(var(--tb-thickness) * 0.04), 6px);
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-btn{
  min-height: max(44px, calc(var(--tb-btn) + 16px));
  padding: clamp(3px, 6%, 8px) clamp(2px, 5%, 8px);
  gap: clamp(1px, 3%, 4px);
  flex-shrink: 0;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-label{
  font-size: var(--tb-label);
  max-width: 100%;
  line-height: 1.1;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-badge{
  top: 1px;
  right: 2px;
  min-width: 13px;
  height: 13px;
  font-size: 7px;
  padding: 0 3px;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-sep{
  width: min(70%, calc(100% - 8px));
  margin: clamp(3px, 2%, 8px) auto;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-cluster{
  gap: var(--tb-gap);
  min-width: 0;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-cluster-main{
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

body[data-toolbar-pos="float"] .toolbar-digi .toolbar-more{
  min-width: 0;
}

/* Largura estreita: só ícones */
@container tbrail (max-width: 68px){
  .toolbar-label{ display:none; }
  .toolbar-btn{
    flex-shrink:0 !important;
    min-height: max(40px, calc(var(--tb-btn) + 12px)) !important;
    padding: 4px 2px;
  }
  .tb-dock-switch.tb-dock-pad{
    padding:2px;
    border-radius:10px;
  }
  .tb-dock-compass{
    gap:1px;
    padding:1px;
    border-radius:8px;
  }
  .tb-dock-btn{ border-radius:5px; }
  .tb-dock-ico{
    width:5px;
    height:5px;
    border-width:0 1.5px 1.5px 0;
  }
  .tb-dock-float .tb-dock-ico-float{
    width:6px;
    height:6px;
  }
}
@container tbrail (max-width: 62px){
  .tb-dock-switch.tb-dock-pad{ padding:1px; }
  .toolbar-btn{
    flex-shrink:0 !important;
    min-height: max(36px, calc(var(--tb-btn) + 10px)) !important;
  }
}

/* Largura confortável: ícone + label em linha (rail vertical; topo/rodapé sobrescrevem) */
@container tbrail (min-width: 96px){
  .toolbar-btn{
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    min-height: calc(var(--tb-btn) + 10px);
    padding: 5px 8px;
  }
  .toolbar-label{
    display: block;
    flex: 1 1 auto;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: 0.04em;
  }
  .toolbar-btn-face{
    flex: 0 0 auto;
  }
  .toolbar-badge{
    top: 4px;
    right: 6px;
  }
  .toolbar-more{
    width: 100%;
  }
}

@container tbrail (min-width: 140px){
  .toolbar-btn{
    gap: 10px;
    padding: 6px 10px;
    border-radius: 12px;
  }
  .toolbar-label{
    font-size: max(var(--tb-label), 9px);
    letter-spacing: 0.06em;
  }
}

/* Altura baixa (float encolhido): compacta sem esmagar — scroll resolve */
@container tbrail (max-height: 360px){
  .toolbar-btn{
    flex-shrink:0 !important;
    min-height:max(40px, calc(var(--tb-btn) + 12px)) !important;
    padding:3px 4px;
    gap:1px;
  }
  .toolbar-sep{ margin:3px auto; }
  .toolbar-cluster{ gap:3px; }
}
@container tbrail (max-height: 280px){
  .toolbar-label{ display:none; }
  .toolbar-btn{
    flex-direction:column !important;
    justify-content:center;
    flex-shrink:0 !important;
    min-height:max(36px, calc(var(--tb-btn) + 10px)) !important;
    padding:3px 2px;
  }
  .tb-dock-switch.tb-dock-pad{ padding:1px; }
}

@media (max-height:500px) and (orientation:landscape){
  body[data-toolbar-pos="right"] .toolbar.toolbar-digi,
  body[data-toolbar-pos="left"] .toolbar.toolbar-digi{
    --tb-thickness:54px;
  }
  body:not([data-toolbar-pos="float"]) .toolbar-digi .toolbar-label{ display:none; }
}
@media (hover:none) and (pointer:coarse){
  .toolbar-digi .toolbar-btn:hover{ transform:none; }
  .toolbar-digi .tb-resize.edge-w,
  .toolbar-digi .tb-resize.edge-e{ width:14px; }
  .toolbar-digi .tb-resize.edge-n,
  .toolbar-digi .tb-resize.edge-s{ height:14px; }
  body[data-toolbar-pos="float"] .toolbar-digi .toolbar-btn{
    min-height: max(40px, calc(var(--tb-btn) + 12px));
  }
}
