/* Tablet/mobile: Library và Inspector là Bootstrap Offcanvas; Canvas luôn ưu tiên. */
@media (max-width:1199.98px) {
  .toantin-tool-3d .tt-header-row { grid-template-columns:minmax(0,1fr) auto; }
  .toantin-tool-3d .tt-current-model { display:none !important; }
  .toantin-tool-3d .tt-responsive-panel { width:min(92vw,360px); }
  .toantin-tool-3d .tt-responsive-panel .offcanvas-body { min-height:0; background:var(--tt-bg); padding:.65rem; }
  .toantin-tool-3d .tt-responsive-panel .tt-side-panel { min-height:100%; }
  .toantin-tool-3d .tt-model-list { overflow:visible; }
}

/* Desktop: ba vùng cố định theo viewport; chỉ hai panel bên cuộn độc lập. */
@media (min-width:1200px) {
  .toantin-tool-3d .tt-shell-grid { grid-template-columns:minmax(240px,270px) minmax(0,1fr) minmax(285px,320px); gap:.7rem; }
  .toantin-tool-3d .tt-responsive-panel.offcanvas { position:static; visibility:visible !important; transform:none !important; width:auto; height:100%; min-height:0; max-height:none; border:0; background:transparent; z-index:auto; display:block; }
  .toantin-tool-3d .tt-responsive-panel .offcanvas-body { display:block; height:100%; min-height:0; overflow:hidden; padding:0; }
  .toantin-tool-3d .tt-panel-mobile-header { display:none; }
  .toantin-tool-3d .tt-library-panel,.toantin-tool-3d .tt-inspector-panel { align-self:stretch; min-height:0; }
}

@media (max-width:991.98px) {
  .toantin-tool-3d .tt-app-main { padding-left:.55rem !important; padding-right:.55rem !important; }
  .toantin-tool-3d .tt-tool-btn span,.toantin-tool-3d .tt-mode-btn span { display:none; }
  .toantin-tool-3d .tt-tool-btn,.toantin-tool-3d .tt-mode-btn { min-width:40px; }
  .toantin-tool-3d .tt-toolbar-divider { display:none; }
}

@media (max-width:767.98px) {
  .toantin-tool-3d { --tt-header-height:60px; }
  .toantin-tool-3d .tt-brand-logo { width:58px; height:40px; flex-basis:58px; }
  .toantin-tool-3d .tt-brand-copy strong { font-size:.9rem; }
  .toantin-tool-3d .tt-brand-copy small { font-size:.67rem; }
  .toantin-tool-3d .tt-header-actions { gap:.3rem; }
  .toantin-tool-3d .tt-header-actions .btn { min-height:40px; padding-left:.55rem; padding-right:.55rem; }
  .toantin-tool-3d .tt-app-main { padding:.45rem !important; }
  .toantin-tool-3d .tt-workspace-toolbar { gap:.3rem; padding:.35rem .4rem; }
  .toantin-tool-3d .tt-toolbar-zone { gap:.28rem; }
  .toantin-tool-3d .tt-canvas-hint span:nth-child(3) { display:none; }
  .toantin-tool-3d .tt-stage-status-row { padding-left:.42rem; padding-right:.42rem; }
}

@media (max-width:575.98px) {
  .toantin-tool-3d .tt-brand-copy small { display:none !important; }
  .toantin-tool-3d .tt-tool-btn,.toantin-tool-3d .tt-mode-btn,.toantin-tool-3d .tt-toggle-btn { min-height:44px; min-width:44px; }
  .toantin-tool-3d .tt-canvas-hint { bottom:.4rem; }
  .toantin-tool-3d .tt-canvas-hint span { font-size:.63rem; }
  .toantin-tool-3d .tt-size-readout { display:none !important; }
  .toantin-tool-3d .tt-status-text { font-size:.7rem; }
}

@media (max-height:520px) and (orientation:landscape) {
  .toantin-tool-3d { --tt-header-height:54px; }
  .toantin-tool-3d .tt-brand-logo { width:50px; height:34px; flex-basis:50px; }
  .toantin-tool-3d .tt-canvas-hint { display:none; }
  .toantin-tool-3d .tt-stage-status-row { min-height:30px; }
}

