.mode-nav-root{display:contents}.mode-nav-button{position:fixed;top:max(8px,calc(8px + env(safe-area-inset-top)));right:12px;z-index:100;min-width:64px;min-height:48px;padding:0 12px;border:1px solid #c8d4e2;border-radius:10px;color:#17314f;background:#fff;font-size:12px;font-weight:850;box-shadow:0 5px 16px #102b471c}.mode-nav-root .mode-nav-button{position:static;z-index:auto;box-shadow:none;white-space:nowrap}.mode-nav-button:focus-visible{outline:3px solid #9bb5ff;outline-offset:2px}.mode-nav-backdrop{position:fixed;inset:0;z-index:98;background:#102b4738}.mode-nav-panel{position:fixed;top:max(60px,calc(60px + env(safe-area-inset-top)));right:12px;z-index:99;width:min(280px,calc(100vw - 24px));padding:12px;border:1px solid #d8e1ea;border-radius:14px;color:#142235;background:#fff;box-shadow:0 18px 40px #102b4733}.mode-nav-panel[hidden],.mode-nav-backdrop[hidden]{display:none}.mode-nav-title{margin:0 3px 8px;color:#5f7083;font-size:11px;font-weight:800}.mode-nav-option{display:flex;align-items:center;gap:8px;width:100%;min-height:48px;margin-top:5px;padding:0 11px;border:1px solid #d8e1ea;border-radius:9px;color:#142235;background:#f7f9fb;text-align:left;font-size:14px;font-weight:800}.mode-nav-option.current{border-color:#9fc2e9;color:#1d5cff;background:#edf3ff}.mode-nav-option:focus-visible{outline:3px solid #9bb5ff;outline-offset:2px}.mode-nav-option span{color:#6b7b8c;font-size:11px;font-weight:600}