/* Oficina isométrica interactiva */
.iso-office{
  --iso-accent:oklch(0.64 0.2 38);
  --iso-accent-soft:oklch(0.93 0.045 50);
  --iso-ink:oklch(0.3 0.015 70);
  --iso-muted:oklch(0.55 0.02 70);
  --iso-paper:oklch(0.995 0.004 80);
  --iso-line:oklch(0.9 0.012 75);
  --iso-ok:oklch(0.62 0.13 155);
  --iso-busy:oklch(0.7 0.15 70);
  --iso-away:oklch(0.72 0.01 70);
  --iso-ease:cubic-bezier(.22,1,.36,1);
  position:relative;aspect-ratio:1.55;background:oklch(0.985 0.007 80);overflow:hidden;isolation:isolate;user-select:none;-webkit-user-select:none
}
.iso-svg{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y;font-family:inherit}
.iso-office.zoomed .iso-svg{touch-action:none}
.iso-office.panning .iso-svg{cursor:grabbing}
.iso-svg:focus-visible{outline:none}
.iso-office:has(.iso-svg:focus-visible){box-shadow:inset 0 0 0 2px var(--iso-accent)}
.iso-furniture,.iso-base{pointer-events:none}
.iso-screen{animation:iso-glow 7s ease-in-out infinite alternate}
@keyframes iso-glow{from{opacity:.86}to{opacity:1}}

