/* Mobile practice presentation. Independent simulator, not an official app skin. */
.mobile-service-header,.mobile-action-dock{display:none}
.keyboard-preview{display:none}
.number-digit{display:inline-block;width:25px;text-align:center;border-bottom:1px solid #bed0b0;margin-right:3px}
.practice-settings{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.practice-settings>summary{cursor:pointer;font-weight:600}.practice-settings>p{font-size:12px;color:var(--muted);margin:8px 0}.practice-settings .form-grid{margin-top:16px}
@media(max-width:650px){
 body[data-page="practice"]{--green:#1675d1;--ink:#263548;--muted:#6f7d8e;--line:#e5e9ef;background:#f3f5f8;color:var(--ink)}
 body[data-page="practice"] .sidebar,body[data-page="practice"] .topbar,body[data-page="practice"] footer{display:none}
 body[data-page="practice"] .main-wrap{padding-top:88px}
 body[data-page="practice"] main{padding:14px 12px 30px;min-height:calc(100dvh - 88px)}
 body[data-page="practice"] .heading-row{display:none}
 .mobile-service-header{display:block;position:fixed;top:0;left:0;right:0;z-index:30;background:#fff;border-bottom:1px solid #e5e9ef;padding:0 14px;box-shadow:0 1px 6px #173f3605}
 .mobile-service-header>div{height:50px;display:grid;grid-template-columns:60px 1fr 60px;align-items:center;text-align:center}
 .mobile-service-header strong{font-size:18px;font-weight:600}.mobile-service-header a,.mobile-service-header button{min-height:44px;display:flex;align-items:center;justify-content:flex-end;font-size:14px;background:none;border:0;padding:0;color:#3c648c}.mobile-service-header a:first-child{justify-content:flex-start;font-size:32px}
 .mobile-service-header p{font-size:11px;line-height:30px;color:#5d7188;text-align:left;border-top:1px solid #f3f5f8}.mobile-service-header p span{float:right;color:#788697}
 body[data-page="practice"] .panel{padding:18px 16px;border:1px solid #e5e9ef;border-radius:10px;box-shadow:none}
 body[data-page="practice"] .practice-layout{gap:12px}
 body[data-page="practice"] .progress-track{justify-content:center;font-size:12px;margin:0 0 14px;gap:8px;line-height:1.5}
 body[data-page="practice"] .progress-track i{width:15px;background:#cbd7e5}
 body[data-page="practice"] .progress-track .current{color:#1675d1}
 body[data-page="practice"] .field span,body[data-page="practice"] .checkbox,body[data-page="practice"] .rule-list li{font-size:14px;color:#566475}
 body[data-page="practice"] input,body[data-page="practice"] select{font-size:16px;min-height:46px;border-radius:6px}
 body[data-page="practice"] input[type="checkbox"],body[data-page="practice"] input[type="radio"]{min-height:0}
 body[data-page="practice"] .checkbox{align-items:flex-start;line-height:1.65;margin:16px 0}
 body[data-page="practice"] .checkbox input{width:19px;height:19px;margin-top:3px}
 body[data-page="practice"] .btn{min-height:46px;font-size:15px;border-radius:6px}
 body[data-page="practice"] .btn.primary:hover{background:#1168bc}
 body[data-page="practice"] .mode-option{background:#fff;border-color:#d8e1ec}
 body[data-page="practice"] .mode-option:has(input:checked){background:#eef6ff;border-color:#2380d8}
 body[data-page="practice"] .mode-option strong{font-size:14px}.mode-option small{font-size:11px}
 body[data-page="practice"] .notice{font-size:12px;line-height:1.7;margin:14px 0}
 body[data-page="practice"] .footnote{font-size:12px;color:#778597;line-height:1.7;margin-top:12px}
 body[data-page="practice"] .mock-details>div{display:flex;font-size:14px;gap:12px}.mock-details strong{margin:0}
 body[data-page="practice"] .inline-alert{font-size:13px}
 body[data-page="practice"] .source-note{font-size:11px}
 body[data-page="practice"] .practice-layout>.side-panel{background:#f8fafc}
 body[data-page="practice"]:not([data-phase="select"]) .practice-layout>.side-panel{display:none}
 body[data-page="practice"] #setup-form>button[type="submit"],body[data-page="practice"] #verify-button,body[data-page="practice"] [data-action="preflight-next"]{width:100%}
 body[data-page="practice"] .workflow-track{flex-wrap:nowrap;font-size:11px;gap:5px}
 body[data-page="practice"] .workflow-track i{width:8px;flex-shrink:0}
 body[data-phase="select"][data-page="practice"] main{padding:10px 10px 130px}
 body[data-phase="select"][data-page="practice"] .progress-track{display:none}
 body[data-phase="select"] .practice-layout>.panel:first-child{padding:0 12px 12px;overflow:hidden}
 body[data-phase="select"] .practice-layout>.panel:first-child>.session-toolbar:first-child{margin:0 -12px;display:block}
 body[data-phase="select"] .session-toolbar>.tag{display:block;text-align:center;border-radius:0;padding:3px;font-size:10px;background:#fff7e8;color:#977235}
 body[data-phase="select"] .tabs{width:100%;padding:0;gap:0;border-radius:0;background:#fff}
 body[data-phase="select"] .tabs button{width:50%;border-radius:0;min-height:48px;font-size:16px;border-bottom:2px solid transparent;color:#738295}
 body[data-phase="select"] .tabs button.active{box-shadow:none;border-color:#1675d1;color:#1675d1;font-weight:600}
 body[data-phase="select"] .session-stats{justify-content:space-around;gap:10px;margin:0 0 10px;padding:7px 0;font-size:12px;color:#738295}
 body[data-phase="select"] .session-stats b{font-size:18px;color:#1675d1}
 body[data-phase="select"] .session-toolbar{margin-bottom:6px;flex-wrap:nowrap;gap:4px}
 body[data-phase="select"] .session-toolbar h3{font-size:14px}
 body[data-phase="select"] .timer{font-size:12px;color:#738295}
 body[data-phase="select"] .timer b{font-size:22px;color:#e4862d;font-variant-numeric:tabular-nums}
 body[data-phase="select"] .timer.urgent{background:#fff0e9;border-radius:4px;padding:0 4px}.timer.urgent b{color:#d34236!important}
 body[data-phase="select"] .number-grid{gap:8px;margin:10px 0}
 body[data-phase="select"] .number-grid .plate{font-size:20px;line-height:1.2;min-height:44px;padding:7px 3px;border-radius:5px;font-weight:700}
 body[data-phase="select"] .plate.selected{outline:2px solid #1675d1;outline-offset:0}
 body[data-phase="select"] .number-grid+.checkbox{font-size:12px;margin:9px 0 2px;min-height:32px}
 body[data-phase="select"] .number-grid+.checkbox small{display:none}
 body[data-phase="select"] .actions.between,body[data-phase="select"] .actions.between+.footnote{display:none}
 body[data-phase="select"] .practice-layout>.side-panel{padding:12px;background:#fff}
 body[data-phase="select"] .side-panel .panel-title{margin:0;float:left;gap:8px}
 body[data-phase="select"] .side-panel h3{margin:0;font-size:14px}
 body[data-phase="select"] .side-panel>.timer{text-align:right;min-height:26px}
 body[data-phase="select"] .backup-list{clear:both;display:flex;gap:8px;overflow-x:auto;margin-top:8px;padding:2px 2px 5px;scroll-snap-type:x proximity}
 body[data-phase="select"] .backup-item{flex:0 0 146px;display:block;scroll-snap-align:start}
 body[data-phase="select"] .backup-item small{font-size:10px;display:block;color:#8996a5;margin-bottom:3px}
 body[data-phase="select"] .backup-item .plate{font-size:17px;min-height:42px}
 body[data-phase="select"] .side-panel>button,body[data-phase="select"] .side-panel>p{display:none}
 body[data-phase="select"] .backup-list>.footnote{margin:0;font-size:12px}.backup-list>.footnote br{display:none}
 .mobile-action-dock{display:block;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #dfe6ee;padding:8px 12px calc(10px + env(safe-area-inset-bottom));z-index:35;box-shadow:0 -4px 16px #18395708}
 .mobile-action-dock p{font-size:12px;color:#718095;text-align:center;margin-bottom:7px;line-height:20px}.mobile-action-dock b{color:#263c52;font-family:monospace;font-size:15px}
 .dock-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mobile-action-dock>.btn{width:100%}
 body[data-phase="select"][data-method="custom"] .practice-layout>.side-panel{margin-bottom:6px}
 body[data-phase="select"][data-method="custom"] .practice-layout>.panel>h3{font-size:14px;margin-top:12px}
 body[data-phase="select"][data-method="custom"] .custom-slots{margin-top:12px}
 body[data-phase="select"] .custom-row{margin-bottom:8px;gap:6px}
 body[data-phase="select"] .custom-row .custom-prefix{flex-basis:42px;width:42px;background:#f1f5fa;padding:10px 4px;color:#4c6b88}
 body[data-phase="select"] .number-slot{font-size:19px;min-height:44px;padding:6px 5px;letter-spacing:0;border-color:#d4dfe9;color:#263c52}
 body[data-phase="select"] .number-slot.editing{outline:2px solid #1675d1;background:#f4f9ff}
 body[data-phase="select"] .number-digit{width:25px;margin-right:2px;border-color:#b6cbe0;line-height:26px}
 body[data-phase="select"] .keyboard-wrap{background:#eaf0f6;border-color:#e0e7ef;margin:14px -12px 0;padding:12px;border-radius:0}
 body[data-phase="select"] .keyboard-preview{display:block;background:white;border:1px solid #c4d9ec;border-radius:6px;padding:8px;margin-bottom:10px;font-size:22px;color:#274b6c;letter-spacing:3px;font-family:monospace}
 body[data-phase="select"] .virtual-keyboard{grid-template-columns:repeat(8,1fr);gap:5px}
 body[data-phase="select"] .virtual-keyboard button{min-height:43px;border:1px solid #bdcddd;border-bottom-width:2px;color:#234968;font-size:17px;border-radius:5px}
 body[data-phase="select"] .virtual-keyboard button:disabled{color:#9ba8b5;background:#dce3ea;border-color:#dce3ea}
 body[data-phase="select"] .keyboard-wrap .panel-title{font-size:12px;color:#5c7188;margin-bottom:10px}
 body[data-phase="select"] .keyboard-wrap .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 body[data-phase="select"] #custom-confirm{display:none}
 body[data-phase="select"] #custom-form .field{margin-top:12px!important}
 body[data-page="practice"] .empty-state{padding:28px 14px;background:#f8fafc;border-color:#d5dfea}
 body[data-page="practice"] .empty-state p{font-size:13px}
 body[data-page="practice"] dialog{border-radius:12px;padding:22px;width:calc(100vw - 36px)}
 body[data-page="practice"] dialog p{font-size:14px;line-height:1.8}
 body[data-page="practice"] dialog .actions{display:grid;grid-template-columns:1fr 1fr}
 body[data-page="practice"] .toast{bottom:118px;font-size:13px;background:#263e55}
 body[data-page="practice"] .result-hero{background:#eef6ff;border-color:#d9e6f3}
 body[data-page="practice"] .result-hero .big-plate{max-width:100%;font-size:28px}
}
@media(max-width:360px){body[data-phase="select"] .number-digit{width:21px;margin-right:1px}body[data-phase="select"] .number-grid .plate{font-size:18px}body[data-page="practice"] .workflow-track{font-size:10px}}
