/* Claritas Sky: the birth chart calculator. Everything is scoped to .csky so the theme stays untouched. */
.csky{
  --k-paper:#F8F2EC; --k-paper-2:#FBF7F2; --k-card:#FFFCF8; --k-ink:#33243A; --k-ink-soft:#6C5A72; --k-ink-faint:#998A9D;
  --k-rose:#C9697E; --k-rose-deep:#9E4459; --k-rose-strong:#A94F66; --k-rose-soft:#F3D9DE; --k-gold:#B8904A; --k-gold-soft:#F2E6CF;
  --k-sage:#6F8E78; --k-dusk:#7A5679; --k-dusk-soft:#E9DEEA; --k-night:#2C2136;
  --k-line:rgba(51,36,58,.14); --k-line-strong:rgba(51,36,58,.28); --k-line-gold:rgba(184,144,74,.55);
  --k-fire:#C9697E; --k-earth:#6F8E78; --k-air:#B8904A; --k-water:#7A5679;
  --k-fire-soft:#F6E1E5; --k-earth-soft:#E3ECE5; --k-air-soft:#F4EAD6; --k-water-soft:#ECE2EC;
  --k-shadow:0 34px 44px -32px rgba(74,40,50,.45),0 14px 22px -16px rgba(74,40,50,.28),0 1px 3px rgba(74,40,50,.08);
  --k-display:var(--display,"Fraunces",Georgia,"Times New Roman",serif);
  --k-body:var(--body,"Alegreya Sans","Gill Sans",Calibri,system-ui,sans-serif);
  --k-sym:"Noto Sans Symbols","Noto Sans Symbols 2","Segoe UI Symbol","Apple Symbols","DejaVu Sans",sans-serif;
  width:min(1040px,calc(100vw - 32px));
  margin:28px 0 12px calc(50% - min(520px,50vw - 16px));
  color:var(--k-ink);font-family:var(--k-body);font-size:18px;line-height:1.55;
}
.csky *{box-sizing:border-box}
.csky [hidden]{display:none!important}
.csky a{color:var(--k-rose-deep);text-underline-offset:3px;text-decoration-thickness:1px}
.csky :focus-visible{outline:2px solid var(--k-rose);outline-offset:3px;border-radius:6px}
.csky h2,.csky h3{font-family:var(--k-display);font-weight:400;letter-spacing:-.01em;text-wrap:balance;margin:0;color:var(--k-ink)}
.csky h2{font-size:clamp(28px,3.6vw,38px);line-height:1.1}
.csky h3{font-size:22px;line-height:1.2}
.csky p{margin:0}
.csky ul,.csky ol{margin:0}
.csky .sym{font-family:var(--k-sym);font-style:normal;font-weight:400;line-height:1}
.csky .kicker{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--k-rose-deep);font-weight:500}
.csky .muted{color:var(--k-ink-soft)}
.csky .tab{font-variant-numeric:tabular-nums}

