/* =========================
   DKC 369 - Chaldean Calculator
   Page-specific clean CSS
   ========================= */

:root{
  --chal-bg:#030406;
  --chal-line:rgba(255,255,255,.085);
  --chal-line-gold:rgba(246,216,107,.24);
  --chal-gold:#f6d86b;
  --chal-gold-soft:#ffe79a;
  --chal-text:#f4f4f5;
  --chal-muted:rgba(255,255,255,.64);
}

html{background:#000;scroll-behavior:smooth}
body.mp-chaldean{
  margin:0;
  min-height:100vh;
  background:var(--chal-bg);
  color:var(--chal-text);
  font-family:'Be Vietnam Pro',Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  line-height:1.68;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

body.mp-chaldean *,
body.mp-chaldean *::before,
body.mp-chaldean *::after{box-sizing:border-box}
body.mp-chaldean a{color:inherit;text-decoration:none}
body.mp-chaldean input,
body.mp-chaldean select{font:inherit}

body.mp-chaldean .container{
  width:min(1120px,calc(100% - 32px));
  margin:0 auto;
}

/* ---------- Hero ---------- */
.calc-hero{
  min-height:auto;
  padding:104px 0 54px;
  background:linear-gradient(180deg,rgba(246,216,107,.045),transparent 88%);
  border-bottom:1px solid rgba(255,255,255,.065);
}
.calc-hero .hero-inner{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
}
.calc-hero .hero-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--chal-gold);
  font-size:11px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.10em;
}
.calc-hero h1{
  margin:0;
  color:#fff;
  font-size:clamp(2.5rem,6vw,4.6rem);
  line-height:1;
  letter-spacing:0;
  font-weight:950;
}
.calc-hero-sub{
  max-width:780px;
  margin:20px auto 0;
  color:rgba(255,255,255,.66);
  font-size:15px;
  line-height:1.72;
}
.calc-main{padding:34px 0 70px}

