/* X-GORB Cloud — Simplified Console Design System */

/* ── Design Tokens ── */
:root {
  --gc-blue:        #1a73e8;
  --gc-blue-dark:   #1557b0;
  --gc-blue-light:  #e8f0fe;
  --gc-blue-hover:  #1765cc;
  --gc-green:       #1e8e3e;
  --gc-green-light: #e6f4ea;
  --gc-red:         #d93025;
  --gc-red-light:   #fce8e6;
  --gc-yellow:      #f9ab00;
  --gc-yellow-light:#fef7e0;
  --gc-gray-1:      #f5f5f5;
  --gc-gray-2:      #f1f3f4;
  --gc-gray-3:      #e8eaed;
  --gc-gray-4:      #e0e0e0;
  --gc-gray-5:      #bdbdbd;
  --gc-text-1:      #202124;
  --gc-text-2:      #3c4043;
  --gc-text-3:      #5f6368;
  --gc-text-4:      #80868b;
  --gc-white:       #ffffff;
  --gc-shadow-1:    0 1px 2px rgba(0,0,0,.06);
  --gc-shadow-2:    0 1px 3px rgba(0,0,0,.08);
  --gc-table-head-bg: #fafafa;
  --gc-table-hover-bg: #fafafa;
  --gc-border:      var(--gc-gray-4);
  --gc-radius:      4px;
  --gc-radius-sm:   2px;
  --gc-radius-lg:   4px;
  --gc-topbar-h:    56px;
  --gc-sidebar-w:   240px;
  --gc-sidebar-collapsed: 64px;
  --gc-transition:  .15s ease;
  --gc-font:        -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  --gc-mono:        'SF Mono', 'Roboto Mono', 'Fira Code', Consolas, monospace;
}

/* ── Dark Mode: Apple macOS 风格 · 高对比 · 线条感 ── */
[data-theme="dark"] {
  --gc-blue:        #0a84ff;
  --gc-blue-dark:   #409cff;
  --gc-blue-light:  #162d50;
  --gc-blue-hover:  #409cff;
  --gc-green:       #30d158;
  --gc-green-light: #162c1c;
  --gc-red:         #ff453a;
  --gc-red-light:   #3a1515;
  --gc-yellow:      #ffd60a;
  --gc-yellow-light:#332d0a;
  --gc-gray-1:      #1c1c1e;
  --gc-gray-2:      #2c2c2e;
  --gc-gray-3:      #3a3a3c;
  --gc-gray-4:      #48484a;
  --gc-gray-5:      #636366;
  --gc-text-1:      #f5f5f7;
  --gc-text-2:      #d1d1d6;
  --gc-text-3:      #98989d;
  --gc-text-4:      #6e6e73;
  --gc-white:       #2c2c2e;
  --gc-shadow-1:    0 1px 2px rgba(0,0,0,.4);
  --gc-shadow-2:    0 1px 3px rgba(0,0,0,.5);
  --gc-table-head-bg: #2c2c2e;
  --gc-table-hover-bg: #3a3a3c;
  --gc-border:      #48484a;
}