.csky .hero{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:44px;align-items:start}
.csky .form{background:var(--k-card);border:1px solid var(--k-line);border-radius:18px;padding:22px;display:grid;gap:16px;box-shadow:var(--k-shadow)}
.csky .form h3{font-size:20px}
.csky .field{display:grid;gap:6px}
.csky .field>label,.csky .field>.lbl{font-size:15.5px;font-weight:500;color:var(--k-ink)}
.csky .row{display:flex;gap:10px;flex-wrap:wrap}
.csky .row>*{flex:1 1 90px;min-width:0}
.csky input,.csky select{font:inherit;font-size:17px;color:var(--k-ink);background:var(--k-paper);border:1px solid var(--k-line-strong);border-radius:10px;padding:10px 12px;width:100%;min-height:46px;margin:0;box-shadow:none}
.csky input:focus,.csky select:focus{border-color:var(--k-rose);outline:none;box-shadow:0 0 0 3px var(--k-rose-soft)}
.csky input:disabled{opacity:.45}
.csky .check{display:flex;align-items:center;gap:8px;font-size:15.5px;color:var(--k-ink-soft);font-weight:400}
.csky .check input{width:18px;height:18px;min-height:0;padding:0;accent-color:var(--k-rose-deep)}
.csky .hint{font-size:14.5px;color:var(--k-ink-soft)}
.csky .err{font-size:15px;color:var(--k-rose-deep);font-weight:500}
.csky .btn{display:inline-block;font:inherit;font-weight:500;font-size:18px;border:0;border-radius:12px;background:var(--k-rose-strong);color:#fff;padding:13px 22px;cursor:pointer;justify-self:start;text-decoration:none;line-height:1.2;transition:transform .15s ease,box-shadow .15s ease}
.csky .btn:hover{transform:translateY(-1px);box-shadow:0 10px 18px -12px rgba(158,68,89,.8);color:#fff}
.csky .btn.ghost{background:transparent;color:var(--k-rose-deep);border:1px solid var(--k-line-gold)}
.csky .btn.small{font-size:16px;padding:9px 16px}
.csky .combo{position:relative}
.csky .combo ul{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 4px);margin:0;padding:6px;list-style:none;background:var(--k-card);border:1px solid var(--k-line-strong);border-radius:12px;box-shadow:var(--k-shadow);max-height:300px;overflow:auto}
.csky .combo li{padding:8px 10px;border-radius:8px;cursor:pointer;display:grid;gap:1px;margin:0}
.csky .combo li small{color:var(--k-ink-soft);font-size:14px}
.csky .combo li[aria-selected="true"],.csky .combo li:hover{background:var(--k-rose-soft)}
.csky .picked{font-size:14.5px;color:var(--k-ink-soft)}
.csky .picked b{color:var(--k-ink);font-weight:500}

.csky .hero-wheel{margin:0;display:grid;gap:12px;justify-items:center}
.csky .pill{display:inline-flex;align-items:center;gap:8px;font-size:14px;background:var(--k-gold-soft);color:var(--k-ink);border:1px solid var(--k-line-gold);border-radius:999px;padding:5px 12px}
.csky .pill.rose{background:var(--k-rose-soft);border-color:transparent}
.csky .wheel{width:100%;max-width:600px;height:auto;display:block;overflow:visible}
.csky .wheel text{font-family:var(--k-body)}
.csky .wheel .g{font-family:var(--k-sym)}
.csky .w-bg{fill:var(--k-card)}
.csky .w-ring{fill:none;stroke:var(--k-line-strong);stroke-width:1}
.csky .w-fire{fill:var(--k-fire-soft)}.csky .w-earth{fill:var(--k-earth-soft)}.csky .w-air{fill:var(--k-air-soft)}.csky .w-water{fill:var(--k-water-soft)}
.csky .w-sign{font-size:21px;text-anchor:middle;dominant-baseline:central}
.csky .w-sign.fire{fill:var(--k-fire)}.csky .w-sign.earth{fill:var(--k-earth)}.csky .w-sign.air{fill:var(--k-air)}.csky .w-sign.water{fill:var(--k-water)}
.csky .w-tick,.csky .w-cusp{stroke:var(--k-line-strong);stroke-width:1}
.csky .w-axis{stroke:var(--k-ink-soft);stroke-width:1.6}
.csky .w-hnum{font-size:12.5px;fill:var(--k-ink-faint);text-anchor:middle;dominant-baseline:central}
.csky .w-axlab{font-size:12px;fill:var(--k-ink-soft);font-weight:700;letter-spacing:.06em;text-anchor:middle;dominant-baseline:central}
.csky .w-pa{fill:var(--k-rose-deep)}.csky .w-pb{fill:var(--k-dusk)}
.csky .w-glyph{font-size:22px;text-anchor:middle;dominant-baseline:central}
.csky .w-deg{font-size:11.5px;text-anchor:middle;dominant-baseline:central;fill:var(--k-ink-soft)}
.csky .w-ta{stroke:var(--k-rose-deep);stroke-width:1.6}.csky .w-tb{stroke:var(--k-dusk);stroke-width:1.6}
.csky .w-conn{stroke:var(--k-line-strong);stroke-width:.8}
.csky .w-easy{stroke:var(--k-sage);stroke-width:1.3}
.csky .w-tense{stroke:var(--k-rose);stroke-width:1.3}
.csky .w-strong{stroke-width:2.6}
.csky .w-late{transition:opacity .6s ease}
.csky .w-hidden .w-late{opacity:0}
.csky .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:14.5px;color:var(--k-ink-soft);justify-content:center}
.csky .legend span{display:inline-flex;align-items:center;gap:6px}
.csky .legend i{display:inline-block;width:18px;height:2px;border-radius:2px}

