:root {
  --bg: #090d15;
  --panel: #151c28;
  --panel-2: #111824;
  --line: #293448;
  --line-soft: #202a3a;
  --text: #edf2ff;
  --muted: #8f9db4;
  --blue: #7484ff;
  --blue-2: #596af2;
  --green: #36daa0;
  --amber: #f0b949;
  --red: #ff718d;
  --shadow: 0 22px 70px rgba(0, 0, 0, .32);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 74% -8%, rgba(97, 111, 255, .13), transparent 34rem), radial-gradient(circle at 8% 32%, rgba(44, 205, 164, .035), transparent 28rem), var(--bg); color: var(--text); }
button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #92a0ff; outline-offset: 2px; }

.eyebrow, .panel-label { color: #a8b3ff; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 850; letter-spacing: .02em; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--blue), #58c8ff); color: #08101d; box-shadow: 0 10px 30px rgba(94, 116, 255, .35); }

.primary-button, .secondary-button, .ghost-button, .success-button, .text-button { border: 0; cursor: pointer; transition: transform .15s ease, border-color .15s ease, filter .15s ease, background .15s ease; }
.primary-button { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: 0 20px; border: 1px solid #93a0ff; border-radius: 9px; background: linear-gradient(180deg, #7c8cff, #5e6fed); color: white; font-weight: 800; box-shadow: 0 8px 30px rgba(92, 108, 242, .2); }
.primary-button:hover, .success-button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.primary-button.small { min-height: 36px; padding: 0 14px; font-size: 13px; }
.secondary-button { min-height: 42px; padding: 0 16px; border: 1px solid #35445c; border-radius: 9px; background: #151e2c; color: #dbe5f5; font-weight: 750; }
.secondary-button:hover { border-color: #62718d; background: #1a2637; }
.primary-button:disabled, .secondary-button:disabled, .success-button:disabled { cursor: not-allowed; filter: grayscale(.3); opacity: .48; transform: none; }
.ghost-button { display: inline-flex; justify-content: center; align-items: center; min-height: 38px; padding: 0 14px; border: 1px solid #354157; border-radius: 8px; background: #161e2b; color: #dce5f4; font-weight: 700; }
.ghost-button:hover { border-color: #596985; background: #1a2534; }
.success-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid #2c8669; border-radius: 9px; background: linear-gradient(180deg, #1e6c55, #15523f); color: #8fffcf; font-weight: 800; }
.full { width: 100%; }
.text-button { padding: 0; background: transparent; color: #a7b4ff; font-weight: 750; }
.text-button.danger { color: #ff8fa5; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

label { display: block; margin: 15px 0 7px; color: #c9d3e4; font-size: 13px; font-weight: 750; }
input, select, textarea { width: 100%; border: 1px solid #344158; border-radius: 9px; background: #0d1420; color: var(--text); }
input, select { height: 46px; padding: 0 13px; }
textarea { padding: 12px; resize: vertical; }
input::placeholder { color: #637088; }
input:focus, select:focus, textarea:focus { border-color: #7787ff; box-shadow: 0 0 0 3px rgba(104, 120, 255, .12); }

/* Public redemption */
.public-nav { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 24px 0; display: flex; align-items: center; justify-content: space-between; }
.redeem-shell { width: min(1180px, calc(100% - 40px)); min-height: calc(100vh - 170px); margin: 0 auto; display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; align-items: center; padding: 50px 0 80px; }
.redeem-copy h1 { max-width: 760px; margin: 20px 0 24px; font-size: clamp(48px, 7vw, 84px); line-height: 1.02; letter-spacing: -.055em; }
.redeem-copy > p { max-width: 650px; color: #a7b4c8; font-size: 18px; line-height: 1.8; }
.trust-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.trust-row span { padding: 9px 12px; border: 1px solid #2c394d; border-radius: 999px; color: #aebbd0; background: #101722; font-size: 13px; }
.redeem-card, .login-panel { border: 1px solid #2c384d; border-radius: 20px; background: linear-gradient(150deg, rgba(26, 36, 53, .96), rgba(13, 20, 32, .98)); box-shadow: var(--shadow); }
.redeem-card { padding: 34px; }
.redeem-card h2 { margin: 8px 0 22px; font-size: 30px; }
.card-kicker { color: #6ed9b1; font-size: 12px; font-weight: 850; letter-spacing: .12em; }
.field-note { margin: 11px 0 20px; color: #8290a7; font-size: 12px; line-height: 1.65; }
.result-box { margin-top: 18px; padding: 16px; border: 1px solid #2c8d6c; border-radius: 10px; background: #0e2b22; color: #b8ffe2; line-height: 1.7; word-break: break-word; }
.result-box.error { border-color: #8d3348; background: #2c131b; color: #ffc1cd; }
.public-footer { padding: 20px; color: #65738b; text-align: center; font-size: 12px; }

/* Pure anonymous redemption */
.pure-redeem-page { background: radial-gradient(circle at 50% -16%, rgba(104, 120, 255, .14), transparent 34rem), #090d15; }
.pure-app { min-height: 100vh; display: flex; flex-direction: column; }
.pure-nav { width: min(940px, calc(100% - 40px)); margin: 0 auto; padding: 24px 0; display: flex; align-items: center; justify-content: space-between; }
.pure-mode { display: inline-flex; align-items: center; gap: 8px; color: #8f9db4; font-size: 12px; }
.pure-mode i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(54, 218, 160, .8); }
.pure-main { width: min(1080px, calc(100% - 40px)); flex: 1; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(430px, 520px); align-items: center; gap: 74px; padding: 52px 0 78px; }
.pure-intro { min-width: 0; }
.pure-intro h1 { max-width: 560px; margin: 14px 0 18px; font-size: clamp(46px, 7vw, 76px); line-height: 1.02; letter-spacing: -.055em; }
.pure-intro > p { max-width: 590px; margin: 0; color: #93a1b7; font-size: 16px; line-height: 1.85; }
.pure-flow { margin: 34px 0 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.pure-flow li { max-width: 600px; padding: 15px 17px; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 14px; align-items: start; border: 1px solid #232f41; border-radius: 12px; background: rgba(14, 21, 32, .62); }
.pure-flow b { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #344268; border-radius: 10px; background: #18213a; color: #94a2ff; font-size: 11px; }
.pure-flow strong, .pure-flow span { display: block; }
.pure-flow strong { color: #e4eaf5; font-size: 13px; }
.pure-flow span { margin-top: 5px; color: #76849a; font-size: 12px; line-height: 1.55; }
.pure-boundary { max-width: 600px; margin-top: 14px; padding: 15px 17px; border: 1px solid #4d3f25; border-radius: 12px; background: rgba(43, 31, 12, .45); }
.pure-boundary strong { display: block; color: #f0c36c; font-size: 12px; }
.pure-boundary p { margin: 5px 0 0; color: #9d8b6b; font-size: 11px; line-height: 1.65; }
.pure-card { width: 100%; padding: 42px; border: 1px solid #2b3649; border-radius: 20px; background: rgba(18, 25, 37, .94); box-shadow: 0 24px 80px rgba(0, 0, 0, .34); }
.pure-icon { width: 44px; height: 44px; margin-bottom: 24px; display: grid; place-items: center; border: 1px solid #2c8969; border-radius: 14px; background: #102b23; color: #68e9b7; font-size: 20px; font-weight: 900; }
.pure-card h2 { margin: 9px 0 10px; font-size: clamp(31px, 6vw, 42px); letter-spacing: -.045em; }
.pure-lead { margin: 0 0 26px; color: #93a1b7; line-height: 1.7; }
.pure-card form .primary-button, .pure-card form .secondary-button { margin-top: 16px; min-height: 48px; }
.pure-card input { height: 50px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .035em; }
.pure-card input[aria-invalid="true"] { border-color: #6f4350; }
.pure-format { display: block; margin-top: 7px; color: #66758a; font-size: 10px; }
.pure-query { margin-top: 22px; border-top: 1px solid #273245; }
.pure-query summary { padding: 18px 0 4px; color: #aeb9cb; cursor: pointer; font-size: 13px; font-weight: 750; }
.pure-query form { padding-top: 2px; }
.query-result { margin-top: 14px; padding: 14px; border: 1px solid #3e4c70; border-radius: 10px; background: #0d151f; }
.query-result > strong { display: block; color: #cfe9df; font-size: 13px; }
.query-result.error { border-color: #6b3d49; background: #24151b; }
.query-result.error > strong { color: #ffc3ce; }
.query-result dl { margin: 12px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px 14px; font-size: 11px; }
.query-result dt { color: #6e7c91; }
.query-result dd { margin: 0; color: #c6d1e2; text-align: right; overflow-wrap: anywhere; }
.pure-active { margin-top: 22px; padding: 16px; border: 1px solid #29384a; border-radius: 11px; background: #0d151f; }
.pure-active > span { display: block; margin-bottom: 9px; color: #718097; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.pure-active > div { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-top: 1px solid #1f2a38; }
.pure-active strong { color: #dfe7f5; font-size: 13px; }
.pure-active time { color: #72ddb5; font-size: 12px; }
.pure-details { margin-top: 22px; border-top: 1px solid #273245; }
.pure-details summary { padding: 18px 0 4px; color: #aeb9cb; cursor: pointer; font-size: 13px; font-weight: 750; }
.pure-subject { padding: 15px 0 5px; }
.pure-subject span, .pure-subject small { display: block; color: #74829a; font-size: 11px; }
.pure-subject code { display: block; margin: 7px 0; overflow-wrap: anywhere; color: #aeb9ff; font-size: 12px; }
.pure-history { margin: 12px 0 0; padding: 0; list-style: none; }
.pure-history li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 0; border-top: 1px solid #222d3e; }
.pure-history li strong, .pure-history li small { display: block; }
.pure-history li strong { font-size: 13px; }
.pure-history li small { margin-top: 4px; color: #68768c; font-size: 10px; }
.pure-empty { color: #6f7d93; font-size: 12px; }
.pure-privacy { margin: 22px 0 0; color: #64738a; font-size: 11px; line-height: 1.65; text-align: center; }
.pure-privacy span { margin-right: 4px; color: #54d4a3; font-size: 8px; }

/* Login */
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 30px; }
.login-panel { width: min(450px, 100%); padding: 38px; }
.login-panel .eyebrow { margin-top: 40px; }
.login-panel h1 { margin: 10px 0 8px; font-size: 34px; }
.login-panel > p { margin: 0 0 24px; color: var(--muted); line-height: 1.7; }
.login-panel .primary-button { margin-top: 22px; }
.back-link { display: block; margin-top: 22px; color: #91a0b8; font-size: 13px; }
.alert { margin: 18px 0; padding: 12px 14px; border-radius: 8px; }
.alert.error { border: 1px solid #7c3244; background: #2b141b; color: #ffbdca; }

/* Admin dashboard */
.admin-app { width: min(1500px, calc(100% - 40px)); margin: 0 auto; padding: 22px 0 72px; }
.admin-header { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-bottom: 20px; }
.admin-header h1 { margin: 7px 0 4px; font-size: 29px; letter-spacing: -.03em; }
.admin-header p { margin: 0; color: var(--muted); font-size: 13px; }
.admin-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.admin-actions form { margin: 0; }
.service-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 13px; border: 1px solid #2b374a; border-radius: 8px; background: #111823; color: #b8c5d8; font-size: 12px; }
.service-pill i { width: 8px; height: 8px; border-radius: 50%; background: #3ee0a1; box-shadow: 0 0 12px #3ee0a1; }
.connection-strip { min-height: 44px; padding: 0 15px; display: flex; align-items: center; gap: 10px; border: 1px solid #283449; border-radius: 10px; background: #141b27; color: #cbd5e7; }
.connection-strip small { margin-left: auto; color: #64748f; letter-spacing: .05em; }
.metric-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin: 16px 0; }
.metric-grid article { position: relative; min-height: 98px; padding: 17px; overflow: hidden; border: 1px solid #2c374b; border-radius: 11px; background: linear-gradient(145deg, #171f2d, #131a26); box-shadow: 0 12px 34px rgba(0, 0, 0, .12); }
.metric-grid article::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 2px; background: linear-gradient(var(--blue), transparent); }
.metric-grid article:nth-child(4)::before { background: linear-gradient(var(--amber), transparent); }
.metric-grid article:nth-child(5)::before { background: linear-gradient(var(--green), transparent); }
.metric-grid article:nth-child(6)::before { background: linear-gradient(#e56bb3, transparent); }
.metric-grid span { display: block; color: #8494ad; font-size: 12px; }
.metric-grid strong { display: block; margin-top: 8px; font-size: 28px; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr); gap: 14px; }
.dashboard-grid > *, .lower-grid > * { min-width: 0; }
.panel { border: 1px solid #2b364a; border-radius: 12px; background: #151c28; }
.workflow-panel { position: relative; min-height: 430px; padding: 24px; overflow: hidden; background: linear-gradient(130deg, #1b2437, #151c28 75%); }
.workflow-panel::after { content: ""; position: absolute; right: -70px; bottom: -100px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(98, 111, 255, .12), transparent 68%); }
.workflow-panel h2 { max-width: 760px; margin: 20px 0 10px; font-size: clamp(25px, 3vw, 38px); line-height: 1.18; letter-spacing: -.04em; }
.workflow-panel > p { max-width: 900px; color: #94a2b7; line-height: 1.75; }
.architecture-line { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 20px; padding: 14px; border: 1px solid #334159; border-radius: 9px; background: #0d1420; }
.architecture-line span { padding: 7px 9px; border: 1px solid #344158; border-radius: 6px; background: #141d2b; color: #dce4f4; font-size: 12px; font-weight: 750; }
.architecture-line b { color: #7586ff; }
.security-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.security-notes div { padding: 12px; border: 1px solid #2f3a50; border-radius: 8px; background: #101722; color: #8190a8; font-size: 12px; line-height: 1.65; }
.security-notes strong { color: #dce5f6; }
.step-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 16px; }
.step-grid article { min-height: 112px; padding: 14px; border: 1px solid #344056; border-radius: 9px; background: rgba(15, 22, 34, .8); }
.step-grid em { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-bottom: 15px; border-radius: 6px; background: #293260; color: #9fafff; font-size: 10px; font-style: normal; font-weight: 800; }
.step-grid strong, .step-grid span { display: block; }
.step-grid span { margin-top: 7px; color: #7f8da4; font-size: 12px; }
.quick-panel { padding: 22px; }
.panel-title-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.panel-title-row h2, .table-panel h2, .audit-panel h2 { margin: 5px 0 3px; }
.panel-title-row p, .panel-title-row > span { margin: 0; color: #8290a7; font-size: 12px; }
.badge { padding: 5px 8px; border: 1px solid #7b591f; border-radius: 6px; background: #2a1e08; color: #ffc860; font-size: 11px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.quick-panel .primary-button { margin-top: 16px; }
.quick-panel .success-button { margin-top: 10px; }
.generated-box { margin-top: 12px; padding: 12px; border: 1px dashed #3d4c66; border-radius: 9px; background: #0c131e; }
.generated-box > div { display: flex; justify-content: space-between; }
.generated-box textarea { min-height: 145px; margin-top: 10px; color: #b9c5ff; font: 12px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.generated-box p { margin: 8px 0 0; color: #f2bd55; font-size: 11px; }
.inventory-line { margin-top: 13px; color: #55d7a7; font-size: 12px; }
.password-panel { margin-top: 14px; padding-top: 13px; border-top: 1px solid #29354a; }
.password-panel summary { color: #aab7ca; cursor: pointer; font-size: 12px; font-weight: 750; }
.password-panel form { padding-top: 4px; }
.table-panel { margin-top: 14px; padding: 18px; }
.table-wrap { overflow-x: auto; margin-top: 14px; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: 12px 10px; border-bottom: 1px solid #263247; text-align: left; font-size: 12px; }
th { color: #7888a1; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
td { color: #c7d1e2; }
td code { color: #a7b3ff; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.empty-cell { padding: 30px; color: #6f7d93; text-align: center; }
.status { display: inline-flex; padding: 4px 7px; border: 1px solid #36445b; border-radius: 999px; color: #aebbd0; font-size: 10px; }
.status.available, .status.active { border-color: #27775d; background: #102b23; color: #67e7b5; }
.status.redeemed { border-color: #3f4e94; background: #191f43; color: #a8b3ff; }
.status.revoked { border-color: #7b3545; background: #2a151c; color: #ff9bad; }
.lower-grid { display: grid; grid-template-columns: 1.5fr .7fr; gap: 14px; }
.lower-grid.audit-only { grid-template-columns: 1fr; }
.audit-panel { margin-top: 14px; padding: 18px; }
.audit-panel ul { margin: 14px 0 0; padding: 0; list-style: none; }
.audit-panel li { display: flex; justify-content: space-between; gap: 15px; padding: 11px 0; border-bottom: 1px solid #263247; }
.audit-panel li span { color: #c3cedf; font-size: 12px; }
.audit-panel li small { color: #65738a; }

.member-app { width: min(1280px, calc(100% - 40px)); margin: 0 auto; padding: 22px 0 60px; }
.member-header .brand { margin-bottom: 24px; }
.member-grid { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); }
.redeem-member-panel { padding: 28px; }
.redeem-member-panel > p, .quick-panel > p { color: var(--muted); line-height: 1.65; }
.single-note { grid-template-columns: 1fr; margin-top: 22px; }
.member-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.member-summary article { min-height: 110px; }
.member-summary strong { font-size: 18px; }
.member-summary small, .metric-grid article > small { display: block; margin-top: 7px; color: #66758d; font-size: 11px; }
.empty-summary { grid-column: 1 / -1; }
.wide-auth { width: min(520px, 100%); }
.auth-switch { margin: 22px 0 10px !important; text-align: center; }
.auth-switch a { color: #82b7ff; }
.product-form { margin: 20px 0; }
.compact-table { max-height: 330px; }
.catalog-layout { display: grid; grid-template-columns: minmax(330px, .8fr) minmax(0, 1.2fr); gap: 22px; align-items: start; margin-top: 16px; }
.catalog-panel .product-form { margin: 0; padding: 18px; border: 1px solid #2b374b; border-radius: 10px; background: #111823; }
.catalog-panel .compact-table { max-height: 385px; margin-top: 0; }
.catalog-panel table { min-width: 620px; }
.sub-id { display: block; max-width: 240px; margin-top: 4px; overflow: hidden; color: #5f6d83; font-family: ui-monospace, monospace; font-size: 10px; text-overflow: ellipsis; }
.audit-panel li span small { display: block; margin-top: 4px; }
.audit-panel li time { flex: none; color: #65738a; font-size: 11px; }
.status.disabled, .status.expired { border-color: #7b3545; background: #2a151c; color: #ff9bad; }

/* Tutorial-inspired entitlement console */
.console-page { background: #f4f6fa; color: #202839; color-scheme: light; }
.console-shell { width: 100%; max-width: none; min-height: 100vh; margin: 0; padding: 0; display: grid; grid-template-columns: 248px minmax(0, 1fr); background: #f4f6fa; }
.console-sidebar { position: sticky; top: 0; height: 100vh; padding: 24px 18px 18px; display: flex; flex-direction: column; overflow-y: auto; background: #101522; color: #eef2ff; }
.console-brand { display: flex; align-items: center; gap: 12px; padding: 2px 8px 24px; border-bottom: 1px solid rgba(255,255,255,.08); }
.console-brand > span:last-child { display: grid; gap: 2px; }
.console-brand strong { font-size: 15px; letter-spacing: .06em; }
.console-brand small { color: #667086; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.console-nav { display: grid; gap: 5px; margin-top: 22px; }
.console-nav-label { margin: 16px 10px 6px; color: #59647a; font-size: 9px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.console-nav a { min-height: 42px; padding: 0 11px; display: flex; align-items: center; gap: 11px; border: 1px solid transparent; border-radius: 8px; color: #8d98ad; font-size: 12px; font-weight: 700; transition: .16s ease; }
.console-nav a:hover { background: rgba(255,255,255,.045); color: #e5eaff; }
.console-nav a.active { border-color: rgba(107,124,255,.24); background: linear-gradient(90deg, rgba(102,118,255,.2), rgba(102,118,255,.06)); color: #f2f4ff; }
.console-nav b { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 6px; background: rgba(255,255,255,.06); color: #7d8bff; font-size: 9px; }
.console-nav a.active b { background: #6474ef; color: white; }
.console-sidebar-foot { margin-top: auto; padding: 18px 4px 0; border-top: 1px solid rgba(255,255,255,.08); }
.console-health { display: flex; align-items: center; gap: 10px; }
.console-health i { width: 8px; height: 8px; border-radius: 50%; background: #2bd99f; box-shadow: 0 0 12px rgba(43,217,159,.7); }
.console-health span { display: grid; gap: 2px; }
.console-health strong { font-size: 11px; }
.console-health small { color: #657187; font-size: 9px; }
.console-password { margin-top: 14px; }
.console-password summary { color: #6e7a91; cursor: pointer; font-size: 10px; }
.console-password form { padding-top: 5px; }
.console-password label { color: #8995a9; font-size: 10px; }
.console-password input { height: 38px; border-color: #2a3445; background: #171d2a; color: white; }
.sidebar-button { width: 100%; height: 36px; margin-top: 12px; border: 1px solid #35425a; border-radius: 7px; background: #20293a; color: #cbd3e5; cursor: pointer; font-size: 11px; font-weight: 700; }
.console-main { min-width: 0; padding: 0 34px 42px; }
.console-topbar { min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #e2e6ed; }
.console-breadcrumb { color: #8992a3; font-size: 10px; font-weight: 750; }
.console-topbar h1 { margin: 6px 0 3px; color: #171e2d; font-size: 25px; letter-spacing: -.035em; }
.console-topbar p { margin: 0; color: #8a93a4; font-size: 11px; }
.console-actions { display: flex; align-items: center; gap: 8px; }
.console-actions form { margin: 0; }
.console-link-button, .console-icon-button { min-height: 38px; border: 1px solid #dce1e9; border-radius: 8px; background: white; color: #39445a; box-shadow: 0 2px 8px rgba(29,42,70,.04); font-size: 11px; font-weight: 750; cursor: pointer; }
.console-link-button { padding: 0 14px; display: inline-flex; align-items: center; }
.console-icon-button { min-width: 38px; padding: 0 11px; }
.console-icon-button.logout { color: #ca5268; }
.console-section { scroll-margin-top: 18px; margin-top: 26px; }
.console-section-head { min-height: 46px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
.console-section-head span, .console-panel-head > div > span { color: #6a78ee; font-size: 9px; font-weight: 850; letter-spacing: .13em; }
.console-section-head h2, .console-panel-head h2 { margin: 4px 0 0; color: #1d2535; font-size: 17px; letter-spacing: -.02em; }
.console-section-head small { color: #9aa2b1; font-size: 10px; }
.console-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.console-metrics article { position: relative; min-height: 132px; padding: 18px; overflow: hidden; border: 1px solid #e1e5ec; border-radius: 11px; background: white; box-shadow: 0 7px 24px rgba(31,43,68,.045); }
.console-metrics article > span { display: block; margin-top: 16px; color: #798396; font-size: 10px; font-weight: 700; }
.console-metrics article > strong { display: block; margin-top: 2px; color: #172031; font-size: 26px; letter-spacing: -.04em; }
.console-metrics article > small { position: absolute; right: 16px; bottom: 17px; color: #a2a9b7; font-size: 9px; }
.metric-icon { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 8px; font-size: 11px; font-weight: 900; }
.metric-icon.blue { background: #e9efff; color: #5270df; }
.metric-icon.violet { background: #f0ebff; color: #795fe2; }
.metric-icon.green { background: #e4f8f1; color: #1d9f75; }
.metric-icon.amber { background: #fff2d9; color: #c88517; }
.metric-icon.teal { background: #e4f8f6; color: #168b82; }
.metric-icon.rose { background: #ffebef; color: #ce5970; }
.console-workspace { display: grid; grid-template-columns: minmax(360px, .85fr) minmax(0, 1.15fr); gap: 14px; }
.console-panel { min-width: 0; border: 1px solid #e0e5ec; border-radius: 11px; background: white; box-shadow: 0 7px 28px rgba(31,43,68,.045); }
.issue-panel, .flow-panel, .product-console-panel, .console-table-panel, .console-audit { padding: 20px; }
.console-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.console-panel-head p { margin: 5px 0 0; color: #8a94a6; font-size: 10px; line-height: 1.6; }
.console-panel-head em, .soft-badge { flex: none; padding: 6px 9px; border: 1px solid #f0d9a8; border-radius: 6px; background: #fff8e9; color: #b27a19; font-size: 9px; font-style: normal; font-weight: 750; }
.console-form label { margin: 13px 0 6px; color: #606b7d; font-size: 10px; }
.console-shell input, .console-shell select, .console-shell textarea { border-color: #d9dfe8; background: #f9fafc; color: #202a3b; }
.console-shell input:focus, .console-shell select:focus, .console-shell textarea:focus { border-color: #7887f4; background: white; }
.console-form .primary-button { margin-top: 16px; min-height: 42px; border: 0; border-radius: 7px; }
.console-generated { border-color: #d7dce7; background: #f7f8fb; }
.console-generated textarea { color: #4656bd; }
.console-generated p { color: #b17a19; }
.console-flow { position: relative; margin: 21px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; }
.console-flow::before { content: ""; position: absolute; left: 10%; right: 10%; top: 17px; height: 1px; background: #dfe4ec; }
.console-flow li { position: relative; padding: 0 9px; text-align: center; }
.console-flow li > b { position: relative; width: 34px; height: 34px; margin: 0 auto 13px; display: grid; place-items: center; border: 4px solid white; border-radius: 50%; background: #6878ed; color: white; box-shadow: 0 0 0 1px #d9deea; font-size: 10px; z-index: 1; }
.console-flow strong, .console-flow span { display: block; }
.console-flow strong { color: #3b4557; font-size: 10px; }
.console-flow span { margin-top: 5px; color: #929aa9; font-size: 9px; line-height: 1.5; }
.console-scope { margin-top: 20px; padding: 11px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; border: 1px dashed #d9dee7; border-radius: 8px; background: #fafbfc; }
.console-scope strong { color: #a3aab7; font-size: 9px; }
.console-scope span { padding: 4px 7px; border-radius: 5px; background: #eef1f5; color: #8992a2; font-size: 9px; text-decoration: line-through; }
.console-table-panel { margin-top: 26px; }
.console-shell .table-wrap { margin-top: 16px; }
.console-shell table { min-width: 760px; }
.console-shell th, .console-shell td { border-bottom-color: #edf0f4; color: #526074; }
.console-shell th { color: #929cab; background: #fafbfc; }
.console-shell td code { color: #5365d3; }
.console-shell .text-button { color: #5f70de; }
.console-shell .text-button.danger { color: #d3546b; }
.console-shell .status { border-color: #dbe0e8; background: #f4f6f9; color: #788394; }
.console-shell .status.available, .console-shell .status.active { border-color: #bce8d8; background: #eaf9f3; color: #218763; }
.console-shell .status.redeemed { border-color: #cdd5ff; background: #edf0ff; color: #5e6fd0; }
.console-shell .status.revoked, .console-shell .status.disabled, .console-shell .status.expired { border-color: #f1c6cf; background: #fff0f3; color: #c7546a; }
.inventory-summary { display: grid; justify-items: end; }
.inventory-summary strong { color: #27324a; font-size: 25px; }
.inventory-summary span { color: #939cac; font-size: 9px; }
.inventory-search { margin-top: 17px; display: grid; grid-template-columns: minmax(220px, 1fr) 170px 150px auto auto; gap: 8px; align-items: center; }
.inventory-search input, .inventory-search select { height: 40px; }
.inventory-search .secondary-button { min-height: 40px; border-color: #d7dde7; background: #f7f8fb; color: #465269; }
.inventory-search > span { color: #8e97a6; font-size: 10px; text-align: right; }
.category-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border: 1px solid #cfd6ff; border-radius: 999px; background: #eef0ff; color: #5262c9; font-size: 9px; font-weight: 800; white-space: nowrap; }
.category-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #6474ef; }
.batch-id { color: #7b879b !important; font-size: 9px; }
.category-options { grid-template-columns: 1fr 1fr; }
.product-console-grid { display: grid; grid-template-columns: minmax(350px, .8fr) minmax(0, 1.2fr); gap: 22px; margin-top: 17px; }
.product-form-card { padding: 17px; border: 1px solid #e4e8ee; border-radius: 9px; background: #fafbfc; }
.product-console-grid .compact-table { max-height: 380px; margin-top: 0; }
.table-subtext { display: block; max-width: 280px; margin-top: 3px; overflow: hidden; color: #9aa3b2; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.subject-cell { display: inline-block; max-width: 210px; overflow: hidden; font-family: ui-monospace, monospace; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.console-bottom-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr); gap: 14px; }
.console-bottom-grid.audit-only { grid-template-columns: 1fr; }
.console-audit ul { margin: 15px 0 0; padding: 0; list-style: none; }
.console-audit li { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 3px; border-bottom: 1px solid #edf0f4; }
.console-audit li > i { width: 7px; height: 7px; border-radius: 50%; background: #7584ed; }
.console-audit li div { display: grid; gap: 3px; }
.console-audit li strong { color: #475267; font-size: 10px; }
.console-audit li span, .console-audit li time { color: #98a1af; font-size: 9px; }
.console-footer { margin-top: 28px; color: #a0a8b5; font-size: 9px; text-align: center; }

@media (max-width: 1180px) {
  .console-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .console-workspace, .product-console-grid { grid-template-columns: 1fr; }
  .inventory-search { grid-template-columns: minmax(220px, 1fr) 1fr 1fr auto; }
  .inventory-search > span { grid-column: 1 / -1; text-align: left; }
}

@media (max-width: 900px) {
  .pure-main { width: min(680px, calc(100% - 32px)); grid-template-columns: 1fr; gap: 38px; padding-top: 30px; }
  .pure-intro h1 { font-size: clamp(44px, 11vw, 68px); }
  .pure-intro > p, .pure-flow li, .pure-boundary { max-width: none; }
  .console-shell { display: block; }
  .console-sidebar { position: static; width: 100%; height: auto; padding-bottom: 14px; }
  .console-brand { padding-bottom: 15px; }
  .console-nav { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; }
  .console-nav-label, .console-sidebar-foot { display: none; }
  .console-nav a { flex: none; min-height: 36px; }
  .console-main { padding: 0 18px 36px; }
  .console-topbar { min-height: 96px; }
  .console-bottom-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .console-topbar { align-items: flex-start; flex-direction: column; padding: 18px 0; }
  .console-actions { width: 100%; }
  .console-link-button { flex: 1; justify-content: center; }
  .console-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .console-flow { grid-template-columns: 1fr 1fr; gap: 18px 0; }
  .console-flow::before { display: none; }
  .console-panel-head { align-items: flex-start; flex-direction: column; }
  .inventory-summary { justify-items: start; }
  .inventory-search { grid-template-columns: 1fr; }
  .inventory-search > span { grid-column: auto; }
  .category-options { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .member-app { width: min(100% - 24px, 1180px); }
  .member-grid { grid-template-columns: 1fr; }
  .member-summary { grid-template-columns: 1fr; }
}
.toast { position: fixed; right: 22px; bottom: 22px; max-width: 380px; padding: 13px 16px; border: 1px solid #3d4b65; border-radius: 9px; background: #121a27; color: #e6edfa; box-shadow: var(--shadow); z-index: 50; }
.toast.error { border-color: #853c4e; background: #2b161d; color: #ffc3ce; }

@media (max-width: 1060px) {
  .metric-grid { grid-template-columns: repeat(3, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .lower-grid { grid-template-columns: 1fr; }
  .redeem-shell { grid-template-columns: 1fr; gap: 45px; }
  .redeem-copy { padding-top: 30px; }
  .catalog-layout { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .admin-app, .public-nav, .redeem-shell { width: min(100% - 24px, 1180px); }
  .admin-header { align-items: flex-start; flex-direction: column; }
  .admin-actions { justify-content: flex-start; }
  .connection-strip small { display: none; }
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .security-notes, .step-grid { grid-template-columns: 1fr 1fr; }
  .redeem-copy h1 { font-size: 49px; }
  .redeem-card { padding: 24px; }
}

@media (max-width: 460px) {
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-grid article { min-height: 82px; padding: 14px; }
  .security-notes, .step-grid, .form-row { grid-template-columns: 1fr; }
  .public-nav .ghost-button { padding: 0 10px; }
  .redeem-copy h1 { font-size: 42px; }
  .pure-nav { width: min(100% - 24px, 940px); }
  .pure-main { width: min(100% - 24px, 680px); padding-top: 14px; }
  .pure-intro h1 { font-size: 44px; }
  .pure-intro > p { font-size: 14px; }
  .pure-flow li { padding: 13px; }
  .pure-card { padding: 28px 22px; border-radius: 16px; }
  .pure-active > div { align-items: flex-start; flex-direction: column; gap: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}