:root {
  --portal-navy: #10243f;
  --portal-ink: #172033;
  --portal-muted: #667085;
  --portal-line: #d9e0e6;
  --portal-surface: #f5f7f8;
  --portal-gold: #b7924b;
  --portal-success: #277557;
  --portal-danger: #b42318;
}

body { background: var(--portal-surface); color: var(--portal-ink); font-family: 'Noto Sans KR', sans-serif; }
button, input, select, textarea { font-family: inherit; }

/* 로그인·비밀번호 화면은 한 가지 인증 경험으로 통일한다. */
.auth-container { align-items: flex-start; min-height: 100vh; padding: 0; background: var(--portal-surface); }
.auth-box {
  width: min(520px, calc(100% - 32px));
  max-width: none;
  margin: 116px auto 64px;
  padding: clamp(28px, 5vw, 48px);
  border: 1px solid var(--portal-line);
  border-top: 4px solid var(--portal-gold);
  border-radius: 4px;
  box-shadow: 0 16px 40px rgba(16, 36, 63, .08);
}
.auth-box .h-display { color: var(--portal-navy); font-size: 30px; letter-spacing: 0; }
.auth-box .t-body { margin-bottom: 28px; font-weight: 400; }
.form-minimal input { margin-bottom: 12px; padding: 14px 12px; border: 1px solid var(--portal-line); border-radius: 3px; }
.form-minimal input:focus { border-color: var(--portal-navy); box-shadow: 0 0 0 3px rgba(16, 36, 63, .08); }
.btn-black { border-radius: 3px; background: var(--portal-navy); letter-spacing: 0; text-transform: none; }
.address-register-row { gap: 8px; }
.address-register-row button { min-height: 48px; margin: 0; border-radius: 3px; }

/* B2B 몰은 반복 업무에 맞춰 밀도와 스캔성을 높인다. */
body > nav { height: 64px; padding: 0 clamp(16px, 3vw, 44px); background: #fff; }
.nav-logo { color: var(--portal-navy); font-size: 19px; }
.nav-utils { gap: 12px; }
.nav-utils button { min-height: 36px; padding: 0 8px; color: var(--portal-ink); border-radius: 3px; }
.nav-utils button:hover { background: var(--portal-surface); }
.container { width: min(1500px, 100%); margin: 0 auto; padding: 32px clamp(16px, 3vw, 44px) 80px; }
.header-area { margin-bottom: 24px; }
.h-section { color: var(--portal-navy); font-size: clamp(28px, 3vw, 42px); letter-spacing: 0; }
.grid-4col { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.product-item { min-width: 0; border-color: var(--portal-line); border-radius: 4px; overflow: hidden; background: #fff; }
.product-img { position: relative; min-width: 0; overflow: hidden; flex: 0 0 auto; }
.product-img img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  max-width: 100%; max-height: 100%; object-fit: contain; object-position: center;
}
.product-item:hover { border-color: #aeb9c4; box-shadow: 0 8px 22px rgba(16,36,63,.07); }
.product-info { min-width: 0; padding: 16px; }
.p-name { min-height: 48px; margin-bottom: 12px; color: var(--portal-navy); font-size: 15px; overflow-wrap: anywhere; }
.p-price-row { gap: 12px; }
.cart-actions input { border-radius: 3px; }
.cart-actions button, .btn-checkout { border-radius: 3px; background: var(--portal-navy); }

.catalog-state,
.order-flow,
.history-table-wrap { border-color: var(--portal-line); border-radius: 4px; }
.order-flow { overflow: hidden; }
.order-flow-step { background: #fff; border-color: var(--portal-line); }
.order-flow-step strong { color: var(--portal-navy); }
.history-table th { background: #edf1f3; color: #344054; }
.history-table tbody tr:hover { background: #f4f7f8; }
.history-actions .secondary-button,
.secondary-button { border-color: #9ca9b5; border-radius: 3px; }
.order-cancel-button { border-color: var(--portal-danger); color: var(--portal-danger); border-radius: 3px; }
.order-detail-panel { border: 0; border-top: 4px solid var(--portal-gold); border-radius: 4px; box-shadow: 0 24px 70px rgba(7,21,34,.2); }
.order-detail-card { border-color: var(--portal-line); border-radius: 3px; background: var(--portal-surface); }
#cart-modal { border-color: var(--portal-line); box-shadow: -16px 0 50px rgba(7,21,34,.14); }
.cart-select-all { display:flex; align-items:center; gap:8px; margin-bottom:14px; padding:10px 12px; background:#edf1f3; color:var(--portal-navy); font-size:13px; font-weight:600; }
.cart-select-all input, .cart-line-checkbox { width:16px; height:16px; accent-color:var(--portal-navy); flex:0 0 auto; }
.cart-item { display:grid; grid-template-columns:16px minmax(0,1fr) auto; gap:10px; align-items:start; }
.cart-item.is-unselected { opacity:.5; }
.cart-empty { padding:30px 12px; text-align:center; color:var(--portal-muted); font-size:13px; }
.btn-checkout:disabled { opacity:.45; cursor:not-allowed; }
.form-field input, .form-field select, .form-field textarea { border-radius: 3px; }

.box {
  border: 1px solid var(--portal-line) !important;
  border-top: 4px solid var(--portal-gold) !important;
  border-radius: 4px;
  box-shadow: 0 16px 40px rgba(16,36,63,.08);
}
.box button { background: var(--portal-navy); border-radius: 3px; }
.box input { border-color: var(--portal-line); border-radius: 3px; }

@media (max-width: 1100px) {
  .grid-4col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  body { padding-top: 60px; }
  body > nav { height: 60px; }
  .container { padding-top: 24px; }
  .header-area { align-items: flex-start; }
  .grid-4col { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-info { padding: 12px; }
  .p-name { min-height: 42px; font-size: 14px; }
  .p-price-row { font-size: 12px; }
  .history-actions { grid-template-columns: 1fr 1fr; }
  .order-flow-step { padding: 11px 12px; }
  .auth-container { min-height: calc(100vh - 60px); }
  .auth-box { margin: 24px auto 48px; padding: 26px 20px; }
}

@media (max-width: 430px) {
  .nav-utils { gap: 3px; }
  .nav-utils button { padding: 0 5px; font-size: 11px; }
  .grid-4col { grid-template-columns: 1fr; }
  .history-actions { grid-template-columns: 1fr; }
  .address-search-row { grid-template-columns: 1fr; }
}