/* La plataforma usa navegación React; los controles del demo estático no se cargan aquí. */
.platform-menu{display:grid;place-items:center;position:fixed;top:9px;left:7px;width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:20px;z-index:100;cursor:pointer}
.platform-menu:focus-visible{outline:2px solid var(--accent-deep);outline-offset:2px}
.platform-scrim{display:none}
.platform-navigation-shell{display:contents}
@media(min-width:861px){
  .app{grid-template-columns:52px minmax(0,1fr)}
  .app>.main{grid-column:2}
  /* Un solo árbol de navegación: se revela su ancho sin recomponer sus hijos. */
  .platform-navigation-shell{display:block;position:fixed;inset:0 auto 0 0;width:52px;overflow:clip;z-index:96;border-right:1px solid var(--line);transition:width .22s cubic-bezier(.2,.8,.2,1)}
  .platform-navigation-shell.open{width:224px;box-shadow:var(--sh-2)}
  .platform-navigation-shell>.sidebar{position:absolute;inset:0 auto 0 0;width:224px;padding-top:62px;overflow-x:hidden;overflow-y:auto;border:0;transform:none;transition:none}
  .platform-navigation-shell .platform-brand.official-logo{position:absolute;top:11px;left:56px;margin:0!important}
  .platform-navigation-shell .brand{margin:0 6px 12px;padding:8px 5px;gap:11px;min-height:48px;flex-shrink:0}
  .platform-navigation-shell .brand .mark{flex:none}
  .platform-navigation-shell .nav{padding:4px 6px}
  .platform-navigation-shell .nav a{font-size:13px;padding:8px 10px;gap:19px}
  .platform-navigation-shell .nav-children{margin-left:46px;padding-left:6px}
  .platform-navigation-shell .nav-children a{font-size:11.5px;padding:6px}
  .platform-navigation-shell .side-foot{padding:11px;gap:11px}
  .platform-navigation-shell:not(.open) .platform-brand,
  .platform-navigation-shell:not(.open) .nav-children,
  .platform-navigation-shell:not(.open) .side-foot form{visibility:hidden}
  .app>.main>.topbar{min-height:56px;padding:0 20px}
  .app>.main>.view{width:100%;max-width:none;padding:20px 24px 56px}
  .app .view h1{font-size:clamp(26px,2.4vw,34px);line-height:1.15}
  .app .page-h{margin-bottom:18px}
  .app .tbl td,.app .tbl th{padding:9px 12px}
  .app .field input,.app .field select,.app .inp{font-size:13px;padding:8px 10px}
}
@media(prefers-reduced-motion:reduce){.platform-navigation-shell{transition:none}}
@media(max-width:860px){
  .platform-menu{display:grid;place-items:center;position:fixed;top:9px;left:10px;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:21px;z-index:100;cursor:pointer}
  .platform-scrim{display:block;position:fixed;inset:0;border:0;background:#16161a66;z-index:95}
  .app .sidebar{padding-top:56px;overflow-y:auto}
  .app .topbar{padding-left:58px;min-width:0}
  .app .topbar .search{display:flex;min-width:0;flex:1;padding:8px;max-width:none}
  .app .topbar .search input{min-width:0;width:100%;font-size:12px}
  .app .topbar .search kbd,.app .topbar>.hint,.app .topbar>a span{display:none}
  .app .topbar>a{padding:8px;min-width:36px;justify-content:center;font-size:12px}
  .app .main .toolbar{display:flex;flex-wrap:wrap;max-width:100%}
  .app .toolbar select{max-width:100%;min-width:0}
  .app .view{min-width:0}
  .app .subnav{max-width:100%;overflow-x:auto}
  .app .ow-stats,.app .grid,.app .page-h{min-width:0}
}
.reference-readonly button[type="submit"],
.reference-readonly button:not([type]) { display: none; }