@media (max-width:991.98px) {
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar { top:.45rem; left:50%; right:auto; max-width:calc(100% - .9rem); gap:.28rem; padding:.34rem; }
  .toantin-tool-3d .tt-fs-btn { min-width:44px; min-height:44px; }
  .toantin-tool-3d .tt-fs-text-btn span { display:none; }
  .toantin-tool-3d .tt-fs-field .form-select { min-width:94px; min-height:44px; }
  .toantin-tool-3d .tt-fullscreen-formula { top:4.25rem; right:.55rem; }
}

@media (max-width:575.98px) {
  .toantin-tool-3d .tt-fs-divider { display:none; }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar { border-radius:10px; }
  .toantin-tool-3d .tt-annotation-count { display:none; }
  .toantin-tool-3d .tt-pen-field .form-select { min-width:84px; }
  .toantin-tool-3d .tt-fullscreen-formula { left:.55rem; right:.55rem; width:auto; max-height:58%; }
}

/* v3 — giữ scaling của công thức theo chính kích thước floating panel. */
@media (max-width:991.98px) {
  .toantin-tool-3d .tt-fullscreen-formula .tt-formula-expression { font-size:calc(1.9rem * var(--tt-formula-scale,1)); }
}
@media (max-width:575.98px) {
  .toantin-tool-3d .tt-fullscreen-formula .tt-formula-expression { font-size:calc(1.9rem * var(--tt-formula-scale,1)); }
  .toantin-tool-3d .tt-fullscreen-formula .tt-formula-label { font-size:calc(.95rem * var(--tt-formula-scale,1)); }
  .toantin-tool-3d .tt-fullscreen-formula .tt-formula-note { font-size:calc(.95rem * var(--tt-formula-scale,1)); }
  .toantin-tool-3d .tt-fullscreen-formula .tt-formula-variables { font-size:calc(1rem * var(--tt-formula-scale,1)); }
}

@media (max-width:575.98px) {
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] { width:min(220px,calc(100% - .7rem)); max-width:min(220px,calc(100% - .7rem)); }
  .toantin-tool-3d .tt-fs-model-list { grid-template-columns:1fr; }
}

/* v3.3 — Owner mobile fix: không ép/cắt chữ; toolbar dài được cuộn theo orientation. */
@media (max-width:991.98px) {
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar {
    width:calc(100% - .9rem);
    max-width:calc(100% - .9rem);
    overflow-x:auto;
    overflow-y:hidden;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x;
    scrollbar-width:thin;
  }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar .tt-fs-group,
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar .tt-fs-btn,
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar .tt-fs-field { flex:0 0 auto; }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar .tt-fs-text-btn span { display:inline; }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar .tt-fs-text-btn { width:auto; max-width:none; white-space:nowrap; }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] {
    width:min(240px,calc(100% - .7rem));
    max-width:min(240px,calc(100% - .7rem));
    overflow-x:hidden;
    overflow-y:auto;
    touch-action:pan-y;
  }
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-btn,
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-field,
  .toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-field .form-select { width:100%; max-width:100%; }
}

