/* Deliberately quiet product UI: no decorative motion, gradients, or visual noise. */
:root {
  --ink: #000;
  --ink-2: #0a0a0a;
  --panel: #111;
  --line: #2a2a2a;
  --gold: #f2f2f2;
  --gold-soft: #fff;
  --paper: #f5f5f5;
  --muted: #8d8d8d;
  --danger: #ff625c;
}

html,
body,
button,
input,
select,
textarea {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}

*,
*::before,
*::after {
  animation: none !important;
  transition: none !important;
}

body { letter-spacing: 0; }
.eyebrow, .mono { color: #989898; font-size: 10px; letter-spacing: .1em; }
.brand { color: #fff; font-size: 16px; font-weight: 600; letter-spacing: 0; }
.brand-mark { width: 24px; height: 24px; border-color: #505050; border-radius: 6px; font-family: inherit; font-size: 12px; }

.gate-view { background: #000; }
.gate-view::after { display: none; }
.gate-header { height: 72px; border-color: #202020; }
.gate-hero { max-width: 680px; padding: clamp(96px, 16vh, 170px) clamp(24px, 12vw, 180px); }
.gate-hero h1,
.member-page h2,
.section-heading h1,
.section-heading h2,
.admin-page h1,
.content-detail h3 {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", sans-serif;
  font-weight: 600;
  letter-spacing: -.045em;
}
.gate-hero h1 { font-size: clamp(52px, 7vw, 86px); line-height: .98; margin: 15px 0 14px; }
.cn-title { color: #a0a0a0; font-family: inherit; font-size: 11px; letter-spacing: .2em; margin-bottom: 24px; }
.intro { max-width: 500px; color: #aaa; line-height: 1.75; }
.side-caption { color: #717171; }

.invite-form,
.membership,
.metric,
.setting,
.content-detail,
.dialog,
.admin-login-card { box-shadow: none; backdrop-filter: none; border-color: #303030; background: #111; }
.invite-form { padding: 22px; }
.input-line { height: 52px; border: 1px solid #3a3a3a; padding-left: 14px; }
.input-line:focus-within { border-color: #e6e6e6; }
.input-line button,
.gold-button { min-height: 40px; border: 1px solid #f5f5f5; background: #f5f5f5; color: #090909; border-radius: 0; font-size: 12px; font-weight: 600; letter-spacing: 0; }
.input-line button { padding: 0 16px; }
.form-note { color: #777; letter-spacing: .02em; }

.app-view,
.admin-view,
.admin-login { background: #000; }
.member-sidebar { border-color: #202020; background: #050505; }
.member-sidebar .brand { margin-bottom: 46px; }
.nav-button { color: #888; border-left: 0; border-radius: 0; padding: 12px; }
.nav-button:hover,
.nav-button.active { color: #fff; border-left: 0; background: #1a1a1a; }
.membership { border-color: #282828; background: #101010; }
.member-main { padding: clamp(28px, 5vw, 64px); }
.member-top { margin-bottom: 46px; }
.member-intro,
.admin-description,
.content-body { color: #a3a3a3; }

.tier-cards { gap: 10px; max-width: 920px; }
.tier-card,
.content-card { min-height: 250px; padding: 24px; border-color: #303030; background: #111; }
.tier-card::before,
.tier-card::after,
.content-card::before { display: none; }
.tier-card:hover { transform: none; border-color: #707070; }
.tier-card strong { font-family: inherit; font-size: clamp(28px, 3vw, 42px); font-weight: 600; line-height: 1; letter-spacing: -.04em; }
.tier-arrow { color: #aaa; }
.content-list { gap: 10px; }
.content-card { min-height: 210px; justify-content: flex-start; }
.content-card h3 { color: #fff; font-size: 17px; font-weight: 600; }
.content-card p { color: #aaa; }
.content-card .content-date { margin-top: auto; color: #777; }
.content-detail { background: #111; }
.media-grid img,
.media-grid video { background: #050505; }
.file-link { border-color: #333; color: #f5f5f5; }

.console { max-width: 1320px; }
.console-header { border-color: #242424; }
.console-brand { color: #fff; letter-spacing: .04em; }
.console-layout { gap: 40px; }
.console-nav-button { color: #8d8d8d; border-color: #242424; }
.console-nav-button.active,
.console-nav-button:hover { color: #fff; }
.sync-list,
.admin-list { background: #242424; }
.sync-row,
.admin-row { background: #111; }
.filter,
.small-action { border-color: #3a3a3a; border-radius: 0; color: #c8c8c8; }
.filter.active,
.filter:hover,
.small-action:hover { border-color: #e5e5e5; color: #fff; }
.small-action.danger:hover { border-color: var(--danger); color: var(--danger); }
.status { color: #d0d0d0; border-color: #4a4a4a; }
.status.failed { color: var(--danger); }
.admin-login { background: #000; }
.admin-login-card { background: #111; }
.admin-login-card input,
.dialog-card input,
.dialog-card select,
.dialog-card textarea { border-color: #3a3a3a; background: #090909; }
.notice { border-color: #777; background: #111; color: #a9a9a9; }

@media (max-width: 700px) {
  .gate-header { height: 64px; }
  .gate-hero { padding: 14vh 24px 64px; }
  .gate-hero h1 { font-size: 54px; }
  .member-sidebar { background: #050505; }
  .nav-button.active { border-top: 0; background: #1a1a1a; }
  .tier-card, .content-card { min-height: 190px; }
}
