/* SUKIYADO COLLADA INSPECTOR — standalone style sheet
   Shoji reference: reference/shojistyle-new.css (not loaded at runtime).
   Styles retain their cascade order from v3.1.13 for visual parity.
   Edit Inspector rules here; do not load the Shoji stylesheet alongside this file. */
:root{color-scheme:light;--bg:#e7e0d4;--panel:#f6f1e8;--deep:#fffaf2;--line:#cbbda8;--text:#40352a;--muted:#817362;--accent:#9d693b}
*{box-sizing:border-box}html,body{height:100%;margin:0;font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text)}
header{height:62px;display:flex;align-items:center;gap:14px;padding:0 23px;border-bottom:1px solid var(--line);background:#e3d8c8}header .mark{height:30px;width:30px;border:1px solid var(--accent);display:grid;place-items:center;color:var(--accent);font-family:Georgia,serif;font-size:23px}h1{font-size:15px;font-weight:550;letter-spacing:.065em;margin:0}header small{display:block;color:var(--muted);font-size:11px;letter-spacing:.035em}main{display:grid;grid-template-columns:minmax(0,var(--left-width,55%)) 8px minmax(0,1fr);height:calc(100% - 62px)}.left,.right{min-height:0;display:flex;flex-direction:column}.left{min-width:0;overflow:hidden}.toolbar{padding:12px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:60px}button,.upload-label{background:#f9f5ee;color:var(--text);border:1px solid #b9a88f;border-radius:3px;padding:7px 12px;cursor:pointer;font:inherit;font-size:12px}button:hover,.upload-label:hover{border-color:var(--accent)}button:disabled{opacity:.4;cursor:default}.tool-spacer{flex:1}.muted{color:var(--muted)}#drop{flex:1;min-height:260px;position:relative;overflow:hidden;background:#ffffff}#drop.dragover:after{content:'Drop COLLADA (.dae) or textured ZIP (.zip)';position:absolute;inset:12px;border:2px dashed var(--accent);background:#f7ebdccf;display:grid;place-items:center;font-size:20px;z-index:5;pointer-events:none}#viewport{position:absolute;inset:0}#empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;padding:32px}#empty svg{stroke:var(--accent);opacity:.85;margin-bottom:18px}#empty strong{font-size:17px;font-weight:500}#empty p{color:var(--muted);max-width:270px;font-size:12px}#foot{border-top:1px solid var(--line);padding:10px 17px;font-size:11px;color:var(--muted)}.right{background:var(--panel);min-width:0;overflow:hidden}.right-head{padding:19px 22px 16px;border-bottom:1px solid var(--line)}h2{font-size:15px;font-weight:550;margin:0 0 4px;letter-spacing:.025em}.desc{color:var(--muted);font-size:12px;margin:0}.controls{min-width:0;padding:14px 22px;display:flex;flex-wrap:wrap;align-items:end;gap:12px;border-bottom:1px solid var(--line)}.controls label{font-size:11px;color:var(--muted);display:flex;flex-direction:column;gap:5px}.controls select,.controls input{font:inherit;font-size:12px;color:var(--text);background:var(--deep);border:1px solid #b9a88f;border-radius:3px;padding:7px 9px;max-width:210px}input[type="search"]{width:150px}#mindim{width:115px}.counts{min-width:0;padding:11px 22px;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line)}.counts b{color:var(--text);font-weight:550}#output{flex:1;min-height:0;overflow:auto;padding:12px 22px 28px}.group{margin:6px 0 20px}.group-title{display:flex;gap:12px;align-items:baseline;color:var(--accent);font-size:12px;font-weight:600;letter-spacing:.045em;border-bottom:1px solid var(--line);padding:7px 0 9px}.group-title small{color:var(--muted);font-size:11px;font-weight:400;letter-spacing:normal}.item{font-size:12px;padding:8px 4px 8px 0;border-bottom:1px solid #343a3d;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px}.item .name{overflow-wrap:anywhere}.item .dim{white-space:nowrap;color:#d2d8d5;font-variant-numeric:tabular-nums}.item .sub{display:block;color:#87928e;font-size:10px}#placeholder{color:var(--muted);text-align:center;margin:60px 15px;font-size:12px}.notice{padding:11px 16px;color:#714a27;background:#f1dec4;font-size:12px;display:none;white-space:pre-wrap}#notice:not(:empty){display:block}#fileinput{display:none}@media(max-width:850px){main{grid-template-columns:1fr;grid-template-rows:minmax(390px,52vh) minmax(360px,1fr);height:auto;min-height:calc(100% - 62px)}.left{border-bottom:1px solid var(--line)}.splitter{display:none!important}.right{height:600px}#drop{min-height:280px}}

/* Sukiyado-style, keyboard-accessible resizing handle. */
.splitter{position:relative;z-index:4;cursor:col-resize;background:#d4c2ac;border-left:1px solid #ad916e;border-right:1px solid #ad916e;touch-action:none;outline:none}
.splitter::before{content:"";position:absolute;left:2px;top:50%;transform:translateY(-50%);width:2px;height:44px;background:repeating-linear-gradient(to bottom,var(--accent) 0 3px,transparent 3px 8px);opacity:.65}
.splitter:hover,.splitter:focus-visible,.splitter.dragging{background:#b98c60;border-color:var(--accent)}
body.split-resizing,body.split-resizing *{cursor:col-resize!important;user-select:none!important}
/* Beige-and-cognac element output, scroll contained within the right pane. */
#output{padding:12px;overflow:auto;overscroll-behavior:contain;background:#f7f3ed;color:#30291f;max-width:100%;width:100%}
.element-table{width:100%;min-width:610px;border-collapse:collapse;table-layout:fixed;font-family:Arial,Helvetica,sans-serif;font-size:13px;line-height:1.3;color:#111;background:#fff}
.element-table th,.element-table td{border:1px solid #ccbda9;padding:7px 8px;vertical-align:middle}
.element-table thead th{position:sticky;top:0;z-index:2;background:#dcc9b2;color:#3c2d20;font-weight:550;text-align:left;white-space:normal;overflow-wrap:anywhere;border-bottom-color:#a38868}
.element-table tbody td:first-child{background:#eee3d5;font-weight:500;overflow-wrap:anywhere}
.element-table tbody td:nth-child(2){overflow-wrap:anywhere}
.element-table tbody td:nth-child(3){overflow-wrap:anywhere}
.element-table .number{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;}
.element-table tbody tr:hover td{background:#faf1e5}
.element-table tbody tr:hover td:first-child{background:#e6d3be}
.element-table .element-select{font:inherit;color:#76502e;background:transparent;border:0;padding:0;text-align:left;cursor:pointer;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;overflow-wrap:anywhere;max-width:100%}
.element-table .element-select:hover,.element-table .element-select:focus-visible{color:#915822;text-decoration-color:currentColor;outline-offset:2px}
.element-table tr.is-selected td{background:#e6f0d9!important}
.element-table tr.is-selected .element-select{color:#507e28;font-weight:550;text-decoration-color:#507e28}
.element-table th:nth-child(1){width:37%}.element-table th:nth-child(2){width:21%}.element-table th:nth-child(3){width:12%}.element-table th:nth-child(n+4){width:10%}
.right-head,.controls,.counts{max-width:100%}.counts{display:flex;gap:5px;flex-wrap:wrap}.counts #unit{margin-left:auto;float:none!important}
button:hover,.upload-label:hover{background:#ead8c0;color:#65411f}.upload-label{background:#9d693b;color:#fffaf2;border-color:#8d5b32}
/* Collapsible equal-size texture/material groups. */
.element-table .size-group-row td{background:#f6f0e8!important;border-top:1px solid #ded2c3;font-weight:500}
.element-table .size-group-row.is-selected td{background:#e6f0d9!important}
.element-table .size-group-name{display:flex;align-items:center;gap:6px;min-width:0}
.element-table .size-group-name .element-select{flex:1;min-width:0}
.element-table .group-chevron{margin-left:0;flex:0 0 28px;width:28px;min-height:28px;padding:2px;border:0;background:transparent;color:#805735;font-size:20px;line-height:1;cursor:pointer;order:-1}
.element-table .group-chevron:hover{background:#eee3d4}
.element-table .size-group-member td:first-child{padding-left:18px;background:#faf5ed;font-weight:400}
.element-table .size-group-member td:first-child .element-select{font-weight:400}
.element-table .size-group-row .element-visibility-cell input{accent-color:#9d693b}
/* Compact inspector overview: preserve the six-column layout and scrolling. */
#output{padding:6px 8px 12px}
.element-table{font-size:11px;line-height:1.16;min-width:545px}
.element-table th,.element-table td{padding:4px 5px}
.element-table thead th{font-size:10.5px;line-height:1.15}
.element-table .element-select{line-height:1.15}
.counts{padding:7px 12px;font-size:11px}
/* Match right-pane dropdown to the same beige/cognac form controls. */
.controls select,.settings-panel select{
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  height:32px;
  min-height:32px;
  padding:6px 34px 6px 10px;
  background-color:#fffaf2;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%239d693b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 11px center;
  border:1px solid #b9a88f;
  border-radius:3px;
  color:#40352a;
  cursor:pointer;
  line-height:1.35;
}
.controls select:hover,.settings-panel select:hover{border-color:#9d693b}

#viewport canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
#viewport canvas.is-orbiting{cursor:grabbing}
#viewport canvas.is-hovering:not(.is-orbiting){cursor:pointer}
@media(max-width:850px){main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(390px,52vh) minmax(360px,1fr)}.right{width:100%}}
#output #placeholder{color:#555}
.element-table tbody td:first-child .element-select{display:block;width:100%;font-weight:700;color:#805735;text-decoration:none}
.element-table tbody td:first-child .element-select:hover,.element-table tbody td:first-child .element-select:focus-visible{text-decoration:underline;color:#9d693b}
.element-table tr.is-selected .element-select{color:#507e28!important}
/* Shared Sukiyado controls and compact left toolbar. */
.toolbar{padding:9px 13px;min-height:49px;gap:7px}
.toolbar .tool-spacer{min-width:4px}
.toolbar #filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px}
button,.upload-label,.controls select,.controls input,.settings-panel input{font-family:inherit;font-size:12px;line-height:1.35;border:1px solid #b9a88f;border-radius:3px;background:#fffaf2;color:#40352a;min-height:32px;padding:7px 10px;box-shadow:none;accent-color:#9d693b}
button,.upload-label{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
.upload-label{background:#9d693b;color:#fffaf2;border-color:#8d5b32}
button:focus-visible,.upload-label:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #9d693b;outline-offset:2px}
.right-head{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 18px}
.right-head h2{margin:0 0 2px}
.controls{padding:10px 18px;gap:9px}
.controls label{gap:4px}
.settings-panel{padding:13px 18px;background:#ede3d5;border-bottom:1px solid var(--line)}
.settings-panel[hidden]{display:none}
.settings-row{display:flex;align-items:end;flex-wrap:wrap;gap:12px}
.settings-row label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted)}
.settings-panel input[type=color]{width:57px;height:37px;cursor:pointer;padding:3px;background:#fffaf2}
.settings-panel input[type=text]{width:115px;font-family:ui-monospace,monospace;text-transform:uppercase}
.settings-panel input[type=number]{width:115px}
.settings-hint{color:var(--muted);font-size:11px;margin:9px 0 0}
.settings-panel .settings-check{display:flex;flex-direction:row;align-items:center;gap:8px;align-self:center}.settings-panel input[type=checkbox]{min-height:unset;width:16px;height:16px;padding:0}
#settings-toggle[aria-expanded=true]{background:#d8bea0;border-color:#9d693b}
/* Compact rows: preserve legible type, reduce whitespace around text. */
.element-table{font-size:var(--table-font-size,12px);font-weight:var(--table-font-weight,400);line-height:1.18}
.element-table th,.element-table td{padding:var(--table-cell-vpad,2px) var(--table-cell-hpad,4px)}
.element-table thead th{font-size:inherit;line-height:1.18}
.element-table tbody td:first-child,.element-table tbody td:first-child .element-select{font-weight:var(--table-font-weight,400)}
.element-table .element-select{font-weight:inherit;line-height:inherit}
/* Settings dropdown shares the exact appearance and chevron of the main toolbar dropdown. */
.settings-panel input[type=number]{width:94px}
.controls #mindim{width:125px;min-width:125px;box-sizing:border-box}
header .app-version{margin-left:auto;align-self:center;color:var(--muted);font-size:12px;letter-spacing:.04em;white-space:nowrap}

/* Grouped settings: tidy, responsive controls without changing their IDs or handlers. */
.settings-panel{padding:15px 18px 18px;max-height:min(65vh,510px);overflow-y:auto;overscroll-behavior:contain;background:#eee7dc}
.settings-header{margin-bottom:13px}
.settings-header h3{margin:0;font-size:13px;font-weight:650;color:var(--text)}
.settings-header p{margin:2px 0 0;color:var(--muted);font-size:11px}
.settings-groups{display:grid;grid-template-columns:minmax(200px,1.32fr) minmax(155px,1fr) minmax(190px,1fr);gap:11px;align-items:stretch}
.settings-group{min-width:0;background:#f9f6f0;border:1px solid #d9cbbc;border-radius:5px;padding:13px 14px}
.settings-group h4{margin:0 0 13px;padding-bottom:8px;border-bottom:1px solid #e2d7c9;color:#7e532e;font-size:11px;font-weight:700;letter-spacing:.065em;text-transform:uppercase}
.setting-field{min-width:0;display:flex;flex-direction:column;gap:6px}
.setting-field+.setting-field{margin-top:13px}
.setting-title{font-size:12px;font-weight:550;color:var(--text)}
.setting-inline{display:flex;align-items:center;gap:6px;min-width:0}
.settings-panel .setting-inline input[type=color]{width:38px;height:32px;flex:0 0 38px;padding:3px;border-radius:4px}
.settings-panel .setting-inline input[type=text]{min-width:0;width:92px;flex:1 1 92px;height:32px;padding:6px 7px;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.01em;text-transform:uppercase}
.settings-panel .settings-reset{padding:5px 9px;height:32px;min-height:32px;flex:0 0 auto;font-size:11px;background:#f5ede3}
.settings-note{margin:0;color:var(--muted);font-size:10.5px;line-height:1.45}
.setting-toggle{display:flex;justify-content:space-between;gap:10px;align-items:center;cursor:pointer}
.setting-toggle span{display:flex;flex-direction:column;gap:3px;min-width:0}
.setting-toggle strong{font-size:12px;font-weight:550}
.setting-toggle small{font-size:10.5px;color:var(--muted);line-height:1.4}
.settings-panel .setting-toggle input[type=checkbox]{flex:0 0 17px;width:17px;height:17px;min-height:0;margin:0;padding:0;cursor:pointer}
.setting-field-grid{display:grid;grid-template-columns:minmax(75px,.85fr) minmax(100px,1.15fr);gap:10px}
.setting-field-grid .setting-field+.setting-field{margin:0}
.settings-panel .setting-field-grid input[type=number],.settings-panel .setting-field-grid select{width:100%;min-width:0;height:32px}
.setting-unit{position:relative}
.setting-unit span{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;font-size:11px;color:var(--muted)}
.setting-unit input{padding-right:29px}
@media(max-width:1250px){.settings-groups{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-group:last-child{grid-column:1/-1}}
@media(max-width:980px){.settings-groups{grid-template-columns:minmax(0,1fr)}.settings-group:last-child{grid-column:auto}.settings-panel{max-height:min(55vh,560px)}}
/* Element visibility is independent of the active row highlight. */
.element-table .element-visibility-cell{width:35px;text-align:center;padding-left:2px;padding-right:6px}
.element-visibility-cell input[type=checkbox]{min-height:0;width:15px;height:15px;margin:0;cursor:pointer;accent-color:#816242}
.element-table tr.is-hidden td{opacity:.52}
.element-table tr.is-hidden .element-visibility-cell{opacity:1}
#history-clear{margin-top:10px}

/* v2.2.14: tighter right-pane vertical spacing and integrated table history. */
.right .controls{padding-top:7px;padding-bottom:7px;gap:8px}
.right .counts{padding-top:5px;padding-bottom:5px}
.right #output{padding-top:3px;padding-bottom:5px}
.right .element-table th,.right .element-table td{padding-top:3px;padding-bottom:3px}
.settings-groups{grid-template-columns:repeat(3,minmax(0,1fr))}
.settings-group{padding:10px 12px}
.settings-group h4{margin-bottom:10px;padding-bottom:6px}
.table-history{border-top:1px solid #e2d7c9;margin-top:14px;padding-top:11px;display:grid;gap:8px}
.table-history h5{color:#7e532e;font-size:11px;text-transform:uppercase;letter-spacing:.055em;margin:0;font-weight:700}
.table-history .setting-field{gap:4px}
.table-history input[type=number]{width:90px;max-width:100%}
.table-history #history-clear{justify-self:start;margin-top:0}
/* v2.2.14: history controls side by side and softer visibility toggles. */
.table-history .history-controls{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.table-history .history-controls #history-limit{flex:0 0 65px;width:65px;min-width:0}
.table-history .history-controls #history-clear{margin:0;flex:0 1 auto;white-space:normal;text-align:center;line-height:1.2}
.element-visibility-cell input[type=checkbox],.settings-panel input[type=checkbox]{accent-color:#D6C2AB}
@media(max-width:1250px){.settings-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:980px){.settings-groups{grid-template-columns:minmax(0,1fr)}}

/* v2.2.18: content-responsive columns; only scroll horizontally when required. */
.right #output{min-width:0;width:100%;overflow-x:auto}
.right .element-table{width:100%;min-width:100%;table-layout:auto}
.right .element-table th{width:auto!important;overflow-wrap:normal;word-break:normal;white-space:nowrap}
.right .element-table th:nth-child(-n+3),.right .element-table td:nth-child(-n+3){min-width:85px;overflow-wrap:anywhere;white-space:normal}
.right .element-table td.number{white-space:nowrap}
.right .element-table .element-visibility-cell{width:1%;min-width:55px;text-align:center;padding-left:5px;padding-right:5px;white-space:nowrap}
.inspector-manual{margin-top:12px;background:#f9f6f0;border:1px solid #d9cbbc;border-radius:5px;color:#40352a}
.inspector-manual summary{cursor:pointer;font-size:12px;font-weight:650;padding:12px 14px;list-style-position:inside}
.inspector-manual[open] summary{border-bottom:1px solid #e2d7c9}
.manual-content{display:block;padding:14px}
/* Balanced flowing columns prevent tall sections leaving empty grid-row gaps. */
.inspector-manual{container-type:inline-size}
@container (min-width:560px){.manual-content{columns:2;column-gap:22px}}
.manual-content section{min-width:0;break-inside:avoid;page-break-inside:avoid;margin:0 0 14px}.manual-content section:last-child{margin-bottom:0}.manual-content h4{font-size:12px;margin:0 0 5px;color:#7e532e}.manual-content p{font-size:11px;line-height:1.55;margin:0}.manual-content kbd{font:inherit;background:#ede3d5;border-radius:3px;padding:1px 3px}

/* v2.2.19: consistent control widths within Element table settings. */
#settings-table-title + .setting-field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-group[aria-labelledby="settings-table-title"] .setting-field-grid input[type=number],
.settings-group[aria-labelledby="settings-table-title"] .setting-field-grid select{width:100%;min-width:0;box-sizing:border-box}
.table-history .history-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
.table-history .history-controls #history-limit,
.table-history .history-controls #history-clear{width:100%;min-width:0;max-width:none;box-sizing:border-box;height:auto;min-height:32px;margin:0}
.threshold-setting{margin-top:12px}.threshold-setting h5{margin:0 0 7px;font-size:12px}.threshold-inputs{display:flex;gap:8px;flex-wrap:wrap}.threshold-inputs label{display:flex;flex:1 1 65px;max-width:105px;flex-direction:column;gap:3px;font-size:11px}.settings-panel .threshold-inputs input[type=number]{box-sizing:border-box;width:100%;min-width:0;height:30px;padding:4px 6px}.threshold-setting .settings-note{margin-top:7px}

/* v2.2.48: subtle grouped rows and precise drag targets. */
.element-table tr.size-group-row:hover td{background:#efe7db!important}
.element-table tr.size-group-row.is-selected td{background:#e6f0d9!important}
.element-table tr.group-drop-target td,.element-table tr.group-drop-target:hover td{background:#dce9ce!important;box-shadow:inset 0 2px #83a46b,inset 0 -2px #83a46b}
.element-table tr[draggable="true"]{cursor:grab}
.element-table tr[draggable="true"]:active{cursor:grabbing}
.element-table tr.is-dragging{opacity:.42}
.element-table .manual-marker{font-size:10px;color:#827b70;font-weight:500;margin-left:6px}
.manual-group-tools{display:flex;gap:7px;align-items:center;justify-content:flex-end;padding:5px 2px 7px}
.manual-group-tools button{min-height:25px;height:25px;padding:3px 8px;font-size:11px;background:#fbf8f3}
.element-table .edit-name{border:0;background:transparent;color:#aa947e;cursor:pointer;padding:0 4px;font-size:13px;vertical-align:middle;opacity:.65}.element-table .edit-name:hover,.element-table .edit-name:focus-visible{color:#6f4b2e;opacity:1}.element-table tbody td:first-child .edit-name{display:inline-block}.element-table tbody td:first-child .element-select{display:inline;width:auto;max-width:calc(100% - 28px)}
/* v2.2.48: align the individual part edit action with the right edge. */
.element-table .part-name-cell{display:flex;align-items:center;gap:7px;min-width:0;width:100%}
.element-table .part-name-cell .element-select{flex:1 1 auto;min-width:0;max-width:none!important;width:auto!important;display:block!important}
.element-table .part-name-cell .edit-name{margin-left:auto;flex:0 0 auto;font-size:17px;line-height:1.1;padding:3px 5px;opacity:.85}
/* Consistent edit icons for all elements and groups. */
.element-table .edit-name,.element-table .part-name-cell .edit-name{font-size:17px;line-height:1;width:28px;height:28px;min-width:28px;padding:3px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
/* Header expand/collapse-all control, aligned to the far right. */
.element-table th .texture-heading{display:flex;align-items:center;justify-content:flex-start;gap:6px;min-width:0}
.element-table th .toggle-all-groups{margin-left:0;flex:0 0 28px;width:28px;min-height:28px;border:0;background:transparent;color:#805735;font-size:20px;line-height:1;cursor:pointer;padding:2px;border-radius:3px;opacity:.8}
.element-table th .toggle-all-groups:hover,.element-table th .toggle-all-groups:focus-visible{opacity:1;background:rgba(100,80,50,.10)}
/* Special permanent exclusion group stays recognizable without heavy backgrounds. */
.element-table tr.other-elements-row td{background:#FCE8E8!important;border-bottom:1px solid #e8c6c6}
.element-table tr.other-elements-row:hover td{background:#F7D6D6!important}
.element-table tr.other-elements-row .element-select{font-weight:550}
.element-table tr.other-elements-row .manual-marker{font-size:10px;color:#786e63}
.element-table tr.other-elements-row.group-drop-target td{background:#dce9ce!important;box-shadow:inset 0 2px #83a46b,inset 0 -2px #83a46b}

/* v2.2.63: opening the manual replaces the listing area without changing preview or controls logic. */
.right:has(.inspector-manual[open]) > .counts,
.right:has(.inspector-manual[open]) > #output {display:none}
.inspector-manual .manual-content{padding:18px 20px}
.inspector-manual .manual-content section{margin-bottom:20px}
.inspector-manual .manual-content h4{font-size:15px;line-height:1.4;margin-bottom:9px}
.inspector-manual .manual-content p{font-size:13px;line-height:1.65;margin:0 0 11px}
.inspector-manual .manual-content p:last-child{margin-bottom:0}
.inspector-manual .manual-content .manual-note{margin-top:15px}
.inspector-manual .manual-content .manual-note strong{display:block;margin-bottom:5px}
/* v2.2.63: manual is its own scrolling flex pane, never clipped by the right pane. */
.right:has(.inspector-manual[open]) > .inspector-manual[open]{
  flex:1 1 0; min-height:0; overflow-y:auto; overflow-x:hidden;
  overscroll-behavior:contain; scrollbar-gutter:stable;
}
/* Keep the manual text in a stable grid rather than newspaper columns (Safari). */
.inspector-manual .manual-content{columns:auto!important;display:grid;grid-template-columns:1fr;align-content:start;gap:20px 26px}
.inspector-manual .manual-content section{margin:0;break-inside:auto;page-break-inside:auto}
@container (min-width:560px){.inspector-manual .manual-content{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* v2.2.63: keep the manual fully readable and remove its separating rule. */
.right:has(.inspector-manual[open]){overflow:hidden}
.right:has(.inspector-manual[open]) > .inspector-manual[open]{min-height:0;max-height:none;overflow-y:auto;flex:1 1 0}
.inspector-manual[open] summary{border-bottom:0}
.inspector-manual summary{font-size:14px}
/* v2.2.63: Manual lives inside #settings-panel, not directly under .right.
   Expand the actual containing panel and hide the sibling element list. */
.right:has(.inspector-manual[open]) > .counts,
.right:has(.inspector-manual[open]) > #output {display:none!important}
.right:has(.inspector-manual[open]) > #settings-panel {
  flex:1 1 auto;min-height:0;max-height:none!important;overflow-y:auto;
  overscroll-behavior:contain;
}
/* Let the settings panel own vertical scrolling; no nested clipped manual pane. */
#settings-panel .inspector-manual[open]{display:block;flex:none!important;min-height:auto!important;max-height:none!important;overflow:visible!important}
#settings-panel .inspector-manual .manual-content{height:auto;max-height:none;overflow:visible}
/* No divider between grouping tolerance and file history. */
#settings-panel .table-history{border-top:none!important;padding-top:0;margin-top:12px}

/* Shoji configurator visual language, adapted to the Inspector UI. */
:root{--bg:#f5f3ef;--panel:#f9f8f5;--deep:#fff;--line:#d7d5cf;--text:#373530;--muted:#77736b;--accent:#787068}
html,body{font-family:Arial,Helvetica,sans-serif;background:#f6f5f2;color:#373530}
header{background:#fff;border-bottom:1px solid #dedbd5;height:61px}
header .mark{border-color:#9b978f;color:#77736b}
header small,.app-version{color:#87837c}
.left,.right{background:#fff}
.right{border-left:0}
.toolbar,.controls,.right-head,.counts{background:#fff;border-color:#e0ddd7}
button,.upload-label,.controls input,.controls select,.settings-panel input,.settings-panel select{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#4f4b45;border:1px solid #c8c5be;border-radius:4px;box-shadow:none}
button,.upload-label{min-height:32px;font-weight:400;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
button:hover,.upload-label:hover{background:#f0eee9;color:#373530;border-color:#9f9991}
.upload-label{background:#f4f2ee;color:#504b45;border-color:#b9b4ad}
button:focus-visible,.upload-label:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #9d958b;outline-offset:2px}
#settings-toggle[aria-expanded=true]{background:#e8e5df;border-color:#aaa49b}
#settings-panel{background:#f6f5f2;border-color:#e1ded9}
.settings-group,.inspector-manual{background:#fff;border-color:#dedbd5}
.settings-group h4,.table-history h5,.group-title{color:#66615b;border-color:#e5e2dd}
#output{background:#fff;color:#393630}
.element-table{background:#fff;color:#383530}
.element-table th,.element-table td{border-color:#dedbd4}
.element-table thead th{background:#eeeae3;color:#4a463e;border-bottom-color:#c9c2b8}
.element-table tbody td:first-child{background:#f7f5f1}
.element-table tbody tr:hover td,.element-table tbody tr:hover td:first-child{background:#f2f0eb}
.element-table .element-select,.element-table tbody td:first-child .element-select{color:#645d54}
.element-table .size-group-row td{background:#f9f7f4!important}
.element-table .group-chevron,.element-table th .toggle-all-groups{color:#777068}
.splitter{background:#e6e2db;border-color:#cbc5bb}
.splitter:hover,.splitter.dragging{background:#d7d0c6}
#foot{background:#fff;border-color:#e0ddd7}
/* Overlay coordinates and visual typography follow Shoji source. */
#shoji-preview-corner-text{position:absolute;top:18px;left:24px;right:24px;z-index:20;pointer-events:auto;text-align:right;font:400 15px/1.35 Arial,Helvetica,sans-serif;letter-spacing:.02em;color:rgba(45,42,36,.62);text-shadow:0 1px 2px rgba(255,255,255,.55);user-select:none;-webkit-user-select:none}
#shoji-preview-corner-text button{min-height:0!important;background:transparent!important;color:inherit!important;border:0!important;border-radius:0!important;box-shadow:none!important}


/* Shoji reference markup: <header class="hero"><h1 id="MainTitle">...</h1> */
/* Header styling isolated from the Inspector's older generic header rules. */
header.hero{display:flex;align-items:center;justify-content:space-between;column-gap:24px;min-height:76px;height:auto;padding:18px 28px;background:transparent;border-bottom:1px solid #e1d4c3;box-shadow:none;font-family:Verdana,Arial,Helvetica,sans-serif}
header.hero #MainTitle{display:block;flex:1 1 auto;min-width:0;margin:0 0 10px;padding:0;font-family:Verdana,Arial,Helvetica,sans-serif;font-size:28px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:normal;color:#c3b0a2;text-transform:none}
header.hero .app-version{margin-left:auto;flex:0 0 auto;align-self:center;font-family:Arial,Helvetica,sans-serif;font-size:11px;font-weight:400;color:#87837c}
main{height:calc(100% - 76px)}
@media(max-width:850px){header.hero{min-height:68px;padding:15px 18px}header.hero #MainTitle{font-size:21px}main{height:auto}}
@media(max-width:460px){header.hero #MainTitle{font-size:18px}}

/* Exact Shoji CSS reference: .hero h1 color #c3b0a2, size 28px, margin 0 0 10px;
   headings are bold by browser default and inherit Verdana from body. */
body:has(> header.hero){background:linear-gradient(180deg,#f5f3ef 0%,#e8dfd6 100%);background-attachment:fixed}
body:has(> header.hero) > main{height:calc(100% - 76px)}
@media(max-width:850px){body:has(> header.hero) > main{height:auto}}