.tool{scroll-margin-top:calc(var(--header-h) + 12px)}
.p2d .sheet{background:var(--sheet)}
.p2d .tool-body{background:none;height:clamp(580px,calc(100vh - var(--header-h) - 40px),800px);height:clamp(580px,calc(100dvh - var(--header-h) - 40px),800px)}
.p2d .app-bar{gap:12px;min-width:0}
.p2d .tool-status{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;letter-spacing:.04em}
.tool-actions{display:flex;align-items:center;gap:4px;margin-left:auto;flex:none}
.p2d .btn:disabled{opacity:.45;cursor:default}
.tr-stage{display:grid;grid-template-columns:372px minmax(0,1fr);min-height:0}
.tr-panel{display:flex;flex-direction:column;gap:14px;min-height:0;padding:16px;overflow:auto;border-right:1px solid var(--hair)}
.tr-panel h3{position:relative;display:flex;align-items:center;gap:8px;font:500 11.5px/1.2 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-label);margin:0}
.tr-form{display:flex;flex-direction:column;gap:10px}
.tr-panel input[type=text],.tr-panel select,.tr-options select{width:100%;min-width:0;height:30px;padding:0 6px;border:1px solid var(--hair-strong);border-radius:4px;background:var(--sheet);color:var(--ink);font:400 13px/1 var(--font-mono)}
.tr-panel select,.tr-options select{font-family:var(--font-sans)}
.tr-panel input[type=text]::placeholder{color:var(--ink-muted);opacity:.55}
.tr-panel input[type=text]:focus,.tr-panel select:focus,.tr-options select:focus{outline:none;border-color:var(--accent)}
.tr-panel input.is-wrong{border-color:var(--accent-ink);background:var(--accent-wash)}
.tr-panel input:disabled,.tr-panel select:disabled{opacity:.35}
.tr-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px}
.p2d .tr-table th,.p2d .tr-table td{border:0;background:none}
.p2d .tr-table th{font:500 10.5px/1.2 var(--font-mono);letter-spacing:.02em;color:var(--ink-label);text-align:left;padding:0 3px 6px;white-space:nowrap;border-bottom:1px solid var(--hair)}
.p2d .tr-table td{padding:2px 3px}
.tr-joints th:nth-child(1),.tr-members th:nth-child(1){width:28px}
.tr-joints th:nth-child(3),.tr-members th:nth-child(3),.tr-supports th:nth-child(4),.tr-loads th:nth-child(3){width:22px}
.tr-supports th:nth-child(1){width:22%}
.tr-supports th:nth-child(2){width:40%}
.tr-loads th:nth-child(1){width:34%}
.tr-n{font:400 12px/1 var(--font-mono);color:var(--ink-muted);text-align:right;padding-right:6px}
.tr-remove{width:22px;height:30px;padding:0;border:0;background:none;color:var(--ink-muted);font-size:16px;cursor:pointer}
.tr-remove:hover{color:var(--accent-ink)}
.tr-bar{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tr-check{display:flex;align-items:center;gap:8px;font-size:13.5px}
.tr-group{display:flex;flex-direction:column}
.tr-group summary{display:flex;align-items:baseline;gap:8px;cursor:pointer;list-style:none;font:500 11.5px/1.2 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-label)}
.tr-group summary::-webkit-details-marker{display:none}
.tr-group summary{position:relative;white-space:nowrap}
.info{display:inline-grid;place-items:center;flex:none;width:14px;height:14px;border:1px solid var(--hair-strong);border-radius:50%;font:italic 600 9.5px/1 var(--font-display);letter-spacing:0;text-transform:none;color:var(--ink-muted);cursor:help}
.info:hover,.info:focus{border-color:var(--accent);color:var(--accent-ink);outline:none}
.info .tip{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:10;display:none;padding:8px 10px;border:1px solid var(--hair);border-radius:4px;background:var(--sheet);box-shadow:var(--lift-2,0 6px 20px rgb(0 0 0 / .15));font:400 12.5px/1.45 var(--font-sans);font-style:normal;letter-spacing:0;text-transform:none;color:var(--ink);text-align:left;cursor:auto}
.info:hover .tip,.info:focus .tip{display:block}
.tr-group summary::before{content:"+";width:10px;color:var(--ink-muted)}
.tr-group[open] summary::before{content:"\2212"}
#tr-summary{flex:1 1 0;width:0;margin-left:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;letter-spacing:.04em;color:var(--ink-muted)}
.tr-group[open] #tr-summary{visibility:hidden}
.tr-fields{display:grid;grid-template-columns:8.8em minmax(0,1fr);align-items:center;gap:8px 10px;margin-top:14px;font-size:13.5px}
.tr-field{display:contents}
.tr-fields .unit{display:grid;grid-template-columns:minmax(0,1fr) 3.2em;align-items:center;gap:6px;font:400 12.5px/1 var(--font-mono);color:var(--ink-muted)}
.tr-group .tr-check{margin-top:12px}
.tr-panel hr{width:100%;margin:2px 0;border:0;border-top:1px solid var(--hair)}
.tr-notes{margin:0;font-size:13px;color:var(--accent-ink)}
.tr-notes[hidden]{display:none}
.tr-view{display:grid;grid-template-rows:minmax(0,1.35fr) minmax(0,1fr);min-height:0}
.tr-drawing{position:relative;min-height:0;border-bottom:1px solid var(--hair)}
.tr-results{min-height:0;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:12px;font-size:13px}
.tr-status{margin:0;font-size:13.5px;color:var(--ink)}
.tr-status.is-problem{color:var(--accent-ink)}
.tr-columns{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px;align-items:start}
.tr-out{width:100%;border-collapse:collapse;font:400 12.5px/1.35 var(--font-mono)}
.p2d .tr-out th,.p2d .tr-out td{border:0;background:none;padding:2px 6px;text-align:right}
.p2d .tr-out th{font-size:10.5px;color:var(--ink-label);border-bottom:1px solid var(--hair);white-space:nowrap}
.p2d .tr-out th:first-child,.p2d .tr-out td:first-child{text-align:left}
.tr-tension{color:#1c7ed6}
.tr-compression{color:#e03131}
.tr-zero{color:var(--ink-muted)}
.tr-options{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:13px}
.tr-options select{width:auto;min-width:5em}
.tr-steps summary{cursor:pointer;font:500 11.5px/1.2 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-label)}
.tr-steps h4{margin:12px 0 4px;font:600 12.5px/1.3 var(--font-sans);color:var(--ink)}
.tr-steps p{margin:2px 0;font:400 12.5px/1.45 var(--font-mono);color:var(--ink);overflow-wrap:anywhere}
.tr-steps p.tr-found{color:var(--ink-label)}
.tr-steps p.tr-cut{font-family:var(--font-sans);color:var(--ink-muted)}
.tr-steps-note{font-family:var(--font-sans) !important;color:var(--ink-muted) !important}
.tool-frame{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;visibility:hidden}
.tool-frame.is-visible{visibility:visible}
.tr-empty{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:14px;padding:24px;text-align:center;color:var(--ink-muted);font-size:14.5px}
.tr-empty[hidden]{display:none}
.tr-empty:not(.is-waiting) .loading-mark{display:none}
.sheet-area{position:relative}
.sheet-area:fullscreen{background:var(--sheet)}
.sheet-area:fullscreen .tool-body{height:100vh}
@container (max-width:860px){
  .p2d .tool-body{height:auto}
  .tr-stage{grid-template-columns:1fr}
  .tr-panel{border-right:0;border-bottom:1px solid var(--hair);overflow:visible}
  .tr-view{grid-template-rows:380px auto;order:-1}
  .tr-results{overflow:visible}
  .tr-columns{grid-template-columns:1fr}
  .p2d .app-bar{flex-wrap:wrap;height:auto;row-gap:4px}
  .p2d .tool-actions{flex:1 1 100%;min-width:0;flex-wrap:wrap;margin-left:0}
}
.p2d .example-figure img{display:block;width:100%;height:100%;object-fit:contain}
