.screen-reader-text { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.ums-honeypot { position:absolute!important; left:-9999px; width:1px; height:1px; opacity:0; pointer-events:none; }
.ums-catalog { margin-top:8px; }
.ums-catalog-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.ums-search { position:relative; display:block; min-width:min(340px,100%); flex:1 1 260px; }
.ums-search span { position:absolute; top:50%; left:12px; transform:translateY(-50%); color:var(--muted-2); }
.ums-search input, .ums-catalog-filters select, .ums-field-inline select, .ums-contact-form input, .ums-contact-form textarea, .ums-profile-form input, .ums-transfer-form input, .ums-assessment-form textarea, .ums-quiz-form input[type="text"] { width:100%; min-height:42px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink); font-size:17px; }
.ums-search input { padding-left:34px; }
.ums-catalog-filters { display:flex; flex-wrap:wrap; gap:8px; }
.ums-result-count { margin:0 0 16px; color:var(--muted); font-size:16px; font-weight:700; }
.ums-course-card h3 a, .ums-cert-card h3 a { text-decoration:none; }
.ums-muted { color:var(--muted); font-size:16px; line-height:1.65; }
.ums-panel-flat { border:1px solid var(--line); border-radius:14px; background:#fbfdff; padding:18px; }
.ums-panel-flat h3 { margin-top:0; color:var(--navy); font-size:15px; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.metric-card { padding:15px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.metric-card .metric-top { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:14px; font-weight:800; }
.metric-icon { display:grid; width:28px; height:28px; place-items:center; border-radius:8px; color:var(--cyan-strong); background:var(--cyan-pale); }
.metric-card strong { display:block; margin-top:10px; color:var(--navy); font-size:24px; line-height:1; }
.metric-card small { display:block; margin-top:7px; color:var(--muted); font-size:14px; }
.ums-dashboard-nav { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-bottom:18px; }
.ums-dashboard-tab { min-height:38px; padding:0 14px; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:#fff; font-size:16px; font-weight:800; cursor:pointer; }
.ums-dashboard-tab.active { color:#fff; border-color:var(--navy); background:var(--navy); }
.ums-logout-form { margin-left:auto; }
.ums-progress-track { display:block; height:8px; overflow:hidden; border-radius:999px; background:#e8eef4; }
.ums-progress-track span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--cyan),var(--orange)); }
.ums-auth-card { max-width:520px; margin:0 auto; }
.ums-auth-form .field, .ums-profile-form .field, .ums-contact-form .field, .ums-transfer-form label, .ums-assessment-form .field { margin-bottom:14px; }
.ums-auth-form label, .ums-profile-form label, .ums-contact-form label, .ums-transfer-form label, .ums-assessment-form label, .ums-field-inline span { display:block; margin-bottom:6px; color:var(--navy); font-size:14px; font-weight:800; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.checkbox-row { display:flex; align-items:flex-start; gap:9px; margin:12px 0; color:var(--ink); font-size:16px; line-height:1.55; }
.checkbox-row input { margin-top:2px; accent-color:var(--cyan-strong); }
.ums-course-detail { display:grid; gap:18px; }
.ums-course-summary { padding:22px; }
.ums-course-facts { display:flex; flex-wrap:wrap; gap:18px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.ums-course-facts strong { display:block; color:var(--navy); font-size:15px; }
.ums-course-feature-image img { width:100%; max-height:360px; object-fit:cover; border-radius:14px; }
.ums-course-price strong { color:var(--orange); font-size:20px; }
.ums-auth-prompt, .ums-payment-panel { margin-top:18px; padding:17px; border:1px solid var(--line); border-radius:13px; background:#fbfdff; }
.ums-bank-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0; padding:14px; border:1px solid #d8eef0; border-radius:12px; background:#f2fcfd; }
.ums-bank-details strong { grid-column:1/-1; color:var(--navy); font-size:14px; }
.ums-bank-details span { color:var(--ink); font-weight:800; }
.ums-transfer-form, .ums-online-payment-form { margin-top:14px; }
.ums-online-payment-form small { display:block; margin-top:8px; color:var(--muted); font-size:14px; }
.ums-lesson-item { border:1px solid var(--line); border-radius:13px; background:#fff; }
.ums-lesson-item + .ums-lesson-item { margin-top:10px; }
.ums-lesson-item summary { display:flex; align-items:center; gap:10px; padding:14px 16px; cursor:pointer; list-style:none; }
.ums-lesson-item summary::-webkit-details-marker { display:none; }
.ums-lesson-title { flex:1; min-width:0; }
.ums-lesson-title strong { display:block; color:var(--navy); font-size:17px; }
.ums-lesson-title small { display:block; margin-top:4px; color:var(--muted); font-size:14px; }
.ums-lesson-state { display:grid; width:28px; height:28px; place-items:center; border-radius:9px; color:var(--muted); background:#f1f5f8; font-weight:900; }
.ums-lesson-content { padding:0 18px 18px; border-top:1px solid var(--line); }
.ums-locked-content p { margin:14px 0; color:var(--muted); font-size:16px; }
.ums-quiz-form, .ums-assessment-form { margin-top:16px; }
.ums-quiz-form h3, .ums-assessment-form h3 { margin:18px 0 10px; color:var(--navy); font-size:15px; }
.ums-question { margin:0 0 14px; padding:14px; border:1px solid var(--line); border-radius:12px; background:#fbfdff; }
.ums-question legend { padding:0 6px; color:var(--navy); font-size:16px; font-weight:800; }
.ums-answer-option { display:flex; align-items:flex-start; gap:9px; padding:8px 10px; border-radius:9px; cursor:pointer; }
.ums-answer-option:hover { background:#eefafb; }
.ums-answer-option input { margin-top:3px; accent-color:var(--cyan-strong); }
.ums-issued-certificate { margin-top:16px; }
.ums-message-list { display:flex; flex-direction:column; gap:9px; max-height:360px; overflow:auto; margin-top:12px; padding-right:4px; }
.ums-session-list { display:flex; flex-direction:column; }
.ums-lab { padding:22px; }
.ums-lab-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin-bottom:16px; }
.ums-field-inline { min-width:180px; }
.ums-lab-modes { display:inline-flex; gap:4px; padding:4px; border-radius:11px; background:#eef3f7; }
.ums-lab-modes button { min-height:36px; padding:0 14px; border:0; border-radius:8px; color:var(--muted); background:transparent; font-size:16px; font-weight:800; cursor:pointer; }
.ums-lab-modes button.active { color:var(--navy); background:#fff; box-shadow:0 2px 6px rgba(7,27,59,.08); }
.ums-lab-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:16px; }
.ums-lab-editor, .ums-lab-preview { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; }
.ums-block-palette { display:flex; flex-wrap:wrap; gap:8px; padding:14px; border-bottom:1px solid var(--line); background:#f8fbfd; }
.ums-block { padding:9px 12px; border:1px solid #bfe9ec; border-radius:9px; color:#075d68; background:var(--cyan-pale); font-size:14px; font-weight:800; cursor:pointer; }
.ums-code-editor { width:100%; min-height:330px; padding:16px; border:0; outline:none; color:#d7e6f5; background:#071b3b; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:17px; line-height:1.65; resize:vertical; }
.ums-lab-actions { display:flex; flex-wrap:wrap; gap:8px; padding:14px; border-top:1px solid var(--line); background:#fbfdff; }
.ums-board-stage { display:grid; min-height:330px; place-items:center; padding:24px; background:radial-gradient(circle at 50% 30%,#eafcff,#f7f9fc 70%); }
.ums-board-screen { position:relative; display:grid; width:min(280px,100%); aspect-ratio:4/3; place-items:center; border:2px solid #b9c7d5; border-radius:18px; background:linear-gradient(145deg,#12365f,#071b3b); box-shadow:inset 0 0 0 8px #0b2647; }
.ums-led { width:54px; height:54px; border-radius:50%; background:#52627a; box-shadow:0 0 0 8px rgba(255,255,255,.08); transition:all .25s ease; }
.ums-led.on { background:var(--cyan); box-shadow:0 0 32px 8px rgba(24,207,225,.55); }
.ums-board-label { position:absolute; bottom:18px; color:#b9c7d5; font-size:14px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.ums-lab-output { min-height:64px; padding:14px 16px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:16px; line-height:1.6; }
@media (max-width:980px) {
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ums-lab-grid { grid-template-columns:1fr; }
  .ums-bank-details { grid-template-columns:1fr 1fr; }
}
@media (max-width:700px) {
  .form-grid, .ums-bank-details { grid-template-columns:1fr; }
  .ums-dashboard-nav { overflow-x:auto; }
  .ums-logout-form { margin-left:0; }
  .ums-course-detail, .portal-content-grid, .portal-courses-grid { grid-template-columns:1fr; }
  .ums-course-summary { padding:18px; }
}

/* Expanded Code Lab: PictoBlox-style blocks/stage + Arduino IDE-style simulator */
.editor-pane-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-bottom:1px solid var(--line); background:#fbfdff; }
.ums-lab-tabs { display:inline-flex; flex-wrap:wrap; gap:4px; padding:4px; border-radius:11px; background:#eef3f7; max-width:100%; }
.ums-lab-tabs button { min-height:34px; padding:0 12px; border:0; border-radius:8px; color:var(--muted); background:transparent; font-size:14px; font-weight:800; cursor:pointer; white-space:nowrap; }
.ums-lab-tabs button:hover { color:var(--navy); }
.ums-lab-tabs button.active { color:var(--navy); background:#fff; box-shadow:0 2px 6px rgba(7,27,59,.08); }
.lab-status { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:14px; font-weight:800; }
.status-dot { width:9px; height:9px; border-radius:50%; background:#98a8bd; box-shadow:0 0 0 4px rgba(152,168,189,.18); }
.status-dot.on { background:var(--cyan-strong); box-shadow:0 0 0 5px rgba(24,207,225,.18); }
.ums-lab-panel { min-height:330px; }
.ums-lab-panel[hidden] { display:none !important; }
.ums-block-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:14px; background:#f8fbfd; }
.ums-block-category { padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.ums-block-category-name { display:block; margin-bottom:9px; color:var(--navy); font-size:14px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.ums-block-row { display:flex; flex-wrap:wrap; gap:7px; }
.ums-block { padding:8px 11px; border:1px solid #bfe9ec; border-radius:9px; color:#075d68; background:var(--cyan-pale); font-size:14px; font-weight:800; cursor:pointer; }
.ums-block:hover { background:#d9f7fa; transform:translateY(-1px); }
.ums-ide-toolbar, .ums-serial-toolbar, .ums-library-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px; border-bottom:1px solid var(--line); background:#fbfdff; }
.button-sm { min-height:34px; padding:0 12px; font-size:14px; }
.ums-code-wrap { position:relative; display:grid; grid-template-columns:54px minmax(0,1fr); min-height:330px; background:#071b3b; }
.ums-line-numbers { padding:16px 8px; overflow:hidden; color:#5f7693; background:#06142b; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:17px; line-height:1.65; text-align:right; user-select:none; white-space:pre; }
.ums-code-wrap .ums-code-editor { min-height:330px; padding:16px 18px; color:#d7e6f5; background:#071b3b; border-radius:0; }
.ums-lab[data-theme="light"] .ums-code-wrap { background:#f7f9fc; }
.ums-lab[data-theme="light"] .ums-line-numbers { color:#8a99ad; background:#eef3f7; }
.ums-lab[data-theme="light"] .ums-code-wrap .ums-code-editor { color:#172a45; background:#fff; }
.ums-serial-output { width:100%; min-height:330px; padding:14px 16px; border:0; outline:none; color:#c7f7ff; background:#06142b; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:16px; line-height:1.65; resize:vertical; }
.ums-library-list, .ums-board-list { display:flex; flex-direction:column; padding:12px; gap:10px; overflow:auto; max-height:380px; }
.ums-library-item, .ums-board-item { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.ums-library-item strong, .ums-board-item strong { display:block; color:var(--navy); font-size:17px; }
.ums-library-item small, .ums-board-item small { display:block; margin-top:3px; color:var(--muted); font-size:14px; }
.ums-library-item code { display:inline-block; margin-top:7px; padding:4px 8px; border-radius:7px; color:#075d68; background:var(--cyan-pale); font-size:14px; }
.ums-board-item.installed { border-color:#bfe9ec; background:#f4feff; }
.ums-board-actions { display:flex; align-items:center; gap:8px; }
.ums-board-info { margin:0; padding:12px 14px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:16px; }
.ums-example-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:14px; overflow:auto; max-height:380px; }
.ums-example-card { display:flex; flex-direction:column; align-items:flex-start; gap:7px; min-height:120px; padding:13px; border:1px solid var(--line); border-radius:12px; color:inherit; background:#fff; text-align:left; cursor:pointer; }
.ums-example-card:hover { border-color:var(--cyan); box-shadow:0 8px 18px rgba(7,27,59,.08); transform:translateY(-2px); }
.ums-example-card strong { color:var(--navy); font-size:17px; }
.ums-example-card small { color:var(--muted); font-size:14px; line-height:1.5; }
.ums-pref-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:16px; }
.ums-search { display:inline-flex; align-items:center; gap:8px; min-width:240px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.ums-search input { width:100%; min-height:36px; border:0; outline:none; background:transparent; font-size:16px; }
.ums-lab-preview .ums-lab-panel { display:flex; flex-direction:column; }
.ums-stage-tools { display:flex; flex-wrap:wrap; gap:8px; padding:10px 12px; border-bottom:1px solid var(--line); background:#fbfdff; }
.ums-stage { position:relative; flex:1; min-height:300px; overflow:hidden; background:
  radial-gradient(circle at 20% 20%, rgba(24,207,225,.12), transparent 30%),
  radial-gradient(circle at 80% 75%, rgba(255,154,60,.12), transparent 32%),
  linear-gradient(180deg,#f7fdff,#eef6fb); }
.ums-stage-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(7,27,59,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(7,27,59,.06) 1px,transparent 1px); background-size:40px 40px; }
.ums-sprite { position:absolute; left:50%; top:50%; width:54px; height:54px; display:grid; place-items:center; border-radius:50%; background:#fff; box-shadow:0 10px 24px rgba(7,27,59,.18); font-size:28px; transform:translate(-50%,-50%); transition:all .18s ease; }
.ums-sprite.say { box-shadow:0 0 0 5px rgba(24,207,225,.25),0 10px 24px rgba(7,27,59,.18); }
.ums-stage-trail { position:absolute; width:8px; height:8px; border-radius:50%; background:rgba(24,207,225,.55); pointer-events:none; transform:translate(-50%,-50%); }
.ums-stage-say { position:absolute; top:14px; left:14px; max-width:70%; padding:9px 13px; border-radius:14px; color:#075d68; background:#fff; box-shadow:0 8px 18px rgba(7,27,59,.12); font-size:16px; font-weight:800; }
.ums-stage-coords { display:flex; flex-wrap:wrap; gap:14px; padding:10px 12px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:14px; font-weight:800; }
.ums-stage-coords strong { color:var(--navy); }
.board-status { padding:12px 14px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:14px; line-height:1.6; }
.ums-lab-output { min-height:72px; padding:14px 16px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:16px; line-height:1.65; white-space:pre-wrap; }
@media (max-width:980px) {
  .ums-block-categories { grid-template-columns:1fr; }
  .ums-example-list { grid-template-columns:1fr; }
  .ums-pref-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ums-lab-toolbar { align-items:stretch; }
  .ums-field-inline { min-width:140px; flex:1 1 160px; }
}
@media (max-width:700px) {
  .ums-lab { padding:14px; }
  .ums-lab-grid { grid-template-columns:1fr; gap:12px; }
  .ums-lab-panel { min-height:260px; }
  .ums-code-wrap { grid-template-columns:42px minmax(0,1fr); }
  .ums-line-numbers { font-size:16px; }
  .ums-pref-grid { grid-template-columns:1fr; }
  .ums-stage { min-height:240px; }
  .ums-sprite { width:44px; height:44px; font-size:23px; }
  .ums-lab-tabs { overflow-x:auto; max-width:100%; }
  .ums-lab-tabs button { flex:0 0 auto; }
}

/* Code Lab runtime states and accessibility fixes */
.ums-lab [hidden] { display:none !important; }
.ums-led-label { position:absolute; top:18px; color:#b9c7d5; font-size:14px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.ums-stage.pen-down .ums-stage-grid { opacity:.75; }
.ums-code-editor.light { color:#172a45; background:#fff; }
.ums-code-wrap:has(.ums-code-editor.light) { background:#f7f9fc; }
.ums-code-wrap:has(.ums-code-editor.light) .ums-line-numbers { color:#8a99ad; background:#eef3f7; }
.button.is-disabled, .button[aria-disabled="true"] { opacity:.55; cursor:not-allowed; }
[data-ums-compile].ok { color:#0b8a75; }
[data-ums-compile].error { color:#d64545; }
.button[disabled] { opacity:.55; cursor:not-allowed; }

/* Official embedded apps: real PictoBlox web app + Arduino Cloud Editor */
.ums-official-notice { padding:14px 16px; border-bottom:1px solid var(--line); background:#fff8ef; color:#5a3b16; font-size:16px; line-height:1.65; }
.ums-official-notice strong { color:#8a4b08; }
.ums-official-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-bottom:1px solid var(--line); background:#fbfdff; }
.ums-official-links { display:flex; flex-wrap:wrap; gap:8px; }
.ums-official-links .button { white-space:nowrap; }
.ums-official-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:12px; }
.ums-official-card { display:flex; flex-direction:column; min-width:0; border:1px solid var(--line); border-radius:14px; background:#fff; overflow:hidden; }
.ums-official-card-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line); background:#f8fbfd; }
.ums-official-card-header strong { display:block; margin-top:6px; color:var(--navy); font-size:14px; }
.ums-official-card-header small { color:var(--muted); font-size:14px; }
.ums-official-frame-wrap { height:clamp(420px,58vh,720px); background:#071b3b; }
.ums-official-frame { width:100%; height:100%; border:0; display:block; background:#fff; }
.ums-official-note { margin:0; padding:12px 14px; border-top:1px solid var(--line); color:var(--muted); background:#fbfdff; font-size:14px; line-height:1.65; }
.ums-official-requirements { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:12px 14px; border-top:1px solid var(--line); color:var(--muted); background:#f8fbfd; font-size:14px; font-weight:800; }
.ums-official-requirements span { padding:6px 10px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--navy); font-size:14px; }
@media (max-width:980px) {
  .ums-official-grid { grid-template-columns:1fr; }
  .ums-official-frame-wrap { height:clamp(360px,52vh,560px); }
}
@media (max-width:700px) {
  .ums-official-toolbar { align-items:stretch; }
  .ums-official-links { width:100%; }
  .ums-official-frame-wrap { height:min(62vh,480px); }
}

/* Hardware Bridge: real Web Serial monitor + AVR HEX flasher */
.ums-hardware { display:flex; flex-direction:column; min-height:420px; }
.ums-hw-toolbar, .ums-hw-file-row, .ums-hw-serial-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line); background:#fbfdff; }
.ums-hw-file-name { color:var(--muted); font-size:14px; font-weight:800; }
.ums-hw-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:12px; }
.ums-hw-card { min-width:0; padding:16px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.ums-hw-card h3 { margin:0 0 10px; color:var(--navy); font-size:14px; }
.ums-hw-steps { margin:0; padding-left:20px; color:#42536d; font-size:16px; line-height:1.75; }
.ums-hw-progress { position:relative; height:10px; margin:12px 0; border-radius:999px; background:#e7eef5; overflow:hidden; }
.ums-hw-progress span { position:absolute; inset:0 auto 0 0; width:0%; border-radius:999px; background:linear-gradient(90deg,var(--cyan),var(--orange)); transition:width .18s ease; }
.ums-hw-status { margin:0 0 10px; color:var(--muted); font-size:14px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.ums-hw-status.ok { color:#0b8a75; }
.ums-hw-status.error { color:#d64545; }
.ums-hw-output { min-height:64px; padding:12px 14px; border:1px solid var(--line); border-radius:11px; color:#42536d; background:#fbfdff; font-size:16px; line-height:1.65; white-space:pre-wrap; }
.ums-hw-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.ums-hw-serial { min-height:220px; max-height:360px; overflow:auto; margin:0; padding:12px 14px; border:1px solid var(--line); border-radius:11px; color:#c7f7ff; background:#06142b; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:16px; line-height:1.65; white-space:pre-wrap; }
.ums-hw-serial-tools input[type="text"] { min-width:220px; flex:1 1 240px; }
@media (max-width:980px) {
  .ums-hw-grid { grid-template-columns:1fr; }
}
@media (max-width:700px) {
  .ums-hw-toolbar, .ums-hw-file-row, .ums-hw-serial-tools { align-items:stretch; }
  .ums-hw-serial-tools input[type="text"] { min-width:0; }
}

/* Separate Blocks Studio and Arduino IDE workspaces */
.ums-workspace-switch { display:inline-flex; gap:6px; padding:4px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.04); }
.ums-workspace-switch button { min-height:34px; padding:8px 13px; border:0; border-radius:999px; background:transparent; color:var(--muted); font-weight:900; font-size:16px; cursor:pointer; white-space:nowrap; }
.ums-workspace-switch button.active { background:var(--cyan); color:#06142b; box-shadow:0 8px 20px rgba(34,211,238,.25); }
.ums-lab-tabs button[hidden], .ums-lab-toolbar select option[hidden] { display:none; }
@media (max-width:700px) {
  .ums-workspace-switch { width:100%; }
  .ums-workspace-switch button { flex:1 1 auto; }
}

/* Combined offline Code Lab iframe */
.ums-lab-frame-wrap { position:relative; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#06142b; box-shadow:var(--shadow); }
.ums-lab-frame { display:block; width:100%; height:min(1250px, 86vh); min-height:760px; border:0; }
.ums-official-section { display:block; }
@media (max-width:700px) {
  .ums-lab-frame { height:78vh; min-height:620px; }
}

/* UMS Store: gadgets, checkout, and order tracking */
.ums-store { display:flex; flex-direction:column; gap:18px; }
.ums-store-intro { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; padding:20px 22px; }
.ums-store-intro p { margin:6px 0 0; color:var(--muted); font-size:17px; line-height:1.65; max-width:720px; }
.ums-store-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:16px; }
.ums-store-card { display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 10px 26px rgba(7,27,59,.06); }
.ums-store-thumb { display:flex; align-items:center; justify-content:center; aspect-ratio:4 / 3; background:linear-gradient(135deg,#eaf9fb,#fff4ea); color:var(--navy); font-size:38px; }
.ums-store-thumb img { width:100%; height:100%; object-fit:cover; }
.ums-store-body { display:flex; flex-direction:column; gap:8px; padding:16px; flex:1; }
.ums-store-body h3 { margin:0; color:var(--navy); font-size:16px; }
.ums-store-body p { margin:0; color:var(--muted); font-size:16px; line-height:1.6; flex:1; }
.ums-store-sku { color:var(--muted); font-size:14px; letter-spacing:.04em; text-transform:uppercase; }
.ums-store-price { display:flex; flex-direction:column; gap:2px; }
.ums-store-price strong { color:var(--navy); font-size:20px; }
.ums-store-price small { color:var(--muted); font-size:16px; }
.ums-store-stock { align-self:flex-start; padding:4px 10px; border-radius:999px; background:#e7f8ef; color:#14653b; font-size:14px; font-weight:800; }
.ums-store-stock.low { background:#fff1e4; color:#9a4a10; }
.ums-store-stock.out { background:#fde8e6; color:#9b2c24; }
.ums-store-card .button { justify-content:center; }
.ums-checkout { scroll-margin-top:90px; }
.ums-checkout h3 { margin:0 0 10px; color:var(--navy); font-size:15px; }
.ums-checkout-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; margin-top:12px; }
.ums-checkout-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; }
.ums-checkout-fields label, .ums-field-block { display:flex; flex-direction:column; gap:6px; font-size:16px; font-weight:800; color:var(--navy); }
.ums-checkout-fields .wide { grid-column:1 / -1; }
.ums-checkout input, .ums-checkout select, .ums-checkout textarea { width:100%; min-height:40px; padding:9px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; font:inherit; font-weight:500; color:var(--ink, #172a45); }
.ums-checkout textarea { min-height:64px; }
.ums-checkout small { color:var(--muted); font-size:15px; }
.ums-pay-option { display:flex; align-items:center; gap:9px; margin:0 0 10px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; font-weight:700; color:var(--navy); cursor:pointer; }
.ums-shipping-note { margin:12px 0 0; padding:12px 14px; border-radius:12px; background:#eefafb; color:#17495a; font-size:16px; line-height:1.6; }
.ums-checkout-note { color:var(--muted); font-size:16px; line-height:1.6; margin:12px 0; }
.ums-order-card { padding:16px; border:1px solid var(--line); border-radius:14px; background:#fbfdff; margin-bottom:10px; }
.ums-order-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:10px; }
.ums-order-head strong { display:block; color:var(--navy); }
.ums-order-head small { color:var(--muted); font-size:15px; }
.ums-order-card p { margin:8px 0 0; color:var(--muted); font-size:16px; line-height:1.6; }
.ums-order-badge { padding:5px 11px; border-radius:999px; background:#eef3f7; color:var(--navy); font-size:14px; font-weight:800; white-space:nowrap; }
.ums-order-badge.processing { background:#e7f3ff; color:#1d4f91; }
.ums-order-badge.shipped { background:#fff1e4; color:#9a4a10; }
.ums-order-badge.delivered { background:#e7f8ef; color:#14653b; }
.ums-order-badge.cancelled { background:#fde8e6; color:#9b2c24; }
.ums-track { color:var(--navy) !important; }
@media (max-width:820px) {
  .ums-checkout-grid { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .ums-checkout-fields { grid-template-columns:1fr; }
  .ums-store-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .ums-store-body { padding:12px; }
  .ums-store-body h3 { font-size:14px; }
}

/* Store on small phones: one column so product cards keep readable width */
@media (max-width:420px) {
  .ums-store-grid { grid-template-columns:1fr; }
  .ums-store-card { flex-direction:row; }
  .ums-store-thumb { width:38%; min-width:96px; height:auto !important; }
}

/* Store categories and search (1.10.0) */
.ums-store-cats { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 12px; }
.ums-store-cat { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 10px 16px; border: 2px solid #0b1f3a; border-radius: 999px; background: #fff; color: #0b1f3a; font-weight: 700; font-size: 16px; text-decoration: none; }
.ums-store-cat small { font-weight: 600; color: #35506e; font-size: 14px; }
.ums-store-cat:hover { background: #e3f6fb; }
.ums-store-cat.active { background: #0b1f3a; color: #fff; }
.ums-store-cat.active small { color: #bfe9f5; }
.ums-store-search { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; margin: 0 0 18px; }
.ums-store-search label { grid-column: 1 / -1; font-weight: 700; color: #0b1f3a; font-size: 16px; }
.ums-store-search input { min-height: 48px; padding: 10px 14px; border: 2px solid #5b6b84; border-radius: 12px; font-size: 16px; color: #0b1f3a; background: #fff; min-width: 0; }
.ums-store-search button { min-height: 48px; }
.ums-store-cat-tag { display: inline-block; margin: 2px 0 6px; padding: 3px 10px; border-radius: 999px; background: #e3f6fb; color: #0b4a63; font-weight: 700; font-size: 14px; }
@media (max-width: 560px) { .ums-store-search { grid-template-columns: 1fr; } .ums-store-search button { width: 100%; } }


/* International pricing (1.11.0): currency switcher and checkout notes */
.ums-fx-note { margin: 10px 0; padding: 12px 14px; border-left: 4px solid #0b7fa3; border-radius: 8px; background: #e3f6fb; color: #0b1f3a; font-size: 16px; line-height: 1.5; }
/* 1.11.0 fixes: store category tabs keep their colours; header stays on one line on phones */
.ums-store .ums-store-cats a.ums-store-cat, .ums-store-cats a.ums-store-cat { color:#0b1f3a !important; text-decoration:none !important; background:#fff; }
.ums-store .ums-store-cats a.ums-store-cat.active, .ums-store-cats a.ums-store-cat.active { background:#0b1f3a !important; color:#fff !important; }
.ums-store-cats a.ums-store-cat small { color:inherit; opacity:.85; }