/* UzQuiz R26 – desktop compact layout WITHOUT newly introduced inner scrollbars.
   Add after R24 and R25. Preserve the 1180px container, colors and functional JS.
   Exception: the explicitly requested 10-row "Hozir saytda" user list retains its scroll.
   Truly long data naturally extends the document vertically; it is never clipped.
*/
:root { --uq-standard-width:1180px; --container:1180px; --uq-gap:clamp(9px,1vw,16px); }

/* Never let an inner grid's intrinsic width stretch its 1180px parent. */
.container, .quiz-main, .admin-page-wrap, .live-host-main,
.container :is(.card,.admin-content,.admin-section,.editor-grid,.dashboard-hero,.report-layout,.live-host-grid,.results-hero,.archive-toolbar),
.container :is(.admin-layout,.admin-table-card,.results-table-card,.table-wrap) {
  min-width:0;
  max-width:100%;
}
.container :is(.card,.editor-grid,.dashboard-hero,.report-layout,.live-host-grid,.results-hero,.admin-layout) > * { min-width:0; }
.container :is(h1,h2,h3,h4,p,small,strong,.btn,.form-group,.session-code-card) { overflow-wrap:anywhere; }
.container :is(img,video,canvas,svg) { max-width:100%; }

/* R25 forced scrollbars into ordinary tables. Use wrapped cells and responsive
   column sizing instead. Long tables may extend the *page* vertically. */
:is(.table-wrap,.admin-table-wrap,.archive-table-wrap,.report-table-wrap,.results-table-card .table-wrap) {
  overflow:visible;
  max-height:none;
  min-width:0;
  width:100%;
}
:is(.admin-table,.results-table,.archive-participant-table,.latest-session-ranking-table) {
  width:100%;
  min-width:0;
  max-width:100%;
  table-layout:fixed;
}
:is(.admin-table,.results-table,.archive-participant-table,.latest-session-ranking-table) :is(th,td) {
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  min-width:0;
  padding:clamp(5px,.55vw,9px);
  font-size:13px;
}

/* R25 modal contents should be allowed to wrap and grow; no nested body scroll. */
.modal-backdrop :is(.modal-card,.share-modal,.participant-report-modal,.admin-confirm,.quiz-modal),
.admin-confirm-backdrop .admin-confirm {
  max-width:min(960px,calc(100vw - 28px));
  max-height:none;
}
.participant-report-modal .participant-modal-body,
.modal-backdrop :is(.modal-body,.modal-content) {
  max-height:none;
  overflow:visible;
}
/* Allow the overlay itself to move only if a very large user-generated modal
   exceeds the viewport. No inaccessible footer or masked content. */
.modal-backdrop,.admin-confirm-backdrop { overflow-y:auto; }

/* Desktop: shorten excess padding rather than cutting cards or scrolling them. */
@media (min-width:961px) {
  .page, .admin-page-wrap { padding-top:clamp(12px,1.2vh,20px); }
  .container :is(.dashboard-hero,.editor-hero,.results-hero,.archive-hero,.report-hero) {
    gap:var(--uq-gap);
  }
  .container :is(.stats-grid,.quiz-grid,.editor-grid,.editor-import-grid,.report-layout,.admin-dashboard-grid,.admin-kpi-grid) {
    gap:var(--uq-gap);
  }
  .container :is(.dashboard-hero-actions,.hero-actions,.editor-hero-actions,.latest-session-actions,.admin-toolbar,.archive-toolbar,.live-host-controls) {
    gap:8px;
    flex-wrap:wrap;
  }
  .admin-page .admin-layout { grid-template-columns:minmax(185px,220px) minmax(0,1fr); gap:var(--uq-gap); }
  .admin-page .admin-sidebar { min-width:0; }
  .admin-page .admin-panel,.admin-page .admin-table-card { padding:clamp(12px,1.2vw,18px); }
  .admin-page :is(.admin-kpi-grid,.admin-system-grid) { grid-template-columns: repeat(auto-fit,minmax(min(100%,170px),1fr)); }
  .editor-page :is(.form-grid,.editor-grid) > *, .admin-page :is(.admin-table-wrap,.admin-search) { min-width:0; }
}

/* Real, no-scroll compact live-host design. Stage and two side panels are
   contained by the 1180px grid, with no fixed card height or inner scrollbar. */
.live-host-page .live-host-hero { height:auto !important; max-height:none !important; overflow:visible; }
.live-host-page .live-host-hero > :first-child { max-height:none !important; overflow:visible !important; }
.live-host-page .live-stage-panel { height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; position:static; }
.live-host-page .host-stage-state { height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; }
.live-host-page .live-share-panel,.live-host-page .participant-panel { height:auto; max-height:none !important; overflow:visible !important; }
.live-host-page .participant-list { height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; }
.live-host-page .host-option-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.live-host-page :is(.host-option,.live-host-controls .btn,.participant-item) { min-width:0; overflow-wrap:anywhere; }
.live-host-page .live-host-controls { margin-top:0; }

