:root{color-scheme:dark;--bg:#1b1916;--cream:#eee7d9;--gold:#cdb885;--muted:#9f998c;--line:#d3c39c20}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 23% 37%,#3b2c202c,transparent 55%),var(--bg);color:var(--cream);font:14px 'Yu Mincho','Hiragino Mincho ProN',serif}button,input,select,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}header{max-width:1440px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line)}.wordmark{font:10px Arial,sans-serif;letter-spacing:2.4px;color:#c9c2b2;text-decoration:none}.wordmark b{font-size:28px;color:var(--gold);vertical-align:middle;margin-right:13px}.focus-launch{border:1px solid #e5d7af;background:linear-gradient(125deg,#e9ddb9,#b69a60);color:#2b241c;padding:14px 28px;border-radius:4px;font-size:20px;letter-spacing:1px;box-shadow:0 5px 24px #bd9b5218}.focus-launch small{display:block;font:9px Arial;letter-spacing:1.4px;opacity:.7;margin-top:4px}main{max-width:1270px;margin:auto;padding:37px 5% 48px;display:grid;grid-template-columns:1.12fr 1fr;gap:8%;align-items:center}.exhibit{min-width:0}.exhibit-label{display:flex;justify-content:space-between;font:8px Arial;letter-spacing:1.3px;color:#8e8a80;gap:10px}.exhibit-label span:first-child{color:var(--gold)}.clock-wrap{position:relative;isolation:isolate;width:100%;max-width:565px;margin:25px auto 18px;aspect-ratio:1;filter:drop-shadow(0 20px 25px #0009)}.clock-base{display:block;width:100%;height:100%;position:relative;z-index:1}.clock-over,#mechanism{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.clock-over{z-index:3}#mechanism{z-index:2}.clock-placeholder{aspect-ratio:1;width:100%}.exhibit-caption{text-align:center;min-height:18px;color:#b7ae9a;letter-spacing:.6px;font-size:11px}.motion-legend{display:flex;justify-content:center;gap:9px;font:9px Arial;color:#8d897f;margin:18px 0 10px}.motion-legend i{font-style:normal;color:var(--gold)}.quiet{display:block;margin:auto;background:none;border:0;color:#bba879;padding:10px;font-size:11px}.eyebrow{font:9px Arial;letter-spacing:1.8px;color:var(--gold);margin-bottom:23px}h1{font-size:42px;letter-spacing:3px;font-weight:400;line-height:1.4;margin:0 0 22px}h1 em{font-style:normal;font-size:35px;color:var(--gold)}h1 span{display:block;font-size:16px;letter-spacing:3px;margin-top:10px}.intro{font-size:12px;line-height:2.15;color:#a9a396;margin-bottom:26px}.time-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-block:1px solid var(--line);padding:18px 0;margin-bottom:22px}#digital{font:32px Georgia,serif;letter-spacing:2px}#digital span{font-size:18px;color:#9a9281}#date{font:10px Arial;color:#9c9383}.track-head{display:flex;justify-content:space-between;font:8px Arial;color:#99917f;letter-spacing:1.6px;margin-bottom:10px}.track-picker{display:flex;align-items:center;border:1px solid #a9956e33;background:#27221b;border-radius:4px}.track-picker button{border:0;background:transparent;color:var(--gold);font-size:25px;padding:5px 13px}.track-picker select{min-width:0;width:100%;color:#e2d9c7;border:0;background:transparent;font-size:12px;padding:13px 2px}.track-picker option,.setting option{background:#29251d}.source{font-size:10px;line-height:1.7;color:#8e897d;margin:9px 0 17px}.play{width:100%;display:flex;align-items:center;gap:12px;border:1px solid #d9c492;background:linear-gradient(125deg,#e5d7af,#b99c61);color:#29231b;padding:18px 17px;border-radius:4px;font-size:15px}.play small{font:10px Arial;opacity:.65;margin-left:auto}#playIcon{font:14px Arial}.play:hover,.focus-launch:hover{filter:brightness(1.08)}.seek-row{display:flex;gap:12px;align-items:center;margin:12px 0 5px}.seek-row input{flex:1;min-width:0;accent-color:#c4ab73;height:10px}.seek-row span{font:9px Arial;color:#9a917e;min-width:32px;text-align:right}.performance{display:flex;align-items:center;justify-content:space-between;font:9px Arial;color:#99917e;min-height:20px}.performance button{border:0;background:none;color:#8d8677;font-size:9px;padding:5px}.random-play{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:1px solid #9e92714d;background:#353323;color:#d5d5b9;padding:12px;border-radius:4px;font-size:13px;margin:12px 0 18px}.random-play small{font:9px Arial;letter-spacing:1px;color:#9c9e7a}.settings{border-top:1px solid var(--line);padding-top:10px}.setting{display:flex;align-items:center;gap:12px;color:#b0a695;font-size:11px;margin:11px 0}.setting input{flex:1;min-width:0;accent-color:#c5ad75}.setting output{font:10px Arial;width:30px;text-align:right}.setting select{margin-left:auto;max-width:210px;background:#27231c;border:1px solid var(--line);color:#b8ad99;padding:7px 11px;border-radius:3px;font-size:10px}.toggle{display:flex;align-items:center;gap:8px;color:#aaa18e;font-size:11px;margin:13px 0}.toggle input{accent-color:#cdb783}.toggle small{font:8px Arial;color:#807765;margin-left:auto}.buttons{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.buttons button{background:none;border:1px solid var(--line);color:#b6aa95;padding:9px;font-size:10px;border-radius:3px}#status{font-size:11px;line-height:1.8;color:#b8ab91;min-height:20px}.next-hour{font:10px Arial;color:#807763;letter-spacing:.3px}details{border-top:1px solid var(--line);margin-top:22px;padding-top:16px}summary{font-size:10px;color:#aaa08d;cursor:pointer}details p{font-size:10px;line-height:1.95;color:#938875}a{color:#c4ae7e}footer{max-width:1440px;margin:auto;padding:22px 5%;display:flex;justify-content:space-between;border-top:1px solid var(--line);color:#7f7664;font-size:9px}footer span:last-child{font:8px Arial;letter-spacing:1px}#performanceVideo{position:fixed;width:1px;height:1px;opacity:.001;left:0;bottom:0;pointer-events:none}#exitFocus{display:none;position:fixed;bottom:15px;right:15px;z-index:20;border:1px solid #d8c59b44;background:#29241bd9;color:#d6c9af;padding:10px 18px;border-radius:20px;font-size:11px}.focus header,.focus .controls,.focus footer,.focus .exhibit-label,.focus .exhibit-caption,.focus .motion-legend,.focus #detail{display:none}.focus main{display:block;max-width:none;padding:0}.focus .clock-wrap{width:min(98vw,98dvh);max-width:none;margin:1dvh auto}.focus #exitFocus{display:block}dialog{width:min(1040px,95vw);max-height:95dvh;border:1px solid #b3a47c44;border-radius:8px;background:#201c16;color:#d5c8af;padding:21px}dialog::backdrop{background:#0c0905e8;backdrop-filter:blur(6px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:15px;color:#ccbb91;font:10px Arial;letter-spacing:1.2px;margin-bottom:15px}.dialog-head button{background:none;border:1px solid var(--line);color:#c9b99a;padding:8px 13px;border-radius:3px}dialog p{font-size:11px;line-height:1.9;color:#a99c85}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}.comparison .clock-wrap{width:100%;max-width:none;margin:0;filter:none}.comparison video{width:100%;display:block;aspect-ratio:1;object-fit:contain;background:#0c0906}.detail-photo{display:block;width:min(100%,650px);margin:auto;border-radius:4px}#compareSeek{display:block;width:100%;accent-color:#c2a873;margin:20px 0 10px}.compare-actions{display:flex;align-items:center;justify-content:space-between}.compare-actions button{background:#4d432f;border:1px solid #9d8a5b;color:#e5d6b2;padding:10px 20px;border-radius:3px}.compare-actions span{font:11px Arial;color:#b7a787}@media(max-width:760px){header{padding:18px 6%;flex-wrap:wrap}.wordmark{font-size:8px}.focus-launch{width:100%;min-height:57px;font-size:20px}main{display:block;padding:26px 6% 40px}.clock-wrap{max-width:490px;margin:18px auto}.controls{margin-top:35px}h1{font-size:36px}.eyebrow{font-size:8px}.exhibit-label{font-size:7px}.motion-legend{font-size:8px}.intro{font-size:12px}.play{font-size:14px}.comparison{gap:9px}footer{gap:15px;line-height:1.8}.focus .clock-wrap{width:min(99vw,97dvh);margin:1dvh auto}#date{font-size:9px}dialog{padding:15px}}@media(min-width:761px) and (max-height:850px){main{padding-top:25px;gap:6%}h1{font-size:37px;margin-bottom:16px}.eyebrow{margin-bottom:14px}.intro{margin-bottom:18px}.time-row{padding:13px 0;margin-bottom:18px}}
