@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#183441;background:#f1f5f7;font-size:16px;--ink:#183441;--muted:#5f7480;--teal:#087f78;--line:#dce5e9;--orange:#c25b26}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{outline-offset:4px}button{cursor:pointer;background:white;border:1px solid #cbd8de;border-radius:6px;padding:8px 12px;color:var(--ink);font-size:14px;font-weight:600;line-height:1.4}button:hover{background:#eaf4f4;border-color:#7aaaa8}button:disabled{opacity:.5;cursor:not-allowed}header{height:84px;background:#152e3b;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 3.5vw}.brand{display:flex;align-items:center;gap:14px}.mark{font-family:Georgia,serif;font-size:42px;color:#65d9c5;line-height:1}.brand strong{display:block;font-size:20px;font-weight:500}.brand span:not(.mark){display:block;color:#aec4ce;letter-spacing:1.7px;font-size:12px;margin-top:5px}.prototype{font-size:12px;letter-spacing:1.5px;color:#bcd2da;border:1px solid #45606c;padding:7px 10px;border-radius:4px}main{max-width:1660px;margin:auto;padding:30px 3.5vw}.topline{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}h1{font-size:30px;letter-spacing:-.7px;font-weight:500;margin:0 0 6px}p{line-height:1.6}.topline p{margin:0;color:var(--muted);font-size:15px}.actions{display:flex;gap:8px}.notice{background:#fff8e9;border:1px solid #ebd8ac;padding:13px 16px;border-radius:7px;display:flex;align-items:center;gap:12px;font-size:14px;margin-bottom:24px;color:#755219}.notice strong{white-space:nowrap}.notice label{margin:0 0 0 auto;display:flex;align-items:center;gap:8px;white-space:nowrap}.notice.own{background:#e8f5f2;border-color:#aad8ce;color:#245d53}.workspace{display:grid;grid-template-columns:330px minmax(0,1fr);gap:24px;align-items:start}.panel{background:#fff;border:1px solid var(--line);border-radius:9px;padding:22px;box-shadow:0 2px 4px #17384604}.inputs{padding:22px 20px}.section-heading{display:flex;align-items:center;gap:9px;margin-bottom:20px}.section-heading h2{font-size:17px;font-weight:600;margin:0}.section-heading button:last-child{margin-left:auto}.step{border:1px solid #cedce2;color:var(--muted);border-radius:4px;font-family:'IBM Plex Mono',monospace;font-size:12px;padding:3px 5px}label{font-size:14px;font-weight:500;display:block;margin-bottom:16px}input:not([type=checkbox]),select{display:block;width:100%;border:1px solid #cad7de;border-radius:5px;background:white;padding:10px;color:var(--ink);margin-top:7px;min-width:0}input[type=number]{font-family:'IBM Plex Mono',monospace;font-size:14px}input[type=checkbox]{accent-color:var(--teal);width:16px;height:16px;flex:none}select{font-size:14px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hint{color:var(--muted);font-size:13px;line-height:1.55;margin:8px 0 14px}.primary{background:var(--teal);color:white;border-color:var(--teal);padding:12px}.primary:hover{background:#056961;color:white}.full{width:100%;margin-top:17px}.text-button{border:0;padding:4px;color:var(--teal)}summary{cursor:pointer;font-size:15px;font-weight:600;line-height:1.5}summary span{font-weight:400;font-size:13px;color:var(--muted);margin-left:8px}details#references{border-block:1px solid var(--line);padding:14px 0;margin:5px 0 20px}details[open] summary{margin-bottom:15px}#reference-inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.phase-heading{margin:22px 0 10px}.phase-row{padding:11px 0;border-bottom:1px solid var(--line)}.phase-main{display:grid;grid-template-columns:20px minmax(0,1fr) 90px 23px;gap:7px;align-items:center}.phase-main input{margin:0}.phase-main .remove{padding:4px 0;border:0;background:none;color:#7c8b93;font-size:21px}.phase-sub{display:flex;gap:7px;padding-left:27px;margin-top:7px}.phase-sub select{margin:0;padding:4px 6px;width:115px;font-size:12px}.phase-sub input{margin:0;padding:4px;width:85px;font-size:12px}.phase-sub span{font-size:12px;color:var(--muted);align-self:center}.error{color:#a82f2f;font-size:14px;margin:9px 0 0}.error:empty{display:none}.results{display:flex;flex-direction:column;gap:20px;min-width:0}.plot-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.eyebrow{color:var(--muted);letter-spacing:1.6px;font-size:12px}h2{margin:6px 0;font-size:22px;font-weight:500}.badge{background:#e7f5f0;color:#17705d;padding:5px 9px;border-radius:5px;font-size:13px;white-space:nowrap}.badge.warning{background:#fff0dd;color:#8b5416}.plot-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px}.equation{font-family:'IBM Plex Mono',monospace;color:#506a77;font-size:13px}.diagram-panel{padding-bottom:14px}#plot{width:100%;margin-top:10px}#plot svg{width:100%;height:auto;display:block;touch-action:manipulation;min-height:240px}.plot-footer{border-top:1px solid var(--line);padding-top:15px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--muted)}.plot-footer span{display:flex;align-items:center;gap:6px}.plot-footer span:last-child{margin-left:auto}.legend-region{height:10px;width:15px;border:1px solid #009a91;background:#c3ede4}.legend-point{height:9px;width:9px;background:var(--orange);border-radius:50%}.selection-panel .section-heading{margin-bottom:16px}#potentials{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.potential{background:#f3f7f9;border:1px solid #e0e9ed;border-radius:6px;padding:15px}.potential.dependent{background:#edf8f5;border-color:#cae7df}.potential .label{font-size:14px;color:var(--muted)}.potential .value{font-family:'IBM Plex Mono',monospace;font-size:25px;letter-spacing:-1px;margin:8px 0 5px}.potential .unit{font-size:12px;color:var(--muted)}.potential .absolute{font-size:12px;margin-top:10px;color:#4c6771}.point-controls{display:flex;align-items:flex-end;gap:10px;margin-top:16px}.point-controls label{margin:0;max-width:170px}.point-controls button{margin-bottom:1px}.point-controls input{padding:8px}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:14px;text-align:left}th{font-size:12px;font-weight:500;color:var(--muted);padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:11px 12px;border-bottom:1px solid #eaf0f3;white-space:nowrap}td.numeric{font:13px 'IBM Plex Mono',monospace}.vertex-button{padding:4px 9px;min-width:34px}.vertex-button.selected{background:var(--teal);color:white}.boundary-color{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:7px}.method p{font-size:14px;color:#526a77}.method a{color:#087f78}footer{max-width:1660px;margin:auto;padding:4px 3.5vw 24px;display:flex;justify-content:space-between;color:#6d808b;font-size:12px;letter-spacing:1px}footer span{letter-spacing:0}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#183441;color:white;border-radius:6px;padding:12px 20px;font-size:14px;display:none;z-index:4}[hidden]{display:none!important}@media(min-width:1450px){.workspace{grid-template-columns:360px minmax(0,1fr)}}@media(max-width:1100px){.workspace{grid-template-columns:300px minmax(0,1fr);gap:16px}.panel{padding:17px}.notice{flex-wrap:wrap}.notice label{margin-left:0}.potential .value{font-size:21px}.point-controls{flex-wrap:wrap}.plot-footer span:last-child{margin-left:0}.plot-controls{flex-wrap:wrap}}@media(max-width:760px){header{height:75px}.prototype{display:none}main{padding:22px 16px}.topline{align-items:flex-start;flex-direction:column}h1{font-size:27px}.workspace{display:flex;flex-direction:column}.inputs,.results{width:100%}.notice{align-items:flex-start;gap:7px}.notice label{white-space:normal}.brand strong{font-size:18px}.plot-heading{align-items:flex-start;flex-wrap:wrap}.selection-panel .section-heading{flex-wrap:wrap}.potential{padding:10px}#potentials{gap:7px}.potential .value{font-size:19px}.potential .absolute{overflow-wrap:anywhere}footer{display:block;line-height:1.8}footer span{display:block}#plot svg{min-height:0}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s,border-color .15s}}