/* zonas */
.iso-zone{cursor:pointer;outline:none}
.iso-zone polygon{transition:fill .25s var(--iso-ease),stroke .25s var(--iso-ease);stroke:transparent;stroke-width:2}
.iso-zone:hover polygon,.iso-zone:focus-visible polygon{fill:oklch(0.64 0.2 38 / .08);stroke:oklch(0.64 0.2 38 / .5)}
.iso-zone.selected polygon{fill:oklch(0.64 0.2 38 / .06);stroke:oklch(0.64 0.2 38 / .35)}
.iso-zone-label{cursor:pointer;transition:opacity .25s}
.iso-zone-label:hover rect{stroke:oklch(0.8 0.1 45)}
.iso-zone-label rect{fill:var(--iso-paper);stroke:var(--iso-line);filter:drop-shadow(0 3px 6px oklch(0.3 0.03 60 / .12))}
.iso-zone-label text{font-size:12px;font-weight:650;fill:var(--iso-ink)}
.iso-zone-label .iso-count-bg{fill:oklch(0.95 0.012 75)}
.iso-zone-label .iso-count{font-size:10.5px;font-weight:700;fill:var(--iso-muted)}
.iso-zone-label.selected rect{fill:var(--iso-accent-soft);stroke:oklch(0.8 0.1 45)}
.iso-zone-label.selected text{fill:oklch(0.48 0.16 38)}
.iso-zone-label.selected .iso-count-bg{fill:var(--iso-accent)}
.iso-zone-label.selected .iso-count{fill:#fff}
.iso-zone-label.locked{opacity:.45}

/* personas y bots */
.iso-agent{cursor:pointer;outline:none;transition:transform .7s var(--iso-ease)}
.iso-shadow{fill:oklch(0.3 0.03 60 / .18)}
.iso-me-ring{fill:none;stroke:var(--iso-accent);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:iso-ring 2.4s var(--iso-ease) infinite}
@keyframes iso-ring{0%{opacity:.9;transform:scale(.7)}100%{opacity:0;transform:scale(1.5)}}
.iso-initials{font-size:9.5px;font-weight:800;letter-spacing:.02em}
.iso-status{stroke:#fff;stroke-width:1.6;fill:var(--iso-ok)}
.iso-status.busy{fill:var(--iso-busy)}.iso-status.away{fill:var(--iso-away)}.iso-status.dnd{fill:oklch(0.58 0.19 28)}
.iso-call{fill:var(--iso-accent);stroke:#fff;stroke-width:1.2}
.iso-tag{opacity:0;transform:translateY(-3px);transition:opacity .2s,transform .25s var(--iso-ease)}
.iso-tag rect{fill:oklch(0.27 0.015 60 / .9)}
.iso-tag text{font-size:9.5px;font-weight:600;fill:#fff}
.iso-tag.bot rect{fill:oklch(0.97 0.03 55);stroke:oklch(0.82 0.09 48)}
.iso-tag.bot text{fill:oklch(0.45 0.14 40)}
.iso-agent:hover .iso-tag,.iso-agent:focus-visible .iso-tag,.iso-human.me .iso-tag{opacity:1;transform:none}
.iso-agent:focus-visible .iso-shadow{fill:oklch(0.64 0.2 38 / .45)}
.iso-agent:hover .iso-bob{transform:translateY(-3px)}
.iso-bob{transition:transform .25s var(--iso-ease)}
.iso-agent>*{scale:1.12}
.iso-human.walking .iso-bob{animation:iso-walk .28s ease-in-out infinite alternate}
@keyframes iso-walk{from{transform:translateY(0)}to{transform:translateY(-3.5px)}}

.iso-bot-body{fill:oklch(0.96 0.01 75);stroke:oklch(0.78 0.03 65);stroke-width:1}
.iso-bot-head{fill:oklch(0.98 0.006 75);stroke:oklch(0.78 0.03 65);stroke-width:1}
.iso-bot-visor{fill:oklch(0.3 0.015 60)}
.iso-bot-eye{fill:oklch(0.86 0.12 60)}
.iso-bot-core{fill:var(--iso-accent)}
.iso-bot-antenna{stroke:oklch(0.6 0.03 65);stroke-width:1.5}
.iso-bot.idle .iso-bob{animation:iso-float 3.6s ease-in-out infinite}
.iso-bot.working .iso-bob{animation:iso-float 1.1s ease-in-out infinite}
.iso-bot.working .iso-bot-eye{animation:iso-blink 1.1s steps(2) infinite}
.iso-bot.working .iso-tag{opacity:1;transform:none}
.iso-bot.pending .iso-bob{opacity:.5;filter:grayscale(1)}
@keyframes iso-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes iso-blink{0%{fill:oklch(0.86 0.12 60)}100%{fill:var(--iso-accent)}}

/* controles y ficha flotante */
.iso-controls{position:absolute;right:14px;bottom:14px;display:flex;flex-direction:column;gap:1px;background:var(--iso-line);border-radius:12px;overflow:hidden;box-shadow:0 6px 18px oklch(0.3 0.03 60 / .12);z-index:2}
.iso-controls button{width:36px;height:36px;display:grid;place-items:center;border:0;background:var(--iso-paper);color:var(--iso-ink);cursor:pointer;padding:0}
.iso-controls button:hover{background:var(--iso-accent-soft);color:oklch(0.48 0.16 38)}
.iso-controls button:focus-visible{outline:2px solid var(--iso-accent);outline-offset:-2px}
.iso-controls svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.iso-tip{position:absolute;left:0;top:0;z-index:3;pointer-events:none;display:grid;gap:2px;max-width:210px;padding:9px 12px;border-radius:10px;background:oklch(0.27 0.015 60 / .94);color:#fff;font-size:11px;line-height:1.35;opacity:0;transition:opacity .15s}
.iso-tip.show{opacity:1}
.iso-tip strong{font-size:12px}
.iso-tip span{color:oklch(0.88 0.02 70)}

/* zonas: estado y reglas */
.iso-zone-label .iso-zone-flags{color:var(--iso-muted)}
.iso-zone-label.minor text.iso-zone-name{font-size:11px}
.iso-zone-label.closed rect.iso-zone-pill{stroke:oklch(0.7 0.12 40)}
.iso-office.far .iso-zone-label.minor.empty:not(.selected){opacity:0;pointer-events:none}
.iso-zone-label{transition:opacity .25s}

/* puestos */
.iso-desk{cursor:pointer}
.iso-desk polygon{fill:transparent;transition:fill .2s}
.iso-desk:hover polygon{fill:oklch(0.64 0.2 38 / .14)}
.iso-desk-tag{pointer-events:none;opacity:0;transition:opacity .2s}
.iso-desk-tag rect{fill:oklch(0.97 0.012 75);stroke:var(--iso-line)}
.iso-desk-tag text{font-size:8px;font-weight:650;fill:var(--iso-ink)}
.iso-desk.labelled .iso-desk-tag{opacity:.95}
.iso-office.far .iso-desk.labelled .iso-desk-tag{opacity:0}
.iso-desk.mine .iso-desk-tag rect{fill:var(--iso-accent-soft);stroke:oklch(0.8 0.1 45)}

/* objetos interactivos */
.iso-object{cursor:pointer;color:oklch(0.45 0.15 40);transition:transform .2s var(--iso-ease)}
.iso-object-bg{fill:var(--iso-paper);stroke:oklch(0.82 0.09 48);stroke-width:1.5;filter:drop-shadow(0 3px 5px oklch(0.3 0.03 60 / .16))}
.iso-object-shadow{fill:oklch(0.3 0.03 60 / .14)}
.iso-object:hover .iso-object-bg,.iso-object:focus-visible .iso-object-bg{fill:var(--iso-accent-soft);stroke:var(--iso-accent)}
.iso-object.board{color:oklch(0.42 0.08 150)}
.iso-object.link{color:oklch(0.42 0.09 235)}
.iso-svg.editing .iso-object{cursor:move}
.iso-svg.editing .iso-object-bg{stroke-width:2.2;stroke:var(--iso-accent)}
.iso-svg.placing{cursor:crosshair}

/* burbujas de conversación, gemelos, localización y reacciones */
.iso-bubbles{pointer-events:none}
.iso-bubble{fill:oklch(0.62 0.13 155 / .08);stroke:oklch(0.62 0.13 155 / .55);stroke-width:1.6}
.iso-bubble.mine{fill:oklch(0.64 0.2 38 / .08);stroke:oklch(0.64 0.2 38 / .6)}
.iso-twin-head{fill:var(--twin);stroke:oklch(0.3 0.02 60 / .35);stroke-width:1}
.iso-twin.with-owner .iso-bob{opacity:.85}
.iso-twin>*{scale:.95}
.iso-accessory{fill:none;stroke:oklch(0.25 0.015 60);stroke-width:1.4;stroke-linecap:round}
.iso-accessory .fill{fill:oklch(0.25 0.015 60)}
.iso-locate{fill:none;stroke:var(--iso-accent);stroke-width:2.4;opacity:0}
.iso-agent.locating .iso-locate{animation:iso-locate 1.2s var(--iso-ease) 3}
.iso-agent.locating .iso-tag{opacity:1;transform:none}
@keyframes iso-locate{0%{opacity:1;transform:scale(.5)}100%{opacity:0;transform:scale(1.6)}}
.iso-locate{transform-box:fill-box;transform-origin:center}
.iso-fx{pointer-events:none}
.iso-reaction circle{fill:var(--iso-paper);stroke:oklch(0.82 0.09 48);stroke-width:1.5;filter:drop-shadow(0 4px 8px oklch(0.3 0.03 60 / .2))}
.iso-reaction{color:oklch(0.5 0.17 38)}
.iso-reaction.apoyo{color:oklch(0.55 0.19 25)}.iso-reaction.idea{color:oklch(0.6 0.14 80)}.iso-reaction.ok{color:oklch(0.5 0.12 155)}
.iso-reaction-float{animation:iso-react 2.6s var(--iso-ease) forwards}
@keyframes iso-react{0%{opacity:0;transform:translateY(8px) scale(.6)}15%{opacity:1;transform:translateY(0) scale(1.1)}25%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(-26px)}}

@media (max-width:760px){.iso-office{aspect-ratio:1.15}.iso-controls{right:10px;bottom:10px}.iso-controls button{width:44px;height:44px}}
@media (prefers-reduced-motion:reduce){
  .iso-agent,.iso-bob,.iso-zone polygon,.iso-tag{transition:none}
  .iso-screen,.iso-me-ring,.iso-bot .iso-bob,.iso-human.walking .iso-bob,.iso-bot-eye,.iso-agent.locating .iso-locate{animation:none}
  .iso-reaction-float{animation:none}
  .iso-agent.locating .iso-locate{opacity:1}
}
