/* All themes: appearance lives in Settings, and the header has a real dock socket. */
html[data-theme] body[data-se-os] #seOsAppearance{display:none!important;}
html[data-theme] body[data-se-os]{--app-fixed-topbar-height:calc(82px + env(safe-area-inset-top,0px));}
html[data-theme] body[data-se-os] #appShell>.topbar{gap:8px!important;}
#seHeaderSocket{flex:0 0 72px!important;width:72px!important;height:72px!important;min-height:72px!important;box-sizing:border-box;border-radius:50%!important;border:1px dashed rgba(var(--se-os-accent),.55)!important;background:radial-gradient(circle,#000b 50%,rgba(var(--se-os-accent),.12) 74%,#0009)!important;box-shadow:inset 0 2px 10px #000c,0 0 0 3px rgba(var(--se-os-accent),.07)!important;color:rgba(var(--se-os-accent),.5)!important;font:italic 600 16px system-ui!important;cursor:pointer;}
#seHeaderSocket[data-occupied="true"]{border-style:solid!important;}
.seHeaderArtwork{display:none!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar{background:#020805 url('/static/green-style/header-reference.jpeg?v=20261017-header1') center top/cover!important;border-bottom:1px solid #36a66888!important;box-shadow:0 8px 24px #0009!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar .menuLabel,
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar>.statusDot,
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar>.topSpacer{display:none!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar .menuButton{flex:0 0 32px!important;width:32px!important;min-width:32px!important;padding:0!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar .topTitle{position:relative;flex:1 1 auto!important;min-width:0!important;max-width:none!important;height:74px;overflow:hidden;font-size:0!important;letter-spacing:0!important;color:transparent!important;text-shadow:none!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar .topTitle::after{display:none!important;}
html[data-theme][data-se-color="green"] body[data-se-os] #appShell>.topbar .seHeaderArtwork{display:block!important;position:absolute;inset:0;width:100%!important;max-width:none!important;height:100%!important;object-fit:cover;object-position:center;mix-blend-mode:normal;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked>button.glassDockItem:not(.glassDockHome){width:56px!important;height:56px!important;top:8px!important;left:8px!important;min-height:0!important;border-radius:15px!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked>button.glassDockRoot{transform:translate(-70px,0)!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked>button.glassDockQuick{transform:translate(-140px,0)!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked>button.glassDockMessages{transform:translate(0,70px)!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked>button.glassDockProfile{transform:translate(0,140px)!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seHeaderDocked.seHeaderDocked.seOsClosed>button:not(.glassDockHome){transform:scale(.18)!important;opacity:0!important;pointer-events:none!important;}
#seDockExtras{position:fixed;z-index:1401;width:0;height:0;pointer-events:none;}
#seDockExtras[hidden]{display:none!important;}
#seDockExtras>button{position:absolute;left:-28px;top:-28px;width:56px;height:56px;border-radius:15px;padding:4px;border:1px solid rgba(var(--se-os-accent),.5);background:rgba(4,13,21,.94);color:#effbf4;font:10px/1.15 system-ui;box-shadow:0 5px 18px #0008;cursor:pointer;pointer-events:auto;}
#seDockExtras>.seDockPlus{font-size:25px;border-style:dashed;color:rgb(var(--se-os-accent));}
.seDockPicker{position:fixed;z-index:2200;right:12px;top:calc(90px + env(safe-area-inset-top,0px));width:min(300px,calc(100vw - 24px));max-height:70dvh;overflow:auto;box-sizing:border-box;padding:16px;border:1px solid rgba(var(--se-os-accent),.55);border-radius:18px;background:#061019;color:#ecfff3;box-shadow:0 20px 60px #000c;}
.seDockPicker>button{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid rgba(var(--se-os-accent),.3);border-radius:10px;background:#ffffff09;color:inherit;cursor:pointer;}
#seHeaderSettingsRow .grow{display:grid;gap:5px;}
#seHeaderPin{width:40px;height:24px;flex:0 0 auto;accent-color:rgb(var(--se-os-accent));cursor:pointer;}
@media(prefers-reduced-motion:reduce){.seHeaderDocked>button{transition:none!important;}}

/* Recessed socket fits inside the frame and lights up on approach. */
html[data-theme] body[data-se-os] #appShell>.topbar{height:calc(82px + env(safe-area-inset-top,0px))!important;min-height:calc(82px + env(safe-area-inset-top,0px))!important;padding-top:env(safe-area-inset-top,0px)!important;padding-bottom:0!important;align-items:center!important;}
html[data-theme] body[data-se-os] #appShell>.topbar #seHeaderSocket{align-self:center!important;margin:0!important;padding:0!important;border-style:solid!important;box-shadow:inset 0 3px 12px #000e,inset 0 0 0 4px rgba(var(--se-os-accent),.08)!important;outline:1px solid rgba(var(--se-os-accent),.18);outline-offset:-6px;transition:border-color .15s,box-shadow .15s,background .15s;}
html[data-theme] body[data-se-os] #appShell>.topbar #seHeaderSocket.seSocketNear{border-color:rgb(var(--se-os-accent))!important;color:#fff!important;background:radial-gradient(circle,rgba(var(--se-os-accent),.28),#031009 72%)!important;box-shadow:inset 0 0 22px rgba(var(--se-os-accent),.55),0 0 18px rgba(var(--se-os-accent),.58)!important;}
html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seMagnetSnap{transition:left .18s ease-out,top .18s ease-out!important;}
@media(prefers-reduced-motion:reduce){html[data-theme] body[data-se-os] #appShell>.nav.seOsDock.seMagnetSnap{transition:none!important;}}
