: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:100dvh;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}input,select,textarea{font-size:16px}.app-shell{width:min(1460px,100vw - 56px);padding:max(18px, env(safe-area-inset-top)) 0 max(40px, env(safe-area-inset-bottom));margin:0 auto}.logo-wrap{place-items:center;margin-bottom:22px;padding:8px 0 10px;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.14}.panel{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}.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;position:relative}.event-meta{pointer-events:none;justify-content:space-between;gap:16px;display:flex;position:absolute;top:22px;left:24px;right:24px}.event-meta span,.event-meta strong{color:#d8e4f6;text-overflow:ellipsis;white-space:nowrap;background:#ffffff12;border:1px solid #ffffff24;border-radius:999px;max-width:min(42%,360px);padding:8px 13px;font-size:.92rem;font-weight:950;line-height:1;overflow:hidden}.event-meta span{color:var(--blue);background:#5fd7ff1a}.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{grid-template-columns:86px minmax(180px,320px) 86px 180px;justify-content:center;align-items:center;gap:22px;display:grid}.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;min-width:0;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:26px;padding:0;position:relative}.era-strip{border:1px solid #ffffff2e;border-radius:14px;min-height:84px;display:flex;overflow:hidden}.era{flex:0 0 var(--basis);color:#fff;min-width:0;font:inherit;text-align:center;text-shadow:0 2px 10px #0000008c;cursor:default;background-blend-mode:multiply;filter:brightness(.72)saturate(.86);opacity:.62;background-position:50%;background-size:cover;border:0;border-right:1px solid #ffffff24;place-items:center;padding:13px 10px;transition:border-color .16s,box-shadow .16s,filter .16s,opacity .16s,transform .16s;display:grid}.era:last-child{border-right:0}.era:disabled{cursor:default}.era.active{z-index:1;filter:brightness(1.22)saturate(1.14);opacity:1;border:2px solid #ffffffd1;position:relative;transform:translateY(-2px);box-shadow:0 16px 30px #00000047,inset 0 0 0 2px #ffffff29}.era:focus-visible{outline-offset:-4px;outline:3px solid #ffffffd9}.era span{opacity:.95;font-size:1.45rem}.era-strip.focused .era{padding:13px 16px}.bronze{background-image:linear-gradient(140deg,#5f3819cc,#1e140fe6),url(https://commons.wikimedia.org/wiki/Special:FilePath/Bronze_Age_socketed_hammer_\(FindID_782263\).jpg)}.iron{background-image:linear-gradient(140deg,#48525cd1,#101820e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/Iron_Age,_Sword_-_Pommel_\(FindID_413021\).jpg)}.classical-antiquity{background-image:linear-gradient(140deg,#5c4096c7,#1e1846e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/The_Parthenon_in_Athens.jpg)}.late-antiquity{background-image:linear-gradient(140deg,#674896cc,#271c40e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/Mosaic_with_inscription,_Late_antiquity,_Aigina,_Kolona,_176135.jpg)}.early-medieval{background-image:linear-gradient(140deg,#1e7268c7,#0e3638e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/KellsFol124rTuncCrucixerant.jpg)}.medieval{background-image:linear-gradient(140deg,#1e6552cc,#0c3030e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/Castle_medieval_siege.gif)}.early-modern{background-image:linear-gradient(140deg,#ab5b12c7,#4a2c14e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/Age_of_Discovery_explorations_in_English.png)}.modern{background-image:linear-gradient(140deg,#1e7eaacc,#103852e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/MandK_Industrial_Revolution_1900.jpg)}.present{background-image:linear-gradient(140deg,#a22a8fc7,#391450e6),url(https://commons.wikimedia.org/wiki/Special:FilePath/The_Earth_seen_from_Apollo_17.jpg)}.slider-row{--track-top:14px;--track-height:20px;--track-center:calc(var(--track-top) + (var(--track-height) / 2));touch-action:none;-webkit-user-select:none;user-select:none;height:44px;margin-top:12px;position:relative}.slider-row.answered{--track-top:48px;height:126px}.timeline-gradient{left:0;right:0;top:var(--track-top);height:var(--track-height);background:#52c7e8;border-radius:999px;position:absolute;box-shadow:inset 0 1px 1px #ffffff3d,0 8px 28px #00000042}#yearSlider{inset:0 0 auto;top:calc(var(--track-top) - 20px);opacity:1;cursor:pointer;z-index:10;touch-action:none;appearance:none;background:0 0;width:100%;height:64px;position:absolute}#yearSlider::-webkit-slider-runnable-track{background:0 0;border:0;height:42px}#yearSlider::-webkit-slider-thumb{width:1px;height:46px;box-shadow:none;opacity:0;-webkit-appearance:none;background:0 0;border:0;border-radius:50%;margin-top:-2px}#yearSlider::-moz-range-track{background:0 0;border:0;height:42px}#yearSlider::-moz-range-thumb{width:1px;height:32px;box-shadow:none;opacity:0;background:0 0;border:0;border-radius:50%}#yearSlider.answered,#yearSlider:disabled{opacity:0;pointer-events:none}#yearSlider.answered::-webkit-slider-thumb{opacity:0;box-shadow:none}#yearSlider:disabled::-webkit-slider-thumb{opacity:0;box-shadow:none}#yearSlider.answered::-moz-range-thumb{opacity:0;box-shadow:none}#yearSlider:disabled::-moz-range-thumb{opacity:0;box-shadow:none}.timeline-marker{--x:59.7%;--label-shift:-50%;left:var(--x);top:var(--track-center);pointer-events:none;z-index:3;width:0;height:0;position:absolute}.timeline-marker.compact{--label-shift:-50%}.marker-label{min-width:108px;transform:translateX(var(--label-shift));color:var(--text);text-align:center;background:linear-gradient(145deg,#2a354cfa,#182032fa);border:1px solid #ffffff29;border-radius:12px;padding:9px 12px;font-size:.98rem;font-weight:1000;display:block;position:absolute;bottom:22px;left:0;box-shadow:0 14px 30px #00000052}.marker-label:after{content:"";left:var(--arrow-left,50%);border:8px solid #0000;border-top-color:#2a354cfa;position:absolute;top:100%;transform:translate(-50%)}.timeline-marker.below .marker-label{top:22px;bottom:auto}.timeline-marker.below .marker-label:after{border-top-color:#0000;border-bottom-color:#2a354cfa;top:auto;bottom:100%}.marker-line{background:#fff;border-radius:999px;width:3px;height:12px;display:block;position:absolute;bottom:9px;left:0;transform:translate(-50%);box-shadow:0 0 14px #ffffff6b}.timeline-marker.below .marker-line{top:9px;bottom:auto}.timeline-marker.compact .marker-line{display:none}.marker-dot{background:var(--gold);border:4px solid #040c1bf0;border-radius:50%;width:24px;height:24px;display:block;position:absolute;top:0;left:0;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #ffffff4d,0 0 22px #ffc63fa3}.correct-marker .marker-line,.correct-marker .marker-dot{background:var(--green);box-shadow:0 0 0 2px #ffffff47,0 0 22px #52e6a4a3}.correct-marker .marker-label{background:linear-gradient(145deg,#1e5941fa,#13312afa)}.correct-marker .marker-label:after{border-top-color:#1e5941fa}.correct-marker.below .marker-label:after{border-top-color:#0000;border-bottom-color:#1e5941fa}.answer-marker.wrong .marker-line,.answer-marker.wrong .marker-dot{background:var(--red);box-shadow:0 0 0 2px #ffffff40,0 0 22px #ff5b78ad}.answer-marker.wrong .marker-label{background:linear-gradient(145deg,#692535fa,#3d1826fa)}.answer-marker.wrong .marker-label:after{border-top-color:#692535fa}.timeline-axis{color:var(--muted);justify-content:space-between;margin-top:4px;font-size:1.15rem;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);padding-top:16px}.logo-wrap{margin-bottom:16px}.panel{border-radius:22px}.event-card{min-height:176px;margin-bottom:16px;padding:28px 20px}.answer-panel{margin-bottom:16px;padding:24px 16px 22px}.answer-controls{grid-template-columns:62px minmax(0,1fr) 62px 104px;gap:10px}#manualYear{width:100%;min-width:0;padding:0 16px}#eraSelect{width:100%;padding:0 16px}.year-step{width:62px;height:68px}.era-strip{overflow:hidden}.era{scroll-snap-align:start;min-height:66px;padding:11px 8px}.result-summary{grid-template-columns:1fr}}@media (width<=560px){body{background:radial-gradient(circle at 12% 8%,#2a9bdc2e,#0000 20rem),radial-gradient(circle at 92% 4%,#ffb3281a,#0000 18rem),linear-gradient(#020816 0%,#061126 52%,#020714 100%)}.app-shell{width:min(100% - 16px,1460px);padding-top:12px}h1{letter-spacing:-.06em;font-size:clamp(2.45rem,16vw,3.65rem)}.event-card{min-height:148px;padding:22px 16px}.event-meta{gap:8px;top:12px;left:12px;right:12px}.event-meta span,.event-meta strong{max-width:48%;padding:7px 9px;font-size:.72rem}.event-card p,.answer-label{letter-spacing:.16em;margin-bottom:12px;font-size:.76rem}h2{font-size:clamp(1.45rem,8vw,2.25rem);line-height:1.12}.answer-panel{padding:18px 10px 20px}.answer-controls{grid-template-columns:42px minmax(0,1fr) 42px 64px;gap:6px}.year-step,#manualYear,#eraSelect{border-radius:14px;height:58px}.year-step{width:42px;font-size:1.55rem}#manualYear{padding:0 6px;font-size:clamp(1.8rem,12vw,2.7rem)}#eraSelect{padding:0 6px;font-size:.92rem}.hint{margin-top:12px;font-size:.88rem}.result-summary{gap:8px;margin-top:16px;padding:12px}.result-summary strong{font-size:1rem}.result-summary span{font-size:.78rem}.timeline-wrap{margin-top:22px}.era-strip{border-radius:12px}.era{gap:2px 8px;min-height:58px;padding:9px 10px}.era span{font-size:1.05rem}.era strong{font-size:.78rem}.era small{font-size:.7rem}.slider-row{--track-top:12px;--track-height:18px;height:40px;margin-top:10px}.slider-row.answered{--track-top:44px;height:116px}.timeline-gradient{height:var(--track-height)}#yearSlider{height:62px}.marker-label{overflow-wrap:anywhere;min-width:76px;max-width:98px;padding:7px 8px;font-size:.78rem}.marker-label:after{border-width:8px}.marker-line{width:3px;height:10px}.marker-dot{border-width:3px;width:20px;height:20px}.timeline-axis{font-size:.9rem}#submitButton{bottom:max(8px, env(safe-area-inset-bottom));z-index:20;border-radius:18px;min-height:58px;font-size:1.08rem;position:sticky}#submitButton.answered{margin-top:12px;position:static}}@media (width<=380px){.app-shell{width:min(100% - 12px,1460px)}.answer-panel{padding-inline:8px}.answer-controls{grid-template-columns:38px minmax(0,1fr) 38px 58px;gap:5px}.year-step{width:38px;font-size:1.35rem}#manualYear{padding-inline:4px;font-size:clamp(1.65rem,12vw,2.35rem)}#eraSelect{padding:0 4px;font-size:.82rem}}