:host {
  --vr-navy: #10243e;
  --vr-navy-deep: #091725;
  --vr-teal: #08736a;
  --vr-text-on-dark: #eef6fb;
  --vr-muted-on-dark: #b7c8d8;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  color: #17273c;
  background: #f4f7fa;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
.platform-header { position: sticky; top: 0; z-index: 1000; display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; min-height: 72px; padding: 0 clamp(1rem, 4vw, 4rem); color: var(--vr-text-on-dark); border-bottom: 1px solid rgba(255,255,255,.11); background: rgba(16,36,62,.98); box-shadow: 0 8px 24px rgba(3,16,29,.14); backdrop-filter: blur(14px); }
.platform-header-end { display: flex; justify-self: end; align-items: stretch; justify-content: flex-end; gap: .25rem; min-width: 0; max-width: 100%; }
.platform-docs-search { position: relative; display: flex; align-items: center; flex: 0 1 220px; min-width: 140px; max-width: 240px; margin-right: .15rem; }
.platform-docs-search-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.platform-docs-search-control { position: relative; width: 100%; }
.platform-docs-search input { width: 100%; min-height: 36px; padding: .45rem 4.2rem .45rem .7rem; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; color: #eef6fb; background: rgba(255,255,255,.08); font: inherit; font-size: .76rem; }
.platform-docs-search input::placeholder { color: #b7c8d8; }
.platform-docs-search input:focus { outline: 2px solid rgba(67,193,181,.55); border-color: #43c1b5; }
.platform-docs-search-shortcut { position: absolute; top: 50%; right: 2rem; transform: translateY(-50%); padding: .12rem .35rem; border: 1px solid rgba(255,255,255,.18); border-radius: 5px; color: #c5d4e0; background: rgba(255,255,255,.08); font: inherit; font-size: .62rem; font-weight: 700; line-height: 1; pointer-events: none; }
.platform-docs-search-clear { position: absolute; top: 50%; right: .35rem; display: grid; width: 1.6rem; height: 1.6rem; padding: 0; transform: translateY(-50%); place-items: center; border: 0; border-radius: 50%; color: #c7d4e0; background: transparent; cursor: pointer; font: inherit; font-size: 1.1rem; }
.platform-docs-search-clear[hidden] { display: none; }
.platform-docs-search:focus-within .platform-docs-search-shortcut,
.platform-docs-search-control:has(.platform-docs-search-clear:not([hidden])) .platform-docs-search-shortcut { opacity: 0; }
.platform-docs-search-results { position: absolute; top: calc(100% + .45rem); left: 0; z-index: 40; width: min(420px, 80vw); max-height: min(420px, 60vh); overflow: auto; padding: .45rem; border: 1px solid #d8e1e9; border-radius: 10px; background: #fff; box-shadow: 0 18px 38px rgba(3,16,29,.22); }
.platform-docs-search-results a { display: flex; flex-direction: column; gap: .12rem; padding: .62rem .7rem; border-radius: 6px; color: #40556b; text-decoration: none; }
.platform-docs-search-results a:hover,.platform-docs-search-results a.active { color: #075f59; background: #e5f3f1; }
.platform-docs-search-results small { color: #52657a; font-size: .62rem; letter-spacing: .04em; text-transform: uppercase; }
.platform-docs-search-results strong { font-size: .78rem; }
.platform-docs-search-results span { color: #52657a; font-size: .7rem; }
.platform-search-empty { margin: 0; padding: .7rem; color: #52657a; font-size: .74rem; }
.platform-brand { display: flex; align-items: center; gap: .75rem; min-width: max-content; color: #fff; text-decoration: none; }
.platform-mark { display: block; width: 38px; height: 38px; object-fit: contain; }
.platform-brand-copy strong,.platform-brand-copy small { display: block; }
.platform-brand-copy strong { font-size: .94rem; line-height: 1.2; }
.platform-brand-copy small { margin-top: .12rem; color: var(--vr-muted-on-dark); font-size: .69rem; }
.platform-version { margin-left: .75rem; padding: .24rem .46rem; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: #b6c8d8; background: rgba(255,255,255,.05); font-size: .63rem; font-weight: 750; }
.platform-navigation { display: flex; align-items: stretch; gap: .25rem; min-width: 0; }
.platform-nav-link,.platform-nav-group>summary { position: relative; display: flex; align-items: center; min-height: 71px; padding: 0 .78rem; color: #c7d4e0; text-decoration: none; white-space: nowrap; font-size: .78rem; font-weight: 680; cursor: pointer; }
.platform-nav-link:hover,.platform-nav-link.active,.platform-nav-group>summary:hover,.platform-nav-group.active>summary,.platform-nav-group[open]>summary { color: #fff; }
.platform-nav-link.active::after,.platform-nav-group.active>summary::after { position: absolute; right: .75rem; bottom: 0; left: .75rem; height: 3px; border-radius: 3px 3px 0 0; background: #43c1b5; content: ""; }
.platform-nav-group { position: relative; }
.platform-nav-group>summary { list-style: none; }
.platform-nav-group>summary::-webkit-details-marker { display: none; }
.platform-nav-group>summary span { width: .42rem; height: .42rem; margin: -.2rem 0 0 .5rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.platform-nav-group[open]>summary span { margin-top: .18rem; transform: rotate(225deg); }
.platform-dropdown { position: absolute; top: calc(100% - 4px); left: 50%; z-index: 20; display: grid; min-width: 218px; padding: .55rem; border: 1px solid #d8e1e9; border-radius: 10px; background: #fff; box-shadow: 0 18px 38px rgba(3,16,29,.22); transform: translateX(-50%); }
.platform-docs-dropdown { grid-template-columns:1fr; min-width:240px; }
.platform-dropdown a { padding: .58rem .7rem; border-radius: 6px; color: #40556b; text-decoration: none; white-space: nowrap; font-size: .76rem; font-weight: 650; }
.platform-dropdown a:hover,.platform-dropdown a.active { color: #075f59; background: #e5f3f1; }
.platform-menu { display: none; align-self: center; padding: .45rem .7rem; border: 1px solid rgba(255,255,255,.2); border-radius: 7px; color: #fff; background: rgba(255,255,255,.06); font: inherit; font-size: .74rem; font-weight: 750; cursor: pointer; }
.platform-content { flex: 1; min-width: 0; }
.platform-footer { display: grid; grid-template-columns: minmax(180px, 0.85fr) minmax(0, 2.6fr); gap: 1.5rem 1.75rem; align-items: start; padding: 2rem clamp(1rem, 3vw, 3rem); color: #91a4b8; background: linear-gradient(135deg,#091725,#10243e); font-size: .73rem; }
.platform-footer-brand { display:flex; align-items:center; gap:.8rem; min-width:0; }
.platform-footer-mark { flex:0 0 auto; width:30px; height:30px; object-fit:contain; }
.platform-footer strong,.platform-footer-brand span { display: block; }
.platform-footer strong { color: #fff; font-size: .86rem; }
.platform-footer-brand span { max-width:420px; margin-top:.15rem; line-height:1.5; }
.platform-footer-columns { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(240px, 1.55fr) minmax(0, 0.85fr) minmax(0, 0.95fr) minmax(0, 0.7fr); gap: 1rem 1.1rem; }
.platform-footer-columns h2 { margin: 0 0 .55rem; color: #dce7f1; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.platform-footer-columns a,.platform-footer-columns span { display: block; margin: .28rem 0; color: #c9d6e1; text-decoration: none; }
.platform-footer-columns section:nth-child(2) a { white-space: nowrap; }
.platform-footer-columns a:hover { color: #fff; }

@media (max-width: 1180px) {
  .platform-header { grid-template-columns: auto minmax(0, 1fr) auto; }
  .platform-version { justify-self: start; }
  .platform-header-end { position: relative; display: grid; grid-template-columns: minmax(140px, 220px) auto; align-items: center; gap: .55rem; width: min(100%, 320px); }
  .platform-docs-search { flex: none; width: 100%; max-width: none; min-width: 0; margin: 0; }
  .platform-menu { display: inline-flex; justify-self: end; }
  .platform-navigation { position: absolute; top: calc(100% + .55rem); right: 0; left: auto; display: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .2rem; width: min(92vw, 420px); padding: .75rem 1rem 1rem; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: #10243e; box-shadow: 0 18px 30px rgba(3,16,29,.2); }
  .platform-navigation.open { display: grid; }
  .platform-nav-link,.platform-nav-group>summary { min-height:auto; padding: .72rem .8rem; border-radius: 6px; }
  .platform-nav-link.active,.platform-nav-group.active>summary { background: rgba(67,193,181,.14); }
  .platform-nav-link.active::after,.platform-nav-group.active>summary::after { display: none; }
  .platform-dropdown { position: static; min-width:0; margin: 0 .45rem .5rem; border-color: rgba(255,255,255,.08); background:#0b1e33; box-shadow:none; transform:none; }
  .platform-docs-dropdown { grid-template-columns:1fr; width:auto; max-height:none; overflow:visible; }
  .platform-dropdown a { color:#c7d4e0; }
  .platform-dropdown a:hover,.platform-dropdown a.active { color:#fff; background:rgba(67,193,181,.14); }
}

@media (max-width: 660px) {
  .platform-header { grid-template-columns: 1fr auto; }
  .platform-version { display: none; }
  .platform-brand-copy small { max-width: 165px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .platform-header-end { width: min(100%, 260px); grid-template-columns: minmax(0, 1fr) auto; }
  .platform-navigation { grid-template-columns: 1fr; max-height: calc(100vh - 88px); overflow: auto; }
  .platform-docs-dropdown { grid-template-columns: 1fr; }
  .platform-footer { grid-template-columns: 1fr; gap: 1.25rem; }
  .platform-footer-brand { align-items:flex-start; }
  .platform-footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-footer-columns section:nth-child(2) a { white-space: normal; overflow-wrap: anywhere; }
  .platform-docs-search-shortcut { display: none; }
  .platform-docs-search input { padding-right: 2.2rem; }
}

validation-platform-shell:not(:defined) { display:block; min-height:100vh; color:#17273c; background:#f4f7fa; }
validation-platform-shell:not(:defined)::before { display:block; height:72px; background:#10243e; box-shadow:0 8px 24px rgba(3,16,29,.14); content:""; }
validation-platform-shell:not(:defined)>* { visibility:hidden; }