:root { --bg:#0c1017; --panel:#141b26; --line:#293243; --muted:#96a4b8; --text:#edf2fa; --fox:#ff7945; --gold:#ffb78f; --sidebar-width:230px; }
[hidden] { display:none !important; }
body { background:var(--bg); font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; }
button,input,textarea,select { font:inherit; }
button { padding:9px 14px; font-size:13px; font-weight:600; transition:background .15s,border-color .15s; }
button:hover:not(:disabled) { background:#243047; border-color:#52637e; }
button:disabled { cursor:default; opacity:.55; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:2px solid var(--fox); outline-offset:3px; }
.primary { background:#ed6c39; border-color:#ed6c39; color:#fff; box-shadow:0 3px 10px #ed6c391c; }
.primary:hover:not(:disabled) { background:#ff8150; border-color:#ff8150; }
body>.app-topbar { height:72px; padding:0 28px; gap:26px; background:#101620; backdrop-filter:none; z-index:20; }
.brand { display:flex; align-items:center; font-size:19px; white-space:nowrap; }
.brand-mark { display:grid; place-items:center; width:32px; height:32px; margin-right:10px; border-radius:10px; background:#ff7945; color:#141b26; font-size:19px; letter-spacing:-.07em; }
.brand .brand-mark { color:#141b26; }
.brand>span:last-child { color:var(--fox); }
.topbar-location { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:13px; margin-right:auto; }
.topbar-location span::after { content:'/'; margin-left:12px; color:#56647a; }
.topbar-location strong { font-weight:500; color:var(--text); }
.topbar-actions { display:flex; gap:10px; align-items:center; font-size:13px; }
.topbar-actions #connect { background:transparent; }
.user-avatar { width:30px; height:30px; display:grid; place-items:center; border:1px solid #495771; border-radius:50%; color:#dfb499; background:#38291f; font-size:11px; font-weight:700; }
.workspace-sidebar { position:fixed; inset:72px auto 0 0; width:var(--sidebar-width); border-right:1px solid var(--line); padding:22px 14px; background:#101620; overflow:auto; z-index:15; }
.workspace-sidebar nav { display:grid; gap:4px; }
.workspace-sidebar nav button { display:flex; align-items:center; gap:11px; text-align:left; border:1px solid transparent; background:transparent; color:#aab5c6; border-radius:8px; padding:11px 13px; font-size:13px; }
.workspace-sidebar nav button:hover { background:#1a2433; color:#fff; }
.workspace-sidebar nav button[aria-current=page] { background:#30231f; border-color:#563128; color:#ffad88; }
.navigation-label { margin:22px 13px 8px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.14em; color:#64738a; }
.navigation-label:first-child { margin-top:0; }
.navigation-icon { width:18px; height:18px; flex-shrink:0; }
.sidebar-footer { margin:36px 12px 10px; font-size:11px; color:#6f8096; display:flex; gap:8px; align-items:center; }
.status-dot { width:6px; height:6px; border-radius:50%; background:#6bd0a0; }
#workspace-main { max-width:1440px; padding:40px 48px 80px; }
.authenticated #workspace-main { margin-left:var(--sidebar-width); margin-right:auto; }
.authenticated .hero { display:none; }
.hero { padding:66px 0; }
.hero h1 { max-width:850px; font-size:clamp(42px,6vw,72px); line-height:1.04; }
.eyebrow { font-size:11px; letter-spacing:.12em; color:#ab8c78; }
.toolbar { border:0; padding:0; gap:12px; margin-bottom:28px; }
.toolbar h1 { font-size:30px; line-height:1.2; font-weight:650; letter-spacing:-.035em; margin:4px 0 8px; }
.toolbar .eyebrow { margin:0 0 6px; }
.toolbar p { font-size:13px; }
.project-filter { max-width:360px; font-size:12px; margin:0 0 24px; }
.project-filter input { padding:11px 14px; background:#111824; }
.grid { grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; }
.card { background:var(--panel); border-radius:12px; padding:22px; box-shadow:0 6px 24px #00000015; }
.card h3 { font-size:17px; margin:12px 0 8px; overflow-wrap:anywhere; }
.card p { font-size:13px; }
.badge { border:1px solid #3b475b; border-radius:20px; color:#aab9cd; font-size:10px; padding:3px 8px; }
.card .meta { font-size:11px; }
.empty-projects { grid-column:1/-1; min-height:310px; border:1px dashed #344154; border-radius:14px; padding:56px 24px; display:flex; align-items:center; flex-direction:column; text-align:center; background:#101722; }
.empty-projects svg { width:52px; height:52px; padding:10px; border-radius:14px; color:#d99770; background:#2f251f; margin-bottom:15px; }
.empty-projects h2 { font-size:19px; margin:8px 0; }
.empty-projects p { max-width:470px; color:var(--muted); font-size:13px; margin:0 0 22px; }
.empty-projects .actions { flex-wrap:wrap; justify-content:center; }
.workspace-page { width:100%; max-width:1200px; margin:0; }
.workspace-page>.info-dialog { padding:0; }
.workspace-page .dialog-head { margin-bottom:28px; padding-bottom:22px; border-bottom:1px solid var(--line); gap:20px; }
.workspace-page .dialog-head h2 { font-size:28px; letter-spacing:-.03em; font-weight:650; }
.workspace-page .dialog-head h2:focus { outline:none; }
.workspace-page .dialog-head button { font-size:12px; font-weight:600; background:#171f2c; border:1px solid var(--line); border-radius:8px; white-space:nowrap; }
.workspace-page .dialog-head button:focus { outline-offset:4px; }
.workspace-page>.info-dialog>[id$=content]>.platform-panel { margin-top:0; }
.workspace-page .platform-panel { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:24px; margin:0 0 20px; }
.workspace-page header,.workspace-page .platform-panel header { position:static; height:auto; padding:0 0 18px; background:none; backdrop-filter:none; border:0; border-bottom:1px solid var(--line); margin-bottom:18px; }
.workspace-page h3 { font-size:17px; margin:0; }
.workspace-page h4 { font-size:16px; margin:0 0 8px; }
.workspace-page p { color:var(--muted); font-size:13px; line-height:1.7; }
.workspace-page p.error { color:#ff998a; }
.workspace-page label { font-size:12px; }
.workspace-page input,.workspace-page textarea,.workspace-page select { background:#0f1520; font-size:14px; border-color:#354258; }
.workspace-page .actions { flex-wrap:wrap; gap:10px; margin-top:18px; }
.workspace-page form { padding:20px; border:1px solid var(--line); border-radius:10px; background:#111824; }
#login-dialog,#bootstrap-dialog,#account-recovery-dialog { max-width:680px; margin:20px auto; }
#form-dialog>form { max-width:920px; padding:28px; background:var(--panel); }
#form-dialog>form>label,#form-dialog>form>#project-namespace { max-width:660px; }
#form-dialog .dialog-head { margin-bottom:20px; }
#form-dialog .actions { padding-top:18px; border-top:1px solid var(--line); }
#form-dialog #import-fields { margin-top:26px; padding-top:10px; border-top:1px solid var(--line); }
#form-dialog details { padding:16px; margin:16px 0; background:#101722; border:1px solid var(--line); border-radius:10px; }
#form-dialog summary { cursor:pointer; font-weight:600; font-size:13px; }
.panel-tabs,.instance-admin-panel>div:has(>[data-tab]) { display:flex; justify-content:flex-start; flex-wrap:nowrap; gap:5px; padding:5px; border-radius:10px; background:#0e1520; border:1px solid var(--line); margin:18px 0 24px; overflow:auto; }
.panel-tabs button,.instance-admin-panel [data-tab] { background:transparent; border-color:transparent; color:var(--muted); white-space:nowrap; border-radius:7px; padding:9px 16px; }
.panel-tabs button[aria-selected=true],.instance-admin-panel [data-tab][aria-pressed=true] { background:#273247; color:#fff; box-shadow:0 2px 6px #0003; }
.account-overview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:20px; }
.account-summary { padding:24px; border:1px solid var(--line); border-radius:10px; background:#101722; }
.account-summary small { display:block; color:var(--muted); font-size:12px; }
.account-summary strong { display:block; margin:8px 0; font-size:26px; font-weight:650; }
.account-panel [data-account-section] { max-width:100%; }
.account-panel [data-account-section]>form { max-width:760px; margin-top:22px; }
.account-panel article { padding:20px; margin:12px 0; border:1px solid var(--line); border-radius:10px; background:#101722; }
.account-panel article strong { font-size:14px; }
.account-panel article p { max-width:800px; }
.account-panel [data-status]:empty,.account-panel [data-error]:empty { display:none; }
.project-open>.toolbar,.project-open>.project-filter,.project-open>#projects { display:none; }
.detail { margin:0; padding:26px; background:var(--panel); }
.detail>.detail-head { margin-bottom:18px; }
.repository-panel .tabs,.repository-panel nav,.merge-request-panel nav { flex-wrap:wrap; gap:8px; }
.repository-panel button[aria-pressed=true],.repository-panel button[aria-selected=true] { background:#29364d; border-color:#52637e; }
#navigation-toggle { display:none; }
@media (min-width:1900px) { .authenticated #workspace-main { margin-left:calc(var(--sidebar-width) + (100vw - var(--sidebar-width) - 1440px)/2); } }
@media (max-width:1100px) { :root { --sidebar-width:200px; } #workspace-main { padding:30px 28px 60px; } body>.app-topbar { padding:0 20px; gap:18px; } }
@media (max-width:760px) {
  body>.app-topbar { position:sticky; display:flex; padding:12px 16px; height:auto; min-height:64px; gap:12px; flex-wrap:wrap; }
  .brand { font-size:17px; }.brand-mark { width:28px; height:28px; }.topbar-location { display:none; }
  body>.app-topbar>.brand { display:flex; margin-bottom:0; }
  .topbar-actions { margin-left:auto; gap:7px; } #workspace-user,.topbar-actions #refresh { display:none; }
  .topbar-actions .user-avatar { display:none; }.topbar-actions #connect { max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #navigation-toggle { display:none; }.authenticated #navigation-toggle { display:block; padding:7px 10px; }
  .workspace-sidebar { display:none; width:min(300px,85vw); top:64px; box-shadow:10px 0 45px #0009; }
  .navigation-open .workspace-sidebar { display:block; }
  .authenticated #workspace-main { margin-left:0; } #workspace-main { padding:28px 18px 60px; }
  .toolbar { flex-wrap:wrap; align-items:flex-start; }.toolbar>div { width:100%; margin-bottom:12px; }.toolbar h1 { font-size:27px; }
  .workspace-page .dialog-head { align-items:flex-start; gap:12px; }.workspace-page .dialog-head h2 { font-size:24px; }
  .workspace-page .platform-panel,#form-dialog>form { padding:18px; }.workspace-page form { padding:16px; }
  .account-overview-grid { grid-template-columns:1fr; }.account-summary { padding:18px; }
  .panel-tabs { gap:3px; }.panel-tabs button { padding:9px 12px; }
  .workspace-page .actions { justify-content:flex-start; }.empty-projects { padding:40px 18px; }
}

.project-context{display:flex;align-items:center;gap:8px;min-width:0}.project-context[hidden]{display:none}.project-context>span:first-child{font-size:11px;color:var(--muted);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-context select{max-width:200px;margin:0;padding:8px 26px 8px 10px;font-size:12px}.suite-create-options{border:1px solid var(--border);border-radius:12px;padding:16px}.project-context~.topbar-location{display:none}@media(max-width:1000px){.project-context>span:first-child{display:none}.project-context select{max-width:145px}.topbar-actions #workspace-user{display:none}}@media(max-width:640px){.app-topbar{flex-wrap:wrap}.project-context{order:3;width:100%}.project-context label{flex:1}.project-context select{width:100%;max-width:none}}
