/* ============================================================
   THE CODEX — STYLES
   "Are They The Same?" — an elevated dark-fantasy grimoire
   making an insufferably smug argument.
   ============================================================ */

:root{
  --bg:#0b0a0c;
  --panel:#131218;
  --panel-2:#17151c;
  --bone:#e8e1d2;
  --bone-dim:#9c968a;
  --bone-faint:#6f6a61;
  --steel:#8bb0cd;
  --steel-deep:#1d2c38;
  --crimson:#cf4034;
  --crimson-deep:#34141a;
  --gold:#c9a24e;
  --gold-soft:#d9bd7d;
  --silver:#d8dde4;
  --line:rgba(232,225,210,.10);
  --line-soft:rgba(232,225,210,.06);
  --shadow:0 18px 50px -20px rgba(0,0,0,.8);
  --maxw:1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
  margin:0;
  background:
    radial-gradient(120% 80% at 18% -5%, rgba(139,176,205,.07), transparent 55%),
    radial-gradient(120% 80% at 82% -5%, rgba(207,64,52,.07), transparent 55%),
    radial-gradient(140% 120% at 50% 120%, rgba(201,162,78,.05), transparent 60%),
    var(--bg);
  color:var(--bone);
  font-family:'EB Garamond','Georgia',serif;
  font-size:clamp(16px,1.05vw + 12px,18px);
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(130% 100% at 50% 35%, transparent 55%, rgba(0,0,0,.55) 100%);
}

.wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.6rem);}

.eyebrow{
  font-family:'Cinzel',serif;font-weight:600;letter-spacing:.34em;text-transform:uppercase;
  font-size:.66rem;color:var(--gold);display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow::before,.eyebrow::after{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--gold));}
.eyebrow::after{background:linear-gradient(90deg,var(--gold),transparent);}
.eyebrow.solo::before{display:none;}

h1,h2,h3{font-family:'Cinzel',serif;font-weight:600;line-height:1.12;margin:0;}

.sig{display:block;width:100%;height:100%;}
.sig [stroke]{vector-effect:non-scaling-stroke;}

/* filigree divider (codex flourish) */
.filigree{display:flex;align-items:center;justify-content:center;gap:1rem;margin:0 auto;color:var(--gold);opacity:.6;max-width:340px;}
.filigree::before,.filigree::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold));}
.filigree::after{background:linear-gradient(90deg,var(--gold),transparent);}
.filigree .dot{width:16px;height:16px;flex:none;transform:rotate(45deg);}

/* URL bar pill (features the domain) */
.urlbar{
  display:inline-flex;align-items:center;gap:.6em;
  font-family:'Cinzel',serif;font-size:clamp(.54rem,1.5vw,.72rem);letter-spacing:.05em;
  color:var(--bone-dim);border:1px solid var(--line);border-radius:999px;
  padding:.55em 1.1em;background:rgba(255,255,255,.02);max-width:92vw;
}
.urlbar .lock{width:.9em;height:.9em;color:var(--steel);flex:none;}
.urlbar .dom{color:var(--bone);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ============ SIMILARITY METER ============ */
.meter-bar{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;
  background:linear-gradient(90deg,var(--steel),var(--gold) 55%,var(--crimson));
  box-shadow:0 0 12px rgba(201,162,78,.5);transition:width .15s linear;}
.meter-readout{
  position:fixed;right:clamp(.8rem,2.5vw,1.4rem);bottom:clamp(.8rem,2.5vw,1.4rem);z-index:60;
  display:flex;align-items:center;gap:.6em;padding:.55em .9em;border-radius:999px;
  font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--bone-dim);background:rgba(11,10,12,.82);border:1px solid var(--line);
  backdrop-filter:blur(6px);box-shadow:var(--shadow);transition:opacity .4s,transform .4s,color .4s,border-color .4s;
  opacity:0;transform:translateY(12px);pointer-events:none;
}
.meter-readout.show{opacity:1;transform:none;}
.meter-readout .pct{font-family:'Cinzel',serif;font-weight:700;font-size:1.05rem;color:var(--gold);letter-spacing:.02em;}
.meter-readout.maxed{color:var(--gold-soft);border-color:color-mix(in srgb,var(--gold) 50%,var(--line));}
.meter-readout.maxed .pct{color:var(--gold);}
.meter-readout .node{width:14px;height:14px;color:var(--gold);flex:none;}

