/* Travel edition: task-focused layout using the shared GL.iNet palette. */
.travel-detail-panel.travel-quick-panel { width: min(480px, 100vw); }
.travel-quick-form { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.travel-quick-field { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin: 18px 0; color: #365762; font-size: 16px; }
.travel-quick-field input:not([type="checkbox"]), .travel-quick-form select { width: 100%; padding: 12px; border: 1px solid #ccdce2; border-radius: 8px; background: #fff; color: #294451; font: inherit; }
.travel-quick-field input[type="checkbox"] { width: 18px; height: 18px; accent-color: #168f9f; }
.travel-quick-form p { color: #718591; font-size: 16px; line-height: 1.7; }
.travel-quick-form .travel-quick-notice { padding: 12px; background: #fff7e9; color: #88672e; border-radius: 8px; }
.travel-quick-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-top: 1px solid var(--line); background: #fff; }
.travel-quick-more { padding: 10px 0; border: 0; color: #168f9f; background: transparent; cursor: pointer; }
.travel-vpn-card { overflow: hidden; margin-bottom: 12px; border: 1px solid #dce6ea; border-radius: 8px; background: #fff; color: #294451; }
.travel-vpn-card header { display: flex; align-items: center; justify-content: space-between; min-height: 57px; padding: 0 16px; border-bottom: 1px solid #dce6ea; }
.travel-vpn-card header > div { display: flex; align-items: center; gap: 9px; }
.travel-vpn-card h3 { margin: 0; font-size: 17px; }
.travel-vpn-chip { padding: 3px 7px; border-radius: 10px; background: #eef2f4; color: #83929a; font-size: 12px; font-weight: 700; }
.travel-vpn-chip.is-running { background: #e2f7ed; color: #249a70; }
.travel-vpn-more { padding: 5px 0 5px 10px; border: 0; background: transparent; color: #718591; font-weight: 800; letter-spacing: 1px; cursor: pointer; }
.travel-vpn-profile { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 14px; padding: 20px 18px; }
.travel-vpn-icon,.travel-vpn-server-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #e3f8f1; color: #1ba377; font-size: 22px; }
.travel-vpn-profile > span:nth-child(2) { display: grid; gap: 5px; min-width: 0; }
.travel-vpn-profile strong { font-size: 16px; }
.travel-vpn-profile small { color: #81929c; font-size: 13px; }
.travel-vpn-reconnect,.travel-vpn-setup { min-height: 36px; padding: 0 12px; border: 1px solid #f0a2a2; border-radius: 6px; background: #fff; color: #d45757; font-size: 13px; cursor: pointer; }
.travel-vpn-reconnect.is-reconnect,.travel-vpn-setup { border-color: #cbd9df; color: #466470; }
.travel-vpn-card dl { margin: 0; padding: 0 18px 16px; }
.travel-vpn-card dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-top: 1px solid #e8eef0; font-size: 13px; }
.travel-vpn-card dt { color: #7d909b; }
.travel-vpn-card dd { margin: 0; color: #294451; font-weight: 700; text-align: right; }
.travel-vpn-server > section { min-height: 205px; display: grid; place-items: center; align-content: center; gap: 9px; padding: 22px; text-align: center; }
.travel-vpn-server strong { font-size: 16px; }
.travel-quick-form .travel-vpn-server p { max-width: 290px; margin: 0 0 5px; color: #81929c; font-size: 13px; line-height: 1.55; }
.travel-vpn-server-icon { background: #e9f6f8; color: #1ca8bd; }
.travel-client-summary { min-height: 34px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; color: #294451; }
.travel-client-summary strong { font-size: 16px; }
.travel-client-summary span { min-width: 24px; height: 21px; display: inline-grid; place-items: center; padding: 0 6px; border-radius: 11px; background: #e5f6f8; color: #218e9c; font-size: 13px; font-weight: 700; }
.travel-client-list { display: grid; gap: 8px; }
.travel-client-strip { min-height: 58px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.travel-client-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; background: #e5f6f8; color: #218e9c; font-size: 12px; }
.travel-client-strip>span { min-width: 0; display: grid; gap: 4px; }
.travel-client-strip>span>strong { overflow: hidden; color: #294451; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.travel-client-strip>span>small { overflow: hidden; color: #81939d; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.travel-client-rate { justify-items: end; }
.travel-client-rate strong { color: #168f9f !important; font-size: 13px !important; }
.travel-client-rate small { color: #82949e !important; font-size: 12px !important; }
.travel-internet-current { min-height: 88px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 15px; border: 1px solid #cbe7e9; border-radius: 10px; background: #f3fbfb; }
.travel-internet-current>span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #dff5ef; }
.travel-internet-current i { width: 10px; height: 10px; border-radius: 50%; background: #2aae83; box-shadow: 0 0 0 5px rgba(42,174,131,.12); }
.travel-internet-current>div { min-width: 0; display: grid; gap: 4px; }
.travel-internet-current small { color: #7d919b; font-size: 12px; }
.travel-internet-current strong { color: #294451; font-size: 17px; }
.travel-quick-form .travel-internet-current p { margin: 0; color: #6f858f; font-size: 13px; line-height: 1.4; }
.travel-network-result:empty { display: none; }
.travel-network-result.is-success { color: #258f70; }
.travel-network-check { min-width: 76px; min-height: 32px; padding: 0 10px; border: 1px solid #9fd4d9; border-radius: 6px; background: #fff; color: #168f9f; font-size: 12px; cursor: pointer; }
.travel-network-check:disabled { cursor: wait; opacity: .65; }
.travel-internet-heading { margin: 22px 0 10px; color: #294451; font-size: 16px; }
.travel-internet-methods { display: grid; gap: 8px; }
.travel-internet-method { min-height: 66px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto 78px; align-items: center; gap: 10px; padding: 10px 11px; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.travel-internet-method.is-active { border-color: #9dd5da; background: #f5fbfb; }
.travel-internet-symbol { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; background: #e8f6f7; color: #218e9c; font-size: 19px; font-weight: 700; }
.travel-internet-copy { min-width: 0; display: grid; gap: 4px; }
.travel-internet-copy strong { color: #294451; font-size: 15px; }
.travel-internet-copy small,.travel-internet-state { color: #81939d; font-size: 12px; }
.travel-internet-method.is-active .travel-internet-state { color: #2a9c78; font-weight: 700; }
.travel-internet-method button { min-height: 30px; padding: 0 10px; border: 1px solid #badce0; border-radius: 6px; background: #fff; color: #168f9f; font-size: 12px; }
.travel-internet-method button:disabled { border-color: #e0e6e9; background: #f6f8f9; color: #99a7ae; }
.travel-quick-form .travel-internet-note { margin: 14px 0 0; padding: 11px 13px; border-radius: 7px; background: #f1f5f6; color: #718791; font-size: 13px; }
.travel-ethernet-status { min-height: 92px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 16px; border: 1px solid #cbe7e9; border-radius: 10px; background: #f3fbfb; }
.travel-ethernet-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #dff5ef; }
.travel-ethernet-icon i { width: 10px; height: 10px; border-radius: 50%; background: #2aae83; box-shadow: 0 0 0 5px rgba(42,174,131,.12); }
.travel-ethernet-status>div { min-width: 0; display: grid; gap: 4px; }
.travel-ethernet-status small { color: #7d919b; font-size: 12px; }
.travel-ethernet-status strong { color: #294451; font-size: 17px; }
.travel-quick-form .travel-ethernet-status p { margin: 0; color: #6f858f; font-size: 13px; line-height: 1.4; }
.travel-ethernet-status button { min-height: 32px; padding: 0 11px; border: 1px solid #badce0; border-radius: 6px; background: #fff; color: #168f9f; font-size: 13px; }
.travel-ethernet-status button:disabled { cursor: wait; opacity: .7; }
.travel-ethernet-heading { margin: 24px 0 12px; color: #294451; font-size: 16px; }
.travel-ethernet-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.travel-ethernet-choices button { min-height: 72px; display: grid; align-content: center; gap: 6px; padding: 12px 14px; border: 1px solid #d8e4e8; border-radius: 8px; background: #fff; color: #526b76; text-align: left; }
.travel-ethernet-choices button strong { color: #294451; font-size: 15px; }
.travel-ethernet-choices button small { color: #83959e; font-size: 12px; }
.travel-ethernet-choices button.active { border-color: #4db6c2; background: #eefafa; box-shadow: inset 0 0 0 1px #4db6c2; }
.travel-ethernet-choices button.active strong { color: #168f9f; }
.travel-ethernet-auto { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 12px 14px; border-radius: 8px; background: #f2f7f8; }
.travel-ethernet-auto span { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 24px; border-radius: 50%; background: #dff5ef; color: #258f70; font-size: 14px; font-weight: 800; }
.travel-quick-form .travel-ethernet-auto p { margin: 0; color: #68808b; font-size: 13px; line-height: 1.5; }
.travel-ethernet-manual { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; margin-top: 4px; }
.travel-ethernet-manual .travel-quick-field { margin: 12px 0 0; }
.travel-ethernet-auto[hidden],.travel-ethernet-manual[hidden] { display: none; }
.minimal-internet-settings { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) [data-view="multiwan"] .wan-card { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) [data-view="multiwan"] .feature-head { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-internet-settings { display: block; margin: 0 0 14px; overflow: hidden; box-shadow: 0 4px 14px rgba(33,50,67,.05); }
.minimal-network-status { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-network-status { min-height: 48px; display: flex; align-items: center; gap: 28px; margin-bottom: 14px; padding: 0 16px; border: 1px solid #cde8df; border-radius: 8px; background: #f2fbf8; }
.minimal-network-status>span { display: flex; align-items: center; gap: 7px; color: #607b85; font-size: 13px; }
.minimal-network-status>span small { color: #80949d; font-size: 12px; }
.minimal-network-status>span strong { color: #294451; font-size: 13px; }
.minimal-network-status .minimal-network-status-main { margin-right: auto; color: #258f70; }
.minimal-network-status-main i { width: 8px; height: 8px; border-radius: 50%; background: #28a476; box-shadow: 0 0 0 4px rgba(40,164,118,.11); }
.minimal-network-status-main strong { color: #258f70 !important; font-size: 14px !important; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .standard-wan-metrics { display: none; }
.minimal-internet-settings .minimal-wan-detail { margin: 0; border: 0; border-radius: 0; background: #fff; scroll-margin-top: 80px; }
.minimal-wan-detail>header { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 16px; border-bottom: 1px solid #edf1f3; background: #fff; }
.minimal-wan-detail>header h2 { margin: 0 0 3px; color: #294451; font-size: 15px; }
.minimal-wan-detail>header h2 { display: flex; align-items: center; gap: 7px; }
.active-connection-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #28a476; box-shadow: 0 0 0 3px rgba(40,164,118,.1); }
.minimal-wan-detail>header p { margin: 0; color: #8798a1; font-size: 12px; }
.minimal-wan-detail>header .secondary-action { min-height: 30px; padding: 0 11px; font-size: 12px; }
.minimal-uplink-symbol { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; background: #e8f6f7; color: #218e9c; font-size: 19px; font-weight: 700; }
.minimal-uplink-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; padding: 14px; border-top: 1px solid #edf1f3; background: #fafcfc; }
.minimal-uplink-card { min-width: 0; min-height: 170px; overflow: hidden; border: 1px solid #dfe8ec; border-radius: 9px; background: #fff; box-shadow: 0 4px 12px rgba(33,50,67,.04); }
.minimal-uplink-card>header { min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 0 15px; border-bottom: 1px solid #e7edef; background: #fafcfc; }
.minimal-uplink-card h3 { margin: 0; color: #294451; font-size: 16px; }
.uplink-card-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #a5afb4; }
.minimal-uplink-card-body { min-height: 120px; display: grid; grid-template-columns: 54px minmax(0,1fr); align-items: center; gap: 14px; padding: 16px; }
.uplink-card-symbol { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: #e8f6f7; color: #218e9c; font-size: 21px; font-weight: 700; }
.minimal-uplink-card-body>div { min-width: 0; }
.minimal-uplink-card-body strong { color: #526b76; font-size: 14px; }
.minimal-uplink-card-body p { min-height: 30px; margin: 6px 0 0; color: #7f929c; font-size: 12px; line-height: 1.55; }
.minimal-uplink-card-body button { min-width: 92px; min-height: 30px; margin-top: 10px; padding: 0 14px; border: 1px solid #9fcfd4; border-radius: 16px; background: #fff; color: #168f9f; font-size: 12px; cursor: pointer; }
.minimal-uplink-card-body button:hover { border-color: #168f9f; background: #f0fafb; }
.minimal-network-tools { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-network-tools { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
.minimal-network-tools>.feature-card { min-width: 0; margin: 0; box-shadow: 0 4px 14px rgba(33,50,67,.05); }
.minimal-port-card { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-port-card { display: block; margin: 0 0 14px; box-shadow: 0 4px 14px rgba(33,50,67,.05); }
.minimal-tool-head { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 16px; border-bottom: 1px solid #e6edef; background: #fafcfc; }
.minimal-tool-head h2 { margin: 0 0 5px; color: #294451; font-size: 17px; }
.minimal-tool-head p { margin: 0; color: #7b8f99; font-size: 12px; }
.minimal-tool-head .segmented { flex: 0 0 auto; }
.minimal-tool-head>.secondary-action { flex: 0 0 auto; min-height: 30px; padding: 0 12px; }
.minimal-policy-row { min-height: 52px; display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 12px; margin: 12px 14px 0; padding: 8px 12px; border: 1px solid #e1e9ec; border-radius: 7px; background: #fafcfc; }
.minimal-policy-row>span { color: #526d78; font-size: 13px; font-weight: 700; white-space: nowrap; }
.minimal-policy-row .segmented { flex: 0 0 auto; }
.minimal-policy-row .segmented button { min-height: 27px; padding: 0 10px; font-size: 12px; }
.minimal-wan-mode-copy { min-width: 0; margin: 0; color: #748992; font-size: 12px; line-height: 1.5; }
.minimal-link-list { padding: 4px 14px 10px; }
.minimal-link-row { min-height: 58px; display: grid; grid-template-columns: 26px minmax(130px,1fr) minmax(90px,.8fr) 74px 30px 54px; align-items: center; gap: 10px; border-bottom: 1px solid #edf1f3; }
.minimal-link-row:last-child { border-bottom: 0; }
.minimal-link-priority { width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid #d5e0e4; border-radius: 5px; color: #71858f; font-size: 12px; }
.minimal-link-identity,.minimal-link-quality { min-width: 0; display: grid; gap: 3px; }
.minimal-link-identity { grid-template-columns: 8px minmax(0,1fr); }
.minimal-link-identity i { width: 6px; height: 6px; grid-row: 1 / 3; align-self: center; border-radius: 50%; background: #a4afb4; }
.minimal-link-row.is-online .minimal-link-identity i { background: #28a476; }
.minimal-link-row strong { overflow: hidden; color: #294451; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.minimal-link-row small { overflow: hidden; color: #8899a1; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.minimal-link-detection { min-width: 0; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.minimal-link-detection b { display: inline-flex; align-items: center; min-height: 20px; padding: 0 7px; border-radius: 5px; background: #edf5f6; color: #55727d; font-size: 11px; font-weight: 700; white-space: nowrap; }
.minimal-link-detection b.is-low-data { background: #fff3db; color: #9a6c19; }
.minimal-link-detection b.is-disabled { background: #f1f3f4; color: #95a1a6; }
.minimal-link-quality { text-align: right; }
.minimal-link-settings { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #71858f; font-size: 17px; cursor: pointer; }
.minimal-link-settings:hover,.minimal-link-settings:focus-visible { background: #edf7f8; color: #168f9f; outline: 0; }
.minimal-priority-actions { display: flex; justify-content: flex-end; gap: 3px; }
.minimal-priority-actions button { width: 24px; height: 24px; padding: 0; border: 1px solid #d9e3e7; border-radius: 5px; background: #fff; color: #71858f; cursor: pointer; }
.minimal-priority-actions button:hover { border-color: #85c8ce; color: #168f9f; }
.minimal-priority-actions button:disabled { cursor: default; opacity: .35; }
.minimal-port-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; padding: 14px; }
.minimal-port-grid button { min-width: 0; min-height: 78px; display: grid; justify-items: center; align-content: center; gap: 4px; padding: 8px 4px; border: 1px solid #dfe8ec; border-radius: 7px; background: #f8fafb; color: #91a0a8; cursor: pointer; }
.minimal-port-grid button i { font-size: 18px; font-style: normal; }
.minimal-port-grid button strong { font-size: 11px; white-space: nowrap; }
.minimal-port-grid button small { font-size: 12px; }
.minimal-port-grid button.is-online { border-color: #bce2da; background: #f1fbf8; color: #258f70; }
.minimal-port-grid button.is-active { border-color: #37b2bf; box-shadow: inset 0 0 0 1px #37b2bf; }
.minimal-port-detail { margin: 0; padding: 14px 16px; border: 0; border-top: 1px solid #e0e9ec; border-radius: 0; background: #fff; }
.minimal-port-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 11px; border-bottom: 1px solid #e7edef; }
.minimal-port-detail-title>span:first-child { display: grid; gap: 3px; }
.minimal-port-detail small { color: #81939d; font-size: 11px; }
.minimal-port-detail strong { color: #294451; font-size: 13px; }
.minimal-port-connection { color: #8b9aa2; font-size: 12px; }
.minimal-port-connection i { width: 6px; height: 6px; display: inline-block; margin-right: 5px; border-radius: 50%; background: currentColor; }
.minimal-port-connection.is-online { color: #258f70; }
.minimal-port-fields { display: grid; grid-template-columns: 1fr .8fr 1.3fr; gap: 10px; padding-top: 12px; }
.minimal-port-fields>span { min-width: 0; display: grid; align-content: start; gap: 6px; }
.minimal-port-fields>span strong { overflow: hidden; padding-top: 5px; text-overflow: ellipsis; white-space: nowrap; }
.minimal-port-actions { min-height: 38px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.minimal-port-actions>span { color: #258f70; font-size: 11px; }
.minimal-port-actions button { min-height: 30px; padding: 0 11px; border: 1px solid #9fcfd4; border-radius: 6px; background: #fff; color: #168f9f; font-size: 12px; cursor: pointer; }
.minimal-port-actions button:hover { border-color: #168f9f; background: #eefafa; }
.port-config-layer { z-index: 49; }
.port-config-layer .drawer-backdrop { width: 100%; border: 0; }
.port-config-drawer { width: min(520px,100vw); max-width: 100vw; background: #f5f8f9; }
.port-config-form { min-height: 0; display: flex; flex: 1; flex-direction: column; }
.port-config-body { min-height: 0; display: grid; align-content: start; gap: 16px; flex: 1; overflow-y: auto; padding: 22px; }
.port-config-context { min-height: 70px; display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 13px 14px; border: 1px solid #cbe7e9; border-radius: 9px; background: #f3fbfb; }
.port-config-jack { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 9px; background: #dff3f5; color: #168f9f; font-size: 20px; }
.port-config-context>span:nth-child(2) { display: grid; gap: 4px; }
.port-config-context small { color: #78909a; font-size: 12px; }
.port-config-context strong { color: #294451; font-size: 16px; }
.port-config-context em { color: #258f70; font-size: 13px; font-style: normal; font-weight: 700; }
.port-config-context em i { width: 6px; height: 6px; display: inline-block; margin-right: 5px; border-radius: 50%; background: currentColor; }
.port-config-context em.is-offline { color: #8999a1; }
.port-config-mode-row { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 14px; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.port-config-mode-row>span { display: flex; align-items: center; gap: 5px; color: #607984; font-size: 13px; font-weight: 700; }
.port-config-mode-row>span i { width: 14px; height: 14px; display: inline-grid; place-items: center; border-radius: 50%; background: #83949d; color: #fff; font-size: 12px; font-style: normal; cursor: help; }
.port-config-panel { display: grid; padding: 0 14px; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.port-config-panel[hidden] { display: none; }
.port-config-field,.port-config-static { min-height: 56px; display: grid; grid-template-columns: 130px minmax(0,1fr); align-items: center; gap: 14px; border-bottom: 1px solid #edf1f3; color: #607984; font-size: 13px; }
.port-config-panel>*:last-child { border-bottom: 0; }
.port-config-field select,.port-config-field input { width: 100%; min-height: 34px; padding: 0 10px; border: 1px solid #cfdee3; border-radius: 6px; background: #fff; color: #294451; font: inherit; }
.port-config-field input[readonly] { border-color: transparent; background: transparent; text-align: right; }
.port-config-static strong { color: #294451; font-size: 13px; text-align: right; }
.port-config-panel .port-config-submode { min-height: 60px; padding: 0; border: 0; border-bottom: 1px solid #edf1f3; border-radius: 0; }
.port-config-submode .segmented button { padding: 0 8px; }
.port-config-drawer .drawer-actions { flex: 0 0 68px; background: #fff; }
.port-config-drawer .drawer-button.cancel { border-color: #8ba4ad; color: #526d78; }
.port-config-drawer .drawer-button.apply { background: #168f9f; }
.tracking-config-layer { z-index: 50; }
.tracking-config-layer .drawer-backdrop { width: 100%; border: 0; }
.tracking-config-drawer { width: min(520px,100vw); }
.tracking-switch-row { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 14px; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.tracking-switch-row>span { display: grid; gap: 5px; }
.tracking-switch-row strong { color: #294451; font-size: 14px; }
.tracking-switch-row small { color: #7c909a; font-size: 12px; line-height: 1.5; }
.tracking-switch-row .mini-toggle { flex: 0 0 auto; }
.tracking-ip-panel { overflow: hidden; border: 1px solid #dfe8ec; border-radius: 8px; background: #fff; }
.tracking-ip-panel>header { padding: 13px 14px 10px; border-bottom: 1px solid #edf1f3; background: #fafcfc; }
.tracking-ip-panel h3 { margin: 0 0 4px; color: #294451; font-size: 14px; }
.tracking-ip-panel p { margin: 0; color: #7c909a; font-size: 12px; }
.tracking-ip-panel>div { display: grid; padding: 0 14px; }
.tracking-ip-panel label { min-height: 52px; display: grid; grid-template-columns: 110px minmax(0,1fr); align-items: center; gap: 14px; border-bottom: 1px solid #edf1f3; color: #607984; font-size: 13px; }
.tracking-ip-panel label:last-child { border-bottom: 0; }
.tracking-ip-panel input { width: 100%; min-height: 34px; padding: 0 10px; border: 1px solid #cfdee3; border-radius: 6px; background: #fff; color: #294451; font: inherit; }
.tracking-config-notice { margin: 0; padding: 12px 14px; border-radius: 7px; background: #eaf6f7; color: #54747e; font-size: 13px; line-height: 1.6; }
.minimal-wan-values { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0; padding: 0; }
.minimal-wan-values div { min-width: 0; min-height: 64px; display: grid; align-content: center; gap: 7px; padding: 10px 14px; border-right: 1px solid #edf1f3; font-size: 13px; }
.minimal-wan-values div:last-child { border-right: 0; }
.minimal-wan-values dt { color: #80919b; }
.minimal-wan-values dd { min-width: 0; margin: 0; overflow: hidden; color: #294451; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.minimal-wan-form { display: grid; gap: 14px; padding: 4px 18px 18px; }
.minimal-wan-form[hidden],.minimal-wan-values[hidden],.minimal-wan-manual[hidden],.minimal-wan-pppoe[hidden] { display: none; }
.minimal-wan-form label { display: grid; gap: 7px; color: #607984; font-size: 13px; }
.minimal-wan-form input,.minimal-wan-form select { width: 100%; min-height: 38px; padding: 0 11px; border: 1px solid #cfdee3; border-radius: 7px; background: #fff; color: #294451; font: inherit; }
.minimal-wan-manual,.minimal-wan-pppoe { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.minimal-wan-form footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 2px; }
.wan-config-layer { z-index: 48; }
.wan-config-layer .drawer-backdrop { width: 100%; border: 0; }
.wan-config-drawer { width: min(500px, 100vw); max-width: 100vw; background: #f5f8f9; }
.wan-config-head { min-height: 68px; height: auto; padding: 10px 22px; background: #fff; }
.wan-config-head>div { display: grid; gap: 3px; }
.wan-config-head small { color: #168f9f; font-size: 12px; font-weight: 700; }
.wan-config-head h2 { color: #294451; font-size: 17px; }
.wan-config-drawer>.minimal-wan-form { min-height: 0; display: flex; flex: 1; flex-direction: column; gap: 0; padding: 0; }
.wan-config-body { min-height: 0; display: grid; align-content: start; gap: 18px; flex: 1; overflow-y: auto; padding: 22px; }
.wan-config-status { min-height: 72px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 14px; border: 1px solid #cbe7e9; border-radius: 9px; background: #f3fbfb; }
.wan-config-status>span:nth-child(2) { display: grid; gap: 4px; }
.wan-config-status small { color: #78909a; font-size: 12px; }
.wan-config-status strong { color: #294451; font-size: 15px; }
.wan-config-status em { color: #258f70; font-size: 13px; font-style: normal; font-weight: 700; }
.wan-config-status em i { width: 6px; height: 6px; display: inline-block; margin-right: 5px; border-radius: 50%; background: currentColor; }
.wan-config-protocol { padding: 16px; border: 1px solid #dfe8ec; border-radius: 9px; background: #fff; }
.wan-config-protocol>span { font-size: 14px; font-weight: 700; }
.minimal-wan-auto { display: grid; gap: 12px; }
.minimal-wan-auto[hidden] { display: none; }
.minimal-wan-auto>p { margin: 0; padding: 12px 14px; border-radius: 7px; background: #eaf6f7; color: #54747e; font-size: 13px; line-height: 1.6; }
.minimal-wan-auto dl { margin: 0; padding: 4px 16px; border: 1px solid #dfe8ec; border-radius: 9px; background: #fff; }
.minimal-wan-auto dl div { min-height: 44px; display: grid; grid-template-columns: 120px minmax(0,1fr); align-items: center; border-bottom: 1px solid #edf1f3; font-size: 13px; }
.minimal-wan-auto dl div:last-child { border-bottom: 0; }
.minimal-wan-auto dt { color: #80919b; }
.minimal-wan-auto dd { margin: 0; color: #294451; font-weight: 650; text-align: right; overflow-wrap: anywhere; }
.wan-config-drawer .minimal-wan-manual,.wan-config-drawer .minimal-wan-pppoe { grid-template-columns: 1fr; gap: 14px; padding: 16px; border: 1px solid #dfe8ec; border-radius: 9px; background: #fff; }
.wan-config-advanced { padding: 0 16px; border: 1px solid #dfe8ec; border-radius: 9px; background: #fff; }
.wan-config-advanced summary { min-height: 48px; display: flex; align-items: center; color: #526d78; font-size: 14px; font-weight: 700; cursor: pointer; }
.wan-config-advanced>div { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; padding: 0 0 16px; }
.wan-config-advanced label>span { display: flex; align-items: center; gap: 5px; }
.wan-config-advanced label>span i { width: 14px; height: 14px; display: inline-grid; place-items: center; border-radius: 50%; background: #83949d; color: #fff; font-size: 12px; font-style: normal; font-weight: 800; cursor: help; }
.wan-config-drawer .drawer-actions { flex: 0 0 68px; margin: 0; background: #fff; }
.wan-config-drawer .drawer-button.cancel { border-color: #8ba4ad; color: #526d78; }
.wan-config-drawer .drawer-button.apply { background: #168f9f; }
.settings-catalog { display: grid; gap: 24px; }
.settings-group { padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.settings-group:last-child { border-bottom: 0; padding-bottom: 0; }
.settings-group h2 { margin: 0 0 14px; color: #294451; font-size: 18px; font-weight: 650; }
.settings-group-items { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.settings-group-items button { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 15px 16px; border: 1px solid #dfe8ec; border-radius: 8px; color: #365762; background: #f8fbfc; cursor: pointer; text-align: left; font-size: 16px; }
.settings-group-items button small { color: #7c929d; font-size: 13px; white-space: nowrap; }
.settings-group-items button:disabled { cursor: default; color: #84969f; background: #fafbfc; }
.settings-group-items button:not(:disabled):hover { border-color: #75c2cb; color: #168f9f; background: #edf9fa; }
.settings-group-items button:focus-visible { outline: 2px solid #168f9f; outline-offset: 2px; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) [data-view="advanced"] > .feature-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) [data-view="advanced"] > .feature-head h1 { margin: 0 0 8px; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) [data-view="advanced"] > .feature-head p { margin: 0; color: #738792; font-size: 16px; }
@media (max-width: 900px) { .settings-group-items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 800px) {
  .minimal-uplink-grid { grid-template-columns: 1fr; }
  .minimal-uplink-card { min-height: 140px; }
  .minimal-uplink-card-body { min-height: 92px; }
  .minimal-wan-values { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .minimal-wan-values div { border-bottom: 1px solid #edf1f3; }
  .minimal-wan-values div:nth-child(2n) { border-right: 0; }
  .minimal-wan-values div:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 620px) {
  body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-network-status { align-items: flex-start; flex-wrap: wrap; gap: 10px 18px; padding: 12px 14px; }
  .minimal-network-status .minimal-network-status-main { width: 100%; }
  .minimal-wan-detail>header { align-items: flex-start; flex-direction: column; padding: 12px 14px; }
  .minimal-wan-detail>header .secondary-action { width: 100%; }
  .minimal-wan-values { grid-template-columns: 1fr; }
  .minimal-wan-values div { min-height: 52px; border-right: 0; border-bottom: 1px solid #edf1f3; }
  .minimal-wan-values div:nth-last-child(-n+2) { border-bottom: 1px solid #edf1f3; }
  .minimal-wan-values div:last-child { border-bottom: 0; }
  .minimal-wan-values dd { overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
  .minimal-wan-manual,.minimal-wan-pppoe { grid-template-columns: 1fr; }
  .wan-config-advanced>div { grid-template-columns: 1fr; }
  .minimal-tool-head { align-items: flex-start; flex-direction: column; }
  .minimal-tool-head>.secondary-action { width: 100%; }
  .minimal-policy-row { grid-template-columns: 1fr; }
  .minimal-policy-row .segmented { width: 100%; }
  .minimal-policy-row .segmented button { flex: 1; }
  .minimal-link-row { grid-template-columns: 26px minmax(0,1fr) auto 30px; }
  .minimal-link-detection { display: none; }
  .minimal-link-quality { text-align: right; }
  .minimal-priority-actions { display: none; }
  .minimal-port-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .minimal-port-fields { grid-template-columns: 1fr; }
  .port-config-mode-row { align-items: flex-start; flex-direction: column; padding: 12px 14px; }
  .port-config-field,.port-config-static { grid-template-columns: 1fr; gap: 7px; padding: 11px 0; }
  .port-config-field input[readonly],.port-config-static strong { text-align: left; }
  .tracking-ip-panel label { grid-template-columns: 1fr; gap: 7px; padding: 10px 0; }
}
@media (max-width: 420px) { .settings-group-items { grid-template-columns: 1fr; } }
.travel-detail-layer { position: fixed; inset: 0; z-index: 35; }
.travel-detail-layer[hidden] { display: none; }
.travel-detail-shade { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(25, 47, 59, .28); cursor: default; }
.travel-detail-panel { position: absolute; inset: 0 0 0 auto; width: min(900px, 90vw); display: flex; flex-direction: column; background: #f4f7f9; box-shadow: -12px 0 48px rgba(25, 47, 59, .14); animation: travel-detail-enter .2s ease-out; }
.travel-detail-head { display: flex; align-items: center; gap: 16px; flex: 0 0 auto; min-height: 72px; padding: 16px 24px; background: #fff; border-bottom: 1px solid var(--line); }
.travel-detail-head h2 { margin: 0; color: #294451; font-size: 19px; }
.travel-detail-close { margin-left: auto; width: 36px; height: 36px; border: 0; border-radius: 8px; color: #496672; background: #eef5f6; font-size: 26px; cursor: pointer; }
.travel-detail-back { padding: 8px; border: 0; color: #168f9f; background: transparent; cursor: pointer; }
.travel-detail-content { overflow-y: auto; overscroll-behavior: contain; flex: 1; min-height: 0; padding: 20px; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .travel-detail-content .feature-page,
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .travel-detail-content .wireless-content { margin: 0; padding: 0; max-width: none; background: transparent; }
.travel-detail-content .feature-shell { padding: 0; }
.travel-detail-content .feature-head { flex-wrap: wrap; gap: 12px; }
.travel-detail-content .feature-head h1,
.travel-detail-content .wireless-title { display: none; }
.travel-detail-content .data-table { overflow-x: auto; }
.travel-detail-content .client-table .table-row { min-width: 680px; }
.travel-detail-content .vpn-grid { grid-template-columns: 1fr; }
.travel-detail-content .mesh-canvas { min-height: 0; }
.travel-detail-head button:focus-visible { outline: 2px solid #168f9f; outline-offset: 2px; }
@keyframes travel-detail-enter { from { transform: translateX(40px); opacity: .5; } to { transform: translateX(0); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .travel-detail-panel { animation: none; } }
@media (max-width: 760px) {
  .travel-detail-panel { width: 100%; }
  .travel-detail-content { padding: 16px; }
  .travel-detail-head { padding: 12px 16px; min-height: 60px; }
  .travel-ethernet-choices,.travel-ethernet-manual,.minimal-wan-manual,.minimal-wan-pppoe { grid-template-columns: 1fr; }
  .travel-internet-method { grid-template-columns: 38px minmax(0,1fr) 78px; }
  .travel-internet-state { display: none; }
}
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .main-network-panel { min-height: 0; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav {
  min-height: 60px;
  justify-content: flex-start;
  gap: 8px;
  padding: 12px max(24px, calc((100% - 1080px) / 2));
  background: #fff;
  border-bottom: 1px solid var(--line);
}
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav button {
  display: block;
  width: auto;
  min-width: 72px;
  padding: 10px 18px;
  border-radius: 8px;
  color: #657c87;
  font-size: 16px;
  white-space: nowrap;
}
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav button span,
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav button.active::after { display: none; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav button.active { color: #168f9f; background: #e9f8fa; }
body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-canvas {
  max-width: 1128px;
  min-height: 0;
  margin: 0 auto;
  padding: 40px 24px 64px;
  background: transparent;
  box-shadow: none;
}
.travel-welcome { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.travel-welcome h1 { margin: 8px 0 12px; color: #203241; font-size: clamp(24px, 3vw, 32px); font-weight: 650; letter-spacing: -.03em; }
.travel-welcome p:not(.eyebrow) { margin: 0; color: #738792; font-size: 16px; line-height: 1.7; }
.travel-online { display: inline-flex; align-items: center; gap: 7px; color: #288c75; font-size: 15px; white-space: nowrap; }
.travel-online i { width: 7px; height: 7px; border-radius: 50%; background: #2cb68d; }
.travel-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); gap: 20px; }
.travel-device { display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 30px; border: 1px solid #d7e7eb; border-radius: 14px; background: radial-gradient(ellipse at 50% 40%, #fff 20%, #edf7f8 100%); }
.travel-caption { color: #718792; font-size: 15px; line-height: 1.5; }
.travel-device > .travel-caption { align-self: flex-start; }
.travel-device img { width: min(100%, 290px); height: 175px; margin: 12px 0; object-fit: contain; mix-blend-mode: multiply; }
.travel-device h2 { margin: 4px 0 8px; font-size: 20px; color: #294451; }
.travel-device p { margin: 0; font-size: 15px; color: #718792; }
.travel-bands { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.travel-bands span { padding: 5px 9px; font-size: 14px; color: #358e99; background: #fff; border: 1px solid #d7e7eb; border-radius: 6px; }
.travel-connections { display: grid; gap: 16px; }
.travel-setting { min-width: 0; padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.travel-setting header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.travel-setting h2 { margin: 16px 0 6px; color: #294451; font-size: 21px; overflow-wrap: anywhere; }
.travel-setting p { margin: 0; color: #738792; font-size: 15px; line-height: 1.6; }
.travel-setting button { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 20px; padding: 12px 0 0; border: 0; border-top: 1px solid #ecf1f3; color: #168f9f; background: transparent; text-align: left; font-size: 16px; cursor: pointer; }
.travel-links { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px; }
.travel-links button { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-align: left; cursor: pointer; }
.travel-links strong { display: block; margin-bottom: 6px; color: #294451; font-size: 17px; }
.travel-links small { color: #738792; font-size: 15px; }
.travel-links b { display: flex; align-items: center; gap: 20px; color: #168f9f; font-size: 22px; font-weight: 500; }
.travel-links b span { font-size: 19px; }
.travel-footer { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 24px; font-size: 15px; color: #738792; }
.travel-footer button { padding: 6px 0; border: 0; color: #168f9f; background: transparent; cursor: pointer; }
.travel-links button:hover { border-color: #7ac4cc; }
.travel-setting button:hover, .travel-footer button:hover { color: #126c78; }
.minimal-nav button:focus-visible, .travel-setting button:focus-visible, .travel-links button:focus-visible, .travel-footer button:focus-visible { outline: 2px solid #168f9f; outline-offset: 3px; }
@media (max-width: 760px) {
  body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav { gap: 4px; padding: 10px 12px; overflow-x: auto; }
  body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-nav button { min-width: auto; padding: 9px 12px; font-size: 15px; }
  body[data-experience="minimal"]:not([data-travel-advanced="true"]) .minimal-canvas { padding: 28px 16px 72px; }
  .travel-welcome { align-items: flex-start; flex-direction: column; gap: 12px; }
  .travel-layout, .travel-links { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .travel-device { padding: 22px; }
  .travel-device img { height: 130px; }
  .travel-setting { padding: 20px; }
  .travel-footer { flex-wrap: wrap; }
}