/* v3.3 Owner Fix 01 — compact vertical fullscreen teaching palette.
   Scope: Standalone Presentation/Fullscreen only. Integrated Host toolbar is unaffected. */
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] {
  width:60px !important;
  max-width:60px !important;
  padding:.36rem .34rem;
  gap:.28rem;
  align-items:center;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  touch-action:pan-y;
  scrollbar-width:thin;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-group {
  width:auto;
  flex-direction:column;
  align-items:center;
  gap:.28rem;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-divider {
  width:34px;
  height:1px;
  flex:0 0 1px;
  margin:.04rem 0;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-btn {
  width:44px;
  min-width:44px;
  max-width:44px;
  min-height:44px;
  height:44px;
  padding:0;
  justify-content:center;
  flex:0 0 44px;
  border-radius:10px;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-btn .tt-icon {
  width:20px;
  height:20px;
  flex:0 0 20px;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-text-btn .tt-fs-label,
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-text-btn > span:not(.visually-hidden) {
  display:none !important;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-field,
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select {
  position:relative;
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
  height:44px;
  flex:0 0 44px !important;
  margin:0;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select .form-select {
  appearance:none;
  -webkit-appearance:none;
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
  height:44px;
  min-height:44px;
  padding:0 !important;
  border:1px solid var(--tt-border-strong);
  border-radius:10px;
  color:transparent;
  text-indent:-9999px;
  text-shadow:none;
  cursor:pointer;
  background-color:#fff;
  background-repeat:no-repeat;
  background-position:center;
  background-size:20px 20px;
  box-shadow:none;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select .form-select:hover {
  border-color:var(--tt-primary);
  background-color:var(--tt-primary-softer);
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select .form-select:focus {
  border-color:var(--tt-primary);
  box-shadow:0 0 0 .18rem rgba(13,110,253,.16);
  outline:0;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select .form-select option {
  color:var(--tt-text);
  background:#fff;
  text-indent:0;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-compact-select::after {
  content:"";
  position:absolute;
  right:5px;
  bottom:5px;
  width:0;
  height:0;
  border-left:3px solid transparent;
  border-right:3px solid transparent;
  border-top:4px solid var(--tt-muted);
  pointer-events:none;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-view-select .form-select {
  background-image:url('../assets/icons/view.svg');
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-color-select .form-select {
  background-image:url('../assets/icons/palette.svg');
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-width-select .form-select {
  background-image:url('../assets/icons/line-width.svg');
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-annotation-count {
  width:44px;
  min-height:28px;
  padding:.12rem 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--tt-border);
  border-radius:8px;
  background:rgba(255,255,255,.88);
  font-size:.72rem;
  line-height:1;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-annotation-count-label {
  display:none;
}
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] .tt-fs-drag-handle,
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] [data-workspace-action="toolbar-orientation"],
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] [data-workspace-action="toolbar-lock"],
.toantin-tool-3d .tt-fullscreen-teaching-toolbar[data-orientation="vertical"] [data-workspace-action="fullscreen"] {
  justify-content:center;
}

/* BUILD 1 — toolbar responsive: mobile reflow tối đa 2 hàng, không phụ thuộc cuộn ngang dài. */
@media (max-width:767.98px) {
  .toantin-tool-3d .tt-workspace-toolbar { flex-wrap:wrap; overflow-x:visible; }
  .toantin-tool-3d .tt-workspace-toolbar .tt-toolbar-zone { flex-wrap:wrap; }
  .toantin-tool-3d .tt-workspace-toolbar .tt-output-tools { margin-left:0 !important; }
}

/* Owner Fix 06 — desktop side panels collapse to narrow reopen rails; mobile offcanvas is unchanged. */
@media (min-width:1200px) {
  .toantin-tool-3d .tt-shell-grid {
    --tt-library-column:minmax(240px,270px);
    --tt-inspector-column:minmax(285px,320px);
    grid-template-columns:var(--tt-library-column) minmax(0,1fr) var(--tt-inspector-column);
  }
  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] { --tt-library-column:44px; }
  .toantin-tool-3d .tt-shell-grid[data-inspector-collapsed="true"] { --tt-inspector-column:44px; }

  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] .tt-library-panel .tt-panel-heading,
  .toantin-tool-3d .tt-shell-grid[data-inspector-collapsed="true"] .tt-inspector-panel .tt-panel-heading {
    height:100%;
    min-height:0;
    align-items:flex-start;
    justify-content:center;
    padding:.45rem .3rem;
    border-bottom:0;
  }
  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] .tt-library-panel .tt-panel-heading > :not(.tt-panel-collapse-btn),
  .toantin-tool-3d .tt-shell-grid[data-inspector-collapsed="true"] .tt-inspector-panel .tt-panel-heading > :not(.tt-panel-collapse-btn) { display:none !important; }
  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] .tt-library-panel .tt-model-list,
  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] .tt-library-panel .tt-empty-state,
  .toantin-tool-3d .tt-shell-grid[data-inspector-collapsed="true"] .tt-inspector-panel .tt-inspector-accordion { display:none !important; }
  .toantin-tool-3d .tt-shell-grid[data-library-collapsed="true"] .tt-library-panel .tt-side-panel,
  .toantin-tool-3d .tt-shell-grid[data-inspector-collapsed="true"] .tt-inspector-panel .tt-side-panel { border-radius:10px; }
}