:root{--green:#064c2b;--green2:#0b6339;--amber:#f5ad00;--ink:#292929;--muted:#65736b;--paper:#fbfcfa;--shadow:0 18px 55px rgba(4,63,35,.16)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:#eef3ef}button{font:inherit}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 15%,rgba(245,173,0,.08),transparent 24%),radial-gradient(circle at 90% 80%,rgba(6,76,43,.1),transparent 28%)}
.brand-strip{height:9px;background:linear-gradient(90deg,#a5003c 0 22%,#dc152d 22% 34%,#eb7000 34% 55%,#f5ad00 55% 78%,#ded0aa 78%)}
.pill{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .85rem;border-radius:999px;background:#e7f0eb;color:var(--green);font-weight:800;font-size:.86rem;letter-spacing:.03em}.dot{width:.65rem;height:.65rem;border-radius:50%;background:#8da097}.dot.live{background:#22a65a;box-shadow:0 0 0 5px rgba(34,166,90,.14)}
.timer{position:relative;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:conic-gradient(var(--amber) calc(var(--progress)*1%),#dfe7e2 0);box-shadow:0 8px 25px rgba(0,0,0,.12)}.timer:after{content:"";position:absolute;inset:7px;border-radius:50%;background:white}.timer b{position:relative;z-index:1;font-size:1.8rem;color:var(--green)}
.options{display:grid;grid-template-columns:1fr 1fr;gap:16px}.option{position:relative;border:2px solid #dbe5df;background:white;border-radius:18px;padding:20px 20px 20px 64px;text-align:left;min-height:82px;font-weight:700;font-size:clamp(1rem,1.6vw,1.4rem);color:#26362e;box-shadow:0 6px 18px rgba(5,70,39,.07);transition:.18s}.option .letter{position:absolute;left:16px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--green);color:#fff;font-weight:900}.option:disabled{cursor:default}.option.selected{border-color:var(--amber);background:#fff9e9;transform:translateY(-2px)}
.result-row{display:grid;grid-template-columns:42px minmax(150px,1fr) 4fr 70px;gap:14px;align-items:center;margin:14px 0;font-size:1.1rem;font-weight:750}.result-letter{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--green);color:white}.bar{height:28px;background:#e6ece8;border-radius:999px;overflow:hidden}.bar>i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--green),#138454);border-radius:inherit;transition:width .8s cubic-bezier(.2,.8,.2,1)}
.primary,.secondary{border:0;border-radius:13px;padding:13px 22px;font-weight:850;cursor:pointer}.primary{color:white;background:linear-gradient(135deg,var(--green),var(--green2));box-shadow:0 8px 20px rgba(6,76,43,.22)}.secondary{color:var(--green);background:#e6eee9}.primary:disabled,.secondary:disabled{opacity:.35;cursor:not-allowed}.loading{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--green);font-weight:850}.loading i{width:12px;height:12px;border-radius:50%;background:var(--amber);animation:bounce 1s infinite}.loading i:nth-child(2){animation-delay:.15s}.loading i:nth-child(3){animation-delay:.3s}@keyframes bounce{50%{transform:translateY(-9px)}}
@media(max-width:700px){.options{grid-template-columns:1fr}.option{min-height:72px;padding:16px 14px 16px 58px}.timer{width:68px;height:68px}.timer b{font-size:1.5rem}.result-row{grid-template-columns:36px 1fr 54px}.result-row>span:nth-child(2){grid-column:2/4}.bar{grid-column:2/3}}