/* Giro Bio — azul profundo, dourado e superfícies claras. */

/* Inter (SIL Open Font License 1.1) hospedada localmente: sem requisições ao Google. */
@font-face { font-family:'Inter'; font-style:normal; font-weight:400 800; font-display:swap; src:url('fonts/inter-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Inter'; font-style:normal; font-weight:400 800; font-display:swap; src:url('fonts/inter-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root {
  color-scheme:light;
  --bg:#f7f5ef; --surface:#fffefa; --surface-2:#fbf8f0; --surface-3:#f1eadb;
  --line:#e8dfcd; --line-strong:#cdbb9d; --ink:#102338; --muted:#47566a; --subtle:#687485;
  --primary:#956117; --primary-hover:#794d11; --on-primary:#fff; --primary-soft:#f7eacb; --primary-ink:#744a10;
  --success:#11704b; --success-soft:#dcf5e9; --warning:#8a5300; --warning-soft:#fff2d9; --error:#b3261e; --error-soft:#fde6e3;
  --shadow-sm:0 1px 2px rgba(16,24,40,.05); --shadow:0 4px 14px rgba(16,24,40,.06); --shadow-lg:0 20px 50px rgba(16,24,40,.16);
  --radius-sm:6px; --radius:10px; --radius-lg:16px; --radius-xl:24px;
  --topbar:rgba(247,245,239,.9); --overlay:rgba(6,21,38,.65);
  --pro-ink:#76500f; --pro-bg:#f7eacb; --toast-bg:#102338; --toast-ink:#fff;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,'Cascadia Mono',Menlo,Consolas,monospace;
}
/* Tema: claro por padrão; escuro por escolha ou seguindo o sistema (ver static/theme.js). */
:root[data-theme="dark"] {
  color-scheme:dark;
  --bg:#061526; --surface:#0d2035; --surface-2:#11283f; --surface-3:#18334e;
  --line:#29415a; --line-strong:#526782; --ink:#f7f0dd; --muted:#c8d0d6; --subtle:#aebbc7;
  --primary:#e5b963; --primary-hover:#f1cf88; --on-primary:#061526; --primary-soft:#352e22; --primary-ink:#f1cf88;
  --success:#5ad39c; --success-soft:#11301f; --warning:#f2b95a; --warning-soft:#35270d; --error:#ff8f85; --error-soft:#3b1714;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow:0 4px 14px rgba(0,0,0,.35); --shadow-lg:0 20px 50px rgba(0,0,0,.55);
  --topbar:rgba(6,21,38,.9); --overlay:rgba(0,0,0,.65);
  --pro-ink:#f1cf88; --pro-bg:#352e22; --toast-bg:#f7f0dd; --toast-ink:#061526;
}
@media (prefers-color-scheme:dark) {
  :root[data-theme="system"] {
    color-scheme:dark;
    --bg:#061526; --surface:#0d2035; --surface-2:#11283f; --surface-3:#18334e;
    --line:#29415a; --line-strong:#526782; --ink:#f7f0dd; --muted:#c8d0d6; --subtle:#aebbc7;
    --primary:#e5b963; --primary-hover:#f1cf88; --on-primary:#061526; --primary-soft:#352e22; --primary-ink:#f1cf88;
    --success:#5ad39c; --success-soft:#11301f; --warning:#f2b95a; --warning-soft:#35270d; --error:#ff8f85; --error-soft:#3b1714;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow:0 4px 14px rgba(0,0,0,.35); --shadow-lg:0 20px 50px rgba(0,0,0,.55);
    --topbar:rgba(6,21,38,.9); --overlay:rgba(0,0,0,.65);
    --pro-ink:#f1cf88; --pro-bg:#352e22; --toast-bg:#f7f0dd; --toast-ink:#061526;
  }
}

/* Base */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; min-height:100vh; min-height:100dvh; background:var(--bg); color:var(--ink); font-family:var(--font); font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img,svg { max-width:100%; }
svg { flex-shrink:0; }
button,input,textarea,select { font:inherit; color:inherit; }
button { cursor:pointer; }
h1,h2,h3 { line-height:1.2; }
code { font-family:var(--mono); font-size:.92em; padding:1px 5px; border-radius:4px; background:var(--surface-3); }
[hidden] { display:none!important; }
:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
::selection { background:var(--primary-soft); }
.container { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.container-narrow { width:min(760px,calc(100% - 40px)); }
.muted { color:var(--muted); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:8px; left:8px; z-index:100; padding:12px 18px; color:var(--on-primary); background:var(--primary); border-radius:8px; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.clipboard-fallback { position:fixed; left:-9999px; top:0; }
.kicker { display:inline-block; margin-bottom:8px; color:var(--primary); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.text-link { color:var(--primary); font-weight:600; font-size:13px; }
.text-link:hover { text-decoration:underline; }
.text-warning { color:var(--warning); display:flex; gap:8px; align-items:flex-start; }
.text-warning svg { width:18px; height:18px; margin-top:2px; }

/* Marca e barra superior */
.brand { display:inline-flex; align-items:center; gap:10px; flex-shrink:0; color:var(--ink); }
.brand-mark { display:block; width:40px; height:40px; flex:0 0 40px; border-radius:50%; }
.brand-name { white-space:nowrap; font-size:22px; font-weight:650; letter-spacing:-.055em; line-height:1; }
.brand-name strong { color:var(--primary); font-weight:800; }
.theme-icon { display:none; }
.theme-icon svg { width:18px; height:18px; }
:root:not([data-theme]) .theme-icon-light, :root[data-theme="light"] .theme-icon-light,
:root[data-theme="dark"] .theme-icon-dark, :root[data-theme="system"] .theme-icon-system { display:inline-grid; }
.card-corner { position:absolute; top:14px; right:14px; }
.topbar { position:relative; z-index:20; width:100%; background:var(--topbar); border-bottom:1px solid var(--line); -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px); }
.topbar-sticky, .app-page .topbar { position:sticky; top:0; }
.topbar-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:64px; }
.landing-page .topbar { color:#f8f0dc; background:rgba(4,17,31,.96); border-bottom-color:rgba(229,185,99,.25); }
.landing-page .topbar .brand { color:#f8f0dc; }
.landing-page .topbar .brand-name strong { color:#e5b963; }
.landing-page .topbar .nav, .landing-page .topbar .button-ghost, .landing-page .topbar .icon-button { color:#e0e6e7; }
.landing-page .topbar .nav a:hover, .landing-page .topbar .button-ghost:hover { color:#f1cf88; }
.landing-page .topbar .button-primary { color:#061526; background:#e5b963; }
.landing-page .topbar .button-primary:hover { background:#f1cf88; }
.nav { display:flex; align-items:center; gap:24px; color:var(--muted); font-size:14px; font-weight:600; }
.nav a:hover { color:var(--primary); }
.nav-actions { display:flex; align-items:center; gap:6px; }
.nav-actions form { margin:0; }
.app-nav { display:flex; align-items:center; gap:4px; }
.app-nav a { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; color:var(--muted); font-size:14px; font-weight:600; transition:background .15s,color .15s; }
.app-nav a svg { width:17px; height:17px; }
.app-nav a:hover { color:var(--ink); background:var(--surface-3); }
.app-nav a[aria-current="page"] { color:var(--primary-ink); background:var(--primary-soft); }
.plan-chip { display:inline-flex; margin-right:4px; }

/* Botões */
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:9px 16px; border:1px solid transparent; border-radius:var(--radius); background:none; color:var(--ink); font-size:14px; font-weight:650; line-height:1.2; white-space:nowrap; transition:background .15s,border-color .15s,color .15s,box-shadow .15s,transform .15s; }
.button svg { width:17px; height:17px; }
.button:hover { transform:translateY(-1px); }
.button:active { transform:none; }
.button-primary { color:var(--on-primary); background:var(--primary); box-shadow:0 4px 12px rgba(121,77,17,.2); }
.button-primary:hover { background:var(--primary-hover); }
.button-secondary { color:var(--primary-ink); background:var(--surface); border-color:var(--line-strong); }
.button-secondary:hover { border-color:var(--primary); background:var(--primary-soft); }
.button-ghost { color:var(--muted); }
.button-ghost:hover { color:var(--ink); background:var(--surface-3); }
.button-danger-solid { color:#fff; background:#c0362c; }
.button-danger-solid:hover { background:#a52a21; }
.button-light { color:#061526; background:#f1cf88; }
.button-light:hover { background:#ffe4a9; }
.button-small { min-height:34px; padding:6px 10px; font-size:13px; }
.button-lg { min-height:50px; padding:13px 22px; font-size:15px; border-radius:12px; }
.button-block { width:100%; }
.button.is-static { cursor:default; transform:none; }
.button[aria-busy="true"] { opacity:.7; pointer-events:none; }
.icon-button { display:inline-grid; place-items:center; width:36px; height:36px; border:0; border-radius:var(--radius); color:var(--muted); background:none; list-style:none; transition:background .15s,color .15s; }
.icon-button svg { width:18px; height:18px; }
.icon-button:hover { color:var(--ink); background:var(--surface-3); }
.link-button { padding:0; border:0; background:none; color:var(--primary); font-size:13px; font-weight:650; }
.link-button:hover { text-decoration:underline; }

/* Formulários */
.form-stack { display:grid; gap:18px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:grid; gap:6px; min-width:0; align-content:start; }
.field label, .field legend, fieldset > legend { color:var(--ink); font-size:13px; font-weight:650; }
.optional { color:var(--subtle); font-weight:500; }
.field input,.field textarea,.field select { width:100%; min-height:44px; padding:10px 12px; border:1px solid var(--line-strong); border-radius:var(--radius); outline:0; color:var(--ink); background:var(--surface); transition:border-color .15s,box-shadow .15s; }
.field textarea { min-height:88px; resize:vertical; line-height:1.5; }
.field input::placeholder,.field textarea::placeholder { color:var(--subtle); opacity:.85; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent); }
.field input:disabled { opacity:.55; cursor:not-allowed; }
.field input[aria-invalid="true"] { border-color:var(--error); }
.field-help { color:var(--subtle); font-size:12.5px; line-height:1.45; }
.field-help a { color:var(--primary); text-decoration:underline; }
.field-warning { display:flex; align-items:flex-start; gap:6px; color:var(--warning); font-size:12.5px; font-weight:600; }
.field-warning svg { width:15px; height:15px; margin-top:1px; }
.counter { justify-self:end; color:var(--subtle); font-size:11.5px; font-variant-numeric:tabular-nums; margin-top:-2px; }
.counter.is-near { color:var(--warning); }
.input-group { display:flex; align-items:stretch; min-width:0; border:1px solid var(--line-strong); border-radius:var(--radius); background:var(--surface); transition:border-color .15s,box-shadow .15s; }
.input-group:focus-within { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent); }
.field .input-group input { border:0; box-shadow:none; background:none; min-width:0; flex:1; }
.input-prefix { display:flex; align-items:center; padding:0 0 0 12px; color:var(--subtle); font-family:var(--mono); font-size:12.5px; white-space:nowrap; max-width:55%; overflow:hidden; text-overflow:ellipsis; }
.input-prefix + input { padding-left:2px!important; font-family:var(--mono); font-size:14px; }
.input-addon { flex-shrink:0; margin:4px; padding:0 12px; border:0; border-radius:7px; color:var(--muted); background:var(--surface-3); font-size:12.5px; font-weight:650; }
.input-addon:hover { color:var(--ink); }
.availability { min-height:0; font-size:12.5px; font-weight:650; }
.availability:empty { display:none; }
.availability.is-ok { color:var(--success); }
.availability.is-taken { color:var(--error); }
.check-row { display:flex; align-items:flex-start; gap:9px; color:var(--muted); font-size:13.5px; line-height:1.45; cursor:pointer; }
.check-row input { width:18px; height:18px; margin:1px 0 0; accent-color:var(--primary); flex-shrink:0; }
.check-row a { color:var(--primary); font-weight:600; text-decoration:underline; }
.hp-field { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
fieldset { margin:0; padding:0; border:0; min-width:0; }
fieldset > legend { margin-bottom:8px; padding:0; display:flex; align-items:center; gap:8px; }
.strength { width:100%; height:6px; border:0; border-radius:99px; background:var(--surface-3); }
.strength::-webkit-meter-bar { background:var(--surface-3); border:0; border-radius:99px; height:6px; }
.strength::-webkit-meter-optimum-value { background:var(--success); border-radius:99px; }
.strength::-webkit-meter-suboptimum-value { background:#d99a14; border-radius:99px; }
.strength::-webkit-meter-even-less-good-value { background:var(--error); border-radius:99px; }
.strength:-moz-meter-optimum::-moz-meter-bar { background:var(--success); }
.strength:-moz-meter-sub-optimum::-moz-meter-bar { background:#d99a14; }
.strength:-moz-meter-sub-sub-optimum::-moz-meter-bar { background:var(--error); }
.form-actions { display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:10px; padding-top:18px; margin-top:4px; border-top:1px solid var(--line); }
.form-actions-reverse { flex-direction:row-reverse; justify-content:flex-start; }
.form-actions-center { justify-content:center; border-top:0; }
.sticky-actions { position:sticky; bottom:12px; z-index:5; display:flex; justify-content:flex-end; gap:10px; padding:12px; border:1px solid var(--line); border-radius:var(--radius-lg); background:color-mix(in srgb,var(--surface) 92%,transparent); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:var(--shadow); }
.disclosure { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface-2); }
.disclosure > summary { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; padding:12px 14px; cursor:pointer; font-size:14px; font-weight:650; list-style:none; }
.disclosure > summary::-webkit-details-marker { display:none; }
.disclosure > summary::before { content:'›'; display:inline-block; width:10px; color:var(--subtle); transition:transform .15s; }
.disclosure[open] > summary::before { transform:rotate(90deg); }
.disclosure-body { padding:4px 14px 16px; }
.upsell { display:inline-flex; align-items:center; gap:6px; color:var(--primary); font-size:13px; font-weight:650; }
.upsell svg { width:15px; height:15px; }
.upsell:hover { text-decoration:underline; }
.file-input { position:absolute; width:1px; height:1px; opacity:0; }
.file-input:focus-visible + .check-row, .file-button:focus-within { outline:3px solid var(--primary); }
.file-button { cursor:pointer; }
.file-input:focus-visible ~ .field-help { color:var(--ink); }

/* Switch (checkbox) e toggle (botão) */
.switch-row { display:flex; align-items:flex-start; gap:12px; }
.switch-row label { display:grid; gap:3px; cursor:pointer; }
.switch-label { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:650; }
.switch { appearance:none; position:relative; flex-shrink:0; width:42px; height:24px; margin:0; border-radius:99px; background:var(--line-strong); cursor:pointer; transition:background .18s; }
.switch::after { content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .18s; }
.switch:checked { background:var(--success); }
.switch:checked::after { transform:translateX(18px); }
.switch:disabled { opacity:.5; cursor:not-allowed; }
.toggle { position:relative; width:40px; height:24px; padding:0; border:0; border-radius:99px; background:var(--line-strong); transition:background .18s; }
.toggle-knob { position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .18s; }
.toggle.is-on { background:var(--success); }
.toggle.is-on .toggle-knob { transform:translateX(16px); }

/* Avisos, badges, toast e diálogos */
.flash { display:flex; align-items:flex-start; gap:10px; margin-bottom:18px; padding:12px 12px 12px 14px; border:1px solid transparent; border-radius:var(--radius); font-size:14px; line-height:1.5; animation:slide-in .25s ease-out; }
.flash-icon svg { width:18px; height:18px; margin-top:1px; }
.flash-text { flex:1; }
.flash-close { display:grid; place-items:center; width:26px; height:26px; margin:-2px -2px 0 0; padding:0; border:0; border-radius:6px; color:inherit; background:none; opacity:.7; }
.flash-close:hover { opacity:1; background:rgba(0,0,0,.06); }
.flash-close svg { width:15px; height:15px; }
.flash-error { color:var(--error); background:var(--error-soft); border-color:color-mix(in srgb,var(--error) 25%,transparent); }
.flash-success { color:var(--success); background:var(--success-soft); border-color:color-mix(in srgb,var(--success) 22%,transparent); }
.flash-info { color:var(--primary-ink); background:var(--primary-soft); border-color:color-mix(in srgb,var(--primary) 22%,transparent); }
.notice { display:flex; align-items:flex-start; flex-wrap:wrap; gap:8px 10px; margin-bottom:18px; padding:12px 14px; border-radius:var(--radius); font-size:14px; line-height:1.5; }
.notice > svg { width:18px; height:18px; margin-top:2px; }
.notice > span { flex:1; min-width:200px; }
.notice a { font-weight:700; text-decoration:underline; }
.notice-info { color:var(--primary-ink); background:var(--primary-soft); }
.notice-warning { color:var(--warning); background:var(--warning-soft); }
.badge { display:inline-flex; align-items:center; gap:4px; padding:3px 8px; border-radius:999px; color:var(--muted); background:var(--surface-3); font-size:11.5px; font-weight:700; white-space:nowrap; line-height:1.3; }
.badge svg { width:12px; height:12px; }
.badge-pro { color:var(--pro-ink); background:var(--pro-bg); }
.badge-info { color:var(--primary-ink); background:var(--primary-soft); }
.badge-warning { color:var(--warning); background:var(--warning-soft); }
.toast { position:fixed; z-index:60; bottom:24px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); padding:12px 18px; border-radius:12px; background:var(--toast-bg); color:var(--toast-ink); box-shadow:var(--shadow-lg); font-size:14px; line-height:1.5; animation:slide-in .2s ease-out; }
.dialog { width:min(440px,calc(100% - 32px)); padding:0; border:1px solid var(--line); border-radius:var(--radius-lg); color:var(--ink); background:var(--surface); box-shadow:var(--shadow-lg); }
.dialog::backdrop { background:var(--overlay); }
.dialog[open] { animation:pop-in .18s ease-out; }
.dialog-body { position:relative; display:grid; gap:12px; margin:0; padding:24px; }
.dialog-title { margin:0; font-size:19px; letter-spacing:-.02em; }
.dialog-text { margin:0; color:var(--muted); font-size:14px; }
.dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:10px; margin-top:8px; }
.dialog-close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:34px; height:34px; border:0; border-radius:8px; color:var(--muted); background:none; }
.dialog-close:hover { background:var(--surface-3); }
.dialog-close svg { width:18px; height:18px; }
.dialog-qr { text-align:center; }
.dialog-qr .dialog-actions { justify-content:center; }
.qr-image { justify-self:center; width:240px; height:240px; padding:8px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; }
@keyframes slide-in { from { opacity:0; transform:translateY(6px); } }
@keyframes pop-in { from { opacity:0; transform:scale(.97); } }
.toast { animation-name:toast-in; }
@keyframes toast-in { from { opacity:0; transform:translate(-50%,8px); } }

/* Painel: estrutura */
.app-main { padding:32px 0 72px; }
.page-head { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:14px 18px; margin-bottom:24px; }
.page-head h1 { margin:0 0 6px; font-size:28px; letter-spacing:-.035em; overflow-wrap:anywhere; }
.page-head p { margin:0; color:var(--muted); font-size:14.5px; }
.head-actions { display:flex; flex-wrap:wrap; gap:8px; }
.back-link { display:inline-flex; margin-bottom:14px; color:var(--primary); font-size:13.5px; font-weight:600; }
.back-link:hover { text-decoration:underline; }
.panel { margin-bottom:20px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-sm); }
.panel-pad { padding:24px; }
.panel-body { padding:18px 20px 16px; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 14px; padding:16px 20px; border-bottom:1px solid var(--line); }
.panel-heading h2 { margin:0; font-size:15.5px; }
.panel-heading > span { color:var(--subtle); font-size:12.5px; }
.section-title { display:flex; align-items:center; gap:9px; margin:0 0 4px; font-size:17px; letter-spacing:-.02em; }
.section-title svg { width:19px; height:19px; color:var(--primary); }
.footnote { margin:8px 0 0; color:var(--subtle); font-size:12.5px; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.split .panel { margin-bottom:0; }

/* Painel: compartilhamento, onboarding e métricas */
.share-card { display:flex; align-items:center; gap:16px; margin-bottom:20px; padding:18px 20px; border:1px solid color-mix(in srgb,var(--primary) 28%,var(--line)); border-radius:var(--radius-lg); background:linear-gradient(105deg,var(--primary-soft),var(--surface) 70%); }
.share-avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; background:var(--surface-3); border:2px solid var(--surface); box-shadow:var(--shadow-sm); flex-shrink:0; }
.share-main { flex:1; min-width:0; }
.share-main h2 { margin:0 0 3px; font-size:14px; color:var(--muted); font-weight:650; }
.share-url { display:block; color:var(--primary-ink); font-family:var(--mono); font-size:15px; font-weight:600; overflow-wrap:anywhere; }
.share-url:hover { text-decoration:underline; }
.share-actions { display:flex; flex-wrap:wrap; gap:8px; }
.onboarding { padding:20px; }
.onboarding-head { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:6px 14px; margin-bottom:10px; }
.onboarding-head h2 { margin:0; font-size:16px; }
.onboarding-head span { color:var(--subtle); font-size:13px; }
.progress { display:block; width:100%; height:8px; border:0; border-radius:99px; background:var(--surface-3); overflow:hidden; appearance:none; }
.progress::-webkit-progress-bar { background:var(--surface-3); border-radius:99px; }
.progress::-webkit-progress-value { background:var(--primary); border-radius:99px; transition:width .3s; }
.progress::-moz-progress-bar { background:var(--primary); border-radius:99px; }
.checklist { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:8px 18px; margin:16px 0 0; padding:0; list-style:none; font-size:14px; }
.checklist li { display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; }
.checklist a { color:var(--primary); font-weight:650; }
.checklist a:hover { text-decoration:underline; }
.checklist .is-done > span:not(.check-dot) { color:var(--subtle); text-decoration:line-through; }
.check-dot { display:grid; place-items:center; width:22px; height:22px; border:2px solid var(--line-strong); border-radius:50%; flex-shrink:0; }
.is-done .check-dot { border-color:var(--success); color:#fff; background:var(--success); }
.check-dot svg { width:13px; height:13px; stroke-width:3; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; }
.stats-3 { grid-template-columns:repeat(3,1fr); }
.stat { display:grid; align-content:start; gap:4px; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-sm); min-width:0; }
.stat small { color:var(--muted); font-size:12.5px; font-weight:650; }
.stat strong { font-size:28px; font-weight:750; letter-spacing:-.035em; font-variant-numeric:tabular-nums; line-height:1.15; }
.stat .stat-text { font-size:22px; }
.stat-note { color:var(--subtle); font-size:12px; }
.trend-up { color:var(--success); font-weight:700; }
.trend-down { color:var(--error); font-weight:700; }
.usage { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px 18px; margin-bottom:20px; padding:14px 18px; border:1px dashed var(--line-strong); border-radius:var(--radius-lg); background:var(--surface-2); font-size:13.5px; }
.usage-text { display:flex; flex-direction:column; }
.usage-text span { color:var(--subtle); font-size:12.5px; }
.usage-cta { display:inline-flex; align-items:center; gap:6px; color:var(--primary); font-weight:700; }
.usage-cta svg { width:15px; height:15px; }
.usage-cta:hover { text-decoration:underline; }

/* Gráficos */
.chart { margin:0; }
.chart-svg { display:block; width:100%; height:150px; overflow:visible; }
.chart-fill { fill:var(--primary); opacity:.85; }
.chart-hit { fill:transparent; }
.chart-bar:hover .chart-fill { opacity:1; }
.chart-bar:hover .chart-hit { fill:color-mix(in srgb,var(--primary) 8%,transparent); }
.chart-axis { stroke:var(--line-strong); stroke-width:1; vector-effect:non-scaling-stroke; }
.chart-caption { display:flex; justify-content:space-between; gap:12px; margin-top:8px; color:var(--subtle); font-size:12px; font-variant-numeric:tabular-nums; }
.chart-empty { color:var(--muted); text-align:center; }
.breakdown { display:grid; gap:14px; margin:0; padding:0; list-style:none; }
.breakdown li { display:grid; grid-template-columns:1fr auto; gap:6px 12px; font-size:14px; }
.breakdown .progress { grid-column:1/-1; height:6px; }
.breakdown-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.breakdown-value { font-weight:700; font-variant-numeric:tabular-nums; }
.breakdown-value small { color:var(--subtle); font-weight:500; }
.segmented { display:inline-flex; gap:2px; margin-bottom:18px; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.segmented a { display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:9px; color:var(--muted); font-size:13.5px; font-weight:650; }
.segmented a svg { width:13px; height:13px; }
.segmented a:hover { color:var(--ink); background:var(--surface-3); }
.segmented a[aria-current="page"] { color:var(--on-primary); background:var(--primary); }
.segmented a.is-locked { color:var(--subtle); }
.stats-title { display:flex; align-items:center; gap:14px; min-width:0; }
.stats-title h1 { margin-bottom:4px; }
.stats-title .link-meta { margin:0; }

/* Lista de links */
.filter-bar { display:flex; align-items:center; gap:10px; padding:14px 20px; border-bottom:1px solid var(--line); background:var(--surface-2); }
.field-grow { flex:1; }
.filter-bar .field input,.filter-bar .field select { min-height:40px; }
.list-hint { margin:0; padding:10px 20px; border-bottom:1px solid var(--line); color:var(--subtle); font-size:12.5px; }
.list-hint svg { width:14px; height:14px; vertical-align:-2px; }
.link-list { margin:0; padding:0; list-style:none; }
.link-row { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:14px; padding:14px 20px; border-bottom:1px solid var(--line); background:var(--surface); transition:background .15s; }
.link-list[data-reorder] .link-row { grid-template-columns:18px auto minmax(0,1fr) auto auto; gap:12px; padding-left:10px; }
.link-row:last-child { border-bottom:0; border-radius:0 0 var(--radius-lg) var(--radius-lg); }
.link-row:hover { background:var(--surface-2); }
.link-row.is-muted .link-icon,.link-row.is-muted .link-title strong { opacity:.6; }
.link-row.is-dragging { opacity:.5; }
.link-row.is-drop-target { box-shadow:inset 0 2px 0 var(--primary); }
.drag-handle { display:grid; place-items:center; color:var(--line-strong); cursor:grab; }
.drag-handle svg { width:16px; height:16px; }
.link-row:hover .drag-handle { color:var(--subtle); }
.link-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; color:var(--primary); background:var(--primary-soft); }
.link-icon svg { width:20px; height:20px; }
.link-icon-lg { width:52px; height:52px; border-radius:14px; }
.link-icon-lg svg { width:26px; height:26px; }
.link-main { min-width:0; }
.link-title { display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; }
.link-title strong { font-size:14.5px; overflow-wrap:anywhere; }
.link-meta { display:flex; align-items:baseline; flex-wrap:wrap; gap:2px 12px; margin-top:3px; font-size:12.5px; min-width:0; }
.short-url { color:var(--primary-ink); font-family:var(--mono); font-size:12.5px; overflow-wrap:anywhere; }
.short-url:hover { text-decoration:underline; }
.link-destination { min-width:0; max-width:100%; overflow:hidden; color:var(--subtle); white-space:nowrap; text-overflow:ellipsis; flex:1 1 180px; }
.link-destination::before { content:'→ '; }
.link-clicks { display:grid; justify-items:end; padding:4px 8px; border-radius:8px; color:var(--muted); font-size:11.5px; line-height:1.2; }
.link-clicks strong { color:var(--ink); font-size:16px; font-variant-numeric:tabular-nums; }
.link-clicks:hover { background:var(--surface-3); }
.row-actions { display:flex; align-items:center; gap:2px; }
.row-actions form { margin:0; display:flex; }
.row-actions .toggle { margin-right:6px; }
.menu { position:relative; }
.menu > summary { list-style:none; cursor:pointer; }
.menu > summary::-webkit-details-marker { display:none; }
.menu[open] > summary { color:var(--ink); background:var(--surface-3); }
.menu.menu-up .menu-list { top:auto; bottom:calc(100% + 6px); }
.menu-list { position:absolute; right:0; top:calc(100% + 6px); z-index:15; display:grid; min-width:210px; padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-lg); animation:pop-in .12s ease-out; }
.menu-list form { margin:0; }
.menu-item { display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:8px; color:var(--ink); background:none; font-size:14px; font-weight:500; text-align:left; }
.menu-item svg { width:16px; height:16px; color:var(--muted); }
.menu-item:hover { background:var(--surface-3); }
.menu-danger { color:var(--error); }
.menu-danger svg { color:var(--error); }
.empty { padding:48px 24px; color:var(--muted); text-align:center; }
.empty strong { display:block; margin-bottom:6px; color:var(--ink); font-size:16px; }
.empty p { max-width:420px; margin:6px auto 18px; line-height:1.6; }
.empty-icon { display:grid; place-items:center; width:52px; height:52px; margin:0 auto 14px; border-radius:16px; background:var(--primary-soft); color:var(--primary); }
.empty-icon svg { width:24px; height:24px; }
.pagination { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:14px; padding:16px; border-top:1px solid var(--line); color:var(--muted); font-size:13.5px; }
.limit-card { max-width:620px; margin:0 auto 20px; text-align:center; }
.limit-card h2 { margin:0 0 8px; font-size:20px; }
.limit-card p { margin:0 auto; max-width:460px; color:var(--muted); }

/* Editor com prévia */
.editor { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:24px; }
.editor > form.panel { margin-bottom:0; }
.editor > form .panel { margin-bottom:0; }
.preview { position:sticky; top:84px; display:grid; justify-items:center; gap:12px; }
.preview-label { display:flex; align-items:center; gap:6px; color:var(--subtle); font-size:12.5px; font-weight:650; }
.preview-label svg { width:15px; height:15px; }
.preview-note { text-align:center; }
.icon-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(44px,1fr)); gap:6px; }
.icon-option { position:relative; cursor:pointer; }
.icon-option input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.icon-tile { display:grid; place-items:center; height:44px; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:var(--surface); transition:border-color .15s,background .15s,color .15s; }
.icon-tile svg { width:20px; height:20px; }
.icon-auto { font-size:11.5px; font-weight:800; letter-spacing:.02em; }
.icon-option:hover .icon-tile { border-color:var(--line-strong); color:var(--ink); }
.icon-option input:checked + .icon-tile { border-color:var(--primary); color:var(--primary); background:var(--primary-soft); box-shadow:inset 0 0 0 1px var(--primary); }
.icon-option input:focus-visible + .icon-tile { outline:3px solid var(--primary); outline-offset:2px; }
.schedule .form-grid { margin-top:10px; }
.schedule .upsell { margin-top:8px; }
.avatar-field { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.avatar-preview { width:96px; height:96px; border-radius:50%; object-fit:cover; background:var(--surface-3); border:3px solid var(--surface); box-shadow:var(--shadow); }
.avatar-controls { display:grid; gap:8px; justify-items:start; flex:1; min-width:220px; }
.theme-picker { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:12px; }
.theme-option { position:relative; display:grid; gap:8px; cursor:pointer; }
.theme-option input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.theme-option.is-locked { cursor:not-allowed; }
.theme-option.is-locked .theme-swatch { opacity:.55; }
.theme-swatch { display:grid; align-content:start; justify-items:center; gap:6px; height:118px; padding:14px 12px; border:2px solid var(--line); border-radius:14px; overflow:hidden; transition:border-color .15s,box-shadow .15s; }
.theme-option input:checked + .theme-swatch { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 25%,transparent); }
.theme-option input:focus-visible + .theme-swatch { outline:3px solid var(--primary); outline-offset:3px; }
.swatch-avatar { width:26px; height:26px; border-radius:50%; background:var(--pp-accent); }
.swatch-line { width:60%; height:6px; border-radius:4px; background:var(--pp-ink); opacity:.7; }
.swatch-card { width:100%; height:18px; border-radius:6px; background:var(--pp-card); border:1px solid var(--pp-card-border); }
.theme-name { display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:13px; font-weight:650; }

/* Celular de prévia */
.phone { width:100%; max-width:300px; border:8px solid #111827; border-radius:36px; background:var(--pp-bg); box-shadow:var(--shadow-lg); overflow:hidden; }
.phone-screen { display:grid; justify-items:center; gap:8px; min-height:470px; padding:30px 16px 22px; color:var(--pp-ink); }
.phone-avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; border:3px solid var(--pp-card); background:var(--pp-media); }
.phone-name { font-weight:750; font-size:16px; text-align:center; overflow-wrap:anywhere; }
.phone-tagline { max-width:230px; margin-top:-4px; margin-bottom:6px; color:var(--pp-muted); font-size:12px; text-align:center; overflow-wrap:anywhere; }
.phone-tagline:empty { display:none; }
.phone .public-link { width:100%; gap:12px; padding:11px 12px; border-radius:12px; }
.phone .public-link-media { flex-basis:32px; width:32px; height:32px; }
.phone .public-link-media svg { width:17px; height:17px; }
.phone .public-link-title { font-size:13.5px; line-height:1.3; }
.phone .public-link-description { font-size:11.5px; line-height:1.35; margin-top:2px; }
.phone-line { width:100%; height:44px; border-radius:12px; background:var(--pp-card); border:1px solid var(--pp-card-border); opacity:.55; }
.phone-line-short { opacity:.3; }
.public-link-static { pointer-events:none; }

/* Planos */
.current-plan { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px 24px; }
.current-plan h2 { display:flex; align-items:center; gap:10px; margin:0 0 6px; font-size:22px; letter-spacing:-.03em; }
.current-plan p { margin:0; color:var(--muted); font-size:14px; }
.current-plan > div { flex:1; min-width:240px; }
.current-plan .progress { max-width:360px; margin-top:10px; }
.current-plan form { margin:0; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pricing-grid-2 { grid-template-columns:repeat(2,minmax(0,420px)); justify-content:center; }
.price-card { position:relative; display:flex; flex-direction:column; padding:28px; border:1px solid var(--line); border-radius:var(--radius-xl); background:var(--surface); box-shadow:var(--shadow); }
.price-card.featured { border:2px solid var(--primary); box-shadow:0 18px 40px color-mix(in srgb,var(--primary) 18%,transparent); }
.price-flag { position:absolute; top:-12px; left:28px; padding:4px 10px; border-radius:99px; color:var(--on-primary); background:var(--primary); font-size:11.5px; font-weight:800; letter-spacing:.03em; }
.price-card h3 { margin:0; font-size:19px; }
.price-tagline { margin:4px 0 16px; color:var(--muted); font-size:14px; }
.price { font-size:38px; font-weight:800; letter-spacing:-.05em; line-height:1; }
.price small { margin-left:4px; color:var(--subtle); font-size:14px; font-weight:600; letter-spacing:0; }
.price-alt { min-height:40px; margin:8px 0 18px; color:var(--muted); font-size:13px; }
.price-list { display:grid; align-content:start; gap:10px; flex:1; margin:0 0 24px; padding:18px 0 0; border-top:1px solid var(--line); list-style:none; font-size:14px; }
.price-list li { display:flex; align-items:flex-start; gap:10px; }
.price-list svg { width:18px; height:18px; margin-top:1px; color:var(--success); stroke-width:2.5; }
.price-actions { display:grid; gap:10px; }
.price-actions form { margin:0; }
.faq { display:grid; gap:10px; margin-top:28px; }
.faq > h2 { margin:0 0 6px; font-size:20px; }
.faq details { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.faq summary { position:relative; padding:15px 44px 15px 18px; cursor:pointer; font-weight:650; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; position:absolute; right:18px; top:12px; color:var(--primary); font-size:20px; font-weight:600; transition:transform .15s; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { margin:0; padding:0 18px 16px; color:var(--muted); line-height:1.65; }
.checkout-card { max-width:560px; margin:0 auto; }
.checkout-card h1 { margin:0; font-size:24px; }
.summary { display:grid; gap:0; margin:0; border:1px solid var(--line); border-radius:var(--radius); }
.summary div { display:flex; justify-content:space-between; gap:14px; padding:12px 14px; border-bottom:1px solid var(--line); }
.summary div:last-child { border-bottom:0; }
.summary dt { color:var(--muted); }
.summary dd { margin:0; font-weight:600; text-align:right; overflow-wrap:anywhere; }
.danger-zone { border-color:color-mix(in srgb,var(--error) 35%,var(--line)); }
.danger-zone .section-title svg { color:var(--error); }

/* Landing */
.landing-flash { padding-top:18px; }
.hero { padding:80px 0 96px; overflow:hidden; color:#f8f0dc; background:radial-gradient(650px 420px at 80% 40%,#163454 0%,transparent 75%),linear-gradient(135deg,#020b16,#071b30 60%,#061526); border-bottom:1px solid #765321; }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:48px; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; padding:7px 13px; border:1px solid rgba(229,185,99,.35); border-radius:999px; color:#f1cf88; background:rgba(229,185,99,.1); font-size:12px; font-weight:750; letter-spacing:.04em; text-transform:uppercase; }
.eyebrow::before { content:''; width:6px; height:6px; border-radius:50%; background:#f1cf88; box-shadow:0 0 10px #f1cf88; }
.hero h1 { max-width:640px; margin:18px 0 16px; font-size:clamp(38px,5.4vw,60px); line-height:1.04; letter-spacing:-.055em; }
.hero h1 span { color:#e5b963; }
.hero-copy > p { max-width:540px; margin:0; color:#c7d2dc; font-size:18px; line-height:1.65; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.microcopy { display:flex; flex-wrap:wrap; gap:8px 18px; margin:18px 0 0; padding:0; color:#d2dbe0; list-style:none; font-size:13.5px; }
.microcopy li { display:flex; align-items:center; gap:6px; }
.microcopy svg { width:16px; height:16px; color:#e5b963; stroke-width:2.5; }
.hero-visual { position:relative; padding:0 48px 28px 0; min-width:0; }
.hero-globe { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:50%; box-shadow:0 0 0 1px rgba(229,185,99,.42),0 34px 90px rgba(0,0,0,.5); }
.hero .button-primary { color:#061526; background:#e5b963; box-shadow:0 6px 22px rgba(229,185,99,.2); }
.hero .button-primary:hover { background:#f1cf88; }
.hero .button-secondary { color:#f7edcf; border-color:rgba(229,185,99,.65); background:rgba(6,21,38,.6); }
.hero .button-secondary:hover { color:#061526; background:#f1cf88; }
.mockup { position:relative; padding:14px; border:1px solid var(--line-strong); border-radius:18px; background:var(--surface); box-shadow:var(--shadow-lg); transform:rotate(-1.2deg); }
.mockup-dots { display:flex; gap:6px; padding:2px 4px 12px; }
.mockup-dots i { width:9px; height:9px; border-radius:50%; background:#ff6159; }
.mockup-dots i:nth-child(2) { background:#ffbd2e; }
.mockup-dots i:nth-child(3) { background:#28c941; }
.mockup-card { display:grid; gap:12px; padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2); }
.mockup-card > * { min-width:0; }
.mockup-label { color:var(--muted); font-size:12.5px; font-weight:700; }
.mockup-url { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 8px 8px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--primary-ink); font-family:var(--mono); font-size:13px; }
.mockup-url span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mockup-url b { display:inline-flex; align-items:center; gap:5px; flex-shrink:0; padding:6px 10px; border-radius:7px; color:var(--on-primary); background:var(--primary); font-family:var(--font); font-size:12px; }
.mockup-url b svg { width:13px; height:13px; }
.mockup-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.mockup-stat { display:grid; gap:2px; min-width:0; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.mockup-stat small { color:var(--muted); font-size:11px; font-weight:650; }
.mockup-stat strong { font-size:21px; font-weight:750; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.mockup-stat em { overflow:hidden; color:var(--success); font-size:10.5px; font-style:normal; font-weight:700; white-space:nowrap; text-overflow:ellipsis; }
.mockup-stat em.is-muted { color:var(--subtle); font-weight:600; }
.mockup-chart { padding:12px 12px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.mockup-chart svg { display:block; width:100%; height:56px; }
.mockup-chart rect { fill:var(--primary); opacity:.8; }
.mockup-chart rect:last-child { opacity:1; }
.mockup-links { margin:0; padding:0; list-style:none; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.mockup-links li { display:flex; align-items:center; gap:10px; padding:8px 12px; border-bottom:1px solid var(--line); font-size:12.5px; }
.mockup-links li:last-child { border-bottom:0; }
.mockup-links .link-icon { width:28px; height:28px; border-radius:8px; }
.mockup-links .link-icon svg { width:15px; height:15px; }
.mockup-links strong { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:650; }
.mockup-count { color:var(--muted); font-weight:650; font-variant-numeric:tabular-nums; }
.mockup-toggle { position:relative; flex-shrink:0; width:28px; height:16px; border-radius:99px; background:var(--success); }
.mockup-toggle::after { content:""; position:absolute; top:2px; right:2px; width:12px; height:12px; border-radius:50%; background:#fff; }
.phone-float { position:absolute; right:0; bottom:0; width:186px; border:5px solid #d8aa55; border-radius:28px; transform:rotate(5deg); }
.phone-float .phone-screen { min-height:0; gap:6px; padding:18px 10px 16px; }
.phone-float .phone-avatar { width:40px; height:40px; border-width:2px; }
.phone-float .phone-name { font-size:13px; }
.phone-float .phone-tagline { margin:-4px 0 4px; font-size:10px; }
.phone-float .public-link { gap:8px; padding:7px 8px; border-radius:9px; }
.phone-float .public-link-media { flex-basis:22px; width:22px; height:22px; border-radius:6px; }
.phone-float .public-link-media svg { width:12px; height:12px; }
.phone-float .public-link-title { font-size:11px; }
.section { padding:80px 0; }
.section-alt { background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-heading { max-width:640px; margin:0 auto 40px; text-align:center; }
.section-heading h2 { margin:0 0 10px; font-size:clamp(26px,3.4vw,34px); letter-spacing:-.04em; }
.section-heading p { margin:0; color:var(--muted); line-height:1.6; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card { padding:24px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--shadow-sm); transition:transform .2s,box-shadow .2s; }
.feature-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.feature-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; color:var(--primary); background:var(--primary-soft); }
.feature-icon svg { width:22px; height:22px; }
.feature-card h3 { margin:18px 0 8px; font-size:17px; }
.feature-card p { margin:0; color:var(--muted); font-size:14.5px; line-height:1.65; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:0; padding:0; list-style:none; counter-reset:none; }
.steps li { padding:24px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--bg); }
.step-number { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; color:var(--on-primary); background:var(--primary); font-weight:800; }
.steps h3 { margin:16px 0 6px; font-size:17px; }
.steps p { margin:0; color:var(--muted); font-size:14.5px; line-height:1.6; }
.section-cta { display:flex; justify-content:center; margin-top:32px; }
.cta-band { padding:64px 0; background:radial-gradient(480px 240px at 82% 50%,#173a59,transparent),linear-gradient(120deg,#020b16,#09243d); color:#f8f0dc; border-top:1px solid #765321; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.cta-inner h2 { margin:0; font-size:clamp(24px,3vw,32px); letter-spacing:-.035em; }
.footer { padding:32px 0; color:var(--muted); font-size:13.5px; background:var(--surface); border-top:1px solid var(--line); }
.footer-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px 24px; }
.footer-links { display:flex; flex-wrap:wrap; gap:6px 20px; }
.footer-links a:hover { color:var(--primary); text-decoration:underline; }
.footer .brand-mark { width:34px; height:34px; flex-basis:34px; }
.footer .brand-name { font-size:19px; }
.prose { padding-bottom:24px; line-height:1.7; }
.prose h1 { margin:0 0 8px; font-size:34px; letter-spacing:-.04em; }
.prose h2 { margin:32px 0 8px; font-size:19px; }
.prose p { margin:0 0 12px; color:var(--muted); }
.prose a { color:var(--primary); text-decoration:underline; }

/* Autenticação e erros */
.auth-page { display:grid; place-items:center; min-height:100vh; min-height:100dvh; padding:32px 16px; background:radial-gradient(640px 360px at 85% 0,color-mix(in srgb,var(--primary) 14%,transparent),transparent 70%),var(--bg); }
.auth-card { position:relative; width:min(100%,440px); padding:34px; border:1px solid var(--line); border-radius:var(--radius-xl); background:var(--surface); box-shadow:var(--shadow-lg); }
.auth-card .brand { display:flex; justify-content:center; margin-bottom:22px; }
.auth-card .brand-mark { width:48px; height:48px; flex-basis:48px; }
.auth-card .brand-name { font-size:27px; }
.auth-card h1 { margin:0 0 6px; text-align:center; font-size:24px; letter-spacing:-.035em; }
.auth-subtitle { margin:0 0 24px; color:var(--muted); font-size:14.5px; text-align:center; }
.auth-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.check-terms { font-size:13px; }
.auth-footer { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; text-align:center; }
.auth-footer a { color:var(--primary); font-weight:700; }
.auth-footer p { margin:10px 0 0; font-size:13px; }
.error-card { text-align:center; }
.error-code { display:block; margin-bottom:6px; color:var(--primary); font-size:56px; font-weight:800; letter-spacing:-.06em; line-height:1; }
.error-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }

/* Página pública: temas */
.public-theme { --pp-bg:radial-gradient(900px 420px at 50% -10%,rgba(216,170,85,.17),transparent 70%),#f7f5ef; --pp-ink:#102338; --pp-muted:#47566a; --pp-card:#fffefa; --pp-card-border:#e8dfcd; --pp-card-ink:#102338; --pp-card-muted:#5c6875; --pp-accent:#956117; --pp-accent-ink:#fff; --pp-media:#f7eacb; --pp-media-ink:#744a10; }
.theme-noturno { --pp-bg:radial-gradient(900px 420px at 50% -10%,rgba(77,141,255,.2),transparent 70%),#0f1417; --pp-ink:#eef2f6; --pp-muted:#aab4c3; --pp-card:#182026; --pp-card-border:#26313a; --pp-card-ink:#eef2f6; --pp-card-muted:#a3adbb; --pp-accent:#7fb0ff; --pp-accent-ink:#06142b; --pp-media:#243039; --pp-media-ink:#c9d4e2; }
.theme-oceano { --pp-bg:linear-gradient(165deg,#0b3d91 0%,#1560bd 45%,#0ea5a4 100%); --pp-ink:#fff; --pp-muted:rgba(255,255,255,.88); --pp-card:rgba(255,255,255,.97); --pp-card-border:rgba(255,255,255,.4); --pp-card-ink:#0b2447; --pp-card-muted:#4a5d78; --pp-accent:#0b63ce; --pp-accent-ink:#fff; --pp-media:#e0efff; --pp-media-ink:#0b63ce; }
.theme-aurora { --pp-bg:linear-gradient(165deg,#3b0f7a 0%,#6d28d9 45%,#2563eb 100%); --pp-ink:#fff; --pp-muted:rgba(255,255,255,.88); --pp-card:rgba(255,255,255,.97); --pp-card-border:rgba(255,255,255,.4); --pp-card-ink:#1e1245; --pp-card-muted:#5b5373; --pp-accent:#6d28d9; --pp-accent-ink:#fff; --pp-media:#efe7ff; --pp-media-ink:#6d28d9; }
.theme-floresta { --pp-bg:radial-gradient(900px 420px at 50% -10%,rgba(31,122,77,.16),transparent 70%),#eef5ef; --pp-ink:#15261c; --pp-muted:#46594d; --pp-card:#fff; --pp-card-border:#d5e5d9; --pp-card-ink:#15261c; --pp-card-muted:#56695d; --pp-accent:#1f7a4d; --pp-accent-ink:#fff; --pp-media:#e1f0e6; --pp-media-ink:#1f7a4d; }
.theme-por-do-sol { --pp-bg:linear-gradient(170deg,#ffe7c7 0%,#ffc1a6 50%,#ff9fb1 100%); --pp-ink:#3a0f1d; --pp-muted:#6b3440; --pp-card:rgba(255,255,255,.93); --pp-card-border:rgba(255,255,255,.7); --pp-card-ink:#3a0f1d; --pp-card-muted:#7a4a55; --pp-accent:#c92a62; --pp-accent-ink:#fff; --pp-media:#ffe3ea; --pp-media-ink:#c92a62; }
.theme-grafite { --pp-bg:#18181b; --pp-ink:#fafafa; --pp-muted:#a1a1aa; --pp-card:#27272a; --pp-card-border:#3f3f46; --pp-card-ink:#fafafa; --pp-card-muted:#a1a1aa; --pp-accent:#fafafa; --pp-accent-ink:#18181b; --pp-media:#3f3f46; --pp-media-ink:#fafafa; }
.theme-lavanda { --pp-bg:radial-gradient(900px 420px at 50% -10%,rgba(109,74,255,.16),transparent 70%),#f5f2ff; --pp-ink:#1f1638; --pp-muted:#544a70; --pp-card:#fff; --pp-card-border:#e4dcff; --pp-card-ink:#1f1638; --pp-card-muted:#5f5680; --pp-accent:#6d4aff; --pp-accent-ink:#fff; --pp-media:#efeaff; --pp-media-ink:#6d4aff; }
.theme-swatch { background:var(--pp-bg); }
body.public-page { color-scheme:light; }
body.public-page.theme-noturno, body.public-page.theme-grafite { color-scheme:dark; }
body.public-page { display:flex; flex-direction:column; color:var(--pp-ink); background:var(--pp-bg); background-attachment:fixed; }
.owner-bar { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px 16px; padding:9px 16px; color:#fff; background:#151a21; font-size:13px; text-align:center; }
.owner-bar svg { width:15px; height:15px; vertical-align:-3px; }
.owner-bar a { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:8px; background:rgba(255,255,255,.14); font-weight:700; }
.owner-bar a:hover { background:rgba(255,255,255,.24); }
.public-topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; max-width:720px; margin:0 auto; padding:16px 20px; }
.public-brand { color:var(--pp-ink); font-size:15px; font-weight:700; opacity:.9; overflow-wrap:anywhere; }
.public-share { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--pp-card-border); border-radius:999px; color:var(--pp-card-ink); background:var(--pp-card); box-shadow:0 2px 8px rgba(0,0,0,.08); }
.public-share svg { width:18px; height:18px; }
.public-share:hover { transform:translateY(-1px); }
.public-main { flex:1; display:flex; justify-content:center; padding:8px 16px 56px; }
.profile-shell { width:100%; max-width:640px; }
.profile-hero { display:flex; flex-direction:column; align-items:center; margin-bottom:32px; text-align:center; }
.profile-avatar { width:112px; height:112px; margin-bottom:16px; border:4px solid var(--pp-card); border-radius:50%; object-fit:cover; background:var(--pp-media); box-shadow:0 8px 24px rgba(0,0,0,.12); }
.profile-name { margin:0 0 8px; color:var(--pp-ink); font-size:28px; line-height:1.2; letter-spacing:-.035em; overflow-wrap:anywhere; }
.profile-tagline { max-width:30rem; margin:0; color:var(--pp-muted); font-size:16px; line-height:1.6; overflow-wrap:anywhere; white-space:pre-line; }
.public-links { display:flex; flex-direction:column; gap:14px; margin:0; padding:0; list-style:none; }
.public-link { display:flex; align-items:center; gap:16px; padding:16px 18px; border:1px solid var(--pp-card-border); border-radius:16px; color:var(--pp-card-ink); background:var(--pp-card); box-shadow:0 2px 10px rgba(0,0,0,.05); transition:transform .2s,box-shadow .2s,border-color .2s; }
a.public-link:hover { border-color:var(--pp-accent); box-shadow:0 10px 26px rgba(0,0,0,.12); transform:translateY(-2px); }
a.public-link:active { transform:scale(.99); }
.public-link-media { position:relative; display:grid; place-items:center; flex:0 0 46px; width:46px; height:46px; overflow:hidden; border-radius:12px; color:var(--pp-media-ink); background:var(--pp-media); transition:background .2s,color .2s; }
.public-link-media svg { width:22px; height:22px; }
.public-link-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
a.public-link:hover .public-link-media { color:var(--pp-accent-ink); background:var(--pp-accent); }
.public-link-body { flex:1; min-width:0; }
.public-link-title { display:block; color:var(--pp-card-ink); font-size:16px; font-weight:650; line-height:1.35; overflow-wrap:anywhere; }
.public-link-description { display:block; margin-top:3px; color:var(--pp-card-muted); font-size:13.5px; line-height:1.45; overflow-wrap:anywhere; }
.public-link-description:empty { display:none; }
.chevron { color:var(--pp-card-muted); font-size:22px; line-height:1; transition:transform .2s; }
a.public-link:hover .chevron { color:var(--pp-accent); transform:translateX(2px); }
.public-empty { padding:32px 20px; border:1px dashed var(--pp-card-border); border-radius:16px; color:var(--pp-muted); text-align:center; }
.public-empty strong { color:var(--pp-ink); }
.public-footer { display:flex; justify-content:center; padding:12px 16px 32px; }
.public-cta { display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border:1px solid var(--pp-card-border); border-radius:999px; color:var(--pp-card-muted); background:var(--pp-card); font-size:13px; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.public-cta:hover { color:var(--pp-card-ink); }
.public-cta .brand-mark { width:28px; height:28px; flex-basis:28px; }
.public-cta strong { color:var(--pp-card-ink); }

/* Responsivo */
@media (max-width:980px) {
  .editor { grid-template-columns:1fr; }
  .preview { position:static; }
  .editor .preview .phone { max-width:280px; }
  .editor .phone-screen { min-height:0; }
  .editor .phone-line { display:none; }
  [data-profile-form] ~ .preview { display:none; }
}
@media (max-width:860px) {
  .hero-grid { grid-template-columns:1fr; gap:48px; }
  .hero-visual { width:100%; max-width:560px; justify-self:center; }
  .feature-grid,.steps { grid-template-columns:1fr 1fr; }
  .pricing-grid,.pricing-grid-2 { grid-template-columns:minmax(0,480px); }
  .stats { grid-template-columns:repeat(2,1fr); }
  .stats-3 { grid-template-columns:repeat(3,1fr); }
  .nav { display:none; }
  .split { grid-template-columns:1fr; }
  .split .panel { margin-bottom:0; }
  .usage { grid-template-columns:1fr; }
  /* Navegação do painel vira uma barra inferior no celular. */
  .app-page { padding-bottom:calc(68px + env(safe-area-inset-bottom)); }
  .app-page .topbar { -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--bg); }
  .app-nav { position:fixed; z-index:30; left:0; right:0; bottom:0; justify-content:space-around; gap:0; padding:6px 6px calc(6px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:var(--topbar); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
  .app-nav a { flex:1; flex-direction:column; gap:3px; padding:6px 4px; border-radius:10px; font-size:11px; }
  .app-nav a svg { width:20px; height:20px; }
  .app-nav a[aria-current="page"] { background:none; }
  .toast { bottom:calc(84px + env(safe-area-inset-bottom)); }
  .sticky-actions { bottom:calc(76px + env(safe-area-inset-bottom)); }
}
@media (max-width:640px) {
  body { font-size:14.5px; }
  .button { white-space:normal; text-align:center; }
  .form-stack > * { min-width:0; }
  .container,.container-narrow { width:calc(100% - 32px); }
  .topbar-inner { min-height:58px; gap:10px; }
  .brand-mark { width:34px; height:34px; flex-basis:34px; }
  .brand-name { font-size:19px; }
  .hide-sm { display:none; }
  .nav-actions .button { padding:8px 10px; }
  .landing-page .nav-actions .button-ghost { padding:8px; }
  .app-main { padding:22px 0 40px; }
  .page-head { align-items:stretch; }
  .page-head h1 { font-size:24px; }
  .page-head > .button { width:100%; }
  .panel-pad { padding:18px; }
  .form-grid { grid-template-columns:1fr; }
  .share-card { flex-wrap:wrap; padding:16px; }
  .share-actions { width:100%; }
  .share-actions { display:grid; grid-template-columns:repeat(3,1fr); }
  .share-actions .button { flex-direction:column; gap:4px; min-height:58px; padding:8px 4px; font-size:12.5px; }
  .stats,.stats-3 { grid-template-columns:repeat(2,1fr); gap:10px; }
  .stat { padding:14px; }
  .stat strong { font-size:23px; }
  .filter-bar { flex-wrap:wrap; padding:12px 14px; }
  .filter-bar .field-grow { flex-basis:100%; }
  .filter-bar .field:not(.field-grow) { flex:1; }
  .link-row,.link-list[data-reorder] .link-row { grid-template-columns:auto minmax(0,1fr) auto; gap:4px 12px; padding:14px; }
  .drag-handle { display:none; }
  .link-row .row-actions { grid-column:1/-1; justify-content:flex-end; padding-top:6px; }
  .link-row .row-actions .toggle { margin-right:auto; }
  .link-clicks { grid-row:1; grid-column:3; }
  .panel-heading,.list-hint { padding-left:14px; padding-right:14px; }
  .form-actions,.form-actions-reverse { flex-direction:column-reverse; align-items:stretch; }
  .form-actions-reverse { flex-direction:column; }
  .form-actions .button { width:100%; }
  .sticky-actions .button { flex:1; }
  .hero { padding:44px 0 64px; }
  .hero h1 { font-size:clamp(34px,10vw,42px); }
  .hero-copy > p { font-size:16.5px; }
  .hero-actions .button { width:100%; }
  .hero-visual { padding:0; }
  .mockup { transform:none; padding:10px; }
  .mockup-card { gap:10px; padding:12px; }
  .mockup-stat { padding:9px; }
  .mockup-stat strong { font-size:17px; }
  .mockup-stat em { display:none; }
  .phone-float { display:none; }
  .section { padding:56px 0; }
  .feature-grid,.steps { grid-template-columns:1fr; }
  .cta-inner { flex-direction:column; align-items:stretch; text-align:center; }
  .auth-card { padding:26px 20px; }
  .segmented { display:flex; }
  .segmented a { flex:1; justify-content:center; padding:7px 8px; }
  .stats-title { align-items:flex-start; }
  .link-icon-lg { width:44px; height:44px; }
  .head-actions { width:100%; }
  .head-actions > * { flex:1; }
  .profile-name { font-size:24px; }
  .profile-avatar { width:96px; height:96px; }
  .public-link { gap:14px; padding:14px; }
  .public-link-media { flex-basis:42px; width:42px; height:42px; }
  .theme-picker { grid-template-columns:repeat(2,1fr); }
  .current-plan { flex-direction:column; align-items:stretch; }
  .price-card { padding:24px 20px; }
}
@media (max-width:380px) {
  /* Nas páginas públicas o botão de tema continua disponível no rodapé. */
  body:not(.app-page) .topbar .theme-toggle { display:none; }
}
@media (max-width:360px) {
  .plan-chip { display:none; }
  .stats,.stats-3 { grid-template-columns:1fr 1fr; }
  .stat strong { font-size:20px; }
}
@media (hover:none) { .drag-handle { display:none; } .link-list[data-reorder] .link-row { grid-template-columns:auto minmax(0,1fr) auto auto; padding-left:20px; } }
@media (hover:none) and (max-width:640px) { .link-list[data-reorder] .link-row { grid-template-columns:auto minmax(0,1fr) auto; padding-left:14px; } }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; scroll-behavior:auto!important; }
  .button:hover,a.public-link:hover,.feature-card:hover { transform:none; }
}
@media print {
  .topbar,.app-nav,.share-actions,.row-actions,.filter-bar,.toast { display:none!important; }
  body { background:#fff; }
}