/* ---------- Input ---------- */
.chal-tool{max-width:920px;margin:0 auto 72px}
.chal-input-card{
  border:1px solid rgba(245,205,92,.22);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));
  border-radius:8px;
  padding:20px;
  margin-top:-12px;
}
.chal-input-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
.chal-field{min-width:0}
.chal-label{
  display:block;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--chal-gold);
  font-size:.78rem;
  margin-bottom:10px;
}
.chal-label span{
  color:rgba(255,255,255,.46);
  font-size:.68rem;
  font-weight:650;
  letter-spacing:0;
  text-transform:none;
}
.chal-input{
  width:100%;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.22);
  border-radius:6px;
  color:#fff;
  font-size:.9rem;
  padding:16px 18px;
  outline:none;
}
.owner-details{border-top:1px solid var(--chal-line);padding-top:12px}
.owner-details summary{display:flex;align-items:center;gap:10px;width:max-content;color:#c9c9c9;cursor:pointer;font-size:.84rem;font-weight:750;list-style:none}
.owner-details summary::-webkit-details-marker{display:none}
.owner-details summary::before{content:'+';color:var(--chal-gold);font-size:1.1rem;line-height:1}
.owner-details[open] summary::before{content:'−'}
.owner-details summary span{color:#777;font-size:.72rem;font-weight:650}
.owner-details .chal-field{max-width:300px;margin-top:14px}
.chal-select{
  appearance:none;
  -webkit-appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, rgba(246,216,107,.78) 50%),linear-gradient(135deg, rgba(246,216,107,.78) 50%, transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
  padding-right:42px;
}
.chal-select option{background:#08090d;color:#fff}
.chal-input:focus{
  border-color:rgba(246,216,107,.55);
  box-shadow:0 0 0 3px rgba(246,216,107,.08);
}
.chal-result{margin-top:22px}
.chal-empty{
  border:1px dashed rgba(255,255,255,.16);
  border-radius:18px;
  padding:28px;
  text-align:center;
  color:#aaa;
}

/* ---------- Result Header ---------- */
.pure-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-end;
  margin:0 0 18px;
}
.pure-head small{
  display:block;
  color:var(--chal-gold);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.pure-head h2{margin:4px 0 0;font-size:1.65rem}
.pure-head-note{
  font-size:.88rem;
  color:#999;
  text-align:right;
  max-width:330px;
}
.pure-normalized{margin-top:10px;color:#aaa;font-size:.86rem}
.pure-normalized b{color:#e8e8e8}

/* ---------- Main Card ---------- */
.pure-card{
  border:1px solid rgba(246,216,107,.32);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  border-radius:8px;
  padding:24px;
}
.pure-top{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:20px;
  align-items:center;
  margin-bottom:18px;
}
.pure-number-wrap{width:112px}
.pure-number{
  width:112px;
  height:112px;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(246,216,107,.08);
  border:1px solid rgba(246,216,107,.28);
  font-size:4.2rem;
  line-height:1;
  font-weight:950;
  color:var(--chal-gold-soft);
  text-shadow:0 8px 30px rgba(246,216,107,.14);
}
.pure-title{font-size:1.2rem;font-weight:950;color:#fff;margin-bottom:6px}
.pure-sub{color:#d8d8d8;line-height:1.55;margin:0}
.pure-sub b{color:var(--chal-gold)}

.market-badge{
  display:inline-flex;
  align-items:center;
  vertical-align:middle;
  margin-left:8px;
  white-space:nowrap;
  border:1px solid rgba(255,255,255,.12);
  border-radius:4px;
  padding:2px 7px;
  font-size:.62rem;
  line-height:1.15;
  font-weight:900;
  letter-spacing:.02em;
  color:#fff;
  background:rgba(246,216,107,.14);
  opacity:.92;
  transform:translateY(-1px);
}
.market-badge.high{background:rgba(28,180,92,.22);border-color:rgba(61,255,157,.28)}
.market-badge.caution{background:rgba(232,150,34,.22);border-color:rgba(255,188,86,.28)}
.market-badge.volatile{background:rgba(246,216,107,.18);border-color:rgba(246,216,107,.3)}
.market-badge.neutral{background:rgba(150,150,150,.16);border-color:rgba(210,210,210,.18)}
.market-badge.single{background:rgba(118,142,255,.16);border-color:rgba(118,142,255,.24)}

/* ---------- Reading Sections ---------- */
.pure-sections{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  margin-top:0;
  border-top:1px solid var(--chal-line);
}
.pure-section{
  color:#cfcfcf;
  line-height:1.58;
}
.pure-section h3,
.force-panel h3,
.market-panel h3{
  margin:0 0 8px;
  font-size:.82rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--chal-gold);
}

.pure-section .section-sub{
  margin:-4px 0 9px;
  color:var(--chal-gold-soft);
  font-size:.95rem;
  font-weight:850;
  letter-spacing:.01em;
}
.pure-section p{margin:0}
.pure-section p+p{margin-top:7px}
.pure-section .single-modern{margin-top:12px;color:#aaa;font-size:.86rem}
.pure-section .single-modern b{color:var(--chal-gold-soft)}
.pure-muted{color:#a6a6a6}
.pure-section.compound-main{
  background:transparent;
  border:0;
  border-right:1px solid var(--chal-line);
  border-radius:0;
  padding:22px 22px 22px 0;
}
.pure-section.single-main{
  background:transparent;
  border:0;
  border-radius:0;
  padding:22px 0 22px 22px;
}

/* ---------- Letter analysis ---------- */
.letter-analysis{margin:4px 0 0;border-top:1px solid var(--chal-line);padding:18px 0}
.letter-analysis-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:10px;font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:#8d8d8d}
.letter-analysis-head strong{color:var(--chal-gold);font-weight:850}
.letter-track{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;scrollbar-color:#4a4121 transparent}
.letter-cell{flex:0 0 44px;display:grid;place-items:center;border-right:1px solid var(--chal-line);padding:3px 7px 5px}
.letter-cell span{color:#f5f5f5;font-size:.92rem;font-weight:850}
.letter-cell b{color:var(--chal-gold);font-size:.76rem;font-weight:800}

/* ---------- Repeated Force ---------- */
.force-panel{
  margin-top:0;
  border:0;
  border-top:1px solid var(--chal-line);
  background:transparent;
  border-radius:0;
  padding:20px 0;
  color:#cfcfcf;
  line-height:1.55;
}
.force-panel h3{font-size:.72rem}
.force-line{display:flex;flex-wrap:wrap;gap:8px}
.force-pill{
  border:1px solid rgba(246,216,107,.16);
  background:rgba(246,216,107,.06);
  border-radius:4px;
  padding:5px 9px;
  color:#e7d99a;
  font-size:.84rem;
  font-weight:800;
}
.force-note{margin-top:8px;color:#aaa;font-size:.84rem}
.force-note p{margin:0}.force-note p+p{margin-top:6px}.force-note b{color:#e8e8e8}

/* ---------- Application ---------- */
.market-panel{
  margin-top:0;
  border:0;
  border-top:1px solid var(--chal-line);
  background:transparent;
  border-radius:0;
  padding:22px 0 4px;
}
.market-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.market-list h4,
.market-chips h4{margin:0 0 8px;color:var(--chal-gold-soft);font-size:.88rem}
.market-list ul{margin:0;padding-left:18px;color:#cfcfcf;line-height:1.65}
.market-list li+li{margin-top:4px}
.market-chips{grid-column:1/-1}
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.market-chip{
  border:1px solid rgba(246,216,107,.16);
  background:rgba(246,216,107,.06);
  color:#e7d99a;
  border-radius:4px;
  padding:6px 10px;
  font-size:.82rem;
  font-weight:750;
}

/* ---------- Optional comparison ---------- */
.optional-panel{
  margin-top:20px;
  padding:20px 0 0;
  border:0;
  border-top:1px solid var(--chal-line);
  border-radius:0;
  background:transparent;
}
.optional-panel h3{
  margin:0 0 11px;
  color:var(--chal-gold);
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.optional-panel p{
  margin:10px 0 0;
  color:#aaa;
  font-size:.84rem;
  line-height:1.55;
}
.optional-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.optional-compare>div{
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(0,0,0,.15);
}
.optional-compare small,
.optional-compare strong,
.optional-compare span{display:block}
.optional-compare small{color:#8e8e8e;font-size:.7rem}
.optional-compare strong{margin:2px 0;color:#fff;font-size:.94rem}
.optional-compare span{color:var(--chal-gold-soft);font-size:.8rem}
.owner-match{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  color:#cfcfcf;
  font-size:.84rem;
}
.owner-match span{
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:4px;
}
.owner-match b{color:var(--chal-gold-soft)}
.owner-match i{color:#777;font-style:normal}
.owner-match>strong{
  margin-left:auto;
  padding:4px 8px;
  border-radius:4px;
  font-size:.72rem;
}
.owner-match .is-strong,.owner-match .is-good{color:#8ee8ab;background:rgba(28,180,92,.13)}
.owner-match .is-neutral{color:#b7c8ff;background:rgba(118,142,255,.12)}
.owner-match .is-caution{color:#ffd08a;background:rgba(232,150,34,.13)}
.pure-source{margin:20px 0 0;padding-top:14px;border-top:1px solid var(--chal-line);color:#777;font-size:.74rem;line-height:1.55}
.pure-source i{color:#999}

/* ---------- Hidden Details ---------- */
.pure-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px}
.pure-calc-btn{
  margin-top:0;
  border:0;
  background:transparent;
  color:#bdbdbd;
  cursor:pointer;
  font-weight:750;
  font-size:.78rem;
  text-decoration:underline;
  text-underline-offset:3px;
  padding:0;
}
.pure-calc-btn:hover{color:var(--chal-gold)}
.pure-calc{
  display:none;
  margin-top:10px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(0,0,0,.16);
  border-radius:12px;
  padding:10px 12px;
  color:#d7d7d7;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.82rem;
  line-height:1.55;
  word-break:break-word;
}
.pure-calc.show{display:block}
.pure-table{
  display:none;
  margin-top:12px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;
  padding:14px;
  background:rgba(255,255,255,.02);
}
.pure-table.show{display:block}
.pure-table-title{
  color:var(--chal-gold);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.76rem;
  margin-bottom:10px;
}
.pure-map{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pure-map-item{
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  padding:8px 9px;
  color:#cfcfcf;
  font-size:.86rem;
}
.pure-map-item b{color:var(--chal-gold-soft);margin-right:6px}

@media(max-width:700px){
  .chal-input-grid{grid-template-columns:1fr}
  .chal-field-name{grid-row:auto}
  .optional-compare{grid-template-columns:1fr}
  .owner-match>strong{margin-left:0}
}
.pure-map-item.nine{grid-column:1/-1;color:#aaa}

@media(max-width:820px){
  .calc-hero{padding:92px 0 48px}
  .calc-hero h1{font-size:clamp(2.35rem,12vw,4.2rem)}
  .pure-head{display:block}
  .pure-head-note{text-align:left;margin-top:8px}
  .pure-top{grid-template-columns:1fr}
  .pure-number-wrap{width:96px;margin-bottom:0}
  .pure-number{width:96px;height:96px;font-size:3.5rem}
  .pure-sections{grid-template-columns:1fr}
  .pure-section.compound-main{border-right:0;border-bottom:1px solid var(--chal-line);padding:20px 0}
  .pure-section.single-main{padding:20px 0}
  .market-grid{grid-template-columns:1fr}
  .pure-map{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chal-input-card{border-radius:8px;padding:16px}
  .pure-card{padding:18px}
}


/* Keep Chaldean page styles away from the shared top navigation. */
body.mp-chaldean #dkc-topbar,
body.mp-chaldean #dkc-topbar button,
body.mp-chaldean #dkc-topbar a{
  font-family:'Be Vietnam Pro',Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

/* ANGEL Pattern layer */
.angel-panel{
  margin-top:0;
  padding:20px 0;
  border:0;
  border-top:1px solid var(--chal-line);
  border-radius:0;
  background:transparent;
}
.angel-row{
  display:grid;
  grid-template-columns:minmax(145px,.42fr) minmax(0,1fr);
  gap:10px 14px;
  align-items:start;
  padding:10px 0;
  border-top:1px solid rgba(255,255,255,.065);
}
.angel-row:first-of-type{border-top:0;padding-top:0}
.angel-row:last-child{padding-bottom:0}
.angel-row strong{
  color:#fff;
  font-size:.9rem;
  line-height:1.35;
  letter-spacing:.01em;
}
.angel-row span{
  color:#cfcfcf;
  font-size:.92rem;
  line-height:1.6;
}
@media(max-width:680px){
  .angel-row{grid-template-columns:1fr;gap:4px}
}