.csky section.block{margin-top:72px;display:grid;gap:22px}
.csky .narrow{max-width:760px}
.csky .summary{margin-top:56px;display:grid;gap:10px;justify-items:start}
.csky .summary h2{font-size:clamp(30px,4.4vw,46px);font-style:italic;font-weight:350}
.csky .actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}
.csky .note{font-size:15px;color:var(--k-ink-soft)}

.csky .big3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}
.csky .b3{background:var(--k-card);border:1px solid var(--k-line);border-radius:18px;padding:22px;display:grid;gap:10px;align-content:start}
.csky .b3 .head{display:flex;align-items:center;gap:10px;color:var(--k-ink-soft);font-size:15px}
.csky .b3 .head .sym{font-size:22px;color:var(--k-rose-deep)}
.csky .b3 h3{font-size:30px}
.csky .b3 .exact{font-size:15px;color:var(--k-ink-soft)}
.csky .b3 p{font-size:17px}
.csky .b3 .warn{font-size:15px;background:var(--k-gold-soft);border-radius:10px;padding:10px 12px}

.csky .spread{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:760px}
.csky .tcard{display:grid;gap:10px;justify-items:center;align-content:start;text-align:center;text-decoration:none;color:inherit}
.csky .tc{width:100%;max-width:190px;aspect-ratio:558/1000;border-radius:14px;position:relative;overflow:hidden;box-shadow:var(--k-shadow);
  background:radial-gradient(circle at 50% 44%,var(--tint) 0 32%,transparent 33%),linear-gradient(170deg,var(--k-paper-2),var(--k-card));
  border:1px solid var(--k-line-gold);transition:transform .25s ease;display:block}
.csky a.tcard:hover .tc{transform:translateY(-4px) rotate(-.6deg)}
.csky .tc::before{content:"";position:absolute;inset:8px;border:1px solid var(--k-line-gold);border-radius:9px}
.csky .tc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:13px;z-index:2}
.csky .tc .num{position:absolute;top:18px;left:0;right:0;font-family:var(--k-display);font-size:17px;color:var(--k-gold);letter-spacing:.08em}
.csky .tc .gl{position:absolute;top:44%;left:0;right:0;transform:translateY(-50%);font-size:54px;color:var(--tone)}
.csky .tc .nm{position:absolute;bottom:18px;left:10px;right:10px;font-family:var(--k-display);font-size:17px;line-height:1.15}
.csky .tc.back{background:repeating-linear-gradient(45deg,var(--k-dusk-soft) 0 8px,var(--k-card) 8px 16px)}
.csky .tc.back .gl{font-family:var(--k-display);font-size:40px;color:var(--k-dusk)}
.csky .tcard .cap{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--k-ink-soft)}
.csky .tcard .kw{font-size:16px;color:var(--k-ink-soft);max-width:15em}
.csky .fire{--tint:var(--k-fire-soft);--tone:var(--k-fire)}.csky .earth{--tint:var(--k-earth-soft);--tone:var(--k-earth)}.csky .air{--tint:var(--k-air-soft);--tone:var(--k-air)}.csky .water{--tint:var(--k-water-soft);--tone:var(--k-water)}

