:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#020816;--panel:#091427c7;--panel-2:#0f1d35b8;--line:#9ebee638;--text:#f7fbff;--muted:#9aa8bf;--blue:#5fd7ff;--gold:#ffc63f;--green:#52e6a4;--orange:#ff9f43;--red:#ff5b78}*{box-sizing:border-box}body{min-height:100vh;color:var(--text);background:radial-gradient(circle at 18% 14%,#2a9bdc33,#0000 34rem),radial-gradient(circle at 83% 18%,#ffb3281f,#0000 30rem),linear-gradient(#020816 0%,#061126 48%,#020714 100%);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.app-shell{width:min(1460px,100vw - 56px);margin:0 auto;padding:28px 0 40px}.logo-wrap{place-items:center;margin-bottom:24px;display:grid}h1{letter-spacing:-.07em;background:linear-gradient(100deg,#fff 8%,#a8ecff 36%,#62d9ff 48%,#ffe36a 73%,#fff 95%);color:#0000;filter:drop-shadow(0 12px 34px #56d2ff2e);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(3.4rem,6.4vw,5.8rem);font-weight:1000;line-height:1.02}.panel,.status-bar{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(145deg,#0d1b34d6,#071021c7);border-radius:26px;box-shadow:0 28px 80px #00000057,inset 0 1px #ffffff0d}.status-bar{grid-template-columns:250px 270px minmax(0,1fr);align-items:center;gap:0;min-height:84px;margin-bottom:32px;padding:0 32px;display:grid}.status-cell{border-right:1px solid #ffffff1f;align-items:center;gap:20px;height:44px;font-size:1.08rem;display:flex}.status-icon{width:42px;height:42px;color:var(--blue);text-shadow:0 0 20px #5fd7ffb3;border:0;border-radius:0;place-items:center;font-size:2.1rem;display:grid}.status-progress{color:#b9c5da;grid-template-columns:minmax(220px,1fr) auto auto;align-items:center;gap:20px;padding-left:40px;font-size:1.02rem;font-weight:850;display:grid}.progress-track{background:#ffffff14;border:1px solid #ffffff1a;border-radius:999px;height:12px;overflow:hidden}#progressFill{border-radius:inherit;background:linear-gradient(90deg, var(--blue), var(--gold));width:4%;height:100%;transition:width .25s}.event-card{text-align:center;background:radial-gradient(circle at 50% 0,#45a5e52e,#0000 42%),linear-gradient(145deg,#0e2240e6,#061022db);align-content:center;justify-items:center;min-height:238px;margin-bottom:22px;padding:36px clamp(26px,8vw,180px);display:grid}.event-card p,.answer-label{color:var(--blue);letter-spacing:.23em;text-transform:uppercase;margin:0 0 18px;font-size:.92rem;font-weight:1000}h2{letter-spacing:-.045em;text-wrap:balance;max-width:950px;margin:0;font-size:clamp(2rem,4vw,4rem);line-height:1.08}.answer-panel{margin-bottom:24px;padding:32px 26px 30px;position:relative}.answer-label{text-align:center;margin-bottom:18px;display:block}.answer-controls{justify-content:center;align-items:center;gap:22px;display:flex}.year-step,#manualYear,#eraSelect{height:86px;color:var(--text);background:linear-gradient(145deg,#ffffff14,#ffffff09);border:1px solid #afcdf538;border-radius:16px;outline:none;box-shadow:inset 0 1px #ffffff0f,0 18px 34px #0000002e}.year-step{place-items:center;width:86px;font-size:2.2rem;font-weight:1000;display:grid}.year-step:focus,#manualYear:focus,#eraSelect:focus{border-color:var(--blue);box-shadow:0 0 0 3px #5fd7ff3d,0 0 32px #5fd7ff47}.year-step:active{transform:translateY(1px)}#manualYear{text-align:center;font-variant-numeric:tabular-nums;width:320px;padding:0 34px;font-size:clamp(3rem,5vw,4.6rem);font-weight:450;line-height:1}#eraSelect{width:180px;padding:0 30px;font-size:1.8rem;font-weight:900}.hint{color:var(--muted);text-align:center;margin:16px 0 0;font-size:1.05rem;font-weight:800}.result-summary{border:1px solid var(--line);text-align:center;background:#ffffff0e;border-radius:18px;grid-template-columns:repeat(3,1fr);gap:12px;width:min(820px,100%);margin:22px auto 0;padding:16px 18px;display:grid}.result-summary strong{font-size:1.18rem;display:block}.result-summary span{color:var(--muted);font-weight:800}.result-summary.perfect{border-color:var(--green);background:#52e6a421}.result-summary.amazing{background:#52e6a41a;border-color:#8af0c7}.result-summary.great{border-color:var(--blue);background:#5fd7ff1a}.result-summary.good{border-color:var(--gold);background:#ffc63f1f}.result-summary.close{border-color:var(--orange);background:#ff9f431f}.result-summary.far{border-color:var(--red);background:#ff5b7821}.timeline-wrap{margin-top:46px;padding:0;position:relative}.era-strip{border:1px solid #ffffff2e;border-radius:14px;grid-template-columns:1.08fr .94fr .98fr .96fr .94fr .82fr;min-height:106px;display:grid;overflow:hidden}.era{text-shadow:0 2px 10px #0000008c;border-right:1px solid #ffffff24;grid-template-columns:auto minmax(0,1fr);align-content:center;gap:4px 14px;padding:16px 18px;display:grid}.era:last-child{border-right:0}.era span{opacity:.9;grid-row:1/3;align-self:center;font-size:1.55rem}.era strong{align-self:end;font-size:1.02rem}.era small{color:#ffffffc7;font-size:.95rem}.ancient{background:linear-gradient(140deg,#8b6437db,#5c412ad1)}.classical{background:linear-gradient(140deg,#6b4cabd1,#36275dd6)}.medieval{background:linear-gradient(140deg,#278c7cd1,#175654db)}.early{background:linear-gradient(140deg,#c57119e0,#74471ddb)}.modern{background:linear-gradient(140deg,#289fcddb,#185677e0)}.present{background:linear-gradient(140deg,#cc46b4e6,#782b7ee0)}.slider-row{height:70px;margin-top:10px;position:relative}.timeline-gradient{background:linear-gradient(90deg,#e5a45f,#b974d4,#6e99e8,#55c9bc,#e4a24e,#57c9f0,#d04fc5);border-radius:999px;height:20px;position:absolute;top:18px;left:0;right:0;box-shadow:inset 0 1px 1px #fff3,0 8px 28px #00000042}#yearSlider{opacity:0;cursor:pointer;z-index:10;width:100%;height:126px;position:absolute;inset:0 0 auto}.timeline-marker{--x:59.7%;left:var(--x);pointer-events:none;z-index:3;position:absolute;top:-64px;transform:translate(-50%)}.marker-label{min-width:108px;color:var(--text);text-align:center;background:linear-gradient(145deg,#2a354cfa,#182032fa);border:1px solid #ffffff29;border-radius:12px;margin-bottom:8px;padding:12px 14px;font-size:1.08rem;font-weight:1000;display:block;box-shadow:0 14px 30px #00000052}.marker-label:after{content:"";border:10px solid #0000;border-top-color:#2a354cfa;position:absolute;top:48px;left:50%;transform:translate(-50%)}.marker-line{background:#fff;border-radius:999px;width:5px;height:105px;margin:0 auto;display:block;box-shadow:0 0 18px #ffffff73}.marker-dot{background:var(--gold);border:7px solid #fff;border-radius:50%;width:44px;height:44px;position:absolute;top:154px;left:50%;transform:translate(-50%);box-shadow:0 0 0 8px #ffc63f2e,0 12px 26px #0000004d}.correct-marker .marker-line{background:var(--green);box-shadow:0 0 18px #52e6a499}.correct-marker .marker-dot{background:var(--green)}.correct-marker .marker-label{background:linear-gradient(145deg,#1e5941fa,#13312afa)}.correct-marker .marker-label:after{border-top-color:#1e5941fa}.answer-marker.wrong .marker-line{background:var(--red);box-shadow:0 0 18px #ff5b78a6}.answer-marker.wrong .marker-dot{background:var(--red)}.answer-marker.wrong .marker-label{background:linear-gradient(145deg,#692535fa,#3d1826fa)}.answer-marker.wrong .marker-label:after{border-top-color:#692535fa}.markers-close .answer-marker .marker-label{transform:translate(-58%)}.markers-close .correct-marker .marker-label{transform:translate(58%)}.timeline-axis{color:var(--muted);justify-content:space-between;margin-top:2px;font-size:1.3rem;display:flex}#submitButton{color:#07101d;background:linear-gradient(#ffd863,#ffb222);border:0;border-radius:22px;width:100%;min-height:62px;font-size:1.42rem;font-weight:1000;box-shadow:0 20px 52px #ffb22242,inset 0 1px #ffffff8c}.hidden{display:none}@media (width<=900px){.app-shell{width:min(100% - 24px,1460px)}.status-bar{grid-template-columns:1fr;gap:14px;padding:18px}.status-cell{border-bottom:1px solid #ffffff1f;border-right:0;padding-bottom:12px}.status-progress{grid-template-columns:1fr;gap:8px;padding-left:0}.answer-controls{flex-wrap:wrap;gap:10px}#manualYear{width:min(100%,280px)}#eraSelect{width:120px}.year-step{width:68px;height:68px}.era-strip{grid-template-columns:1fr 1fr}.era{min-height:82px}.result-summary{grid-template-columns:1fr}}