@media (min-width:961px) {
  .live-host-page .live-host-main.container { padding-top:10px; padding-bottom:14px; }
  .live-host-page .live-host-main .back-link { margin-bottom:6px; }
  .live-host-page .live-host-hero { padding:10px 15px; gap:10px; }
  .live-host-page .live-host-hero h1 { font-size:clamp(21px,2.2vw,28px); line-height:1.12; margin:3px 0; }
  .live-host-page .live-host-hero p { font-size:13px; line-height:1.3; }
  .live-host-page .live-host-badges { margin-top:5px; gap:4px; }
  .live-host-page .session-code-card { padding:7px 10px; flex-basis:200px; }
  .live-host-page .session-code-card strong { font-size:24px; line-height:1.1; margin:2px 0; }
  .live-host-page .session-code-card small { font-size:13px; }
  .live-host-page .live-host-grid {
    margin-top:8px;
    gap:8px 10px;
    grid-template-columns:minmax(0,1fr) minmax(248px,280px);
    grid-template-areas:'stage share' 'stage participants';
    align-items:start;
  }
  .live-host-page .live-host-grid > .card { padding:10px 12px; }
  .live-host-page .live-stage-panel { grid-area:stage; display:flex; flex-direction:column; gap:6px; }
  .live-host-page .live-stage-head { margin-bottom:3px; gap:8px; }
  .live-host-page .live-stage-head h2 { font-size:clamp(16px,1.5vw,19px); }
  .live-host-page .live-answer-progress { padding:4px 7px; flex-basis:55px; border-radius:10px; }
  .live-host-page .live-answer-progress span { font-size:21px; }
  .live-host-page .host-stage-state { padding:4px; justify-content:center; }
  .live-host-page .host-stage-state#hostLobbyStage { min-height:clamp(120px,20dvh,220px) !important; }
  .live-host-page .host-stage-state .live-pulse-icon { margin:3px auto; }
  .live-host-page .host-stage-state :is(h2,h3) { margin-block:5px; line-height:1.2; }
  .live-host-page .host-option-grid { gap:6px; margin-top:6px; }
  .live-host-page .host-option { padding:7px 9px; min-height:45px; border-radius:10px; }
  .live-host-page .host-option > span { width:29px; height:29px; flex-basis:29px; }
  .live-host-page .live-host-controls { padding-top:7px; gap:6px; }
  .live-host-page .live-host-controls .btn { flex:1 1 145px; min-height:34px; padding:7px 10px; font-size:13px; }
  .live-host-page .live-share-panel {
    grid-area:share;
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    grid-template-rows:auto auto auto;
    align-items:center;
    gap:4px 8px;
  }
  .live-host-page .live-share-panel > .section-head { grid-column:1/-1; grid-row:1; margin:0; }
  .live-host-page .live-share-panel .section-head h2 { font-size:16px; line-height:1.18; }
  .live-host-page .host-qr-frame { grid-column:1; grid-row:2/4; width:82px; margin:0; padding:4px; }
  .live-host-page .live-share-panel > .form-group { grid-column:2; grid-row:2; margin:0; gap:2px; min-width:0; }
  .live-host-page .share-link-box { margin:0; gap:4px; display:flex; flex-direction:column; }
  .live-host-page .share-link-box :is(.input,.btn) { min-width:0; width:100%; min-height:30px; padding:5px 7px; font-size:13px; }
  .live-host-page .live-share-panel > .btn { grid-column:2; grid-row:3; width:100%; min-height:32px; margin:0; padding:5px 7px; font-size:13px; }
  .live-host-page .participant-panel { grid-area:participants; }
  .live-host-page .participant-panel-head { margin-bottom:5px; }
  .live-host-page .participant-panel-head h2 { font-size:16px; }
  .live-host-page .participant-total { width:32px; height:32px; font-size:17px; }
  .live-host-page .participant-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:0; }
  .live-host-page .empty-participants { min-height:70px; padding:4px; grid-column:1/-1; }
  .live-host-page .empty-participants span { font-size:22px; }
  .live-host-page .empty-participants p { font-size:13px; margin:3px; }
  .live-host-page .participant-item { display:grid; grid-template-columns:20px 28px minmax(0,1fr); gap:4px; padding:6px; }
  .live-host-page .participant-avatar { width:28px; height:28px; font-size:13px; }
  .live-host-page .participant-item .participant-score { grid-column:3; text-align:left; }
  .live-host-page .participant-info small,.live-host-page .participant-score small { font-size:13px; }
}
@media (min-width:961px) and (max-height:760px) {
 .live-host-page .live-host-hero { padding-block:7px; }
 .live-host-page .live-host-hero h1 { font-size:22px; }
 .live-host-page .live-host-main.container { padding-top:7px; }
 .live-host-page .host-stage-state#hostLobbyStage { min-height:110px !important; }
 .live-host-page .live-host-grid > .card { padding:8px 10px; }
 .live-host-page .live-host-controls .btn { min-height:30px; padding:5px 9px; }
}
@media (max-width:960px) {
 .live-host-page .live-host-grid { display:grid; grid-template-columns:minmax(0,1fr); grid-template-areas:'stage' 'share' 'participants'; }
 .live-host-page .live-host-grid > * { grid-column:auto; }
 .live-host-page .live-share-panel { display:block; }
 .live-host-page .host-qr-frame { width:min(155px,100%); }
 .live-host-page .participant-list { grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); }
 .live-host-page .live-stage-panel { display:flex; flex-direction:column; }
 .live-host-page .host-stage-state#hostLobbyStage { min-height:145px !important; }
}
@media (max-width:620px) {
 .live-host-page .host-option-grid { grid-template-columns:minmax(0,1fr); }
 .live-host-page .live-host-controls .btn { flex:1 1 100%; }
}

