/* Time Machine: one card for the chosen day, two faint cards receding behind it. Typography and one accent. */
.window-timemachine{left:16%;top:56px;width:min(820px,70%);height:calc(100% - 150px)}
.window-timemachine .mac-window-body{background:#0f1117}
.timemachine{flex:1;min-width:0;overflow:auto;outline:none;padding:26px 36px 40px;position:relative;color:#1d1d1f;background:radial-gradient(120% 90% at 50% 0%,#1d2230 0%,#0f1117 70%)}
.tm-stage{position:absolute;left:36px;right:36px;top:14px;height:40px;pointer-events:none}
.tm-ghost{position:absolute;left:5%;right:5%;top:0;height:60px;border-radius:12px;background:rgba(246,246,248,.16);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.tm-ghost span{position:absolute;left:14px;top:6px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:rgba(255,255,255,.45)}
.tm-ghost-1{transform:translateY(0) scale(.96);opacity:.9}
.tm-ghost-2{left:9%;right:9%;transform:translateY(-8px) scale(.92);opacity:.55}
.tm-card{position:relative;background:#fbfbfc;border-radius:14px;padding:22px 26px 20px;box-shadow:0 30px 70px rgba(0,0,0,.5),inset 0 1px 0 #fff;margin-top:22px}
.tm-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#6e6e73;margin:0 0 6px}
.tm-card h1{font-size:26px;letter-spacing:-.02em;margin:0 0 12px;font-weight:700}
.tm-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tm-nav button{font:inherit;font-size:14px;width:34px;height:30px;border-radius:8px;border:1px solid rgba(0,0,0,.14);background:#f6f6f7;color:#1d1d1f}
.tm-nav button:disabled{opacity:.35}
.tm-nav button:focus-visible,.tm-pick input:focus-visible,.tm-open:focus-visible,.tm-source:focus-visible{outline:3px solid #0a84ff;outline-offset:2px}
.tm-pick{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#6e6e73}
.tm-pick input{font:inherit;font-size:13px;padding:4px 8px;border-radius:8px;border:1px solid rgba(0,0,0,.14);background:#fff;color:#1d1d1f}
.tm-section{margin-top:20px;padding-top:14px;border-top:1px solid rgba(0,0,0,.08)}
.tm-section h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#6e6e73;margin:0 0 10px;display:flex;align-items:center;gap:8px;font-weight:600}
.tm-tier{font-size:10px;letter-spacing:.06em;padding:2px 7px;border-radius:999px;border:1px solid #9fd3b2;background:#eef8f1;color:#1f6f43;text-transform:uppercase;font-weight:600}
.tm-state{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:0}
.tm-state div{background:#f2f2f4;border-radius:10px;padding:10px 12px}
.tm-state dt{font-size:11px;color:#6e6e73;margin:0 0 2px}
.tm-state dd{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tm-note{font-size:12.5px;color:#6e6e73;margin:10px 0 0;max-width:70ch}
.tm-section h3{font-size:13px;margin:12px 0 6px;font-weight:600}
.tm-section ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.tm-section li{font-size:13px;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline}
.tm-open{font:inherit;font-size:12.5px;padding:3px 9px;border-radius:8px;border:1px solid rgba(0,0,0,.14);background:#f6f6f7;color:#1d1d1f;text-align:left}
.tm-open:hover{background:#ececee}
.tm-reason,.tm-subject{color:#3a3a3c}
.tm-source{color:#0066cc;text-decoration:none;font-size:12px}
.tm-source:hover{text-decoration:underline}
.tm-empty{font-size:14px;color:#6e6e73;margin:0}
.tm-foot{margin-top:22px;font-size:11.5px;color:#a1a1a6}
.mac-desktop[data-appearance=dark] .tm-card{background:#1c1c1e;color:#f5f5f7}
.mac-desktop[data-appearance=dark] .tm-state div{background:#2c2c2e}
.mac-desktop[data-appearance=dark] .tm-open,.mac-desktop[data-appearance=dark] .tm-nav button,.mac-desktop[data-appearance=dark] .tm-pick input{background:#2c2c2e;color:#f5f5f7;border-color:#ffffff22}
.mac-desktop[data-appearance=dark] .tm-reason,.mac-desktop[data-appearance=dark] .tm-subject{color:#c7c7cc}
@media (prefers-reduced-motion:reduce){.tm-ghost{transition:none}}
@media(max-width:650px){
  .window-timemachine{left:7px!important;top:42px!important;width:calc(100% - 14px)!important;height:calc(100% - 133px)!important}
  .timemachine{padding:16px 14px 40px}
  .tm-card{padding:16px 16px 14px}
  .tm-card h1{font-size:21px}
  .tm-state{grid-template-columns:repeat(2,1fr)}
  .tm-nav button{min-height:36px}
}