.csky .tablewrap{overflow-x:auto;border:1px solid var(--k-line);border-radius:16px;background:var(--k-card)}
.csky table{border-collapse:collapse;width:100%;min-width:640px;font-size:16.5px;margin:0;border:0}
.csky th,.csky td{text-align:left;padding:11px 14px;border:0;border-bottom:1px solid var(--k-line);vertical-align:top;background:transparent}
.csky tr:last-child td{border-bottom:0}
.csky th{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--k-ink-soft);font-weight:500}
.csky td.pg{font-size:21px;color:var(--k-rose-deep);width:36px}
.csky td.nm{font-weight:500;white-space:nowrap}
.csky td.ex{white-space:nowrap}
.csky .rx{display:inline-block;font-size:12.5px;background:var(--k-rose-soft);color:var(--k-rose-deep);border-radius:999px;padding:1px 8px;margin-left:6px;font-weight:500}

.csky .balance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.csky .panel{background:var(--k-card);border:1px solid var(--k-line);border-radius:18px;padding:20px;display:grid;gap:12px;align-content:start}
.csky .panel h3{font-size:20px}
.csky .bar{display:grid;grid-template-columns:70px 1fr 38px;align-items:center;gap:10px;font-size:15.5px}
.csky .bar .track{height:10px;border-radius:99px;background:var(--k-paper-2);border:1px solid var(--k-line);overflow:hidden;display:block}
.csky .bar .fill{height:100%;border-radius:99px}
.csky .moonfig{display:flex;gap:14px;align-items:center}
.csky .moonfig svg{width:74px;height:74px;flex:none}

.csky .asps{display:grid;gap:12px;max-width:760px;padding:0;margin:0;list-style:none}
.csky .asps li{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;padding:14px 16px;background:var(--k-card);border:1px solid var(--k-line);border-radius:14px;margin:0}
.csky .asps .gl{grid-row:span 2;font-size:20px;color:var(--k-rose-deep);white-space:nowrap;padding-top:2px}
.csky .asps b{font-weight:500}
.csky .asps .o{color:var(--k-ink-soft);font-size:14.5px;margin-left:6px}
.csky .asps li.more{grid-template-columns:1fr;background:transparent;border-style:dashed;color:var(--k-ink-soft)}

.csky .step{max-width:760px;border-left:3px solid var(--k-gold);padding:6px 0 6px 18px;display:grid;gap:4px}
.csky .step .kicker{color:var(--k-gold)}
.csky .step p:not(.kicker){font-family:var(--k-display);font-size:24px;line-height:1.3;font-style:italic;font-weight:350}