/* Results pages used to force a 1260px table width through a more specific rule.
   Do not let ranking tables widen the desktop layout or require side-scrolling. */
.results-table-card table,
.results-table-card :is(.latest-session-ranking-table,.results-table) {
  min-width:0 !important;
  max-width:100% !important;
  width:100%;
  table-layout:fixed;
}
.results-table-card table :is(th,td) {
  min-width:0 !important;
  white-space:normal !important;
  overflow-wrap:anywhere;
  padding:clamp(5px,.55vw,9px);
}
.results-table-card .compact-person { min-width:0; overflow-wrap:anywhere; }

/* On narrower desktop/tablet/mobile, reflow ranking rows into readable cards.
   This preserves every field and needs no horizontal/inner scrollbar. */
@media (max-width:1100px) {
  .results-table-card table,.results-table-card table tbody { display:block; width:100%; }
  .results-table-card table thead { display:none; }
  .results-table-card table tbody tr {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:start;
    gap:5px 8px;
    width:100%;
    margin-bottom:9px;
    padding:9px;
    border:1px solid var(--border,rgba(100,125,170,.2));
    border-radius:12px;
  }
  .results-table-card table tbody td {
    display:block;
    width:auto !important;
    max-width:100%;
    padding:4px !important;
    border:0;
    text-align:left !important;
    min-width:0 !important;
  }
  .results-table-card table tbody td:nth-child(2) { grid-column:span 2; }
  .results-table-card table tbody td:nth-child(7) { grid-column:span 2; }
  .results-table-card table tbody td[colspan] { grid-column:1/-1; }
  .results-table-card table tbody td:not([colspan])::before {
    display:block;
    color:var(--muted,#7488a1);
    font-weight:600;
    font-size:13px;
    margin-bottom:3px;
  }
  .results-table-card table tbody td:nth-child(1)::before { content:'O‘rin'; }
  .results-table-card table tbody td:nth-child(2)::before { content:'Ishtirokchi'; }
  .results-table-card table tbody td:nth-child(3)::before { content:'Ball'; }
  .results-table-card table tbody td:nth-child(4)::before { content:'To‘g‘ri'; }
  .results-table-card table tbody td:nth-child(5)::before { content:'Javob bergan'; }
  .results-table-card table tbody td:nth-child(6)::before { content:'Tezkorlik'; }
  .results-table-card table tbody td:nth-child(7)::before { content:'Batafsil'; }
}
@media (max-width:620px) {
  .results-table-card table tbody tr { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .results-table-card table tbody td:nth-child(2) { grid-column:span 1; }
  .results-table-card table tbody td:nth-child(7) { grid-column:1/-1; }
}
/* Share action text may wrap to two lines instead of being clipped. */
@media (min-width:961px) {
  .live-host-page .live-share-panel > .btn,
  .live-host-page .share-link-box .btn {
    white-space:normal;
    overflow-wrap:anywhere;
    text-align:center;
    line-height:1.25;
    height:auto;
    padding:6px 5px;
  }
}
/* R25 still inherited oversized 4rem question typography from the main quiz.
   Host question needs a desktop-sized title, not a fullscreen title. */
.live-host-page #hostQuestionStage .question-title,
.live-host-page #hostQuestionText {
  font-size:clamp(19px,1.8vw,25px);
  line-height:1.32;
  margin:8px 0;
  overflow-wrap:anywhere;
}
.live-host-page #hostQuestionStage .quiz-top { margin-bottom:6px; }
.live-host-page #hostQuestionStage .host-option { font-size:13px; line-height:1.35; }
.live-host-page .host-podium { min-height:clamp(140px,17vh,205px); }
/* A narrow 280px sidebar should never divide names into 40px slivers. */
@media (min-width:961px) {
  .live-host-page .participant-list { grid-template-columns:minmax(0,1fr); }
  .live-host-page .participant-item { grid-template-columns:20px 29px minmax(0,1fr); gap:5px; }
  .live-host-page .participant-info { line-height:1.28; overflow-wrap:anywhere; }
}
/* Reflow crowded navigation links instead of an R25 horizontal strip. */
@media (max-width:1050px) {
  .navbar-inner { flex-wrap:wrap; gap:7px 12px; padding-block:8px; }
  .app-nav-links { overflow-x:visible; flex-wrap:wrap; gap:6px 12px; }
  .nav-actions { flex-wrap:wrap; }
}
