.clockwork{--gold:#efc66c;--copper:#c77d4e;--cream:#fff3d5;position:relative;min-height:760px;overflow:hidden;border-radius:27px;background:radial-gradient(circle at 50% 6%,#38466c,#141c35 48%,#0b1023 82%);color:#f8f1df;box-shadow:0 20px 55px rgba(9,17,42,.28)}.clockwork *{box-sizing:border-box}.clockwork [hidden]{display:none!important}.clockwork button,.clockwork a{-webkit-tap-highlight-color:transparent}
.clockwork-header{display:flex;position:relative;z-index:10;align-items:center;justify-content:space-between;gap:14px;padding:15px 21px;border-bottom:1px solid rgba(255,255,255,.12);background:rgba(8,13,31,.47);backdrop-filter:blur(9px)}.clockwork-back{color:rgba(255,255,255,.75);font-size:.84rem;font-weight:800}.clockwork-header-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}.clockwork-quiet{min-height:35px;padding:7px 11px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.06);color:#f2ead9;cursor:pointer;font:inherit;font-size:.71rem;font-weight:800}.clockwork-quiet:hover,.clockwork-quiet:focus-visible{border-color:var(--gold);background:rgba(239,198,108,.12)}
.clockwork-kicker{margin:0;color:var(--gold);font-size:.67rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.clockwork-intro{display:flex;min-height:700px;align-items:center;justify-content:center;flex-direction:column;padding:46px 24px 60px;text-align:center}.clockwork-intro h1{margin:8px 0 16px;color:white;font-family:Georgia,serif;font-size:clamp(3rem,7.2vw,6rem);font-weight:500;letter-spacing:-.05em;line-height:.88}.clockwork-intro h1 span{color:var(--gold);font-style:italic}.clockwork-lead{max-width:780px;margin:0;color:rgba(255,255,255,.75);font-size:1.02rem;line-height:1.58}.clockwork-timeline{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;width:min(1080px,100%);margin:26px 0 9px;padding:0;list-style:none}.clockwork-timeline li{position:relative;min-height:121px;padding:16px 11px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:linear-gradient(145deg,rgba(239,198,108,.1),rgba(255,255,255,.035));text-align:left}.clockwork-timeline li:not(:last-child):after{content:'';position:absolute;z-index:2;right:-9px;top:31px;width:9px;height:2px;background:#9d8658}.clockwork-timeline b,.clockwork-timeline strong,.clockwork-timeline small{display:block}.clockwork-timeline b{color:#c8a65e;font-size:.59rem;letter-spacing:.07em}.clockwork-timeline strong{margin-top:8px;color:white;font-family:Georgia,serif;font-size:1rem}.clockwork-timeline small{margin-top:4px;color:rgba(255,255,255,.54);font-size:.66rem;line-height:1.35}.clockwork-parallel-note{margin:0 0 17px;color:rgba(255,255,255,.48);font-size:.67rem;font-style:italic}
.clockwork-identity{width:min(390px,100%);margin:0 0 12px;padding:12px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(6,11,27,.55);text-align:left}.clockwork-identity label{display:block;margin-bottom:5px;color:#fff0c7;font-size:.72rem;font-weight:850}.clockwork-identity input{width:100%;padding:10px 11px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(255,255,255,.09);color:white;font:inherit}.clockwork-identity input::placeholder{color:rgba(255,255,255,.4)}.clockwork-identity small{display:block;margin-top:5px;color:rgba(255,255,255,.46);font-size:.63rem}.clockwork-identity p{margin:7px 0 0;color:#ffc6aa;font-size:.7rem;font-weight:750}
.clockwork-primary,.clockwork-secondary{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:16px;padding:12px 23px;border-radius:999px;cursor:pointer;font:inherit;font-weight:900}.clockwork-primary{border:0;background:var(--gold);color:#28233a;box-shadow:0 9px 25px rgba(239,198,108,.18)}.clockwork-primary:hover,.clockwork-primary:focus-visible{background:#ffe09a;text-decoration:none}.clockwork-secondary{border:1px solid rgba(255,255,255,.25);background:transparent;color:white}.clockwork-secondary:hover,.clockwork-secondary:focus-visible{border-color:var(--gold);text-decoration:none}.clockwork-small-note{margin:12px 0 0;color:rgba(255,255,255,.49);font-size:.7rem}
.clockwork-play{padding:17px 19px 29px}.clockwork-hud{display:grid;grid-template-columns:auto minmax(130px,1fr) auto auto;align-items:center;gap:14px;max-width:1160px;margin:0 auto 12px;padding:10px 14px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(6,12,29,.66)}.clockwork-hud>div:not(.clockwork-progress-track){display:flex;flex-direction:column}.clockwork-hud span{color:rgba(255,255,255,.48);font-size:.55rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.clockwork-hud strong{color:#fff0c7;font-size:.83rem}.clockwork-progress-track{height:7px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.12)}.clockwork-progress-track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#bd7149,#efcf77);transition:width .35s ease}
.clockwork-play-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(285px,.65fr);gap:13px;max-width:1160px;margin:auto}.clockwork-canvas-wrap{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:#111a35}.clockwork-canvas-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;touch-action:none}.clockwork-toast{position:absolute;left:50%;bottom:17px;width:max-content;max-width:calc(100% - 26px);padding:9px 14px;border:1px solid #d89162;border-radius:999px;background:rgba(65,34,27,.95);color:#ffead5;font-size:.76rem;font-weight:800;text-align:center;transform:translateX(-50%)}.clockwork-toast.is-good{border-color:#d9c06c;background:rgba(60,55,25,.95);color:#fff4c5}
.clockwork-mission-panel{display:flex;min-width:0;flex-direction:column;padding:23px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(7,13,30,.84)}.clockwork-mission-panel h2{margin:7px 0 10px;color:white;font-family:Georgia,serif;font-size:clamp(1.8rem,3vw,2.55rem);font-weight:500;line-height:1}.clockwork-mission-panel>p:not(.clockwork-kicker){margin:0;color:rgba(255,255,255,.7);font-size:.84rem;line-height:1.55}.clockwork-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:19px}.clockwork-control{min-height:44px;padding:9px;border:1px solid rgba(255,255,255,.17);border-radius:10px;background:rgba(255,255,255,.07);color:white;cursor:pointer;font:inherit;font-size:.75rem;font-weight:800}.clockwork-control:hover,.clockwork-control:focus-visible{border-color:var(--gold);background:rgba(239,198,108,.11)}.clockwork-control.primary{grid-column:1/-1;border-color:var(--gold);background:var(--gold);color:#272038}.clockwork-slider{grid-column:1/-1;display:grid;gap:7px;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#ead8ad;font-size:.7rem;font-weight:800}.clockwork-slider input{width:100%;accent-color:var(--gold)}.clockwork-readout{grid-column:1/-1;padding:9px;border-radius:9px;background:rgba(239,198,108,.08);color:#f5db9d;font-size:.74rem;text-align:center}.clockwork-goal{margin-top:auto;padding-top:16px}.clockwork-goal span{color:var(--gold);font-size:.58rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.clockwork-goal p{margin:4px 0 0;color:rgba(255,255,255,.62);font-size:.75rem;line-height:1.45}
.clockwork-check{display:grid;min-height:700px;padding:30px;place-items:center}.clockwork-check-card{width:min(750px,100%);padding:34px;border:1px solid rgba(255,255,255,.14);border-radius:21px;background:rgba(8,14,32,.93);box-shadow:0 22px 65px rgba(0,0,0,.25)}.clockwork-check-card h2{margin:8px 0 10px;color:white;font-family:Georgia,serif;font-size:clamp(2rem,5vw,3.5rem);font-weight:500}.clockwork-check-card>p:not(.clockwork-kicker){margin:0;color:rgba(255,255,255,.75)}.clockwork-check-options{display:grid;gap:9px;margin:22px 0}.clockwork-check-option{padding:14px;border:1px solid rgba(255,255,255,.14);border-radius:11px;background:rgba(255,255,255,.06);color:white;cursor:pointer;font:inherit;font-size:.87rem;font-weight:700;text-align:left}.clockwork-check-option:hover:not(:disabled),.clockwork-check-option:focus-visible{border-color:var(--gold);background:rgba(239,198,108,.1)}.clockwork-check-option.is-correct{border-color:#82c69b;background:rgba(74,147,115,.2)}.clockwork-check-option.is-wrong{border-color:#df8a6b;background:rgba(165,79,58,.2)}.clockwork-check-feedback{display:grid;gap:3px;margin-bottom:17px;padding:13px;border-radius:10px;background:rgba(74,147,115,.18)}.clockwork-check-feedback.is-wrong{background:rgba(165,79,58,.18)}.clockwork-check-feedback strong{color:white}.clockwork-check-feedback span{color:rgba(255,255,255,.7);font-size:.8rem;line-height:1.45}
.clockwork-finish{display:flex;min-height:700px;align-items:center;justify-content:center;flex-direction:column;padding:42px 24px 60px;text-align:center}.clockwork-proof{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:20px;padding:18px;border:1px solid rgba(239,198,108,.22);border-radius:18px;background:rgba(8,14,32,.65)}.clockwork-badge{display:grid;position:relative;width:142px;height:142px;place-items:center;border:4px double #e9c771;border-radius:50%;background:radial-gradient(circle,#b66f47 0 29%,#273451 30% 52%,#e5c16a 53% 57%,#111a31 58%);box-shadow:0 0 0 8px rgba(239,198,108,.08),0 13px 37px rgba(0,0,0,.28)}.clockwork-badge.is-locked{filter:grayscale(1);opacity:.45}.clockwork-badge span{position:absolute;top:10px;color:#ffe49c;font-size:1.35rem}.clockwork-badge strong{margin-top:4px;color:white;font-family:Georgia,serif;font-size:1.95rem}.clockwork-badge small{position:absolute;bottom:16px;color:#fff0bd;font:800 .62rem ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.03em}.clockwork-proof dl{display:grid;gap:7px;min-width:210px;margin:0;text-align:left}.clockwork-proof dl div{padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.1)}.clockwork-proof dt{color:rgba(255,255,255,.46);font-size:.56rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.clockwork-proof dd{margin:2px 0 0;color:#fff1c9;font-size:.86rem;font-weight:850}.clockwork-finish h2{margin:7px 0 10px;color:white;font-family:Georgia,serif;font-size:clamp(2.7rem,7vw,4.9rem);font-weight:500}.clockwork-finish>p:not(.clockwork-kicker):not(.clockwork-small-note){max-width:650px;margin:0;color:rgba(255,255,255,.72)}.clockwork-final-score{display:flex;align-items:center;flex-direction:column;margin:22px 0}.clockwork-final-score span{color:var(--gold);font-size:3.6rem;font-weight:950;line-height:1}.clockwork-final-score small{color:rgba(255,255,255,.55)}.clockwork-finish-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.clockwork-sources{position:fixed;z-index:1000;inset:0;display:grid;padding:18px;overflow-y:auto;place-items:center;background:rgba(3,7,19,.9);backdrop-filter:blur(9px)}.clockwork-sources-card{position:relative;width:min(740px,100%);max-height:calc(100dvh - 36px);padding:32px;overflow-y:auto;border:1px solid #575d78;border-radius:19px;background:#121a35}.clockwork-sources-card h2{margin:6px 0 12px;color:white;font-family:Georgia,serif;font-size:2.2rem}.clockwork-sources-card p,.clockwork-sources-card li{color:rgba(255,255,255,.72);font-size:.86rem;line-height:1.55}.clockwork-sources-card li{margin-bottom:8px}.clockwork-source-links{display:grid;gap:7px;margin-top:18px}.clockwork-source-links a{padding:10px 12px;border-radius:9px;background:rgba(255,255,255,.06);color:#f2d58d;font-size:.78rem;font-weight:750}.clockwork-sources-close{position:absolute;right:13px;top:13px;width:38px;height:38px;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:transparent;color:white;cursor:pointer;font-size:1.35rem}.clockwork:fullscreen{width:100vw;min-height:100dvh;border-radius:0;overflow-y:auto}
@media(max-width:780px){main.container:has(.clockwork){width:100%;padding-inline:0}.clockwork{min-height:calc(100dvh - 145px);border-radius:0}.clockwork-header{padding:9px 10px}.clockwork-quiet{min-height:33px;padding:6px 8px;font-size:.63rem}.clockwork-intro{min-height:calc(100dvh - 182px);padding:29px 13px 44px}.clockwork-intro h1{font-size:clamp(2.7rem,13.5vw,4.5rem)}.clockwork-lead{font-size:.86rem}.clockwork-timeline{grid-template-columns:repeat(2,minmax(0,1fr));margin:20px 0 8px}.clockwork-timeline li{min-height:92px;padding:11px}.clockwork-timeline li:after{display:none}.clockwork-play{padding:7px}.clockwork-hud{grid-template-columns:auto 1fr auto;gap:8px;padding:8px 9px}.clockwork-hud>div:last-child{display:none}.clockwork-play-layout{grid-template-columns:1fr}.clockwork-canvas-wrap{border-radius:11px}.clockwork-mission-panel{padding:14px;border-radius:12px}.clockwork-mission-panel h2{font-size:1.75rem}.clockwork-mission-panel>p:not(.clockwork-kicker){font-size:.78rem}.clockwork-controls{margin-top:13px}.clockwork-goal{margin-top:10px;padding-top:7px}.clockwork-check{min-height:calc(100dvh - 182px);padding:9px}.clockwork-check-card{padding:22px 15px;border-radius:13px}.clockwork-check-option{padding:12px;font-size:.8rem}.clockwork-finish{min-height:calc(100dvh - 182px);padding:32px 13px 45px}.clockwork-sources{padding:7px}.clockwork-sources-card{max-height:calc(100dvh - 14px);padding:27px 17px;border-radius:12px}}
@media(max-height:580px) and (orientation:landscape){.clockwork-header{padding-block:6px}.clockwork-intro{min-height:460px;padding-block:18px}.clockwork-timeline{margin:12px 0 6px}.clockwork-timeline li{min-height:78px}.clockwork-play{padding:6px}.clockwork-hud{margin-bottom:6px}.clockwork-play-layout{grid-template-columns:1.7fr .8fr}.clockwork-mission-panel{padding:11px}.clockwork-mission-panel h2{font-size:1.4rem}.clockwork-mission-panel>p:not(.clockwork-kicker){font-size:.69rem}.clockwork-controls{margin-top:7px}.clockwork-control{min-height:35px;padding:6px}.clockwork-goal{padding-top:5px}.clockwork-check,.clockwork-finish{min-height:450px}}
@media(prefers-reduced-motion:reduce){.clockwork *,.clockwork *:before,.clockwork *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}