/* Three original PaneOS desktop generations. They borrow broad interface eras, not branded logos or proprietary assets. */
.client-os {
  --client-bg: #0d1419;
  --client-surface: #151e25;
  --client-window: #121a20;
  --client-border: #4d6874;
  --client-accent: #65b6dc;
  --client-text: #edf5f7;
  --client-muted: #aec0c8;
  --client-task: #111c23;
  position: relative;
  width: 100%;
  max-width: 1060px;
  min-height: 580px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--client-border);
  border-radius: 8px;
  background: var(--client-bg);
  color: var(--client-text);
  box-shadow: 0 16px 44px #0008;
}
.client-os button,
.client-os input,
.client-os textarea { font: inherit; }
.client-os button { color: inherit; cursor: pointer; }
.client-os button:focus-visible,
.client-os input:focus-visible,
.client-os textarea:focus-visible { outline: 3px solid #f2d98c; outline-offset: 2px; }
.client-os-header {
  min-height: 45px;
  padding: 6px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--client-border);
  background: var(--client-surface);
  color: var(--client-text);
}
.client-os-brand { display: flex; align-items: center; gap: 9px; font-weight: 650; font-size: 14px; }
.client-os-mark {
  width: 24px; height: 24px; display: inline-grid; place-items: center;
  border: 1px solid currentColor; border-radius: 6px; color: var(--client-accent);
  font-size: 13px; font-weight: 700;
}
.client-os-head-right { display: flex; align-items: center; gap: 12px; color: var(--client-muted); font-size: 13px; }
.client-os .client-leave,
.client-os .client-leave-boot {
  min-height: 34px; padding: 5px 10px; border: 1px solid var(--client-border);
  border-radius: 5px; background: #10161b; color: var(--client-text);
}
.client-os-main {
  min-height: 490px; min-width:0; flex: 1; overflow: auto; padding: 25px;
  background: radial-gradient(ellipse at 50% 10%, #263c49 0, var(--client-bg) 70%);
}
.client-os-taskbar {
  min-width:0; min-height: 46px; padding: 5px 10px; display: flex; flex:0 0 auto; align-items: center; gap: 10px;
  border-top: 1px solid var(--client-border); background: var(--client-task); color: var(--client-muted);
  font-size: 13px;
}
.client-start-button {
  min-height: 32px; padding: 4px 12px; display: inline-flex; flex:0 0 auto; align-items: center; gap: 8px; white-space:nowrap;
  border: 1px solid var(--client-border); border-radius: 5px; background: var(--client-surface);
}
.client-start-button span:first-child { width: 20px; height: 20px; display: inline-grid; place-items: center; border-radius: 50%; background: var(--client-accent); color: #071016; font-size: 12px; font-weight: 750; }
.client-taskbar-app { min-width:0; flex:1 1 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.client-os-taskbar time { min-width: 54px; text-align: right; font-variant-numeric: tabular-nums; }
.client-desktop-wall { min-height: 425px; display: flex; flex-direction: column; }
.client-desktop-greeting { margin: 0 auto 19px; text-align: center; }
.client-desktop-greeting h1 { margin: 3px 0; font-size: clamp(23px, 4vw, 34px); font-weight: 600; letter-spacing: -.025em; }
.client-desktop-greeting p:not(.client-overline) { margin: 3px 0; color: var(--client-muted); }
.client-overline { margin: 0; color: var(--client-accent); font-size: 11px; font-weight: 700; letter-spacing: .13em; }
.client-app-icons {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  align-content: start; gap: 9px; min-height: 210px;
}
.client-app-icon {
  min-height: 110px; padding: 10px 8px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 5px; border: 1px solid transparent;
  border-radius: 6px; background: #101c2260; color: var(--client-text); text-align: center;
}
.client-app-icon:hover { border-color: var(--client-border); background: #19272ebf; }
.client-app-icon strong { font-size: 13px; line-height: 1.3; }
.client-app-icon small { color: #f2d98c; font-size: 11px; }
.client-icon-glyph {
  width: 42px; height: 42px; flex: 0 0 auto; display: inline-grid; place-items: center;
  border: 1px solid var(--client-border); border-radius: 10px;
  background: linear-gradient(145deg, var(--client-accent), #33434a);
  color: #091116; font-size: 18px; font-weight: 760; box-shadow: 0 2px 7px #0005;
}
.client-icon-glyph.game { background: linear-gradient(145deg,#e7bd69,#7f4b2d); }
.client-icon-glyph.productivity { background: linear-gradient(145deg,#dae2f0,#617da2); }
.client-icon-glyph.security { background: linear-gradient(145deg,#9ed5b3,#3d765b); }
.client-icon-glyph.creative { background: linear-gradient(145deg,#eed69c,#927099); }
.client-desktop-bottom { margin-top: auto; display: flex; justify-content: flex-end; }
.client-power-off {
  min-height: 37px; padding: 7px 12px; border: 1px solid #7b645c; border-radius: 5px;
  background: #211a18; color: #f3c6b5;
}
.client-app-window { width:min(100%,850px); min-width:0; max-width:850px; min-height:425px; margin:0 auto; overflow:hidden; border:1px solid var(--client-border); border-radius:8px; background:var(--client-window); box-shadow:0 12px 34px #0008; }
.client-window-bar { min-height: 43px; padding: 5px 8px 5px 13px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--client-border); background: var(--client-surface); }
.client-window-bar > div { display: flex; align-items: center; gap: 9px; min-width: 0; flex: 1; }
.client-window-bar h2 { overflow: hidden; margin: 0; font-size: 15px; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }
.client-window-dot { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--client-accent); }
.client-window-edition { color: var(--client-muted); font-size: 12px; }
.client-window-close { min-height: 30px; padding: 4px 9px; border: 1px solid var(--client-border); border-radius: 4px; background: transparent; font-size: 12px; }
.client-app-content { min-width:0; padding:18px clamp(13px,3vw,24px) 23px; overflow-wrap:anywhere; }
.client-app-intro, .client-search-count, .client-game-footnote, .client-system-note { color: var(--client-muted); font-size: 14px; line-height: 1.55; }
.client-os .client-action-primary,
.client-os .client-action-secondary {
  min-height: 40px; padding: 8px 12px; border: 1px solid var(--client-accent);
  border-radius: 5px; background: var(--client-accent); color: #09151b; font-weight: 650;
}
.client-os .client-action-secondary { background: #18252c; color: var(--client-text); }
.client-os .client-link-button { padding: 5px 0; border: 0; background: transparent; color: var(--client-accent); text-decoration: underline; }
.client-system-info { max-width: 720px; margin: 16px 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 18px; }
.client-system-info > div { min-width: 0; padding: 9px 0; border-bottom: 1px solid #ffffff1a; }
.client-system-info dt { color: var(--client-muted); font-size: 12px; }
.client-system-info dd { margin: 3px 0 0; font-weight: 560; overflow-wrap: anywhere; }
.client-store-list { display:flex; flex-direction:column; }
.client-store-item { padding: 13px 0; display: grid; grid-template-columns: 43px minmax(0,1fr) auto; align-items: start; gap: 11px; border-bottom: 1px solid #ffffff1c; }
.client-store-icon .client-icon-glyph { width: 38px; height: 38px; font-size: 16px; }
.client-store-item small { color: var(--client-muted); font-size: 12px; }
.client-store-status { display: block; margin-top: 5px; color: var(--client-accent); font-size: 12px; }
.client-store-actions { padding-top: 8px; }
.client-license-warning { max-width: 660px; margin: 15px 0; padding: 14px; border: 1px solid #8a7651; border-radius: 6px; background: #241f16; }
.client-license-warning h3 { margin: 2px 0 6px; color: #ffe6ad; }
.client-license-warning p { color: var(--client-muted); line-height: 1.5; }
.client-license-state.good { color: #b9e3c7; }
.client-software-demo { margin-top: 16px; }
.client-preview-app { padding: 14px; border: 1px dashed var(--client-border); border-radius: 6px; color: var(--client-muted); }
.client-license-overlay { position: absolute; z-index: 3; inset: 44px 0 46px; display: grid; place-items: center; padding: 15px; background: #030609d9; }
.client-license-dialog { width: min(100%, 540px); padding: 18px; border: 1px solid var(--client-accent); border-radius: 9px; background: var(--client-window); box-shadow: 0 18px 55px #000a; }
.client-license-dialog h3 { margin: 4px 0 8px; font-size: 21px; }
.client-license-dialog > p:not(.client-overline) { color: var(--client-muted); line-height: 1.5; }
.client-license-dismiss { float: right; min-height: 34px; padding: 5px 9px; border: 1px solid var(--client-border); border-radius: 4px; background: transparent; }
.client-matching-license { margin: 12px 0; padding: 12px; display: grid; gap: 4px; border: 1px solid #ffffff26; border-radius: 5px; }
.client-matching-license span, .client-matching-license small { color: var(--client-muted); }
.client-note-form textarea { min-height: 180px; resize: vertical; line-height: 1.5; }
.client-form-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.client-form-footer span { color: var(--client-muted); font-size: 12px; }
.client-match-grid { width: min(100%, 360px); margin: 15px 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.client-match-tile { min-height: 66px; border: 1px solid var(--client-border); border-radius: 6px; background: #101c22; font-size: 20px; font-weight: 700; }
.client-match-tile.matched { border-color: #74c99f; background: #16412d; }
.client-match-tile:disabled:not(.matched) { opacity: .7; }
.client-game-readout { color: var(--client-accent); font-weight: 650; }
.client-palette { display: flex; flex-wrap: wrap; gap: 9px; margin: 12px 0; }
.client-color-swatch { width: 35px; height: 35px; border: 2px solid #ffffff70; border-radius: 50%; background: var(--swatch); }
.client-color-swatch.selected { outline: 2px solid var(--client-text); outline-offset: 2px; }
.client-art-grid { width: min(100%, 320px); aspect-ratio: 1; display: grid; grid-template-columns: repeat(8,1fr); gap: 2px; padding: 3px; border: 1px solid var(--client-border); background: #080e12; }
.client-art-grid button, .client-art-grid i { min-width: 0; min-height: 0; border: 1px solid #ffffff10; background: var(--pixel); }
.client-art-grid button:hover { border-color: white; }
.client-security-status, .client-utility-card { max-width: 600px; margin: 12px 0; padding: 13px; display: grid; gap: 7px; border: 1px solid var(--client-border); border-radius: 6px; background: #111b1e; }
.client-security-status span, .client-utility-card span { color: var(--client-muted); }
.client-track-list { max-width: 600px; display: flex; flex-direction: column; }
.client-track-list button { min-height: 57px; padding: 9px; display: grid; grid-template-columns: 100px minmax(0,1fr); gap: 2px 8px; border: 0; border-bottom: 1px solid #ffffff1a; background: transparent; text-align: left; }
.client-track-list button span { grid-row: span 2; align-self: center; color: var(--client-accent); font-size: 12px; }
.client-track-list button small { color: var(--client-muted); }
.client-boot-screen { min-height: 395px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.client-boot-mark { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid var(--client-accent); border-radius: 13px; color: var(--client-accent); font-size: 30px; font-weight: 700; }
.client-boot-name { color: var(--client-muted); }
.client-boot-screen h1 { margin: 9px 0 3px; font-size: 24px; }
.client-boot-status { color: var(--client-muted); }
.client-boot-track { width: min(260px,80%); height: 5px; margin: 12px 0 20px; overflow: hidden; border-radius: 4px; background: #ffffff22; }
.client-boot-track span { width: 100%; height: 100%; display: block; transform-origin: left; border-radius: inherit; background: var(--client-accent); transition: transform .15s linear; }
.client-os.client-firmware-active { width:100%; min-height:500px; position:relative; display:block; padding:0; border:0; border-radius:0; background:#000; color:#eef2f3; box-shadow:none; }
.client-os.client-firmware-active .client-os-main { min-height:500px; padding:0; background:#000!important; }
.client-firmware-controls { position:absolute; z-index:3; top:9px; right:12px; }
.client-firmware-leave { min-height:34px; border-color:#35454d; background:#10171b; color:#c3d0d5; font-size:12px; }
.client-firmware-leave:hover { border-color:#688a99; background:#17242a; color:#fff; }

/* PaneOS 7 Light: Aero-era glass, blue-green desktop, left-side icons and a glossy orb-style Start control. */
.client-os.pane7 {
  --client-bg:#227bad; --client-surface:#d9e9f4; --client-window:#eef5fa; --client-border:#75a5c1;
  --client-accent:#1b74aa; --client-task:#172737; border-radius:5px;
  background:linear-gradient(180deg,#a4d5ec 0%,#46a5d1 38%,#0c6391 100%);
  box-shadow:0 18px 50px #0009, inset 0 0 0 1px #d9f4ff;
}
.client-os.pane7 .client-os-header {
  min-height:39px; background:linear-gradient(180deg,#e8f7ffdd,#7bb7d5ad 48%,#24688cae);
  border-bottom:1px solid #c4edff; color:#102d40; text-shadow:0 1px #ffffffaa;
}
.client-os.pane7 .client-os-mark { border-color:#5c9eba; border-radius:5px; background:linear-gradient(#effbff,#80bfd9); color:#174c69; box-shadow:0 1px 3px #234b5d66; }
.client-os.pane7 .client-os-head-right { color:#12364c; }
.client-os.pane7 .client-leave, .client-os.pane7 .client-leave-boot {
  border-color:#638eaa; border-radius:3px; background:linear-gradient(#f5fbff,#c5dce9 50%,#a8c9dc);
  color:#14364d; box-shadow:inset 0 1px #fff;
}
.client-os.pane7 .client-os-main {
  background:radial-gradient(ellipse at 74% 26%,#e8fbff8c 0,transparent 20%),
    radial-gradient(ellipse at 80% 35%,#5ec7dbb3 0,transparent 37%),
    linear-gradient(145deg,#70c1dc 0%,#237eae 45%,#105586 100%);
}
.client-os.pane7 .client-desktop-wall { min-height:425px; position:relative; }
.client-os.pane7 .client-desktop-greeting { margin:0 0 7px; text-align:left; text-shadow:0 1px 3px #06314d; }
.client-os.pane7 .client-desktop-greeting .client-overline { color:#effaff; letter-spacing:.04em; }
.client-os.pane7 .client-desktop-greeting h1 { font-size:18px; letter-spacing:0; text-shadow:0 1px 4px #062f4d; }
.client-os.pane7 .client-desktop-greeting p:not(.client-overline) { color:#e8f8ff; font-size:12px; }
.client-os.pane7 .client-app-icons { width:108px; min-height:0; grid-template-columns:1fr; align-content:start; gap:3px; }
.client-os.pane7 .client-app-icon {
  min-height:87px; padding:5px 3px; gap:3px; border:1px solid transparent; border-radius:3px;
  background:transparent; color:#fff; text-shadow:0 1px 3px #001c37,0 0 3px #001c37;
}
.client-os.pane7 .client-app-icon:hover, .client-os.pane7 .client-app-icon:focus-visible { border-color:#c8f0ffb0; background:#b9e8ff44; }
.client-os.pane7 .client-app-icon strong { max-width:100%; font-size:12px; font-weight:500; line-height:1.15; }
.client-os.pane7 .client-icon-glyph { width:39px; height:39px; border-radius:7px; border-color:#e8f8ff; box-shadow:0 2px 4px #001b35a8, inset 0 1px #ffffffaa; }
.client-os.pane7 .client-desktop-bottom { position:absolute; right:5px; bottom:8px; }
.client-os.pane7 .client-power-off { border-color:#305c7b; border-radius:3px; background:linear-gradient(#5797bc,#1f547f); color:white; box-shadow:inset 0 1px #a9d9ed; }
.client-os.pane7 .client-os-taskbar {
  min-height:48px; background:linear-gradient(180deg,#597e95db,#23384c 46%,#102439f2);
  border-top:1px solid #a8d8f0; box-shadow:0 -2px 8px #09294277; color:#f0f8ff;
  backdrop-filter:blur(10px);
}
.client-os.pane7 .client-start-button {
  min-height:36px; padding:2px 12px 2px 3px; gap:7px; border:1px solid #0c3b5e; border-radius:22px;
  background:linear-gradient(180deg,#a9e8ff 0%,#45a3dc 42%,#1169aa 56%,#1b84c0 100%);
  color:#fff; text-shadow:0 1px 2px #073755; box-shadow:inset 0 1px #e4f8ff,0 1px 3px #061827;
}
.client-os.pane7 .client-start-button span:first-child { width:28px; height:28px; border:1px solid #c6f3ff; background:radial-gradient(circle at 34% 25%,#fff,#61c5ed 35%,#0864a2 75%); color:white; box-shadow:0 1px 4px #061827; }
.client-os.pane7 .client-taskbar-app { max-width:220px; padding:6px 12px; border:1px solid #7da5bd66; border-radius:3px; background:linear-gradient(#87b5ce55,#172d4355); color:#fff; }
.client-os.pane7 .client-app-window { border:1px solid #6599b7; border-radius:7px 7px 3px 3px; background:linear-gradient(#e4f2f8,#fff 54px); box-shadow:0 0 0 1px #e8f9ffb0,0 12px 32px #0016299c; }
.client-os.pane7 .client-window-bar { min-height:44px; background:linear-gradient(180deg,#edf9ff,#c6e0ee 45%,#9bbfd2); border-bottom:1px solid #799eb5; color:#15344a; text-shadow:0 1px #fff; }
.client-os.pane7 .client-window-bar h2 { font-family:"Segoe UI",Tahoma,sans-serif; font-size:14px; font-weight:500; }
.client-os.pane7 .client-window-dot { background:linear-gradient(145deg,#fff,#65b7db 60%,#11639b); box-shadow:0 1px 3px #24516a; }
.client-os.pane7 .client-window-close { min-height:27px; border:1px solid #9a3d33; border-radius:0 0 5px 5px; background:linear-gradient(#ffded4,#d95143 48%,#aa2f29); color:white; text-shadow:0 1px #63201c; }
.client-os.pane7 .client-app-content { color:#1b2932; }
.client-os.pane7 .client-app-intro, .client-os.pane7 .client-store-item p { color:#4f606a; }
.client-os.pane7 .client-store-item { border-color:#d1dce2; }
.client-os.pane7 .client-store-status { color:#216b42; }
.client-os.pane7 .client-action-primary { border-color:#30764a; background:linear-gradient(#c9f0cf,#6fc67f 50%,#43a85c); color:#11391d; box-shadow:inset 0 1px #f5fff5; }
.client-os.pane7 .client-action-secondary { border-color:#829eaf; background:linear-gradient(#fff,#d7e4eb); color:#18384d; }
/* PaneOS 10 Everyday: flat blue accent, crisp square windows and left-aligned taskbar. */
.client-os.pane10 { --client-bg:#0675b8; --client-surface:#202b35; --client-window:#f3f5f7; --client-border:#46515b; --client-accent:#0078d4; --client-task:#171c22; border-radius:1px; }
.client-os.pane10 .client-os-header { background:#202b35; color:#e9eef3; }
.client-os.pane10 .client-os-main { background:radial-gradient(ellipse at 56% 48%,#14a2d8 0,transparent 22%),linear-gradient(135deg,#0876ae,#034a83 70%,#09314f); }
.client-os.pane10 .client-app-window { border-radius:1px; border-color:#8a939a; background:#f3f5f7; box-shadow:0 12px 30px #0007; }
.client-os.pane10 .client-window-bar { border-radius:0; background:#f4f5f6; color:#202020; border-bottom-color:#d2d6da; }
.client-os.pane10 .client-window-dot { border-radius:2px; }
.client-os.pane10 .client-start-button { border-radius:1px; background:#0078d4; color:#fff; }
.client-os.pane10 .client-app-icon { border-radius:1px; }
.client-os.pane10 .client-os-taskbar { min-height:43px; background:#171c22f2; border-top-color:#333a42; }
.client-os.pane10 .client-desktop-greeting { text-shadow:0 1px 3px #002b4c; }
.client-os.pane10 .client-desktop-greeting h1 { font-size:21px; }
/* PaneOS 11 Plush: centered pill launcher, rounded cards, translucent dark taskbar. */
.client-os.pane11 { --client-bg:#18212b; --client-surface:#242d38; --client-window:#f5f6f8; --client-border:#657386; --client-accent:#8d7bd1; --client-task:#171a20eF; border-radius:14px; }
.client-os.pane11 .client-os-header { min-height:51px; padding-inline:17px; background:#202833eF; }
.client-os.pane11 .client-os-main { background:radial-gradient(ellipse at 50% 32%,#465063 0,transparent 44%),linear-gradient(140deg,#252a34,#15191f); }
.client-os.pane11 .client-app-window { border-radius:13px; background:#f5f6f8; color:#20252c; }
.client-os.pane11 .client-window-bar { border-radius:13px 13px 0 0; background:#f6f7f8; color:#20252c; border-bottom-color:#e2e4e8; }
.client-os.pane11 .client-start-button { border-radius:20px; background:#2a3039; }
.client-os.pane11 .client-app-icon { border-radius:12px; }
.client-os.pane11 .client-app-icons { grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); }
.client-os.pane11 .client-os-taskbar { justify-content:center; position:relative; min-height:53px; background:#171a20eF; backdrop-filter:blur(14px); }
.client-os.pane11 .client-start-button { margin-left:auto; }
.client-os.pane11 .client-taskbar-app { flex:0 1 auto; }
.client-os.pane11 .client-os-taskbar time { position:absolute; right:12px; }
@media (max-width:600px) {
  .client-os { min-height: 540px; border-radius: 5px; }
  .client-os-main { min-height: 445px; padding: 15px 11px; }
  .client-os-header { padding-inline: 8px; }
  .client-os-head-right { gap: 5px; font-size: 11px; }
  .client-os .client-leave { padding: 5px 7px; font-size: 12px; }
  .client-app-icons { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; }
  .client-app-icon { min-height: 94px; padding: 6px 2px; }
  .client-app-icon strong { font-size: 11px; overflow-wrap: anywhere; }
  .client-app-icon small { font-size: 10px; }
  .client-icon-glyph { width: 35px; height: 35px; font-size: 16px; }
  .client-system-info { grid-template-columns: 1fr; }
  .client-store-item { grid-template-columns: 36px minmax(0,1fr); gap: 8px; }
  .client-store-actions { grid-column: 2; padding-top: 0; }
  .client-store-actions button { width: 100%; }
  .client-track-list button { grid-template-columns: 78px minmax(0,1fr); }
  .client-window-edition { display: none; }
  .client-os-taskbar { gap: 6px; padding-inline: 5px; font-size: 11px; }
  .client-os-taskbar { display:grid; grid-template-columns:auto minmax(0,1fr) auto; }
  .client-start-button { padding-inline: 7px; font-size: 12px; }
  .client-taskbar-app { max-width:100%; text-align:center; }
  .client-os.pane11 .client-os-taskbar { justify-content:initial; }
  .client-os.pane11 .client-start-button { margin-left:0; }
  .client-os.pane11 .client-os-taskbar time { position:static; min-width:42px; }
  .client-license-dialog { padding: 13px; }
}
@media (prefers-reduced-motion: reduce) { .client-boot-track span { transition: none; } }

.client-pair-status, .client-pair-code { max-width:620px; margin:14px 0; padding:14px; display:grid; gap:8px; border:1px solid var(--client-border); border-radius:6px; background:color-mix(in srgb,var(--client-window) 86%,transparent); color:var(--client-text); }
.client-pair-status strong { font-size:16px; }
.client-pair-status span, .client-pair-code p { margin:0; color:var(--client-muted); line-height:1.5; }
.client-pair-status.good strong { color:#25874d; }
.client-pair-status.warning strong { color:#9c6515; }
.client-pair-code label { font-weight:650; }
.client-pair-code input { width:min(100%,420px); padding:10px 12px; border:1px solid var(--client-border); border-radius:4px; background:var(--client-window); color:var(--client-text); font:700 20px ui-monospace,monospace; letter-spacing:.07em; }
.client-os.pane7 .client-pair-status, .client-os.pane7 .client-pair-code { background:#f7fbf9ef; color:#1d313c; box-shadow:inset 0 1px #fff; }
.client-os.pane7 .client-pair-status span, .client-os.pane7 .client-pair-code p { color:#53656f; }
.client-os.pane10 .client-pair-status, .client-os.pane10 .client-pair-code, .client-os.pane11 .client-pair-status, .client-os.pane11 .client-pair-code { color:#232b34; background:#f5f7f9; }

.client-os .client-app-window.client-window-opening { pointer-events:none; }

/* A failed driver check uses the visual language of the installed PaneOS edition. */
.client-os.client-error-active { width:100%; min-height:500px; display:block; padding:0; border:0; border-radius:0; box-shadow:none; }
.client-os.client-error-active .client-os-main { min-height:500px; padding:0; background:#000!important; }
.driver-error-stage { min-height:500px; display:grid; place-items:center; padding:20px; background:#17212a; }
.driver-error-dialog { width:min(610px,100%); padding:22px; border:1px solid #697986; border-radius:8px; background:#f5f7f8; color:#202a31; box-shadow:0 20px 60px #0008; }
.driver-error-heading { display:flex; align-items:center; gap:13px; margin-bottom:14px; }
.driver-error-heading .client-overline { color:#527487; }
.driver-error-heading h1 { margin:3px 0 0; font-size:clamp(20px,4vw,27px); line-height:1.2; }
.driver-error-symbol { width:38px; height:38px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:#b63935; color:#fff; font-size:25px; font-weight:750; }
.driver-error-dialog p { line-height:1.5; }
.driver-error-components { margin:14px 0; padding:0; list-style:none; border-top:1px solid #d5dce0; }
.driver-error-components li { padding:10px 0; display:grid; grid-template-columns:1fr; gap:3px; border-bottom:1px solid #d5dce0; }
.driver-error-components li span { color:#52616a; font-size:13px; overflow-wrap:anywhere; }
.driver-error-code { font-size:13px; }
.driver-error-code code { padding:3px 6px; border-radius:3px; background:#e8ecef; font:600 12px ui-monospace,monospace; }
.driver-error-help { color:#52616a; }
.driver-error-actions { margin-top:18px; display:flex; flex-wrap:wrap; gap:9px; }
.driver-error-actions button { min-height:39px; padding:7px 12px; border:1px solid #73828b; border-radius:4px; background:#fff; color:#1c2b33; }
.driver-error-actions .driver-error-primary { border-color:#245f87; background:#246f9e; color:#fff; }
.driver-error-actions button:focus-visible { outline:3px solid #1a88d2; outline-offset:2px; }
.driver-error-stage.pane7 { background:radial-gradient(ellipse at 76% 27%,#d7f7ff 0,transparent 28%),linear-gradient(145deg,#76c5df,#287eaa 50%,#104d7a); }
.pane7 .driver-error-dialog { border-color:#79a8c2; border-radius:8px; background:linear-gradient(#f7fcff,#e5eff5); box-shadow:0 16px 45px #062a466e,inset 0 1px #fff; }
.pane7 .driver-error-heading { margin:-22px -22px 15px; padding:14px 20px; border-bottom:1px solid #9db6c5; border-radius:8px 8px 0 0; background:linear-gradient(#f3fbff,#c9e1ed); }
.pane7 .driver-error-heading h1 { font-family:"Segoe UI",Tahoma,sans-serif; font-size:19px; font-weight:500; }
.pane10 .driver-error-dialog { border-radius:1px; border-color:#919ba2; box-shadow:0 14px 42px #001c35a8; }
.pane10 .driver-error-heading h1 { font-size:22px; font-weight:500; }
.pane11 .driver-error-stage, .driver-error-stage.pane11 { background:radial-gradient(ellipse at 50% 35%,#514865,#24212d 52%,#14161c); }
.pane11 .driver-error-dialog { border-color:#635b78; border-radius:16px; background:linear-gradient(145deg,#292d38,#20232c); color:#edf0f7; box-shadow:0 22px 70px #090a10c9,inset 0 1px #ffffff16; }
.pane11 .driver-error-heading { padding-bottom:13px; border-bottom:1px solid #ffffff20; }
.pane11 .driver-error-heading .client-overline { color:#b8a9ec; }
.pane11 .driver-error-symbol { background:#a84e57; }
.pane11 .driver-error-components, .pane11 .driver-error-components li { border-color:#ffffff24; }
.pane11 .driver-error-components li span, .pane11 .driver-error-help { color:#c2c7d1; }
.pane11 .driver-error-code code { background:#343744; color:#f3e8ff; }
.pane11 .driver-error-actions button { border-color:#555c6c; border-radius:9px; background:#303440; color:#edf0f7; }
.pane11 .driver-error-actions .driver-error-primary { border-color:#9b8bd9; background:#7867bc; color:white; }
@media (max-width:600px) { .driver-error-stage { min-height:500px; padding:12px; } .driver-error-dialog { padding:16px; } .pane7 .driver-error-heading { margin:-16px -16px 13px; padding:13px 15px; } .driver-error-actions { display:grid; } .driver-error-actions button { width:100%; } }
