/* ══════════════════════════════════════════════════════════════════════ TOKENS DO SOLOS — fonte única Decidido pelo Fabio em 29/08/2026, depois do inventário do #197 e da medição do #199. O lime oficial do produto é #C3EA4F. ── POR QUE EXISTEM DOIS ESCOPOS, E POR QUE NÃO SE UNIFICAM ── `:root` e `#v50-base-shell` declaram os MESMOS NOMES com valores diferentes, e isso é DE PROPÓSITO. Não é conflito, não é descuido, e NÃO DEVE SER COLAPSADO: --ink :root #0A0A0A · base #1a1a17 --accent :root #0f172a · base #c3ea4f --glass :root .7 · base .55 --glass-stroke :root .58 · base .8 --line :root #e7eaf0 · base #d4d4cc A Base (a aba do Studio) tem paleta própria, escopada na própria casca. Nenhuma das duas telas está errada hoje — colapsar num valor só QUEBRARIA UMA DELAS. Se você chegou aqui pensando em unificar: já foi medido, já foi decidido, e a decisão foi manter. Ver docs/tokens-dois-escopos.md. ── OS QUATRO ESCOPOS ── :root o app inteiro — Atlas, login, telas gerais #v50-base-shell a Base / Studio #v14-panel-neg a aba Negociações (re-tema lime sobre a Neg) .solos-landing a landing pública ── ORDEM ── Este arquivo é carregado DEPOIS de todos os outros, então ele vence. Os valores aqui são os EFETIVOS — foram lidos do navegador com getComputedStyle, não copiados de um arquivo. Trocar um valor aqui muda a tela; é esse o ponto. Blocos de token que ainda existem em SOLOS-V1.html continuam lá porque o arquivo não pode ser refatorado nesta frente. Eles são inertes: este arquivo carrega os mesmos valores efetivos. Ver o doc. ══════════════════════════════════════════════════════════════════════ */ :root { --accent: #0f172a; /* ADICIONADO em 29/08/2026: a tinta que se le sobre o lime. Ja existia no escopo da Base; passa a existir tambem aqui porque o Atlas precisou dela quando o lime convergiu (#199). Nao muda nada sozinho — token novo so vale onde e usado. */ --accent-ink: #2d3a0f; /* ── A MOLDURA FLUTUANTE DA BASE, disponivel para o app inteiro ── Estes quatro ja existiam, mas so dentro de #v50-base-shell. Sobem para ca porque a topbar do Atlas passou a usa-los (Frente 2, 29/08): e o vidro quente com sombra longa da Base, no lugar do branco frio que o Atlas tinha. Os valores sao IDENTICOS aos da Base — nao ha duas versoes. */ --floating-panel: rgba(250,249,245,.76); --floating-border: rgba(255,255,255,.84); --floating-shadow: 0 28px 80px rgba(15,15,12,.12), 0 8px 22px rgba(15,15,12,.07), inset 0 1px 0 rgba(255,255,255,.88); --floating-fill: linear-gradient(145deg, rgba(255,255,255,.80), rgba(250,249,245,.76)); /* ── RAIOS, que ate agora eram 200+ valores soltos ── r-pill e a forma dominante nas DUAS telas (999px, 22x na Base e 58x no Atlas). r-card e o 28px que a Base usa nos paineis flutuantes. */ --sol-r-pill: 999px; --sol-r-card: 28px; --sol-r-btn: 12px; /* ── A CAPSULA DA TOPBAR DO ATLAS — 29/08/2026, PR 3 ── Papel novo, e por isso token novo em vez de reaproveitar --floating-* no lugar errado. Um painel flutuante da Base e pequeno e pousa sobre a tela; esta capsula atravessa a largura inteira POR CIMA DO MAPA. Com o --floating-fill (segundo degrau em .76) ela vira uma faixa leitosa que esconde o mapa de ponta a ponta; os valores do mockup aprovado abrem o segundo degrau para .46 e a sombra fica um passo mais funda, que e o que faz a capsula descolar do mapa em vez de manchar. Borda e raio continuam sendo os tokens de sempre — o que muda e so o que precisava mudar. */ --capsula-fill: linear-gradient(145deg, rgba(255,255,255,.80), rgba(255,255,255,.46)); --capsula-shadow: 0 28px 80px rgba(13,17,23,.13); /* ── O BOTAO LIME COM VIDRO — padrao da landing, 29/08/2026 ── Valores do mockup que o Fabio aprovou. Os tres degraus do gradiente e a tinta viram token para nao virarem hex solto em cinco lugares. Conferido: a tinta da 10,94:1 sobre o degrau medio e 9,99:1 sobre o mais escuro — acima dos 9,3:1 que ele anotou. */ --lime-g1: #D4F077; --lime-g2: #C3EA4F; --lime-g3: #B4E23A; --lime-fill: linear-gradient(150deg, #D4F077 0%, #C3EA4F 46%, #B4E23A 100%); --lime-borda: rgba(143,178,39,.55); --lime-sombra: inset 0 1px 0 rgba(255,255,255,.62), inset 0 -1px 0 rgba(90,120,20,.14), 0 10px 24px rgba(143,178,39,.30), 0 2px 5px rgba(90,120,20,.14); /* "um passo mais forte" no hover: os dois externos crescem; os dois internos ficam, porque sao o brilho da superficie e nao a elevacao. */ --lime-sombra-hover: inset 0 1px 0 rgba(255,255,255,.62), inset 0 -1px 0 rgba(90,120,20,.14), 0 14px 32px rgba(143,178,39,.38), 0 3px 8px rgba(90,120,20,.18); --lime-ink: #1e2a08; /* O lime que serve para TEXTO e TRACO sobre fundo claro: 6,25:1 sobre o off-white. O lime claro daria 1,19:1 — e a licao que ja custou tres rodadas hoje. */ --lime-dark: #4A6310; /* ── AS TRES CAMADAS DE FUNDO DA BASE, agora disponiveis para o app ── Medidas com getComputedStyle na casca da Base (#202): a casca e #F7F5EF, o #app dentro dela e #F4F4F0, e os paineis sao o gradiente 145 graus. Os dois primeiros ja existiam mas SO no escopo #v50-base-shell; sobem para ca com valor identico, mesmo movimento que os --floating-* fizeram no #201. */ --v33-bg: #f7f5ef; --bg: #f4f4f0; /* Desfoque dos paineis flutuantes — o da Base, medido: blur(34px) saturate(1.6). Ate agora nao tinha token, e cada tela usava um numero diferente (12 no card do mapa, 52 no painel de lotes, 28 na topbar). */ --painel-blur: blur(34px) saturate(1.6); /* O que aparece SOB o mapa, antes de os tiles chegarem. Era #DDDDDD, e nem era nosso: vinha do .leaflet-container do proprio Leaflet, que e seletor de CLASSE e ganhava do nosso .v14-map-canvas por vir depois na ordem das folhas (o leaflet.css e injetado em tempo de execucao). A correcao e de ESPECIFICIDADE, nao de !important — ver v16_1-spa.css. O tom acompanha a casca. */ --map-fundo: #f0eee8; --amber: #F59E0B; --app-bg: #f3f5f8; --bronze-dk: #8A7858; --bronze-lt: #C8B08A; --font-display: 'Jost',sans-serif; --font-mono: 'Jost',sans-serif; --glass: rgba(255,255,255,.7); --glass-bg: rgba(255,255,255,.42); --glass-bg-2: rgba(255,255,255,.22); --glass-blur: 28px; --glass-border: rgba(255,255,255,.9); --glass-dim: rgba(0,0,0,.06); --glass-hl: rgba(255,255,255,.65); --glass-hover: rgba(255,255,255,.85); --glass-inner: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.05); --glass-radius: 26px; --glass-sat: 170%; --glass-shadow: 0 30px 80px rgba(0,0,0,.10); --glass-shadow-soft: 0 14px 40px rgba(0,0,0,.08); --glass-stroke: rgba(255,255,255,.58); --glass-stroke-2: rgba(255,255,255,.22); --green: #059669; --green-dk: #047857; --green-lt: #10B981; --ink: #0A0A0A; --ink-05: rgba(10,10,10,.05); --ink-10: rgba(10,10,10,.1); --ink-20: rgba(10,10,10,.2); --ink-30: rgba(10,10,10,.3); --ink-40: rgba(10,10,10,.4); --ink-50: rgba(10,10,10,.5); --ink-60: rgba(10,10,10,.6); --ink-70: rgba(10,10,10,.7); --line: #e7eaf0; --muted: #64748b; --nav: #101820; --nav-2: #3b4859; --off-white: #FAFAF8; --owner30-bg: #f6f7f9; --owner30-blur: 22px; --owner30-card: rgba(255,255,255,.92); --owner30-muted: rgba(10,10,12,.56); --owner30-radius-l: 22px; --owner30-radius-m: 16px; --owner30-radius-xl: 28px; --owner30-shadow1: 0 30px 80px rgba(0,0,0,.10); --owner30-shadow2: 0 12px 32px rgba(0,0,0,.06); --owner30-stroke: rgba(255,255,255,.45); --owner30-stroke-soft: rgba(0,0,0,.06); --owner30-text: rgba(10,10,12,.92); --panel: #ffffff; --paper: #eeecea; --rd-amber: #d97706; --rd-amber-bg: rgba(217,119,6,.07); --rd-bg: #eeecea; --rd-blue: #8FAF0E; --rd-blue-bg: rgba(194,232,18,.10); --rd-card: rgba(255,255,255,.55); --rd-fb: 'Jost', sans-serif; --rd-fh: 'Jost', sans-serif; --rd-fm: 'Jost', sans-serif; --rd-green: #059669; --rd-green-bg: rgba(5,150,105,.08); --rd-green-br: rgba(5,150,105,.22); --rd-green-dk: #047857; --rd-ink: #0A0A0A; --rd-ink-10: rgba(13,17,23,.10); --rd-ink-20: rgba(13,17,23,.20); --rd-ink-40: rgba(13,17,23,.40); --rd-ink-6: rgba(13,17,23,.06); --rd-ink-60: rgba(13,17,23,.60); --rd-inset: inset 0 1px 2px rgba(10,10,10,.04); --rd-pill-press: inset 2px 2px 5px rgba(13,17,23,.14), inset -1px -1px 4px rgba(255,255,255,.40); --rd-pill-raise: 3px 3px 8px rgba(13,17,23,.10), -2px -2px 6px rgba(255,255,255,.76); --rd-r: 14px; --rd-r-pill: 999px; --rd-r-sm: 10px; --rd-raise: 0 2px 4px rgba(10,10,10,.06), 0 1px 2px rgba(10,10,10,.04), inset 0 1px 0 rgba(255,255,255,.9); --rd-raise-lg: 0 4px 6px rgba(10,10,10,.05), 0 2px 4px rgba(10,10,10,.03), inset 0 1px 0 rgba(255,255,255,.9); --rd-raise-sm: 0 1px 2px rgba(10,10,10,.04), inset 0 1px 0 rgba(255,255,255,.85); --rd-surface: #eeecea; --rd-w22: rgba(255,255,255,.22); --rd-w50: rgba(255,255,255,.50); --rd-w70: rgba(255,255,255,.70); --rd-w90: rgba(255,255,255,.90); --red: #DC2626; --red-dk: #B91C1C; --red-lt: #EF4444; --shadow-lg: 0 10px 15px rgba(10,10,10,.08),0 4px 6px rgba(10,10,10,.04); --shadow-md: 0 4px 6px rgba(10,10,10,.05),0 2px 4px rgba(10,10,10,.03); --shadow-sm: 0 2px 4px rgba(10,10,10,.06),0 1px 2px rgba(10,10,10,.04); --shadow-xl: 0 20px 25px rgba(10,10,10,.1),0 10px 10px rgba(10,10,10,.04); --shadow-xs: 0 1px 2px rgba(10,10,10,.04); --text: #111827; --text-soft: rgba(18,18,18,.62); --text-strong: rgba(18,18,18,.92); --white: #FFF; } /* A BASE / STUDIO — paleta própria. Ver o cabeçalho antes de mexer. */ #v50-base-shell { --accent: #c3ea4f; --accent-ink: #2d3a0f; --bg: #f4f4f0; --bg-2: #e8e8e2; --danger: #ff4444; --envelope: rgba(255,68,68,0.14); --envelope-edge: #ff4444; --floating-border: rgba(255,255,255,.84); --floating-panel: rgba(250,249,245,.76); --floating-shadow: 0 28px 80px rgba(15,15,12,.12), 0 8px 22px rgba(15,15,12,.07), inset 0 1px 0 rgba(255,255,255,.88); --glass: rgba(255,255,255,0.55); --glass-stroke: rgba(255,255,255,0.8); --ink: #1a1a17; --ink-2: #4a4a44; --ink-3: #8a8a82; --lime: #c3ea4f; --lime-soft: rgba(195,234,79,.18); --lime-stroke: rgba(195,234,79,.48); --lime-strong: #a9ee35; --line: #d4d4cc; --v33-bg: #f7f5ef; --v33-panel-bg: rgba(250,249,245,.82); --v34-glass-bg: rgba(255,255,255,.62); --v34-glass-bg-strong: rgba(255,255,255,.74); --v34-glass-border: rgba(255,255,255,.88); --v34-line-soft: rgba(20,20,18,.075); --v34-shadow: 0 18px 60px rgba(18,18,14,.095), inset 0 1px 0 rgba(255,255,255,.92); --v35-ease: cubic-bezier(.2,.8,.2,1); --v35-shadow-hover: 0 26px 86px rgba(18,18,14,.12), 0 8px 24px rgba(18,18,14,.06), inset 0 1px 0 rgba(255,255,255,.96); --v35-shadow-rest: 0 18px 60px rgba(18,18,14,.08), inset 0 1px 0 rgba(255,255,255,.92); --v35-top-offset: 136px; --v36-sidebar-top: 146px; --v37-sidebar-top: 106px; --v38-sidebar-top: 90px; } /* NEGOCIAÇÕES — re-tema lime sobre a aba (era verde-bandeira). ATENÇÃO, achado registrado: o re-tema foi PARCIAL. --neg-green virou lime (#8FAF0E) mas --neg-green-border, -fill e -glow continuam no verde antigo rgba(45,122,88). Está assim hoje na tela; não foi tocado aqui porque corrigir muda a aparência. Ver docs/tokens-dois-escopos.md. */ #v14-panel-neg { --neg-amber: #d4820a; --neg-amber-bg: rgba(212,130,10,0.10); --neg-amber-border: rgba(201,122,16,0.38); --neg-amber-fill: rgba(201,122,16,0.10); --neg-amber-glow: rgba(201,122,16,0.18); --neg-amber-text: #8a5200; --neg-b-soft: rgba(0,0,0,0.07); --neg-b-white: rgba(255,255,255,0.92); --neg-blue: #2563a8; --neg-blue-bg: rgba(37,99,168,0.09); --neg-cream: #f4f3ef; --neg-cream2: #eceae4; --neg-glass: rgba(250,249,245,0.88); --neg-glass2: rgba(255,255,255,0.66); --neg-green: #8FAF0E; --neg-green-bg: rgba(194,232,18,0.16); --neg-green-border: rgba(45,122,88,0.35); --neg-green-fill: rgba(45,122,88,0.11); --neg-green-glow: rgba(45,122,88,0.22); --neg-green-light: #C2E812; --neg-green-text: #5c7009; --neg-ink: #1a1a18; --neg-ink2: #3d3d3a; --neg-muted: #8a8880; --neg-red: #c94040; --neg-red-bg: rgba(201,64,64,0.09); --neg-red-border: rgba(201,64,64,0.35); --neg-red-fill: rgba(201,64,64,0.08); --neg-red-text: #8b2020; } /* LANDING pública. */ .solos-landing { --sl-amber: #d97706; /* [29/08/2026] O SISTEMA DA LANDING PASSA A SER O DA BASE (opcao C). Saiu o neumorfismo: fundo cinza-azulado frio, card azulado e sombra DUPLA (escura de um lado, branca do outro). Entrou o vidro: off-white quente, gradiente 145 graus e UMA sombra longa. Os valores sao os mesmos do #v50-base-shell — nao ha duas versoes do vidro. Esta e a copia que VENCE; a do bloco inline do SOLOS-V1.html foi alinhada no mesmo commit para nao contradizer. */ --sl-bg: #f7f5ef; --sl-card: rgba(250,249,245,.76); --sl-dark: #0d1117; /* --sl-green serve DOIS papeis: 3 preenchimentos e 10 TEXTOS. Por isso ele nao vira o lime claro — como texto sobre fundo claro o lime da 1,19:1. Ele vira o LIME ESCURO (6,25:1 sobre o novo fundo), que e lime de verdade e se le. O preenchimento tem token proprio. */ --sl-green: #4A6310; --sl-green-fill: #C3EA4F; /* --sl-inset deixa de ser sombra dupla: vira o afundado discreto que o vidro pede, so para campo de formulario. */ --sl-inset: inset 0 1px 2px rgba(15,15,12,.10), inset 0 0 0 1px rgba(255,255,255,.55); --sl-muted: rgba(20,24,33,.62); /* a sombra longa da Base, UMA direcao — era a dupla neumorfica */ --sl-raise: 0 28px 80px rgba(15,15,12,.12), 0 8px 22px rgba(15,15,12,.07), inset 0 1px 0 rgba(255,255,255,.88); --sl-raise-sm: 0 10px 28px rgba(15,15,12,.09), 0 3px 8px rgba(15,15,12,.05), inset 0 1px 0 rgba(255,255,255,.85); --sl-text: #141821; --sl-white: #ffffff; /* o vidro do card: mesmos --floating-* da Base, so com nome de landing para quem le o CSS dela saber de onde vem */ --sl-card-fill: linear-gradient(145deg, rgba(255,255,255,.80), rgba(250,249,245,.76)); --sl-card-border: rgba(255,255,255,.84); --sl-card-blur: blur(28px) saturate(1.4); /* os dois derivados do lime que ja existiam no escopo da Base, com o MESMO valor: rgba(195,234,79) e exatamente o #C3EA4F. Servem os papeis pale — fundo de destaque e traco decorativo — sem hex novo. */ --lime-soft: rgba(195,234,79,.18); --lime-stroke: rgba(195,234,79,.48); }