/*
Tarotsi visual identity:
Deep navy, muted violet, sage and copper create a nocturnal esoterism palette that blends with the dark apps without copying Tarotki's black/gold/red.
Literata keeps the editorial/library tone; Inter keeps dense tool navigation legible.
The site should feel like a calm night archive for practical divination tools, with cream text and restrained copper accents.
*/
:root{
  --ts-nav-h:72px;
  --paper:#101827;
  --ink:#f4eadc;
  --muted:#b9c0c9;
  --line:rgba(222,214,200,.18);
  --sage:#8ab3a1;
  --sage-2:rgba(138,179,161,.16);
  --copper:#d1845c;
  --violet:#8d7cc5;
  --white:#18243a;
  --shadow:0 20px 55px rgba(0,0,0,.28);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 18% 0%,rgba(141,124,197,.18),transparent 34%),radial-gradient(circle at 82% 12%,rgba(138,179,161,.13),transparent 30%),linear-gradient(180deg,#101827 0%,#121b2d 48%,#0d1422 100%);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.55;letter-spacing:0}
a{color:inherit;text-decoration:none}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ts-nav{position:fixed;inset:0 0 auto;z-index:9999;min-height:var(--ts-nav-h);display:flex;align-items:center;gap:18px;padding:10px clamp(16px,4vw,42px);background:rgba(16,24,39,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}
.ts-brand{display:flex;align-items:center;gap:10px;font-family:Literata,serif;font-size:1.35rem;font-weight:700;white-space:nowrap}
.ts-brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--copper);border-radius:50%;color:var(--copper);background:rgba(209,132,92,.08);font-size:.9rem}
.ts-menu{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:4px;max-width:calc(100% - 230px);overflow-x:auto}
.ts-menu a{display:flex;align-items:center;gap:7px;padding:9px 10px;border-radius:8px;color:var(--muted);font-size:.92rem;white-space:nowrap}
.ts-menu a:hover,.ts-menu a.is-active{background:var(--sage-2);color:var(--ink)}
.ts-nav-toggle{display:none;border:1px solid var(--line);background:#172238;border-radius:8px;padding:8px 10px;color:var(--ink)}
.ts-page{padding-top:var(--ts-nav-h)}
.ts-hero{min-height:72vh;display:grid;place-items:end center;text-align:center;padding:calc(var(--ts-nav-h) + 44px) clamp(18px,5vw,80px) 64px;background:radial-gradient(circle at 50% 12%,rgba(141,124,197,.22),transparent 34%),linear-gradient(140deg,rgba(138,179,161,.12),rgba(209,132,92,.10) 45%,rgba(141,124,197,.16)),transparent;border-bottom:1px solid var(--line)}
.ts-hero--small{min-height:38vh}
.ts-hero>div{max-width:860px}
.ts-kicker{margin:0 0 12px;color:var(--copper);font-weight:700;text-transform:uppercase;font-size:.78rem;letter-spacing:.08em}
h1,h2,h3{font-family:Literata,Georgia,serif;line-height:1.1;letter-spacing:0}
h1{font-size:clamp(2.3rem,6vw,5.6rem);margin:0 0 18px}
h2{font-size:clamp(1.45rem,3vw,2.2rem);margin:0 0 18px}
.ts-hero p:not(.ts-kicker){max-width:720px;margin:0 auto;font-size:clamp(1.05rem,2vw,1.35rem);color:#d5d0c7}
.ts-section,.tk-seo,.ts-article,.ts-app-seo-wrap{width:min(1160px,calc(100% - 36px));margin:0 auto;padding:48px 0}
.tk-grid--3,.tk-grid--4,.tk-grid--auto{display:grid;gap:16px}
.tk-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tk-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.tk-grid--auto{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.ts-card{display:flex;flex-direction:column;gap:12px;min-height:156px;padding:20px;background:rgba(24,36,58,.82);border:1px solid var(--line);border-radius:8px;box-shadow:0 1px 0 rgba(255,255,255,.03);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.ts-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:rgba(209,132,92,.45)}
.ts-card svg{color:var(--sage)}
.ts-card strong{font-size:1.05rem}
.ts-card span{color:var(--muted);font-size:.94rem}
.ts-card--row{min-height:122px}
.ts-question-groups{display:grid;gap:44px}
.ts-question-group{padding-bottom:38px;border-bottom:1px solid var(--line)}
.ts-question-group:last-child{padding-bottom:0;border-bottom:0}
.ts-question-group__head{max-width:780px;margin:0 0 18px}
.ts-question-group__head h2{margin:0 0 10px;font-size:1.75rem}
.ts-question-group__head p:last-child{margin:0;color:#d4d0c9;max-width:720px}
.ts-button{display:inline-flex;align-items:center;justify-content:center;margin-top:18px;padding:10px 16px;border-radius:8px;background:var(--copper);color:#101827;font-weight:700}
.tk-seo{border-top:1px solid var(--line)}
.tk-seo .tk-lead{font-size:1.12rem;color:#ddd4c8}
.tk-copy-block{margin:28px 0}
.tk-copy-block p,.tk-faq p,.ts-article p{color:#d4d0c9}
.tk-faq details{background:rgba(24,36,58,.82);border:1px solid var(--line);border-radius:8px;padding:14px 16px;margin:10px 0}
.tk-faq summary{cursor:pointer;font-weight:700}
.ts-related{width:min(1160px,100%);margin:0 auto;padding:10px 0 52px;border-top:1px solid var(--line)}
.ts-related h2{margin:0 0 18px}
.ts-card--related{min-height:112px;padding:16px}
.ts-card--related strong{font-size:1rem}
.ts-az{position:sticky;top:var(--ts-nav-h);z-index:10;display:flex;justify-content:center;gap:6px;overflow:auto;padding:12px clamp(18px,5vw,80px);background:rgba(16,24,39,.94);border-bottom:1px solid var(--line)}
.ts-az a{min-width:32px;text-align:center;padding:6px;border-radius:7px;color:var(--muted)}
.ts-az a:hover{background:var(--sage-2);color:var(--ink)}
.ts-article{max-width:850px}
.ts-legal-section{margin:26px 0;padding:22px;background:rgba(24,36,58,.72);border:1px solid var(--line);border-radius:8px}
.ts-legal-section h2{font-size:1.35rem;margin-bottom:10px}
.ts-contact-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:28px;padding:24px;background:rgba(24,36,58,.82);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}
.ts-contact-form label{display:grid;gap:7px;color:var(--muted);font-weight:700}
.ts-contact-form__full,.ts-contact-form button,.ts-form-note{grid-column:1/-1}
.ts-contact-form input,.ts-contact-form textarea{width:100%;border:1px solid rgba(222,214,200,.22);border-radius:8px;background:#101827;color:var(--ink);font:inherit;padding:12px 13px}
.ts-contact-form input:focus,.ts-contact-form textarea:focus{outline:none;border-color:var(--copper);box-shadow:0 0 0 3px rgba(209,132,92,.16)}
.ts-contact-form button{justify-self:start;border:0;border-radius:8px;background:var(--copper);color:#101827;font-weight:800;padding:12px 18px;cursor:pointer}
.ts-form-note{margin:0;color:var(--muted);font-size:.92rem}
.ts-footer{display:flex;justify-content:space-between;gap:24px;padding:34px clamp(18px,5vw,80px);border-top:1px solid var(--line);background:#0c1320;color:#c9c3ba}
.ts-footer p{margin:.35rem 0 0}
.ts-footer nav{display:flex;flex-wrap:wrap;gap:14px}
.ts-footer a{text-decoration:underline;text-underline-offset:3px}
.ts-app-seo-wrap{background:var(--paper)}
.ts-noscript{box-shadow:var(--shadow)}
.ts-app-page{background:var(--paper)!important}
body:has(.ts-nav) {
  background:
    radial-gradient(circle at 18% 0%,rgba(141,124,197,.18),transparent 34%),
    radial-gradient(circle at 82% 12%,rgba(138,179,161,.13),transparent 30%),
    linear-gradient(180deg,#101827,#0d1422),
    var(--paper);
}
body:has(.tarot-container),
body:has(.tp-container),
body:has(.numerology-container),
body:has(#belline-app),
body:has(#angeles-app),
body:has(#alomancia-app),
body:has(#velomancia-app),
body:has(#caracolomancia-app),
body:has(.maya-app-container),
body:has(.egipcio-app-container),
body:has(.aritmomancia-container),
body:has(.bio-container),
body:has(.zodiac-compat-container),
body:has(.cafe-container) {
  background:var(--paper)!important;
}
.ts-app-page,
.tarot-container,
.tp-container,
.numerology-container,
#belline-app,
#angeles-app,
#alomancia-app,
#velomancia-app,
#caracolomancia-app,
.maya-app-container,
.egipcio-app-container,
.aritmomancia-container,
.bio-container,
.zodiac-compat-container,
.cafe-container,
[class*="app-container"],
[id$="-app"] {
  --black:#18243a;
  --deep:#1b2a3d;
  --surface:#223249;
  --surface-2:#26384f;
  --surface-3:#2c4058;
  --bg-primary:#18243a;
  --bg-secondary:#223249;
  --bg-card:#26384f;
  --bg-card-2:#2c4058;
  --bg-card2:#2c4058;
  --bg-input:#26384f;
  --bg-deep:#18243a;
  --bg-dark:#18243a;
  --bg-main:#18243a;
  --bg-panel:#1b2a3d;
  --bg-app:#18243a;
  --bg-surface:#26384f;
  --bg-hover:#2c4058;
  --bg-modal:#223249;
  --clr-bg:#18243a;
  --clr-bg-alt:#223249;
  --clr-surface:#26384f;
  --negro:#18243a;
  --oscuro:#1b2a3d;
  --panel:#223249;
  --panel2:#26384f;
  --obsidian:#18243a;
  --onyx:#1b2a3d;
  --carbon:#223249;
  --slate:#26384f;
  --smoke:#2c4058;
  --tp-bg:#18243a;
  --tp-bg-alt:#223249;
  --tp-surface:#223249;
  --tp-card-back:#1b2a3d;
  --vel-bg:#18243a;
  --vel-bg-mid:#1b2a3d;
  --vel-bg-surface:#26384f;
  --cap-bg:#18243a;
  --cap-bg-mid:#1b2a3d;
  --cap-bg-surface:#26384f;
  --cap-bg-card:#26384f;
  --cafe-bg:#18243a;
  --cafe-bg-warm:#1b2a3d;
  --cafe-surface:#26384f;
  --cafe-surface-alt:#2c4058;
  --cafe-border:#597082;
  --cafe-border-light:#7f96a6;
  --alo-bg-deep:#18243a;
  --alo-bg-dark:#1b2a3d;
  --alo-bg-mid:#223249;
  --alo-bg-surface:#26384f;
  --car-bg-deep:#18243a;
  --car-bg-mid:#1b2a3d;
  --car-bg-surface:#223249;
  --car-bg-card:rgba(38,56,79,.94);
  --cos-bg:#18243a;
  --cos-bg-alt:#223249;
  --cos-surface:#26384f;
  --cos-surface-light:#2c4058;
  --maya-bg:#18243a;
  --maya-dark:#223249;
  --maya-card-bg:#26384f;
  --egipcio-bg:#18243a;
  --egipcio-card-bg:#26384f;
  --hc-bg-dark:#18243a;
  --cosmos-deep:#18243a;
  --cosmos-mid:#1b2a3d;
  --bg-heaven:#18243a;
  border-top:1px solid rgba(222,214,200,.2);
  border-bottom:1px solid rgba(222,214,200,.2);
}
#hd-app,
#hj-app,
#signo-solar-app,
#zc-app,
#asc-app,
#ca-app {
  --white:#f8efe0;
  --white-dim:rgba(248,239,224,.78);
  --white-faint:rgba(248,239,224,.34);
  --muted:#d9cfc2;
  --muted-d:#b8aa9b;
  --amber:#e0a86d;
  --amber-l:#ffd083;
  --amber-d:#bf7148;
  --copper:#d1845c;
  --rose:#ff8a78;
  --aurora:#e0c688;
  --gold:#e0c688;
  --gold-light:#f4d894;
  --gold-dim:#c7a86c;
  --vermillion:#ff7b6f;
  --vermillion-dim:#d98b80;
  --border:rgba(224,168,109,.28);
  --border-b:rgba(224,168,109,.48);
  --border-bright:rgba(244,216,148,.58);
}
#zc-app {
  --bg-card:#223249;
  --bg-panel:rgba(34,50,73,.94);
  --bg-selected:rgba(166,180,255,.22);
  --indigo:#a6b4ff;
  --indigo-d:#7b88df;
  --indigo-l:#d6ddff;
  --violet:#c8a9ff;
  --gold:#e0c688;
  --gold-d:#b99a58;
  --teal:#9fd4c2;
  --amber:#e0c688;
}
#asc-app,
#ca-app {
  --bg-deep:#18243a;
  --bg-card:#223249;
  --gold:#e0c688;
  --gold-light:#f4d894;
  --gold-dim:#c7a86c;
  --white:#f8efe0;
  --white-dim:rgba(248,239,224,.82);
  --white-faint:rgba(248,239,224,.48);
  --border:rgba(224,168,109,.28);
  --border-bright:rgba(244,216,148,.58);
  --sign-color:#f4d894;
}
#hd-app .hd-selector-label,
#hd-app .hd-day-btn,
#hd-app .hd-tile-name,
#hd-app .hd-tile-dates,
#hd-app .hd-loading-text,
#hd-app .hd-result-date,
#hd-app .hd-modal-msg,
#hj-app .hj-subtitle,
#hj-app .hj-form-hint,
#hj-app .hj-info-card-body,
#hj-app .hj-result-text,
#hj-app .hj-year-select,
#hj-app .hj-form-error,
#signo-solar-app .solar-subtitle,
#signo-solar-app .form-hint,
#signo-solar-app .date-select,
#signo-solar-app .info-card-body,
#signo-solar-app .sign-dates-label,
#zc-app .zc-subtitle,
#zc-app .zc-selector-hint,
#zc-app .zc-chosen-dates,
#zc-app .zc-chosen-empty,
#zc-app .zc-grid-label,
#zc-app .zc-tile-name,
#zc-app .zc-loading-text,
#zc-app .zc-modal-msg,
#zc-app .zc-affinity-val,
#zc-app .zc-trio-text,
#asc-app .asc-subtitle,
#asc-app .date-select,
#asc-app .city-input,
#asc-app .city-option,
#asc-app .city-option.city-no-results,
#asc-app .dst-note,
#asc-app .loading-text,
#asc-app .res-degree,
#asc-app .info-card-body,
#ca-app .ca-subtitle,
#ca-app .date-select,
#ca-app .city-input,
#ca-app .city-option,
#ca-app .city-option.city-no-results,
#ca-app .dst-note,
#ca-app .loading-text,
#ca-app .planet-degree,
#ca-app .info-card-body {
  color:#ddd4c8;
}
#hd-app .hd-tile-glyph,
#hj-app .hj-deco-subtitle,
#hj-app .hj-ornament,
#zc-app .zc-header-glyph,
#zc-app .zc-tile-glyph,
#zc-app .zc-vs-text,
#zc-app .zc-ornament,
#asc-app .asc-deco,
#asc-app .ornament,
#asc-app .city-search-icon,
#ca-app .ca-deco,
#ca-app .ornament,
#ca-app .city-search-icon {
  color:#d8b082;
}
#hd-app .hd-sign-tile,
#hj-app .hj-form-card,
#hj-app .hj-info-card,
#signo-solar-app .form-card,
#signo-solar-app .info-card,
#zc-app .zc-chosen-card,
#zc-app .zc-sign-tile,
#zc-app .zc-result-pill,
#zc-app .zc-trio-card,
#zc-app .zc-modal,
#asc-app .form-card,
#asc-app .info-card,
#asc-app .city-list,
#ca-app .form-card,
#ca-app .planet-card,
#ca-app .info-card,
#ca-app .city-list {
  background:rgba(34,50,73,.92);
  border-color:rgba(224,168,109,.28);
}
#asc-app .date-select,
#asc-app .city-input,
#ca-app .date-select,
#ca-app .city-input {
  background-color:#223249;
  color:#f8efe0;
  border-color:rgba(244,216,148,.58);
}
#asc-app .date-select option,
#ca-app .date-select option {
  background:#18243a;
  color:#f8efe0;
}
#asc-app .city-input::placeholder,
#ca-app .city-input::placeholder {
  color:rgba(248,239,224,.58);
}
#asc-app .city-option:hover,
#ca-app .city-option:hover {
  background:rgba(224,168,109,.16);
}
#zener-app {
  --bg:#101827;
  --bg-card:#f1e6d4;
  --bg-dark:#101827;
  --ink:#1b2533;
  --ink-dim:#314156;
  --ink-faint:#667286;
  --red:#9d2d31;
  --red-light:#d76a65;
  --green:#26734a;
  --border:#253244;
  --border-light:rgba(37,50,68,.24);
  --gold:#c99d66;
  background-color:#101827;
}
#zener-app .lab-stamp,
#zener-app .zener-subtitle,
#zener-app .intro-desc,
#zener-app .rounds-label,
#zener-app .test-counter,
#zener-app .card-instruction,
#zener-app .report-label,
#zener-app .esp-meter-labels,
#zener-app .history-title,
#zener-app .history-item.miss {
  color:#4f5c70;
}
#zener-app .intro-box,
#zener-app .card-back,
#zener-app .choice-btn,
#zener-app .reveal-card,
#zener-app .report-card {
  background:#f1e6d4;
  color:#1b2533;
  border-color:#253244;
}
#zener-app .btn-primary,
#zener-app .btn-rounds.active,
#zener-app .btn-rounds:hover,
#zener-app .progress-bar-fill,
#zener-app .report-divider {
  background:#1b2533;
  color:#f1e6d4;
}
#zener-app .btn-rounds {
  color:#1b2533;
  border-color:#253244;
}
#zener-app .choice-btn:hover {
  background:#1b2533;
  color:#f1e6d4;
}
#zener-app .lab-stamp,
#zener-app .zener-title,
#zener-app .zener-subtitle,
#zener-app .test-counter,
#zener-app .card-instruction,
#zener-app .result-title,
#zener-app .reveal-verdict,
#zener-app .esp-meter-labels,
#zener-app .history-title {
  color:#f4eadc;
}
#zener-app .lab-stamp {
  border-color:rgba(244,216,148,.38);
  color:#d8b082;
}
#zener-app .header-rule span {
  background:rgba(244,216,148,.58);
}
#zener-app .rule-diamond {
  color:#d8b082;
}
#zener-app .report-card .report-label,
#zener-app .report-card .report-value,
#zener-app .history-item.miss {
  color:#1b2533;
}
#signo-solar-app .date-select {
  background-color:#223249;
  color:#f8efe0;
  border-color:rgba(244,216,148,.58);
}
#signo-solar-app .date-select option {
  background:#18243a;
  color:#f8efe0;
}
#hd-app .hd-sign-tile.selected,
#hd-app .hd-day-btn.active,
#zc-app .zc-sign-tile.sel-1,
#zc-app .zc-sign-tile.sel-2,
#zc-app .zc-sign-tile.sel-1.sel-2 {
  color:#fff0d2;
  border-color:#ffd083;
}
#zc-app .zc-sign-tile.sel-1 .zc-tile-name,
#zc-app .zc-sign-tile.sel-2 .zc-tile-name,
#zc-app .zc-sign-tile.sel-1.sel-2 .zc-tile-name,
#zc-app .zc-sign-tile.sel-1 .zc-tile-glyph,
#zc-app .zc-sign-tile.sel-2 .zc-tile-glyph,
#zc-app .zc-sign-tile.sel-1.sel-2 .zc-tile-glyph {
  color:#f8efe0;
}
@media (max-width:980px){
  .ts-nav{align-items:flex-start;flex-wrap:wrap}
  .ts-nav-toggle{display:block;margin-left:auto}
  .ts-menu{position:static;transform:none;display:none;order:3;width:100%;max-width:none;flex-direction:column;align-items:stretch;justify-content:flex-start;overflow:visible}
  .ts-menu.is-open{display:flex}
  .ts-menu a{justify-content:flex-start}
  .tk-grid--3,.tk-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  :root{--ts-nav-h:64px}
  .ts-nav{gap:10px;padding:8px 14px}
  .ts-brand span:last-child{display:none}
  .ts-hero{min-height:64vh;padding:calc(var(--ts-nav-h) + 28px) 18px 40px}
  .ts-az{justify-content:flex-start}
  .ts-contact-form{grid-template-columns:1fr;padding:18px}
  .tk-grid--3,.tk-grid--4,.tk-grid--auto{grid-template-columns:1fr}
  .ts-section,.tk-seo,.ts-article,.ts-app-seo-wrap{width:min(100% - 28px,1160px);padding:34px 0}
  .ts-question-groups{gap:34px}
  .ts-question-group{padding-bottom:30px}
  .ts-question-group__head h2{font-size:1.42rem}
  .ts-footer{display:block}
  .ts-footer nav{margin-top:18px}
}
