:root {
  --ink: #171927;
  --muted: #666b7c;
  --subtle: #8b90a1;
  --page: #f7f8fb;
  --panel: #fff;
  --line: #e5e7ef;
  --blue: #4568f2;
  --blue-dark: #3149c9;
  --purple: #8455e9;
  --green: #25935f;
  --green-soft: #eaf8f0;
  --danger: #c74343;
  --danger-soft: #fff0f0;
  --paper: #f5ead7;
  --paper-card: #fffaf0;
  --paper-line: #cbb497;
  --coral: #a93a28;
  --sage: #315b45;
  --yellow: #efc45a;
  --shadow-sm: 0 8px 24px rgba(35, 42, 74, .07);
  --shadow-lg: 0 24px 70px rgba(40, 49, 91, .13);
  --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--page); }
body { margin: 0; min-width: 320px; overflow-x: clip; color: var(--ink); background: var(--page); font-family: 'DM Sans', 'Noto Sans SC', system-ui, sans-serif; }
[hidden] { display: none !important; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
:focus-visible { outline: 3px solid rgba(69, 104, 242, .35); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 999; padding: 10px 14px; border-radius: 8px; color: white; background: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

/* Public marketing site — intentionally isolated from the console. */
.marketing-site { min-height: 100vh; background: white; }
.marketing-site h1, .marketing-site h2, .marketing-site h3 { font-family: 'Noto Serif SC', serif; }
.marketing-container { width: min(1140px, calc(100% - 48px)); margin-inline: auto; }
.marketing-nav { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(229, 231, 239, .9); background: rgba(255, 255, 255, .9); backdrop-filter: blur(14px); }
.nav-inner { min-height: 76px; display: flex; align-items: center; gap: 30px; }
.marketing-brand, .auth-brand, .console-brand { display: inline-flex; align-items: center; gap: 11px; }
.brand-stamp { width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; color: white; background: linear-gradient(145deg, var(--blue), var(--purple)); font-family: 'Noto Serif SC', serif; font-weight: 900; box-shadow: 0 7px 17px rgba(83, 91, 220, .25); }
.marketing-brand strong, .marketing-brand small, .auth-brand strong, .auth-brand small, .console-brand strong, .console-brand small { display: block; }
.marketing-brand strong { font-family: 'Noto Serif SC', serif; font-size: 18px; }
.marketing-brand small { margin-top: 1px; color: var(--subtle); font-size: 10px; }
.marketing-menu { margin-left: auto; display: flex; align-items: center; gap: 30px; color: #555a6d; font-size: 14px; font-weight: 600; }
.marketing-menu > a:not(.paper-button):hover { color: var(--blue); }
.marketing-menu-button { display: none; margin-left: auto; border: 0; background: transparent; font-weight: 700; cursor: pointer; }
.paper-button { min-height: 50px; padding: 0 22px; border: 1px solid transparent; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 800; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.paper-button:hover { transform: translateY(-2px); }
.paper-button.small { min-height: 42px; padding-inline: 17px; }
.paper-button.coral { color: white; background: linear-gradient(115deg, var(--blue), var(--purple)); box-shadow: 0 12px 28px rgba(86, 81, 218, .24); }
.paper-button.outline { border-color: #d8dbea; color: #373b51; background: white; }
.paper-button.yellow-button { color: #20233b; background: white; box-shadow: 0 12px 35px rgba(28, 24, 66, .18); }

.marketing-hero { position: relative; overflow: hidden; padding: 102px 0 116px; background: radial-gradient(circle at 80% 20%, rgba(132, 85, 233, .12), transparent 33%), radial-gradient(circle at 15% 80%, rgba(69, 104, 242, .1), transparent 34%), linear-gradient(180deg, #fff 0%, #f8f9fd 100%); }
.marketing-hero::before { content: ''; position: absolute; inset: 0; opacity: .25; background-image: radial-gradient(#99a2c5 1px, transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(to bottom, transparent, black 25%, transparent 80%); pointer-events: none; }
.hero-layout { position: relative; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(420px, .97fr); align-items: center; gap: 76px; }
.scribble-label, .section-number { margin: 0 0 18px; color: var(--blue); font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 800; letter-spacing: 1.7px; text-transform: uppercase; }
.hero-copy h1 { max-width: 720px; margin: 0; font-size: clamp(44px, 5.4vw, 70px); line-height: 1.13; letter-spacing: -3.8px; }
.hero-copy h1 em { color: transparent; background: linear-gradient(105deg, var(--blue), var(--purple)); background-clip: text; -webkit-background-clip: text; font-style: normal; }
.hero-lead { max-width: 670px; margin: 27px 0 0; color: #5e6374; font-size: 17px; line-height: 1.9; }
.hero-actions { margin-top: 34px; display: flex; align-items: center; gap: 26px; }
.text-arrow { color: #43485a; font-size: 14px; font-weight: 700; }
.text-arrow:hover { color: var(--blue); }
.trust-list { margin: 29px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 18px; list-style: none; color: #5d6274; font-size: 12px; }
.trust-list li { display: flex; align-items: center; gap: 7px; }
.trust-list span { width: 19px; height: 19px; border-radius: 50%; display: grid; place-items: center; color: var(--green); background: var(--green-soft); font-weight: 900; }

.project-paper { min-height: 440px; padding: 36px; border: 1px solid #dbcbb4; border-radius: 25px; position: relative; background: var(--paper-card); box-shadow: 18px 22px 0 rgba(219, 205, 181, .38), var(--shadow-lg); transform: rotate(1.4deg); }
.paper-tape { width: 110px; height: 31px; position: absolute; top: -16px; left: 50%; background: rgba(239, 196, 90, .65); transform: translateX(-50%) rotate(-3deg); }
.project-paper-head { padding-bottom: 25px; border-bottom: 2px solid var(--paper-line); display: flex; align-items: center; gap: 14px; }
.project-icon { width: 51px; height: 51px; border: 2px solid #241d18; border-radius: 14px; display: grid; place-items: center; color: white; background: var(--sage); font-weight: 800; }
.project-paper-head p { margin: 0 0 3px; color: #826e59; font-size: 9px; font-weight: 800; letter-spacing: 1px; }
.project-paper-head h2 { margin: 0; font-size: 21px; }
.review-stamp { margin-left: auto; padding: 7px 10px; border: 2px solid var(--coral); border-radius: 6px; color: var(--coral); font-size: 11px; font-weight: 900; transform: rotate(-6deg); }
.brief-line { padding: 20px 0; border-bottom: 1px dashed var(--paper-line); display: grid; gap: 7px; }
.brief-line span { color: #8b765e; font-size: 10px; font-weight: 700; }
.brief-line strong { font-family: 'Noto Serif SC', serif; font-size: 15px; }
.channel-notes { padding: 24px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.note { min-height: 76px; padding: 13px; border: 1px solid rgba(36, 29, 24, .15); border-radius: 9px; font-size: 10px; line-height: 1.65; transform: rotate(-1deg); }
.note b { font-size: 12px; }.note.yellow { background: #f8dc91; }.note.sage { color: white; background: #52745f; transform: rotate(1deg); }.note.coral-note { color: white; background: #c36351; }
.paper-footer { display: flex; justify-content: space-between; gap: 14px; color: #7f6b56; font-size: 10px; }.paper-footer strong { color: #241d18; }

.marketing-section { padding: 112px 0; }
.workflow-section, .services-section { background: white; }
.section-intro h2, .comparison-copy h2, .faq-layout h2 { margin: 0; font-size: clamp(34px, 4vw, 50px); line-height: 1.25; letter-spacing: -2px; }
.split-intro { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 70px; }
.split-intro > p, .centered > p, .comparison-copy > p, .faq-layout > div > p { margin: 0; color: var(--muted); line-height: 1.85; }
.steps-grid, .service-grid { margin-top: 58px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.paper-card { border: 1px solid var(--line); border-radius: 21px; background: white; box-shadow: var(--shadow-sm); }
.step-card { min-height: 380px; padding: 31px; position: relative; transition: transform .2s ease, box-shadow .2s ease; }
.step-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.step-card.featured { border-color: rgba(69, 104, 242, .38); background: linear-gradient(155deg, #fff, #f5f3ff); }
.step-index { position: absolute; top: 25px; right: 27px; color: #c2c6d2; font-weight: 800; }
.step-symbol { width: 58px; height: 58px; margin-bottom: 27px; border-radius: 17px; display: grid; place-items: center; color: white; background: linear-gradient(145deg, var(--blue), var(--purple)); font-size: 24px; box-shadow: 0 11px 25px rgba(80, 90, 220, .2); }
.step-card h3 { margin: 0; font-size: 24px; }.step-card > p { min-height: 82px; color: var(--muted); line-height: 1.75; font-size: 14px; }
.step-card ul, .service-card ul, .auth-aside ul { margin: 20px 0 0; padding: 0; display: grid; gap: 10px; list-style: none; color: #555a6c; font-size: 13px; }
.step-card li::before, .service-card li::before, .auth-aside li::before { content: '✓'; margin-right: 8px; color: var(--green); font-weight: 900; }

.comparison-section { background: var(--page); }
.comparison-layout { display: grid; grid-template-columns: .72fr 1.28fr; align-items: center; gap: 80px; }
.comparison-copy { position: relative; }.comparison-copy > p { margin-top: 24px; }.margin-note { display: inline-block; margin-top: 30px; padding: 12px 18px; border-radius: 10px; color: #6c5260; background: var(--paper); font-family: 'Noto Serif SC', serif; font-size: 13px; transform: rotate(-2deg); }
.comparison-board { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow-lg); }
.comparison-row { display: grid; grid-template-columns: .7fr 1fr 1.15fr; }.comparison-row > * { min-width: 0; padding: 22px 20px; border-bottom: 1px solid var(--line); font-style: normal; font-size: 13px; line-height: 1.5; }
.comparison-row > :not(:last-child) { border-right: 1px solid var(--line); }.comparison-row span { color: #44495d; font-weight: 700; }.comparison-row em { color: #8b8f9d; }.comparison-row b { color: var(--green); background: #f5fbf8; }
.comparison-head > * { color: #4d5265 !important; background: #f5f6fa !important; font-size: 11px; text-transform: uppercase; letter-spacing: .6px; }

.capability-strip { padding: 72px 0; color: white; background: linear-gradient(120deg, #3d5bea, #7e4ce1); }
.capability-strip .section-number { color: #dce2ff; }.capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); }.capability-grid > div { padding: 12px 30px; border-left: 1px solid rgba(255, 255, 255, .22); }.capability-grid > div:first-child { border-left: 0; padding-left: 0; }
.capability-grid strong, .capability-grid span { display: block; }.capability-grid strong { font-family: 'Noto Serif SC', serif; font-size: 45px; }.capability-grid strong small { margin-left: 4px; font-family: inherit; font-size: 15px; }.capability-grid span { margin-top: 7px; color: #dce2ff; font-size: 12px; }
.capability-footnote { margin: 26px 0 0; color: #d2d9ff; font-size: 11px; }

.centered { max-width: 720px; margin: 0 auto; text-align: center; }.centered > p { margin-top: 17px; }
.service-card { min-height: 460px; padding: 34px; display: flex; flex-direction: column; position: relative; }.service-card.recommended { border: 2px solid var(--blue); box-shadow: 0 20px 50px rgba(69, 104, 242, .15); transform: translateY(-10px); }
.recommend-tag { position: absolute; top: 0; right: 24px; padding: 7px 13px; border-radius: 0 0 9px 9px; color: white; background: linear-gradient(115deg, var(--blue), var(--purple)); font-size: 11px; font-weight: 800; }.plan-label { margin: 0; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }.service-card h3 { margin: 12px 0 0; font-size: 27px; }.plan-price { margin: 25px 0 12px; color: var(--ink) !important; font-family: 'Noto Serif SC', serif; font-size: 20px !important; font-weight: 800; }.service-card > p:not(.plan-label):not(.plan-price) { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }.service-card ul { margin-bottom: 28px; }.service-card .paper-button { width: 100%; margin-top: auto; }

.faq-section { background: var(--page); }.faq-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: 90px; }.faq-layout > div > p { margin-top: 24px; }.faq-list { border-top: 1px solid #dfe1e9; }.faq-list details { border-bottom: 1px solid #dfe1e9; }.faq-list summary { padding: 24px 4px; display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; font-family: 'Noto Serif SC', serif; font-size: 16px; font-weight: 700; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { color: var(--blue); font-family: sans-serif; font-size: 25px; font-weight: 400; transition: transform .2s ease; }.faq-list details[open] summary span { transform: rotate(45deg); }.faq-list details p { max-width: 670px; margin: -7px 0 24px; padding-right: 35px; color: var(--muted); font-size: 13px; line-height: 1.8; }
.final-cta { padding: 85px 0; background: white; }.cta-paper { padding: 50px 56px; border-radius: 25px; display: flex; align-items: center; justify-content: space-between; gap: 30px; color: white; background: linear-gradient(120deg, #3d5bea, #8652e3); box-shadow: var(--shadow-lg); }.cta-paper .scribble-label { color: #dce1ff; }.cta-paper h2 { margin: 0; font-size: clamp(28px, 4vw, 43px); }
.marketing-footer { padding: 65px 0 25px; color: #d6d8e2; background: #171927; }.inverse strong { color: white; }.inverse small { color: #979cac; }.footer-grid { display: grid; grid-template-columns: 1fr 1.2fr 1fr; align-items: start; gap: 40px; }.footer-grid > p { margin: 5px 0 0; color: #9da1af; font-size: 13px; }.footer-grid nav { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 22px; font-size: 12px; }.footer-grid nav a:hover { color: white; }.footer-bottom { margin-top: 50px; padding-top: 20px; border-top: 1px solid #2d3040; display: flex; justify-content: space-between; color: #777c8c; font-size: 10px; }.footer-legal { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px 18px; }.footer-legal a { color: #aeb2c0; transition: color .18s ease; }.footer-legal a:hover { color: white; }

/* Auth */
.auth-root { min-height: 100vh; background: radial-gradient(circle at 15% 15%, rgba(69,104,242,.12), transparent 28%), linear-gradient(145deg, #f8f9fd, #f2f0fb); }
.auth-layout { width: min(1050px, calc(100% - 48px)); min-height: 100vh; margin: 0 auto; padding: 34px 0; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 80px; position: relative; }.auth-brand { position: absolute; top: 34px; left: 0; }.auth-brand strong { font-family: 'Noto Serif SC', serif; font-size: 18px; }.auth-brand small { color: var(--subtle); font-size: 10px; }
.auth-paper { max-width: 490px; padding: 46px; border: 1px solid var(--line); border-radius: 24px; position: relative; background: white; box-shadow: var(--shadow-lg); }.auth-paper-clip { width: 25px; height: 65px; position: absolute; top: -17px; right: 38px; border: 3px solid #9398aa; border-radius: 20px; transform: rotate(5deg); }.auth-paper h1 { margin: 0; font-family: 'Noto Serif SC', serif; font-size: 36px; }.auth-paper > p:not(.section-number):not(.auth-switch) { color: var(--muted); line-height: 1.7; }.auth-paper form { margin-top: 28px; display: grid; gap: 20px; }.auth-submit { width: 100%; border: 0; }.auth-switch { margin: 22px 0 0; color: var(--muted); text-align: center; font-size: 13px; }.auth-switch a { color: var(--blue); font-weight: 700; }
.password-field { position: relative; }.password-field input { padding-right: 70px !important; }.password-field button { height: 32px; padding: 0 10px; border: 0; border-radius: 8px; position: absolute; top: 7px; right: 7px; color: var(--blue); background: #eef1ff; font-size: 11px; font-weight: 700; cursor: pointer; }.auth-aside blockquote { margin: 18px 0 35px; font-family: 'Noto Serif SC', serif; font-size: 31px; line-height: 1.55; }.auth-aside > p { color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: 1.5px; }.auth-aside ul { color: #555b70; font-size: 14px; }
.form-alert { padding: 12px 14px; border: 1px solid #efbcbc; border-radius: 10px; color: var(--danger); background: var(--danger-soft); font-size: 12px; line-height: 1.6; }.form-alert.warning { margin-bottom: 20px; border-color: #ead398; color: #765510; background: #fff8df; }

/* Console — all layout selectors are console-specific. */
.console-shell { min-height: 100vh; display: grid; grid-template-columns: 244px minmax(0, 1fr); background: var(--page); }
.console-sidebar { height: 100vh; padding: 25px 19px 19px; position: sticky; top: 0; z-index: 40; display: flex; flex-direction: column; color: #f7f8ff; background: #1c2138; }.console-brand { padding: 0 8px 28px; }.console-brand-mark { width: 41px; height: 41px; border-radius: 12px; display: grid; place-items: center; color: white; background: linear-gradient(145deg, var(--blue), var(--purple)); font-family: 'Noto Serif SC', serif; font-weight: 900; }.console-brand strong { font-family: 'Noto Serif SC', serif; font-size: 17px; }.console-brand small { margin-top: 2px; color: #979db5; font-size: 10px; }
.console-nav { display: grid; gap: 6px; }.console-nav a { padding: 12px 13px; border-radius: 10px; display: flex; align-items: center; gap: 11px; color: #abb0c4; font-size: 13px; font-weight: 600; transition: .18s ease; }.console-nav a span { width: 22px; text-align: center; }.console-nav a:hover { color: white; background: rgba(255,255,255,.07); }.console-nav a.active { color: white; background: linear-gradient(110deg, rgba(69,104,242,.9), rgba(132,85,233,.9)); }
.console-sidebar-foot { margin-top: auto; display: grid; gap: 11px; }.wallet-peek { padding: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.05); }.wallet-peek span, .wallet-peek strong { display: block; }.wallet-peek span { color: #9fa5bc; font-size: 10px; }.wallet-peek strong { margin-top: 5px; font-size: 18px; }.safety-note { padding: 12px; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; display: flex; gap: 10px; background: rgba(255,255,255,.04); }.safety-note strong, .safety-note small { display: block; }.safety-note strong { font-size: 12px; }.safety-note small { margin-top: 2px; color: #949bb3; font-size: 10px; }.status-dot { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: #67d99a; box-shadow: 0 0 0 4px rgba(103,217,154,.12); }.link-button { padding: 3px 6px; border: 0; color: #959bb3; background: transparent; text-align: left; font-size: 11px; cursor: pointer; }.logout-link { color: #e5a9a9; }
.console-main { min-width: 0; }.console-topbar { min-height: 104px; padding: 22px clamp(22px, 4vw, 54px); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 20px; background: rgba(247,248,251,.9); backdrop-filter: blur(13px); }.console-topbar h1 { margin: 2px 0 0; font-family: 'Noto Serif SC', serif; font-size: clamp(25px,3vw,33px); letter-spacing: -1px; }.eyebrow, .console-hero-kicker { margin: 0; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: 1.7px; }.topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 9px; }.mobile-menu { display: none; border: 0; background: transparent; font-size: 20px; cursor: pointer; }.connection-pill { padding: 8px 10px; border: 1px solid var(--line); border-radius: 99px; display: inline-flex; align-items: center; gap: 7px; color: var(--muted); background: white; font-size: 11px; }.connection-pill span { width: 7px; height: 7px; border-radius: 50%; background: #d5a947; }.connection-pill.online span { background: var(--green); }.connection-pill.offline span { background: var(--danger); }
#app { padding: 31px clamp(22px,4vw,54px) 60px; }.page-stack { display: grid; gap: 22px; }.section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; }.section-head h2 { margin: 0; font-family: 'Noto Serif SC', serif; font-size: 20px; }.section-head p, .panel-head p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.button { min-height: 39px; padding: 0 15px; border: 1px solid transparent; border-radius: 10px; font-size: 12px; font-weight: 700; cursor: pointer; transition: .18s ease; }.button:hover { transform: translateY(-1px); }.button:disabled { opacity: .5; cursor: not-allowed; transform: none; }.button.primary { color: white; background: linear-gradient(110deg, var(--blue), #6358db); box-shadow: 0 8px 20px rgba(69,104,242,.2); }.button.secondary { border-color: #cfd6f7; color: var(--blue-dark); background: #f5f7ff; }.button.ghost { border-color: var(--line); color: var(--ink); background: white; }.button.danger { color: var(--danger); background: var(--danger-soft); }.button.small { min-height: 32px; padding-inline: 10px; font-size: 11px; }
.console-hero { min-height: 185px; padding: 30px; border-radius: 21px; display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; color: white; background: linear-gradient(120deg, #344fd2, #7550d4); box-shadow: var(--shadow-lg); }.console-hero-kicker { color: #d9deff; }.console-hero h2 { margin: 7px 0 11px; max-width: 590px; font-family: 'Noto Serif SC', serif; font-size: clamp(25px,4vw,39px); line-height: 1.2; }.console-hero p { max-width: 600px; margin: 0; color: #dce0fa; font-size: 13px; line-height: 1.7; }.console-hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.console-hero-stats > div { padding: 17px; border: 1px solid rgba(255,255,255,.13); border-radius: 14px; background: rgba(255,255,255,.09); }.console-hero-stats span, .console-hero-stats strong { display: block; }.console-hero-stats span { color: #d8dcf5; font-size: 10px; }.console-hero-stats strong { margin-top: 7px; font-size: 22px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 13px; }.metric-card, .panel, .account-card, .task-row { border: 1px solid var(--line); background: white; box-shadow: var(--shadow-sm); }.metric-card { padding: 19px; border-radius: 15px; }.metric-icon { float: right; width: 33px; height: 33px; border-radius: 9px; display: grid; place-items: center; color: var(--blue); background: #eef1ff; }.metric-label { color: var(--muted); font-size: 11px; font-weight: 600; }.metric-value { margin: 9px 0 2px; font-size: 28px; font-weight: 700; }.metric-hint { color: var(--subtle); font-size: 10px; }
.split-grid { display: grid; grid-template-columns: 1.4fr .7fr; gap: 17px; }.panel { overflow: hidden; border-radius: 16px; }.panel-head { padding: 19px 21px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }.panel-head h3 { margin: 0; font-size: 14px; }.panel-body { padding: 19px 21px; }.activity-list,.task-list,.account-grid,.order-list { display: grid; gap: 11px; }.activity-item { padding: 12px 0; border-bottom: 1px solid #eff0f4; display: grid; grid-template-columns: 33px minmax(0,1fr) auto; align-items: center; gap: 11px; }.activity-item:last-child { border-bottom: 0; }.activity-icon { width: 33px; height: 33px; border-radius: 9px; display: grid; place-items: center; color: var(--green); background: var(--green-soft); }.activity-item strong,.activity-item small { display: block; }.activity-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.activity-item small { margin-top: 3px; color: var(--muted); font-size: 10px; }.text-link { color: var(--blue); font-weight: 700; font-size: 11px; }
.badge { padding: 5px 8px; border-radius: 99px; display: inline-flex; font-size: 9px; font-weight: 800; letter-spacing: .3px; }.badge.success,.badge.enabled,.badge.succeeded,.badge.paid { color: #17734a; background: var(--green-soft); }.badge.failed,.badge.disabled,.badge.closed,.badge.cancelled { color: var(--danger); background: var(--danger-soft); }.badge.running,.badge.queued,.badge.pending,.badge.created { color: #916714; background: #fff6dd; }.badge.dry_run { color: #5c4ab4; background: #efedff; }
.account-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.account-card { padding: 19px; border-radius: 16px; }.account-card-top { display: flex; align-items: start; gap: 11px; }.avatar { width: 41px; height: 41px; flex: none; border-radius: 12px; display: grid; place-items: center; color: white; background: linear-gradient(140deg,var(--blue),var(--purple)); font-weight: 800; }.account-card h3 { margin: 1px 0 3px; font-size: 14px; }.account-card p,.task-row p { margin: 0; color: var(--muted); font-size: 10px; }.account-card .badge { margin-left: auto; }.account-metrics { margin: 19px 0; display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; }.account-metrics div { padding: 10px 7px; border-radius: 9px; background: #f7f8fb; text-align: center; }.account-metrics strong,.account-metrics span { display: block; }.account-metrics strong { font-size: 15px; }.account-metrics span { margin-top: 3px; color: var(--muted); font-size: 8px; }.card-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.task-row { padding: 17px 19px; border-radius: 14px; display: grid; grid-template-columns: minmax(170px,1.2fr) minmax(155px,.8fr) minmax(130px,.65fr) auto; align-items: center; gap: 14px; }.task-row h3 { margin: 0 0 6px; font-size: 14px; }.task-meta { display: flex; flex-wrap: wrap; gap: 5px; }.chip { padding: 5px 7px; border: 1px solid var(--line); border-radius: 7px; color: #606577; background: #fafbfc; font-size: 9px; }
.filters { padding: 15px; border: 1px solid var(--line); border-radius: 14px; display: flex; flex-wrap: wrap; align-items: end; gap: 11px; background: white; }.field { display: grid; gap: 7px; }.field label { color: #505568; font-size: 10px; font-weight: 700; }.field input,.field textarea,.field select { width: 100%; min-height: 44px; padding: 9px 11px; border: 1px solid #d9dce6; border-radius: 9px; color: var(--ink); background: white; outline: none; }.field textarea { min-height: 84px; resize: vertical; }.field input:focus,.field textarea:focus,.field select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(69,104,242,.12); }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.form-grid .wide { grid-column: 1/-1; }.check-field { min-height: 38px; display: flex; align-items: center; gap: 8px; font-size: 11px; }.check-field input { width: 16px; height: 16px; accent-color: var(--blue); }.help { margin: 4px 0 0; color: var(--subtle); font-size: 9px; line-height: 1.5; }
.table-wrap { overflow-x: auto; }.table-wrap table { width: 100%; min-width: 780px; border-collapse: collapse; }th { padding: 11px 13px; color: #777c8e; background: #f7f8fb; text-align: left; font-size: 9px; text-transform: uppercase; }td { padding: 13px; border-top: 1px solid #eeeeF3; font-size: 11px; }td .title-cell { max-width: 230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600;}td .comment-cell{max-width:310px;color:#515667;line-height:1.5}.pagination{padding:13px 17px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:flex-end;gap:8px}
.empty { padding: 43px 22px; text-align:center; color:var(--muted); }.empty-icon{width:51px;height:51px;margin:0 auto 13px;border-radius:15px;display:grid;place-items:center;color:var(--blue);background:#eef1ff;font-size:20px}.empty h3{margin:0 0 5px;color:var(--ink);font-size:14px}.empty p{margin:0 0 16px;font-size:11px}.loading{height:230px;display:grid;place-items:center;color:var(--muted);font-size:12px}.spinner{width:23px;height:23px;border:3px solid #dce0ea;border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}

.wallet-hero { min-height: 155px; padding: 28px 31px; border-radius: 19px; display:flex;align-items:center;justify-content:space-between;color:white;background:linear-gradient(115deg,#3150d5,#7551d7);box-shadow:var(--shadow-lg)}.wallet-hero h2{margin:7px 0 2px;font-size:38px}.wallet-hero p{margin:0;color:#d9defb;font-size:11px}.wallet-mark{width:75px;height:75px;border:1px solid rgba(255,255,255,.2);border-radius:22px;display:grid;place-items:center;background:rgba(255,255,255,.1);font-size:34px;font-weight:700}.recharge-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.amount-options{margin:0 0 20px;padding:0;border:0;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.amount-options legend{margin-bottom:8px;color:#505568;font-size:10px;font-weight:700}.amount-options input{position:absolute;opacity:0}.amount-options label>span{padding:13px 8px;border:1px solid var(--line);border-radius:10px;display:grid;text-align:center;cursor:pointer}.amount-options input:checked+span{border-color:var(--blue);background:#f2f4ff;box-shadow:0 0 0 2px rgba(69,104,242,.12)}.amount-options b,.amount-options small{display:block}.amount-options b{font-size:16px}.amount-options small{margin-top:3px;color:var(--muted);font-size:8px}.money-input{position:relative}.money-input>span{position:absolute;left:12px;top:12px;color:var(--muted)}.money-input input{padding-left:29px}.recharge-submit{width:100%;margin-top:16px}.payment-note{margin:13px 0 0;color:var(--subtle);font-size:9px;line-height:1.6}.order-row{padding:13px 0;border-bottom:1px solid #eff0f4;display:flex;align-items:center;justify-content:space-between;gap:15px}.order-row:last-child{border-bottom:0}.order-row strong,.order-row small{display:block}.order-row strong{font-size:16px}.order-row small{margin-top:4px;color:var(--muted);font-size:9px}.return-notice{padding:16px 18px;border:1px solid #cdd5ff;border-radius:14px;display:flex;align-items:center;gap:14px;color:#394260;background:#f2f5ff}.return-notice .spinner{flex:none}.return-notice strong{font-size:13px}.return-notice p{margin:3px 0 0;color:#68708a;font-size:10px;line-height:1.5}

.modal-root:empty{display:none}.modal-root{position:fixed;inset:0;z-index:100}.modal-backdrop{position:absolute;inset:0;padding:22px;display:grid;place-items:center;background:rgba(15,18,31,.53);backdrop-filter:blur(4px)}.modal{width:min(680px,100%);max-height:calc(100vh - 44px);overflow:auto;border-radius:18px;background:white;box-shadow:0 30px 80px rgba(0,0,0,.24)}.modal-head{padding:21px 23px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px}.modal-head h2{margin:0;font-size:18px}.modal-head p{margin:5px 0 0;color:var(--muted);font-size:10px}.icon-button{width:33px;height:33px;border:0;border-radius:9px;background:#f1f2f6;cursor:pointer}.modal-body{padding:21px 23px}.modal-actions{padding:16px 23px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px}.toast-region{position:fixed;right:22px;bottom:22px;z-index:200;display:grid;gap:8px}.toast{min-width:240px;max-width:350px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:white;box-shadow:var(--shadow-lg);font-size:11px;animation:toast-in .2s ease}.toast.error{border-color:#efc4c4;color:var(--danger)}.toast.success{border-color:#b9dfcc;color:var(--green)}@keyframes toast-in{from{transform:translateY(7px);opacity:0}}

@media (max-width: 1050px) {
  .hero-layout { grid-template-columns: 1fr 400px; gap: 45px; }.hero-copy h1 { font-size: 52px; }.comparison-layout { gap: 45px; }.metric-grid { grid-template-columns: repeat(2,1fr); }.account-grid { grid-template-columns: repeat(2,1fr); }.split-grid { grid-template-columns:1fr; }
}
@media (max-width: 800px) {
  .marketing-container { width: min(100% - 36px, 620px); }.marketing-menu-button { display:block; }.marketing-menu { width:calc(100% - 36px); padding:16px; border:1px solid var(--line);border-radius:14px;position:absolute;top:68px;left:18px;display:none;align-items:stretch;gap:6px;background:white;box-shadow:var(--shadow-lg)}.marketing-menu.open{display:grid}.marketing-menu a{padding:10px 12px}.marketing-menu .paper-button{margin-top:5px}.marketing-hero{padding:72px 0 88px}.hero-layout{grid-template-columns:1fr;gap:65px}.hero-copy h1{font-size:clamp(39px,11vw,55px);letter-spacing:-2.5px}.project-paper{width:min(480px,92%);margin:0 auto}.split-intro,.comparison-layout,.faq-layout,.footer-grid,.auth-layout{grid-template-columns:1fr;gap:45px}.steps-grid,.service-grid{grid-template-columns:1fr;max-width:560px;margin-inline:auto}.step-card{min-height:0}.service-card{min-height:420px}.service-card.recommended{transform:none}.comparison-copy{max-width:600px}.capability-grid{grid-template-columns:repeat(2,1fr);gap:25px}.capability-grid>div:nth-child(3){padding-left:0;border-left:0}.cta-paper{padding:38px;display:grid}.footer-grid nav{justify-content:flex-start}.auth-layout{padding:110px 0 50px;align-items:start}.auth-paper{max-width:none}.auth-aside{display:none}
  .console-shell{display:block}.console-sidebar{width:244px;position:fixed;transform:translateX(-100%);transition:.2s ease;box-shadow:15px 0 40px rgba(0,0,0,.22)}.console-sidebar.open{transform:translateX(0)}.console-topbar{min-height:86px;padding:17px 18px}.mobile-menu{display:block}.topbar-actions .connection-pill,.topbar-actions .ghost{display:none}#app{padding:23px 17px 45px}.console-hero{grid-template-columns:1fr}.account-grid{grid-template-columns:1fr}.task-row{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.recharge-grid{grid-template-columns:1fr}
}
@media (max-width: 520px) {
  .marketing-container{width:calc(100% - 28px)}.nav-inner{min-height:68px}.marketing-brand small{display:none}.marketing-section{padding:78px 0}.marketing-hero{padding-top:55px}.hero-copy h1{font-size:39px;line-height:1.2}.hero-lead{font-size:15px}.hero-actions{align-items:stretch;display:grid;gap:17px}.text-arrow{text-align:center}.trust-list{display:grid;gap:9px}.project-paper{width:94%;min-height:0;padding:25px;box-shadow:10px 12px 0 rgba(219,205,181,.38),var(--shadow-lg)}.review-stamp{display:none}.channel-notes{grid-template-columns:1fr}.note{min-height:0}.paper-footer{display:grid}.section-intro h2,.comparison-copy h2,.faq-layout h2{font-size:33px}.split-intro{gap:25px}.steps-grid,.service-grid{margin-top:38px}.comparison-row{min-width:590px}.comparison-board{overflow-x:auto}.capability-grid{grid-template-columns:1fr 1fr;gap:19px}.capability-grid>div{padding:6px 14px}.capability-grid strong{font-size:35px}.cta-paper{padding:31px 24px}.footer-bottom{display:grid;gap:9px}.auth-layout{width:calc(100% - 28px)}.auth-paper{padding:32px 22px}.auth-paper h1{font-size:30px}
  .console-topbar h1{font-size:21px}.topbar-actions .button{padding-inline:10px}.console-hero{padding:23px}.console-hero-stats{grid-template-columns:1fr 1fr}.metric-grid{grid-template-columns:1fr}.section-head{align-items:stretch;display:grid}.amount-options{grid-template-columns:1fr}.modal-backdrop{padding:10px}.modal{max-height:calc(100vh - 20px)}.modal-body,.modal-head,.modal-actions{padding-left:17px;padding-right:17px}.toast-region{right:12px;bottom:12px;left:12px}.toast{min-width:0;max-width:none}.card-actions .button{flex:1 1 auto}
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }*,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}