/* ============ HERO ============ */
.hero{
  min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:clamp(3rem,8vh,5rem) clamp(1.1rem,4vw,2rem);position:relative;
}
.hero .urlbar{margin-bottom:clamp(1.8rem,5vh,2.8rem);}
.hero-lead{
  font-family:'Cinzel',serif;font-weight:500;font-style:italic;
  font-size:clamp(.95rem,1.9vw,1.25rem);letter-spacing:.04em;color:var(--gold-soft);
  margin:0 0 clamp(1.7rem,4.5vh,2.7rem);max-width:34ch;line-height:1.5;
}

.houses{display:flex;align-items:center;justify-content:center;gap:clamp(1.4rem,5vw,4.5rem);width:100%;}
.house-mark{display:flex;flex-direction:column;align-items:center;gap:1.1rem;flex:1;min-width:0;}
.house-mark .crest{width:clamp(72px,11vw,124px);height:clamp(72px,11vw,124px);}
.house-mark.left .crest{color:var(--steel);}
.house-mark.right .crest{color:var(--crimson);}
.house-mark .crest [stroke]{stroke-width:2.4;}
.house-name{font-family:'Cinzel',serif;font-weight:600;font-size:clamp(1.4rem,3.4vw,2.8rem);letter-spacing:.05em;color:var(--bone);line-height:1.12;}
.house-name .pair{
  display:block;font-family:'EB Garamond',serif;font-style:italic;font-weight:400;
  text-transform:none;letter-spacing:.01em;font-size:.42em;color:var(--bone-dim);margin-top:.5em;
}

.bind{display:flex;flex-direction:column;align-items:center;gap:.6rem;align-self:stretch;justify-content:center;}
.bind .line{width:1px;flex:1;min-height:34px;background:linear-gradient(var(--gold),transparent);}
.bind .line.top{background:linear-gradient(transparent,var(--gold));}
.node{width:clamp(20px,2.6vw,30px);height:clamp(20px,2.6vw,30px);color:var(--gold);flex:none;animation:nodepulse 5.5s ease-in-out infinite;}
@keyframes nodepulse{0%,100%{filter:drop-shadow(0 0 2px rgba(201,162,78,.3));}50%{filter:drop-shadow(0 0 11px rgba(201,162,78,.7));}}

/* hero crest ink-bloom (only when JS arms it; visible by default for no-JS) */
.hero .crest.draw{transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1),filter 1.1s ease;}
.hero.anim .crest.draw{opacity:0;transform:scale(.8);}
.hero.anim.armed .crest.draw{opacity:1;transform:none;filter:drop-shadow(0 0 16px color-mix(in srgb,currentColor 50%,transparent));}
.hero.anim.armed.left-in .house-mark.right .crest.draw{transition-delay:.18s;}

.verdict-line{
  font-family:'Cinzel',serif;font-weight:700;font-size:clamp(1.55rem,5vw,3.1rem);
  color:var(--gold);letter-spacing:.02em;margin:clamp(1.4rem,4vh,2.2rem) 0 0;line-height:1.08;
}

.creed{margin-top:clamp(1.4rem,4vh,2rem);max-width:40ch;}
.creed .lead{
  margin:0;font-family:'Cinzel',serif;font-weight:400;font-size:clamp(1rem,2.1vw,1.45rem);line-height:1.42;
  color:var(--gold-soft);letter-spacing:.02em;
}
.creed .sub{margin:.8rem 0 0;color:var(--bone-dim);font-size:1.02rem;font-style:italic;}

