.phase-page .lab-workspace{grid-template-columns:minmax(0,1fr) 350px}.phase-page .lab-heading{padding-bottom:18px}.phase-page .lab-heading h1{font-size:clamp(36px,3.65vw,59px)}.phase-transport{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:0 28px 22px}.phase-transport label{display:flex;gap:8px;align-items:center;font-size:14px;color:#b9c8d4;margin-left:8px}.phase-transport select{color:#e3e8e9;background:#142130;border:1px solid #73859670;padding:8px;font-size:14px}.phase-clock{margin-left:auto;color:#edc093;font:25px var(--world-serif);white-space:nowrap;font-variant-numeric:tabular-nums}
.phase-stage{background:#112339;border-block:1px solid #a5bed12b}.phase-view{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:16px 23px;border-bottom:1px solid #a5bed12b}.phase-view button{border:1px solid #7893a756;color:#c2d7e5;background:#132438;padding:9px 14px;font-size:14px}.phase-view button[aria-pressed=true]{border-color:#e8bd84;background:#3c322a;color:#f8dbb4}.phase-view>span{font-size:13px;color:#b3c9d9;margin-left:auto}.phase-stage canvas{width:100%;height:500px;display:block}.phase-stage>p{padding:16px 24px 21px;color:#adc5d6;font-size:14px;line-height:1.7;max-width:960px}.phase-page .lab-data dt{font-size:14px}.phase-page .lab-data dd{font-size:30px}.phase-page .lab-data dd small{display:inline}
.phase-state{padding:22px 28px;border-top:1px solid var(--site-line)}.phase-state-heading{display:flex;gap:14px;align-items:center;justify-content:space-between}.phase-state h2{font:30px var(--world-serif);color:#f1d1a8}.phase-state-heading>span{font-size:12px;letter-spacing:1px;border:1px solid #c2e4fc55;background:#17304a;color:#c6e5f7;padding:7px 10px;white-space:nowrap}.phase-state>p{font-size:15px;color:#c0d0dc;line-height:1.7;margin-top:12px;max-width:850px}.mass-bar{display:flex;height:14px;overflow:hidden;background:#354351;margin:22px 0 17px}.mass-bar i{display:block;height:100%;min-width:0}#mass-ice{background:#d3efff}#mass-liquid{background:#4bb3df}#mass-vapour{background:repeating-linear-gradient(135deg,#a9afe44d,#a9afe44d 4px,#bcbfe2b8 4px,#bcbfe2b8 6px)}.mass-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;font-size:14px;color:#bfd0dd}.mass-legend>span:before{content:'';display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;background:var(--dot)}.ice-key{--dot:#d3efff}.liquid-key{--dot:#4bb3df}.vapour-key{--dot:#b6b8e7}.mass-legend strong{display:block;font-weight:500;font-size:20px;color:#d5e5ef;margin-top:7px;font-variant-numeric:tabular-nums}
.phase-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:18px 28px;border-top:1px solid var(--site-line);font-size:14px;color:#adbecc}.phase-actions button{padding:10px 14px;border:1px solid #abbed041;background:#152334;color:#efd1ad;font-size:14px}.phase-actions>span{margin-right:5px}.phase-chart{height:210px}.phase-page .chart-heading{flex-wrap:wrap;align-items:baseline}.phase-page .chart-heading p{font-size:17px}.phase-page .chart-heading>span{font-size:13px}.phase-legend{font-size:14px;gap:9px 19px;line-height:1.5}.phase-legend .comparison-legend:before{background:none;height:0;border-top:2px dashed var(--legend)}.phase-legend [hidden],.phase-compare [hidden]{display:none}.phase-note{font-size:14px;color:#b6c9d7;line-height:1.7;margin-top:12px}.phase-compare{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.phase-milestones{padding:22px 28px;border-top:1px solid var(--site-line)}.phase-milestones ol{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}.phase-milestones li{border-left:1px solid #dbb6817d;padding-left:14px;color:#bccbd7;font-size:14px;line-height:1.6}.phase-milestones strong{display:block;color:#f1d0a8;font:22px var(--world-serif);margin-top:3px}.phase-page .energy-detail{font-size:14px;margin-top:18px}.energy-detail td:last-child{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.energy-detail .table-scroll{max-height:400px}
.phase-page .lab-sidebar{align-content:start}.phase-page .control-field small,.phase-page .control-note{font-size:14px}.phase-page .range-ends{font-size:13px}.next-sample{margin-top:28px;padding-top:22px;border-top:1px solid #eec28970}.next-sample h3{font:29px var(--world-serif);color:#efcd9f;margin-top:10px}.next-sample>p:not(.kicker){font-size:14px;line-height:1.7;color:#bed0dc;margin-top:12px}.next-sample .lab-button{width:100%}.phase-guide-note{font-size:15px;line-height:1.75;color:#bbcbd6;margin-top:23px}
@media(min-width:1500px){.phase-page .lab-workspace{grid-template-columns:minmax(0,1fr) 390px}.phase-stage canvas{height:545px}}
@media(max-width:1100px){.phase-page .lab-workspace{grid-template-columns:minmax(0,1fr) 320px}.phase-transport{padding-inline:24px}.phase-clock{font-size:23px}}
@media(max-width:880px){.phase-page .lab-workspace{display:flex;flex-direction:column}.phase-page .lab-sidebar{display:block}.phase-page .lab-sidebar .control-field{margin-block:23px}}
@media(max-width:620px){.phase-stage canvas{height:365px}.phase-transport{padding-inline:18px;gap:7px}.phase-transport>button{flex:1;padding-inline:11px}.phase-transport label{margin:5px 0 0}.phase-clock{margin-top:5px}.phase-view{padding:13px 17px}.phase-view button{flex:1;font-size:14px;padding-inline:10px}.phase-view>span{width:100%;margin-left:0;margin-top:6px}.phase-stage>p{padding-inline:18px}.phase-state,.phase-actions,.phase-milestones{padding-inline:18px}.phase-state h2{font-size:27px}.phase-state-heading{align-items:flex-start}.phase-state-heading>span{font-size:11px;padding:6px 7px;margin-top:3px}.mass-legend{gap:9px;font-size:13px}.mass-legend strong{font-size:19px}.mass-legend>span:before{margin-right:6px;width:8px;height:8px}.phase-page .lab-data{padding-inline:18px;gap:12px}.phase-page .lab-data dd{font-size:26px}.phase-page .lab-data dd small{font-size:13px}.phase-actions>span{width:100%}.phase-actions button{flex:1;padding-inline:9px}.phase-chart{height:205px}.phase-legend{font-size:13px;gap:8px 14px}.phase-page .chart-heading{display:block}.phase-page .chart-heading p{font-size:16px}.phase-page .chart-heading>span{margin-top:5px}.phase-page .lab-heading h1{font-size:38px}.phase-page .control-field output{font-size:13px}.phase-milestones ol{gap:15px}.phase-milestones strong{font-size:21px}.phase-page .model-table td,.phase-page .model-table th{font-size:14px;padding:9px}}