:root{color-scheme:light;--blue:#0070c0;--ink:#20384c;--gray:#657a8d;--rule:#d9e4ec;--pale:#edf5fb}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:white}
body{font:24px/1.45 "PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink)}
#slide{position:absolute;width:1280px;height:720px;transform-origin:top left;background:white}
header{position:absolute;left:36px;right:36px;top:25px;height:68px;border-bottom:2px solid var(--blue);display:flex;justify-content:space-between;align-items:flex-start}
h1{font-size:35px;line-height:1.3;color:var(--blue);margin:0;font-weight:650}
h2{font-size:25px;font-weight:600;margin:0;color:var(--ink)}
.tools{display:flex;gap:12px}
button{font:inherit;font-size:21px;border:1px solid #a8c3d7;background:white;color:var(--blue);border-radius:5px;padding:7px 16px;cursor:pointer;white-space:nowrap}
button:hover,button[aria-pressed=true]{background:var(--pale);border-color:var(--blue)}
button:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.katex{font-size:1em}svg{position:absolute;display:block}svg text{font:22px "PingFang SC","Microsoft YaHei",sans-serif;fill:var(--ink)}
#sphere{left:26px;top:104px;width:660px;height:500px}
#prob-chart{left:730px;top:108px;width:510px;height:500px}
.state-panel{position:absolute;left:750px;top:127px;width:490px}
#state-formula{height:110px;display:flex;align-items:center;font-size:32px;white-space:nowrap}
.prob-title{margin:14px 0 20px}
.prob-row{margin-bottom:28px}.prob-label{display:flex;justify-content:space-between;align-items:center;font-size:29px;margin-bottom:10px}
.prob-label output{font-size:29px;font-variant-numeric:tabular-nums;color:var(--blue)}
.track{height:28px;width:100%;background:var(--pale);border-radius:3px;overflow:hidden}
.bar{height:100%;background:var(--blue)}.bar.secondary{background:var(--gray)}
.presets{display:flex;gap:8px;margin-top:22px;align-items:center}.presets button{padding:7px 11px;font-size:22px}
.phase-presets{display:flex;gap:6px;align-items:center;margin-left:4px;font-size:22px}
.phase-presets button{padding:7px 8px}
.controls{position:absolute;left:36px;right:36px;top:618px;height:76px;border-top:1px solid var(--rule);display:flex;align-items:center}
.controls input{accent-color:var(--blue);height:24px;cursor:pointer}
.controls output{color:var(--blue);font-variant-numeric:tabular-nums}
.angle-controls{gap:48px}.angle-controls label{display:flex;align-items:center;gap:14px;flex:1;white-space:nowrap}
.angle-controls input{width:290px}.angle-controls output{min-width:67px;text-align:right}
.time-controls{gap:18px}.initial{display:flex;gap:10px;align-items:center}.initial>span{margin-right:4px}
.time-controls label{display:flex;align-items:center;gap:18px}.time-controls input{width:285px}.time-controls output{width:66px}
.period{margin-left:auto;font-size:24px;flex-shrink:0}
@media print{
  button,input{visibility:hidden}
  .phase-presets{visibility:hidden}
  .initial button[aria-pressed=true]{visibility:visible;border-color:transparent;background:none}
  #slide{print-color-adjust:exact;-webkit-print-color-adjust:exact}
}