/* ── Dark: 覆盖层 ── */
[data-theme="dark"] .gc-topbar{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-sidebar{border-right-color:var(--gc-border)}
[data-theme="dark"] .gc-card{border-color:var(--gc-border)}
[data-theme="dark"] .gc-card-header{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-dropdown{border-color:var(--gc-border)}
[data-theme="dark"] .gc-dropdown-header{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-modal-header{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-modal-footer{border-top-color:var(--gc-border)}
[data-theme="dark"] .gc-tabs{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-detail-row{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-pricing-features{border-top-color:var(--gc-border)}
[data-theme="dark"] .gc-pricing-disabled:hover{border-color:var(--gc-border)}
[data-theme="dark"] .gc-landing-nav{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-landing-hero{border-bottom-color:var(--gc-border)}
[data-theme="dark"] .gc-landing-footer{border-top-color:var(--gc-border)}
[data-theme="dark"] .gc-badge-gray{background:var(--gc-gray-3);color:var(--gc-text-3)}
[data-theme="dark"] .gc-input,
[data-theme="dark"] .gc-select,
[data-theme="dark"] .gc-textarea{border-color:var(--gc-border);background:var(--gc-gray-2)}
[data-theme="dark"] .gc-search input{border-color:var(--gc-border);background:var(--gc-gray-2)}
[data-theme="dark"] .gc-pricing-overlay{background:rgba(0,0,0,.7)}
[data-theme="dark"] .gc-modal-overlay{background:rgba(0,0,0,.7)}
[data-theme="dark"] .gc-spinner.light-bg{border-color:var(--gc-gray-4);border-top-color:var(--gc-blue)}

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;-webkit-font-smoothing:antialiased}
body{
  font-family:var(--gc-font);
  color:var(--gc-text-1);
  background:var(--gc-gray-1);
  line-height:1.5;
}
a{color:var(--gc-blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,select,textarea{font-family:inherit;font-size:14px}
ul,ol{list-style:none}

/* ═══ Top Bar ═══ */
.gc-topbar{
  position:fixed;top:0;left:0;right:0;height:var(--gc-topbar-h);
  background:var(--gc-white);
  border-bottom:1px solid var(--gc-gray-4);
  display:flex;align-items:center;
  z-index:1000;
  padding:0 16px;
}
.gc-topbar-logo{
  display:flex;align-items:center;gap:8px;
  font-size:16px;font-weight:500;color:var(--gc-text-1);
  white-space:nowrap;
}
.gc-topbar-logo:hover{text-decoration:none}
.gc-logo-icon{
  width:28px;height:28px;
  background:var(--gc-blue);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:600;font-size:13px;
  flex-shrink:0;
}
.gc-topbar-toggle{
  width:36px;height:36px;
  display:flex;align-items:center;justify-content:center;
  color:var(--gc-text-3);
  margin-right:8px;
}
.gc-topbar-toggle:hover{background:var(--gc-gray-2)}
.gc-topbar-toggle .material-symbols-outlined{font-size:22px}
.gc-topbar-right{
  margin-left:auto;display:flex;align-items:center;gap:12px;
}
.gc-topbar-link{
  color:var(--gc-text-3);font-size:14px;font-weight:500;
  padding:6px 10px;
}
.gc-topbar-link:hover{background:var(--gc-gray-2);text-decoration:none;color:var(--gc-text-1)}
.gc-avatar{
  width:32px;height:32px;
  object-fit:cover;border:1px solid var(--gc-gray-4);
}
.gc-avatar-btn{
  display:flex;align-items:center;gap:8px;
  padding:4px 8px 4px 4px;
}
.gc-avatar-btn:hover{background:var(--gc-gray-2)}
.gc-avatar-info{display:flex;flex-direction:column;line-height:1.2}
.gc-avatar-name{font-size:13px;font-weight:500;color:var(--gc-text-1)}
.gc-avatar-email{font-size:11px;color:var(--gc-text-3)}

/* ── Dropdown ── */
.gc-dropdown{
  position:absolute;top:calc(var(--gc-topbar-h) + 4px);right:16px;
  background:var(--gc-white);
  border:1px solid var(--gc-gray-4);
  box-shadow:var(--gc-shadow-2);
  min-width:260px;
  z-index:1100;
  overflow:hidden;
  display:none;
}
.gc-dropdown.open{display:block}
.gc-dropdown-header{
  padding:16px;border-bottom:1px solid var(--gc-gray-4);
  display:flex;align-items:center;gap:12px;
}
.gc-dropdown-header .gc-avatar{width:40px;height:40px}
.gc-dropdown-header .gc-avatar-info{flex:1}
.gc-dropdown-header .gc-avatar-name{font-size:15px}
.gc-dropdown-body{padding:8px 0}
.gc-dropdown-item{
  display:flex;align-items:center;gap:12px;
  padding:10px 16px;
  color:var(--gc-text-2);font-size:14px;
}
.gc-dropdown-item:hover{background:var(--gc-gray-2);text-decoration:none}
.gc-dropdown-item .material-symbols-outlined{font-size:20px;color:var(--gc-text-4)}

/* ═══ Sidebar ═══ */
.gc-sidebar{
  position:fixed;top:var(--gc-topbar-h);left:0;bottom:0;
  width:var(--gc-sidebar-w);
  background:var(--gc-white);
  border-right:1px solid var(--gc-gray-4);
  overflow-y:auto;
  z-index:900;
  transition:width var(--gc-transition);
  padding:8px 0 0 0;
  display:flex;
  flex-direction:column;
}
.gc-sidebar.collapsed{width:var(--gc-sidebar-collapsed)}
.gc-sidebar.collapsed .gc-nav-label,
.gc-sidebar.collapsed .gc-nav-section-label{display:none}
.gc-sidebar.collapsed .gc-nav-item{justify-content:center;padding:12px}
.gc-sidebar.collapsed .gc-nav-badge{display:none}
.gc-sidebar.collapsed .gc-sidebar-footer{display:none}

.gc-nav-section-label{
  padding:16px 20px 8px;
  font-size:11px;font-weight:500;
  color:var(--gc-text-4);
  text-transform:uppercase;
  letter-spacing:.6px;
}
.gc-nav-item{
  display:flex;align-items:center;gap:14px;
  padding:9px 20px;
  color:var(--gc-text-2);
  font-size:14px;font-weight:400;
  position:relative;
}
.gc-nav-item:hover{background:var(--gc-gray-2);text-decoration:none;color:var(--gc-text-1)}
.gc-nav-item.active{
  background:var(--gc-blue-light);
  color:var(--gc-blue);
  font-weight:500;
}
.gc-nav-item.active::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--gc-blue);
}
.gc-nav-item .material-symbols-outlined{font-size:20px;flex-shrink:0;color:var(--gc-text-3)}
.gc-nav-item.active .material-symbols-outlined{color:var(--gc-blue)}
.gc-nav-label{flex:1;white-space:nowrap}
.gc-nav-badge{
  background:var(--gc-blue);color:#fff;
  font-size:11px;font-weight:500;
  padding:1px 7px;border-radius:10px;
  min-width:18px;text-align:center;
}

/* ═══ Main Content ═══ */
.gc-main{
  margin-left:var(--gc-sidebar-w);
  margin-top:var(--gc-topbar-h);
  padding:24px;
  min-height:calc(100vh - var(--gc-topbar-h));
  transition:margin-left var(--gc-transition);
}
.gc-main.expanded{margin-left:var(--gc-sidebar-collapsed)}

.gc-page-header{
  margin-bottom:20px;
}
.gc-page-title{
  font-size:24px;font-weight:500;
  color:var(--gc-text-1);
  margin-bottom:4px;
}
.gc-page-subtitle{
  font-size:14px;color:var(--gc-text-3);
}

/* ═══ Card ═══ */
.gc-card{
  background:var(--gc-white);
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius);
  margin-bottom:16px;
  overflow:hidden;
}
.gc-card-header{
  padding:14px 20px;
  border-bottom:1px solid var(--gc-gray-4);
  display:flex;align-items:center;justify-content:space-between;
}
.gc-card-title{
  font-size:15px;font-weight:500;color:var(--gc-text-1);
  display:flex;align-items:center;gap:8px;
}
.gc-card-title .material-symbols-outlined{font-size:18px;color:var(--gc-text-3)}
.gc-card-body{padding:20px}
.gc-card-body.compact{padding:14px 20px}

/* ═══ Stat Cards ═══ */
.gc-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;margin-bottom:20px;
}
.gc-stat-card{
  background:var(--gc-white);
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius);
  padding:18px;
  min-width:0;
}
.gc-stat-value{
  font-size:28px;font-weight:500;
  color:var(--gc-text-1);line-height:1.2;
  margin-bottom:10px;
  word-break:break-all;
}
.gc-stat-icon{
  display:flex;align-items:center;gap:8px;
  color:var(--gc-text-3);
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gc-stat-icon .material-symbols-outlined{font-size:18px;flex-shrink:0}

/* ═══ Table ═══ */
.gc-table-wrap{overflow-x:auto}
.gc-table{
  width:100%;border-collapse:collapse;
  font-size:14px;
}
.gc-table th{
  text-align:left;font-weight:500;
  color:var(--gc-text-3);
  padding:10px 16px;
  border-bottom:1px solid var(--gc-gray-4);
  font-size:13px;
  white-space:nowrap;
  background:var(--gc-table-head-bg);
}
.gc-table td{
  padding:12px 16px;
  border-bottom:1px solid var(--gc-gray-4);
  color:var(--gc-text-1);
  vertical-align:middle;
}
.gc-table tbody tr:last-child td{border-bottom:none}
.gc-table tbody tr:hover{background:var(--gc-table-hover-bg)}
.gc-table .mono{font-family:var(--gc-mono);font-size:13px}
.gc-table .sub{font-size:12px;color:var(--gc-text-4);margin-top:2px}

/* ═══ Badge ═══ */
.gc-badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;
  font-size:12px;font-weight:500;
}
.gc-badge-success{background:var(--gc-green-light);color:var(--gc-green)}
.gc-badge-warning{background:var(--gc-yellow-light);color:#b06000}
.gc-badge-danger{background:var(--gc-red-light);color:var(--gc-red)}
.gc-badge-info{background:var(--gc-blue-light);color:var(--gc-blue)}
.gc-badge-gray{background:var(--gc-gray-2);color:var(--gc-text-3)}
.gc-badge-dot{
  width:6px;height:6px;border-radius:50%;display:inline-block;
}

/* ═══ Button ═══ */
.gc-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 16px;
  border-radius:var(--gc-radius-sm);
  font-size:14px;font-weight:500;
  white-space:nowrap;
  border:1px solid transparent;
}
.gc-btn .material-symbols-outlined{font-size:18px}
.gc-btn-primary{background:var(--gc-blue);color:#fff}
.gc-btn-primary:hover{background:var(--gc-blue-hover);text-decoration:none}
.gc-btn-outline{border-color:var(--gc-gray-4);color:var(--gc-blue);background:var(--gc-white)}
.gc-btn-outline:hover{background:var(--gc-blue-light);border-color:var(--gc-blue);text-decoration:none}
.gc-btn-text{color:var(--gc-blue);padding:7px 10px}
.gc-btn-text:hover{background:var(--gc-blue-light);text-decoration:none}
.gc-btn-danger{background:var(--gc-red);color:#fff}
.gc-btn-danger:hover{background:#c5221f;text-decoration:none}
.gc-btn-ghost{color:var(--gc-text-2);border-color:var(--gc-gray-4);background:var(--gc-white)}
.gc-btn-ghost:hover{background:var(--gc-gray-2);text-decoration:none}
.gc-btn-sm{padding:4px 10px;font-size:13px}
.gc-btn-lg{padding:9px 24px;font-size:15px}
.gc-btn-purchase{
  width:100%;max-width:480px;
  height:44px;justify-content:center;
  margin-left:auto;margin-right:auto;
  font-size:15px;
}
.gc-btn:disabled{opacity:.5;cursor:default}
.gc-btn-icon{
  width:32px;height:32px;padding:0;
  display:flex;align-items:center;justify-content:center;
  color:var(--gc-text-3);
}
.gc-btn-icon:hover{background:var(--gc-gray-2)}

/* ═══ Form ═══ */
.gc-form-group{margin-bottom:18px}
.gc-form-label{
  display:block;font-size:13px;font-weight:500;
  color:var(--gc-text-2);margin-bottom:6px;
}
.gc-form-hint{font-size:12px;color:var(--gc-text-4);margin-top:4px}
.gc-input,.gc-select,.gc-textarea{
  width:100%;padding:8px 12px;
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius-sm);
  font-size:14px;color:var(--gc-text-1);
  background:var(--gc-white);
}
.gc-input:focus,.gc-select:focus,.gc-textarea:focus{
  outline:none;border-color:var(--gc-blue);
  border-width:2px;padding:7px 11px;
}
.gc-input.mono{font-family:var(--gc-mono)}
.gc-textarea{resize:vertical;min-height:80px}
.gc-form-row{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
.gc-switch{
  position:relative;display:inline-block;
  width:36px;height:20px;
}
.gc-switch input{display:none}
.gc-switch-slider{
  position:absolute;cursor:pointer;
  top:0;left:0;right:0;bottom:0;
  background:var(--gc-gray-5);
  border-radius:20px;
}
.gc-switch-slider::before{
  content:'';position:absolute;
  width:16px;height:16px;left:2px;bottom:2px;
  background:#fff;border-radius:50%;
  transition:transform var(--gc-transition);
}
.gc-switch input:checked + .gc-switch-slider{background:var(--gc-blue)}
.gc-switch input:checked + .gc-switch-slider::before{transform:translateX(16px)}

/* ═══ Pricing Card ═══ */
.gc-pricing-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:16px;
  justify-items:start;
}
.gc-pricing-card{
  background:var(--gc-white);
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius);
  padding:18px;
  cursor:pointer;position:relative;
  width:100%;max-width:320px;
  display:flex;flex-direction:column;
}
.gc-pricing-card:hover{border-color:var(--gc-blue)}
.gc-pricing-card.selected{border-color:var(--gc-blue);background:var(--gc-blue-light)}
.gc-pricing-badge{
  position:absolute;top:-8px;right:12px;
  background:var(--gc-blue);color:#fff;
  font-size:11px;font-weight:500;
  padding:2px 8px;
}
.gc-pricing-name{font-size:16px;font-weight:500;margin-bottom:4px}
.gc-pricing-desc{font-size:13px;color:var(--gc-text-3);margin-bottom:12px;min-height:20px}
.gc-pricing-price{font-size:24px;font-weight:500;color:var(--gc-text-1)}
.gc-pricing-price small{font-size:14px;color:var(--gc-text-3)}
.gc-pricing-features{
  margin-top:auto;padding-top:14px;
  border-top:1px solid var(--gc-gray-4);
}
.gc-pricing-features li{
  display:flex;align-items:center;gap:8px;
  padding:4px 0;font-size:13px;color:var(--gc-text-2);
}
.gc-pricing-features .material-symbols-outlined{font-size:16px;color:var(--gc-green)}
.gc-pricing-features .gc-pricing-meta{
  color:var(--gc-text-3);
  font-size:12px;
}
.gc-pricing-features .gc-pricing-meta .material-symbols-outlined{
  color:var(--gc-text-3);font-size:14px;
}
.gc-pricing-disabled{
  opacity:0.6;cursor:not-allowed;
  background:var(--gc-gray-2);
}
.gc-pricing-disabled:hover{border-color:var(--gc-gray-4)}
.gc-pricing-overlay{
  position:absolute;top:0;left:0;right:0;bottom:0;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,0.75);
  color:var(--gc-red);
  font-size:18px;font-weight:600;
  z-index:2;
}

/* ── Period Selector ── */
.gc-period-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
}
.gc-period-opt{
  border:1px solid var(--gc-gray-4);border-radius:var(--gc-radius);
  padding:14px;text-align:center;cursor:pointer;
  position:relative;
}
.gc-period-opt:hover{border-color:var(--gc-blue)}
.gc-period-opt.selected{border-color:var(--gc-blue);background:var(--gc-blue-light)}
.gc-period-opt-label{font-size:14px;font-weight:400;color:var(--gc-text-1)}
.gc-period-opt-price{font-size:18px;font-weight:500;color:var(--gc-blue);margin-top:4px}
.gc-period-opt-badge{
  position:absolute;top:-8px;left:50%;transform:translateX(-50%);
  background:var(--gc-yellow);color:#fff;
  font-size:10px;font-weight:500;padding:2px 8px;
  white-space:nowrap;
}

/* ═══ Modal ═══ */
.gc-modal-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.5);
  z-index:10000;
  display:none;align-items:center;justify-content:center;
  padding:16px;
}
.gc-modal-overlay.open{display:flex}
.gc-modal{
  background:var(--gc-white);
  border-radius:var(--gc-radius);
  box-shadow:var(--gc-shadow-2);
  width:100%;max-width:480px;
  max-height:90vh;overflow:hidden;
  display:flex;flex-direction:column;
}
.gc-modal-header{
  padding:16px 20px;
  border-bottom:1px solid var(--gc-gray-4);
  display:flex;align-items:center;justify-content:space-between;
}
.gc-modal-title{font-size:16px;font-weight:500}
.gc-modal-body{padding:20px;overflow-y:auto;flex:1}
.gc-modal-footer{
  padding:12px 20px;
  border-top:1px solid var(--gc-gray-4);
  display:flex;justify-content:flex-end;gap:8px;
}

