:root{color-scheme:dark;--bg:#081326;--panel:#101f36;--border:#253d5c;--muted:#96a9c3;--mint:#5ee0c1;--text:#eaf4fc}*{box-sizing:border-box}html{font:16px system-ui,-apple-system,sans-serif}body{margin:0;background:radial-gradient(circle at 100% 0%,#133557 0,transparent 42%),var(--bg);color:var(--text);min-height:100vh}button,input{font:inherit}a{color:var(--mint)}.signin{display:grid;place-items:center;padding:25px}.login-panel{width:min(440px,100%);background:var(--panel);padding:clamp(24px,6vw,40px);border:1px solid var(--border);border-radius:24px;box-shadow:0 18px 80px #0005}.mark{display:grid;place-items:center;background:linear-gradient(135deg,#5ee0c1,#368bd6);color:#072534;font-weight:900;font-size:25px;width:51px;height:51px;border-radius:15px}.mark.small{width:37px;height:37px;font-size:20px;border-radius:11px}.eyebrow{letter-spacing:.15em;color:var(--mint);font-size:.69rem;font-weight:800}.login-panel h1,h1{font-size:clamp(2rem,6vw,3.2rem);line-height:1.1;letter-spacing:-.04em;margin:.45em 0}.muted,.footnote{color:var(--muted);line-height:1.5}.footnote{font-size:.76rem;margin-top:23px}select{width:100%;padding:13px;color:var(--text);background:#08192d;border:1px solid #46607d;border-radius:10px;margin-top:8px}.secret{font:600 .95rem ui-monospace,monospace;letter-spacing:.1em;padding:14px;background:#08192d;border:1px dashed #5ee0c1;border-radius:10px;overflow-wrap:anywhere}.live-panel{margin-bottom:30px}.live-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.app-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.app-pill{padding:7px 10px;border:1px solid #3c5574;border-radius:9px;font-size:.75rem}.app-pill.on{border-color:#2f8b77;background:#123d38;color:#8be9ce}.login-panel label{display:block;margin:17px 0 8px;font-size:.83rem;font-weight:650}.login-panel input:not([type=checkbox]){display:block;width:100%;background:#08192d;border:1px solid #46607d;border-radius:10px;color:#f8fdff;padding:13px 14px;margin-top:7px;outline:none}.login-panel input:focus{border-color:var(--mint)}.check{display:flex!important;align-items:center;gap:9px;color:var(--muted);font-weight:450!important}.check input{accent-color:var(--mint)}.primary{background:var(--mint);border:none;color:#092c35;width:100%;padding:14px 18px;border-radius:11px;font-weight:800;cursor:pointer;margin-top:19px}.link{display:block;text-align:center;text-decoration:none}.error{color:#ffbfc3}.top{max-width:1200px;margin:auto;padding:15px 23px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #1f334d}.brand{display:flex;gap:11px;align-items:center;font-size:1.05rem;font-weight:800}.brand small{display:block;font-weight:500;color:var(--muted);font-size:.69rem}.user-avatar{background:#1f4667;border:1px solid #447897;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:800}main{max-width:1150px;margin:auto;padding:32px 23px 110px}.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;flex-wrap:wrap;margin:22px 0 44px}.hero h1 span{color:var(--mint)}.status{border:1px solid #3c526e;border-radius:99px;padding:9px 14px;font-size:.78rem;background:#102139}.dot{display:inline-block;width:8px;height:8px;background:#ffcb72;border-radius:100%;margin-right:6px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:36px 0 14px}.section-head h2{margin:0;font-size:1.18rem}.section-head span{font-size:.75rem}.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.tiles article,.panel{background:linear-gradient(135deg,#11253e,#101c31);border:1px solid var(--border);border-radius:17px;padding:21px}.tiles h3{font-size:1rem;margin:18px 0 7px}.tiles p{font-size:.82rem;line-height:1.5;color:var(--muted);min-height:65px}.symbol{font-size:1.45rem;color:var(--mint)}.pending{font-size:.7rem;color:#e5c078;background:#473b2a;padding:5px 8px;border-radius:6px}.device{display:flex;justify-content:space-between;align-items:center;padding:10px 0;gap:16px;border-bottom:1px solid #29415c}.device:last-child{border:0}.device small{display:block;color:var(--muted);margin-top:4px}.secondary{border:1px solid #57708b;border-radius:9px;background:#142840;padding:9px 14px;color:white;cursor:pointer}.signout{margin:30px 0}.bottom{display:none}@media(max-width:820px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tiles article{padding:15px}.tiles p{min-height:77px}.hero{margin:8px 0 30px}.top{padding:14px 17px}.section-head{margin-top:28px}.bottom{display:flex;position:fixed;bottom:0;left:0;right:0;justify-content:space-around;background:#0e1d32f5;border-top:1px solid var(--border);padding:12px 0 calc(10px + env(safe-area-inset-bottom));backdrop-filter:blur(20px)}.bottom span{display:grid;justify-items:center;gap:2px;color:#849dbb;font-size:1.22rem}.bottom span.active{color:var(--mint)}.bottom small{font-size:.66rem}}
.secret-copy{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px 12px;background:#08192d;border:1px solid #5ee0c1;border-radius:12px;color:var(--text);cursor:pointer;text-align:left;touch-action:manipulation}
.secret-copy:focus-visible{outline:3px solid #5ee0c1;outline-offset:3px}
.secret-copy.copied{background:#123e3b}
.secret-value{font:650 .96rem ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.075em;overflow-wrap:anywhere;min-width:0}
.secret-copy-action{display:inline-flex;align-items:center;white-space:nowrap;font-size:.8rem;color:var(--mint);font-weight:750}
.copy-icon{font-size:1.25rem;padding-left:5px}
.copy-result{color:var(--muted);font-size:.79rem;margin:8px 0 17px}

/* Companion mobile navigation and Synaptic view */
[data-tab-panel][hidden]{display:none!important}
.nav-card{display:flex;flex-direction:column;gap:12px;text-align:left;cursor:pointer;background:linear-gradient(135deg,#11253e,#101c31);border:1px solid var(--border);border-radius:17px;padding:19px;color:var(--text)}
.nav-card strong{font-size:.96rem}
.nav-card small{font-size:.76rem;line-height:1.4;color:var(--muted)}
.nav-card:focus-visible,.bottom a:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.synaptic-head{display:flex;justify-content:center;margin:24px auto 16px}
.synaptic-core{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:radial-gradient(circle,#1c515e,#0e283a);border:2px solid #3ecbaa;border-radius:50%;width:118px;height:118px;box-shadow:0 0 0 9px #2ca88b14}
.synaptic-core small{font-size:.72rem;color:var(--muted)}
.synaptic-pulse{width:11px;height:11px;border-radius:50%;background:var(--mint);box-shadow:0 0 18px var(--mint)}
.synaptic-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:10px}
.synaptic-app{display:flex;gap:10px;justify-content:space-between;align-items:center;border:1px solid #344b65;border-radius:12px;background:#0b1b2f;padding:14px;min-width:0}
.synaptic-app-label{display:flex;gap:10px;align-items:center;min-width:0}
.synaptic-app-label div{min-width:0}
.synaptic-app-label strong{display:block;font-size:.85rem;overflow-wrap:anywhere}
.synaptic-app-label small{display:block;color:var(--muted);font-size:.71rem;margin-top:3px}
.synaptic-node{flex-shrink:0;width:11px;height:11px;border-radius:50%;background:#5d7190}
.synaptic-node.installed{background:#d6ad65}
.synaptic-node.connected{background:var(--mint);box-shadow:0 0 10px #5ee0c177}
.synaptic-state{font-size:.65rem;text-align:right;color:#c2b08d;text-transform:capitalize;max-width:100px}
.synaptic-state.is-connected{color:var(--mint)}
.small-print{font-size:.76rem}
.bottom a{text-decoration:none;display:grid;justify-items:center;align-content:center;gap:4px;color:#849dbb;min-width:58px;min-height:56px}
.bottom a.active{color:var(--mint)}
.bottom a .nav-symbol{font-size:1.5rem;line-height:1}
.bottom a small{font-size:.73rem}
@media(max-width:520px){
  .bottom{align-items:center;padding:8px 10px calc(8px + env(safe-area-inset-bottom));z-index:30}
  .synaptic-list{grid-template-columns:1fr}
  .synaptic-app{min-height:66px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Synaptic Web: visual language based on Office Mac CCAH desktop dashboard */
[data-tab-panel="apps"]{--syn-bg:#11141b;--syn-panel:#1b202a;--syn-violet:#b3a7dd;--syn-mint:#8fc2bd}
[data-tab-panel="apps"] .eyebrow{color:#aaa7c4}
[data-tab-panel="apps"] h1{color:#e9ebef;letter-spacing:-.046em}
[data-tab-panel="apps"] .live-panel{padding:0;background:linear-gradient(145deg,#1b202a,#1a202b);border-color:#49546754;overflow:hidden}
[data-tab-panel="apps"] .live-panel>.live-heading{padding:19px 22px;border-bottom:1px solid #ffffff13}
.web-synaptic-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;color:#b5accd;font-size:.65rem;letter-spacing:.13em;font-weight:700}
.web-synaptic-actions{display:flex;gap:7px}
.web-synaptic-actions button{background:#252c39;border:1px solid #ffffff15;color:#d6d8e5;padding:8px 12px;min-height:35px;border-radius:8px;cursor:pointer;font-size:.86rem;letter-spacing:normal}
.web-synaptic-stage{position:relative;min-height:520px;background:radial-gradient(ellipse at 50% 46%,#293047,#1b2230 59%,#191e28);overflow:hidden}
.web-synaptic-stage:before{position:absolute;content:"";inset:0;background-image:linear-gradient(#b0bfd00a 1px,transparent 1px),linear-gradient(90deg,#b0bfd00a 1px,transparent 1px);background-size:40px 40px;pointer-events:none;mask-image:radial-gradient(ellipse at center,#000,transparent 80%)}
#web-synaptic-svg{width:100%;height:520px;display:block;position:relative;z-index:1}
#web-synaptic-svg g[role=button]:focus{outline:none}
#web-synaptic-svg g[role=button]:focus circle{stroke:#f5eaff;stroke-width:3}
.web-synaptic-inspector{position:absolute;right:14px;bottom:14px;left:14px;z-index:2;border:1px solid #a5a1bd35;background:#292f40ec;backdrop-filter:blur(16px);border-radius:12px;padding:14px 17px;max-width:350px;box-shadow:0 10px 40px #070b1780}
.synaptic-inspector-label{display:block;font-size:.62rem;letter-spacing:.12em;color:#a7aac9;margin-bottom:8px;font-weight:700}
.web-synaptic-inspector strong{font-size:1.05rem;color:#f2f0fa}
.web-synaptic-inspector p{font-size:.76rem;line-height:1.5;color:#aeb9c8;margin:8px 0 0}
.web-synaptic-legend{display:flex;flex-wrap:wrap;gap:15px;padding:13px 19px;border-top:1px solid #ffffff16}
.web-synaptic-legend span{display:flex;align-items:center;gap:7px;font-size:.71rem;color:#adb6c5}
.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.legend-core{background:#c4b4db}.legend-connected{background:#80d8c3}.legend-unknown{background:#8692a6}
.synaptic-disclaimer{padding:0 19px;font-size:.72rem}
[data-tab-panel="apps"] .synaptic-list{margin:10px 16px 0}
[data-tab-panel="apps"] .synaptic-app{background:#212835;border:1px solid #ffffff18}
[data-tab-panel="apps"] .section-head{padding:0 19px}
@media(min-width:850px){.web-synaptic-inspector{left:auto;top:75px;bottom:16px;right:16px;width:230px;max-width:33%;display:flex;flex-direction:column;justify-content:center}.web-synaptic-stage,#web-synaptic-svg{min-height:580px;height:580px}}
@media(max-width:560px){.web-synaptic-stage{min-height:515px}#web-synaptic-svg{height:400px;margin-top:0}.web-synaptic-inspector{position:relative;left:auto;right:auto;bottom:auto;margin:0 12px 12px;max-width:none}.web-synaptic-toolbar{padding:12px}.web-synaptic-actions button{padding:7px 9px}.web-synaptic-legend{gap:10px}.web-synaptic-legend span{font-size:.64rem}}

/* Exact Mac Synaptic interface is hosted as a protected, responsive iframe. */
.native-synaptic-head{margin-bottom:18px}
.native-synaptic-head h1{margin:10px 0}
.native-synaptic-frame{display:block;width:100%;height:910px;background:#0e1117;border:1px solid #343b4b;border-radius:16px}
.native-synaptic-note{color:#8892a6;font-size:.75rem;margin-top:12px}
@media(max-width:900px){.native-synaptic-frame{height:860px}}
@media(max-width:520px){.native-synaptic-frame{height:900px;border-radius:10px}.native-synaptic-head h1{font-size:2rem}}

/* Desktop: original native Synaptic dashboard is the primary full-browser interface. */
.desktop-synaptic-shell{display:none}
@media(min-width:1050px){
 body.desktop-native-active{overflow:hidden;background:#11141b}
 body.desktop-native-active>.top,
 body.desktop-native-active>main,
 body.desktop-native-active>.bottom{display:none!important}
 body.desktop-native-active>.desktop-synaptic-shell{
   display:block;position:fixed;inset:0;z-index:40;background:#11141b;
 }
 .desktop-synaptic-shell iframe{
   display:block;width:100%;height:100%;border:none;background:#11141b;
 }
 .desktop-companion-switch{
   position:absolute;top:9px;right:17px;z-index:3;display:flex;gap:8px;
 }
 .desktop-companion-switch a{
   display:inline-flex;align-items:center;padding:9px 11px;
   font-size:11px;color:#aeb9ca;background:#252b39;
   border:1px solid #ffffff1a;border-radius:9px;text-decoration:none;
 }
 .desktop-companion-switch a:hover,.desktop-companion-switch a:focus-visible{
   color:#f1ecff;border-color:#b3a7dd;
 }
 .desktop-companion-switch .desktop-return-link{display:none}
 body:not(.desktop-native-active)>.desktop-synaptic-shell{display:none}
 body:not(.desktop-native-active)>.top,
 body:not(.desktop-native-active)>main{max-width:1150px}
}

.desktop-back-link{display:none;text-decoration:none;border:1px solid #62718d;padding:9px 13px;border-radius:9px;color:#c6daee;background:#1c2a3f}
@media(min-width:1050px){.desktop-back-link{display:inline-flex}}