.csky .paid{background:var(--k-night);color:#F4EAF0;border-radius:22px;padding:30px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:30px;box-shadow:var(--k-shadow);align-items:start}
.csky .paid h2{color:#FFF6F0}
.csky .paid .kicker{color:#E9C98F}
.csky .paid p{color:#DCCDE0}
.csky .paid ol{margin:0;padding:0;list-style:none;display:grid;gap:9px;counter-reset:c}
.csky .paid li{display:grid;grid-template-columns:26px 1fr;gap:10px;font-size:16.5px;color:#F4EAF0;counter-increment:c;margin:0}
.csky .paid li::before{content:counter(c);font-family:var(--k-display);color:#E9C98F;font-size:17px}
.csky .paid .cover{display:block;justify-self:center;max-width:320px;width:100%}
.csky .paid .cover img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:0 24px 40px -20px rgba(0,0,0,.6)}
.csky .letter{position:relative;background:#FBF4EC;color:#33243A;border-radius:14px;padding:20px 20px 60px;font-family:var(--k-display);font-size:17.5px;line-height:1.5;overflow:hidden;max-height:250px}
.csky .letter p{color:#33243A}
.csky .letter::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(transparent,#FBF4EC 80%)}
.csky .letter .lock{position:absolute;z-index:2;bottom:14px;left:20px;font-family:var(--k-body);font-size:14.5px;color:#6C5A72}
.csky .price{font-size:16px;color:#DCCDE0}
.csky .price b{font-family:var(--k-display);font-size:28px;color:#FFF6F0;font-weight:400;margin-right:8px}
.csky .paid .btn{background:#E9C98F;color:#2C2136}
.csky .paid .btn:hover{color:#2C2136}

.csky .chips{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.csky .chip{font:inherit;font-size:16px;border:1px solid var(--k-line-strong);background:var(--k-card);color:var(--k-ink);border-radius:999px;padding:8px 14px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;line-height:1.3}
.csky .chip[aria-pressed="true"]{background:var(--k-dusk);border-color:var(--k-dusk);color:#FFF8F4}
.csky .chip small{opacity:.75;font-size:13.5px}
.csky .chip.add{border-style:dashed;color:var(--k-rose-deep)}
.csky .match{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:start}
.csky .match-head{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.csky .match-head h3{font-size:clamp(28px,3.4vw,36px);font-style:italic;font-weight:350}
.csky .linkbtn{font:inherit;font-size:15px;background:none;border:0;color:var(--k-ink-soft);text-decoration:underline;cursor:pointer;padding:0}
.csky .side{width:100%;min-width:0;font-size:16px}
.csky .side td,.csky .side th{padding:9px 12px}
.csky .side .a{color:var(--k-rose-deep)}.csky .side .b{color:var(--k-dusk)}
.csky .texture{display:grid;gap:10px}
.csky .tx{display:grid;grid-template-columns:150px 1fr 26px;gap:10px;align-items:center;font-size:15.5px}
.csky .dots{display:flex;gap:5px;flex-wrap:wrap}
.csky .dots i{width:11px;height:11px;border-radius:50%;display:block}
.csky .conns{display:grid;gap:12px;list-style:none;margin:0;padding:0}
.csky .conns li{background:var(--k-card);border:1px solid var(--k-line);border-radius:14px;padding:14px 16px;display:grid;gap:4px;margin:0}
.csky .conns .t{font-size:15px;color:var(--k-ink-soft)}
.csky .conns .t .sym{font-size:17px}
.csky .pair-cards{display:flex;gap:16px;align-items:center;justify-content:center}
.csky .pair-cards .tcard{max-width:150px}
.csky .pair-cards .amp{font-family:var(--k-display);font-size:40px;font-style:italic;color:var(--k-gold)}
.csky-toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:#2C2136;color:#F4EAF0;padding:10px 18px;border-radius:999px;font-size:15px;z-index:9999;font-family:var(--body,"Alegreya Sans",sans-serif)}
.csky-toast[hidden]{display:none!important}

@media (max-width:960px){
  .csky .hero{grid-template-columns:1fr;gap:28px}
  .csky .paid{grid-template-columns:1fr}
  .csky .match{grid-template-columns:1fr}
}
@media (max-width:720px){
  .csky{font-size:17px}
  .csky .big3{grid-template-columns:1fr}
  .csky .balance{grid-template-columns:1fr}
  .csky .spread{gap:12px}
  .csky .tc .gl{font-size:40px}
  .csky .tc .nm{font-size:14.5px;bottom:14px}
  .csky .tc .num{top:14px;font-size:14px}
  .csky .tcard .kw{font-size:14.5px}
  .csky .paid{padding:22px}
  .csky .tx{grid-template-columns:120px 1fr 22px}
  .csky .w-glyph{font-size:26px}.csky .w-deg{font-size:14px}.csky .w-hnum,.csky .w-axlab{font-size:14.5px}.csky .w-sign{font-size:24px}
}
@media (prefers-reduced-motion:reduce){.csky *{transition:none!important;animation:none!important}}