:root{--bg:#10141c;--surface:#1a2030;--surface-raised:#232b40;--text:#e8ecf4;--text-dim:#9aa4bd;--accent:#4f8cff;--accent-dim:#2c3f66;--correct:#34c77b;--wrong:#e0546b;--border:#2c3450;--stage:#0a0e16;--grid:#161d2b;--grid-major:#1f2839;--beam:#c9d2e6;--support:#9aa4bd;--load:#ffb347;--reaction:#34c77b;--diag-n:#b18cff;--diag-v:#4f8cff;--diag-m:#ff6fb5;--diag-w:#2dd4bf;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{overscroll-behavior:none;background:var(--bg);height:100%;color:var(--text);margin:0;overflow:hidden}#app{flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}a{color:inherit}button{font:inherit;cursor:pointer;color:var(--text);background:var(--surface-raised);border:1px solid var(--border);border-radius:8px;padding:.6em 1.2em;transition:background .15s,border-color .15s}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.4;cursor:not-allowed}.menu-screen{flex-direction:column;gap:1.75rem;width:100%;max-width:720px;height:100%;margin:0 auto;padding:3rem 1.5rem;display:flex;overflow-y:auto}.menu-screen h1{text-align:center;margin:0}.menu-step h2{color:var(--text-dim);text-align:center;margin:0 0 .75rem;font-size:1.05rem}.menu-options{flex-wrap:wrap;gap:.6rem;display:flex}.menu-screen .menu-options{flex-flow:column;align-items:stretch;width:min(22rem,100%);margin:0 auto}.menu-option--selected{background:var(--accent-dim);border-color:var(--accent)}.multiple-choice-options{justify-content:center;max-width:40rem;margin:0 auto}.menu-option--correct{background:var(--correct);border-color:var(--correct);color:#fff}.menu-option--wrong{background:var(--wrong);border-color:var(--wrong);color:#fff}.menu-option--locked:not(.menu-option--correct):not(.menu-option--wrong){opacity:.5}.menu-option--locked:hover{border-color:var(--border)}.menu-option--locked.menu-option--correct:hover{border-color:var(--correct)}.menu-option--locked.menu-option--wrong:hover{border-color:var(--wrong)}.wizard-back{align-self:flex-start;padding:.4em .9em;font-size:.9rem}.wizard-subtitle{text-align:center;color:var(--text-dim);margin:-1rem 0 0}.wizard-option{flex-direction:column;align-items:center;gap:.2rem;min-width:8rem;display:flex}.wizard-option-desc{color:var(--text-dim);font-size:.75rem}.help-section h2{color:var(--text);margin:0 0 .4rem;font-size:1.05rem}.help-section ul{color:var(--text-dim);margin:0;padding-left:1.2rem;line-height:1.5}.help-section li+li{margin-top:.3rem}.help-screen{gap:1.4rem}.loading-text{text-align:center;color:var(--text-dim)}.game-screen{flex-direction:column;flex:1;gap:.5rem;width:100%;min-height:0;padding:.5rem 0 0;display:flex}.game-header{align-items:center;gap:1rem;min-height:2.4rem;padding:0 1rem;font-weight:600;display:flex}.game-timer{color:var(--text-dim);font-variant-numeric:tabular-nums}.game-header .action-button{min-width:0;margin-left:auto;padding:.4em 1.4em;font-size:.9rem}.game-header .exit-button{font-size:.9rem;font-weight:400}.game-header .game-menu{margin-left:auto;position:relative}.game-menu-toggle{padding:.4em .9em;font-size:1rem;line-height:1}.game-menu-dropdown{background:var(--surface);border:1px solid var(--border);z-index:20;border-radius:10px;flex-direction:column;gap:.4rem;min-width:8.5rem;padding:.5rem;display:flex;position:absolute;top:calc(100% + .4rem);right:0;box-shadow:0 8px 24px #00000073}.game-menu-dropdown button{white-space:nowrap;text-align:left}.answer-area{justify-content:center;align-items:center;padding:0 1rem;display:flex}.feedback-area{justify-content:center;padding:0 1rem .75rem;display:flex}.feedback-area:empty{display:none}.answer-feedback{text-align:center;color:var(--text-dim)}.action-button{background:var(--accent);border-color:var(--accent);color:#fff;align-self:center;min-width:10rem;padding:.6em 2em;font-weight:600}.game-summary{text-align:center;flex-direction:column;gap:1rem;width:100%;max-width:640px;max-height:100%;margin:0 auto;padding:2rem 1rem;display:flex;overflow-y:auto}.game-summary h2{margin:0}.summary-score{margin:0;font-size:1.3rem;font-weight:600}.summary-time{color:var(--text-dim);margin:-.5rem 0 0}.summary-list{text-align:left;border:1px solid var(--border);border-radius:8px;max-height:320px;margin:0;padding:0;list-style:none;overflow-y:auto}.summary-list li{border-bottom:1px solid var(--border);padding:.5rem 1rem}.summary-list li:last-child{border-bottom:none}.summary-correct{color:var(--correct)}.summary-wrong{color:var(--wrong)}.game-summary button{align-self:center}.game-summary--guarded button{pointer-events:none}@media (width<=520px){.game-header{gap:.6rem;font-size:.9rem}.menu-screen{padding:2rem 1rem}}.header-spacer{flex:1}.game-header .action-button+.game-menu,.build-screen .game-header .game-menu{margin-left:0}.tool-button{padding:.35em .8em;font-size:.9rem;line-height:1.2}.build-title{font-weight:700}.stage-chip{background:var(--accent-dim);border:1px solid var(--accent);border-radius:999px;padding:.15em .7em;font-size:.85rem;font-weight:600}.board-wrap{background:var(--stage);width:100%}.board{-webkit-user-select:none;user-select:none;display:block}.board text{fill:var(--text);font-size:12px}.grid line{stroke:var(--grid);stroke-width:1px}.grid line.major{stroke:var(--grid-major)}.board-hint{fill:var(--text-dim)!important;font-size:15px!important}.beam{fill:var(--beam)}.support-tri{fill:var(--surface-raised);stroke:var(--support);stroke-width:1.5px;stroke-linejoin:round}.roller{fill:var(--surface-raised);stroke:var(--support);stroke-width:1.5px}.ground,.wall{stroke:var(--support);stroke-width:2px}.hatch{stroke:var(--support);stroke-width:1px}.support-name{font-weight:700;fill:var(--text-dim)!important}.hinge{fill:var(--stage);stroke:var(--beam);stroke-width:2.5px}.hit{fill:#0000;stroke:none}line.hit{stroke:#0000;stroke-width:18px}.load-arrow line,.dist-arrow line,.moment-arrow path:first-child{stroke:var(--load);stroke-width:2.4px;fill:none}.dist-arrow line{stroke-width:1.4px}.load-arrow path,.dist-arrow path,.moment-arrow path:last-child{fill:var(--load)}.dist-area{fill:color-mix(in srgb, var(--load) 16%, transparent);stroke:var(--load);stroke-width:1.2px}.load-label{font-weight:600;fill:var(--load)!important}.load-angle line,.load-angle polyline{stroke:var(--load);stroke-width:1px;fill:none}.load-angle-label{fill:var(--load)!important;font-size:11px!important}.resultant line{stroke:var(--load);stroke-width:1.6px}.resultant path{fill:var(--load)}.resultant-label{font-style:italic;fill:var(--load)!important}.reaction-arrow line,.reaction-arrow path:first-child{stroke:var(--reaction);stroke-width:2.2px;fill:none}.reaction-arrow path:last-child,.reaction-arrow>path:only-child{fill:var(--reaction)}.reaction-label{font-weight:600;fill:var(--reaction)!important}.ruler line{stroke:var(--text-dim);stroke-width:1px}.ruler text{fill:var(--text-dim)!important;font-size:11px!important}.is-selected .beam,.beam.is-selected{fill:#e6ecff;filter:drop-shadow(0 0 4px var(--accent))}.is-selected .support-tri,.is-selected .roller,.is-selected .hinge,.is-selected .wall,.is-selected .ground,.is-selected .hatch{stroke:var(--accent)}.is-selected .dist-area{stroke:#fff;stroke-width:2px}.point-load.is-selected .load-arrow line,.moment-load.is-selected .moment-arrow path:first-child{stroke:#ffe1b0;filter:drop-shadow(0 0 3px var(--load))}.handle{fill:var(--surface-raised);stroke:var(--accent);stroke-width:2px;cursor:ew-resize}.dist-handle{cursor:move}.build-screen [data-kind]{cursor:grab;touch-action:none}.crosshair{stroke:var(--text-dim);stroke-width:1px;stroke-dasharray:3 3;pointer-events:none}.band-bg{fill:var(--surface);opacity:.55}.axis{stroke:var(--text-dim);stroke-width:1.2px}.band-title{font-style:italic;font-weight:700;font-size:18px!important}.band-unit,.band-sign{fill:var(--text-dim)!important;font-size:11px!important}.band-sign{font-weight:700;font-size:14px!important}.diagram-line{fill:none;stroke-width:2px;stroke-linejoin:round}.diagram-fill{stroke:none}.diag-n .diagram-line{stroke:var(--diag-n)}.diag-v .diagram-line{stroke:var(--diag-v)}.diag-m .diagram-line{stroke:var(--diag-m)}.diag-w .diagram-line{stroke:var(--diag-w);stroke-width:2.5px}.diag-n .diagram-fill{fill:color-mix(in srgb, var(--diag-n) 22%, transparent)}.diag-v .diagram-fill{fill:color-mix(in srgb, var(--diag-v) 22%, transparent)}.diag-m .diagram-fill{fill:color-mix(in srgb, var(--diag-m) 22%, transparent)}.diag-n .band-title{fill:var(--diag-n)!important}.diag-v .band-title{fill:var(--diag-v)!important}.diag-m .band-title{fill:var(--diag-m)!important}.diag-w .band-title{fill:var(--diag-w)!important}.value-label{font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--stage);stroke-width:3px;font-size:11.5px!important}.value-label.is-peak{font-weight:700}.peak-dot{fill:var(--text)}.is-faint{opacity:.7}.build-body{flex:1;min-height:0;display:flex}.palette{flex-direction:column;flex-shrink:0;gap:.35rem;width:6.5rem;padding:0 .5rem .5rem;display:flex;overflow-y:auto}.palette-tile{touch-action:none;cursor:grab;flex-direction:column;align-items:center;gap:.1rem;padding:.35rem .25rem;font-size:.75rem;display:flex}.tile-icon{width:48px;height:32px}.icon-beam{fill:var(--beam)}.icon-line{fill:none;stroke:var(--support);stroke-width:2px;stroke-linejoin:round}.icon-hinge{fill:var(--surface-raised);stroke:var(--beam);stroke-width:2px}.icon-dist{fill:color-mix(in srgb, var(--load) 25%, transparent);stroke:var(--load);stroke-width:1.2px}.icon-load line,.icon-moment path:first-child{stroke:var(--load);stroke-width:2.2px;fill:none}.icon-load path,.icon-moment path:last-child{fill:var(--load)}.drag-ghost{z-index:60;pointer-events:none;background:var(--surface-raised);border:1px solid var(--accent);border-radius:8px;padding:.2rem;position:fixed;transform:translate(-50%,-50%);box-shadow:0 6px 18px #00000080}.drag-ghost.is-placed{opacity:.35}.drag-ghost.is-invalid{border-color:var(--wrong)}.workspace{scrollbar-gutter:stable;flex-direction:column;flex:1;min-width:0;display:flex;position:relative;overflow-y:auto}.view-toggles{flex-wrap:wrap;gap:.35rem;padding:0 .75rem .5rem;display:flex}.view-toggle{color:var(--text-dim);border-radius:999px;padding:.2em .85em;font-size:.85rem}.view-toggle.is-active{background:var(--accent-dim);border-color:var(--accent);color:var(--text)}.status-line{color:var(--text-dim);font-variant-numeric:tabular-nums;white-space:pre-wrap;min-height:2.2rem;padding:.5rem .75rem;font-size:.9rem}.status-line.is-error{color:var(--wrong)}.inspector{z-index:30;background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:.5rem;width:min(17rem,100vw - 2rem);padding:.75rem;display:flex;position:fixed;bottom:1rem;right:1rem;box-shadow:0 10px 30px #00000080}.inspector-head{justify-content:space-between;align-items:center;display:flex}.inspector-title{font-weight:700}.inspector-close{padding:.1em .6em;font-size:1.1rem;line-height:1}.inspector-field{color:var(--text-dim);grid-template-columns:5.5rem 1fr 2.6rem;align-items:center;gap:.4rem;font-size:.9rem;display:grid}.inspector-input,.reaction-input{font:inherit;border:1px solid var(--border);background:var(--bg);width:100%;min-width:0;color:var(--text);font-variant-numeric:tabular-nums;border-radius:6px;padding:.35em .5em}.inspector-input.is-invalid{border-color:var(--wrong)}.unit{color:var(--text-dim);font-size:.85rem}.inspector-choices{flex-wrap:wrap;gap:.3rem;display:flex}.choice{padding:.25em .6em;font-size:.85rem}.choice.is-active{background:var(--accent-dim);border-color:var(--accent)}.inspector-note{color:var(--text-dim);margin:0;font-size:.8rem}.inspector-delete{color:var(--wrong)}.popup-backdrop{z-index:50;background:#05080e99;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.popup{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:1rem;width:min(100%,26rem);max-height:100%;padding:1.25rem;display:flex;box-shadow:0 12px 40px #00000080}.popup-title{text-align:center;font-size:1.1rem;font-weight:600}.popup-hint{color:var(--text-dim);text-align:center;margin:0;font-size:.8rem}.popup .action-button{min-width:8rem}.example-list{flex-direction:column;gap:.4rem;min-height:0;display:flex;overflow-y:auto}.round-scroll{scrollbar-gutter:stable;flex-direction:column;flex:1;gap:.6rem;min-height:0;padding-bottom:1rem;display:flex;overflow-y:auto}.round-prompt{text-align:center;padding:0 1rem}.prompt-title{font-size:1.35rem;font-weight:700}.prompt-sub{color:var(--text-dim);max-width:46rem;margin:.25rem auto 0;font-size:.9rem}.reaction-form{flex-wrap:wrap;justify-content:center;gap:.5rem 1.25rem;display:flex}.reaction-row{grid-template-columns:2.6rem 6.5rem 2.4rem 4.5rem;align-items:center;gap:.35rem;display:grid}.reaction-name{color:var(--reaction);text-align:right;font-weight:700}.reaction-result{font-variant-numeric:tabular-nums;font-weight:600}.reaction-input.input--correct{border-color:var(--correct)}.reaction-input.input--wrong{border-color:var(--wrong)}.value-box{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;display:flex}.value-main{flex-direction:column;align-items:center;gap:.2rem;min-width:14rem;display:flex}.value-where{color:var(--text-dim);font-size:.85rem}.value-entry{align-items:center;gap:.35rem;display:flex}.value-entry .reaction-input{width:7rem}.feedback-area{flex-direction:column;align-items:center;gap:.6rem}.answer-note{color:var(--text-dim)}.steps{background:var(--surface);border:1px solid var(--border);white-space:pre-wrap;border-radius:8px;max-width:min(46rem,100%);margin:0;padding:.75rem 1rem;font-size:.85rem;line-height:1.6;overflow-x:auto}.editor.is-editable{cursor:ns-resize;touch-action:none}.value-grid line{stroke:var(--grid-major);stroke-width:1px}.value-grid text{fill:var(--text-dim)!important;font-size:10px!important}.key-guide{stroke:var(--border);stroke-dasharray:2 4}.dot{fill:var(--text);stroke:var(--stage);stroke-width:2px;cursor:ns-resize}.dot.is-mid{fill:var(--surface-raised);stroke:var(--text)}.dot.is-correct{fill:var(--correct)}.dot.is-wrong{fill:var(--wrong)}.dot-ring{fill:none;stroke:var(--accent);stroke-width:2px}.dot-value{paint-order:stroke;stroke:var(--stage);stroke-width:3px;font-weight:700}.is-solution .diagram-line{stroke-dasharray:6 4;stroke-width:1.6px;stroke:var(--text)!important}.is-solution .diagram-fill{fill:#ffffff0f!important}.summary-round{color:var(--text)}@media (width<=640px){.build-body{flex-direction:column}.palette{flex-direction:row;flex-shrink:0;width:auto;padding:0 .5rem .5rem;overflow:auto hidden}.palette-tile{flex-shrink:0;width:4.6rem}.build-screen .game-header{flex-wrap:wrap;gap:.4rem}.reaction-row{grid-template-columns:2.4rem 5.5rem 2.2rem 4rem}}.topics-screen{max-width:860px}.topic-group h2{color:var(--text-dim);margin:0 0 .6rem;font-size:1.05rem}.topic-grid{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.6rem;display:grid}.topic-option{text-align:left;flex-direction:column;align-items:flex-start;gap:.2rem;display:flex}.topic-exam{border-color:var(--accent);background:var(--accent-dim);text-align:center;align-items:center}.exercise-screen{flex-direction:column;flex:1;width:100%;min-height:0;display:flex}.exercise-header{border-bottom:1px solid var(--border);flex-wrap:wrap;gap:.6rem 1rem;padding:.5rem 1rem}.exercise-header .tool-button{font-weight:400}.game-timer.is-late{color:var(--wrong)}.exercise-body{flex:1;width:100%;max-width:860px;min-height:0;margin:0 auto;padding:1rem 1rem 3rem;overflow-y:auto}.exercise-title{margin:0 0 .5rem;font-size:1.25rem}.exercise-text p{margin:0 0 .6rem;line-height:1.55}.exercise-figure{background:var(--stage);border:1px solid var(--border);border-radius:10px;justify-content:center;margin:.75rem 0 1rem;display:flex;overflow:hidden}.exercise-answers h3{color:var(--text-dim);margin:.5rem 0;font-size:1rem}.answer-list{flex-direction:column;gap:.45rem;display:flex}.answer-row{grid-template-columns:minmax(3.2rem,auto) 7rem 3.2rem auto auto;justify-content:start}.answer-hint{color:var(--text-dim);font-size:.85rem}.exercise-actions{flex-wrap:wrap;gap:.6rem;margin:1rem 0 .5rem;display:flex}.exercise-actions .action-button{align-self:auto;min-width:8rem}.exercise-feedback .answer-feedback{text-align:left;margin:.5rem 0}.solution-steps{background:var(--surface);border:1px solid var(--border);border-radius:10px;margin:.75rem 0 0;padding:.75rem 1rem .75rem 2.4rem;line-height:1.6}.solution-steps li+li{margin-top:.25rem}.exercise-figure svg{max-width:100%;height:auto;display:block}.fig-member{stroke:var(--beam);stroke-width:5px;stroke-linecap:round}.fig-rope{stroke:var(--beam);stroke-width:1.6px;fill:none}.fig-thin{stroke:var(--text-dim);stroke-width:1px;fill:none}.fig-dashed{stroke:var(--text-dim);stroke-width:1px;stroke-dasharray:6 4;fill:none}.fig-body{fill:var(--surface-raised);stroke:var(--beam);stroke-width:1.6px}.fig-hole{fill:var(--stage);stroke:var(--beam);stroke-width:1.6px}.fig-ground line,.fig-wall{stroke:var(--support);stroke-width:1.6px}.fig-hatch{stroke:var(--support);stroke-width:1px}.fig-support polygon,.fig-support circle{fill:var(--stage);stroke:var(--support);stroke-width:1.6px}.fig-hinge{fill:var(--stage);stroke:var(--beam);stroke-width:1.8px}.fig-dot{fill:var(--beam)}.fig-name,.fig-label{fill:var(--text);font-size:13px}.fig-force line,.fig-force path,.fig-load line,.fig-load polyline{stroke:var(--load);stroke-width:1.8px;fill:none}.fig-force path:not([fill=none]),.fig-load path{fill:var(--load)}.fig-force-label{fill:var(--load);font-size:13px;font-weight:600}.fig-unknown line,.fig-unknown path{stroke:var(--accent)}.fig-unknown path:not([fill=none]),.fig-unknown .fig-force-label{fill:var(--accent)}.fig-axis line,.fig-axis path{stroke:var(--text-dim);stroke-width:1.2px}.fig-axis path{fill:var(--text-dim)}.fig-axis text{fill:var(--text-dim);font-size:12px;font-style:italic}.fig-dim line{stroke:var(--text-dim);stroke-width:1px}.fig-dim path{fill:var(--text-dim)}.fig-dim-label,.fig-angle-label{fill:var(--text-dim);font-size:12px}.fig-angle polyline{stroke:var(--text-dim);stroke-width:1px}.fig-diagram{stroke-width:1.6px;fill-opacity:.22}.fig-diagram.diag-n{stroke:var(--diag-n);fill:var(--diag-n)}.fig-diagram.diag-t{stroke:var(--diag-v);fill:var(--diag-v)}.fig-diagram.diag-m{stroke:var(--diag-m);fill:var(--diag-m)}.fig-value{fill:var(--text);font-variant-numeric:tabular-nums;font-size:11px}@media (width<=600px){.answer-row{grid-template-columns:minmax(3.2rem,auto) 7rem 3.2rem auto}.answer-hint{grid-column:1/-1;padding-left:.2rem}}