/* scoreboard */
.scoreboard{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  margin-top:clamp(2.2rem,5vh,3rem);border:1px solid var(--line);border-radius:3px;overflow:hidden;
  background:var(--line-soft);width:100%;max-width:820px;
}
.stat{background:linear-gradient(180deg,var(--panel),var(--panel-2));padding:1.15rem .6rem;text-align:center;}
.stat .num{font-family:'Cinzel',serif;font-weight:700;font-size:clamp(1.35rem,4vw,2.15rem);color:var(--gold);line-height:1;display:block;}
.stat.zero .num{color:var(--crimson);}
.stat .cap{display:block;margin-top:.55rem;font-family:'Cinzel',serif;font-size:.52rem;letter-spacing:.13em;text-transform:uppercase;color:var(--bone-dim);line-height:1.4;}

.scroll-cue{margin-top:clamp(1.6rem,4vh,2.4rem);font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--bone-faint);}
.scroll-cue span{display:block;margin-top:.5rem;font-size:1.1rem;color:var(--gold);animation:bob 2.4s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(5px);}}

/* ============ OPENING STATEMENT ============ */
.codex{padding:clamp(3.5rem,9vh,6rem) 0 clamp(1rem,3vh,2rem);text-align:center;}
.codex p{max-width:62ch;margin:0 auto;font-size:clamp(1.06rem,1.6vw,1.3rem);color:var(--bone);line-height:1.7;}
.codex .dropcap::first-letter{
  font-family:'Cinzel',serif;font-weight:700;color:var(--gold);font-size:3.4em;line-height:.78;
  float:left;margin:.06em .12em 0 0;text-shadow:0 2px 14px rgba(201,162,78,.35);
}

/* ============ SECTION SHELL ============ */
.chapter{padding:clamp(3.4rem,8vh,5.6rem) 0;}
.chapter-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.1rem;margin-bottom:clamp(2.4rem,6vh,3.6rem);}
.chapter-head h2{font-size:clamp(1.7rem,4vw,2.9rem);letter-spacing:.04em;}
.chapter-head .quill{width:54px;height:18px;color:var(--gold);opacity:.85;}
.chapter-head .blurb{max-width:56ch;color:var(--bone-dim);font-style:italic;font-size:1.04rem;margin:0;}
.folio-mark{font-family:'Cinzel',serif;letter-spacing:.3em;text-transform:uppercase;font-size:.62rem;color:var(--gold);}

/* ============ COMPARE GRID ============ */
.compare{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.1rem,4vw,3rem);}
.compare::before{
  content:"";position:absolute;left:50%;top:7%;bottom:7%;width:1px;transform:translateX(-.5px);
  background:linear-gradient(transparent,var(--gold) 18%,var(--gold) 82%,transparent);opacity:.5;
}
.compare .seam-node{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:34px;height:34px;color:var(--gold);z-index:2;background:radial-gradient(circle,var(--bg) 45%,transparent 70%);
}

.house{
  --accent:var(--steel);--accent-deep:var(--steel-deep);position:relative;
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--line);border-top:2px solid var(--accent);border-radius:3px;
  padding:clamp(1.4rem,3vw,2.4rem) clamp(1.2rem,3vw,2.2rem) clamp(1.5rem,3vw,2.2rem);
  box-shadow:var(--shadow);transition:transform .5s cubic-bezier(.2,.7,.2,1),border-color .5s,box-shadow .5s;
}
.house.eotv{--accent:var(--crimson);--accent-deep:var(--crimson-deep);}
.house::after{
  content:"";position:absolute;inset:0;border-radius:3px;pointer-events:none;
  background:radial-gradient(80% 60% at 50% 0%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%);opacity:.7;
}
.house:hover{transform:translateY(-5px);border-top-color:var(--accent);box-shadow:0 28px 60px -22px rgba(0,0,0,.85);}

.house .crest{display:block;width:clamp(58px,8vw,86px);height:clamp(58px,8vw,86px);color:var(--accent);margin:0 auto .9rem;transition:filter .5s;}
.house .crest [stroke]{stroke-width:2.4;}
.house:hover .crest{filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 70%,transparent));}

