:root{
  --ink:#3a2412; --ink-soft:#6b4a2b; --gold:#d9a441; --gold-hi:#f3d27a;
  --parch:#f4e4c1; --parch-dark:#e2c992; --night:#1a1008;
  --house-a:#7f0909; --house-b:#d3a625;
  --serif:"IM Fell English", Georgia, "Times New Roman", serif;
  --title:"Cinzel Decorative", "IM Fell English", Georgia, serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{
  font-family:var(--serif); color:var(--ink);
  background:
    radial-gradient(ellipse at 50% -10%, #2b3557 0%, #0f1424 62%) fixed,
    radial-gradient(ellipse at 50% 110%, rgba(255,150,50,.22), transparent 55%) fixed,
    #0f1424;
  min-height:100vh; display:flex; flex-direction:column; align-items:center;
  -webkit-tap-highlight-color:transparent; overflow-x:hidden;
}
#app{width:100%; max-width:720px; padding:18px 14px 8px; flex:1; position:relative; z-index:1}
#stars{position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:0}
.screen{display:none; animation:fadeIn .5s ease}
.screen.active{display:block}
@keyframes fadeIn{from{opacity:0; transform:translateY(8px)}to{opacity:1; transform:none}}

/* floating candles */
.candles{position:fixed; inset:0; pointer-events:none; z-index:0}
.candles span{position:absolute; width:10px; height:46px; background:linear-gradient(#fff6df,#e8d3a6); border-radius:3px;
  box-shadow:0 0 24px 6px rgba(255,190,90,.12); animation:float 6s ease-in-out infinite}
.candles span::before{content:""; position:absolute; left:50%; top:-16px; width:10px; height:16px; margin-left:-5px;
  background:radial-gradient(ellipse at 50% 70%, #fff 0 20%, #ffd36b 40%, #ff8a1e 70%, transparent 72%);
  border-radius:50% 50% 50% 50%/60% 60% 40% 40%; filter:blur(.3px); animation:flicker .18s infinite alternate}
.candles span::after{content:""; position:absolute; left:50%; top:-40px; width:60px; height:60px; margin-left:-30px;
  background:radial-gradient(circle, rgba(255,200,100,.35), transparent 65%)}
.candles span:nth-child(1){left:6%; top:8%; animation-delay:-1s}
.candles span:nth-child(2){left:88%; top:14%; animation-delay:-3s}
.candles span:nth-child(3){left:20%; top:70%; animation-delay:-2s; opacity:.7}
.candles span:nth-child(4){left:78%; top:62%; animation-delay:-4s; opacity:.7}
.candles span:nth-child(5){left:50%; top:3%; animation-delay:-5s; opacity:.5; transform:scale(.7)}
@keyframes float{50%{translate:0 -14px}}
@keyframes flicker{from{transform:scale(1) rotate(-2deg)}to{transform:scale(1.08,.94) rotate(2deg)}}

/* parchment */
.parchment{
  position:relative; background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(ellipse at 80% 90%, rgba(140,90,30,.25), transparent 60%),
    linear-gradient(135deg, var(--parch), var(--parch-dark));
  border-radius:14px; padding:24px 18px 26px; text-align:center;
  box-shadow:0 0 0 2px #b8904f inset, 0 0 0 7px rgba(90,55,20,.15) inset, 0 18px 50px rgba(0,0,0,.6), 0 0 60px rgba(255,170,60,.15);
}
h1{font-family:var(--title); font-size:clamp(2rem, 9vw, 3.2rem); line-height:1.05; margin:.2em 0 .3em; color:#5a2c0c;
  text-shadow:0 1px 0 #fff3cf, 0 0 18px rgba(217,164,65,.6)}
.lead{font-size:1.3rem; line-height:1.4; margin:0 auto 1.1em; max-width:28em}
label{display:block; font-size:1.35rem; margin-bottom:.4em; font-style:italic}
input[type=text]{width:100%; max-width:420px; font:inherit; font-size:1.5rem; padding:14px 16px; text-align:center;
  border-radius:12px; border:2px solid #a57b3c; background:#fffaf0; color:var(--ink); outline:none}
input[type=text]:focus{border-color:var(--gold); box-shadow:0 0 0 4px rgba(217,164,65,.35)}
.hat-wrap{display:flex; justify-content:center}
.hat{width:min(58vw,230px); height:auto; filter:drop-shadow(0 10px 12px rgba(0,0,0,.35)); animation:bob 3.5s ease-in-out infinite; transform-origin:50% 90%}
@keyframes bob{50%{transform:rotate(-3deg) translateY(-6px)}}

.btn{display:block; width:100%; max-width:420px; margin:14px auto 0; min-height:64px; padding:14px 18px; font:inherit; font-size:1.4rem;
  border-radius:16px; border:0; cursor:pointer; touch-action:manipulation; transition:transform .1s, filter .2s}
.btn:active{transform:scale(.97)}
.btn-gold{background:linear-gradient(#f3d27a,#c88c2a); color:#3a1f05; box-shadow:0 4px 0 #8a5a14, 0 8px 20px rgba(0,0,0,.35); font-weight:bold}
.btn-ghost{background:rgba(255,250,235,.85); color:var(--ink); box-shadow:0 0 0 2px #a57b3c inset}
.btn-danger{background:transparent; color:#7a1a10; box-shadow:0 0 0 2px #b0503f inset; font-size:1.1rem; min-height:54px}
.toggles{display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-top:16px}
.chip{font:inherit; font-size:1.05rem; min-height:48px; padding:8px 14px; border-radius:999px; border:2px solid #a57b3c;
  background:rgba(255,250,235,.7); color:var(--ink); cursor:pointer}
.chip[aria-pressed=true]{background:#f3d27a}
.link-btn{font:inherit; font-size:1.2rem; background:none; border:0; color:#5a2c0c; text-decoration:underline; margin-top:14px; min-height:48px; cursor:pointer}

/* quiz */
.progress{display:flex; gap:4px}
.progress i{flex:1; height:8px; background:rgba(90,55,20,.2); border-radius:4px; transition:background .3s}
.progress i.on{background:linear-gradient(90deg,#c88c2a,#f3d27a)}

.qcount{margin:.5em 0 0; font-style:italic; color:var(--ink-soft); font-size:1.1rem}
.mini-hat svg{width:90px; height:auto; animation:bob 3s ease-in-out infinite; transform-origin:50% 90%}
.question{font-size:clamp(1.6rem, 6.5vw, 2.2rem); line-height:1.2; margin:.1em 0 .4em; color:#4a2408}
.speak-btn{margin-bottom:14px}
.answers{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.answer{font:inherit; font-size:1.3rem; line-height:1.15; min-height:120px; padding:12px 8px; border-radius:16px; cursor:pointer;
  border:2px solid #a57b3c; background:linear-gradient(#fffaf0,#f1deb4); color:var(--ink);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  box-shadow:0 4px 0 #a57b3c; touch-action:manipulation; transition:transform .1s}
.answer .emoji{font-size:2.6rem; line-height:1}
.answer:active, .answer.picked{transform:translateY(3px); box-shadow:0 1px 0 #a57b3c; background:#f3d27a}
.answer:focus-visible, .btn:focus-visible, .chip:focus-visible{outline:4px solid #f3d27a; outline-offset:2px}
.answers.tie .answer{min-height:110px}

/* thinking */
.thinking{min-height:70vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center}
.hat.big{width:min(75vw,300px)}
.wobble{animation:wobble 1.1s ease-in-out infinite}
@keyframes wobble{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg) translateY(-8px)}}
.hat-speech{font-size:clamp(1.6rem,7vw,2.4rem); color:#ffe9b8; font-style:italic; min-height:3em; padding:0 10px;
  text-shadow:0 0 20px rgba(255,180,80,.7); animation:fadeIn .5s}
.hat .hat-mouth{animation:talk .35s infinite alternate}
.thinking .hat-mouth{animation:talk .3s infinite alternate}
@keyframes talk{to{transform:translateY(3px) scaleY(1.3); transform-origin:100px 112px}}

/* result */
.result-card{position:relative; text-align:center; border-radius:18px; padding:26px 18px 28px; color:#fff8e6;
  background:radial-gradient(ellipse at 50% 0%, rgba(255,255,255,.18), transparent 60%), linear-gradient(160deg, var(--house-a), #120a05 140%);
  box-shadow:0 0 0 3px var(--house-b) inset, 0 0 0 8px rgba(0,0,0,.25) inset, 0 20px 60px rgba(0,0,0,.6), 0 0 80px color-mix(in srgb, var(--house-b) 40%, transparent);
  animation:reveal .9s cubic-bezier(.2,1.4,.4,1)}
@keyframes reveal{from{transform:scale(.6) rotate(-4deg); opacity:0}to{transform:none; opacity:1}}
.crest{width:min(62vw,240px); margin:0 auto; filter:drop-shadow(0 10px 18px rgba(0,0,0,.5)); animation:shine 3s ease-in-out infinite}
.crest svg{width:100%; height:auto; display:block}
@keyframes shine{50%{filter:drop-shadow(0 10px 18px rgba(0,0,0,.5)) drop-shadow(0 0 16px var(--house-b))}}
.result-pre{font-size:1.4rem; margin:.6em 0 0; font-style:italic}
.house-name{font-family:var(--title); font-size:clamp(2.4rem, 11vw, 3.8rem); margin:.05em 0 .15em; color:var(--house-b);
  text-shadow:0 2px 0 rgba(0,0,0,.5), 0 0 22px var(--house-b)}
.house-traits{font-size:1.35rem; font-weight:bold; margin:0 0 .5em; letter-spacing:.02em}
.house-desc{font-size:1.25rem; line-height:1.45; max-width:30em; margin:0 auto}
.result-actions{margin-top:18px}
.confetti{position:fixed; inset:0; pointer-events:none; overflow:hidden; z-index:5}
.confetti i{position:absolute; top:-20px; width:10px; height:14px; border-radius:2px; animation:fall linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}

/* board */
.board-title{font-family:var(--title); font-size:clamp(1.7rem,7vw,2.4rem); margin:.1em 0 0; color:#5a2c0c}
.small{margin:.2em 0 1em; font-style:italic; color:var(--ink-soft)}
.board-houses{display:grid; grid-template-columns:1fr; gap:12px; text-align:left}
.board-house{border-radius:14px; padding:12px 14px; color:#fff8e6; background:linear-gradient(135deg,var(--a),#1a0f07 160%); box-shadow:0 0 0 2px var(--b) inset}
.board-house h3{margin:0 0 6px; font-family:var(--title); font-size:1.35rem; color:var(--b); display:flex; align-items:center; gap:8px}
.board-house h3 .mini-crest{width:34px; height:40px}
.board-house ul{list-style:none; margin:0; padding:0}
.board-house li{display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:1.3rem; padding:6px 0; border-top:1px solid rgba(255,255,255,.15)}
.board-house li:first-child{border-top:0}
.board-house .none{font-style:italic; opacity:.7; font-size:1.05rem}
.remove{font:inherit; font-size:1rem; min-height:44px; min-width:44px; padding:6px 12px; border-radius:10px; border:1px solid rgba(255,255,255,.5); background:rgba(0,0,0,.25); color:#fff; cursor:pointer}
.board-empty{font-size:1.25rem; font-style:italic}
.footer{position:relative; z-index:1; color:#c9ad7f; font-size:.95rem; text-align:center; padding:14px 16px 22px; opacity:.85}


/* merged extras */
.eyebrow{font-family:"IM Fell English SC", Georgia, serif; letter-spacing:.18em; font-size:.95rem; color:#8a6232; text-transform:none}
.houses{list-style:none; margin:4px 0 18px; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; text-align:left}
.houses li{display:flex; gap:8px; align-items:center; background:rgba(255,250,235,.55); border-radius:10px; padding:8px; min-width:0; border-left:8px solid var(--c)}
.houses .an{font-size:1.6rem}
.houses b{font-family:"IM Fell English SC", Georgia, serif; font-size:1.1rem; display:block}
.houses span.t{display:block; font-size:.9rem; color:var(--ink-soft); line-height:1.2}
.mode{border:0; padding:0; margin:14px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:10px; max-width:420px}
.mode-btn{font:inherit; font-size:1.15rem; min-height:84px; border-radius:14px; border:2px solid #a57b3c; background:rgba(255,250,235,.6); color:var(--ink); cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:8px}
.mode-btn .emoji{font-size:1.8rem}
.mode-btn small{font-size:.85rem; color:var(--ink-soft); font-style:italic}
.mode-btn[aria-pressed=true]{background:#f3d27a; box-shadow:0 0 0 3px #c88c2a inset}
.btn-wand{background:linear-gradient(#4b3a7a,#2a2050); color:#ffeec2; box-shadow:0 4px 0 #17112f, 0 8px 20px rgba(0,0,0,.35), 0 0 18px rgba(170,140,255,.25) inset; font-weight:bold}
.tonight{margin:18px 0 0; padding:18px; border-radius:12px; background:linear-gradient(180deg,#171e33,#232b45); border:1px solid rgba(232,196,122,.25); color:#ece6d6; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.45)}
.tonight h2{font-family:"IM Fell English SC", Georgia, serif; font-weight:400; letter-spacing:.1em; color:#e8c47a; margin:0 0 10px; font-size:1.3rem}
.tonight-list{display:flex; flex-wrap:wrap; gap:8px; justify-content:center}
.tonight-list .pill{font-size:1.1rem; padding:6px 12px; border-radius:999px; border:1px solid var(--c); color:#fff; background:color-mix(in srgb, var(--c) 35%, transparent)}
.tonight .muted{color:#a3a7b8; font-style:italic; margin:0}
.tonight .link-btn{color:#e8c47a}
.house-motto{font-style:italic; font-size:1.2rem; margin:0 0 10px; opacity:.9}
.traits{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:0 0 12px}
.traits span{font-family:"IM Fell English SC", Georgia, serif; letter-spacing:.06em; font-size:1.05rem; border:1px solid var(--house-b); color:var(--house-b); padding:4px 12px; border-radius:999px; background:rgba(0,0,0,.2)}
.mix{margin:16px auto 0; max-width:420px; text-align:left; background:rgba(0,0,0,.22); border-radius:12px; padding:12px 14px}
.mix h3{margin:0 0 8px; font-family:"IM Fell English SC", Georgia, serif; font-weight:400; letter-spacing:.08em; font-size:1.1rem; text-align:center}
.bars{display:flex; flex-direction:column; gap:8px}
.bar{display:grid; grid-template-columns:28px 92px 1fr 40px; gap:8px; align-items:center; font-size:1rem}
.bar .t{height:10px; background:rgba(255,255,255,.12); border-radius:5px; overflow:hidden}
.bar .t div{height:100%; width:0; border-radius:5px; transition:width 1s ease}
.bar .n{text-align:right; font-variant-numeric:tabular-nums}
.row{display:flex; gap:10px; max-width:420px; margin:0 auto}
.row .btn{flex:1}
/* wand shop */
.shop-title{font-family:var(--title); font-size:clamp(1.6rem,7vw,2.3rem); margin:.1em 0 .2em; color:#5a2c0c}
.wand-stage{position:relative; border-radius:14px; background:radial-gradient(ellipse at 70% 50%, #2b3557, #0f1424 75%); box-shadow:0 0 0 2px #a57b3c inset, 0 8px 22px rgba(0,0,0,.35); padding:6px; margin:0 0 12px}
.wand-stage svg{display:block; width:100%; height:auto}
.wand-stage.big{margin-top:6px}
.who-list{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 0 16px}
.who-list button{font:inherit; font-size:1.2rem; min-height:56px; padding:8px 16px; border-radius:14px; border:2px solid var(--c,#a57b3c); background:rgba(255,250,235,.8); cursor:pointer; color:var(--ink)}
.wand-nav{margin-top:12px}
.wand-nav .btn{margin-top:0; min-height:56px; font-size:1.15rem}
.answer .hint{font-size:.95rem; font-style:italic; color:var(--ink-soft)}
.answer.suggested{box-shadow:0 4px 0 #a57b3c, 0 0 0 3px #c88c2a inset}
.answer .badge{font-size:.8rem; background:#c88c2a; color:#fff; border-radius:999px; padding:1px 8px}
.wand-chosen{font-size:1.3rem; font-style:italic; margin:0}
.wand-tag{position:relative; margin:6px auto 0; max-width:440px; text-align:left; padding:16px 18px 14px; background:linear-gradient(#fffaf0,#efdcb0); border-radius:6px; box-shadow:0 0 0 1px #a57b3c inset, 0 6px 16px rgba(0,0,0,.25); transform:rotate(-1deg)}
.wand-tag::before{content:""; position:absolute; top:12px; right:14px; width:12px; height:12px; border-radius:50%; background:#0f1424; box-shadow:0 0 0 3px #c88c2a}
.wand-tag h4{margin:0 0 6px; font-family:"IM Fell English SC", Georgia, serif; font-weight:400; font-size:1.3rem; letter-spacing:.05em; color:#5a2c0c}
.wand-tag p{margin:0 0 6px; font-size:1.15rem; line-height:1.4}
.wand-tag .spec{font-size:1.25rem; font-weight:bold}
.wand-tag .sig{font-style:italic; text-align:right; color:var(--ink-soft); font-size:1rem}
.board-house .wand-thumb{display:block; width:110px; height:auto; border-radius:6px; background:#0f1424}
.board-house li .who{display:flex; flex-direction:column; gap:4px; min-width:0}
.board-house li .acts{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end}
.board-house .mk{font:inherit; font-size:1rem; min-height:44px; padding:6px 10px; border-radius:10px; border:1px solid rgba(255,255,255,.5); background:rgba(255,255,255,.15); color:#fff; cursor:pointer}
.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:#1b2238; color:#ffeec2; padding:12px 18px; border-radius:12px; z-index:10; font-size:1.15rem; box-shadow:0 8px 22px rgba(0,0,0,.4); border:1px solid #e8c47a}

@media (min-width:700px){
  #app{padding-top:36px}
  .parchment{padding:34px 40px 36px}
  .answers{gap:16px}
  .answer{min-height:140px; font-size:1.4rem}
  .board-houses{grid-template-columns:1fr 1fr}
  .houses{grid-template-columns:repeat(4,1fr)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}
.answers.text-answers{grid-template-columns:1fr}
.answers.text-answers .answer{min-height:72px; font-size:1.2rem; text-align:left; align-items:flex-start; padding:14px 16px}
.board-house .wand-thumb{width:150px; padding:2px}
.board-house .wand-thumb svg{display:block; width:100%; height:auto}
.btn:disabled{opacity:.45; cursor:default}
.answer[aria-current=true]{background:linear-gradient(#fff3cc,#f3d27a)}
.wand-stage .wand-glow{animation:pulse 2.2s ease-in-out infinite; transform-box:fill-box; transform-origin:center}
@keyframes pulse{50%{opacity:.65; transform:scale(1.12)}}

/* =====================================================================
   BLUE THEME — palette and card styling taken from Taylor's
   "Sorting Ceremony" version. Overrides the earlier parchment look.
   House colors (result card, crests, board groups) are unchanged.
   ===================================================================== */
:root{
  --night:#0f1424; --night-2:#171e33; --ink-blue:#232b45;
  --candle:#e8c47a; --candle-dim:#a98f5c;
  --text:#ece6d6; --muted:#a3a7b8;
  --line:rgba(232,196,122,.22); --line-soft:rgba(232,196,122,.18); --line-strong:rgba(232,196,122,.4);
  --ink:var(--text); --ink-soft:var(--muted);
  color-scheme:dark;
}
body{color:var(--text); background:radial-gradient(ellipse at 50% -10%, #26304f 0%, var(--night) 60%) fixed, var(--night)}
.parchment, .tonight{
  background:linear-gradient(180deg,var(--night-2),var(--ink-blue));
  border:1px solid var(--line); border-radius:6px; color:var(--text);
  box-shadow:0 20px 60px rgba(0,0,0,.45);
}
h1{color:var(--candle); text-shadow:0 0 24px rgba(232,196,122,.25)}
.eyebrow{color:var(--candle-dim)}
.lead, .small, .board-empty{color:var(--text)}
.small, .qcount, .tonight .muted{color:var(--muted)}
label{color:var(--candle-dim); font-family:"IM Fell English SC", Georgia, serif; font-style:normal; letter-spacing:.12em}
input[type=text]{background:var(--night); border:1px solid rgba(232,196,122,.3); color:var(--text); border-radius:4px}
input[type=text]::placeholder{color:var(--muted); opacity:1}
input[type=text]:focus{border-color:var(--candle); box-shadow:none; outline:2px solid var(--candle); outline-offset:1px}
.hat{filter:drop-shadow(0 10px 18px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(232,196,122,.18))}

/* buttons */
.btn{border-radius:4px; font-family:"IM Fell English SC", Georgia, serif; letter-spacing:.06em; transition:transform .15s, box-shadow .15s}
.btn-gold{background:var(--candle); color:var(--night); box-shadow:0 8px 20px rgba(0,0,0,.35)}
.btn-gold:hover{box-shadow:0 0 22px rgba(232,196,122,.45)}
.btn-ghost{background:transparent; color:var(--candle); box-shadow:none; border:1px solid var(--line-strong)}
.btn-ghost:hover{background:rgba(232,196,122,.07); border-color:var(--candle)}
.btn-wand{background:linear-gradient(180deg,#3a4a7e,#26304f); color:var(--candle); border:1px solid var(--line-strong); box-shadow:0 8px 20px rgba(0,0,0,.35), 0 0 18px rgba(232,196,122,.12) inset}
.btn-wand:hover{box-shadow:0 0 22px rgba(232,196,122,.35)}
.btn-danger{color:#f0a196; border:1px solid rgba(240,161,150,.55); box-shadow:none; border-radius:4px}
.chip{background:rgba(15,20,36,.6); border:1px solid var(--line-strong); color:var(--text)}
.chip[aria-pressed=true]{background:rgba(232,196,122,.16); border-color:var(--candle); color:var(--candle)}
.link-btn, .tonight .link-btn{color:var(--candle)}
.btn:focus-visible, .chip:focus-visible, .answer:focus-visible, .mode-btn:focus-visible, .link-btn:focus-visible, .who-list button:focus-visible{outline:2px solid var(--candle); outline-offset:3px}

/* home extras */
.houses li{background:rgba(15,20,36,.6); border:1px solid var(--line-soft); border-left:8px solid var(--c); border-radius:4px}
.houses b{color:var(--text)}
.houses span.t{color:var(--muted)}
.mode-btn{background:rgba(15,20,36,.6); border:1px solid var(--line-soft); border-radius:4px; color:var(--text)}
.mode-btn small{color:var(--muted)}
.mode-btn[aria-pressed=true]{background:rgba(232,196,122,.14); border-color:var(--candle); box-shadow:0 0 0 1px var(--candle) inset}
.tonight h2{color:var(--candle)}

/* questions */
.progress i{background:rgba(232,196,122,.15); height:4px; border-radius:2px}
.progress i.on{background:var(--candle)}
.question{color:var(--text); font-family:"IM Fell English", Georgia, serif}
.answer{background:rgba(15,20,36,.6); border:1px solid var(--line-soft); border-radius:4px; color:var(--text); box-shadow:none; transition:border-color .15s, background .15s, transform .1s}
.answer:hover{border-color:var(--candle); background:rgba(232,196,122,.07)}
.answer:active, .answer.picked{transform:translateY(1px); box-shadow:none; background:rgba(232,196,122,.2); border-color:var(--candle)}
.answer[aria-current=true]{background:rgba(232,196,122,.1); border-color:var(--candle-dim)}
.answer .hint{color:var(--muted)}
.answer.suggested{box-shadow:0 0 0 1px var(--candle) inset; border-color:var(--candle)}
.answer .badge{background:var(--candle); color:var(--night)}

/* thinking */
.hat-speech{color:var(--candle); text-shadow:0 0 24px rgba(232,196,122,.35)}

/* result card keeps house colors; just match the card corners */
.result-card{border-radius:6px}
.mix{background:rgba(15,20,36,.45); border-radius:4px}

/* wand shop */
.shop-title, .board-title{color:var(--candle)}
.wand-stage{background:radial-gradient(ellipse at 70% 50%, #26304f, var(--night) 75%); box-shadow:none; border:1px solid var(--line); border-radius:6px}
.who-list button{background:rgba(15,20,36,.6); color:var(--text); border:1px solid var(--line-soft); border-left:6px solid var(--c,var(--candle)); border-radius:4px}
.who-list button:hover{border-color:var(--candle)}
.wand-chosen{color:var(--candle)}
.wand-tag{background:linear-gradient(180deg,var(--night-2),var(--ink-blue)); color:var(--text); border:1px solid var(--line-strong); border-radius:6px; box-shadow:0 10px 30px rgba(0,0,0,.4); transform:none}
.wand-tag::before{background:var(--night); box-shadow:0 0 0 3px var(--candle)}
.wand-tag h4{color:var(--candle)}
.wand-tag .spec{color:var(--text)}
.wand-tag .sig{color:var(--muted)}

/* board */
.board-house{border-radius:4px}
.toast{background:var(--night-2); color:var(--text); border:1px solid var(--line-strong); border-radius:6px}
.footer{color:var(--muted)}

/* themed modal (replaces the browser's confirm box) */
.modal-back{position:fixed; inset:0; z-index:20; background:rgba(5,8,16,.72); display:flex; align-items:center; justify-content:center; padding:20px; animation:fadeIn .2s ease}
.modal{width:100%; max-width:400px; background:linear-gradient(180deg,var(--night-2),var(--ink-blue)); border:1px solid var(--line); border-radius:6px; padding:24px 20px 20px; text-align:center; color:var(--text); box-shadow:0 20px 60px rgba(0,0,0,.6)}
.modal h3{margin:0 0 8px; font-family:"IM Fell English SC", Georgia, serif; font-weight:400; letter-spacing:.08em; color:var(--candle); font-size:1.4rem}
.modal p{margin:0 0 6px; font-size:1.2rem; line-height:1.4}
.modal .btn{margin-top:12px}