/* CODE.NTT v1195 — explicit page-width ownership.
   Presentation only: never changes permission, form payload, route or action semantics. */

/* Data-heavy pages must consume the real content viewport instead of inheriting
   old document/form caps. Keep every flex/grid ancestor shrink-safe so wide
   tables/trees scroll inside their own surface rather than widening <body>. */
body.ntt-layout-wide #page-wrapper,
body.ntt-layout-wide #contentnav,
body.ntt-layout-wide #meModuleWrap{
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}

body.ntt-layout-wide #contentnav > .row,
body.ntt-layout-wide #contentnav > .modern-doc,
body.ntt-layout-wide #contentnav > .call-to-action,
body.ntt-layout-wide #contentnav .modern-doc,
body.ntt-layout-wide #contentnav .call-to-action,
body.ntt-layout-wide #contentnav .ntt-legacy-form-shell,
body.ntt-layout-wide #contentnav form.ntt-legacy-form{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}

body.ntt-layout-wide #contentnav > .row{
  margin-left:-15px;
  margin-right:-15px;
}

/* Known data surfaces own horizontal overflow. Never move that overflow to body. */
body.ntt-layout-wide :where(.table-responsive,.ntt-table-scroll,.ntt-sql-table-scroll,.ntt-html-browser-results,#freezer-example){
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide :where(.table-responsive,.ntt-table-scroll,.ntt-sql-table-scroll){
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide :where(.panel,.panel-body,.well,.ntt-html-card,.ntt-sql-card,.quiz-card){
  min-width:0;
}

/* Focused tasks intentionally stay narrow. Existing feature-specific widths
   remain authoritative; this is only a safe fallback for legacy small forms. */
body.ntt-layout-narrow #contentnav{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-narrow #contentnav > :where(.me-auth-page,.ntt-legacy-form-shell,form.ntt-legacy-form){
  width:min(100%,760px);
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}
body.ntt-layout-narrow #contentnav > .me-auth-page{
  max-width:640px;
}

/* Theme-neutral width layer. Keep text/background ownership in the existing
   theme/module contracts so light/dark contrast cannot diverge here. */
@media(max-width:767px){
  body.ntt-layout-wide #contentnav,
  body.ntt-layout-narrow #contentnav{
    padding-left:8px;
    padding-right:8px;
  }
  body.ntt-layout-wide #contentnav > .row{
    margin-left:-8px;
    margin-right:-8px;
  }
}


/* v1195: remove remaining module-level desktop caps only when the route has
   already opted into ntt-layout-wide. These wrappers are data/list/workspace
   surfaces; focused forms remain under ntt-layout-narrow and are untouched. */