.house .label{text-align:center;font-family:'Cinzel',serif;letter-spacing:.18em;text-transform:uppercase;font-size:.6rem;color:var(--accent);margin-bottom:.5rem;}
.house h3{text-align:center;font-size:clamp(1.25rem,2.6vw,1.85rem);color:var(--bone);}
.house .epithet{text-align:center;font-style:italic;color:var(--bone-dim);margin:.35rem 0 0;font-size:1rem;}

.chips{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center;margin-top:1.3rem;}
.chip{
  font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.08em;padding:.34em .8em;border-radius:2px;
  border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));color:var(--bone-dim);
  background:color-mix(in srgb,var(--accent) 8%,transparent);white-space:nowrap;
}

/* verdict / echo panel */
.echo-panel{
  position:relative;margin-top:clamp(1.4rem,3.5vw,2.4rem);
  border:1px solid color-mix(in srgb,var(--gold) 32%,transparent);border-radius:3px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 7%,var(--panel)),var(--panel-2));
  padding:clamp(1.7rem,3.5vw,2.4rem) clamp(1.3rem,4vw,2.6rem);
  box-shadow:0 0 0 1px rgba(201,162,78,.05) inset, var(--shadow);
}
.echo-panel .tag{
  position:absolute;top:-.78rem;left:50%;transform:translateX(-50%);background:var(--bg);padding:0 .9rem;
  font-family:'Cinzel',serif;letter-spacing:.26em;text-transform:uppercase;font-size:.62rem;color:var(--gold);
  display:inline-flex;align-items:center;gap:.55em;white-space:nowrap;
}
.echo-panel .tag .dot{width:9px;height:9px;color:var(--gold);}
.echo-lead{text-align:center;font-family:'Cinzel',serif;font-weight:500;font-size:clamp(.95rem,2vw,1.18rem);color:var(--gold-soft);letter-spacing:.02em;margin:.1rem 0 1.3rem;}
.echo-list{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;}
.echo-list li{position:relative;padding-left:1.7rem;color:var(--bone);line-height:1.55;}
.echo-list li::before{content:"";position:absolute;left:.2rem;top:.55em;width:8px;height:8px;transform:rotate(45deg);background:var(--gold);box-shadow:0 0 8px rgba(201,162,78,.5);}
.echo-list li b{color:var(--gold-soft);font-weight:500;}
.echo-list li em{color:var(--gold-soft);font-style:italic;}

/* ============ LEDGER ============ */
.ledger-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;margin-bottom:1.8rem;}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;}
.filter{
  font-family:'Cinzel',serif;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);
  background:transparent;cursor:pointer;border:1px solid var(--line);border-radius:2px;padding:.55em 1.05em;transition:.3s;
}
.filter:hover{color:var(--bone);border-color:color-mix(in srgb,var(--gold) 40%,var(--line));}
.filter.active{color:var(--bg);background:var(--gold);border-color:var(--gold);font-weight:600;}

.ledger{display:grid;gap:.55rem;}
.ledger-titles{
  display:grid;grid-template-columns:0.85fr 1.25fr 1.25fr 1.5fr;gap:1px;
  font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;padding:0 0 .4rem;
}
.ledger-titles span{padding:0 1.1rem;}
.ledger-titles span:nth-child(1){color:var(--gold);}
.ledger-titles span:nth-child(2){color:var(--steel);}
.ledger-titles span:nth-child(3){color:var(--crimson);}
.ledger-titles span:nth-child(4){color:var(--gold);text-align:left;}

.row{
  display:grid;grid-template-columns:0.85fr 1.25fr 1.25fr 1.5fr;gap:1px;
  background:var(--line-soft);border:1px solid var(--line);border-radius:3px;overflow:hidden;transition:opacity .35s,transform .35s;
}
.row > div{background:var(--panel);padding:1rem 1.1rem;}
.cell-aspect{font-family:'Cinzel',serif;font-size:.82rem;letter-spacing:.04em;color:var(--gold-soft);display:flex;align-items:center;}
.cell-w{border-left:2px solid color-mix(in srgb,var(--steel) 55%,transparent);}
.cell-e{border-left:2px solid color-mix(in srgb,var(--crimson) 55%,transparent);}
.cell-w,.cell-e{color:var(--bone-dim);font-size:.97rem;}
.cell-echo{
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 9%,var(--panel)),var(--panel))!important;
  color:var(--bone);font-size:.99rem;display:flex;align-items:center;border-left:2px solid color-mix(in srgb,var(--gold) 60%,transparent);
}
.cell-label{display:none;font-family:'Cinzel',serif;font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:.4rem;}
.row.hide{display:none;}