/* ═══ Toast ═══ */

/* ═══ Theme Toggle Button ═══ */
.gc-theme-toggle {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  color: var(--gc-text-3);
  border-radius: var(--gc-radius-sm);
  cursor: pointer;
}
.gc-theme-toggle:hover { background: var(--gc-gray-2); }
.gc-theme-toggle .material-symbols-outlined { font-size: 20px; }
.gc-toast-container{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);
  z-index:3000;display:flex;flex-direction:column;gap:8px;align-items:center;
}
.gc-toast{
  background:#3c4043;color:#fff;
  padding:10px 16px;border-radius:var(--gc-radius-sm);
  font-size:14px;font-weight:400;
  box-shadow:var(--gc-shadow-2);
  display:flex;align-items:center;gap:10px;
  max-width:480px;
  animation:gcToastIn .25s ease;
}
.gc-toast .material-symbols-outlined{font-size:18px}
.gc-toast.success .material-symbols-outlined{color:var(--gc-green-light)}
.gc-toast.error .material-symbols-outlined{color:#f28b82}
.gc-toast.info .material-symbols-outlined{color:#8ab4f8}

@keyframes gcToastIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes gcToastOut{
  from{opacity:1;transform:translateY(0)}
  to{opacity:0;transform:translateY(12px)}
}

/* ═══ Spinner ═══ */
.gc-spinner{
  width:16px;height:16px;
  border:2px solid rgba(255,255,255,.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:gcSpin .8s linear infinite;
}
.gc-spinner.light-bg{border-color:var(--gc-gray-4);border-top-color:var(--gc-blue)}
@keyframes gcSpin{to{transform:rotate(360deg)}}

/* ═══ Empty State ═══ */
.gc-empty{
  text-align:center;padding:40px 24px;
}
.gc-empty-icon{
  width:48px;height:48px;margin:0 auto 12px;
  background:var(--gc-gray-2);
  display:flex;align-items:center;justify-content:center;
}
.gc-empty-icon .material-symbols-outlined{font-size:24px;color:var(--gc-text-4)}
.gc-empty-title{font-size:15px;font-weight:500;color:var(--gc-text-2);margin-bottom:4px}
.gc-empty-desc{font-size:13px;color:var(--gc-text-4)}

/* ═══ Banner ═══ */
.gc-banner{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  margin-bottom:16px;font-size:13px;
  border:1px solid transparent;
}
.gc-banner .material-symbols-outlined{font-size:18px;flex-shrink:0}
.gc-banner.info{background:var(--gc-blue-light);color:#174ea6;border-color:#c6dafc}
.gc-banner.warning{background:var(--gc-yellow-light);color:#b06000;border-color:#ffe0b2}
.gc-banner.error{background:var(--gc-red-light);color:#a50e0e;border-color:#f5c6c1}
.gc-banner.success{background:var(--gc-green-light);color:#0d652d;border-color:#b7e1c2}

/* ═══ Flex Utils ═══ */
.gc-flex{display:flex;align-items:center;gap:8px}
.gc-flex-between{display:flex;align-items:center;justify-content:space-between}
.gc-flex-wrap{flex-wrap:wrap}
.gc-gap-16{gap:16px}
.gc-gap-24{gap:24px}
.gc-mt-16{margin-top:16px}
.gc-mt-24{margin-top:24px}
.gc-mb-16{margin-bottom:16px}
.gc-mb-24{margin-bottom:24px}
.gc-text-right{text-align:right}
.gc-text-center{text-align:center}
.gc-w-full{width:100%}

/* ═══ Tab Bar ═══ */
.gc-tabs{
  display:flex;gap:4px;
  border-bottom:1px solid var(--gc-gray-4);
  margin-bottom:20px;
}
.gc-tab{
  padding:10px 16px;
  font-size:14px;font-weight:400;
  color:var(--gc-text-3);
  border-bottom:2px solid transparent;
  cursor:pointer;
}
.gc-tab:hover{color:var(--gc-text-1)}
.gc-tab.active{color:var(--gc-blue);border-bottom-color:var(--gc-blue);font-weight:500}

/* ═══ Search ═══ */
.gc-search{
  position:relative;max-width:400px;flex:1;
}
.gc-search .material-symbols-outlined{
  position:absolute;left:10px;top:50%;transform:translateY(-50%);
  font-size:18px;color:var(--gc-text-4);pointer-events:none;
}
.gc-search input{
  width:100%;padding:7px 10px 7px 34px;
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius-sm);
  font-size:14px;
}
.gc-search input:focus{outline:none;border-color:var(--gc-blue)}

/* ═══ Detail Row (for modals) ═══ */
.gc-detail-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 0;border-bottom:1px solid var(--gc-gray-4);
}
.gc-detail-row:last-child{border-bottom:none}
.gc-detail-label{font-size:13px;color:var(--gc-text-3);font-weight:400}
.gc-detail-value{font-size:14px;color:var(--gc-text-1)}
.gc-detail-value.mono{font-family:var(--gc-mono);font-size:13px}

/* ═══ Responsive ═══ */
@media (max-width: 1024px){
  .gc-stat-grid{grid-template-columns:repeat(2,1fr)}
  .gc-pricing-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
}

@media (max-width: 768px){
  .gc-sidebar{transform:translateX(-100%)}
  .gc-sidebar.collapsed{width:var(--gc-sidebar-w)}
  .gc-sidebar.collapsed .gc-nav-label,
  .gc-sidebar.collapsed .gc-nav-section-label{display:block}
  .gc-sidebar.collapsed .gc-nav-item{justify-content:flex-start;padding:9px 20px}
  .gc-sidebar.mobile-open{transform:translateX(0)}
  .gc-main{margin-left:0;padding:16px}
  .gc-main.expanded{margin-left:0}
  .gc-page-header.gc-flex-between{flex-direction:column;align-items:flex-start;gap:12px}
  .gc-form-row{grid-template-columns:1fr}
  .gc-period-grid{grid-template-columns:1fr 1fr}
  .gc-page-title{font-size:20px}
  .gc-avatar-info{display:none}
  .gc-topbar-logo span{display:none}
  .gc-topbar-right{flex-wrap:wrap;gap:8px}
  .gc-stat-grid{grid-template-columns:repeat(2,1fr)}
  .gc-pricing-grid{grid-template-columns:1fr;justify-items:stretch}
  .gc-pricing-card{max-width:none}
  .gc-card-header{flex-direction:column;align-items:flex-start;gap:8px}
}

@media (max-width: 480px){
  .gc-stat-grid{grid-template-columns:1fr}
  .gc-period-grid{grid-template-columns:1fr}
  .gc-topbar{padding:0 12px}
  .gc-btn{padding:6px 12px;font-size:13px}
  .gc-btn .material-symbols-outlined{font-size:16px}
}

/* ═══ Landing Page (index.php) ═══ */
.gc-landing{
  min-height:100vh;
  background:var(--gc-white);
  display:flex;flex-direction:column;
}
.gc-landing-nav{
  height:60px;padding:0 32px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--gc-gray-4);
}
.gc-landing-hero{
  padding:64px 32px 48px;
  text-align:center;
  background:var(--gc-gray-1);
  border-bottom:1px solid var(--gc-gray-4);
}
.gc-landing-hero h1{
  font-size:40px;font-weight:500;
  color:var(--gc-text-1);line-height:1.25;
  max-width:680px;margin:0 auto 16px;
}
.gc-landing-hero p{
  font-size:16px;color:var(--gc-text-3);
  max-width:560px;margin:0 auto 28px;
}
.gc-landing-features{
  max-width:1080px;margin:0 auto;
  padding:56px 32px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
}
.gc-feature-card{
  text-align:left;
}
.gc-feature-icon{
  display:flex;align-items:center;gap:8px;
  margin-bottom:12px;
  color:var(--gc-blue);
}
.gc-feature-icon .material-symbols-outlined{font-size:22px}
.gc-feature-card h3{font-size:16px;font-weight:500;margin-bottom:6px}
.gc-feature-card p{font-size:13px;color:var(--gc-text-3);line-height:1.6}
.gc-landing-footer{
  margin-top:auto;padding:20px 32px;
  border-top:1px solid var(--gc-gray-4);
  text-align:center;font-size:13px;color:var(--gc-text-4);
}
@media (max-width:768px){
  .gc-landing-hero{padding:48px 16px}
  .gc-landing-hero h1{font-size:28px}
  .gc-landing-features{grid-template-columns:1fr;padding:32px 16px}
  .gc-landing-nav{padding:0 16px}
}

/* ═══ 余额充值弹窗 ═══ */
.gc-recharge-balance-row{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;
  background:var(--gc-blue-light);
  border-radius:var(--gc-radius-sm);
  font-size:14px;color:var(--gc-text-2);
}
.gc-recharge-balance-row .material-symbols-outlined{font-size:20px;color:var(--gc-blue)}
.gc-recharge-balance-row strong{color:var(--gc-blue);font-weight:500}

.gc-recharge-section-title{
  display:flex;align-items:center;gap:8px;
  font-size:14px;font-weight:500;color:var(--gc-text-2);
  margin-bottom:12px;
}
.gc-recharge-section-title .material-symbols-outlined{font-size:18px;color:var(--gc-text-3)}

.gc-recharge-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}
.gc-recharge-plan{
  border:1px solid var(--gc-gray-4);
  border-radius:var(--gc-radius);
  padding:14px;
  display:flex;flex-direction:column;gap:10px;
  background:var(--gc-white);
  transition:border-color var(--gc-transition);
}
.gc-recharge-plan:hover{border-color:var(--gc-blue)}
.gc-recharge-plan-head{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
}
.gc-recharge-plan-name{font-size:13px;color:var(--gc-text-2);font-weight:500}
.gc-recharge-tag{
  background:var(--gc-yellow);color:#fff;
  font-size:10px;font-weight:500;padding:2px 6px;border-radius:2px;white-space:nowrap;
}
.gc-recharge-plan-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.gc-recharge-amount{font-size:20px;font-weight:500;color:var(--gc-green)}
.gc-recharge-amount-label{font-size:11px;color:var(--gc-text-4)}
.gc-recharge-pay{font-size:12px;color:var(--gc-red);margin-left:auto}

.gc-recharge-confirm-box{
  border:1px solid var(--gc-gray-4);border-radius:var(--gc-radius);
  padding:4px 14px;
}
.gc-recharge-terms{
  display:flex;align-items:flex-start;gap:8px;
  font-size:13px;color:var(--gc-text-2);cursor:pointer;
}
.gc-recharge-terms input{margin-top:3px;cursor:pointer}
.gc-recharge-terms a{color:var(--gc-blue);text-decoration:none}
.gc-recharge-terms a:hover{text-decoration:underline}
.gc-recharge-terms-detail{
  margin-top:8px;padding:10px 12px;
  background:var(--gc-gray-1);border-radius:var(--gc-radius-sm);
  font-size:12px;color:var(--gc-text-3);line-height:1.8;
}

/* ═══ 侧边栏底部余额+充值 footer ═══ */
.gc-sidebar-footer{
  margin-top:auto;
  padding:12px 16px;
  border-top:1px solid var(--gc-gray-4);
  background:var(--gc-white);
  flex-shrink:0;
}
.gc-sidebar-balance{
  display:flex;align-items:center;gap:8px;
  font-size:13px;color:var(--gc-text-3);
  margin-bottom:8px;
}
.gc-sidebar-balance .material-symbols-outlined{font-size:18px;color:var(--gc-text-4)}
.gc-sidebar-balance strong{color:var(--gc-blue);font-weight:500}
.gc-sidebar-recharge{
  display:flex;align-items:center;justify-content:center;gap:6px;
  width:100%;padding:8px 12px;
  background:var(--gc-blue);
  color:#fff;
  border:none;
  border-radius:var(--gc-radius-sm);
  font-size:13px;font-weight:500;
  font-family:inherit;
  cursor:pointer;
  transition:background var(--gc-transition);
}
.gc-sidebar-recharge:hover{background:var(--gc-blue-hover)}
.gc-sidebar-recharge .material-symbols-outlined{font-size:18px}

/* 下拉菜单充值按钮 */
.gc-dropdown-recharge{
  width:100%;text-align:left;border:none;background:none;cursor:pointer;
  font-family:inherit;font-size:14px;
  color:var(--gc-blue) !important;
}
.gc-dropdown-recharge:hover{background:var(--gc-blue-light) !important}
.gc-dropdown-recharge .material-symbols-outlined{color:var(--gc-blue) !important}