:root {
  --bg: #080b10;
  --bg-elevated: #0d1119;
  --panel: rgba(17, 22, 32, 0.88);
  --panel-solid: #111620;
  --panel-2: #161c28;
  --line: rgba(169, 181, 205, 0.14);
  --line-strong: rgba(169, 181, 205, 0.24);
  --text: #f4f6fb;
  --muted: #8c96aa;
  --soft: #bac2d1;
  --neon: #73f593;
  --neon-strong: #43e86e;
  --neon-ink: #06100a;
  --violet: #9d7cff;
  --cyan: #56d7ff;
  --amber: #ffcb6b;
  --danger: #ff6b7a;
  --success: #73f593;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
  --radius: 18px;
  --radius-sm: 11px;
  --sidebar: 250px;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; color-scheme: dark; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--bg); color: var(--text); font-family: var(--sans); line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.sidebar-open { overflow: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -2; background: radial-gradient(circle at 15% -5%, rgba(94, 72, 190, .23), transparent 36%), radial-gradient(circle at 88% 18%, rgba(41, 173, 93, .12), transparent 31%), linear-gradient(180deg, #0d0f18 0, var(--bg) 44%); }
.noise { position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .18; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button, select { cursor: pointer; }
button:disabled { cursor: not-allowed; }
img, svg { display: block; max-width: 100%; }
::selection { background: rgba(115, 245, 147, .28); color: #fff; }
:focus-visible { outline: 2px solid var(--neon); outline-offset: 3px; }
.container { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(160deg, rgba(21, 27, 39, .92), rgba(12, 16, 24, .9)); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--neon); font: 700 11px/1.2 var(--mono); letter-spacing: .17em; text-transform: uppercase; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 15px var(--neon); animation: pulse 2s ease-in-out infinite; }
.status-dot.off { background: var(--danger); box-shadow: 0 0 15px rgba(255,107,122,.6); }
@keyframes pulse { 50% { opacity: .55; transform: scale(.8); } }

.button { min-height: 44px; border: 1px solid transparent; border-radius: 12px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; color: var(--text); background: transparent; font-weight: 750; transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease, opacity .2s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: var(--neon-ink); background: linear-gradient(135deg, var(--neon), #4bdd79); border-color: rgba(115,245,147,.65); box-shadow: 0 12px 34px rgba(67,232,110,.18), inset 0 1px rgba(255,255,255,.3); }
.button-primary:hover { box-shadow: 0 15px 42px rgba(67,232,110,.3), inset 0 1px rgba(255,255,255,.3); }
.button-ghost { background: rgba(255,255,255,.025); border-color: var(--line-strong); }
.button-ghost:hover { border-color: rgba(115,245,147,.45); background: rgba(115,245,147,.06); }
.button-danger { color: #ffdce0; border-color: rgba(255,107,122,.36); background: rgba(255,107,122,.1); }
.button-large { min-height: 54px; padding-inline: 26px; border-radius: 14px; }
.button-small { min-height: 36px; padding-inline: 14px; border-radius: 9px; font-size: 13px; }
.button:disabled { opacity: .42; transform: none; box-shadow: none; }
.icon-button { width: 38px; height: 38px; padding: 0; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--soft); background: rgba(255,255,255,.025); }
.icon-button:hover { color: var(--text); border-color: var(--line-strong); }
.text-button { padding: 0; border: 0; background: none; color: var(--muted); font-size: 12px; }
.text-button:hover { color: var(--neon); }

.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(115,245,147,.4); border-radius: 11px; background: rgba(115,245,147,.08); color: var(--neon); box-shadow: inset 0 0 22px rgba(115,245,147,.05); }
.brand-mark svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.brand-name { font: 800 23px/1 var(--mono); letter-spacing: .08em; }
.brand-name span { color: var(--neon); }
.brand-small .brand-name { font-size: 18px; }

.site-header { position: sticky; top: 0; z-index: 40; padding-top: env(safe-area-inset-top); border-bottom: 1px solid rgba(169,181,205,.08); background: rgba(8,11,16,.74); backdrop-filter: blur(24px); }
.header-inner { min-height: 74px; display: flex; align-items: center; justify-content: space-between; }
.site-nav { display: flex; align-items: center; gap: 27px; color: var(--soft); font-size: 14px; }
.site-nav > a:not(.button):hover { color: var(--text); }
.mobile-menu-button { display: none; }
.mobile-menu-button span { width: 16px; height: 1px; background: currentColor; margin: 2px; }
.mobile-menu { position: fixed; z-index: 39; top: calc(74px + env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: #111620; box-shadow: var(--shadow); }
.mobile-menu a { display: block; padding: 13px; border-radius: 9px; color: var(--soft); }
.mobile-menu a:hover { background: rgba(255,255,255,.04); color: var(--text); }

.hero { position: relative; overflow: hidden; padding: 108px 0 96px; }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .2; background-image: linear-gradient(rgba(124,135,160,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(124,135,160,.13) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, #000, transparent 85%); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 70px; }
.hero h1 { margin: 22px 0 23px; max-width: 710px; font-size: clamp(48px, 6.1vw, 82px); line-height: .98; letter-spacing: -.055em; }
.hero h1 span { background: linear-gradient(90deg, var(--neon), var(--cyan)); color: transparent; background-clip: text; -webkit-background-clip: text; }
.hero-lead { max-width: 650px; margin: 0; color: var(--soft); font-size: 18px; line-height: 1.75; }
.hero-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }
.hero-trust { margin-top: 31px; display: flex; flex-wrap: wrap; gap: 22px; color: var(--muted); font-size: 13px; }
.hero-trust b { color: var(--text); }
.hero-visual { position: relative; }
.terminal-card { overflow: hidden; transform: perspective(1100px) rotateY(-4deg) rotateX(2deg); border: 1px solid rgba(147,158,183,.2); border-radius: 19px; background: rgba(12,16,24,.93); box-shadow: 0 42px 90px rgba(0,0,0,.5), 0 0 70px rgba(107,80,224,.1); }
.terminal-top { height: 45px; padding: 0 15px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid var(--line); color: var(--muted); font: 600 10px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.terminal-lights { display: flex; gap: 6px; }
.terminal-lights i { width: 7px; height: 7px; border-radius: 50%; background: #3a4150; }
.terminal-lights i:first-child { background: var(--danger); }.terminal-lights i:nth-child(2) { background: var(--amber); }.terminal-lights i:last-child { background: var(--neon); }
.live-pill { justify-self: end; color: var(--neon); }
.terminal-body { padding: 23px; }
.input-preview { padding: 15px; border: 1px solid var(--line); border-radius: 11px; background: #0a0e15; }
.preview-label { color: var(--violet); font: 700 11px/1.45 var(--mono); letter-spacing: .15em; }
.input-preview p { margin: 8px 0 0; color: var(--soft); font: 12px/1.6 var(--mono); }
.mutation-line { display: grid; grid-template-columns: 28px 1fr; gap: 12px; padding: 17px 0; border-bottom: 1px solid rgba(169,181,205,.09); }
.mutation-line > span { color: var(--neon); font: 700 10px var(--mono); }
.mutation-line b { display: block; font-size: 12px; line-height: 1.5; }
.mutation-line small { display: block; margin-top: 5px; color: var(--muted); font: 11px/1.5 var(--mono); }
.scan-progress { height: 3px; margin-top: 18px; overflow: hidden; border-radius: 4px; background: rgba(255,255,255,.05); }
.scan-progress i { display: block; width: 72%; height: 100%; background: linear-gradient(90deg, var(--violet), var(--neon)); box-shadow: 0 0 12px var(--neon); animation: scan 3s ease-in-out infinite; }
@keyframes scan { 50% { width: 96%; } }
.terminal-footer { display: flex; justify-content: space-between; padding-top: 11px; color: var(--muted); font: 11px/1.45 var(--mono); }
.floating-chip { position: absolute; z-index: 2; padding: 9px 12px; border: 1px solid rgba(115,245,147,.25); border-radius: 9px; background: rgba(11,15,22,.94); color: var(--neon); font: 700 11px/1.4 var(--mono); letter-spacing: .12em; box-shadow: var(--shadow); }
.chip-one { top: 18%; right: -28px; }.chip-two { bottom: 13%; left: -30px; color: var(--cyan); border-color: rgba(86,215,255,.25); }
.signal-strip { overflow: hidden; border-block: 1px solid var(--line); background: rgba(255,255,255,.018); }
.signal-track { width: max-content; min-width: 100%; min-height: 53px; display: flex; align-items: center; justify-content: space-around; gap: 36px; padding: 0 25px; color: var(--muted); font: 700 11px var(--mono); letter-spacing: .16em; }
.signal-track i { color: var(--neon); font-style: normal; }
.section { padding: 110px 0; }
.section-heading { max-width: 690px; margin-bottom: 46px; }
.section-heading.centered, .workspace-heading.centered { margin-inline: auto; text-align: center; }
.section-heading h2, .final-cta h2 { margin: 13px 0 15px; font-size: clamp(34px, 5vw, 54px); line-height: 1.07; letter-spacing: -.04em; }
.section-heading p { margin: 0; color: var(--muted); font-size: 17px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.feature-card { position: relative; overflow: hidden; min-height: 280px; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(20,26,38,.78), rgba(10,14,21,.88)); transition: transform .25s ease, border-color .25s ease; }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(115,245,147,.26); }
.feature-wide { grid-column: span 2; }
.feature-index { position: absolute; top: 20px; right: 22px; color: rgba(255,255,255,.18); font: 700 11px var(--mono); }
.feature-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(115,245,147,.25); border-radius: 13px; background: rgba(115,245,147,.06); color: var(--neon); font: 700 13px var(--mono); }
.feature-card h3 { margin: 35px 0 11px; font-size: 21px; }
.feature-card p { max-width: 570px; margin: 0; color: var(--muted); }
.country-pills, .mini-history { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.country-pills span, .mini-history span { padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--soft); background: rgba(255,255,255,.02); font: 700 10px var(--mono); }
.mini-history span { color: var(--muted); }

/* Control Plane roadmap */
.control-plane-section { position: relative; overflow: hidden; border-block: 1px solid rgba(169,181,205,.08); background: radial-gradient(circle at 12% 22%, rgba(151,116,255,.10), transparent 30%), radial-gradient(circle at 90% 32%, rgba(67,232,110,.08), transparent 27%), #090d14; }
.control-plane-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .16; background-image: linear-gradient(rgba(124,135,160,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(124,135,160,.12) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, #000, transparent 72%); }
.control-plane-section > .container { position: relative; }
.control-plane-head { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 56px; align-items: end; }
.control-plane-head .section-heading { max-width: 770px; margin-bottom: 0; }
.control-plane-head h2 span { background: linear-gradient(90deg, var(--neon), var(--cyan)); color: transparent; background-clip: text; -webkit-background-clip: text; }
.roadmap-note { padding: 19px; display: grid; grid-template-columns: auto 1fr; gap: 13px; border: 1px solid rgba(255,203,107,.23); border-radius: 14px; background: rgba(255,203,107,.055); box-shadow: inset 0 1px rgba(255,255,255,.03); }
.roadmap-note b { display: block; color: var(--amber); font-size: 13px; }
.roadmap-note p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.build-dot { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 15px rgba(255,203,107,.55); }
.build-dot.live { background: var(--neon); box-shadow: 0 0 15px rgba(115,245,147,.65); }
.control-spotlight { margin-top: 46px; padding: 34px; display: grid; grid-template-columns: .76fr 1.24fr; gap: 42px; border: 1px solid rgba(115,245,147,.25); border-radius: 24px; background: linear-gradient(145deg, rgba(19,27,36,.96), rgba(9,13,20,.96)); box-shadow: 0 32px 90px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.03); }
.control-copy h3, .control-card h3 { margin: 24px 0 10px; font-size: 25px; letter-spacing: -.02em; }
.control-copy > p, .control-card > p { margin: 0; color: var(--muted); }
.control-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.control-number { color: rgba(255,255,255,.28); font: 700 10px var(--mono); letter-spacing: .08em; }
.roadmap-badge { padding: 5px 8px; border: 1px solid rgba(86,215,255,.25); border-radius: 999px; color: var(--cyan); background: rgba(86,215,255,.055); font: 700 10px/1.35 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.roadmap-badge.priority { color: var(--neon); border-color: rgba(115,245,147,.3); background: rgba(115,245,147,.06); }
.roadmap-badge.later { color: var(--muted); border-color: var(--line); background: rgba(255,255,255,.02); }
.control-icon { width: 49px; height: 49px; margin-top: 27px; display: grid; place-items: center; border: 1px solid rgba(115,245,147,.27); border-radius: 13px; color: var(--neon); background: rgba(115,245,147,.06); font: 800 11px var(--mono); letter-spacing: -.03em; }
.control-list { margin: 22px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.control-list li { color: var(--soft); font-size: 13px; }
.control-list li::before { content: "✓"; margin-right: 9px; color: var(--neon); }
.control-output { margin-top: 24px; padding-top: 17px; border-top: 1px solid var(--line); color: var(--soft); font-size: 12px; line-height: 1.6; }
.control-output span { display: block; margin-bottom: 4px; color: var(--neon); font: 700 10px/1.4 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.link-audit { align-self: stretch; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 16px; background: #0a0e15; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.audit-top { min-height: 47px; padding: 0 17px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .1em; }
.audit-top i { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 12px rgba(115,245,147,.7); }
.audit-top b { color: var(--neon); font-size: 10px; }
.link-flow { padding: 24px 18px 21px; display: grid; grid-template-columns: repeat(9, auto); align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--line); }
.link-flow > div { min-width: 74px; display: grid; gap: 4px; }
.link-flow > i { color: rgba(115,245,147,.6); font-style: normal; }
.link-flow small { color: var(--muted); font: 700 10px/1.4 var(--mono); }
.link-flow b { color: var(--soft); font: 700 11px/1.4 var(--mono); }
.link-flow span { width: max-content; font: 700 10px/1.4 var(--mono); }
.audit-ok { color: var(--neon); }.audit-warn { color: var(--amber); }.audit-alert { color: var(--danger); }
.audit-result-grid { padding: 17px; display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.audit-result-grid > div { min-height: 125px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.018); }
.audit-result-grid span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .08em; }
.audit-result-grid strong { display: block; margin: 15px 0 5px; font-size: 12px; }
.audit-result-grid > div:first-child strong { color: var(--danger); }
.audit-result-grid > div:nth-child(2) strong { color: var(--neon); }
.audit-result-grid > div:last-child strong { color: var(--amber); }
.audit-result-grid p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.audit-footer { padding: 0 17px 16px; display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font: 700 10px/1.4 var(--mono); }
.control-grid { margin-top: 16px; display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.control-card { min-height: 360px; padding: 26px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(19,25,36,.86), rgba(9,13,20,.93)); transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.control-card:hover { transform: translateY(-4px); border-color: rgba(115,245,147,.25); background: linear-gradient(145deg, rgba(23,31,42,.94), rgba(10,14,21,.96)); }
.control-card .control-output { margin-top: auto; padding-top: 19px; }
.control-cta { margin-top: 16px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 40px; border: 1px solid rgba(115,245,147,.22); border-radius: 20px; background: radial-gradient(circle at 87% 50%, rgba(115,245,147,.10), transparent 28%), rgba(16,22,31,.9); }
.control-cta h3 { margin: 7px 0 6px; font-size: 23px; }
.control-cta p { margin: 0; color: var(--muted); font-size: 13px; }
.roadmap-kicker { color: var(--neon); font: 700 11px/1.4 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.workflow-section { border-block: 1px solid rgba(169,181,205,.07); background: linear-gradient(180deg, rgba(151,116,255,.03), transparent); }
.workflow-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; counter-reset: step; }
.workflow-grid article { min-height: 230px; padding: 29px; border-left: 1px solid var(--line); }
.workflow-grid article:last-child { border-right: 1px solid var(--line); }
.workflow-grid span { color: var(--neon); font: 700 11px var(--mono); }
.workflow-grid h3 { margin: 61px 0 11px; font-size: 20px; }
.workflow-grid p { margin: 0; color: var(--muted); }
.pricing-section { background: radial-gradient(circle at 50% 50%, rgba(79,221,116,.06), transparent 43%); }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: stretch; }
.price-card { position: relative; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(160deg, rgba(20,26,38,.9), rgba(10,14,21,.96)); }
.price-card.featured { border-color: rgba(115,245,147,.45); box-shadow: 0 24px 80px rgba(67,232,110,.08); transform: translateY(-7px); }
.price-badge { position: absolute; top: 17px; right: 17px; padding: 5px 8px; border-radius: 6px; color: var(--neon-ink); background: var(--neon); font: 800 10px/1.35 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.price-card h3 { margin: 0 0 22px; font-size: 19px; }
.price { display: flex; align-items: baseline; gap: 8px; }.price strong { font-size: 48px; letter-spacing: -.05em; }.price span { color: var(--muted); }
.price-card > p { min-height: 48px; color: var(--muted); }
.price-card ul { margin: 24px 0; padding: 0; list-style: none; }.price-card li { margin: 10px 0; color: var(--soft); font-size: 14px; }.price-card li::before { content: "✓"; margin-right: 9px; color: var(--neon); }
.price-card .button { width: 100%; }
.credit-amount { margin: 20px 0; padding: 15px; display: flex; align-items: baseline; gap: 8px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }.credit-amount b { font-size: 25px; }.credit-amount span { color: var(--muted); font-size: 13px; }
.final-cta { margin-bottom: 110px; padding: 56px; display: flex; align-items: center; justify-content: space-between; gap: 40px; border: 1px solid rgba(115,245,147,.22); border-radius: 24px; background: radial-gradient(circle at 90% 50%, rgba(115,245,147,.09), transparent 34%), linear-gradient(135deg, #141a25, #0b0f16); box-shadow: var(--shadow); }
.final-cta h2 { max-width: 700px; margin-bottom: 8px; }.final-cta p { margin: 0; color: var(--muted); }
.site-footer { border-top: 1px solid var(--line); padding: 45px 0; color: var(--muted); }
.footer-grid { display: flex; align-items: center; justify-content: space-between; gap: 30px; }.footer-grid p { margin: 12px 0 0; font-size: 13px; }.footer-links { display: flex; flex-wrap: wrap; gap: 22px; font-size: 13px; }.footer-links a:hover { color: var(--text); }
.reveal { animation: reveal .65s both ease-out; }.reveal-delay { animation-delay: .12s; } @keyframes reveal { from { opacity: 0; transform: translateY(18px); } }

/* Authentication */
.auth-page, .center-page { min-height: calc(100vh - 74px); display: grid; place-items: center; padding: 60px 20px; position: relative; overflow: hidden; }
.auth-glow { position: absolute; width: 600px; height: 600px; border-radius: 50%; background: rgba(115,245,147,.08); filter: blur(120px); }
.auth-card { position: relative; width: min(450px, 100%); padding: 38px; border: 1px solid var(--line); border-radius: 21px; background: rgba(14,18,27,.94); box-shadow: var(--shadow); }
.auth-brand { justify-content: center; width: 100%; }.auth-heading { margin: 32px 0 25px; text-align: center; }.auth-heading h1 { margin: 0 0 7px; font-size: 30px; }.auth-heading p { margin: 0; color: var(--muted); }
.stack-form { display: grid; gap: 16px; }.stack-form label:not(.check-label) { display: grid; gap: 7px; }.stack-form label > span, .form-grid label > span, .admin-plan-card label > span { color: var(--soft); font-size: 12px; font-weight: 700; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: #0b0f16; transition: border-color .2s ease, box-shadow .2s ease; }
input, select { height: 46px; padding: 0 13px; } textarea { min-height: 140px; padding: 15px; line-height: 1.65; resize: vertical; }
input:hover, textarea:hover, select:hover { border-color: var(--line-strong); } input:focus, textarea:focus, select:focus { outline: none; border-color: rgba(115,245,147,.55); box-shadow: 0 0 0 3px rgba(115,245,147,.08); }
input:disabled { color: var(--muted); background: rgba(255,255,255,.02); }
.form-row { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--muted); font-size: 12px; }.form-row a, .auth-switch a, .check-label a { color: var(--neon); }
.check-label { display: inline-flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 9px !important; color: var(--muted); font-size: 12px; }.check-label input { appearance: none; width: 17px; height: 17px; padding: 0; display: grid; place-content: center; border-radius: 5px; }.check-label input:checked { border-color: var(--neon); background: var(--neon); }.check-label input:checked::after { content: "✓"; color: var(--neon-ink); font-size: 12px; font-weight: 900; }
.auth-divider { margin: 24px 0 17px; display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 11px; }.auth-divider::before,.auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.telegram-hint, .auth-switch { margin: 0; color: var(--muted); text-align: center; font-size: 12px; }.auth-switch { margin-top: 22px; }
.error-card { max-width: 520px; text-align: center; }.error-code { color: var(--neon); font: 800 90px/1 var(--mono); }.error-card h1 { font-size: 32px; }.error-card p { color: var(--muted); }

/* Application shell */
.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) 1fr; }
.app-sidebar { position: sticky; top: 0; height: 100vh; padding: calc(21px + env(safe-area-inset-top)) max(17px, env(safe-area-inset-right)) calc(21px + env(safe-area-inset-bottom)) max(17px, env(safe-area-inset-left)); display: flex; flex-direction: column; border-right: 1px solid var(--line); background: rgba(10,13,20,.94); backdrop-filter: blur(22px); z-index: 30; }
.sidebar-brand { padding: 4px 7px 24px; }.sidebar-brand .brand-name { font-size: 18px; }.sidebar-brand .brand-mark { width: 34px; height: 34px; }
.app-nav { display: grid; gap: 5px; }.app-nav a { min-height: 45px; padding: 0 13px; display: flex; align-items: center; gap: 12px; border-radius: 10px; color: var(--muted); font-size: 13px; font-weight: 650; }.app-nav a span { width: 18px; color: var(--soft); text-align: center; }.app-nav a:hover { color: var(--text); background: rgba(255,255,255,.035); }.app-nav a.active { color: var(--text); background: rgba(115,245,147,.08); box-shadow: inset 2px 0 var(--neon); }.app-nav a.active span { color: var(--neon); }
.sidebar-bottom { margin-top: auto; display: grid; gap: 14px; }.credit-widget { padding: 15px; display: grid; grid-template-columns: 1fr auto; gap: 8px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, rgba(115,245,147,.07), rgba(255,255,255,.02)); }.credit-widget > span { color: var(--muted); font-size: 11px; }.credit-widget strong { font-size: 15px; }.credit-widget strong i { color: var(--neon); font-style: normal; }.credit-widget a { grid-column: 1/-1; color: var(--neon); font-size: 11px; }
.sidebar-user { display: grid; grid-template-columns: 37px 1fr auto; align-items: center; gap: 10px; }.sidebar-user div:nth-child(2) { min-width: 0; }.sidebar-user b,.sidebar-user span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.sidebar-user b { font-size: 12px; }.sidebar-user span { color: var(--muted); font-size: 11px; }.sidebar-user form { margin: 0; }
.user-avatar { width: 37px; height: 37px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(115,245,147,.26); border-radius: 50%; color: var(--neon); background: rgba(115,245,147,.08); font-weight: 800; }.user-avatar.small { width: 34px; height: 34px; font-size: 12px; }
.app-main { min-width: 0; }.app-topbar { position: sticky; top: 0; z-index: 20; min-height: calc(65px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) max(27px, env(safe-area-inset-right)) 0 max(27px, env(safe-area-inset-left)); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(8,11,16,.82); backdrop-filter: blur(22px); }.app-breadcrumb { font-size: 12px; font-weight: 700; }.breadcrumb-muted { color: var(--muted); font-weight: 500; }.topbar-actions { display: flex; align-items: center; gap: 12px; }.credit-badge { height: 35px; padding: 0 12px; display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.025); font-size: 12px; }.credit-badge span { color: var(--neon); }.credit-badge small { color: var(--muted); }.app-menu-button { display: none; }
.app-content { width: min(1360px, 100%); margin: auto; padding: 36px; }
.workspace-heading { margin-bottom: 28px; display: flex; justify-content: space-between; align-items: end; gap: 25px; }.workspace-heading.compact { align-items: center; }.workspace-heading h1 { margin: 8px 0 7px; font-size: clamp(28px, 4vw, 41px); line-height: 1.1; letter-spacing: -.035em; }.workspace-heading p { margin: 0; color: var(--muted); }.model-status { padding: 11px 14px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.025); }.model-status b,.model-status small { display: block; }.model-status b { font-size: 12px; }.model-status small { color: var(--muted); font: 11px/1.45 var(--mono); }
.generator-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 18px; align-items: start; }.generator-card { padding: 24px; }.field-head { display: flex; justify-content: space-between; margin-bottom: 8px; }.field-head label { font-size: 12px; font-weight: 750; }.field-head span { color: var(--muted); font: 11px/1.45 var(--mono); }.source-tools { margin-top: 8px; display: flex; justify-content: flex-end; gap: 15px; }.form-grid { margin-top: 21px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }.form-grid label { min-width: 0; display: grid; gap: 7px; }
.mode-help { margin-top: 13px; padding: 10px 12px; border-left: 2px solid var(--violet); color: var(--muted); background: rgba(157,124,255,.055); font-size: 11px; }
.source-requirement { margin: 7px 0 0; color: var(--muted); font: 11px/1.45 var(--mono); }
.source-requirement.is-error { color: var(--danger); }
.generation-error { margin-top: 13px; padding: 10px 12px; border-left: 2px solid var(--danger); color: #ffdce0; background: rgba(255,107,122,.075); font-size: 12px; }
.button-generate { width: 100%; min-height: 58px; margin-top: 20px; position: relative; font-size: 15px; letter-spacing: .02em; }.button-generate small { position: absolute; right: 17px; opacity: .72; font: 11px/1.4 var(--mono); }.button-spark { font-size: 17px; }
.workspace-aside { display: grid; gap: 16px; }.insight-card,.recent-card { padding: 20px; }.panel-kicker { margin-bottom: 15px; color: var(--violet); font: 700 11px/1.4 var(--mono); letter-spacing: .15em; text-transform: uppercase; }.output-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; list-style: none; }.output-list li { padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.02); }.output-list b,.output-list span { display: block; }.output-list b { color: var(--neon); font: 800 18px var(--mono); }.output-list span { color: var(--muted); font-size: 11px; }
.panel-title { margin-bottom: 15px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }.panel-title h2,.panel-title h3 { margin: 0; font-size: 16px; }.panel-title p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }.panel-title a { color: var(--neon); font-size: 12px; }.recent-list { display: grid; gap: 7px; }.recent-list button { padding: 11px; display: grid; gap: 4px; text-align: left; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: rgba(255,255,255,.015); }.recent-list button:hover { border-color: rgba(115,245,147,.28); }.recent-list span,.recent-list small { color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }.recent-list b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.empty-mini { padding: 22px 10px; color: var(--muted); text-align: center; }.empty-mini span { font-size: 24px; }.empty-mini p { margin: 8px 0 0; font-size: 12px; }
.generation-progress { margin-top: 20px; padding: 30px; display: flex; align-items: center; gap: 28px; }.progress-orbit { width: 80px; height: 80px; position: relative; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; color: var(--neon); font: 800 15px var(--mono); }.progress-orbit i { position: absolute; inset: -1px; border: 1px solid transparent; border-top-color: var(--neon); border-radius: 50%; animation: rotate 1.5s linear infinite; }.progress-orbit i:nth-child(2) { inset: 8px; border-top-color: var(--violet); animation-direction: reverse; animation-duration: 1.05s; }.progress-orbit i:nth-child(3) { inset: 18px; border-top-color: var(--cyan); animation-duration: 2s; } @keyframes rotate { to { transform: rotate(360deg); } }
.generation-progress h2 { margin: 0 0 5px; font-size: 21px; }.generation-progress p { margin: 0; color: var(--muted); }.progress-steps { margin-top: 14px; display: flex; gap: 16px; color: var(--muted); font: 11px/1.45 var(--mono); text-transform: uppercase; }.progress-steps span.active { color: var(--neon); }
.results-shell { margin-top: 28px; }.results-header { display: flex; align-items: end; justify-content: space-between; gap: 20px; }.results-header h2 { margin: 8px 0 5px; font-size: 31px; }.results-header p { margin: 0; color: var(--muted); }.results-actions { display: flex; flex-wrap: wrap; gap: 8px; }.summary-grid { margin: 20px 0; display: grid; grid-template-columns: 1.3fr 1.3fr .7fr .7fr; gap: 10px; }.summary-card { padding: 15px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.02); }.summary-card span,.summary-card b { display: block; }.summary-card span { margin-bottom: 6px; color: var(--muted); font: 10px/1.4 var(--mono); letter-spacing: .11em; text-transform: uppercase; }.summary-card b { font-size: 12px; }.risk-low { color: var(--neon) !important; }.risk-medium { color: var(--amber) !important; }.risk-high { color: var(--danger) !important; }
.result-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }.result-tabs button { min-width: max-content; padding: 10px 13px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: none; font-size: 11px; }.result-tabs button span { margin-left: 5px; opacity: .6; }.result-tabs button.active { color: var(--text); border-color: var(--neon); }
.result-panel { padding: 18px; border-top-left-radius: 0; }.result-list { display: grid; gap: 10px; }.result-item { padding: 15px; display: grid; grid-template-columns: 35px 1fr auto; gap: 13px; align-items: start; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.018); }.result-item:hover { border-color: var(--line-strong); }.result-number { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: var(--neon); background: rgba(115,245,147,.07); font: 700 11px/1.4 var(--mono); }.result-copy { white-space: pre-wrap; font-size: 13px; line-height: 1.7; }.result-meta { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }.meta-pill { padding: 4px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }.copy-button { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: rgba(255,255,255,.02); }.copy-button:hover { color: var(--neon); }.post-item,.visual-item,.ab-item,.platform-item { grid-template-columns: 35px 1fr auto; }.visual-prompt { color: var(--soft); font-family: var(--mono); font-size: 12px; }.negative-prompt { margin-top: 8px; color: var(--muted); font-size: 11px; }.ab-pair { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.ab-pair div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; }.ab-pair span { display: block; color: var(--violet); font: 700 10px/1.4 var(--mono); }.ab-pair p { margin: 4px 0 0; font-size: 12px; }.risk-reasons { margin: 14px 0 0; padding-left: 18px; color: var(--muted); font-size: 12px; }
.detail-dialog { width: min(950px, calc(100% - 30px)); max-height: 88vh; padding: 0; overflow: auto; border: 1px solid var(--line-strong); border-radius: 18px; color: var(--text); background: #0f141e; box-shadow: 0 40px 120px #000; }.detail-dialog::backdrop { background: rgba(2,4,8,.78); backdrop-filter: blur(7px); }.dialog-head { position: sticky; top: 0; z-index: 2; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(15,20,30,.94); }.dialog-head span { color: var(--neon); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }.dialog-head h2 { margin: 4px 0 0; font-size: 20px; }.detail-dialog [data-dialog-content] { padding: 20px; }

/* Link Audit / Связка 360 */
.audit-workspace { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 18px; align-items: start; }
.audit-form-card { padding: 24px; }
.audit-cost { padding: 6px 9px; border: 1px solid rgba(115,245,147,.28); border-radius: 7px; color: var(--neon); background: rgba(115,245,147,.06); font: 700 11px/1.4 var(--mono); text-transform: uppercase; }
.audit-field-grid { display: grid; grid-template-columns: .75fr 1.15fr 1.1fr; gap: 14px; }
.audit-field-grid label { min-width: 0; display: grid; gap: 7px; }
.audit-honesty-note { padding: 13px; display: grid; grid-template-columns: 25px 1fr; gap: 10px; border: 1px solid rgba(86,215,255,.2); border-radius: 10px; background: rgba(86,215,255,.045); }
.audit-honesty-note > span { width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid rgba(86,215,255,.3); border-radius: 50%; color: var(--cyan); font: 700 10px var(--mono); }
.audit-honesty-note p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.audit-honesty-note b { color: var(--soft); }
.audit-explainer { padding: 21px; }
.audit-explainer ol { margin: 0; padding: 0; display: grid; list-style: none; }
.audit-explainer li { padding: 14px 0; display: grid; grid-template-columns: 34px 1fr; gap: 10px; border-top: 1px solid var(--line); }
.audit-explainer li:first-child { border-top: 0; }
.audit-explainer li > span { color: var(--neon); font: 700 11px/1.4 var(--mono); }
.audit-explainer b,.audit-explainer small { display: block; }
.audit-explainer b { margin-bottom: 4px; font-size: 12px; }
.audit-explainer small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.audit-progress { margin-top: 18px; padding: 26px; display: flex; align-items: center; gap: 24px; }
.audit-progress h2 { margin: 0 0 5px; font-size: 19px; }
.audit-progress p { margin: 0; color: var(--muted); font-size: 12px; }
.audit-results { margin-top: 31px; scroll-margin-top: 85px; }
.audit-summary-grid { margin: 18px 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.audit-summary-card { min-height: 92px; padding: 16px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.018); }
.audit-summary-card span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.audit-summary-card strong { font-size: 18px; }
.audit-summary-card.ready strong { color: var(--neon); }
.audit-summary-card.attention strong { color: var(--amber); }
.audit-summary-card.blocked strong { color: var(--danger); }
.audit-route-card { padding: 20px; }
.audit-route { margin: 0; padding: 0; display: grid; list-style: none; }
.audit-route > li { padding: 14px 0; display: grid; grid-template-columns: 39px minmax(0,1fr) auto; gap: 13px; align-items: center; border-top: 1px solid var(--line); }
.audit-route-number { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: var(--neon); background: rgba(115,245,147,.07); font: 700 11px/1.4 var(--mono); }
.audit-route-body { min-width: 0; }
.audit-route-body b,.audit-route-body small,.audit-route-body em { display: block; overflow-wrap: anywhere; }
.audit-route-body b { font-size: 12px; }
.audit-route-body small,.audit-route-body em { margin-top: 3px; color: var(--muted); font: 11px/1.55 var(--mono); }
.audit-route-body em { color: var(--violet); font-style: normal; }
.audit-route-metrics { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.audit-route-metrics span { padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); }
.audit-route-metrics .pass { color: var(--neon); border-color: rgba(115,245,147,.24); }
.audit-route-metrics .warning { color: var(--amber); border-color: rgba(255,203,107,.24); }
.audit-route-metrics .fail { color: var(--danger); border-color: rgba(255,107,122,.24); }
.audit-route-empty { display: block !important; color: var(--muted); font-size: 12px; }
.audit-checks { margin-top: 13px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.audit-check-card { padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: linear-gradient(145deg, rgba(20,26,38,.82), rgba(10,14,21,.9)); }
.audit-check-card.pass { border-color: rgba(115,245,147,.16); }
.audit-check-card.warning { border-color: rgba(255,203,107,.25); }
.audit-check-card.fail { border-color: rgba(255,107,122,.29); }
.audit-check-head { display: flex; align-items: center; gap: 10px; }
.audit-check-head h3 { margin: 0; font-size: 14px; }
.audit-check-status { padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }
.audit-check-status.pass { color: var(--neon); border-color: rgba(115,245,147,.25); }
.audit-check-status.warning { color: var(--amber); border-color: rgba(255,203,107,.28); }
.audit-check-status.fail { color: var(--danger); border-color: rgba(255,107,122,.3); }
.audit-check-status.info { color: var(--cyan); border-color: rgba(86,215,255,.28); }
.audit-check-card > p { margin: 13px 0 0; color: var(--soft); font-size: 11px; }
.audit-fix { margin-top: 14px; padding: 11px; border-left: 2px solid var(--neon); color: var(--muted); background: rgba(115,245,147,.045); font-size: 12px; }
.audit-fix b,.audit-fix span { display: block; }
.audit-fix b { margin-bottom: 4px; color: var(--neon); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }
.audit-history-section { margin-top: 34px; }
.audit-history-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.audit-history-card { padding: 14px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; }
.audit-history-open { min-width: 0; padding: 0; display: grid; gap: 6px; border: 0; color: var(--text); background: none; text-align: left; }
.audit-history-open b { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.audit-history-open small { color: var(--muted); font: 10px/1.4 var(--mono); }
.audit-verdict { width: max-content; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }
.audit-verdict.ready { color: var(--neon); border-color: rgba(115,245,147,.25); }
.audit-verdict.attention { color: var(--amber); border-color: rgba(255,203,107,.27); }
.audit-verdict.blocked { color: var(--danger); border-color: rgba(255,107,122,.27); }

/* Postback Doctor */
.postback-heading { margin-bottom: 20px; }
.postback-mode-grid { margin-bottom: 18px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.postback-mode-card { width: 100%; min-height: 188px; padding: 21px; position: relative; overflow: hidden; appearance: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.postback-mode-card::after { content: ""; width: 150px; height: 150px; position: absolute; right: -65px; bottom: -78px; border: 1px solid var(--line); border-radius: 50%; }
.postback-mode-card.active { border-color: rgba(115,245,147,.32); background: linear-gradient(145deg, rgba(115,245,147,.075), rgba(13,18,27,.91)); }
.postback-mode-card:hover { border-color: rgba(115,245,147,.24); }
.postback-mode-card:focus-visible { outline: 2px solid var(--neon); outline-offset: 3px; }
.postback-mode-card:disabled { cursor: wait; opacity: .72; }
.postback-mode-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.postback-mode-icon { color: var(--neon); font: 750 10px var(--mono); letter-spacing: .13em; }
.postback-mode-badge { padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.postback-mode-badge.free { color: var(--neon); border-color: rgba(115,245,147,.28); background: rgba(115,245,147,.055); }
.postback-mode-badge.catcher { color: var(--cyan); border-color: rgba(81,211,255,.28); background: rgba(81,211,255,.055); }
.postback-mode-card h2 { margin: 29px 0 8px; font-size: 19px; }
.postback-mode-card p { max-width: 580px; margin: 0; color: var(--soft); font-size: 11px; line-height: 1.65; }
.postback-mode-card > small { margin-top: 15px; display: block; color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-layout { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 18px; align-items: start; }
.postback-form-card { padding: 24px; }
.postback-form-card textarea { min-height: 184px; resize: vertical; font: 11px/1.65 var(--mono); overflow-wrap: anywhere; }
.postback-counter { justify-self: end; color: var(--muted); font: 11px/1.4 var(--mono); }
.postback-counter b { color: var(--soft); }
.postback-honesty-note { margin-top: 14px; }
.postback-live-method { padding: 14px 15px; border: 1px solid rgba(81,211,255,.24); border-radius: 10px; background: rgba(81,211,255,.035); }
.postback-live-method[hidden] { display: none; }
.postback-live-method small { color: var(--muted); font-size: 11px; line-height: 1.6; }
.postback-live-confirm { padding: 14px 15px; display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 11px; border: 1px solid rgba(255,203,107,.28); border-radius: 10px; background: rgba(255,203,107,.045); color: var(--soft); font-size: 11px; line-height: 1.55; cursor: pointer; }
.postback-live-confirm[hidden] { display: none; }
.postback-live-confirm input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--neon); }
.postback-guide { padding: 21px; }
.postback-guide ol { margin: 0; padding: 0; display: grid; list-style: none; }
.postback-guide li { padding: 14px 0; display: grid; grid-template-columns: 34px 1fr; gap: 10px; border-top: 1px solid var(--line); }
.postback-guide li:first-child { border-top: 0; }
.postback-guide li > span { color: var(--neon); font: 700 11px/1.4 var(--mono); }
.postback-guide li > div { display: grid; gap: 5px; }
.postback-guide b,.postback-guide small { display: block; }
.postback-guide b { margin: 0; font-size: 12px; }
.postback-guide small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.postback-catcher { scroll-margin-top: 85px; }
.postback-catcher-grid { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 18px; align-items: start; }
.postback-catcher-create,.postback-catcher-session { padding: 24px; }
.postback-catcher-mapping { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.postback-catcher-mapping label > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.postback-catcher-mapping label b { color: var(--amber); font: 700 10px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.postback-catcher-session { margin-top: 18px; border-color: rgba(81,211,255,.2); }
.postback-catcher-session-head { align-items: start; }
.postback-catcher-url-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 10px; }
.postback-catcher-url-row input { font: 11px/1.45 var(--mono); }
.postback-catcher-url-row .button { min-height: 44px; }
.postback-catcher-wait { margin-top: 15px; padding: 15px; display: flex; align-items: center; gap: 13px; border: 1px solid rgba(81,211,255,.2); border-radius: 10px; background: rgba(81,211,255,.045); }
.postback-catcher-wait > div { display: grid; gap: 5px; }
.postback-catcher-wait b { font-size: 11px; }
.postback-catcher-wait small { color: var(--muted); font: 11px/1.45 var(--mono); }
.postback-catcher-pulse { width: 11px; height: 11px; flex: 0 0 auto; border: 2px solid var(--cyan); border-radius: 50%; box-shadow: 0 0 0 0 rgba(81,211,255,.34); animation: catcher-pulse 1.8s infinite; }
@keyframes catcher-pulse { 70% { box-shadow: 0 0 0 9px rgba(81,211,255,0); } 100% { box-shadow: 0 0 0 0 rgba(81,211,255,0); } }
.postback-catcher-report { margin-top: 20px; padding-top: 4px; border-top: 1px solid var(--line); }
.postback-catcher-field-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.postback-catcher-field { min-width: 0; padding: 14px; display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.016); }
.postback-catcher-field.present { border-color: rgba(115,245,147,.23); }
.postback-catcher-field.missing.required { border-color: rgba(255,107,122,.29); }
.postback-catcher-field.missing:not(.required) { border-color: rgba(255,203,107,.25); }
.postback-catcher-field > span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.postback-catcher-field > b { overflow-wrap: anywhere; font: 11px/1.55 var(--mono); }
.postback-catcher-field > small { color: var(--muted); font: 10px/1.45 var(--mono); }
.postback-catcher-table { min-width: 620px; }
.postback-catcher-fields { margin-bottom: 24px; }
.postback-results { margin-top: 34px; scroll-margin-top: 85px; }
.postback-live-report { margin: 18px 0; padding: 20px; border-color: rgba(115,245,147,.22); }
.postback-live-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.postback-live-details { margin-top: 12px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.postback-live-detail { min-width: 0; padding: 13px 15px; display: grid; gap: 7px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.014); }
.postback-live-detail.wide,.postback-live-detail.response { grid-column: 1/-1; }
.postback-live-detail > span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.postback-live-detail > strong { overflow-wrap: anywhere; font: 11px/1.6 var(--mono); }
.postback-live-detail.ready > strong { color: var(--neon); }
.postback-live-detail.attention > strong { color: var(--amber); }
.postback-live-detail.blocked > strong { color: var(--danger); }
.postback-live-detail pre { max-height: 190px; margin: 3px 0 0; padding: 12px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 8px; background: var(--deep); color: var(--soft); font: 11px/1.6 var(--mono); }
.postback-live-detail small { color: var(--muted); font-size: 11px; line-height: 1.6; }
.postback-live-chain-section { margin-top: 18px; padding-top: 17px; border-top: 1px solid var(--line); }
.postback-live-chain-heading h3 { margin: 0; font-size: 15px; }
.postback-live-chain-heading p { margin: 6px 0 0; color: var(--muted); font-size: 11px; }
.postback-live-chain { margin: 13px 0 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.postback-live-hop { min-width: 0; padding: 14px; display: grid; gap: 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.014); }
.postback-live-hop.final { border-color: rgba(115,245,147,.26); }
.postback-live-hop.blocked { border-color: rgba(255,107,122,.32); }
.postback-live-hop-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.postback-live-hop-heading b { font: 700 11px/1.4 var(--mono); }
.postback-live-hop-heading span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.postback-live-hop-heading span.final { color: var(--neon); }
.postback-live-hop-url { padding: 9px 10px; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 7px; background: var(--deep); color: var(--soft); font: 11px/1.55 var(--mono); }
.postback-live-hop-metrics { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; }
.postback-live-hop-metrics > span { min-width: 0; display: grid; gap: 4px; }
.postback-live-hop-metrics small { color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-live-hop-metrics strong { overflow-wrap: anywhere; font: 11px/1.45 var(--mono); }
.postback-live-hop-error { margin: 0; padding: 9px 10px; border-radius: 7px; background: rgba(255,107,122,.08); color: var(--danger); font-size: 11px; line-height: 1.55; }
.postback-live-chain-empty { padding: 12px; border: 1px dashed var(--line); border-radius: 8px; color: var(--muted); font-size: 11px; }
.postback-summary-grid { margin: 18px 0; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; }
.postback-summary-card { min-height: 86px; padding: 15px; display: flex; flex-direction: column; justify-content: space-between; gap: 10px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.018); }
.postback-summary-card span { color: var(--muted); font: 700 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.postback-summary-card strong { font-size: 16px; }
.postback-summary-card.ready strong { color: var(--neon); }
.postback-summary-card.attention strong { color: var(--amber); }
.postback-summary-card.blocked strong { color: var(--danger); }
.postback-result-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr); gap: 14px; }
.postback-mapping-card,.postback-structure-card,.postback-parameters-card { padding: 20px; }
.postback-mapping-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.postback-mapping-row { min-width: 0; padding: 11px; display: grid; grid-template-columns: minmax(0,.72fr) minmax(130px,1fr); align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.015); }
.postback-mapping-label { display: grid; gap: 6px; }
.postback-mapping-label b,.postback-mapping-label small { display: block; }
.postback-mapping-label b { font-size: 11px; }
.postback-mapping-label small { margin: 0; color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-mapping-label small.required { color: var(--amber); }
.postback-mapping-row select { height: 39px; padding: 0 30px 0 10px; font-size: 11px; }
.postback-structure { margin: 0; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 0; }
.postback-structure dt,.postback-structure dd { margin: 0; padding: 10px 0; border-top: 1px solid var(--line); }
.postback-structure dt:first-of-type,.postback-structure dt:first-of-type + dd { border-top: 0; }
.postback-structure dt { padding-right: 15px; color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-structure dd { overflow-wrap: anywhere; color: var(--soft); font: 11px/1.55 var(--mono); text-align: right; }
.postback-parameters-card { margin-top: 14px; }
.postback-table-wrap { overflow-x: auto; }
.postback-table { min-width: 780px; }
.postback-param-position { color: var(--muted); font: 11px/1.4 var(--mono); }
.postback-param-name { color: var(--soft); font: 11px/1.4 var(--mono); }
.postback-param-value { max-width: 330px; overflow-wrap: anywhere; font: 11px/1.6 var(--mono); }
.postback-param-tags { min-width: 125px; }
.postback-tag { margin: 2px 4px 2px 0; padding: 4px 6px; display: inline-flex; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-tag.macro { color: var(--violet); border-color: rgba(157,124,255,.26); text-transform: none; }
.postback-tag.pass { color: var(--neon); border-color: rgba(115,245,147,.23); }
.postback-tag.warning { color: var(--amber); border-color: rgba(255,203,107,.27); }
.postback-issues-section { margin-top: 28px; }
.postback-issue-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.postback-issue-card { padding: 18px; border-color: var(--line); }
.postback-issue-card.error { border-color: rgba(255,107,122,.29); }
.postback-issue-card.warning { border-color: rgba(255,203,107,.25); }
.postback-issue-card.info { border-color: rgba(115,245,147,.18); }
.postback-issue-card.ready { border-color: rgba(115,245,147,.22); }
.postback-issue-severity { width: max-content; padding: 4px 6px; display: inline-flex; border: 1px solid currentColor; border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-issue-card.error .postback-issue-severity { color: var(--danger); }
.postback-issue-card.warning .postback-issue-severity { color: var(--amber); }
.postback-issue-card.info .postback-issue-severity { color: var(--neon); }
.postback-issue-card.ready .postback-issue-severity { color: var(--neon); }
.postback-issue-card h3 { margin: 13px 0 7px; font-size: 14px; }
.postback-issue-card > p { margin: 0; color: var(--soft); font-size: 11px; line-height: 1.65; }
.postback-issue-fix { margin-top: 14px; padding: 11px; display: grid; gap: 6px; border-left: 2px solid var(--neon); color: var(--muted); background: rgba(115,245,147,.045); font-size: 12px; line-height: 1.6; }
.postback-issue-fix b,.postback-issue-fix span { display: block; }
.postback-issue-fix b { margin: 0; color: var(--neon); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }

/* History, settings, pricing */
.history-toolbar { margin-bottom: 18px; padding: 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }.search-field { min-width: 260px; max-width: 520px; flex: 1; position: relative; }.search-field span { position: absolute; left: 13px; top: 11px; color: var(--muted); }.search-field input { padding-left: 38px; }
.history-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }.history-card { padding: 18px; display: grid; gap: 13px; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(145deg, rgba(20,26,38,.82), rgba(10,14,21,.9)); }.history-card:hover { border-color: rgba(115,245,147,.25); }.history-card-head,.history-card-footer { display: flex; justify-content: space-between; gap: 10px; }.history-card-tag { color: var(--violet); font: 700 11px/1.4 var(--mono); text-transform: uppercase; }.history-card-time { color: var(--muted); font: 11px/1.4 var(--mono); }.history-card h3 { margin: 0; min-height: 47px; font-size: 14px; line-height: 1.6; }.history-card-open { width: 100%; padding: 0; border: 0; color: inherit; background: none; text-align: left; font: inherit; line-height: inherit; }.history-card-open:hover { color: var(--neon); }.history-card-footer { align-items: center; color: var(--muted); font-size: 12px; }.history-card-actions { display: flex; gap: 5px; }.history-card-actions button { width: 34px; height: 34px; }.loading-block,.empty-state { grid-column: 1/-1; padding: 50px; color: var(--muted); text-align: center; }
.pagination { margin-top: 22px; display: flex; justify-content: center; gap: 5px; }.pagination a,.pagination span,.pagination button { min-width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: transparent; font-size: 11px; }.pagination a.active,.pagination button.active { color: var(--neon-ink); border-color: var(--neon); background: var(--neon); }.pagination a.disabled { opacity: .3; pointer-events: none; }
.history-section + .history-section { margin-top: 58px; padding-top: 42px; border-top: 1px solid var(--line); }
.history-section-head { margin-bottom: 17px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.history-section-head .panel-kicker { margin-bottom: 7px; }
.history-section-head h2 { margin: 0 0 5px; font-size: 24px; }
.history-section-head p { margin: 0; color: var(--muted); font-size: 12px; }
.history-safe-note,.postback-history-safe-note { color: var(--muted); font-size: 12px; line-height: 1.6; }
.postback-history-card { border-color: rgba(86,215,255,.16); background: radial-gradient(circle at 100% 0, rgba(86,215,255,.06), transparent 36%), linear-gradient(145deg, rgba(20,26,38,.86), rgba(10,14,21,.92)); }
.postback-history-card:hover { border-color: rgba(86,215,255,.34); }
.postback-history-card .history-card-tag { color: var(--cyan); }
.postback-history-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.postback-history-metric { min-width: 0; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.018); }
.postback-history-metric span,.postback-history-metric strong { display: block; }
.postback-history-metric span { margin-bottom: 4px; color: var(--muted); font: 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.postback-history-metric strong { overflow: hidden; font: 700 11px/1.4 var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.postback-history-metric.ready strong { color: var(--neon); }
.postback-history-metric.attention strong { color: var(--amber); }
.postback-history-metric.blocked strong { color: var(--danger); }
.postback-history-card-issue { min-height: 34px; margin: 0; color: var(--soft); font-size: 11px; line-height: 1.55; }
.postback-history-card-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.postback-history-card-actions .button { min-height: 36px; padding-inline: 11px; font-size: 11px; }
.button.danger { color: var(--danger); border-color: rgba(255,107,122,.28); background: rgba(255,107,122,.05); }
.postback-history-dialog { width: min(1080px, calc(100% - 30px)); }
.postback-history-dialog .dialog-head { align-items: flex-start; }
.postback-dialog-actions { flex-wrap: wrap; justify-content: flex-end; }
.postback-history-template { padding: 16px; display: grid; gap: 9px; border: 1px solid rgba(86,215,255,.2); border-radius: 11px; background: rgba(86,215,255,.035); }
.postback-history-template .panel-kicker { margin: 0; color: var(--cyan); }
.postback-history-template code,.postback-history-safe-value code { color: var(--soft); font: 11px/1.65 var(--mono); overflow-wrap: anywhere; }
.postback-history-metrics { margin-top: 14px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.postback-history-metrics .postback-history-metric { padding: 13px; }
.postback-history-main-issue { margin-top: 14px; padding: 15px; border-left: 2px solid var(--amber); background: rgba(255,203,107,.04); }
.postback-history-main-issue .panel-kicker { margin-bottom: 7px; color: var(--amber); }
.postback-history-main-issue p { margin: 0; color: var(--soft); font-size: 12px; }
.postback-history-diagnostics,.postback-history-full-report { margin-top: 24px; }
.postback-history-safe-value,.postback-history-preview { margin-top: 10px; padding: 13px; display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.018); }
.postback-history-safe-value > span,.postback-history-preview > span { color: var(--muted); font: 10px/1.4 var(--mono); text-transform: uppercase; }
.postback-history-preview pre,.postback-history-json { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.postback-history-preview pre { max-height: 230px; overflow: auto; color: var(--soft); font: 11px/1.65 var(--mono); }
.postback-history-json { max-height: 52vh; padding: 16px; overflow: auto; border: 1px solid var(--line); border-radius: 11px; color: var(--soft); background: #090d14; font: 11px/1.65 var(--mono); }
.public-pricing { padding-block: 80px; }
.pricing-grid.in-app { max-width: 1040px; margin: 20px auto 0; }
.payment-guide { max-width: 1040px; margin: 0 auto 22px; padding: 26px; display: grid; grid-template-columns: .85fr 1.35fr; gap: 22px 32px; align-items: start; border-color: rgba(115,245,147,.2); background: radial-gradient(circle at 100% 0, rgba(115,245,147,.08), transparent 36%), rgba(14,19,28,.9); }
.payment-guide-intro h2 { margin: 8px 0; font-size: 23px; line-height: 1.2; }
.payment-guide-intro p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.payment-steps { margin: 0; padding: 0; display: grid; gap: 9px; list-style: none; }
.payment-steps li { padding: 12px; display: grid; grid-template-columns: 33px 1fr; gap: 11px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.018); }
.payment-steps li > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: var(--neon); background: rgba(115,245,147,.08); font: 700 11px/1.4 var(--mono); }
.payment-steps b,.payment-steps p { display: block; }
.payment-steps b { font-size: 12px; }
.payment-steps p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.payment-guide-action,.payment-guide-status { grid-column: 1/-1; padding-top: 18px; display: flex; align-items: center; gap: 14px; border-top: 1px solid var(--line); }
.payment-guide-action .button { min-width: 260px; }
.payment-guide-action small { max-width: 520px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.payment-guide-status > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(115,245,147,.28); border-radius: 50%; color: var(--neon); background: rgba(115,245,147,.07); font-weight: 900; }
.payment-guide-status b,.payment-guide-status small { display: block; }
.payment-guide-status b { font-size: 12px; }
.payment-guide-status small { margin-top: 3px; color: var(--muted); font-size: 12px; }
.payment-guide-status-warning > span { border-color: rgba(255,203,107,.28); color: var(--amber); background: rgba(255,203,107,.07); }
.payment-consent { max-width: 780px; margin: 18px auto 0; padding: 14px 18px; }
.payment-consent .check-label { width: 100%; }
.payment-note { max-width: 780px; margin: 26px auto 0; padding: 20px; display: flex; gap: 15px; }
.payment-note > span { color: var(--amber); font-size: 25px; }
.payment-note h3 { margin: 0 0 4px; font-size: 15px; }
.payment-note p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.payment-note a { color: var(--neon); }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.settings-card { padding: 22px; }.settings-wide { grid-column: 1/-1; }.telegram-only { padding: 35px 15px; text-align: center; }.telegram-only > span { width: 48px; height: 48px; margin: auto; display: grid; place-items: center; border-radius: 50%; color: var(--neon); background: rgba(115,245,147,.08); }.telegram-only h3 { margin: 15px 0 5px; }.telegram-only p { margin: 0; color: var(--muted); font-size: 12px; }
.transaction-list { display: grid; }.transaction-row { padding: 12px 0; display: grid; grid-template-columns: 1fr auto auto; gap: 16px; align-items: center; border-top: 1px solid var(--line); }.transaction-row b,.transaction-row span { display: block; }.transaction-row b { font-size: 12px; }.transaction-row span,.transaction-row time { color: var(--muted); font-size: 11px; }.transaction-amount { font: 700 12px var(--mono); }.transaction-amount.positive { color: var(--neon); }.transaction-amount.negative { color: var(--danger); }

/* Legal */
.legal-page { padding-block: 80px 110px; }.legal-heading { max-width: 760px; margin-bottom: 32px; }.legal-heading h1 { margin: 11px 0; font-size: clamp(38px,5vw,60px); letter-spacing: -.04em; }.legal-heading p { color: var(--muted); }.legal-content { padding: 45px; }.legal-content h2 { margin: 34px 0 9px; font-size: 20px; }.legal-content h2:first-child { margin-top: 0; }.legal-content p,.legal-content li { color: var(--soft); }.legal-content a { color: var(--neon); }.legal-content code { padding: 2px 5px; border-radius: 4px; color: var(--neon); background: rgba(115,245,147,.07); }.legal-callout { margin-top: 35px; padding: 16px; border: 1px solid rgba(255,203,107,.25); border-radius: 10px; color: var(--amber); background: rgba(255,203,107,.05); font-size: 12px; }

/* Admin */
.admin-shell { min-height: 100vh; display: grid; grid-template-columns: 215px 1fr; }.admin-sidebar { position: sticky; top: 0; height: 100vh; padding: 22px 14px; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: #0a0e15; }.admin-sidebar .brand-name { font-size: 16px; }.admin-sidebar nav { margin-top: 25px; display: grid; gap: 4px; }.admin-sidebar nav a { padding: 10px 12px; border-radius: 8px; color: var(--muted); font-size: 12px; }.admin-sidebar nav a:hover,.admin-sidebar nav a.active { color: var(--text); background: rgba(255,255,255,.04); }.admin-sidebar nav a.active { box-shadow: inset 2px 0 var(--neon); }.admin-back { margin-top: auto; padding: 10px; color: var(--muted); font-size: 11px; }.admin-main { min-width: 0; }.admin-topbar { min-height: 77px; padding: 0 27px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }.admin-topbar span { color: var(--neon); font: 700 10px/1.4 var(--mono); letter-spacing: .13em; text-transform: uppercase; }.admin-topbar h1 { margin: 3px 0 0; font-size: 20px; }.admin-content { padding: 27px; }.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }.metric-grid article { padding: 20px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.02); }.metric-grid span,.metric-grid strong,.metric-grid small { display: block; }.metric-grid span { color: var(--muted); font-size: 11px; }.metric-grid strong { margin: 12px 0 4px; font-size: 30px; }.metric-grid small { color: var(--muted); font-size: 11px; }.admin-grid { margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.admin-table-card { padding: 18px; }.table-wrap { overflow-x: auto; } table { width: 100%; border-collapse: collapse; font-size: 12px; } th { padding: 10px; color: var(--muted); text-align: left; font: 700 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; } td { padding: 12px 10px; border-top: 1px solid var(--line); vertical-align: middle; } td b,td small { display: block; } td small { margin-top: 3px; color: var(--muted); }.source-cell { max-width: 370px; color: var(--soft); }.status-badge { display: inline-flex; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font: 700 10px/1.4 var(--mono); text-transform: uppercase; }.status-badge.succeeded,.status-badge.completed { color: var(--neon); border-color: rgba(115,245,147,.25); background: rgba(115,245,147,.05); }.status-badge.failed,.status-badge.refunded { color: var(--danger); border-color: rgba(255,107,122,.25); background: rgba(255,107,122,.05); }.status-badge.pending,.status-badge.pre_checkout,.status-badge.invoice_created { color: var(--amber); }.admin-search { margin-bottom: 15px; display: flex; gap: 9px; }.admin-search input { max-width: 400px; }.table-actions,.inline-adjust { display: flex; gap: 5px; }.inline-adjust input { width: 65px; height: 32px; padding: 0 7px; border-radius: 7px; }.inline-adjust input[name=reason] { width: 120px; }.inline-adjust button { width: 32px; border: 1px solid var(--line); border-radius: 7px; color: var(--neon); background: rgba(115,245,147,.06); }.filter-tabs { margin-bottom: 14px; display: flex; gap: 5px; }.filter-tabs a { padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); font-size: 11px; }.filter-tabs a.active { color: var(--neon-ink); border-color: var(--neon); background: var(--neon); }.admin-plan-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }.admin-plan-card { padding: 20px; display: grid; gap: 13px; }.admin-plan-card label { display: grid; gap: 6px; }.admin-plan-card .form-grid { margin: 0; grid-template-columns: 1fr 1fr; }.system-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }.system-card { padding: 20px; display: flex; gap: 14px; align-items: start; }.system-card h3 { margin: 0; font-size: 15px; }.system-card p { margin: 5px 0; color: var(--muted); font-size: 12px; }.system-card code { color: var(--soft); font-size: 11px; word-break: break-all; }.system-help { margin-top: 15px; padding: 22px; }.system-help h2 { margin-top: 0; }.system-help code { color: var(--neon); }

/* Toasts */
.toast-stack { position: fixed; z-index: 100; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); width: min(370px, calc(100% - 36px)); display: grid; gap: 8px; }.toast { padding: 13px 15px; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start; border: 1px solid var(--line-strong); border-radius: 11px; background: #151b26; box-shadow: var(--shadow); animation: toastIn .25s ease both; }.toast::before { content: "●"; color: var(--neon); }.toast.error::before { color: var(--danger); }.toast.info::before { color: var(--cyan); }.toast button { border: 0; color: var(--muted); background: none; }.toast p { margin: 0; font-size: 12px; } @keyframes toastIn { from { opacity: 0; transform: translateY(10px); } }
.sidebar-scrim { position: fixed; inset: 0; z-index: 25; background: rgba(0,0,0,.65); }
[hidden] { display: none !important; }

@media (max-width: 1100px) {
  .hero-grid { gap: 38px; }.control-spotlight { grid-template-columns: 1fr; }.control-grid { grid-template-columns: 1fr 1fr; }.generator-layout,.audit-workspace,.postback-layout,.postback-result-grid,.postback-catcher-grid { grid-template-columns: 1fr; }.workspace-aside { grid-template-columns: 1fr 1fr; }.audit-field-grid { grid-template-columns: repeat(2,1fr); }.form-grid { grid-template-columns: repeat(2,1fr); }.history-grid { grid-template-columns: repeat(2,1fr); }.metric-grid { grid-template-columns: 1fr 1fr; }.admin-grid { grid-template-columns: 1fr; }.postback-summary-grid,.postback-live-metrics { grid-template-columns: repeat(3,1fr); }.postback-catcher-field-grid { grid-template-columns: repeat(2,1fr); }.postback-live-hop-metrics { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 880px) {
  .site-nav { display: none; }.mobile-menu-button { display: grid; }.hero { padding-top: 70px; }.hero-grid { grid-template-columns: 1fr; }.hero-copy { text-align: center; }.hero-lead { margin-inline: auto; }.hero-actions,.hero-trust { justify-content: center; }.hero-visual { max-width: 620px; margin: auto; }.feature-grid { grid-template-columns: 1fr 1fr; }.feature-wide { grid-column: span 2; }.control-plane-head { grid-template-columns: 1fr; gap: 25px; }.roadmap-note { max-width: 520px; }.control-cta { align-items: start; flex-direction: column; }.pricing-grid { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; }.price-card.featured { transform: none; }.payment-guide { grid-template-columns: 1fr; }.final-cta { align-items: start; flex-direction: column; }.app-shell { grid-template-columns: 1fr; }.app-sidebar { position: fixed; left: 0; transform: translateX(-105%); width: var(--sidebar); transition: transform .25s ease; }.app-sidebar.open { transform: translateX(0); }.app-menu-button { display: grid; }.app-breadcrumb { margin-right: auto; margin-left: 10px; }.admin-shell { grid-template-columns: 1fr; }.admin-sidebar { position: static; width: 100%; height: auto; }.admin-sidebar nav { display: flex; overflow-x: auto; }.admin-sidebar nav a { min-width: max-content; }.admin-back { margin-top: 15px; }.admin-plan-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .container { width: min(100% - 26px, 1160px); }.header-inner { min-height: 64px; }.mobile-menu { top: calc(65px + env(safe-area-inset-top)); }.brand-name { font-size: 19px; }.hero { padding: 56px 0 68px; }.hero h1 { font-size: 45px; }.hero-lead { font-size: 15px; }.hero-actions { flex-direction: column; }.hero-actions .button { width: 100%; }.terminal-card { transform: none; }.floating-chip { display: none; }.section { padding: 75px 0; }.section-heading { margin-bottom: 30px; }.feature-grid { grid-template-columns: 1fr; }.feature-wide { grid-column: auto; }.feature-card { min-height: 250px; }.control-plane-head .section-heading { margin-bottom: 0; }.control-spotlight { padding: 20px; gap: 28px; border-radius: 18px; }.control-grid { grid-template-columns: 1fr; }.control-card { min-height: 330px; padding: 22px; }.link-flow { grid-template-columns: 1fr; gap: 9px; }.link-flow > i { transform: rotate(90deg); justify-self: center; }.link-flow > div { padding: 8px 0; grid-template-columns: 30px 1fr auto; align-items: center; }.audit-result-grid { grid-template-columns: 1fr; }.audit-result-grid > div { min-height: auto; }.audit-result-grid strong { margin-top: 8px; }.control-cta { padding: 24px 20px; gap: 22px; }.control-cta .button { width: 100%; }.workflow-grid { grid-template-columns: 1fr; }.workflow-grid article,.workflow-grid article:last-child { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line); }.workflow-grid h3 { margin-top: 30px; }.final-cta { margin-bottom: 70px; padding: 28px; }.footer-grid { align-items: start; flex-direction: column; }.auth-card { padding: 28px 20px; }.app-topbar { padding-left: max(13px, env(safe-area-inset-left)); padding-right: max(13px, env(safe-area-inset-right)); }.icon-button { width: 44px; height: 44px; }.history-card-actions button,.copy-button { width: 44px; height: 44px; }.credit-badge small { display: none; }.app-content { padding: 24px 14px; }.workspace-heading { align-items: start; flex-direction: column; }.workspace-heading .button { width: 100%; }.model-status { width: 100%; }.generator-card,.audit-form-card,.postback-form-card,.postback-catcher-create,.postback-catcher-session { padding: 17px; }.form-grid,.audit-field-grid,.postback-catcher-mapping { grid-template-columns: 1fr; }.workspace-aside { grid-template-columns: 1fr; }.generation-progress,.audit-progress { align-items: start; flex-direction: column; }.progress-steps { flex-wrap: wrap; }.results-header { align-items: start; flex-direction: column; }.results-actions { width: 100%; }.results-actions .button { flex: 1; }.summary-grid,.audit-summary-grid,.postback-summary-grid,.postback-live-metrics,.postback-catcher-field-grid { grid-template-columns: 1fr 1fr; }.postback-live-details { grid-template-columns: 1fr; }.postback-live-hop-metrics { grid-template-columns: 1fr 1fr; }.audit-route > li { grid-template-columns: 39px 1fr; }.audit-route-metrics { grid-column: 2; justify-content: flex-start; }.audit-checks,.audit-history-grid,.postback-mode-grid,.postback-mapping-grid,.postback-issue-grid { grid-template-columns: 1fr; }.postback-mapping-row,.postback-catcher-url-row { grid-template-columns: 1fr; }.postback-catcher-url-row .button { width: 100%; }.result-item,.post-item,.visual-item,.ab-item,.platform-item { grid-template-columns: 30px 1fr; }.result-item > .copy-button { grid-column: 2; }.ab-pair { grid-template-columns: 1fr; }.history-toolbar { align-items: stretch; flex-direction: column; }.search-field { min-width: 0; }.history-grid { grid-template-columns: 1fr; }.settings-grid { grid-template-columns: 1fr; }.settings-wide { grid-column: auto; }.transaction-row { grid-template-columns: 1fr auto; }.transaction-row time { grid-column: 1/-1; }.payment-guide { padding: 20px 16px; }.payment-guide-action { align-items: stretch; flex-direction: column; }.payment-guide-action .button { width: 100%; min-width: 0; }.legal-page { padding-block: 55px 80px; }.legal-content { padding: 25px 20px; }.metric-grid,.system-grid { grid-template-columns: 1fr; }.admin-content { padding: 16px 11px; }.admin-topbar { padding-inline: 15px; }.inline-adjust input[name=reason] { display: none; }
}
@media (max-width: 680px) {
  .history-section-head { align-items: stretch; flex-direction: column; }
  .history-section-head .button { width: 100%; }
  .postback-history-facts,.postback-history-metrics { grid-template-columns: 1fr 1fr; }
  .postback-history-card-actions .button { min-width: calc(50% - 4px); flex: 1; }
  .postback-history-dialog .dialog-head { gap: 12px; align-items: stretch; flex-direction: column; }
  .postback-dialog-actions { justify-content: flex-start; }
  .postback-dialog-actions .button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* R12 app-shell vertical scroll safety */
.app-sidebar{height:100vh;height:100dvh;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.sidebar-brand,.app-nav,.sidebar-bottom{flex:0 0 auto}
@media (min-width:881px){body.sidebar-open{overflow:auto}}