/* ============ BUTTONS ============ */
.btn{
  font-family:'Cinzel',serif;font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem;
  cursor:pointer;border-radius:2px;padding:.85em 1.4em;border:1px solid var(--gold);background:var(--gold);color:#1a160c;
  transition:transform .2s,filter .2s,background .2s,color .2s,border-color .2s;
}
.btn:hover{filter:brightness(1.08);transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn-ghost{background:transparent;color:var(--bone-dim);border-color:var(--line);}
.btn-ghost:hover{color:var(--bone);border-color:var(--gold);filter:none;}
.btn-danger{background:transparent;color:var(--crimson);border-color:var(--crimson);}
.btn-danger:hover{background:var(--crimson);color:var(--bone);filter:none;}

/* ============ THE QUIZ ============ */
.quiz{
  max-width:720px;margin:0 auto;border:1px solid var(--line);border-radius:3px;
  background:linear-gradient(180deg,var(--panel),var(--panel-2));box-shadow:var(--shadow);
  padding:clamp(1.6rem,4vw,2.6rem);
}
.quiz-meta{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);margin-bottom:1.3rem;}
.quiz-meta b{color:var(--gold);}
.quiz-track{height:3px;background:var(--line);border-radius:2px;overflow:hidden;margin-bottom:1.5rem;}
.quiz-track > i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--steel),var(--gold));transition:width .4s;}
.quiz-prompt{font-size:clamp(1.05rem,2vw,1.28rem);line-height:1.55;color:var(--bone);margin:0 0 1.5rem;min-height:3.4em;}
.quiz-options{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;}
.quiz-opt{
  font-family:'Cinzel',serif;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;
  padding:1em .6em;border-radius:2px;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--bone);
  transition:.25s;text-align:center;line-height:1.3;
}
.quiz-opt[data-k="witcher"]{border-top:2px solid color-mix(in srgb,var(--steel) 55%,transparent);}
.quiz-opt[data-k="eotv"]{border-top:2px solid color-mix(in srgb,var(--crimson) 55%,transparent);}
.quiz-opt[data-k="both"]{border-top:2px solid color-mix(in srgb,var(--gold) 60%,transparent);}
.quiz-opt:hover:not(:disabled){border-color:var(--gold);transform:translateY(-2px);}
.quiz-opt:disabled{cursor:default;opacity:.5;}
.quiz-opt.right{background:color-mix(in srgb,var(--gold) 18%,transparent);border-color:var(--gold);color:var(--bone);opacity:1;}
.quiz-opt.wrong{background:color-mix(in srgb,var(--crimson) 16%,transparent);border-color:var(--crimson);opacity:1;}
.quiz-feedback{margin:1.4rem 0 0;color:var(--bone);font-size:1rem;line-height:1.55;min-height:1.4em;}
.quiz-feedback .tag{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;display:inline-block;margin-right:.5em;padding:.1em .55em;border-radius:2px;}
.quiz-feedback .tag.ok{color:var(--gold);border:1px solid color-mix(in srgb,var(--gold) 45%,transparent);}
.quiz-feedback .tag.no{color:var(--crimson);border:1px solid color-mix(in srgb,var(--crimson) 45%,transparent);}
.quiz-feedback b{color:var(--gold-soft);}
.quiz-foot{margin-top:1.5rem;display:flex;justify-content:flex-end;}
.quiz-result{text-align:center;}
.quiz-result .big{font-family:'Cinzel',serif;font-weight:700;font-size:clamp(1.4rem,4vw,2.1rem);color:var(--gold);margin:.4rem 0 .6rem;}
.quiz-result .blurb{color:var(--bone-dim);font-style:italic;max-width:46ch;margin:0 auto 1.5rem;}