.axis-toolbar{display:flex;align-items:flex-end;gap:12px;margin-top:18px;flex-wrap:wrap}.axis-toolbar label{margin:0;min-width:105px;flex:1}.view-switch{display:flex;align-self:flex-end;padding-bottom:1px}.view-switch button{padding:10px 15px;border-radius:0}.view-switch button:first-child{border-radius:6px 0 0 6px}.view-switch button:last-child{border-radius:0 6px 6px 0}.view-switch button[aria-pressed=true]{background:#087f78;border-color:#087f78;color:white}#camera-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px;background:#f3f7f9;border:1px solid #e0e9ed;border-radius:6px}#camera-controls label{flex:1;min-width:125px;margin:0;font-size:13px}#camera-controls input[type=range]{padding:0;border:0;accent-color:#087f78;height:20px;cursor:pointer}#camera-controls output{float:right;color:#5f7480;font-size:12px}#camera-controls .inline-check{display:flex;align-items:center;gap:6px;flex-basis:100%;font-size:14px}#plot.three-d{touch-action:none;cursor:grab}#plot.three-d:active{cursor:grabbing}#plot.three-d svg{touch-action:none}@media(max-width:480px){.axis-toolbar{gap:8px}.axis-toolbar label{min-width:64px}.axis-toolbar label select{padding:8px 3px}.view-switch{flex-basis:100%}#camera-controls label{min-width:110px}}

#paper-note{margin-bottom:20px;border-left:4px solid #a742a8}#paper-note a{color:#087f78}

.figure-button{border-color:#ad7caf;color:#763879;background:#faf1fa;padding:10px 12px;align-self:flex-end}.figure-button:hover{background:#f1e0f2;border-color:#86548b}#figure-dialog{width:min(1400px,96vw);max-width:96vw;max-height:94dvh;border:1px solid #cddae1;border-radius:10px;padding:24px;color:#183441;box-shadow:0 20px 80px #08223055;overflow:auto}#figure-dialog::backdrop{background:#0d263bbb}.figure-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.figure-heading h2{font-size:23px}.figure-heading form{margin:0}.figure-variants{display:flex;flex-wrap:wrap;gap:8px}.figure-variants button[aria-pressed=true]{background:#773d7d;color:white;border-color:#773d7d}.figure-image-wrap{border:1px solid #e0e7eb;border-radius:6px;background:white;overflow:auto}.figure-image-wrap img{display:block;width:100%;height:auto;min-width:680px}.figure-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:18px}.figure-actions a{color:#087f78;font-size:14px}.figure-actions button{margin-left:auto}@media(max-width:760px){#figure-dialog{padding:15px;width:96vw}.figure-heading h2{font-size:19px}.figure-actions button{margin-left:0;width:100%}.figure-image-wrap{max-height:65dvh}.figure-button{flex-basis:100%}}

#phase-view-controls{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:14px 0 12px;padding:14px 16px;border-left:4px solid #a53785;background:#fcf2f9;border-radius:5px}#phase-view-controls label{margin:0;min-width:235px;flex:1}#phase-view-controls p{margin:0;flex:2;min-width:210px;font-size:14px}#face-bounds{margin:14px 0;padding:12px 14px;border:1px solid var(--line);border-radius:6px}#face-bound-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}#face-bound-fields fieldset{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;border:1px solid #dce5e9;border-radius:5px;padding:10px;min-width:0}#face-bound-fields legend{font-size:14px;font-weight:600}#face-bound-fields label{margin:0;font-size:13px}#face-bound-fields input{padding:8px 5px}.bounds-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}.bounds-actions .hint{margin:0 0 0 auto}#face-legend{display:flex;flex-wrap:wrap;gap:10px 18px;padding:10px 0;font-size:14px}#face-legend span{display:inline-flex;gap:7px;align-items:center}#face-legend i{width:14px;height:12px;border:1px solid #365773;border-radius:2px}#face-status{font-size:13px}#face-inspector{padding:14px;margin:12px 0;background:#edf3fc;border:1px solid #b9cbe4;border-radius:6px;font-size:14px}.inspected-potentials{display:flex;flex-wrap:wrap;gap:10px 24px;margin:12px 0}.inspected-potentials b{font-family:'IBM Plex Mono',monospace;margin:0 5px;font-weight:500}#face-inspector p{margin-bottom:0}.legend-region.pink{background:#eb8fcd;border-color:#96246f}@media(max-width:1000px){#face-bound-fields{grid-template-columns:1fr}#face-bound-fields fieldset{grid-template-columns:1fr 1fr}#phase-view-controls{gap:10px}}

.plot-appearance{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:12px 14px;background:#f3f7f9;border:1px solid var(--line);border-radius:6px}.plot-appearance label{flex:1;min-width:160px;margin:0}.plot-appearance output{float:right;color:var(--muted)}.plot-appearance input[type=range]{accent-color:var(--teal);padding:0;height:25px}.plot-appearance .inline-check{display:flex;gap:6px;align-items:center;flex-basis:100%}.formula-preview{margin:-6px 0 16px;color:#335c69}.phase-formula-preview{padding:6px 0 0 27px;color:#335c69;font-size:14px}sub{font-size:75%;line-height:0;position:relative;vertical-align:baseline;bottom:-.25em}#new-system-dialog{max-width:min(560px,94vw);border:1px solid #cbd8de;border-radius:10px;padding:24px;color:var(--ink)}#new-system-dialog::backdrop{background:#0d263baa}.actions{flex-wrap:wrap}.plot-appearance input{min-width:0}

#face-legend .chemical-label{display:inline}#phase-view-controls label{min-width:265px}.phase-formula-preview:empty{display:none}

.export-buttons,.plot-label-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.plot-label-controls{margin-top:14px}.plot-label-controls>span{font-weight:600}.plot-label-controls .inline-check{margin:0;font-size:13px}