:root {
  --navy: #12304a;
  --blue: #28658f;
  --green: #1f7a60;
  --amber: #a86516;
  --red: #a94343;
  --line: #dce4e9;
  --muted: #5b6f7c;
}

body {
  color: #13283a;
  background: radial-gradient(circle at 92% 0%, rgba(76, 145, 156, .08), transparent 30rem), #f3f6f7;
}

.topbar {
  min-height: 76px;
  padding: 0 max(28px, calc((100vw - 1180px) / 2));
  border: 0;
  background: var(--navy);
  box-shadow: 0 8px 26px rgba(18, 48, 74, .09);
}

.topbar .brand {
  display: block;
  width: 200px;
  height: 56px;
  overflow: hidden;
  border-radius: 12px;
  color: transparent;
  background: #fff url("/static/assets/femtory-logo.png") center / 181px 47px no-repeat;
  box-shadow: 0 5px 16px rgba(5, 23, 36, .16);
  font-size: 0;
}

.topbar .nav-link,
.topbar .nav-button {
  min-height: 40px;
  color: #e0eaf0;
}

.topbar .nav-link:hover,
.topbar .nav-button:hover { color: #fff; background: rgba(255, 255, 255, .1); }
.topbar .nav-note { color: #9fb4c2; font-size: 12px; font-weight: 650; }

.license-page > .topbar {
  min-height: 72px;
  padding: 0 38px;
  border-bottom: 1px solid #d9e2e7;
  color: #667b88;
  background: rgba(255, 255, 255, .88);
  box-shadow: none;
  backdrop-filter: blur(14px);
}
.license-page > .topbar .brand {
  width: auto;
  height: auto;
  border-radius: 0;
  color: transparent;
  background: none;
  box-shadow: none;
  font-size: 0;
}
.license-page > .topbar .brand::after { content: "업무 공간  /  PTC 라이선스"; color: #6b7e89; font-size: 13px; font-weight: 500; letter-spacing: 0; }
.license-page > .topbar .nav-link { display: none; }
.license-page > .topbar .nav-note { color: #687c89; }

.container { width: min(1180px, calc(100% - 56px)); padding: 20px 0 48px; }
.hero { margin-bottom: 24px; }
.hero h1 { color: #13283a; font-size: clamp(32px, 4vw, 42px); }
.hero .description { color: #566b79; font-weight: 500; }

.secondary-button,
.primary-button,
.danger-button { min-height: 46px; border-radius: 10px; }
.secondary-button { border-color: #aebfc9; color: #29495f; }

.overall-card,
.card {
  border-color: var(--line);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(18, 48, 74, .055);
}

.overall-card { min-height: 142px; padding: 27px 30px 27px 34px; }
.overall-card::before { width: 4px; }
.status-summary { color: #566b79; font-weight: 500; }
.checked-at { color: #5d7280; }

.grid { gap: 16px; }
.card { padding: 25px; }
.card-header { margin-bottom: 21px; }
.card-label, .eyebrow { color: #687c89; }
.chip { border: 1px solid transparent; }
.chip-good { border-color: #c6e4da; }
.chip-warn { border-color: #eed4aa; }
.chip-bad { border-color: #ebc7c7; }
.metric-list dt, .license-counts span, .client-box span, .muted { color: #5b6f7c; }
.metric-list > div { border-bottom-color: #e7edf0; }
.client-box { border: 1px solid #e1e8ec; background: #f5f8f9; }
.empty-state { color: #5b6f7c; background: #f5f8f9; }
.restart-card { border-left: 3px solid #d5aa69; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
summary:focus-visible {
  outline: 3px solid #e49b36;
  outline-offset: 3px;
}

.login-page {
  display: block;
  padding: 0;
  background: radial-gradient(circle at 50% 0%, rgba(76, 145, 156, .09), transparent 28rem), #eef3f5;
}

.login-page .license-page { display: grid; place-items: center; min-height: 100vh; padding: 28px; }

.login-shell { width: min(460px, 100%); }
.login-card { position: relative; padding: 34px; border-radius: 16px; box-shadow: 0 14px 38px rgba(18, 48, 74, .09); }
.login-card::before {
  content: "";
  display: block;
  width: 181px;
  height: 47px;
  margin-bottom: 28px;
  background: url("/static/assets/femtory-logo.png") center / contain no-repeat;
}
.login-card .eyebrow { color: #0f806f; }
.login-card h1 { color: #13283a; }
.login-card .description { color: #566b79; font-weight: 500; }
.login-card input { min-height: 50px; border-radius: 10px; }
.login-card input:focus { outline: 3px solid rgba(37, 105, 138, .14); border-color: #25698a; }
.back-link { color: #405b6d; }

@media (max-width: 760px) {
  .topbar { min-height: 66px; padding: 0 14px; }
  .topbar .brand { width: 48px; height: 47px; background-image: url("/static/assets/femtory-logo-small.png"); background-size: 48px 47px; }
  .container { width: min(100% - 28px, 680px); padding-top: 20px; }
  .topbar .nav-note { display: none; }
}

@media (max-width: 680px) {
  .license-page > .topbar { min-height: 58px; padding: 0 18px; }
  .license-page > .topbar .brand::after { content: "PTC 라이선스"; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
  .login-page .license-page { min-height: calc(100vh - 64px); padding: 18px; }
}