.tooth-3d-dialog { width:min(1160px,calc(100vw - 28px)); max-width:1160px; }
.clinical-root-intro { padding:12px 14px; margin-block-end:18px; background:#f2f7f8; border-radius:12px; color:#54717c; line-height:1.8; overflow-wrap:anywhere; }
.clinical-root-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:24px; align-items:start; }
.clinical-root-layout>section { min-width:0; }
.clinical-tooth-panel { position:sticky; top:0; max-height:calc(100dvh - 130px); overflow:auto; padding:16px; border:1px solid #d3e4e7; border-radius:16px; background:#fbfdfd; }
.clinical-tooth-viewport { position:relative; height:clamp(240px,38vh,380px); width:100%; border-radius:14px; overflow:hidden; margin-block:16px 12px; touch-action:none; }
.clinical-tooth-viewport canvas { display:block; width:100%; height:100%; touch-action:none; }
.tooth-3d-labels { position:absolute; inset:0; pointer-events:none; }
.tooth-3d-labels span,.tooth-root-tag { position:absolute; transform:translate(-50%,-50%); padding:4px 7px; border-radius:8px; white-space:nowrap; font:inherit; font-size:11px; }
.tooth-direction { background:rgba(255,255,255,.88); color:#4c6776; border:1px solid #c6dce2; }
.tooth-root-tag { background:#fff9ef; border:1px solid #be9f65; color:#705523; cursor:pointer; pointer-events:auto; }
.tooth-root-tag.selected { background:#137c8d; border-color:#137c8d; color:white; }
.clinical-view-controls { display:flex; flex-wrap:wrap; gap:6px; margin-block:8px 16px; }
.clinical-view-controls button { border:1px solid #ccdfe4; padding:7px 10px; border-radius:8px; background:white; color:#2a6574; font:inherit; cursor:pointer; }
.clinical-canals-toggle { display:flex; gap:8px; align-items:center; margin-block:8px 14px; }
.clinical-canals-toggle input { width:auto; }
.clinical-root-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.clinical-root-buttons .btn { flex:1 1 120px; white-space:normal; }
.clinical-root-buttons button[aria-pressed=true] { background:#137c8d; color:white; }
.clinical-selected-root { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block:16px; }
.clinical-selected-root .btn { width:100%; }
.clinical-root-row { padding:14px; border:1px solid #d5e3e8; border-radius:12px; margin-block:12px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
.clinical-root-row .field,.clinical-root-row label { min-width:0; overflow-wrap:anywhere; }
.clinical-root-row input,.clinical-root-row select { width:100%; min-width:0; box-sizing:border-box; }
.clinical-root-row .field:first-child { grid-column:1 / -1; }
.clinical-root-row .field:nth-child(4) { grid-column:1 / -1; }
.clinical-root-row>button { grid-column:1 / -1; justify-self:end; }
.clinical-root-row[data-selected=true] { border-color:#168d9c; background:#f4fbfb; }
.clinical-measurements textarea { width:100%; min-width:0; box-sizing:border-box; }
.clinical-root-legacy-note { color:#846b20; background:#fffae8; border-radius:10px; padding:12px; }
.clinical-root-chart { border-block:1px solid #d9e7eb; margin-block:20px; padding-block:18px; }
.clinical-root-record { padding:14px; border:1px solid #d9e7eb; border-radius:12px; margin-block:12px; }
.clinical-root-history { margin-block:12px; border-inline-start:3px solid #c5dbe0; padding-inline-start:12px; }
.clinical-root-record td,.clinical-root-history td { white-space:normal; overflow-wrap:anywhere; }
@media(max-width:850px) { .clinical-root-layout { grid-template-columns:minmax(0,1fr); } .clinical-tooth-panel { position:static; max-height:none; overflow:visible; } .clinical-tooth-viewport { height:400px; } }
@media(max-width:450px) { .clinical-tooth-panel { position:sticky; top:0; max-height:calc(100dvh - 130px); overflow:auto; padding:10px; } .clinical-tooth-viewport { height:350px; } .clinical-root-row { padding:10px; gap:8px; } .clinical-root-intro { padding:10px; } }

.tooth-root-tag { white-space:pre-line; max-width:125px; overflow-wrap:anywhere; line-height:1.4; text-align:center; }
.clinical-root-buttons .btn { flex-direction:column; gap:2px; }
.clinical-root-buttons bdi { white-space:nowrap; word-break:normal; overflow-wrap:normal; }
