.settings-hub{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:1.5rem 0 2rem}
.settings-hub-card{position:relative;display:flex;min-height:145px;flex-direction:column;justify-content:flex-end;gap:.35rem;padding:1.15rem;overflow:hidden;border:1px solid rgba(84,255,181,.34);background:linear-gradient(145deg,rgba(8,27,34,.96),rgba(8,20,29,.88));color:#effff9;text-decoration:none;box-shadow:inset 0 1px rgba(255,255,255,.04),0 16px 40px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,background .18s ease}
.settings-hub-card::after{content:"";position:absolute;inset:auto -25% -65% 25%;height:120px;background:radial-gradient(circle,rgba(51,242,175,.22),transparent 68%)}
.settings-hub-card:hover,.settings-hub-card:focus-visible{transform:translateY(-3px);border-color:#54ffb5;background:linear-gradient(145deg,rgba(11,48,50,.98),rgba(8,25,34,.92))}
.settings-hub-card strong{font-size:1.3rem}.settings-hub-card small{color:rgba(225,255,246,.68)}
.settings-hub-card>span{position:absolute;top:1rem;left:1rem;color:#54ffb5;font-size:.72rem;font-weight:900;letter-spacing:.12em}
.settings-hub-card.owner-card{border-color:rgba(74,216,255,.5)}.settings-hub-card.owner-card>span{color:#64ddff}
@media(max-width:900px){.settings-hub{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.settings-hub{grid-template-columns:1fr}.settings-hub-card{min-height:120px}}
.appearance-card{grid-column:1/-1}.appearance-card>p{max-width:660px}.theme-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;margin-top:22px}.theme-choice{min-height:112px;padding:15px;border:1px solid rgba(123,244,207,.2);background:#081215;color:#effffc;text-align:left;cursor:pointer;transition:.18s}.theme-choice:hover,.theme-choice:focus-visible,.theme-choice.selected{border-color:var(--green);background:rgba(123,244,207,.1);outline:none;transform:translateY(-2px)}.theme-choice.selected{box-shadow:inset 0 0 0 1px var(--green),0 10px 28px rgba(0,0,0,.2)}.theme-choice strong,.theme-choice span{display:block}.theme-choice strong{font-size:14px}.theme-choice span{margin-top:8px;color:#91a2a6;font-size:11px;line-height:1.35}.theme-choice::before{content:"";display:block;width:30px;height:7px;margin-bottom:15px;background:var(--theme-preview);box-shadow:12px 0 0 var(--theme-accent)}.theme-choice[data-theme-choice="normal"]{--theme-preview:#7bf4cf;--theme-accent:#38d9f5}.theme-choice[data-theme-choice="aurora"]{--theme-preview:#71f0d0;--theme-accent:#5cb8ff}.theme-choice[data-theme-choice="violet"]{--theme-preview:#d6a4ff;--theme-accent:#8fd7ff}.theme-choice[data-theme-choice="ember"]{--theme-preview:#ffd06d;--theme-accent:#ff8d70}.theme-choice[data-theme-choice="midnight"]{--theme-preview:#78a8ff;--theme-accent:#8374ff}.theme-choice[data-theme-choice="forest"]{--theme-preview:#9ee66f;--theme-accent:#e5b85c}.theme-choice[data-theme-choice="rose"]{--theme-preview:#ff8fc7;--theme-accent:#ffb199}.theme-choice[data-theme-choice="solar"]{--theme-preview:#ffd166;--theme-accent:#ff8c42}.theme-choice[data-theme-choice="mono"]{--theme-preview:#f2f2f2;--theme-accent:#8c969d}.theme-choice[data-theme-choice="cyber"]{--theme-preview:#00ff9d;--theme-accent:#ff3df2}.guest-settings{width:min(100% - 40px,920px);margin:0 auto;padding:72px 0 100px}.guest-settings .appearance-card{max-width:none}.guest-login-action{display:inline-block;width:auto;margin-top:22px;text-decoration:none}@media(max-width:700px){.theme-options{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:380px){.theme-options{grid-template-columns:1fr}}
.prototype-updates-toggle{display:flex;align-items:flex-start;gap:13px;margin-top:14px;padding:16px;border:1px solid rgba(123,244,207,.2);background:rgba(123,244,207,.05);cursor:pointer}.prototype-updates-toggle:hover{border-color:var(--green)}.prototype-updates-toggle input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--green)}.prototype-updates-toggle strong,.prototype-updates-toggle small{display:block}.prototype-updates-toggle strong{font-size:13px}.prototype-updates-toggle small{margin-top:4px;color:#91a2a6;font-size:11px;line-height:1.4}
/* Codex APIs now live inside each project’s Studio Codex menu. */
.settings-card#codex { display: none; }
.account-session-actions{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}.account-session-actions>form{margin:0}.account-switcher{position:relative;min-width:170px}.account-switcher>summary,.account-switcher-add>summary{list-style:none;cursor:pointer}.account-switcher>summary::-webkit-details-marker,.account-switcher-add>summary::-webkit-details-marker{display:none}.account-switcher>summary{padding:13px 15px;border:1px solid rgba(123,244,207,.32);background:#0b1b1e;color:#7bf4cf;font:800 11px monospace;letter-spacing:.07em}.account-switcher[open]>summary{border-color:#7bf4cf}.account-switcher-menu{position:absolute;z-index:20;left:0;top:calc(100% + 8px);width:min(360px,calc(100vw - 64px));padding:14px;border:1px solid rgba(123,244,207,.35);background:#071215;box-shadow:0 18px 48px rgba(0,0,0,.5)}.account-switcher-menu>p{margin:0 0 12px;color:#91a2a6;font-size:12px;line-height:1.45}.account-switcher-account{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid rgba(123,244,207,.13)}.account-switcher-account img{width:36px;height:36px;border-radius:10px;object-fit:cover}.account-switcher-account span{min-width:0;flex:1}.account-switcher-account strong,.account-switcher-account small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-switcher-account strong{font-size:13px}.account-switcher-account small{margin-top:3px;color:#91a2a6;font-size:11px}.account-switcher-account .button{padding:8px 10px;font-size:10px}.account-switcher-account button:disabled{opacity:.55;cursor:default}.account-switcher-add{margin-top:10px;border-top:1px solid rgba(123,244,207,.13);padding-top:10px}.account-switcher-add>summary{color:#7bf4cf;font:800 11px monospace;letter-spacing:.06em}.account-switcher-add form{display:grid;gap:10px;margin-top:12px}.account-switcher-add .field{display:grid;gap:5px}.account-switcher-add .field>span{color:#91a2a6;font:800 9px monospace;letter-spacing:.08em}.account-switcher-add input{width:100%;padding:10px;border:1px solid rgba(123,244,207,.18);background:#081215;color:#effffc}.account-switcher-add .auth-button{margin:0}
.account-session-actions>:is(form,.account-switcher){flex:1 1 180px;min-width:0}.account-switcher>summary,.account-session-actions .logout-button{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;margin:0;padding:12px 14px}.account-session-actions .logout-button{font-size:11px}

.settings-content{width:min(100% - 40px,1120px);margin:0 auto;padding:0 0 64px}.settings-content .settings-header{margin:48px 0 24px}.settings-workspace{position:relative;border:1px solid rgba(123,244,207,.2);background:rgba(7,16,19,.78);box-shadow:0 22px 65px rgba(0,0,0,.2)}.settings-workspace-tabs{display:flex;position:sticky;top:var(--xunaro-sticky-nav-height,0);z-index:3;border-bottom:1px solid rgba(123,244,207,.18);background:#0b171a}.settings-workspace-tabs button{flex:1;padding:16px 12px;border:0;border-right:1px solid rgba(123,244,207,.14);background:transparent;color:#91a2a6;font:900 11px monospace;letter-spacing:.09em;cursor:pointer}.settings-workspace-tabs button:last-child{border-right:0}.settings-workspace-tabs button:hover,.settings-workspace-tabs button:focus-visible{color:#dff7f5;background:rgba(123,244,207,.07);outline:0}.settings-workspace-tabs button.active{color:#071013;background:#7bf4cf}.settings-workspace-panels{max-height:calc(100dvh - var(--xunaro-sticky-nav-height,0) - 210px);min-height:390px;overflow:auto;padding:22px;scrollbar-color:rgba(123,244,207,.35) transparent}.settings-workspace-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.settings-workspace-panel[hidden]{display:none}.settings-workspace-panel .settings-card{margin:0;min-width:0}.settings-workspace-panel .appearance-card{grid-column:1/-1}.profile-description-field textarea{width:100%;min-height:105px;padding:12px;border:1px solid rgba(123,244,207,.16);background:#081215;color:#effffc;font:inherit;resize:vertical}.custom-style-controls{display:grid;grid-template-columns:minmax(0,1fr) 54px minmax(220px,1fr) minmax(150px,.7fr);gap:12px;align-items:end;margin-top:22px;padding-top:20px;border-top:1px solid rgba(123,244,207,.16)}.custom-style-controls h3{margin:4px 0 6px;font-size:20px}.custom-style-controls p{margin:0;color:#91a2a6;line-height:1.45}.custom-style-controls input{width:100%;min-height:42px;padding:8px;border:1px solid rgba(123,244,207,.2);background:#081215;color:#effffc}.custom-style-controls input[type="color"]{padding:4px;cursor:pointer}.custom-style-controls .button{min-height:42px;margin:0;cursor:pointer}html[data-xunaro-custom-style="true"] .platform-shell{background-image:linear-gradient(135deg,color-mix(in srgb,var(--xunaro-custom-accent) 22%,transparent),transparent 42%),var(--xunaro-custom-image);background-size:cover;background-position:center;background-attachment:fixed}html[data-xunaro-custom-style="true"] .settings-workspace-tabs button.active{background:var(--xunaro-custom-accent)}html[data-xunaro-custom-style="true"] .settings-workspace{border-color:color-mix(in srgb,var(--xunaro-custom-accent) 55%,transparent)}
@media(max-width:800px){.settings-content{padding-top:0}.settings-content .settings-header{margin-top:28px}.settings-workspace-panels{max-height:none;min-height:0;overflow:visible}.settings-workspace-panel{grid-template-columns:1fr}.custom-style-controls{grid-template-columns:1fr}.settings-workspace-tabs{top:var(--xunaro-sticky-nav-height,0)}.settings-workspace-tabs button{padding:14px 7px;font-size:9px}}

/* Account Settings occupies the normal document instead of creating a small
   viewport-height scroller. The browser page is the only vertical scroller. */
.settings-content{width:min(100% - 40px,1120px);height:auto;margin:0 auto;overflow:visible;padding:0 0 80px}.settings-workspace-spacer{height:72px}.settings-workspace{height:auto;min-height:calc(100dvh - var(--xunaro-sticky-nav-height,96px) - 72px);border:1px solid #19373a;background:rgba(5,18,21,.94);box-shadow:0 18px 42px rgba(0,0,0,.22)}.settings-workspace-tabs{position:fixed!important;top:calc(var(--xunaro-sticky-nav-height,96px) + 10px);left:50%;z-index:900;width:min(100% - 28px,820px);margin:0!important;padding:6px;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;counter-reset:settings-tab;border:1px solid #19373a;background:rgba(5,18,21,.96);box-shadow:0 18px 42px rgba(0,0,0,.3);backdrop-filter:blur(14px);transform:translateX(-50%)}.settings-workspace-tabs button{position:relative;min-height:43px;display:flex;align-items:flex-end;justify-content:center;padding:8px 6px;border:1px solid #173337!important;background:linear-gradient(135deg,rgba(16,47,49,.82),rgba(7,22,26,.92))!important;color:#a6c2c2!important;font-size:9px!important;font-weight:900;letter-spacing:.06em;text-align:center;text-transform:uppercase}.settings-workspace-tabs button::before{content:counter(settings-tab,decimal-leading-zero);counter-increment:settings-tab;position:absolute;top:6px;left:7px;color:#5e8586;font-size:7px;font-weight:900;letter-spacing:.08em}.settings-workspace-tabs button:hover,.settings-workspace-tabs button:focus-visible,.settings-workspace-tabs button.active{border-color:#80f6d0!important;background:linear-gradient(135deg,#91ffe0,#50d8b6)!important;color:#071315!important}.settings-workspace-panels{height:auto;max-height:none;min-height:0;overflow:visible;padding:24px}.settings-workspace-panel{min-height:0}@media(max-width:620px){.settings-content{width:calc(100% - 18px);height:auto;padding-bottom:50px}.settings-workspace-spacer{height:110px}.settings-workspace{height:auto;min-height:calc(100dvh - var(--xunaro-sticky-nav-height,60px) - 110px)}.settings-workspace-tabs{top:calc(var(--xunaro-sticky-nav-height,60px) + 6px);left:9px;width:calc(100% - 18px);grid-template-columns:repeat(2,minmax(0,1fr));transform:none}.settings-workspace-panels{height:auto;overflow:visible;padding:16px}.settings-workspace-panel{grid-template-columns:1fr}}@media(max-width:480px){.settings-workspace-spacer{height:110px}.settings-workspace-tabs{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible!important}}
.custom-style-input{display:grid;gap:6px;color:#91a2a6;font:900 9px monospace;letter-spacing:.08em}
.custom-style-controls>div:first-child{grid-column:1/-1}
.settings-tool-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.settings-tool-links .button{margin:0}
html.settings-workspace-loading .settings-content>.settings-grid{display:none}

/* Regular account Settings uses the exact Studio command proportions and
   card rhythm, including moving into the Xunaro header space while scrolling. */
.settings-workspace-tabs{transform:translate3d(-50%,0,0);will-change:transform,width;transition:transform .58s cubic-bezier(.22,1,.36,1),width .58s cubic-bezier(.22,1,.36,1),padding .42s ease,gap .42s ease,box-shadow .42s ease}.settings-workspace-tabs button{transition:min-height .58s cubic-bezier(.22,1,.36,1),padding .58s cubic-bezier(.22,1,.36,1),background .22s,color .22s,border-color .22s}.settings-workspace-panel{grid-template-columns:1fr;gap:20px}.settings-workspace-panel .settings-card{padding:26px;border:1px solid rgba(123,244,207,.18);background:linear-gradient(145deg,rgba(15,29,32,.98),rgba(7,16,19,.98))}.settings-workspace-panel .settings-card h2{font-size:32px}.xunaro-nav-is-collapsed .settings-workspace-tabs{top:calc(var(--xunaro-sticky-nav-height,96px) + 10px);width:min(100% - 18px,900px);gap:7px;padding:8px;transform:translate3d(-50%,calc(0px - var(--xunaro-sticky-nav-height,96px)),0)}.xunaro-nav-is-collapsed .settings-workspace-tabs button{min-height:50px;padding:11px 8px}@media(max-width:620px){.settings-workspace-tabs{transform:translate3d(0,0,0)}.xunaro-nav-is-collapsed .settings-workspace-tabs{top:calc(var(--xunaro-sticky-nav-height,60px) + 6px);left:9px;width:calc(100% - 18px);transform:translate3d(0,calc(0px - var(--xunaro-sticky-nav-height,60px)),0)}}@media(prefers-reduced-motion:reduce){.settings-workspace-tabs,.settings-workspace-tabs button{transition-duration:.01ms!important}}
.settings-workspace-tabs{transition:transform .58s cubic-bezier(.22,1,.36,1),width .58s cubic-bezier(.22,1,.36,1),padding .42s ease,gap .42s ease,box-shadow .42s ease!important}.settings-workspace-tabs button{transition:min-height .58s cubic-bezier(.22,1,.36,1),padding .58s cubic-bezier(.22,1,.36,1),background .22s,color .22s,border-color .22s!important}