/* ============ THE INTERROGATION ============ */
.interrogation{
  max-width:760px;margin:0 auto;border:1px solid var(--line);border-radius:3px;
  background:linear-gradient(180deg,var(--panel),var(--panel-2));box-shadow:var(--shadow);
  padding:clamp(1.6rem,4vw,2.6rem);
}
.interrogation .lead-q{text-align:center;font-family:'Cinzel',serif;font-weight:500;font-size:clamp(1.05rem,2.2vw,1.35rem);color:var(--gold-soft);margin:0 0 .4rem;}
.interrogation .lead-sub{text-align:center;color:var(--bone-dim);font-style:italic;margin:0 0 1.6rem;}
.obj-list{display:grid;gap:.6rem;}
.obj-btn{
  text-align:left;cursor:pointer;width:100%;
  font-family:'EB Garamond',serif;font-size:1.02rem;color:var(--bone);
  background:rgba(0,0,0,.25);border:1px solid var(--line);border-left:2px solid color-mix(in srgb,var(--steel) 45%,transparent);
  border-radius:2px;padding:.85em 1.1em;transition:.25s;display:flex;align-items:center;gap:.7em;
}
.obj-btn::before{content:"“";font-family:'Cinzel',serif;color:var(--steel);font-size:1.3em;line-height:0;flex:none;}
.obj-btn:hover:not(.used){border-color:var(--gold);border-left-color:var(--gold);color:var(--bone);transform:translateX(3px);}
.obj-btn.used{opacity:.4;cursor:default;text-decoration:line-through;text-decoration-color:var(--crimson);}
.obj-response{
  position:relative;margin-top:1.5rem;min-height:2em;
  border:1px solid color-mix(in srgb,var(--gold) 28%,transparent);border-radius:3px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 6%,var(--panel)),var(--panel-2));
  padding:clamp(1.4rem,3.5vw,2rem);color:var(--bone);line-height:1.6;display:none;
}
.obj-response.show{display:block;}
.obj-response b{color:var(--gold-soft);}
.obj-response .stamp{position:absolute;top:-.7rem;right:1.2rem;font-size:.9rem;padding:.3em .7em;}
.obj-counters{display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:center;margin-top:1.6rem;
  font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bone-dim);}
.obj-counters b{font-size:1.1em;}
.obj-counters .zero b{color:var(--crimson);}
.obj-counters .up b{color:var(--gold);}
.deadbox{margin-top:1.6rem;display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;justify-content:center;}
.deadbox input{
  flex:1;min-width:0;background:rgba(0,0,0,.35);border:1px solid var(--line);border-radius:2px;
  color:var(--bone);font-family:'EB Garamond',serif;font-size:1rem;padding:.7em .9em;
}
.deadbox input::placeholder{color:var(--bone-faint);font-style:italic;}
.deadbox input:focus{outline:none;border-color:var(--crimson);}
.deadmsg{width:100%;text-align:center;color:var(--steel);font-style:italic;min-height:1.3em;margin:.4rem 0 0;}

/* stamp */
.stamp{
  display:inline-block;font-family:'Cinzel',serif;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--crimson);border:3px double var(--crimson);border-radius:5px;padding:.45em 1em;transform:rotate(-7deg);
  font-size:clamp(1rem,3vw,1.5rem);opacity:.92;box-shadow:0 0 0 1px rgba(207,64,52,.12);
}
.stamp.gold{color:var(--gold);border-color:var(--gold);box-shadow:0 0 0 1px rgba(201,162,78,.12);}

/* the standoff */
.standoff{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center;margin-top:2rem;}
.deny-msg{margin:1.2rem auto 0;min-height:1.4em;max-width:46ch;color:var(--steel);font-style:italic;text-align:center;}
.counter{margin:.9rem 0 0;font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bone-dim);text-align:center;}
.counter b{color:var(--crimson);font-size:1.1em;}

/* victory */
.victory{text-align:center;}
.victory .big{font-family:'Cinzel',serif;font-weight:700;font-size:clamp(1.5rem,5vw,2.5rem);color:var(--gold);margin:1.5rem 0 .6rem;}
.victory .blurb{color:var(--bone-dim);font-style:italic;max-width:46ch;margin:0 auto;}

