/* alpha.PAED · Desk themes 025 The approved 3D glass plates/icons stay structurally identical. Themes change the world behind the glass and the shared typography/surface variables. */ html[data-rsp-theme="porcelain"]{ --paper:#f8f6ef;--ink:#182535;--line:#bdc5be;--muted:#66736f;--sheet:#fbfaf5; --alpha-app-field:#fff;--theme-header-bg:rgba(248,246,239,.72);--theme-footer-bg:rgba(248,246,239,.66); --serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace; } html[data-rsp-theme="glashaus"]{ --paper:#dfeceb;--ink:#18373c;--line:#91aca9;--muted:#53716f;--sheet:#edf5f3; --alpha-app-field:#fff;--theme-header-bg:rgba(220,237,235,.68);--theme-footer-bg:rgba(220,237,235,.62); --serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace; } html[data-rsp-theme="retro"]{ --paper:#06080b;--ink:#edf2f4;--line:#66737c;--muted:#a7b2b8;--sheet:#15191e; --alpha-app-field:#fffdf7;--theme-header-bg:rgba(4,6,8,.78);--theme-footer-bg:rgba(4,6,8,.72); --serif:Georgia,"Times New Roman",serif;--mono:"Courier New",ui-monospace,monospace; } html[data-rsp-theme="graffiti"]{ --paper:#dddcd4;--ink:#1d2321;--line:#767b75;--muted:#5e625e;--sheet:#f7f4e8; --alpha-app-field:#fff;--theme-header-bg:rgba(248,246,237,.82);--theme-footer-bg:rgba(248,246,237,.74); --serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace; } html[data-rsp-theme="skizze"]{ --paper:#eeeee8;--ink:#222824;--line:#9ba09b;--muted:#666c67;--sheet:#f7f7f1; --alpha-app-field:#fff;--theme-header-bg:rgba(242,242,236,.72);--theme-footer-bg:rgba(242,242,236,.66); --serif:Georgia,"Times New Roman",serif;--mono:"Courier New",ui-monospace,monospace; } html[data-rsp-theme="basquiat"]{ --paper:#d7c9aa;--ink:#141715;--line:#655e50;--muted:#514b40;--sheet:#eee2c8; --alpha-app-field:#fffaf0;--theme-header-bg:rgba(239,230,210,.84);--theme-footer-bg:rgba(239,230,210,.76); --serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace; } html[data-rsp-theme="newspaper"]{ --paper:#e4e0d5;--ink:#171717;--line:#85827a;--muted:#55534f;--sheet:#f1eee4; --alpha-app-field:#fff;--theme-header-bg:rgba(235,232,223,.82);--theme-footer-bg:rgba(235,232,223,.74); --serif:"Times New Roman",Times,serif;--mono:"Courier New",ui-monospace,monospace; } html[data-rsp-theme="space"]{ --paper:#0c1422;--ink:#e7eef6;--line:#72849a;--muted:#a9b8c8;--sheet:#172235; --alpha-app-field:#f7fafc;--theme-header-bg:rgba(11,20,34,.68);--theme-footer-bg:rgba(11,20,34,.62); --serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace; } html[data-rsp-theme="davinci"]{ --paper:#dfccaa;--ink:#423521;--line:#967a53;--muted:#79674b;--sheet:#ead8b8; --alpha-app-field:#fffaf0;--theme-header-bg:rgba(228,211,178,.78);--theme-footer-bg:rgba(228,211,178,.70); --serif:Georgia,"Times New Roman",serif;--mono:"Courier New",ui-monospace,monospace; } /* Theme world behind the glass. */ html[data-rsp-theme="porcelain"] body#alphaDesktop.alpha-desktop{ background:#f8f6ef url("wallpapers/porcelain-even-035.svg") center center/cover no-repeat fixed!important; } html[data-rsp-theme="graffiti"] body#alphaDesktop.alpha-desktop{ background:#d8d7d0 url("wallpapers/graffiti-spray-026.svg") center center/cover no-repeat fixed!important; } html[data-rsp-theme="davinci"] body#alphaDesktop.alpha-desktop{ background:#dfccaa url("wallpapers/davinci-018.svg") center top/cover no-repeat fixed!important; } html[data-rsp-theme="newspaper"] body#alphaDesktop.alpha-desktop{ background:#e4e0d5 url("wallpapers/newspaper-018.svg") center top/cover no-repeat fixed!important; } html[data-rsp-theme="skizze"] body#alphaDesktop.alpha-desktop{ background:#eeeee8 url("wallpapers/skizze-018.svg") center top/cover no-repeat fixed!important; } html[data-rsp-theme="glashaus"] body#alphaDesktop.alpha-desktop{ background: url("wallpapers/glashaus-panels-legacy.png") 7% 22%/420px auto no-repeat fixed, url("wallpapers/glashaus-panels-legacy.png") 92% 78%/350px auto no-repeat fixed, linear-gradient(115deg,transparent 0 16%,rgba(255,255,255,.20) 16% 22%,transparent 22% 44%,rgba(255,255,255,.12) 44% 49%,transparent 49% 100%), linear-gradient(180deg,#d7e7e6 0%,#e9f0ea 58%,#cddfce 100%)!important; background-attachment:fixed!important; } html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop{ background:#020304 url("wallpapers/retro-invaders-026.svg") center center/cover no-repeat fixed!important; } html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-brand, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-brand-sub, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-welcome, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-group-heading, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-footer{color:#edf2f4!important} html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .group-creator .creator-glass-edge, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .group-actor .actor-glass-edge, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .group-user .user-glass-edge, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .group-host .host-glass-edge{ border-color:rgba(220,238,246,.70)!important; } html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop{ background: linear-gradient(76deg,transparent 0 13%,rgba(20,22,20,.15) 13% 14%,transparent 14% 41%,rgba(190,55,41,.28) 41% 44%,transparent 44% 100%), linear-gradient(165deg,transparent 0 22%,rgba(38,85,133,.24) 22% 26%,transparent 26% 71%,rgba(226,181,46,.28) 71% 76%,transparent 76% 100%), repeating-linear-gradient(9deg,transparent 0 46px,rgba(28,31,28,.08) 46px 48px,transparent 48px 92px), #d8caa9!important; background-attachment:fixed!important; } html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop{ background:#08111f url("wallpapers/space-planet-026.svg") center center/cover no-repeat fixed!important; } /* Header/footer are translucent parts of the theme, not opaque slabs. */ body#alphaDesktop.alpha-desktop .alpha-header{ background:var(--theme-header-bg)!important; color:var(--ink)!important; border-bottom-color:color-mix(in srgb,var(--line) 68%,transparent)!important; -webkit-backdrop-filter:blur(14px) saturate(1.08); backdrop-filter:blur(14px) saturate(1.08); } body#alphaDesktop.alpha-desktop .alpha-footer{ background:var(--theme-footer-bg)!important; color:var(--ink)!important; -webkit-backdrop-filter:blur(10px) saturate(1.06); backdrop-filter:blur(10px) saturate(1.06); } body#alphaDesktop.alpha-desktop .alpha-brand, body#alphaDesktop.alpha-desktop .alpha-welcome, body#alphaDesktop.alpha-desktop .alpha-group-heading{color:var(--ink)!important} /* Busy themes: readable title capsules while keeping all 3D glass panels untouched. */ html[data-rsp-theme="graffiti"] body#alphaDesktop.alpha-desktop .alpha-welcome, html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop .alpha-welcome{ width:max-content;max-width:calc(100% - 30px);padding:10px 18px;border-radius:16px; background:color-mix(in srgb,var(--paper) 78%,transparent);backdrop-filter:blur(9px); } html[data-rsp-theme="graffiti"] body#alphaDesktop.alpha-desktop .alpha-group-heading, html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop .alpha-group-heading{ width:max-content;max-width:100%;margin-inline:auto;padding:6px 14px;border-radius:14px; background:color-mix(in srgb,var(--paper) 70%,transparent);backdrop-filter:blur(8px); } /* SPACE needs pale text over the dark universe; stones keep their CI colours. */ html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-brand, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-brand-sub, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-welcome, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-group-heading, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-footer{color:#e9f1fb!important} html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .group-creator .creator-glass-edge, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .group-actor .actor-glass-edge, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .group-user .user-glass-edge, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .group-host .host-glass-edge{ border-color:rgba(219,238,255,.74)!important; } /* Header theme switcher. */ body#alphaDesktop.alpha-desktop .alpha-theme-popup{ position:fixed;z-index:130;width:min(430px,calc(100vw - 24px));padding:14px; border:1px solid rgba(255,255,255,.62);border-radius:22px; background:color-mix(in srgb,var(--paper) 70%,transparent); color:var(--ink);backdrop-filter:blur(22px) saturate(1.12); box-shadow:0 22px 58px rgba(17,27,31,.24),inset 0 1px 0 rgba(255,255,255,.68); } body#alphaDesktop.alpha-desktop .alpha-theme-popup[hidden]{display:none!important} body#alphaDesktop.alpha-desktop .alpha-theme-popup-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 4px 11px} body#alphaDesktop.alpha-desktop .alpha-theme-popup-head strong{font:400 21px var(--serif,Georgia,serif)} body#alphaDesktop.alpha-desktop .alpha-theme-popup-head small{font:10px var(--mono,monospace);letter-spacing:.08em;opacity:.72} body#alphaDesktop.alpha-desktop .alpha-theme-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} body#alphaDesktop.alpha-desktop .alpha-theme-choice{ appearance:none;border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:14px; padding:8px;background:color-mix(in srgb,var(--paper) 62%,transparent);color:inherit;cursor:pointer;text-align:left; display:grid;gap:7px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35); } body#alphaDesktop.alpha-desktop .alpha-theme-choice:hover{transform:translateY(-1px);box-shadow:0 7px 16px rgba(20,30,34,.10),inset 0 1px 0 rgba(255,255,255,.45)} body#alphaDesktop.alpha-desktop .alpha-theme-choice[aria-pressed="true"]{outline:2px solid currentColor;outline-offset:1px} body#alphaDesktop.alpha-desktop .alpha-theme-choice span:last-child{font:700 10px/1.2 var(--mono,monospace);letter-spacing:.09em;text-transform:uppercase} body#alphaDesktop.alpha-desktop .alpha-theme-swatch{height:42px;border-radius:10px;border:1px solid rgba(255,255,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 5px 10px rgba(20,30,34,.08)} .alpha-theme-choice[data-theme-key="porcelain"] .alpha-theme-swatch{background:#f8f6ef url("wallpapers/porcelain-even-035.svg") center/cover} .alpha-theme-choice[data-theme-key="glashaus"] .alpha-theme-swatch{background:#dfeceb url("wallpapers/glashaus-panels-legacy.png") center/cover no-repeat} .alpha-theme-choice[data-theme-key="retro"] .alpha-theme-swatch{background:#020304 url("wallpapers/retro-invaders-026.svg") center/cover no-repeat} .alpha-theme-choice[data-theme-key="graffiti"] .alpha-theme-swatch{background:#d8d7d0 url("wallpapers/graffiti-spray-026.svg") center/cover} .alpha-theme-choice[data-theme-key="skizze"] .alpha-theme-swatch{background:#eeeee8 url("wallpapers/skizze-018.svg") center/cover} .alpha-theme-choice[data-theme-key="basquiat"] .alpha-theme-swatch{background:linear-gradient(145deg,#d7c9aa 0 35%,#c44236 35% 43%,#d7c9aa 43% 62%,#315c87 62% 70%,#d7c9aa 70%)} .alpha-theme-choice[data-theme-key="newspaper"] .alpha-theme-swatch{background:#e4e0d5 url("wallpapers/newspaper-018.svg") center/cover} .alpha-theme-choice[data-theme-key="space"] .alpha-theme-swatch{background:#08111f url("wallpapers/space-planet-026.svg") 78% 68%/cover no-repeat} .alpha-theme-choice[data-theme-key="davinci"] .alpha-theme-swatch{background:#dfccaa url("wallpapers/davinci-018.svg") center/cover} @media(max-width:560px){body#alphaDesktop.alpha-desktop .alpha-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} /* 027 · Ebene 3 closes INTO its app stone. Ebene 1 + Ebene 2 remain visible for the whole closing animation. */ body#alphaDesktop.alpha-desktop .alpha-desk-overlay.closing{ opacity:1!important; background:transparent!important; -webkit-backdrop-filter:none!important; backdrop-filter:none!important; pointer-events:none!important; } body#alphaDesktop.alpha-desktop .alpha-desk-overlay.closing .alpha-desk-iframe{ opacity:.08!important; transform: translate(var(--alpha-close-x,0px),var(--alpha-close-y,36px)) scale(var(--alpha-close-scale,.08))!important; transform-origin:center center!important; border-radius:25px!important; transition: transform .48s cubic-bezier(.22,.68,.18,1), opacity .40s ease!important; } body#alphaDesktop.alpha-desktop .alpha-desk-overlay.closing :is(.alpha-desk-close,.alpha-desk-maximize){ opacity:0!important; pointer-events:none!important; } /* Requested footer watermark. */ body#alphaDesktop.alpha-desktop .alpha-footer .alpha-ai-watermark{ margin-left:auto; font:9px/1.2 var(--mono,ui-monospace,monospace); letter-spacing:.09em; text-transform:none; opacity:.54; white-space:nowrap; } /* 028 · Dark-theme overlay controls On dark desks (RETRO / SPACE), maximize and close must remain clearly visible. */ html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-close, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-close, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize{ position:absolute; top:14px; width:42px; height:42px; min-width:42px; min-height:42px; border-radius:999px; border:1px solid rgba(233,243,250,.82)!important; color:#eef6fb!important; background: linear-gradient(180deg,rgba(247,252,255,.30),rgba(247,252,255,.12))!important; box-shadow: 0 10px 22px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.50), inset 0 -1px 0 rgba(132,159,177,.26)!important; -webkit-backdrop-filter:blur(6px) saturate(1.06)!important; backdrop-filter:blur(6px) saturate(1.06)!important; opacity:1!important; visibility:visible!important; z-index:8!important; } html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize{right:62px} html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-close, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-close{right:14px;font:400 28px/1 Arial,sans-serif!important} html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize svg, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize svg{ width:18px;height:18px;stroke:currentColor;fill:none;filter:drop-shadow(0 1px 0 rgba(255,255,255,.22)); } html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-close:hover, html[data-rsp-theme="retro"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize:hover, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-close:hover, html[data-rsp-theme="space"] body#alphaDesktop.alpha-desktop .alpha-desk-maximize:hover{ transform:translateY(-2px); background: linear-gradient(180deg,rgba(247,252,255,.38),rgba(247,252,255,.16))!important; } /* 029 · LINES theme: keep the line background, but the desk app icons must stay clearly coloured. */ html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop .alpha-app-group .app-tile .app-symbol{ color:color-mix(in srgb,var(--alpha-tile-ci) 92%,#13242a 8%)!important; border-color:color-mix(in srgb,var(--alpha-tile-ci) 42%,rgba(255,255,255,.72) 58%)!important; background: linear-gradient(150deg, color-mix(in srgb,var(--alpha-tile-ci) 30%,rgba(255,255,255,.46) 70%) 0%, color-mix(in srgb,var(--alpha-tile-ci) 48%,rgba(255,255,255,.22) 52%) 49%, color-mix(in srgb,var(--alpha-tile-ci) 66%,rgba(255,255,255,.08) 34%) 100%)!important; box-shadow: 0 14px 22px rgba(20,34,39,.15), 0 5px 8px rgba(20,34,39,.07), inset 0 2px 1px rgba(255,255,255,.78), inset 2px 0 2px rgba(255,255,255,.30), inset -2px 0 4px rgba(35,50,55,.07), inset 0 -6px 11px color-mix(in srgb,var(--alpha-tile-ci) 36%,rgba(22,34,38,.13) 64%)!important; } html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop .alpha-app-group .app-tile .app-symbol svg{ stroke:currentColor!important; color:inherit!important; } html[data-rsp-theme="basquiat"] body#alphaDesktop.alpha-desktop .alpha-app-group .app-tile .app-name{ color:color-mix(in srgb,var(--alpha-tile-ci) 82%,#2b261f 18%)!important; } /* 033 · Desk-level logout confirmation popup */ .alpha-logout-confirm[hidden]{display:none!important} .alpha-logout-confirm{position:fixed;inset:0;z-index:1200} .alpha-logout-confirm__backdrop{position:absolute;inset:0;background:rgba(10,14,18,.18);backdrop-filter:blur(2px)} .alpha-logout-confirm__card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(28rem,calc(100vw - 2rem));padding:1.1rem 1.2rem;border-radius:1.2rem;background:rgba(255,252,249,.97);border:1px solid rgba(201,193,187,.86);box-shadow:0 25px 70px rgba(22,27,34,.22), inset 0 1px 0 rgba(255,255,255,.86)} .alpha-logout-confirm__eyebrow{display:block;font:.72rem/1.4 ui-monospace,monospace;letter-spacing:.15em;text-transform:uppercase;color:#6b7280;margin-bottom:.2rem} .alpha-logout-confirm__title{margin:0 0 .35rem;font:400 1.9rem/1.1 Georgia,serif;color:#243444} .alpha-logout-confirm__text{margin:0 0 .95rem;color:#2d3a47;font:400 1rem/1.5 Georgia,serif} .alpha-logout-confirm__actions{display:flex;justify-content:flex-end;gap:.65rem} .alpha-logout-confirm__actions button{font:400 1rem/1.1 Georgia,serif;padding:.82rem 1.15rem;border-radius:.8rem;cursor:pointer} .alpha-logout-confirm__cancel{background:#f5f2ee;color:#243444;border:1px solid #c9c1bb} .alpha-logout-confirm__ok{background:#8c6d5f;color:#fff;border:1px solid #8c6d5f} /* 037 · Desk logout confirm "Abmelden" button in same colour as "Anmelden". */ .alpha-logout-confirm__ok{ background: linear-gradient(180deg,rgba(47,124,120,.16),rgba(47,124,120,.08))!important; border:1px solid rgba(47,124,120,.48)!important; color:#214f4a!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 7px 16px rgba(33,79,74,.08)!important; } .alpha-logout-confirm__ok:hover{ background: linear-gradient(180deg,rgba(47,124,120,.22),rgba(47,124,120,.11))!important; }