@font-face{font-family:LocalMath;src:local("STIX Two Math"),local("Cambria Math"),local("Times New Roman")}
:root{font-family:-apple-system,BlinkMacSystemFont,"BIZ UDPGothic","BIZ UDPゴシック","Noto Sans JP",sans-serif;color:#243c2d;background:#fafbf8;font-size:16px;line-height:1.6;--muted:#526556;--line:#b7c1b8;--ink:#243c2d;--soft:#edf1ee;--paper:#fafbf8;--green:#356145;--focus:#005aff;--truth:#005aff;--false:#804000;--control-border:#718568}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-height:100vh}
button,textarea,select{font:inherit;color:inherit}
button,select,summary{cursor:pointer}
a{color:var(--green);text-underline-offset:4px;text-decoration-thickness:1px}
a:hover{color:#284d36;text-decoration-thickness:2px}
button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
button:disabled{color:#596653;cursor:default;background:#e6eadd;border-color:#b4c0a9;box-shadow:none}
h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,h4{font-family:inherit;color:var(--ink)}
h1{font-size:26px;line-height:1.3;font-weight:600;letter-spacing:-.015em;margin-bottom:16px}
h2{font-size:24px;line-height:1.3;font-weight:700;margin:0}
h3{font-size:20px;line-height:1.4;font-weight:700}
h4{font-size:16px;font-weight:700}
code,pre{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
code{font-size:1em;background:var(--soft);padding:.08em .3em;border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
main{max-width:1240px;margin:0 auto;padding:28px 24px 24px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:start}
.editor-panel{min-width:0}
.section-heading p{max-width:680px;font-family:inherit;font-size:16px;color:var(--muted);margin:12px 0 20px;line-height:1.6}
.title-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px}
.title-row h1{min-width:0;margin:0}
.title-credit{display:block;font-family:inherit;font-size:15px;font-weight:400;letter-spacing:normal;line-height:1.6;color:var(--muted);margin-top:6px}
.language-control{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin:0}
.language-control label{font-size:16px;font-weight:600;color:var(--muted)}
.language-control select{width:auto;font-size:16px;min-height:44px;background-color:#ffffff}
.label-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 12px;margin-bottom:10px}
label{font-size:16px;font-weight:600;letter-spacing:normal;color:var(--green)}
.key-hint{font-size:15px;color:var(--muted)}
.input-shell{border:1px solid var(--control-border);border-radius:2px;background:#ffffff}
.input-shell:focus-within{border-color:var(--focus);box-shadow:none}
textarea{display:block;width:100%;border:0;border-radius:4px 4px 0 0;background:transparent;resize:vertical;min-height:104px;padding:12px 14px;font:18px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink)}
textarea::placeholder{color:#596653}
textarea:focus-visible{outline-offset:-3px}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:4px 6px;border-top:1px solid var(--line);background:#f0f3ed;border-radius:0 0 4px 4px}
.toolbar button{min-width:44px;min-height:44px;border:1px solid transparent;border-radius:3px;background:transparent;font:20px LocalMath,serif;color:var(--green)}
.toolbar button:hover{background:#dde5d4;border-color:#9aab91;color:#284d36}
.separator{height:20px;width:1px;background:var(--line);margin:0 5px}
.validation{font-size:15px;min-height:22px;margin-top:8px;color:var(--muted);overflow-wrap:anywhere}
.validation.invalid{color:#873c2d}
.hint{font-size:15px;color:var(--muted);margin:2px 0 12px}
.actions{display:flex;flex-wrap:wrap;gap:10px}
.primary,.secondary{min-height:44px;padding:9px 26px;border:1px solid var(--green);border-radius:3px;font-size:16px;font-weight:600;line-height:1.5}
.primary{background:var(--green);color:#ffffff}
.primary:hover{background:#284d36;border-color:#284d36}
.primary:disabled{background:#e6eadd;color:#596653;border-color:#b4c0a9;box-shadow:none}
.secondary{background:#dde5d4;color:var(--green);border-color:#9aab91}
.secondary:hover{background:#d0dbc7}
.examples{display:grid;grid-template-columns:70px minmax(0,1fr);align-items:center;gap:6px 12px;margin:20px 0 12px;padding-top:0}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23356145' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px; width:100%;min-height:44px;border:1px solid var(--control-border);border-radius:3px;background-color:#ffffff;padding:9px 42px 9px 14px;font-size:16px;color:var(--ink)}
select:hover{border-color:var(--green);background-color:#f3f6f1}
.examples p{grid-column:2;font-family:inherit;font-size:15px;color:var(--muted);margin:0;line-height:1.7}
.grammar{font-size:16px;border-top:1px solid #b4c0a96b}
.grammar summary{min-height:44px;padding:9px 0;color:var(--green);font-weight:600}
summary:hover{color:#284d36;text-decoration:underline;text-underline-offset:4px}
.grammar-body{padding:8px 0 18px;color:var(--muted);max-width:700px}
.grammar-body p{margin:14px 0}
.syntax-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:16px;color:var(--ink)}
.syntax-table th,.syntax-table td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;overflow-wrap:anywhere}
.syntax-table th{width:26%;background:var(--soft);font-weight:600}
.syntax-table td{background:#ffffff}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.8;background:#ffffff;padding:16px;border:1px solid var(--line);border-radius:3px}
.workspace{min-width:0;padding:20px 24px;background:var(--soft)}
.workspace-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px}
.subtle{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}
.math{font-family:LocalMath,"Times New Roman",serif;overflow-wrap:anywhere;line-height:1.7;color:var(--ink)}
.math sup{font-size:max(14px,.65em);line-height:0;vertical-align:super}
.answer{margin:16px 0 20px}
.answer-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px}
.answer h3{font-family:inherit;font-size:16px;font-weight:600;color:var(--ink);margin:0}
.answer .math{font-size:40px;line-height:1.4;margin:8px 0 12px}
.answer p{font-family:inherit;font-size:16px;color:var(--muted);margin:0}
.calculation-details,.audit{border-top:1px solid var(--line);font-size:16px}
.calculation-details>summary,.audit>summary{min-height:44px;padding:9px 0;color:var(--green);font-weight:600}
.formula-preview{font-size:21px;white-space:pre-wrap;margin:12px 0 20px}
.steps{display:flex;flex-wrap:wrap;gap:4px 16px;border-bottom:1px solid var(--line)}
.steps button{background:transparent;border:0;border-bottom:3px solid transparent;padding:10px 0;font:500 16px/1.5 -apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;color:var(--muted);min-height:44px}
.steps button[aria-current]{color:var(--green);border-bottom-color:var(--green);font-weight:700}
.steps button:hover{color:#284d36;text-decoration:underline;text-underline-offset:4px}
.stage{padding:16px 0 8px}
.stage h3{margin-bottom:10px}
.stage>p{font-family:inherit;font-size:16px;color:var(--muted);max-width:720px}
.stage .caption{font-family:inherit;font-size:15px;line-height:1.8;margin-top:16px;color:var(--muted)}
.formula-box{font-size:21px;padding:8px 0;white-space:pre-wrap;margin:16px 0}
.stats{display:flex;flex-wrap:wrap;gap:12px;font-size:15px;margin:16px 0}
.stats>div{flex:0 1 auto;min-width:140px;padding:8px 20px 8px 0;overflow-wrap:anywhere}
.stats strong{display:block;font:500 16px/1.7 ui-monospace,SFMono-Regular,monospace;margin-top:4px}
.stats span{font-size:15px;color:var(--muted)}
.polys{display:flex;flex-wrap:wrap;gap:10px 16px;margin:12px 0}
.poly{font:20px/1.7 LocalMath,serif;overflow-wrap:anywhere;max-width:100%;padding:4px 0}
.empty-state{color:var(--muted);font-size:15px;padding:16px 0}
.step-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding:12px 0 0;font:15px/1.7 ui-monospace,SFMono-Regular,monospace;color:var(--muted)}
.text-button{border:0;background:transparent;color:var(--green);padding:7px 0;min-height:44px;font-size:15px;text-decoration:underline;text-underline-offset:4px}
.text-button:hover{color:#284d36;text-decoration-thickness:2px}
.text-button:disabled{color:#596653;background:transparent;text-decoration:none}
.audit>p{margin:10px 0;color:var(--muted)}
.audit h4{margin:20px 0 10px}
.audit pre{max-height:360px;overflow:auto}
.variable-map{font:15px/2 ui-monospace,monospace;overflow-wrap:anywhere;color:var(--muted)}
.projection-group{margin:18px 0}
.projection-group h4{font-size:15px;font-weight:600;margin-bottom:10px;color:var(--green)}
.cell-list{display:block;margin:16px 0}
.cell{padding:14px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(100px,1fr) minmax(100px,2fr);gap:5px 20px}
.cell strong{font:600 15px/1.7 ui-monospace,monospace}
.cell .truth{font:700 15px/1.7 ui-monospace,monospace;color:var(--truth)}
.cell[data-truth="FALSE"] .truth{color:var(--false)}
.cell p{grid-column:2;font:15px/1.7 ui-monospace,monospace;color:var(--muted);margin:0;overflow-wrap:anywhere}
.progress{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:16px 0;font-size:15px;color:var(--muted)}
#elapsed{margin-left:auto;font:15px ui-monospace,monospace;white-space:nowrap}
.spinner{width:16px;height:16px;flex-shrink:0;border:2px solid #b4c0a9;border-top-color:var(--green);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.error-panel,.notice{padding:12px 16px;border:1px solid #936348;border-radius:3px;color:#873c2d;background:#faf1e9;font-size:15px;margin:18px 0;overflow-wrap:anywhere}
.notice{color:#685021;border-color:#88733b;background:#f7f3e2}
footer{max-width:1240px;margin:auto;padding:12px 24px 20px;display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--muted);font-size:15px}
footer a{margin-left:auto}
@media(max-width:1050px){main{display:block;max-width:880px}.section-heading p{max-width:100%}.title-row{align-items:center}.language-control{flex-direction:row;align-items:center;gap:8px}.title-credit{display:inline-block;margin-top:0}.workspace{margin-top:20px;padding:20px}.editor-panel{padding-bottom:0}footer{max-width:880px}}
@media(max-width:600px){.syntax-table th{width:35%}.syntax-table th,.syntax-table td{padding:8px}main{padding:20px 16px 16px}h1{font-size:24px}.title-row{grid-template-columns:1fr;gap:12px}.title-credit{display:block;margin-top:4px}.section-heading p{margin:12px 0 16px}.language-control{justify-content:flex-end}.label-row{gap:4px;margin-bottom:8px}.workspace{padding:16px;margin-top:16px}.workspace-top{gap:4px 12px}.examples{grid-template-columns:1fr;gap:6px;margin-top:16px}.examples p{grid-column:1}.cell{grid-template-columns:1fr}.cell p{grid-column:1}.answer .math{font-size:34px}.toolbar{gap:2px;padding:4px}.toolbar button{min-width:44px}textarea{font-size:18px;padding:10px 12px}.stats>div{min-width:100px}.steps{gap:4px 12px}footer{padding:8px 16px 20px;gap:6px 16px}footer a{margin-left:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(forced-colors:active){select{appearance:auto;background-image:none}.input-shell,.primary,.secondary{border-color:ButtonText}button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:Highlight}.steps button[aria-current]{border-bottom-color:Highlight}.spinner{border-color:GrayText;border-top-color:Highlight}}
