/* فبركة v2.1.18 — تشغيل كامل للمضيف من الجوال دون شاشة خارجية. */
:root{--host-safe-bottom:max(12px,env(safe-area-inset-bottom));--host-safe-top:max(8px,env(safe-area-inset-top))}
html,body{max-inline-size:100%;overflow-x:hidden}
button,a,input,select,textarea{touch-action:manipulation}
@media (max-width:900px){
  button,.btn,.k-btn,.pill-btn,.q-toolbar-action{min-block-size:44px}
  #app,#qApp,#kApp{max-inline-size:100%;overflow-x:clip}
  .modal-card,.q-modal-card,.k-settings-dialog{max-block-size:calc(100dvh - var(--host-safe-top) - var(--host-safe-bottom));overflow:hidden}
  .modal-body,.q-modal-body,.settings-scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

  /* فبركها */
  body:not(.keyboard-open) .app-shell{min-block-size:100dvh}
  .setup-actions,.settings-actions,.host-action-bar,.host-toolbar{padding-block-end:var(--host-safe-bottom)}
  .setup-actions,.host-action-bar{position:sticky;inset-block-end:0;z-index:35;background:color-mix(in srgb,var(--surface,#170b28) 94%,transparent);backdrop-filter:blur(16px)}
  .host-toolbar,.host-action-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .host-toolbar>*:only-child,.host-action-buttons>*:only-child{grid-column:1/-1}
  .question-text,.answer-box,.result-answer-text,.player-name,.scoreboard-name{overflow-wrap:anywhere;word-break:normal}

  /* قدّها */
  #qApp{inline-size:100%;padding:12px max(8px,env(safe-area-inset-right)) calc(80px + var(--host-safe-bottom)) max(8px,env(safe-area-inset-left))}
  .q-nav{inline-size:calc(100% - 12px);inset-block-start:6px;margin-block-start:6px;border-radius:16px}
  .q-nav .q-brand small{display:none}
  .section-card{padding:16px;border-radius:20px}
  .setup-grid{grid-template-columns:1fr}
  .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .cat-card{min-block-size:142px;padding:10px}
  .cat-card h3{font-size:clamp(14px,4.2vw,17px);overflow-wrap:anywhere}
  .qadha-setup-actions{position:sticky!important;inset-block-end:0!important;z-index:45!important;display:grid!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;inline-size:calc(100% + 24px);margin-inline:-12px!important;padding:10px 12px var(--host-safe-bottom)!important}
  .qadha-setup-actions .btn{inline-size:100%;padding-inline:8px}
  .q-game-screen{inline-size:100%;max-inline-size:100%;min-block-size:100dvh;overflow:hidden}
  .q-game-toolbar{gap:5px;padding:6px max(6px,env(safe-area-inset-right)) 6px max(6px,env(safe-area-inset-left))}
  .q-toolbar-actions{gap:3px;min-inline-size:0}
  .q-toolbar-action{padding:5px 7px!important;min-inline-size:42px}
  .q-toolbar-action b{display:none}
  .q-board-brand{min-inline-size:0;text-align:center}
  .q-board-brand span{max-inline-size:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .premium-turn-pill{min-inline-size:0;max-inline-size:34vw;padding-inline:8px}
  .premium-turn-pill strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .qadha-reference-grid{min-inline-size:0;overflow:auto hidden!important;overscroll-behavior:contain}
  .qadha-reference-footer{padding-block-end:var(--host-safe-bottom)!important}
  .q-question-content-scroll{padding-inline:10px!important;overflow:auto!important;overscroll-behavior:contain}
  .question-text,.answer-box,.order-question-text{font-size:clamp(22px,6vw,38px)!important;line-height:1.45!important;overflow-wrap:anywhere}
  .q-question-control-dock{position:sticky!important;inset-block-end:0!important;z-index:40;max-inline-size:100%;padding-block-end:var(--host-safe-bottom)!important}
  .q-question-actions,.q-timer-buttons{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important}
  .q-question-actions .btn,.q-timer-buttons .btn{inline-size:100%;padding-inline:7px;font-size:clamp(12px,3.6vw,15px)}
  .order-list,.order-results,.winner-buttons{max-inline-size:100%;overflow:hidden}
  .order-item,.order-result-row{min-inline-size:0;overflow-wrap:anywhere;white-space:normal!important}
  .drawing-host-special,.charades-host-special,.performance-question-shell{max-inline-size:100%;overflow:auto;overscroll-behavior:contain}

  /* خلّطها */
  #kApp{inline-size:100%;padding-inline:max(8px,env(safe-area-inset-left)) max(8px,env(safe-area-inset-right));padding-block-end:calc(72px + var(--host-safe-bottom))}
  .k-setup-shell,.lobby-shell,.game-shell,.results-shell,.finale{max-inline-size:100%;margin-inline:auto}
  .setup-panel{padding-block-end:8px}
  .setup-footer{position:sticky;inset-block-end:0;z-index:40;display:grid!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8px;margin-inline:-12px;padding:10px 12px var(--host-safe-bottom);background:color-mix(in srgb,var(--panel,#111827) 94%,transparent);backdrop-filter:blur(16px)}
  .setup-footer .k-btn{inline-size:100%;padding-inline:7px}
  .mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .mode-toggle{min-inline-size:0;padding:10px!important}
  .mode-toggle b,.mode-toggle small,.prompt-main h1,.result-answer-text{overflow-wrap:anywhere}
  .lobby-layout{grid-template-columns:1fr!important}
  .join-board{grid-template-columns:minmax(96px,34vw) minmax(0,1fr)!important;gap:10px!important}
  .room-code{font-size:clamp(28px,10vw,52px)!important;letter-spacing:.06em!important;overflow-wrap:anywhere}
  .game-shell{min-block-size:calc(100dvh - var(--host-safe-top));overflow:hidden}
  .host-stage-actions{position:sticky;inset-block-end:0;z-index:45;padding-block-end:var(--host-safe-bottom);background:color-mix(in srgb,var(--panel,#111827) 94%,transparent);backdrop-filter:blur(16px)}
  .host-stage-actions .host-action-buttons,.final-actions{display:grid!important;grid-template-columns:1fr!important}
  .result-row{min-inline-size:0;overflow:hidden}
  .result-row>div,.result-row .result-answer-text{min-inline-size:0;max-inline-size:100%;overflow-wrap:anywhere}
  .order-board,.order-compare{max-inline-size:100%;overflow:hidden}
  .order-card,.order-compare span{min-inline-size:0;white-space:normal!important;overflow-wrap:anywhere}
}
@media (max-width:430px){
  .category-grid{grid-template-columns:1fr 1fr}
  .qadha-setup-actions{grid-template-columns:1fr!important}
  .setup-footer{grid-template-columns:1fr}
  .qadha-setup-actions .btn,.setup-footer .k-btn{min-block-size:48px}
  .q-question-actions,.q-timer-buttons{grid-template-columns:1fr}
  .mode-grid{grid-template-columns:1fr 1fr!important}
  .join-board{grid-template-columns:1fr!important;text-align:center}
  .qr-frame{inline-size:min(210px,70vw);margin-inline:auto}

  /* قدّها — بطاقات الخيارات تقرأ كسطر عنوان ثم وصف، بلا تداخل. */
  body[data-game-brand="qadha"] #qApp :is(.qadha-setup-options,.help-setup-grid) .toggle-card{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-start!important;gap:6px 8px!important;min-block-size:72px!important;padding:12px!important}
  body[data-game-brand="qadha"] #qApp :is(.qadha-setup-options,.help-setup-grid) .toggle-card>input{flex:0 0 20px!important;margin:0!important}
  body[data-game-brand="qadha"] #qApp :is(.qadha-setup-options,.help-setup-grid) .toggle-card>span{flex:0 0 auto!important;line-height:1!important}
  body[data-game-brand="qadha"] #qApp :is(.qadha-setup-options,.help-setup-grid) .toggle-card>b{flex:1 1 130px!important;min-inline-size:0!important;line-height:1.3!important}
  body[data-game-brand="qadha"] #qApp :is(.qadha-setup-options,.help-setup-grid) .toggle-card>small{flex:1 0 100%!important;min-inline-size:0!important;margin:0!important;padding-inline-start:28px!important;line-height:1.45!important;font-size:13px!important}

  /* فبركها — وضوح الإعدادات العربية على الجوالات الضيقة. */
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal,.settings-toggle-stack,.settings-control-zone,.settings-danger-zone){min-inline-size:0;max-inline-size:100%}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.toggle-row,.settings-control-zone,.settings-danger-zone){flex-wrap:wrap!important;gap:8px 10px!important}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) .toggle-row>div,
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.settings-control-zone,.settings-danger-zone)>div{flex:1 1 190px!important;min-inline-size:0!important;max-inline-size:100%!important}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.toggle-row,.settings-control-zone,.settings-danger-zone) :is(strong,span,small,label),
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.segment,.btn,.category-preset){white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;line-height:1.45!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.switch,.vibration-settings-actions){flex:0 0 auto!important;margin-inline-start:auto!important}
}
@media (max-width:360px){
  /* فبركها */
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) .toggle-row>div,
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.settings-control-zone,.settings-danger-zone)>div{flex-basis:100%!important}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) :is(.settings-control-zone,.settings-danger-zone)>.btn{inline-size:100%!important}
  body[data-game-brand="fbrkha"] :is(.setup-card,.game-settings-modal) .segmented{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* قدّها — منع عنوان الإعداد من التكدس على 320px. */
  #qApp .q-setup-shell .page-title-row h1{font-size:clamp(30px,9.4vw,32px)!important;line-height:1.25!important;letter-spacing:0!important;word-break:normal!important;overflow-wrap:normal!important}

  /* خلّطها — ضع شرح القسم أسفل العنوان بدل سحق الكلمات. */
  #kApp .section-title{display:grid!important;grid-template-columns:1fr!important;align-items:start!important;gap:6px!important}
  #kApp .section-title>div{min-inline-size:0!important;max-inline-size:100%!important}
  #kApp .section-title h2{white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;line-height:1.3!important}
  #kApp .section-title>span{max-inline-size:100%!important;text-align:right!important;line-height:1.5!important}
}
@media (max-height:560px) and (orientation:landscape){
  #qApp,#kApp{padding-block-start:5px;padding-block-end:5px}
  .q-game-toolbar{min-block-size:44px}
  .qadha-reference-footer{max-block-size:78px!important}
  .q-question-control-dock{padding:5px!important}
  .q-question-content-scroll{padding-block:5px!important;overflow:auto!important;overscroll-behavior:contain}
  .question-text,.answer-box,.order-question-text{font-size:clamp(18px,4.8vh,30px)!important}
  .game-shell{gap:5px!important}
  .host-stage-actions{padding:6px!important}
}