/* ============ VERDICT ============ */
.verdict{text-align:center;padding:clamp(4rem,10vh,7rem) 0 clamp(3rem,7vh,5rem);}
.verdict .frame{
  max-width:54ch;margin:0 auto;border:1px solid color-mix(in srgb,var(--gold) 30%,transparent);border-radius:3px;
  background:radial-gradient(120% 120% at 50% 0%,color-mix(in srgb,var(--gold) 6%,var(--panel)),var(--panel-2));
  padding:clamp(2.6rem,6vw,3.8rem) clamp(1.6rem,5vw,3rem);position:relative;box-shadow:var(--shadow);
}
.verdict .seal{display:block;width:46px;height:46px;color:var(--gold);margin:0 auto 1.5rem;}
.verdict .stamp{margin-bottom:1.6rem;}
.verdict .quote{font-family:'Cinzel',serif;font-weight:500;font-size:clamp(1.3rem,3.2vw,2.05rem);line-height:1.32;color:var(--gold-soft);letter-spacing:.01em;}
.verdict .quote em{color:var(--steel);font-style:normal;}
.verdict .quote i{color:var(--crimson);font-style:normal;}
.verdict .attribution{margin-top:1.5rem;color:var(--bone-dim);font-style:italic;font-size:1.02rem;}
.verdict .urlbar{margin-top:1.5rem;}

/* footer */
footer{border-top:1px solid var(--line);padding:2.4rem 0 3.2rem;text-align:center;color:var(--bone-faint);font-size:.86rem;line-height:1.7;}
footer .marks{display:flex;justify-content:center;gap:1.4rem;margin-bottom:1.2rem;opacity:.55;}
footer .marks .m{width:30px;height:30px;}
footer .marks .m:nth-child(1){color:var(--steel);}
footer .marks .m:nth-child(2){color:var(--gold);}
footer .marks .m:nth-child(3){color:var(--gold);}
footer .marks .m:nth-child(4){color:var(--crimson);}
footer em{color:var(--bone-dim);font-style:italic;}

/* reveal */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1;transform:none;}
.compare .house:nth-child(3){transition-delay:.12s;}
.echo-panel.reveal{transition-delay:.18s;}

a:focus-visible,.filter:focus-visible,.btn:focus-visible,.quiz-opt:focus-visible,.obj-btn:focus-visible,.deadbox input:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}

/* responsive */
@media (max-width:760px){
  .houses{flex-direction:column;gap:1.6rem;}
  .bind{flex-direction:row;width:60%;align-self:center;}
  .bind .line{min-height:0;height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold));}
  .bind .line.top{background:linear-gradient(90deg,var(--gold),transparent);}

  .hero{justify-content:flex-start;}

  .scoreboard{grid-template-columns:1fr 1fr;}

  .quiz-options{grid-template-columns:1fr;}

  .compare{grid-template-columns:1fr;gap:1.1rem;}
  .compare::before,.compare .seam-node{display:none;}

  .ledger-titles{display:none;}
  .row{grid-template-columns:1fr;gap:0;}
  .row > div{padding:1rem 1.15rem;}
  .cell-aspect{display:block;font-size:1rem;color:var(--gold);padding-bottom:.4rem;border-bottom:1px solid var(--line);}
  .cell-w{border-left:3px solid color-mix(in srgb,var(--steel) 60%,transparent);}
  .cell-e{border-left:3px solid color-mix(in srgb,var(--crimson) 60%,transparent);}
  .cell-echo{display:block;border-left:3px solid color-mix(in srgb,var(--gold) 70%,transparent);}
  .cell-label{display:block;}
  .cell-w .cell-label{color:var(--steel);}
  .cell-e .cell-label{color:var(--crimson);}
  .cell-echo .cell-label{color:var(--gold);}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;}
  html{scroll-behavior:auto;}
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .house{transition:none;}
  .draw [stroke]{stroke-dashoffset:0!important;}
}
