/* NORCOM NOC — Documentacao de rede MOBILE. Desktop unchanged. */
@media (max-width: 767px) {
  #docs {min-width:0;max-width:100%;overflow-x:clip;}
  #docs .noc-geo-section, #docs .topology-section {box-sizing:border-box;width:100%;max-width:100%;min-width:0;margin:0 0 14px;padding:10px;border-radius:12px;}
  #docs .noc-geo-head {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;}
  #docs .noc-geo-head>div {min-width:0;grid-column:1/-1;}
  #docs .noc-geo-head h2,#docs .topology-heading h2 {font-size:18px;line-height:1.25;overflow-wrap:anywhere;}
  #docs .noc-geo-head>button {grid-column:auto;min-height:44px;padding:8px 10px;}
  #docs .noc-geo-head #noc-geo-edit-toggle {grid-column:2;grid-row:2;}
  #docs .noc-geo-head #noc-geo-refresh {grid-column:1;grid-row:2;justify-self:start;}
  #docs .noc-geo-body {grid-template-columns:minmax(0,1fr)!important;gap:9px;}
  #docs .noc-geo-mapbox {min-width:0;max-width:100%;width:100%;grid-column:1/-1;border-radius:10px;}
  #docs #noc-geo-map {width:100%;height:clamp(350px,64dvh,680px);min-height:350px;touch-action:pan-x pan-y;}
  #docs .noc-geo-section:not(.noc-geo-editing) #noc-geo-map {height:clamp(390px,72dvh,800px);}
  #docs .noc-geo-section.noc-geo-editing .noc-geo-sidebar {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;min-height:0;max-height:none;}
  #docs .noc-geo-sidebar input,#docs .noc-geo-sidebar select,#docs .noc-geo-cable-tools button,#docs .noc-geo-onu-tools button,#docs .noc-geo-cable-tools select,#docs .noc-geo-onu-tools select,#docs .noc-geo-onu-tools input {min-height:44px;font-size:14px;}
  #docs .noc-geo-items {grid-column:1/-1;max-height:180px;overflow-y:auto;overscroll-behavior:contain;}
  #docs .noc-geo-message {grid-column:1/-1;}
  #docs .noc-geo-cable-tools,#docs .noc-geo-onu-tools {min-width:0;padding:9px;gap:7px;}
  #docs .noc-geo-cable-tools select,#docs .noc-geo-onu-tools select,#docs .noc-geo-onu-tools input {min-width:0;max-width:100%;flex:1 1 43%;}
  #docs .noc-geo-cable-tools button,#docs .noc-geo-onu-tools button {flex:1 1 auto;}
  #docs .noc-geo-auto-list {width:100%;min-width:0;max-height:230px;}
  #docs .noc-geo-auto-row {min-width:0;grid-template-columns:20px minmax(0,1fr);}
  #docs .noc-geo-auto-row select {grid-column:2;max-width:100%;}
  #docs .noc-geo-map-footer {bottom:8px;left:8px;right:8px;max-width:none;font-size:10px;flex-wrap:wrap;padding:6px 8px;pointer-events:none;}
  #docs .noc-geo-map-footer button {pointer-events:auto;min-height:36px;}
  #docs .noc-geo-legend {gap:8px;justify-content:space-between;padding:8px;}
  #docs .topology-heading {display:flex;flex-wrap:wrap;align-items:center;gap:9px;}
  #docs .topology-heading>div {flex:1 1 100%;min-width:0;}
  #docs .topology-heading>button {min-height:44px;}
  #docs .noc-route-toolbar {grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:100%;}
  #docs .noc-route-toolbar button,#docs .noc-route-toolbar select,#docs .noc-route-toolbar input {min-height:42px;min-width:0;}
  #docs .topology-content {max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;}
  #docs .route-map {max-width:100%;overflow:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;}
  #docs .route-pon {min-width:max-content;max-width:none;}
  #docs .route-cto {min-height:42px;}
  /* Dialog aligns to the top of the visual viewport; only contents scroll. */
  .topology-drill-dialog[open] {box-sizing:border-box!important;position:fixed!important;inset:0!important;top:0!important;left:0!important;right:0!important;bottom:0!important;margin:0!important;width:100vw!important;max-width:100vw!important;height:100vh!important;height:100dvh!important;max-height:100dvh!important;min-height:0!important;padding:env(safe-area-inset-top, 0px) 10px env(safe-area-inset-bottom, 0px)!important;border:0!important;border-radius:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;overscroll-behavior:contain;background:#0a1320!important;}
  .topology-drill-dialog .topology-drill-head {box-sizing:border-box;flex:0 0 auto;position:relative;z-index:3;background:#0a1320;align-items:center;padding:12px 0;gap:8px;min-width:0;}
  .topology-drill-dialog .topology-drill-head>div:first-child {flex:1;min-width:0;}
  .topology-drill-dialog .topology-drill-head h2 {font-size:17px;line-height:1.25;overflow-wrap:anywhere;margin:3px 0;}
  .topology-drill-dialog .topology-drill-head small {font-size:9px;letter-spacing:.06em;}
  .topology-drill-dialog .topology-drill-actions {flex:0 0 auto;gap:5px;}
  .topology-drill-dialog #topology-edit-toggle {font-size:11px;padding:8px 9px;min-height:40px;max-width:125px;white-space:normal;}
  .topology-drill-dialog #topology-drill-close {flex:0 0 42px;min-width:42px;min-height:42px;font-size:25px;}
  .topology-drill-dialog #topology-drill-body {flex:1 1 auto;min-height:0;min-width:0;width:100%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 0 22px;}
  .topology-drill-dialog .optical-workspace {box-sizing:border-box;padding:10px;margin:10px 0;border-radius:10px;min-width:0;max-width:100%;}
  .topology-drill-dialog .optical-stage {display:grid;grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%;gap:7px;}
  .topology-drill-dialog .optical-stage>* {max-width:100%;min-width:0;overflow-wrap:anywhere;}
  .topology-drill-dialog .optical-outlets,.topology-drill-dialog .topology-drill-children {min-width:0;max-width:100%;}
  .topology-drill-dialog .multi-split-editor,.topology-drill-dialog .multi-block {box-sizing:border-box;width:100%;min-width:0;max-width:100%;}
  .topology-drill-dialog .multi-block {padding:10px;margin-bottom:9px;overflow:hidden;}
  .topology-drill-dialog .multi-head {gap:7px;}
  .topology-drill-dialog .multi-head>* {min-width:0;}
  .topology-drill-dialog .multi-visual {box-sizing:border-box;display:grid;grid-template-columns:12px 62px minmax(0,1fr);width:100%;min-width:0;max-width:100%;gap:0;overflow:hidden;}
  .topology-drill-dialog .multi-input-line {min-width:0;}
  .topology-drill-dialog .multi-triangle {width:62px;height:112px;}
  .topology-drill-dialog .multi-triangle span {font-size:10px;margin-left:20px;overflow-wrap:anywhere;}
  .topology-drill-dialog .multi-routes {min-width:0;max-width:100%;gap:6px;}
  .topology-drill-dialog .multi-route {grid-template-columns:10px 24px minmax(0,1fr);gap:3px;min-width:0;}
  .topology-drill-dialog .multi-route-port {font-size:11px;}
  .topology-drill-dialog .multi-route-target {min-height:42px;padding:6px 7px;min-width:0;border-width:1px;border-radius:7px;}
  .topology-drill-dialog .multi-route-target strong {font-size:12px;overflow-wrap:anywhere;}
  .topology-drill-dialog .multi-route-target small {font-size:10px;}
  .topology-drill-dialog .multi-port {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .topology-drill-dialog .multi-port select {width:100%;font-size:14px;min-height:42px;}
  .topology-drill-dialog button,.topology-drill-dialog select {touch-action:manipulation;}
}
@media(max-width:370px) {
  .topology-drill-dialog .topology-drill-head h2 {font-size:15px;}
  .topology-drill-dialog #topology-edit-toggle {max-width:94px;font-size:10px;}
  .topology-drill-dialog .multi-visual {grid-template-columns:8px 52px minmax(0,1fr);}
  .topology-drill-dialog .multi-triangle {width:52px;}
  .topology-drill-dialog .multi-triangle span {margin-left:16px;font-size:9px;}
}
\n/* v2: Topologia mobile em coluna — sem largura artificial ou recortes de portas. */
@media (max-width:767px){
 #docs .topology-section,#docs .topology-content,#docs .route-map{box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;}
 #docs .route-map{padding:7px!important;max-height:68dvh!important;overflow-y:auto!important;}
 #docs .route-map-guide{white-space:normal!important;overflow-wrap:anywhere!important;font-size:10px!important;line-height:1.5!important;padding:4px 2px!important;}
 #docs .route-pon{width:100%!important;min-width:0!important;max-width:100%!important;margin-bottom:12px!important;overflow:hidden!important;}
 #docs .route-pon-heading{position:relative!important;left:auto!important;display:flex!important;flex-wrap:wrap!important;width:100%!important;min-width:0!important;gap:7px!important;padding:9px!important;box-sizing:border-box!important;}
 #docs .route-pon-heading button{font-size:13px!important;min-height:38px!important;}
 #docs .route-pon-heading small{font-size:10px!important;}
 #docs .route-track{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:8px 7px 8px 13px!important;margin:0!important;overflow:hidden!important;}
 #docs .route-track:before{left:5px!important;opacity:.6!important;}
 #docs .route-segment,#docs .route-next{box-sizing:border-box!important;display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:0!important;margin:0 0 9px!important;}
 #docs .route-segment:before{display:none!important;}
 #docs .route-row{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;flex-wrap:wrap!important;gap:5px!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:0!important;margin:0!important;}
 #docs .route-cto{box-sizing:border-box!important;display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important;align-self:stretch!important;width:100%!important;min-width:0!important;max-width:100%!important;min-height:42px!important;padding:9px 10px!important;white-space:normal!important;overflow-wrap:anywhere!important;}
 #docs .route-cto small{font-size:10px!important;white-space:nowrap!important;}
 #docs .route-splitters{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;flex-wrap:nowrap!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;padding:0!important;gap:5px!important;}
 #docs .route-split-group{box-sizing:border-box!important;display:grid!important;grid-template-columns:minmax(68px,86px) minmax(0,1fr)!important;align-items:start!important;flex:initial!important;flex-shrink:1!important;gap:7px!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:8px!important;overflow:hidden!important;}
 #docs .route-split-head{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:5px!important;min-width:0!important;width:100%!important;max-width:100%!important;overflow-wrap:anywhere!important;}
 #docs .route-triangle{width:17px!important;height:22px!important;}
 #docs .route-split-head strong{font-size:12px!important;overflow-wrap:anywhere!important;}
 #docs .route-split-outputs{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;width:100%!important;max-width:100%!important;min-width:0!important;gap:6px!important;padding:0!important;margin:0!important;}
 #docs .route-output{box-sizing:border-box!important;display:grid!important;grid-template-columns:35px minmax(0,1fr)!important;align-items:start!important;gap:4px!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:0!important;margin:0!important;}
 #docs .route-output .route-percent{box-sizing:border-box!important;min-width:0!important;width:35px!important;font-size:10px!important;padding:7px 2px!important;line-height:1.2!important;}
 #docs .route-output .route-target{box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:7px 6px!important;font-size:11px!important;line-height:1.3!important;}
 #docs .route-output .route-target small{display:block!important;margin:3px 0 0!important;font-size:9px!important;}
 #docs .route-output.cascade{display:block!important;width:100%!important;max-width:100%!important;}
 #docs .route-output.cascade>.route-percent{display:inline-block!important;}
 #docs .route-cascade-content{box-sizing:border-box!important;display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:3px 0 0!important;margin:0!important;border-left:0!important;}
 #docs .route-cascade-content .route-split-group{grid-template-columns:minmax(55px,70px) minmax(0,1fr)!important;padding:6px!important;}
 #docs .route-orphan{min-width:0!important;width:100%!important;box-sizing:border-box!important;}
 #docs .route-map .route-wires{display:none!important;}
 #docs .route-map .route-cto,#docs .route-map .route-target{z-index:1!important;}
}
@media (max-width:360px){
 #docs .route-split-group{grid-template-columns:60px minmax(0,1fr)!important;gap:4px!important;padding:5px!important;}
 #docs .route-track{padding-left:9px!important;padding-right:4px!important;}
 #docs .route-output{grid-template-columns:30px minmax(0,1fr)!important;gap:3px!important;}
 #docs .route-output .route-percent{width:30px!important;}
}