body.ntt-layout-wide :where(.ntt-html-page,.hd-modern-page,.ntt-flash-manage){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
  margin-left:0;
  margin-right:0;
}
body.ntt-layout-wide .ntt-html-page :where(.ntt-html-browser-layout,.ntt-html-add-room-browser-layout,.ntt-html-card),
body.ntt-layout-wide .hd-modern-page :where(.panel,.hd-item,.hd-thread-item),
body.ntt-layout-wide .ntt-flash-manage :where(.panel,.table-responsive){
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

/* v1201: AI normalize/repair/settings are multi-panel management workspaces.
   Route classification is explicit in header.php; remove only their desktop
   wrapper caps when that route opted into ntt-layout-wide. Theme/color ownership
   remains in each module stylesheet. */
body.ntt-layout-wide :where(.ai-normalize-wrap,.ai-repair-wrap,.ai-settings-wrap){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
  margin-left:0;
  margin-right:0;
}
body.ntt-layout-wide :where(.ai-normalize-layout,.ai-normalize-preview-shell,.ai-repair-preview,.ai-set-panel,.ai-set-provider-list){
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

/* v1202: batch account/member editors contain multiple permission matrices and
   room/member controls. When their actual CODE route opts into layout-wide, let
   each matrix consume the available content width; table-responsive continues to
   own horizontal overflow. Theme/color ownership stays in pages-modern/core-ui. */
body.ntt-layout-wide .ntt-batch-choice-box{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide .ntt-batch-choice-box :where(.table-responsive,.table){
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* v1203: legacy admin/member workspaces still had hard form/table caps in
   core-ui/handmade-forms. Only routes already classified as data-heavy wide
   workspaces are uncapped here; register/login/join/focused forms are untouched. */
body.ntt-layout-wide[data-code="dsadmin"] form.ntt-legacy-form,
body.ntt-layout-wide[data-code="addtvmn"] form.ntt-legacy-form,
body.ntt-layout-wide[data-code="addtvroom"] form.ntt-legacy-form,
body.ntt-layout-wide[data-code="addremoveoldusers"] form.ntt-legacy-form{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
  margin-left:0;
  margin-right:0;
}
body.ntt-layout-wide[data-code="addtvmn"] form.ntt-legacy-form .ntt-form-grid-table,
body.ntt-layout-wide[data-code="addtvroom"] #myTK form.ntt-legacy-form .ntt-form-grid-table,
body.ntt-layout-wide[data-code="addremoveoldusers"] form.ntt-legacy-form .ntt-form-grid-table{
  width:100% !important;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}


/* v1204: quiz exam is a multi-question navigator/workspace. The exam-mode
   header already removes the normal sidebar chrome; do not leave a 1480/1500px
   desktop cap inside a wider viewport. Component/navigator responsive rules
   continue to own overflow and breakpoints; this width layer adds no colors. */
body.ntt-layout-wide.ntt-quiz-exam-mode .quiz-exam-shell,
body.ntt-layout-wide.code-tn_lambai .quiz-exam-shell{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* v1206: ranking/member directories are wide data surfaces. Keep their panel
   and live-table hosts shrink-safe/full-width; table-responsive remains the
   horizontal-overflow owner. No theme/color ownership is introduced here. */
body.ntt-layout-wide[data-code="rankweb"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dstvall"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dstvolall"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstvolall),
body.ntt-layout-wide[data-code="dstvonline"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstvonline){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="rankweb"] #data-dstv > table,
body.ntt-layout-wide[data-code="dstvall"] #data-dstv > table,
body.ntt-layout-wide[data-code="dstvolall"] #data-dstvolall > table,
body.ntt-layout-wide[data-code="dstvonline"] #data-dstvonline > table{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* v1207: document administration/library pages contain a room-by-document matrix
   and nested management tree. Their routes are already wide; make the real data
   hosts consume the viewport while keeping horizontal overflow inside .tl-grid.
   No colors/theme ownership and no focused-form/global-container override. */
body.ntt-layout-wide[data-code="dstailieu"] :where(.panel,.panel-body,.tl-grid),
body.ntt-layout-wide[data-code="dstailieuall"] :where(.panel,.panel-body,.tl-grid),
body.ntt-layout-wide[data-code="dstailieupl"] :where(.panel,.panel-body,.tl-grid),
body.ntt-layout-wide[data-code="qltailieu"] :where(#qltailieuAsyncPanel,#qltailieuAsyncPanel>.panel-body){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dstailieu"] .tl-grid,
body.ntt-layout-wide[data-code="dstailieuall"] .tl-grid,
body.ntt-layout-wide[data-code="dstailieupl"] .tl-grid{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="dstailieu"] .tl-grid>table,
body.ntt-layout-wide[data-code="dstailieuall"] .tl-grid>table,
body.ntt-layout-wide[data-code="dstailieupl"] .tl-grid>table{
  width:max-content;
  min-width:100%;
  max-width:none;
}

/* v1208: room-member/pending/created-account/active-exam/admin-room lists are
   multi-row management surfaces. Their CODE routes already opt into layout-wide;
   make the real panel/live hosts consume the content viewport while keeping table
   overflow inside .table-responsive. No theme/color or form contract changes. */
body.ntt-layout-wide[data-code="dstv"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dstvcho"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dstktao"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dsthiall"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dstv),
body.ntt-layout-wide[data-code="dsroomadmin"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsroomadmin){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dstv"] #data-dstv > table,
body.ntt-layout-wide[data-code="dstvcho"] #data-dstv > table,
body.ntt-layout-wide[data-code="dstktao"] #data-dstv > table,
body.ntt-layout-wide[data-code="dsthiall"] #data-dstv > table,
body.ntt-layout-wide[data-code="dsroomadmin"] #data-dsroomadmin > table{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}



/* v1209: room directories/exam-room administration and submission-history pages
   are multi-row/table workspaces. Their ds/ls CODE routes already classify as
   layout-wide; make the concrete live/table hosts consume the viewport while
   retaining .table-responsive as the horizontal-overflow owner. */
body.ntt-layout-wide[data-code="dsroom"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsroom),
body.ntt-layout-wide[data-code="dsrthiad"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsrthiad),
body.ntt-layout-wide[data-code="lsnball"] :where(.panel,.list-group.scrolllist,.panel-body,#data-lsnball),
body.ntt-layout-wide[data-code="lsnbr"] :where(.panel,.list-group.scrolllist,.panel-body,#data-lsnbr){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dsroom"] #data-dsroom > table,
body.ntt-layout-wide[data-code="dsrthiad"] #data-dsrthiad > table,
body.ntt-layout-wide[data-code="lsnball"] #data-lsnball > table,
body.ntt-layout-wide[data-code="lsnbr"] #data-lsnbr > table{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* v1210: delegated/created/owned room administration are multi-row management workspaces. */
body.ntt-layout-wide[data-code="dsroomql"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsroomql),
body.ntt-layout-wide[data-code="dsroomdt"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsroomdt),
body.ntt-layout-wide[data-code="dsroomlc"] :where(.panel,.list-group.scrolllist,.panel-body,#data-dsroomlc){
  width:100%;
  max-width:none;
  min-width:0;
}
body.ntt-layout-wide[data-code="dsroomql"] :where(.table-responsive,#data-dsroomql),
body.ntt-layout-wide[data-code="dsroomdt"] :where(.table-responsive,#data-dsroomdt),
body.ntt-layout-wide[data-code="dsroomlc"] :where(.table-responsive,#data-dsroomlc){
  max-width:100%;
  min-width:0;
  overflow-x:auto;
}
body.ntt-layout-wide[data-code="dsroomql"] #data-dsroomql > table,
body.ntt-layout-wide[data-code="dsroomdt"] #data-dsroomdt > table,
body.ntt-layout-wide[data-code="dsroomlc"] #data-dsroomlc > table{
  max-width:none;
}

/* v1211: submission-history/statistics pages are wide multi-column workspaces.
   Keep their panel/list/data hosts shrink-safe and let table-responsive own
   horizontal overflow. No theme/color ownership or focused-form override. */
body.ntt-layout-wide[data-code="lsnballmu"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive),
body.ntt-layout-wide[data-code="lsnbhd"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive),
body.ntt-layout-wide[data-code="lsnbhoi"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive),
body.ntt-layout-wide[data-code="lsnbbaiall"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive),
body.ntt-layout-wide[data-code="tklsnbw"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-tklsnbw),
body.ntt-layout-wide[data-code="tklsnbr"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-tklsnbr){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="lsnballmu"] .table-responsive,
body.ntt-layout-wide[data-code="lsnbhd"] .table-responsive,
body.ntt-layout-wide[data-code="lsnbhoi"] .table-responsive,
body.ntt-layout-wide[data-code="lsnbbaiall"] .table-responsive,
body.ntt-layout-wide[data-code="tklsnbw"] .table-responsive,
body.ntt-layout-wide[data-code="tklsnbr"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}

/* v1212: per-room/per-member/per-problem history tables are multi-column
   workspaces. Keep live/data hosts shrink-safe and full-width; horizontal
   overflow remains owned by .table-responsive. No theme/form contract change. */
body.ntt-layout-wide[data-code="lsnbrbai"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-lstvnbr),
body.ntt-layout-wide[data-code="lstvnbr"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-lstvnbr),
body.ntt-layout-wide[data-code="lstvnbrbai"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-lstvnbr),
body.ntt-layout-wide[data-code="lsnbrat"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-lsnbrat){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="lsnbrbai"] .table-responsive,
body.ntt-layout-wide[data-code="lstvnbr"] .table-responsive,
body.ntt-layout-wide[data-code="lstvnbrbai"] .table-responsive,
body.ntt-layout-wide[data-code="lsnbrat"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}

/* v1215: problem-in-room setup and direct document-sharing matrices are
   multi-object management workspaces. Keep the real panel/data hosts full-width
   and shrink-safe; their table-responsive containers own horizontal overflow.
   cstl is explicitly classified wide in header.php. No theme/color/form change. */
body.ntt-layout-wide[data-code="dsbairoom"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-dsbairoom),
body.ntt-layout-wide[data-code="cstl"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-rank){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dsbairoom"] .table-responsive,
body.ntt-layout-wide[data-code="cstl"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="dsbairoom"] #data-dsbairoom > table,
body.ntt-layout-wide[data-code="cstl"] #data-rank > table{
  width:max-content;
  min-width:100%;
  max-width:none;
  box-sizing:border-box;
}

/* v1216: global/user problem management, direct problem sharing, per-member
   problem history and web-admin catalogs are data-heavy list/matrix surfaces.
   Keep the actual panel/data hosts full-width and shrink-safe; horizontal
   overflow belongs to the table component, not the page. csb is explicitly
   classified wide in header.php. No permission/theme/focused-form change. */
body.ntt-layout-wide[data-code="dsbaiweb"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-dsbaiweb),
body.ntt-layout-wide[data-code="dsbaics"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-dsbaics),
body.ntt-layout-wide[data-code="csb"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-rank),
body.ntt-layout-wide[data-code="lstvnballbai"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-lstvnballbai),
body.ntt-layout-wide[data-code="dsloaibai"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search),
body.ntt-layout-wide[data-code="dsnn"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dsbaiweb"] .table-responsive,
body.ntt-layout-wide[data-code="dsbaics"] .table-responsive,
body.ntt-layout-wide[data-code="csb"] .table-responsive,
body.ntt-layout-wide[data-code="lstvnballbai"] .table-responsive,
body.ntt-layout-wide[data-code="dsloaibai"] .table-responsive,
body.ntt-layout-wide[data-code="dsnn"] .table-responsive{
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="dsbaiweb"] #data-dsbaiweb > table,
body.ntt-layout-wide[data-code="dsbaics"] #data-dsbaics > table,
body.ntt-layout-wide[data-code="csb"] #data-rank > table,
body.ntt-layout-wide[data-code="lstvnballbai"] #data-lstvnballbai > table{
  width:max-content;
  min-width:100%;
  max-width:none;
  box-sizing:border-box;
}

/* v1217: global member submission/run-history pages are live multi-column lists.
   Their CODE routes already opt into layout-wide; make both search and live-table
   hosts consume the available viewport while table-responsive owns overflow. */
body.ntt-layout-wide[data-code="lstvnball"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-lstvnball),
body.ntt-layout-wide[data-code="lstvrunall"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-lstvrunall){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="lstvnball"] .table-responsive,
body.ntt-layout-wide[data-code="lstvrunall"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="lstvnball"] #data-lstvnball > table,
body.ntt-layout-wide[data-code="lstvrunall"] #data-lstvrunall > table{
  width:max-content;
  min-width:100%;
  max-width:none;
  box-sizing:border-box;
}



/* v1218: actual Q&A routes are CODE=hoi/traloi (not only hoidap). The modern
   Q&A shell is a discussion workspace and should consume the content viewport. */
body.ntt-layout-wide[data-code="hoi"] .hd-modern-page,
body.ntt-layout-wide[data-code="traloi"] .hd-modern-page{
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="hoi"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive),
body.ntt-layout-wide[data-code="traloi"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive){
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="hoi"] .table-responsive,
body.ntt-layout-wide[data-code="traloi"] .table-responsive{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

/* v1218: grading queues are live multi-column workspaces. The page and live
   host use the full content width while .table-responsive owns horizontal
   overflow. No global container or focused-form width is changed. */
body.ntt-layout-wide[data-code="ccham"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-dschocham),
body.ntt-layout-wide[data-code="cchamd"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-dschocham),
body.ntt-layout-wide[data-code="cchamus"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-dschocham),
body.ntt-layout-wide[data-code="cchamusd"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-dschocham){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="ccham"] .table-responsive,
body.ntt-layout-wide[data-code="cchamd"] .table-responsive,
body.ntt-layout-wide[data-code="cchamus"] .table-responsive,
body.ntt-layout-wide[data-code="cchamusd"] .table-responsive{
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="ccham"] #data-dschocham > table,
body.ntt-layout-wide[data-code="cchamd"] #data-dschocham > table,
body.ntt-layout-wide[data-code="cchamus"] #data-dschocham > table,
body.ntt-layout-wide[data-code="cchamusd"] #data-dschocham > table{
  width:max-content;
  min-width:100%;
  max-width:none;
}

/* v1219: room/admin live-management surfaces already opt into layout-wide via
   their actual CODE values (dsadmin/dsip/dsqtweb/addtvmn). Keep the panel and
   live hosts shrink-safe; wide tables scroll inside the component, not the body. */
body.ntt-layout-wide[data-code="dsadmin"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-addchuphong,#data-dsadmin),
body.ntt-layout-wide[data-code="dsip"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-addip,#data-dsip),
body.ntt-layout-wide[data-code="dsqtweb"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-dsqtweb),
body.ntt-layout-wide[data-code="addtvmn"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-addtvmn){
  width:100%;
  max-width:none;
  min-width:0;
}
body.ntt-layout-wide[data-code="dsadmin"] .table-responsive,
body.ntt-layout-wide[data-code="dsip"] .table-responsive,
body.ntt-layout-wide[data-code="dsqtweb"] .table-responsive,
body.ntt-layout-wide[data-code="addtvmn"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
}
body.ntt-layout-wide[data-code="dsadmin"] :where(#data-addchuphong,#data-dsadmin) > table,
body.ntt-layout-wide[data-code="dsip"] :where(#data-addip,#data-dsip) > table,
body.ntt-layout-wide[data-code="dsqtweb"] #data-dsqtweb > table,
body.ntt-layout-wide[data-code="addtvmn"] #data-addtvmn > table{
  width:max-content;
  min-width:100%;
}

/* v1361: AI guide/sample generator is also a multi-panel asset/history workspace.
   Its explicit aibaigen route now opts into layout-wide; keep table overflow owned
   by .table-responsive and do not widen focused auth/forms globally. */
body.ntt-layout-wide[data-code="aibaigen"] .ai-bai-wrap,
body.ntt-layout-wide[data-code="aibaigen"] .ai-bai-wrap > .panel,
body.ntt-layout-wide[data-code="aibaigen"] .ai-asset-history{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="aibaigen"] .ai-asset-history .table-responsive{
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

/* v1362: ConfigMenu is a multi-tab module/menu/role/reaction management workspace.
   The route explicitly opts into layout-wide; keep its fluid shell/panels shrink-safe
   and let .table-responsive own horizontal overflow. No focused-form/global rewrite. */
body.ntt-layout-wide[data-code="configmenu"] #contentnav > .container-fluid,
body.ntt-layout-wide[data-code="configmenu"] #contentnav > .container-fluid > .panel,
body.ntt-layout-wide[data-code="configmenu"] #contentnav > .container-fluid > .panel > .panel-body,
body.ntt-layout-wide[data-code="configmenu"] .cm-visual-editor-panel{
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="configmenu"] .table-responsive{
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
/* v1363: setcsbr renders searchable problem/member matrices and a wide per-user
   sharing/lock table. The route explicitly opts into layout-wide; keep its panels
   shrink-safe and let the existing responsive table hosts own horizontal overflow. */
body.ntt-layout-wide[data-code="setcsbr"] :where(#myTK,.panel,.panel-body,#data-search,#data-rank){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="setcsbr"] :where(#data-search.table-responsive,#data-rank.table-responsive){
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="setcsbr"] :where(#data-search,#data-rank) > table{
  min-width:100%;
  max-width:none;
}

/* v1364: setallroom/setroomcp are bulk room-setting matrices. Both routes
   explicitly opt into layout-wide; panels/search/results consume the real
   content viewport while existing table-responsive hosts own horizontal scroll. */
body.ntt-layout-wide[data-code="setallroom"] :where(#myTK,.panel,.panel-body,#data-search,#data-setallroom),
body.ntt-layout-wide[data-code="setroomcp"] :where(#myTK,.panel,.panel-body,#data-search,#data-setroomcp){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="setallroom"] .table-responsive,
body.ntt-layout-wide[data-code="setroomcp"] .table-responsive{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="setallroom"] :where(#data-search,#data-setallroom) > table,
body.ntt-layout-wide[data-code="setroomcp"] :where(#data-search,#data-setroomcp) > table{
  min-width:100%;
  max-width:none;
}

/* v1365: xoatv is the account lifecycle/history workspace. Its normal,
   deleted-account and snapshot-history views can contain wide administrative
   tables; consume the content viewport while table-responsive owns overflow. */
body.ntt-layout-wide[data-code="xoatv"] :where(.panel,.panel-body,.table-responsive){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="xoatv"] .table-responsive{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="xoatv"] .table-responsive > table{
  min-width:100%;
  max-width:none;
}

/* v1366: room-copy pages combine searchable/selectable source collections,
   destination-room lists and result tables. Let both workspaces use the full
   content viewport while their own responsive/scroller components own overflow. */
body.ntt-layout-wide[data-code="saochepbairoom"] :where(.br-copy-page,.br-copy-page > .panel-body,.br-copy-layout,.br-copy-box),
body.ntt-layout-wide[data-code="saocheptailieuroom"] :where(.tl-copy-page,.tl-copy-page > .panel-body,.tl-copy-layout,.tl-copy-box){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="saochepbairoom"] .table-responsive,
body.ntt-layout-wide[data-code="saocheptailieuroom"] .table-responsive{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="saochepbairoom"] :where(.br-copy-layout,.br-copy-box,.br-copy-scroll),
body.ntt-layout-wide[data-code="saocheptailieuroom"] :where(.tl-copy-layout,.tl-copy-box,.tl-copy-scroll){
  min-width:0;
}

/* v1367: suarweb is a bulk multi-room edit/search matrix. Let its search and
   editable result workspaces consume the full content viewport while the
   existing table-responsive wrappers remain the horizontal-overflow owners. */
body.ntt-layout-wide[data-code="suarweb"] :where(#myTK,.panel,.panel-body,.table-responsive,#data-search,#data-suarweb){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="suarweb"] .table-responsive{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="suarweb"] #data-search > table,
body.ntt-layout-wide[data-code="suarweb"] #data-suarweb table{
  min-width:100%;
  max-width:none;
}

/* v1368: ipthi is a searchable/sortable/paged inline-edit exam-IP workspace.
   Let the page/panel/table use the full content viewport while the existing
   .table-responsive wrapper remains the horizontal-overflow owner. */
body.ntt-layout-wide[data-code="ipthi"] :where(.ipthi-page,.ipthi-shell,.ipthi-shell > .panel-body,.ipthi-searchbar,.ipthi-toolbar,.ipthi-table-wrap){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="ipthi"] .ipthi-table-wrap.table-responsive{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="ipthi"] .ipthi-table-wrap > table{
  min-width:100%;
  max-width:none;
}

/* v1386: admincp is a long multi-section room settings workspace covering
   scoring, rank, room access, exam behavior and HTML/SQL/Quiz visibility.
   Let the panel/form consume the real content viewport while the existing
   .table-responsive wrapper owns horizontal overflow. Focused auth forms are
   untouched and this width layer owns no colors. */
body.ntt-layout-wide[data-code="admincp"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-admincp,#data-admincp > form){
  width:100%;
  max-width:none !important;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="admincp"] .table-responsive{
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="admincp"] #data-admincp > form > table{
  width:100% !important;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}

/* v1387: xemcode is a web-admin member/submission-file review workspace.
   The route already keeps file/path authorization in PHP; this width layer only
   removes the normal content cap and keeps long member/file selectors shrink-safe. */
body.ntt-layout-wide[data-code="xemcode"] :where(.panel,.panel-body,form){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="xemcode"] :where(select#chontv,select#chonbai){
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* v1391: dsbairus is the high-traffic room problem/submission workspace.
   The ds* route is already classified wide; make its real search/live-table
   hosts explicitly full-width and keep oversized columns inside the component
   scroller rather than the page body. No focused-form or theme change. */
body.ntt-layout-wide[data-code="dsbairus"] :where(.panel,.list-group.scrolllist,.panel-body,.table-responsive,#data-search,#data-dsbairus){
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}
body.ntt-layout-wide[data-code="dsbairus"] .table-responsive{
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.ntt-layout-wide[data-code="dsbairus"] #data-search > table,
body.ntt-layout-wide[data-code="dsbairus"] #data-dsbairus > table{
  width:max-content;
  min-width:100%;
  max-width:none;
  box-sizing:border-box;
}