:root {
  --paper: #f5f7fa;
  --surface: #ffffff;
  --ink: #17212b;
  --muted: #657384;
  --line: #d8e0e8;
  --blue: #1f5ca8;
  --blue-dark: #143e72;
  --orange: #df6b2f;
  --green: #23705a;
  --violet: #6e56a5;
  --red: #a6403c;
}

* { box-sizing: border-box; }
html { color-scheme: light; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Segoe UI Variable", "Segoe UI", Arial, sans-serif; }
a { color: inherit; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #ffb24a; outline-offset: 3px; }

.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); }
.login-intro { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: clamp(48px, 8vw, 128px); color: white; background: var(--blue-dark); }
.brand-mark { display: grid; width: 94px; height: 94px; margin-bottom: 48px; grid-template-columns: 1fr 1fr; align-items: stretch; border: 1px solid rgba(255,255,255,.45); }
.brand-mark span { display: grid; place-items: center; font-weight: 750; letter-spacing: -.04em; }
.brand-mark span:last-child { color: var(--blue-dark); background: white; }
.kicker, .section-label { margin: 0 0 14px; color: inherit; font-size: 14px; font-weight: 650; letter-spacing: .02em; }
.login-intro h1 { max-width: 700px; margin: 0; font-size: clamp(48px, 6vw, 92px); line-height: .98; letter-spacing: -.055em; }
.login-copy { max-width: 610px; margin: 34px 0 0; color: #cedced; font-size: clamp(18px, 2vw, 24px); line-height: 1.5; }
.market-lines { position: absolute; right: 0; bottom: 54px; left: clamp(48px, 8vw, 128px); display: grid; grid-template-columns: 49% 31% 20%; height: 7px; }
.market-lines i:nth-child(1) { background: #2f7fe1; }.market-lines i:nth-child(2) { background: #8556c5; }.market-lines i:nth-child(3) { background: #f2a43a; }
.login-panel { display: flex; flex-direction: column; justify-content: center; gap: 28px; padding: clamp(42px, 7vw, 110px); background: var(--surface); }
.login-panel h2 { margin: 0; font-size: clamp(34px, 4vw, 56px); letter-spacing: -.04em; }
.section-label { color: var(--blue); }
.login-form { display: grid; gap: 20px; }
.login-form label { display: grid; gap: 8px; color: #3f4b58; font-size: 14px; font-weight: 650; }
.login-form input { width: 100%; padding: 15px 16px; border: 1px solid #b9c4cf; border-radius: 4px; background: #fbfcfd; }
.login-form input:focus { border-color: var(--blue); }
.login-form button { margin-top: 8px; padding: 16px 20px; border: 0; border-radius: 4px; color: white; background: var(--blue); font-weight: 700; cursor: pointer; }
.login-form button:hover { background: var(--blue-dark); }.login-form button:disabled { cursor: not-allowed; opacity: .45; }
.privacy-note { max-width: 50ch; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.notice { padding: 14px 16px; border-left: 4px solid; background: #f1f4f7; line-height: 1.5; }.notice-warn { border-color: var(--orange); }.notice-error { border-color: var(--red); color: #742c29; }

.app-shell { min-height: 100vh; }
.topbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; min-height: 70px; padding: 0 clamp(22px, 4vw, 64px); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.96); }
.wordmark { display: flex; align-items: stretch; text-decoration: none; font-size: 14px; font-weight: 750; letter-spacing: .04em; }
.wordmark span { padding: 8px 10px 8px 0; }.wordmark b { padding: 8px 9px; color: white; background: var(--blue); }
.topbar nav { display: flex; align-items: center; gap: clamp(14px, 3vw, 32px); }.topbar nav a, .link-button { padding: 8px 0; border: 0; color: #4b5968; background: none; text-decoration: none; cursor: pointer; }.topbar nav a[aria-current="page"] { color: var(--ink); border-bottom: 2px solid var(--blue); }.topbar form { margin: 0; }
main { width: min(1440px, 100%); margin: 0 auto; padding: 0 clamp(22px, 4vw, 64px) 80px; }
.command-strip { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr); align-items: end; min-height: 360px; padding: 72px 0 50px; border-bottom: 1px solid var(--line); }
.command-strip .kicker { color: var(--blue); }.command-strip h1, .page-heading h1 { margin: 0; font-size: clamp(50px, 7vw, 104px); line-height: .93; letter-spacing: -.06em; }
.system-readout { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 4px solid var(--ink); }
.readout-item { display: grid; grid-template-columns: auto 1fr; gap: 3px 9px; padding: 18px 12px 12px 0; border-right: 1px solid var(--line); text-decoration: none; }.readout-item:last-child { border-right: 0; padding-left: 12px; }.readout-item:nth-child(2) { padding-left: 12px; }.readout-item small { grid-column: 2; color: var(--muted); }
.signal { display: inline-block; width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; }.signal-ok { background: var(--green); box-shadow: 0 0 0 4px #dbeee8; }.signal-idle { background: var(--orange); box-shadow: 0 0 0 4px #fae8dd; }
.workspace-section { padding: 54px 0 12px; }.section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 22px; }.section-heading h2 { margin: 0; font-size: clamp(28px, 3vw, 42px); letter-spacing: -.035em; }.section-heading p { margin: 0; color: var(--muted); }
.empty-state { display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); }.empty-state b { color: var(--ink); }
.tool-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }.tool-card { grid-column: span 6; min-height: 260px; display: flex; flex-direction: column; padding: 24px; border-top: 6px solid var(--blue); background: var(--surface); box-shadow: 0 1px 0 rgba(18,31,44,.06); }.tool-card:nth-child(3n+1) { grid-column: span 7; }.tool-card:nth-child(3n+2) { grid-column: span 5; }.tool-card:nth-child(3n+3) { grid-column: span 6; }.accent-orange { border-top-color: var(--orange); }.accent-green { border-top-color: var(--green); }.accent-violet { border-top-color: var(--violet); }
.tool-meta, .tool-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.market-tag { color: var(--muted); font-size: 12px; font-weight: 700; text-transform: none; }.status { display: inline-flex; width: fit-content; padding: 4px 8px; border-radius: 3px; color: var(--blue-dark); background: #e5eef8; font-size: 12px; font-weight: 650; }.status-needs_verification, .status-unknown { color: #75431e; background: #f9e9dc; }.status-migrating { color: #56407c; background: #eee8f7; }
.tool-card h3 { max-width: 18ch; margin: 40px 0 12px; font-size: clamp(25px, 2.3vw, 36px); line-height: 1.08; letter-spacing: -.035em; }.tool-card p { max-width: 62ch; margin: 0; color: #556373; line-height: 1.55; }.tool-foot { align-items: end; margin-top: auto; padding-top: 28px; }.tool-foot small { color: var(--muted); }.tool-foot a { padding: 10px 14px; border: 1px solid var(--ink); text-decoration: none; font-weight: 650; }.tool-foot a:hover { color: white; background: var(--ink); }
.development-section { margin-top: 36px; }.development-list { border-top: 3px solid var(--ink); }.development-list article { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(320px, 1.3fr) auto; align-items: center; gap: 28px; padding: 22px 0; border-bottom: 1px solid var(--line); }.development-list h3 { margin: 5px 0 0; font-size: 21px; }.development-list p { margin: 0; color: var(--muted); line-height: 1.45; }
footer { display: flex; justify-content: space-between; padding: 24px clamp(22px, 4vw, 64px); border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }

.status-main { padding-top: 76px; }.page-heading { max-width: 980px; margin-bottom: 58px; }.page-heading .kicker { color: var(--blue); }.page-heading h1 { font-size: clamp(48px, 6vw, 82px); }.page-heading > p:last-child { max-width: 60ch; color: var(--muted); font-size: 18px; }
.status-board { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 4px solid var(--ink); border-bottom: 1px solid var(--line); }.status-board section { min-height: 210px; padding: 24px; border-right: 1px solid var(--line); }.status-board section:last-child { border-right: 0; }.status-board h2 { margin: 42px 0 7px; font-size: 25px; }.status-board p { color: var(--muted); }
.source-status, .file-list { margin-top: 60px; }.source-status h2 { font-size: 32px; }.source-status > div { display: grid; grid-template-columns: 1fr 1fr 2fr; padding: 18px 0; border-top: 1px solid var(--line); }.source-status small { color: var(--muted); }
.file-list { border-top: 4px solid var(--ink); }.file-list > a { display: grid; grid-template-columns: 1fr auto auto; gap: 28px; padding: 22px 4px; border-bottom: 1px solid var(--line); text-decoration: none; }.file-list > a small { color: var(--muted); }.file-list > a b { color: var(--blue); }

@media (max-width: 900px) {
  .login-shell { grid-template-columns: 1fr; }.login-intro { min-height: 48vh; padding: 48px 28px 72px; }.brand-mark { margin-bottom: 34px; }.login-panel { padding: 48px 28px; }.market-lines { left: 28px; }
  .command-strip { grid-template-columns: 1fr; gap: 52px; min-height: auto; }.tool-card, .tool-card:nth-child(n) { grid-column: span 12; }.development-list article { grid-template-columns: 1fr; gap: 12px; }.status-board { grid-template-columns: 1fr; }.status-board section { border-right: 0; border-bottom: 1px solid var(--line); }.source-status > div { grid-template-columns: 1fr; gap: 6px; }
}
@media (max-width: 560px) {
  .topbar { position: static; min-height: auto; padding-top: 18px; padding-bottom: 18px; align-items: flex-start; }.topbar nav { flex-wrap: wrap; justify-content: flex-end; gap: 8px 15px; font-size: 13px; }.command-strip h1 { font-size: 52px; }.system-readout { grid-template-columns: 1fr; }.readout-item, .readout-item:nth-child(n) { padding: 14px 0; border-right: 0; border-bottom: 1px solid var(--line); }.section-heading { display: block; }.section-heading p { margin-top: 8px; }.tool-foot { align-items: flex-start; flex-direction: column; }.file-list > a { grid-template-columns: 1fr auto; }.file-list > a b { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }
