/* Hire experts — who-do-you-call quiz */
.wc{padding:18px 16px 14px;display:flex;flex-direction:column;gap:14px;min-height:390px;position:relative}
.ticket{background:#fff;border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:12px;padding:14px 16px;box-shadow:0 10px 24px -18px rgba(18,17,38,.45);min-height:104px}
.ticket .mono{color:var(--mute);display:flex;align-items:center;gap:8px}
.ticket .mono:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red);animation:ping 1.4s infinite}
.ticket p{margin:8px 0 0;font:560 clamp(18px,1.6vw,22px)/1.25 var(--display);letter-spacing:-.02em}
.ticket.ring{animation:ringT .5s var(--ease)}
@keyframes ringT{0%{transform:translateY(10px);opacity:0}100%{transform:none;opacity:1}}
.dial-pad{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.who-b{display:flex;align-items:center;gap:10px;border:1px solid var(--line-2);background:#fff;border-radius:999px;padding:7px 14px 7px 7px;text-align:left;font:560 14px/1.2 var(--display);transition:all .25s var(--ease)}
.who-b i{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font:600 12px var(--display);font-style:normal;background:var(--c)}
.who-b:hover:not(:disabled){border-color:var(--ink);transform:translateY(-2px)}
.who-b.right{background:var(--green);border-color:var(--green);color:#fff}
.who-b.wrong{background:#fdecea;border-color:var(--red);color:var(--red);animation:shx .35s}
.who-b:disabled:not(.right):not(.wrong){opacity:.45}
.wc-why{margin:0;font-size:14px;color:var(--ink-2);min-height:42px}
.wc-why b{color:var(--ink)}
#rolelist .row p{font-size:14px}
@media(max-width:560px){.dial-pad{grid-template-columns:1fr}.hud{gap:10px}}