/* Legacy/deprecated Foundation lesson overlay styles remain for the current app runtime.
   New learning design source of truth lives in development/ and uses Unit -> Sequence -> Concept -> Activity. */
.screen--board.is-active{display:grid;grid-template-columns:84px minmax(0,1fr);height:100%}.modeRail{border-right:1px solid rgba(31,41,51,.12);background:rgba(248,251,255,.58);backdrop-filter:blur(18px);padding:12px 10px;overflow:auto}.modeRailTitle{font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:950;color:#667085;margin:6px 5px 12px}.modeRailList{display:grid;gap:8px}.railBtn{width:100%;border:1px solid transparent;background:transparent;border-radius:18px;padding:10px 6px;display:grid;place-items:center;gap:5px;color:#65707c;font-size:10px;font-weight:900}.railBtn span{font-size:22px}.railBtn.is-active{background:rgba(156,201,189,.24);border-color:rgba(31,41,51,.08);color:#1f2933}.boardStage{height:100%;min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:14px;gap:12px}.boardToolbar{display:flex;align-items:end;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.86);border-radius:26px;background:rgba(255,255,255,.68);box-shadow:var(--soft-shadow);backdrop-filter:blur(18px);overflow:auto}.toolbarGroup{flex:0 0 auto}.toolbarGroup--mode{min-width:220px}.toolbarGroup--toggles{display:flex;gap:8px;align-items:end}.modeSelect{height:42px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.78);padding:0 36px 0 14px;font-weight:850;color:#1f2933}.compactSelect{min-width:126px}.boardWorkspaceWrap{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:12px}.boardMat{position:relative;overflow:hidden;background:var(--atb-mat-bg);border:1px solid rgba(0,0,0,.32);border-radius:30px;box-shadow:inset 0 1px 0 rgba(255,255,255,.62), var(--soft-shadow);min-height:0;touch-action:none;background-image:linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px);background-size:40px 40px}.tileLayer{position:absolute;inset:0}.equalityDivider{position:absolute;top:28px;bottom:28px;left:50%;width:0;border-left:3px dashed rgba(31,41,51,.42);display:none;z-index:3}.equalityDivider span{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:48px;height:48px;display:grid;place-items:center;border-radius:999px;border:1px solid rgba(31,41,51,.18);background:rgba(255,255,255,.78);box-shadow:0 10px 24px rgba(31,41,51,.12);font-family:var(--tile-font-family);font-size:30px;font-weight:900}.boardMat.show-divider .equalityDivider{display:block}.floatingHint{position:absolute;left:20px;top:20px;z-index:40;max-width:min(420px,calc(100% - 40px));padding:13px 16px;border:1px solid rgba(31,41,51,.12);border-radius:20px;background:rgba(255,255,255,.82);box-shadow:0 12px 30px rgba(31,41,51,.12);backdrop-filter:blur(12px);font-size:14px;line-height:1.35}.selectionMarquee{position:absolute;border:2px dashed rgba(0,0,0,.68);background:rgba(79,128,212,.08);z-index:35}.taskDrawer{min-height:0;overflow:auto;border-radius:30px;border:1px solid rgba(255,255,255,.86);background:rgba(255,255,255,.70);box-shadow:var(--soft-shadow);backdrop-filter:blur(18px);padding:16px}.drawerHeader{display:flex;align-items:start;justify-content:space-between;gap:10px;margin-bottom:14px}.drawerHeader h2{margin:0;letter-spacing:-.04em}.stepStack{display:grid;gap:10px}.stepCard{border:1px solid var(--line);background:rgba(255,255,255,.72);border-radius:22px;padding:14px;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px}.stepNumber{width:34px;height:34px;border-radius:13px;background:#1f2933;color:#fff;display:grid;place-items:center;font-weight:900}.stepCard h3{font-size:15px;margin:0 0 4px}.stepCard p{margin:0;color:#626d79;font-size:13px;line-height:1.38}.stepCard.is-active{background:#f0f8f5;border-color:rgba(46,125,50,.24)}.quizCard{margin-top:14px;border-radius:24px;background:#f3f7fb;border:1px solid rgba(244,202,165,.5);padding:16px}.quizTopline{font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:950;color:#9a6b3e}.quizCard h3{font-size:17px;margin:8px 0 12px}.quizOptions{display:grid;gap:8px}.quizOption{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.78);text-align:left;padding:12px;font-weight:800}.quizOption.is-correct{background:var(--success-soft)}.quizOption.is-wrong{background:var(--danger-soft)}.quizFeedback{min-height:22px;margin-top:10px;font-size:13px;font-weight:800;color:#40505f}.bottomTray{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.86);border-radius:26px;background:rgba(255,255,255,.72);box-shadow:var(--soft-shadow);backdrop-filter:blur(18px);overflow:auto}.paletteCluster{display:flex;align-items:center;gap:10px}.paletteBtn{min-width:66px;min-height:66px;border:1px solid rgba(31,41,51,.12);border-radius:20px;background:rgba(255,255,255,.62);display:grid;place-items:center}.paletteBtn:active{transform:translateY(1px)}.trayActions{display:flex;gap:8px;align-items:center}.taskDrawer.is-collapsed{display:none}.boardWorkspaceWrap.drawer-collapsed{grid-template-columns:minmax(0,1fr)}
@media (max-width:1060px){.screen--board.is-active{grid-template-columns:1fr}.modeRail{display:none}.boardWorkspaceWrap{grid-template-columns:minmax(0,1fr)}.taskDrawer{position:absolute;right:18px;top:calc(var(--header-h) + 86px);bottom:calc(var(--nav-h) + 94px);width:min(360px,calc(100vw - 36px));z-index:55;display:none}.taskDrawer.is-open{display:block}.boardStage{position:relative}.boardToolbar{flex-wrap:nowrap}}
@media (max-width:760px){.boardStage{padding:10px;gap:8px}.boardToolbar{border-radius:22px;padding:8px}.toolbarGroup--mode{min-width:176px}.toolbarGroup--toggles{gap:6px}.toolBtn{font-size:12px;min-height:36px;padding:0 10px}.modeSelect{height:38px;font-size:13px}.boardMat{border-radius:24px;min-height:360px}.bottomTray{border-radius:22px;padding:8px}.paletteCluster{gap:7px}.paletteBtn{min-width:58px;min-height:58px}.tilePreview--x2{width:50px;height:50px;font-size:18px}.tilePreview--x{width:34px;height:56px;font-size:20px}.tilePreview--one{width:34px;height:34px}.floatingHint{left:12px;top:12px;font-size:13px}.taskDrawer{top:calc(var(--header-h) + 70px);bottom:calc(var(--nav-h) + 82px)}}
/* v2.1.0 board-engine merge foundation */
.boardWorkspaceWrap{grid-template-columns:minmax(0,1fr) 164px 360px;align-items:stretch}.rightPalette{min-height:0;overflow:auto;border-radius:30px;border:1px solid rgba(255,255,255,.86);background:rgba(255,255,255,.72);box-shadow:var(--soft-shadow);backdrop-filter:blur(18px);padding:16px}.paletteHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}.paletteHeader h2{margin:0;letter-spacing:-.04em}.paletteInstruction{font-size:12px;line-height:1.35;color:#667085;margin:0 0 12px}.rightPalette.is-hidden{display:none}.boardWorkspaceWrap.palette-hidden{grid-template-columns:minmax(0,1fr) 360px}.bottomTray .paletteBtn{cursor:pointer}.mobilePaletteCluster{display:none}.boardMat.is-over{outline:3px solid rgba(79,128,212,.34);outline-offset:2px}.toolBtn.is-warn{background:#fff1f1;border-color:rgba(209,59,59,.24)}
@media (max-width:1180px){.boardWorkspaceWrap{grid-template-columns:minmax(0,1fr) 156px 330px}.boardWorkspaceWrap.palette-hidden{grid-template-columns:minmax(0,1fr) 330px}.rightPalette{padding:12px}.atbTileButtons{gap:9px}.atbTileBtn{min-height:88px;padding:8px}.tilePreview--x2{width:58px;height:58px;font-size:20px}.tilePreview--xV{width:36px;height:68px}.tilePreview--xH{width:68px;height:36px}.tilePreview--one{width:36px;height:36px}}
@media (max-width:1060px){.boardWorkspaceWrap{grid-template-columns:minmax(0,1fr)}.rightPalette{position:absolute;left:18px;right:18px;bottom:calc(var(--nav-h) + 94px);max-height:min(360px,44vh);z-index:58;display:none}.rightPalette.is-open{display:block}.rightPalette.is-hidden{display:none}.pwaTileButtons{grid-template-columns:repeat(4,minmax(0,1fr))}.bottomTray{display:flex}.mobilePaletteCluster{display:flex}.taskDrawer{right:18px}}
@media (min-width:1061px){#showPaletteBtn{display:none}.bottomTray .paletteCluster{display:none}.bottomTray{justify-content:flex-end}.taskDrawer.is-collapsed{display:block}.taskDrawer.is-collapsed .stepStack,.taskDrawer.is-collapsed .quizCard{display:none}.taskDrawer.is-collapsed{max-width:100px}.taskDrawer.is-collapsed .drawerHeader h2,.taskDrawer.is-collapsed .drawerHeader .eyebrow{display:none}}
@media (max-width:760px){.rightPalette{left:10px;right:10px;bottom:calc(var(--nav-h) + 82px);border-radius:24px}.pwaTileButtons{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.atbTileBtn{min-height:68px;padding:6px;border-radius:16px}.mobilePaletteCluster{gap:6px}.bottomTray{gap:8px}.trayActions{flex-shrink:0}.paletteCluster{overflow-x:auto;min-width:0}.paletteBtn{min-width:48px;min-height:48px;border-radius:16px}.boardMat{touch-action:none}.floatingHint{max-width:calc(100% - 24px)}}


/* v2.1.2 — use original board/palette/marquee styling inside the new PWA shell */
.boardMat{
  background:var(--atb-mat-bg) !important;
  border:1px solid rgba(0,0,0,.5) !important;
  border-radius:0 !important;
  box-shadow:1px 0 0 rgba(255,255,255,.35) !important;
  background-image:none !important;
}
.selectionMarquee,
.selectionBox{
  position:absolute;
  pointer-events:none;
  border:2px dashed rgba(0,0,0,.55) !important;
  border-radius:4px !important;
  background:rgba(0,0,0,.06) !important;
  z-index:60 !important;
}
.rightPalette{
  width:270px;
  border-radius:0 !important;
  border:0 !important;
  border-left:1px solid rgba(0,0,0,.5) !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:1px 0 0 rgba(255,255,255,.35) !important;
  backdrop-filter:blur(6px) !important;
}
.paletteHeader h2{font-size:15px;font-weight:800;letter-spacing:0;margin:0;}
.paletteInstruction{font-size:12px;color:rgba(12,18,35,.72);}
.bottomTray{border-radius:0 !important;background:rgba(255,255,255,.92) !important;border-color:rgba(0,0,0,.22) !important;}
#showPaletteBtn{display:none !important;}
@media (max-width:1060px){
  .rightPalette,.rightPalette.is-open,.rightPalette.is-hidden{display:none !important;}
  .boardWorkspaceWrap,.boardWorkspaceWrap.palette-hidden{grid-template-columns:minmax(0,1fr) !important;}
  .bottomTray .mobilePaletteCluster{display:flex !important;}
}
@media (min-width:1061px){
  .bottomTray .mobilePaletteCluster{display:none !important;}
}

/* v2.1.3 usability correction: one palette and usable quiz panel */
.boardWorkspaceWrap{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 280px 360px !important;
  gap:12px !important;
  min-height:0 !important;
}
.rightPalette{
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  overflow:auto !important;
  border-radius:0 !important;
  border:1px solid rgba(0,0,0,.45) !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:none !important;
  padding:14px !important;
}
.rightPalette.is-hidden{display:block !important;}
.bottomTray{display:flex !important;}
.boardMat{min-height:430px !important;}
.quizProgressText{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#7a5a36;font-weight:950;margin-bottom:8px;}
.quizProgress{height:9px;border-radius:999px;background:rgba(31,41,51,.10);overflow:hidden;margin-top:12px;}
.quizProgress span{display:block;height:100%;background:#1f2933;border-radius:999px;transition:width 180ms ease;}
.quizScore{font-weight:900;color:#40505f;}
.quizActions{margin-top:12px;}
.quizOption[disabled]{cursor:default;opacity:1;}
.appShell[data-mode="mini-quiz"] .taskDrawer{background:#f3f7fb !important;border-color:rgba(244,202,165,.65) !important;}
.appShell[data-mode="mini-quiz"] .quizCard{box-shadow:0 0 0 4px rgba(244,202,165,.18);}
.appShell[data-mode="mini-quiz"] .taskDrawer .stepStack{display:grid;}
.appShell[data-mode="mini-quiz"] .quizCard{margin-top:14px;}
#showPaletteBtn,#hidePaletteBtn{display:none !important;}
@media (max-width:1060px){
  .boardWorkspaceWrap,.boardWorkspaceWrap.palette-hidden{grid-template-columns:minmax(0,1fr) !important;}
  .rightPalette,.rightPalette.is-open,.rightPalette.is-hidden{display:none !important;}
  .bottomTray .mobilePaletteCluster{display:flex !important;}
  .taskDrawer{display:none;}
  .taskDrawer.is-open{display:block !important;}
  .boardMat{min-height:440px !important;}
}
@media (min-width:1061px){
  .bottomTray .mobilePaletteCluster{display:none !important;}
  .bottomTray{justify-content:flex-end !important;}
}
@media (max-width:760px){
  .boardMat{min-height:420px !important;}
  .bottomTray{position:relative;z-index:70;overflow-x:auto;align-items:center;}
  .paletteCluster{display:flex !important;gap:8px !important;overflow-x:auto !important;}
  .paletteBtn{min-width:58px !important;min-height:58px !important;border-radius:10px !important;background:#fff !important;border:1px solid rgba(0,0,0,.35) !important;}
  .tilePreview--x2{width:46px !important;height:46px !important;}
  .tilePreview--xV{width:28px !important;height:50px !important;}
  .tilePreview--one{width:28px !important;height:28px !important;}
  .tilePreview__label{font-size:18px !important;}
}

/* v2.1.5 — mini-quiz is now its own mode; remove lower tray border */
.bottomTray{
  border:0 !important;
  border-top:0 !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.76) !important;
}
.quizModePanel{
  display:none;
  min-height:0;
  border:1px solid rgba(255,255,255,.86);
  border-radius:30px;
  background:linear-gradient(180deg,rgba(255,252,246,.96),rgba(250,244,235,.94));
  box-shadow:var(--soft-shadow);
  padding:20px;
  overflow:auto;
}
.appShell[data-mode="mini-quiz"] .boardWorkspaceWrap{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModePanel{
  display:grid !important;
  gap:18px;
}
.appShell[data-mode="mini-quiz"] .bottomTray{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .taskDrawer{
  display:none !important;
}
.quizModeHero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:18px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:26px;
  background:rgba(255,255,255,.72);
}
.quizModeHero h2{
  margin:0 0 8px;
  font-size:clamp(26px,4vw,44px);
  line-height:.98;
  letter-spacing:-.055em;
}
.quizModeHero p:not(.eyebrow){
  margin:0;
  max-width:680px;
  color:#5f6872;
  line-height:1.5;
}
.quizModeMeta{
  flex:0 0 auto;
  border-radius:999px;
  padding:10px 14px;
  background:#1f2933;
  color:white;
  font-weight:950;
  font-size:13px;
  box-shadow:0 10px 22px rgba(31,41,51,.18);
}
.quizModeGrid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:18px;
  min-height:0;
}
.quizModeCard,
.quizModeGuide{
  border:1px solid rgba(31,41,51,.10);
  border-radius:28px;
  background:rgba(255,255,255,.78);
  padding:22px;
}
.fullQuizQuestion{
  font-size:clamp(24px,3.4vw,40px);
  font-weight:950;
  line-height:1.08;
  letter-spacing:-.045em;
  margin-bottom:18px;
}
.fullQuizOptions{
  display:grid;
  gap:12px;
}
.fullQuizOptions .quizOption{
  font-size:17px;
  padding:16px 18px;
  border-radius:20px;
  background:#fff;
}
.fullQuizFeedback{
  margin-top:18px;
  min-height:82px;
  padding:16px;
  border-radius:22px;
  background:#f3f7fb;
  border:1px solid rgba(244,202,165,.55);
  font-size:15px;
  line-height:1.45;
}
.quizModeGuide h3{
  margin:0 0 12px;
  font-size:20px;
  letter-spacing:-.03em;
}
.quizModeGuide ol{
  margin:0 0 18px;
  padding-left:20px;
  color:#5f6872;
  line-height:1.55;
  font-weight:700;
}
.quizModeGuide li{margin-bottom:8px;}
@media (max-width:1060px){
  .quizModePanel{border-radius:24px;padding:14px;}
  .quizModeGrid{grid-template-columns:1fr;}
  .quizModeHero{flex-direction:column;}
  .quizModeMeta{align-self:flex-start;}
}
@media (max-width:760px){
  .quizModePanel{padding:10px;border-radius:20px;}
  .quizModeHero,.quizModeCard,.quizModeGuide{border-radius:20px;padding:14px;}
  .fullQuizOptions .quizOption{font-size:15px;padding:13px 14px;}
}

/* v2.1.7 — palette drag correction: no click-to-place, no top-left proxy */
.floatingHint[hidden]{display:none !important;}
@media (min-width:1061px){
  .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) 210px 64px !important;
  }
  .taskDrawer.is-collapsed{
    display:block !important;
    width:64px !important;
    max-width:64px !important;
    min-width:64px !important;
    padding:10px !important;
    overflow:hidden !important;
    align-self:stretch;
  }
  .taskDrawer.is-collapsed .drawerHeader{
    height:100%;
    margin:0 !important;
    display:flex;
    align-items:flex-start;
    justify-content:center;
  }
  .taskDrawer.is-collapsed .drawerHeader > div,
  .taskDrawer.is-collapsed .stepStack,
  .taskDrawer.is-collapsed .quizCard{
    display:none !important;
  }
  .taskDrawer.is-collapsed #collapseDrawerBtn{
    transform:none;
  }
}

/* Board refinement: simplified palette, clearer empty state and delete target. */
.appShell[data-screen="board"] .boardEmptyState{
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  display:grid;
  justify-items:center;
  gap:20px;
  width:min(620px,calc(100% - 48px));
  transform:translate(-50%,-50%);
  color:#98a7b6;
  text-align:center;
  pointer-events:none;
  user-select:none;
}
.appShell[data-screen="board"] .boardEmptyState[hidden]{
  display:none !important;
}
.appShell[data-screen="board"] .boardEmptyStateTiles{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.appShell[data-screen="board"] .boardEmptyStateTile{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border:3px solid rgba(26,35,45,.84);
  border-radius:12px;
  box-shadow:0 8px 0 rgba(60,79,101,.08);
  color:#1d2733;
  font:800 23px/1 var(--font-display,system-ui,sans-serif);
}
.appShell[data-screen="board"] .boardEmptyStateTile--positive{
  background:var(--tile-yellow);
}
.appShell[data-screen="board"] .boardEmptyStateTile--negative{
  background:var(--tile-negative);
  color:#17191c;
}
.appShell[data-screen="board"] .boardEmptyState p{
  margin:0;
  font:800 clamp(25px,3vw,38px)/1.15 var(--font-display,system-ui,sans-serif);
  letter-spacing:-.025em;
}
.appShell[data-screen="board"] .boardTrashDrop{
  min-width:154px !important;
  min-height:56px !important;
  padding:0 18px !important;
  gap:10px !important;
  border-radius:19px !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 12px 30px rgba(31,55,83,.11) !important;
}
.appShell[data-screen="board"] .boardTrashDrop > img{
  width:24px !important;
  height:24px !important;
}
.appShell[data-screen="board"] .boardTrashDrop > span{
  font-size:12px !important;
  font-weight:800 !important;
}
.appShell[data-screen="board"] #rightPalette.rightPalette,
.appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
  align-items:center !important;
  justify-content:center !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
  grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
  grid-template-rows:var(--palette-x2) var(--palette-unit) 14px var(--palette-x2) var(--palette-unit) !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(5){grid-column:1 !important;grid-row:4 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(6){grid-column:2 !important;grid-row:4 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(7){grid-column:1 !important;grid-row:5 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(8){grid-column:2 !important;grid-row:5 !important;}

@media (max-width:1060px){
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    left:max(12px,env(safe-area-inset-left)) !important;
    top:auto !important;
    bottom:max(12px,env(safe-area-inset-bottom)) !important;
    z-index:96 !important;
    min-height:48px !important;
    padding:0 13px 0 11px !important;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn img{
    width:23px !important;
    height:23px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    position:absolute !important;
    left:max(88px,calc(env(safe-area-inset-left) + 82px)) !important;
    right:max(12px,env(safe-area-inset-right)) !important;
    top:auto !important;
    bottom:max(10px,env(safe-area-inset-bottom)) !important;
    z-index:94 !important;
    display:none !important;
    width:auto !important;
    height:auto !important;
    max-height:none !important;
    padding:9px 10px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    border-radius:20px !important;
    background:rgba(248,251,255,.95) !important;
    box-shadow:0 14px 38px rgba(31,55,83,.18) !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    --palette-x2:64px;
    --palette-unit:26px;
    --palette-gap:4px;
    grid-template-columns:var(--palette-x2) var(--palette-unit) 12px var(--palette-x2) var(--palette-unit) !important;
    grid-template-rows:var(--palette-x2) var(--palette-unit) !important;
    width:calc((var(--palette-x2) + var(--palette-unit)) * 2 + 28px) !important;
    min-width:calc((var(--palette-x2) + var(--palette-unit)) * 2 + 28px) !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(5){grid-column:4 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(6){grid-column:5 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(7){grid-column:4 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(8){grid-column:5 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .boardTrashDrop{
    left:max(12px,env(safe-area-inset-left)) !important;
    bottom:max(82px,calc(env(safe-area-inset-bottom) + 76px)) !important;
    min-width:136px !important;
    min-height:52px !important;
    padding-inline:15px !important;
  }
  .appShell[data-screen="board"] .boardEmptyState{
    gap:15px;
    width:calc(100% - 36px);
  }
  .appShell[data-screen="board"] .boardEmptyStateTile{
    width:48px;
    height:48px;
    border-width:2px;
    border-radius:10px;
    font-size:19px;
  }
  .appShell[data-screen="board"] .boardEmptyState p{
    font-size:clamp(20px,6vw,28px);
  }
}

@media (max-width:360px){
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    --palette-x2:58px;
    --palette-unit:24px;
    grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
    width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
    min-width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    left:max(8px,env(safe-area-inset-left)) !important;
    min-height:44px !important;
    padding-inline:9px 10px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    left:max(78px,calc(env(safe-area-inset-left) + 72px)) !important;
    right:max(8px,env(safe-area-inset-right)) !important;
    padding-inline:7px !important;
  }
}

/* Compact empty-state scale and restored desktop palette grouping. */
.appShell[data-screen="board"] .boardEmptyState{
  gap:10px !important;
  width:min(440px,calc(100% - 40px)) !important;
}
.appShell[data-screen="board"] .boardEmptyStateTiles{
  gap:8px !important;
}
.appShell[data-screen="board"] .boardEmptyStateTile{
  width:40px !important;
  height:40px !important;
  border-width:2px !important;
  border-radius:9px !important;
  box-shadow:0 5px 0 rgba(60,79,101,.07) !important;
  font-size:17px !important;
}
.appShell[data-screen="board"] .boardEmptyState p{
  font-size:clamp(17px,2vw,22px) !important;
  line-height:1.2 !important;
  letter-spacing:-.015em !important;
}

.appShell[data-screen="board"] .boardEmptyState{
  transition:opacity 150ms ease !important;
}
.appShell[data-screen="board"] .boardEmptyState.is-drag-over{
  opacity:.16;
}
.appShell[data-screen="board"] .boardStatusMessage{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
}
.appShell[data-screen="board"] #boardToolZeroBtn.show-action-feedback::before{
  position:absolute;
  top:50%;
  right:calc(100% + 10px);
  z-index:75;
  padding:8px 10px;
  border:1px solid rgba(8,119,248,.18);
  border-radius:11px;
  background:rgba(248,251,255,.97);
  box-shadow:0 10px 24px rgba(31,55,83,.13);
  color:#344054;
  content:attr(data-action-feedback);
  font:800 11px/1.25 var(--tiles-ui-font,"Nunito",system-ui,sans-serif);
  pointer-events:none;
  transform:translateY(-50%);
  white-space:nowrap;
}
.appShell[data-screen="board"] #boardToolZeroBtn.show-action-feedback::after{
  opacity:0 !important;
}

@media (max-width:1060px){
  .appShell[data-screen="board"] #rightPalette .paletteHeader,
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection > h2{
    display:none !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteSections{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    width:max-content !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection,
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection + .tilePaletteSection{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
    grid-template-rows:var(--palette-x2) var(--palette-unit) !important;
    width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
    min-width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .boardEmptyState{
    gap:9px !important;
    width:calc(100% - 30px) !important;
  }
  .appShell[data-screen="board"] .boardEmptyStateTile{
    width:36px !important;
    height:36px !important;
    font-size:15px !important;
  }
  .appShell[data-screen="board"] .boardEmptyState p{
    max-width:300px;
    font-size:18px !important;
  }
}

/* v2.1.95 - desktop home button, compact toolbar help and transforming panel. */
.boardHomeBtn{
  position:absolute;
  left:max(18px,env(safe-area-inset-left));
  top:max(18px,env(safe-area-inset-top));
  z-index:82;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 14px;
  border:1px solid rgba(31,41,51,.12);
  border-radius:999px;
  background:rgba(255,255,255,.86);
  color:#1f2933;
  box-shadow:0 12px 26px rgba(31,41,51,.10);
  backdrop-filter:blur(14px);
  font:900 13px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer;
}
.boardStage{
  position:relative;
}
.boardHomeBtn:hover,
.boardHomeBtn:focus-visible{
  background:#fff;
  border-color:rgba(79,128,212,.28);
  outline:none;
}
.boardHomeBtn span:first-child{
  font-size:17px;
}
@media (max-width:1060px){
  .boardHomeBtn{
    display:none;
  }
}
.toolbarHelpFlyout{
  position:absolute;
  right:70px;
  top:16px;
  z-index:96;
  width:min(430px,calc(100% - 120px));
  max-height:min(660px,calc(100% - 32px));
  overflow:auto;
  padding:18px;
  border:1px solid rgba(31,41,51,.14);
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 24px 58px rgba(31,41,51,.22);
  backdrop-filter:blur(18px);
}
.toolbarHelpFlyout[hidden]{
  display:none !important;
}
.toolbarHelpFlyout::before{
  content:"";
  position:absolute;
  right:20px;
  top:-10px;
  width:22px;
  height:22px;
  transform:rotate(45deg);
  border-left:1px solid rgba(31,41,51,.12);
  border-top:1px solid rgba(31,41,51,.12);
  background:rgba(255,255,255,.96);
}
.toolbarHelpFlyout header{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.toolbarHelpFlyout h2{
  margin:0;
  color:#111827;
  font-size:28px;
  line-height:1;
  letter-spacing:-.04em;
}
.toolbarHelpList{
  display:grid;
  gap:8px;
}
.toolbarHelpItem{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:start;
  gap:10px;
  padding:9px 10px;
  border-radius:16px;
  background:rgba(247,248,251,.72);
}
.toolbarHelpSymbol{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(31,41,51,.12);
  border-radius:12px;
  background:#fff;
  color:#1f2933;
  font:950 18px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.toolbarHelpItem strong{
  display:block;
  color:#111827;
  font-size:14px;
  line-height:1.25;
}
.toolbarHelpItem strong em{
  color:#5f9df7;
  font-style:normal;
  font-weight:900;
}
.toolbarHelpItem small{
  display:block;
  margin-top:3px;
  color:#4f5b67;
  font-size:13px;
  line-height:1.35;
}
.transformPanel{
  position:absolute;
  top:16px;
  right:70px;
  z-index:72;
  width:min(330px,calc(100% - 126px));
  max-height:calc(100% - 32px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(31,41,51,.12);
  border-radius:24px;
  background:rgba(255,255,255,.88);
  box-shadow:0 18px 42px rgba(31,41,51,.12);
  backdrop-filter:blur(16px);
}
.transformPanel[hidden]{
  display:none !important;
}
.transformPanelHeader{
  position:static !important;
  padding:16px !important;
  background:rgba(255,255,255,.72) !important;
}
.transformPanelHeader h2{
  margin:0;
  font-size:18px;
  letter-spacing:-.025em;
}
.transformPanelStack{
  min-height:0;
  overflow:auto;
  padding:14px !important;
  gap:10px !important;
}
.transformPanelCard{
  border-radius:16px !important;
  padding:12px !important;
}
.transformPanelCard span{
  display:block;
  margin-bottom:5px;
  color:#6b7280;
  font:900 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  text-transform:uppercase;
  letter-spacing:.10em;
}
.transformPanelCard strong{
  color:#111827;
  font-size:20px;
  line-height:1.2;
}
.transformHistory{
  display:grid;
  gap:8px;
  max-height:230px;
  overflow:auto;
}
.transformHistory article{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:8px;
  align-items:start;
  padding:8px;
  border-radius:12px;
  background:#f7f8fb;
}
.transformHistory article > span{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  margin:0;
  border-radius:9px;
  background:#1f2933;
  color:#fff;
  font-size:12px;
  letter-spacing:0;
}
.transformHistory p,
.transformEmpty{
  margin:3px 0 0;
  color:#4f5b67;
  font-weight:760;
}
@media (max-width:1060px){
  .toolbarHelpFlyout{
    position:fixed;
    left:max(14px,env(safe-area-inset-left));
    right:max(14px,env(safe-area-inset-right));
    top:auto;
    bottom:max(18px,calc(env(safe-area-inset-bottom) + 18px));
    width:auto;
    max-height:min(72dvh,620px);
    border-radius:26px;
  }
  .toolbarHelpFlyout::before{
    display:none;
  }
  .transformPanel{
    left:max(14px,env(safe-area-inset-left));
    right:max(14px,env(safe-area-inset-right));
    top:auto;
    bottom:max(86px,calc(env(safe-area-inset-bottom) + 86px));
    width:auto;
    max-height:min(44dvh,360px);
  }
}
.paletteDragProxy{
  position:fixed !important;
  left:0;
  top:0;
  transform:translate3d(var(--proxyX,0px),var(--proxyY,0px),0) scale(var(--proxyZoom,1)) !important;
  transform-origin:0 0 !important;
  z-index:9999 !important;
  pointer-events:none !important;
  opacity:.96;
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.18));
  contain:layout style paint;
  will-change:transform;
}


/* v2.1.13 — narrower desktop palette and removed click-to-place instruction copy. */
@media (min-width:1061px){
  .boardWorkspaceWrap{grid-template-columns:minmax(0,1fr) 164px 360px !important;}
  .boardWorkspaceWrap.palette-hidden{grid-template-columns:minmax(0,1fr) 360px !important;}
  .rightPalette{padding:12px 10px !important;}
  .paletteHeader{margin-bottom:10px !important;}
  .paletteInstruction{display:none !important;}
}

/* v2.1.36 — fixed-width polished palette across desktop and mobile. */
@media (min-width:1061px){
  .boardWorkspaceWrap,
  .boardWorkspaceWrap.drawer-collapsed{
    --palette-column:164px;
  }
  .boardWorkspaceWrap{
    grid-template-columns:minmax(0,1fr) var(--palette-column) 360px !important;
  }
  .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) var(--palette-column) 64px !important;
  }
  #rightPalette.rightPalette{
    display:flex !important;
    flex-direction:column !important;
    width:var(--palette-column,164px) !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    overflow:auto !important;
    padding:14px 12px !important;
  }
  #rightPalette .paletteHeader{
    display:block !important;
    text-align:center !important;
    margin:0 0 12px !important;
  }
  #rightPalette .paletteHeader > div{
    width:100% !important;
  }
  #rightPalette .paletteHeader h2,
  #rightPalette #hidePaletteBtn{
    display:none !important;
  }
  #rightPalette .paletteHeader .eyebrow{
    margin:0 !important;
    color:#6b7280 !important;
    text-align:center !important;
  }
  #rightPalette .paletteHint{
    max-width:126px !important;
    margin:5px auto 0 !important;
    color:#667085 !important;
    font-size:11px !important;
    font-weight:750 !important;
    line-height:1.25 !important;
    text-align:center !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons{
    --palette-x2:84px;
    --palette-unit:30px;
    --palette-gap:4px;
    display:grid !important;
    grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
    grid-template-rows:var(--palette-x2) var(--palette-unit) 20px var(--palette-x2) var(--palette-unit) !important;
    gap:var(--palette-gap) !important;
    justify-content:center !important;
    justify-items:stretch !important;
    align-items:stretch !important;
    width:calc(var(--palette-x2) + var(--palette-gap) + var(--palette-unit)) !important;
    margin:4px auto 18px !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn{
    width:100% !important;
    height:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
    display:grid !important;
    place-items:center !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:focus-visible{
    outline:2px solid rgba(31,41,51,.72) !important;
    outline-offset:3px !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(5){grid-column:1 !important;grid-row:4 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(6){grid-column:2 !important;grid-row:4 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(7){grid-column:1 !important;grid-row:5 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons > .atbTileBtn.paletteBtn:nth-child(8){grid-column:2 !important;grid-row:5 !important;}
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--x2{
    width:var(--palette-x2) !important;
    height:var(--palette-x2) !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--xV{
    width:var(--palette-unit) !important;
    height:var(--palette-x2) !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--xH{
    width:var(--palette-x2) !important;
    height:var(--palette-unit) !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--one{
    width:var(--palette-unit) !important;
    height:var(--palette-unit) !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview__label{
    font-size:24px !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--xV .tilePreview__label{
    font-size:21px !important;
  }
  #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--one .tilePreview__label{
    font-size:27px !important;
  }
  #rightPalette .paletteActions{
    margin-top:auto !important;
    padding-top:14px !important;
    display:grid !important;
    gap:8px !important;
  }
  #rightPalette .paletteActionBtn{
    appearance:none !important;
    width:100% !important;
    min-height:38px !important;
    border:1px solid rgba(31,41,51,.22) !important;
    border-radius:10px !important;
    background:rgba(255,255,255,.9) !important;
    color:#1f2933 !important;
    box-shadow:0 5px 14px rgba(31,41,51,.07) !important;
    cursor:pointer !important;
    font:850 13px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  }
  #rightPalette .paletteActionBtn:hover{
    background:#fff !important;
    border-color:rgba(31,41,51,.34) !important;
  }
  #rightPalette .paletteActionBtn:active{
    transform:translateY(1px) !important;
  }
  #rightPalette .paletteActionBtn--reset{
    border-color:rgba(209,59,59,.3) !important;
    background:rgba(255,245,245,.94) !important;
  }
}

/* Board layering and responsive palette component defaults. */
.appShell[data-screen="board"] .tile.is-selected{
  z-index:var(--selection-z,90) !important;
}
.appShell[data-screen="board"] .tile.is-dragging{
  z-index:200 !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteContent{
  width:100%;
  min-width:0;
}

@media (min-width:1061px){
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{
    display:none !important;
  }
}

@media (max-width:1060px){
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open,
  .appShell[data-screen="board"] #rightPalette.rightPalette[hidden]{
    position:fixed !important;
    inset:auto max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) auto !important;
    z-index:96 !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    justify-content:flex-end !important;
    width:72px !important;
    min-width:72px !important;
    height:56px !important;
    min-height:56px !important;
    max-height:116px !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid rgba(57,82,111,.14) !important;
    border-radius:18px !important;
    background:rgba(248,251,255,.96) !important;
    box-shadow:0 14px 38px rgba(31,55,83,.18) !important;
    transition:width .2s ease,height .2s ease,border-radius .2s ease !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    right:env(safe-area-inset-right) !important;
    bottom:0 !important;
    left:env(safe-area-inset-left) !important;
    width:auto !important;
    min-width:0 !important;
    height:calc(116px + env(safe-area-inset-bottom)) !important;
    padding-bottom:env(safe-area-inset-bottom) !important;
    box-sizing:border-box !important;
    border-radius:20px 20px 0 0 !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteContent{
    display:none !important;
    flex:1 1 auto;
    min-width:0;
    padding:9px 6px 9px 10px;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
  }
  .appShell[data-screen="board"] #rightPalette.is-open .tilePaletteContent{
    display:flex !important;
    align-items:center;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    display:flex !important;
    flex:0 0 70px;
    width:70px !important;
    min-width:70px !important;
    min-height:54px !important;
    height:auto !important;
    align-items:center !important;
    justify-content:center !important;
    flex-direction:column !important;
    gap:3px !important;
    padding:5px 7px !important;
    border:0 !important;
    border-left:1px solid transparent !important;
    border-radius:17px !important;
    background:transparent !important;
    color:#536174 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    font:800 9px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    letter-spacing:.12em;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
  .appShell[data-screen="board"] #rightPalette.is-open .boardPaletteToggleBtn{
    border-left-color:rgba(57,82,111,.12) !important;
    border-radius:0 19px 19px 0 !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn img{
    width:22px !important;
    height:22px !important;
    filter:none !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn.is-active{
    background:transparent !important;
    color:#536174 !important;
  }
  .appShell[data-screen="board"] .boardTrashDrop{
    position:absolute !important;
    top:auto !important;
    right:auto !important;
    left:12px !important;
    bottom:12px !important;
    margin:0 !important;
    transform:none;
  }
  .appShell[data-screen="board"] .boardTrashDrop.is-over,
  .appShell[data-screen="board"] .boardTrashDrop.is-active,
  .appShell[data-screen="board"] .boardTrashDrop[data-over="true"]{
    transform:scale(1.07);
  }
}

@media (max-width:420px){
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    right:env(safe-area-inset-right) !important;
    left:env(safe-area-inset-left) !important;
    width:auto !important;
  }
}

@media (max-width:1060px){
  .bottomTray .mobilePaletteCluster{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    min-width:0 !important;
    padding:2px 2px 2px 0 !important;
    overflow-x:auto !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn{
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    display:grid !important;
    place-items:center !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn:active{
    transform:translateY(1px) !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--x2{
    width:50px !important;
    height:50px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xV{
    width:27px !important;
    height:54px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xH{
    width:54px !important;
    height:27px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one{
    width:31px !important;
    height:31px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview__label{
    font-size:20px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{
    font-size:25px !important;
  }
}

@media (max-width:760px){
  .bottomTray .mobilePaletteCluster{
    gap:8px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--x2{
    width:45px !important;
    height:45px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xV{
    width:24px !important;
    height:48px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xH{
    width:48px !important;
    height:24px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one{
    width:28px !important;
    height:28px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview__label{
    font-size:19px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{
    font-size:23px !important;
  }
}

/* v2.1.37 — fuller compact palette, clearer modes label and Snap with board actions. */
.modeRailTitle{
  display:grid !important;
  gap:2px !important;
  justify-items:center !important;
  text-align:center !important;
  margin:6px 0 12px !important;
}
.modeRailHint{
  color:#667085 !important;
  font-size:11px !important;
  font-weight:750 !important;
  line-height:1.15 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}
.modeRailTitleText{
  color:#667085 !important;
  font-size:11px !important;
  font-weight:950 !important;
  letter-spacing:.12em !important;
  line-height:1.1 !important;
  text-transform:uppercase !important;
}
@media (min-width:1061px){
  #mobileSnapBtn{
    display:none !important;
  }
  #rightPalette .paletteActionBtn--snap.is-active{
    border-color:rgba(46,125,50,.28) !important;
    background:rgba(235,249,237,.95) !important;
  }
}
@media (max-width:1060px){
  .bottomTray{
    align-items:center !important;
  }
  .bottomTray .mobilePaletteCluster{
    flex:1 1 auto !important;
    justify-content:center !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--x2{
    width:46px !important;
    height:46px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xV{
    width:25px !important;
    height:50px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xH{
    width:50px !important;
    height:25px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one{
    width:29px !important;
    height:29px !important;
  }
  .bottomTray .mobileSnapBtn{
    border-color:rgba(46,125,50,.28) !important;
    background:rgba(235,249,237,.95) !important;
    min-width:76px !important;
  }
  .bottomTray .mobileSnapBtn:not(.is-active){
    border-color:rgba(31,41,51,.16) !important;
    background:rgba(255,255,255,.72) !important;
  }
}
@media (max-width:760px){
  .bottomTray{
    align-items:center !important;
  }
  .bottomTray .mobilePaletteCluster{
    flex:0 0 auto !important;
    display:grid !important;
    grid-template-columns:42px 24px 42px 28px !important;
    grid-template-rows:42px 42px !important;
    gap:6px 7px !important;
    justify-content:start !important;
    align-items:center !important;
    overflow:visible !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn{
    width:100% !important;
    height:100% !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--x2{
    width:42px !important;
    height:42px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xV{
    width:23px !important;
    height:42px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xH{
    width:42px !important;
    height:23px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one{
    width:27px !important;
    height:27px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview__label{
    font-size:18px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{
    font-size:22px !important;
  }
  .bottomTray .trayActions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
    flex:0 0 74px !important;
  }
  .bottomTray .trayActions .pillBtn{
    min-height:28px !important;
    min-width:0 !important;
    padding:0 8px !important;
    font-size:11px !important;
  }
}

/* v2.1.38 — remove top mode/help dropdowns and make phone palette scroll horizontally. */
.modeRail{
  display:flex !important;
  flex-direction:column !important;
}
.modeRailList{
  min-height:0 !important;
}
.modeRailHelp{
  display:grid !important;
  gap:6px !important;
  margin-top:auto !important;
  padding-top:12px !important;
}
.modeRailHelp .fieldLabel{
  text-align:center !important;
}
.modeRailHelp .modeSelect{
  width:100% !important;
  min-width:0 !important;
  height:34px !important;
  padding:0 28px 0 10px !important;
  font-size:12px !important;
}
#app[data-mode="free-play"] .modeRailHelp,
#app[data-mode="mini-quiz"] .modeRailHelp{
  display:none !important;
}
.toolbarGroup--currentMode{
  min-width:0 !important;
}
.currentModePill{
  min-height:38px;
  display:flex;
  align-items:center;
  padding:0 14px;
  border:1px solid rgba(31,41,51,.14);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#1f2933;
  font-weight:900;
}
.stepsToggleBtn{
  margin-left:auto;
}
@media (max-width:1060px){
  .modeRail{
    display:none !important;
  }
  .bottomTray{
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) !important;
    gap:10px !important;
    overflow:hidden !important;
  }
  .bottomTray .trayActions{
    order:0 !important;
    display:flex !important;
    flex:0 0 auto !important;
    align-items:center !important;
    gap:7px !important;
  }
  .bottomTray .trayActions [hidden]{
    display:none !important;
  }
  .bottomTray .trayActions .pillBtn{
    min-width:74px !important;
    min-height:34px !important;
    padding:0 9px !important;
    border-radius:10px !important;
    font-size:11px !important;
    line-height:1.05 !important;
    white-space:normal !important;
  }
  .bottomTray .mobilePaletteCluster{
    order:1 !important;
    display:flex !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    width:100% !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:9px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:2px 2px 4px !important;
    scrollbar-width:thin;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn{
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
  }
}
@media (max-width:760px){
  .boardToolbar{
    align-items:end !important;
  }
  .currentModePill{
    min-height:34px;
    padding:0 11px;
    font-size:12px;
  }
  .stepsToggleBtn{
    min-height:34px !important;
  }
  .bottomTray{
    grid-template-columns:78px minmax(0,1fr) !important;
    gap:8px !important;
  }
  .bottomTray .trayActions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
    width:78px !important;
  }
  .bottomTray .trayActions .pillBtn{
    min-width:0 !important;
    width:100% !important;
    min-height:27px !important;
    padding:0 6px !important;
    font-size:10px !important;
  }
  .bottomTray .mobilePaletteCluster{
    display:flex !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    width:100% !important;
    gap:8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    justify-content:flex-start !important;
    align-items:center !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn{
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--x2{
    width:42px !important;
    height:42px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xV{
    width:23px !important;
    height:46px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--xH{
    width:46px !important;
    height:23px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview--one{
    width:27px !important;
    height:27px !important;
  }
}

/* v2.1.40 - right-side mobile actions, no desktop bottom tray and clearer help controls. */
.helpModeChooser{
  display:grid !important;
  gap:5px !important;
}
.helpModeBtn{
  appearance:none !important;
  min-height:30px !important;
  width:100% !important;
  border:1px solid rgba(31,41,51,.14) !important;
  border-radius:9px !important;
  background:rgba(255,255,255,.72) !important;
  color:#40505f !important;
  cursor:pointer !important;
  font:850 11px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}
.helpModeBtn.is-active{
  border-color:rgba(46,125,50,.3) !important;
  background:rgba(235,249,237,.96) !important;
  color:#1f2933 !important;
}
.helpModeBtn:focus-visible{
  outline:2px solid rgba(31,41,51,.62) !important;
  outline-offset:2px !important;
}
@media (min-width:1061px){
  .bottomTray{
    display:none !important;
  }
}
@media (max-width:1060px){
  .bottomTray{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 96px !important;
    align-items:center !important;
    gap:10px !important;
    overflow:hidden !important;
  }
  .bottomTray .mobilePaletteCluster{
    order:0 !important;
    display:flex !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    width:100% !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:9px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:2px 2px 4px !important;
  }
  .bottomTray .trayActions{
    order:1 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
    width:96px !important;
    flex:0 0 96px !important;
  }
  .bottomTray .trayActions [hidden]{
    display:none !important;
  }
  .bottomTray .trayActions .pillBtn{
    width:100% !important;
    min-width:0 !important;
    min-height:32px !important;
    padding:0 7px !important;
    border-radius:10px !important;
    font-size:11px !important;
    line-height:1.05 !important;
    white-space:normal !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn{
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
  }
}
@media (max-width:760px){
  .bottomTray{
    grid-template-columns:minmax(0,1fr) 80px !important;
    gap:8px !important;
  }
  .bottomTray .trayActions{
    width:80px !important;
    flex-basis:80px !important;
    gap:5px !important;
  }
  .bottomTray .trayActions .pillBtn{
    min-height:27px !important;
    padding:0 5px !important;
    font-size:10px !important;
  }
}

/* v2.1.41 - board panning and matched board/palette tile typography. */
.boardMat{
  --board-pan-x:0px;
  --board-pan-y:0px;
  --board-zoom:1;
}
.tileLayer{
  z-index:10 !important;
  transform:translate(var(--board-pan-x),var(--board-pan-y)) scale(var(--board-zoom)) !important;
  transform-origin:0 0 !important;
  will-change:transform;
}
.tileGhost{
  transform:translate(var(--board-pan-x),var(--board-pan-y)) scale(var(--board-zoom)) translate(var(--ghostX,0px),var(--ghostY,0px)) !important;
  transform-origin:0 0 !important;
}
.tile.is-dragging{
  will-change:transform;
  filter:none !important;
}
.tileGhost:not([hidden]){
  will-change:transform;
  contain:layout style;
}
.tileGhost.tileGhost--group{
  width:0 !important;
  height:0 !important;
  border:0 !important;
  background:transparent !important;
}
.tileGhostPiece{
  position:absolute;
  left:0;
  top:0;
  width:var(--pieceW);
  height:var(--pieceH);
  transform:translate(var(--pieceX),var(--pieceY));
  box-sizing:border-box;
  border:2px dashed rgba(0,0,0,.5);
  border-radius:4px;
  background:rgba(0,0,0,.045);
}
.tileGhost--large .tileGhostPiece{
  border-color:rgba(0,0,0,.42);
  background:rgba(0,0,0,.035);
}
.snapGhostCanvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:24;
  pointer-events:none;
  contain:strict;
}
.boardMat.is-snap-settling .tile{
  pointer-events:none;
}
.selectionMarquee{
  transform:none !important;
  transform-origin:0 0 !important;
}
.homeInfoPanel{
  max-width:1180px;
  margin:24px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:18px 20px;
  border:1px solid rgba(255,255,255,.86);
  border-radius:26px;
  background:rgba(255,255,255,.66);
  box-shadow:var(--soft-shadow);
}
.homeInfoPanel h2{
  margin:0 0 6px;
  font-size:clamp(20px,2.2vw,28px);
  letter-spacing:-.035em;
}
.homeInfoPanel p:not(.eyebrow){
  margin:0;
  color:#5f6872;
  line-height:1.42;
}
.homeInfoActions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.homeProductBanner{
  max-width:1180px;
  margin:0 auto 16px;
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:26px;
  background:linear-gradient(90deg,rgba(255,255,255,.88),rgba(238,244,255,.78));
  box-shadow:var(--soft-shadow);
}
.homeProductBanner img{
  width:58px;
  height:64px;
  object-fit:contain;
  display:block;
  flex:0 0 auto;
}
.homeProductBanner .eyebrow{
  margin:0 0 4px;
}
.homeProductBanner strong{
  display:block;
  color:#1f2933;
  font-size:clamp(20px,2.3vw,30px);
  line-height:1;
  letter-spacing:-.035em;
}
.boardMat.is-pan-ready{
  cursor:grab !important;
}
.boardMat.is-panning,
.boardMat.is-panning *{
  cursor:grabbing !important;
}
.boardMat.is-pan-ready .tile{
  cursor:grab !important;
}
.tile__label,
.tile__label *,
.tilePreview__label,
.tilePreview__label *{
  font-family:var(--tile-font-family) !important;
  font-style:normal !important;
  font-weight:400 !important;
  line-height:1 !important;
}

/* v2.1.42 - compact board chrome, release-note cards and cleaner negative labels. */
.boardToolbar{
  display:none !important;
}
.boardStage{
  grid-template-rows:minmax(0,1fr) auto !important;
  padding:clamp(8px,1.15vw,14px) !important;
  gap:clamp(8px,1vw,12px) !important;
}
.boardModeBadge{
  position:absolute;
  right:12px;
  top:12px;
  z-index:45;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:min(360px,calc(100% - 24px));
  padding:7px 8px 7px 10px;
  border:1px solid rgba(31,41,51,.14);
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(12px);
  box-shadow:0 8px 20px rgba(31,41,51,.10);
  color:#1f2933;
  font:850 12px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.boardModeBadge span{
  color:#667085;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:10px;
}
.boardModeBadge strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.boardModeHelpBtn{
  appearance:none;
  border:1px solid rgba(31,41,51,.16);
  background:#fff;
  color:#1f2933;
  border-radius:8px;
  min-height:26px;
  padding:0 9px;
  font:850 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.overlayRoot[data-page="release"] .overlayPanel,
.overlayRoot[data-page="about"] .overlayPanel,
.overlayRoot[data-page="licence"] .overlayPanel,
.overlayRoot[data-page="help"] .overlayPanel{
  width:min(1120px,calc(100vw - 28px));
}
.overlayPanel{
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
.overlayHeader{
  gap:12px;
  flex:0 0 auto;
}
.overlayTitleBlock{
  min-width:0;
  flex:1 1 auto;
}
.overlayProductBadge{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:32px;
  padding:5px 9px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:999px;
  background:rgba(255,255,255,.62);
  color:#4b5563;
  font:850 11px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  white-space:nowrap;
}
.overlayProductBadge img{
  width:24px;
  height:26px;
  object-fit:contain;
  display:block;
}
.overlayPageTabs{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex:0 1 auto;
  flex-wrap:wrap;
}
.overlayPageTab{
  appearance:none;
  min-height:30px;
  padding:0 10px;
  border:1px solid rgba(31,41,51,.12);
  border-radius:999px;
  background:rgba(255,255,255,.66);
  color:#40505f;
  font:850 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.overlayPageTab.is-active{
  background:#1f2933;
  border-color:#1f2933;
  color:#fff;
}
.overlayStack{
  min-height:0;
  overflow:auto;
}
.overlayNavControls{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}
.overlayNavBtn{
  appearance:none;
  width:30px;
  height:30px;
  padding:0;
  border:1px solid rgba(31,41,51,.12);
  border-radius:999px;
  background:rgba(255,255,255,.70);
  color:#1f2933;
  font:850 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  box-shadow:0 4px 10px rgba(31,41,51,.06);
}
.overlayNavBtn:disabled{
  opacity:.36;
  cursor:default;
  box-shadow:none;
}
.releaseNotes,
.shortcutGrid{
  display:grid;
  gap:12px;
}
.releasePage,
.overlayDocPage{
  display:grid;
  gap:12px;
  min-height:0;
  padding-bottom:0;
}
.overlayRoot[data-page="about"] .overlayStack,
.overlayRoot[data-page="help"] .overlayStack,
.overlayRoot[data-page="licence"] .overlayStack{
  padding-bottom:14px !important;
  scroll-padding-bottom:52px;
}
.overlayScrollEndSpacer{
  height:30px;
  min-height:30px;
  pointer-events:none;
}
.overlayRoot[data-page="release"] .overlayStack{
  flex:1 1 auto;
  display:flex;
  min-height:0;
  padding-bottom:8px;
}
.overlayRoot[data-page="release"] .overlayStack{
  overflow:hidden;
}
.overlayRoot[data-page="release"] .releasePage{
  grid-template-rows:auto minmax(0,1fr);
  flex:1 1 auto;
  width:100%;
  max-height:none;
}
.overlayRoot[data-page="release"] .releaseNotes{
  min-height:0;
  overflow:auto;
  padding:0 6px 0 0;
}
.releaseControls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  padding:0 6px 0 0;
}
.releaseDevToggle{
  appearance:none;
  min-height:30px;
  padding:0 11px;
  border:1px solid rgba(31,41,51,.14);
  border-radius:999px;
  background:rgba(31,41,51,.08);
  color:#1f2933;
  font:850 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  white-space:nowrap;
}
.releaseDevToggle[aria-pressed="true"]{
  background:#1f2933;
  color:#fff;
  border-color:#1f2933;
}
.releaseNoteVersion{
  margin-bottom:6px;
  color:#667085;
  font-size:11px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.releaseNoteCard h3,
.shortcutCard h3,
.versionCard h3{
  margin:0 0 8px;
}
.releaseNoteCard ul{
  margin:10px 0 0;
  padding-left:20px;
  color:#4b5563;
  line-height:1.45;
}
.releaseBreaking,
.releaseDeveloperNotes{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(31,41,51,.10);
}
.releaseBreaking strong,
.releaseDeveloperNotes strong{
  color:#1f2933;
  font-size:13px;
}
.releaseDeveloperNotes{
  display:none;
}
.releasePage.show-developer-notes .releaseDeveloperNotes{
  display:block;
}
.currentReleaseCard{
  border-color:rgba(79,128,212,.24);
  background:rgba(238,244,255,.72);
}
.currentVersionCard{
  border-color:rgba(31,41,51,.12);
  background:rgba(255,255,255,.78);
}
.aboutIntroCard{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.aboutIntroText{
  min-width:0;
}
.aboutTopRow{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(260px,3fr);
  gap:12px;
  align-items:stretch;
}
.aboutTopRow > .overlayCard{
  min-height:100%;
}
.aboutTopRow .currentVersionCard{
  display:flex;
  align-items:center;
}
.aboutBrickGrid{
  grid-template-columns:repeat(16,minmax(0,1fr));
  align-items:start;
}
.aboutBrickGrid .aboutBrick{
  grid-column:span 8;
}
.aboutBrickGrid .aboutBrick:nth-of-type(1){
  grid-column:span 5;
}
.aboutBrickGrid .aboutBrick:nth-of-type(2){
  grid-column:span 11;
}
.aboutBrickGrid .aboutBrick:nth-of-type(3){
  grid-column:span 7;
}
.aboutBrickGrid .aboutBrick:nth-of-type(4){
  grid-column:span 9;
}
.aboutBrickGrid .aboutBrick:nth-of-type(5){
  grid-column:span 10;
}
.aboutBrickGrid .aboutBrick:nth-of-type(6){
  grid-column:span 6;
}
.aboutBrickGrid .overlayFooterNote,
.aboutBrickGrid .overlayScrollEndSpacer{
  grid-column:1 / -1;
}
.helpDocPage{
  align-items:start;
}
.helpMainCards{
  display:grid;
  gap:12px;
}
.helpTipCard h3{
  font-size:17px;
}
.helpTipCard p{
  font-size:14px;
}
.helpActionRow{
  margin-top:12px;
}
.helpStepsBtn{
  appearance:none;
  min-height:32px;
  padding:0 13px;
  border:1px solid rgba(31,41,51,.14);
  border-radius:999px;
  background:rgba(31,41,51,.88);
  color:#fff;
  font:850 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  box-shadow:0 6px 14px rgba(31,41,51,.10);
}
.helpStepsBtn:hover{
  background:#1f2933;
}
@media (min-width:900px){
  .helpDocPage{
    grid-template-columns:minmax(250px,.62fr) minmax(540px,1.38fr);
    gap:16px;
  }
  .helpShortcutsCard{
    position:static;
  }
}
.overlayDocCard h3{
  margin:0 0 8px;
}
.overlayDocCard p{
  margin:8px 0 0;
  color:#4b5563;
  line-height:1.45;
}
.overlayDocCard ul{
  margin:10px 0 0;
  padding-left:20px;
  color:#4b5563;
  line-height:1.45;
}
.overlayDocNote,
.overlayFooterNote{
  margin-top:12px;
  color:#4b5563;
  font-size:13px;
  line-height:1.35;
}
.overlayFooterNote{
  margin-top:0;
  padding-top:4px;
  text-align:center;
}
.shortcutList{
  display:grid;
  gap:8px;
}
.shortcutCard--embedded{
  padding:12px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:14px;
  background:rgba(255,255,255,.62);
}
.helpShortcutsCard .shortcutCard--embedded:nth-child(4n+1){
  background:rgba(238,244,255,.72);
  border-color:rgba(79,128,212,.18);
}
.helpShortcutsCard .shortcutCard--embedded:nth-child(4n+2){
  background:rgba(235,249,237,.72);
  border-color:rgba(62,156,78,.18);
}
.helpShortcutsCard .shortcutCard--embedded:nth-child(4n+3){
  background:rgba(232,244,255,.72);
  border-color:rgba(188,151,20,.18);
}
.helpShortcutsCard .shortcutCard--embedded:nth-child(4n+4){
  background:rgba(255,239,239,.72);
  border-color:rgba(204,63,63,.16);
}
.shortcutCard--embedded h3{
  margin:0 0 6px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(31,41,51,.08);
  font-size:15px;
}
.shortcutRow{
  display:grid;
  grid-template-columns:minmax(136px,auto) minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:8px 0;
  border-top:1px solid rgba(31,41,51,.08);
}
.shortcutRow:first-child{
  border-top:0;
}
.shortcutRow kbd{
  justify-self:start;
  max-width:100%;
  padding:6px 8px;
  border:1px solid rgba(31,41,51,.16);
  border-bottom-color:rgba(31,41,51,.28);
  border-radius:8px;
  background:#fff;
  color:#1f2933;
  font:850 12px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  white-space:normal;
}
.shortcutRow span{
  color:#4b5563;
  line-height:1.35;
}
.tile[data-kind="x"][data-orientation="v"].is-negative .tile__label,
.tile[data-kind="one"].is-negative .tile__label{
  font-size:35px !important;
}
.tile[data-kind="x"][data-orientation="v"].is-negative .tile-sign,
.tile[data-kind="one"].is-negative .tile-sign,
.tilePreview--neg .tile-sign{
  font-size:1em !important;
  margin-right:-2px !important;
}
.tilePreview--xV.tilePreview--neg .tilePreview__label,
.tilePreview--xH.tilePreview--neg .tilePreview__label{
  font-size:26px !important;
}
.tilePreview--one.tilePreview--neg .tilePreview__label{
  font-size:30px !important;
}
.modeIcon{
  width:64px !important;
  height:64px !important;
  border-radius:22px !important;
  font-size:31px !important;
}
.railBtn span{
  font-size:28px !important;
}
.stepCard[data-start-mode] .stepNumber{
  width:42px !important;
  height:42px !important;
  border-radius:15px !important;
  font-size:22px !important;
}
@media (max-width:1060px){
  .boardModeBadge{
    right:10px;
    top:10px;
    max-width:min(300px,calc(100% - 20px));
  }
}
@media (max-width:760px){
  .aboutIntroCard{
    display:grid;
  }
  .homeProductBanner{
    align-items:flex-start;
    gap:12px;
    padding:12px 14px;
    border-radius:22px;
  }
  .homeProductBanner img{
    width:46px;
    height:52px;
  }
  .aboutTopRow{
    grid-template-columns:1fr;
  }
  .homeInfoPanel{
    align-items:flex-start;
    flex-direction:column;
    padding:16px;
  }
  .homeInfoActions{
    justify-content:flex-start;
    width:100%;
  }
  .overlayProductBadge{
    order:4;
    max-width:100%;
  }
  .boardModeBadge{
    left:10px;
    right:10px;
    max-width:none;
  }
  .floatingHint{
    top:58px !important;
  }
  .shortcutRow{
    grid-template-columns:1fr;
    gap:6px;
  }
  .releaseControls{padding-right:0;}
  .overlayHeader{
    align-items:flex-start;
    padding:18px;
    flex-wrap:wrap;
  }
  .overlayTitleBlock{
    flex:1 1 calc(100% - 102px);
  }
  .overlayPageTabs{
    order:3;
    width:100%;
    justify-content:flex-start;
  }
  .overlayPageTab{
    min-height:28px;
    padding:0 8px;
    font-size:11px;
  }
  .overlayNavControls{
    gap:5px;
  }
  .overlayNavBtn{
    width:28px;
    height:28px;
    font-size:11px;
  }
  .overlayRoot[data-page="release"] .releasePage{
    max-height:none;
  }
  .tilePreview--xV.tilePreview--neg .tilePreview__label,
  .tilePreview--xH.tilePreview--neg .tilePreview__label,
  .tilePreview--one.tilePreview--neg .tilePreview__label{
    font-size:20px !important;
  }
}

/* v2.1.52 — current steps closes fully and Help uses two scroll columns. */
@media (min-width:1061px){
  .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) var(--palette-column,164px) !important;
  }
  .taskDrawer.is-collapsed{
    display:none !important;
  }
}
@media (min-width:900px){
  .overlayRoot[data-page="help"] .overlayStack{
    flex:1 1 auto;
    display:flex;
    min-height:0;
    overflow:hidden;
    padding-bottom:14px !important;
  }
  .overlayRoot[data-page="help"] .helpDocPage{
    flex:1 1 auto;
    width:100%;
    min-height:0;
    align-items:stretch;
    grid-template-rows:minmax(0,1fr) auto;
  }
  .overlayRoot[data-page="help"] .helpMainCards,
  .overlayRoot[data-page="help"] .helpShortcutsCard{
    min-height:0;
    max-height:100%;
    overflow:auto;
    padding-right:6px;
    scrollbar-gutter:stable;
  }
  .overlayRoot[data-page="help"] .helpMainCards{
    align-content:start;
  }
}

/* v2.1.53 — responsive overlay chrome and About brick layout. */
@media (max-width:1060px){
  .overlayHeader{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:
      "nav title close"
      "product tabs tabs";
    align-items:center;
    gap:10px 12px;
    padding:16px 18px;
  }
  .overlayNavControls{grid-area:nav;}
  .overlayTitleBlock{grid-area:title;}
  .overlayHeader > .iconBtn[data-close-overlay]{grid-area:close;}
  .overlayProductBadge{
    grid-area:product;
    order:initial;
    justify-self:start;
    max-width:100%;
  }
  .overlayPageTabs{
    grid-area:tabs;
    order:initial;
    width:100%;
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:2px;
    scrollbar-width:none;
  }
  .overlayPageTabs::-webkit-scrollbar{display:none;}
  .overlayPageTab{
    flex:0 0 auto;
  }
  .aboutBrickGrid{
    grid-template-columns:repeat(12,minmax(0,1fr));
  }
  .aboutBrickGrid .aboutBrick:nth-of-type(1),
  .aboutBrickGrid .aboutBrick:nth-of-type(4),
  .aboutBrickGrid .aboutBrick:nth-of-type(6){
    grid-column:span 5;
  }
  .aboutBrickGrid .aboutBrick:nth-of-type(2),
  .aboutBrickGrid .aboutBrick:nth-of-type(3),
  .aboutBrickGrid .aboutBrick:nth-of-type(5){
    grid-column:span 7;
  }
}
@media (max-width:760px){
  .overlayHeader{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "title close"
      "nav product"
      "tabs tabs";
    gap:9px 10px;
    padding:15px;
  }
  .overlayTitleBlock{
    flex:initial;
  }
  .overlayMeta{
    font-size:10px;
    letter-spacing:.11em;
  }
  .overlayHeader h2{
    font-size:22px;
    line-height:1.05;
  }
  .overlayProductBadge{
    justify-self:end;
    min-height:28px;
    padding:4px 8px;
    font-size:10px;
  }
  .overlayProductBadge img{
    width:20px;
    height:22px;
  }
  .overlayNavControls{
    justify-self:start;
  }
  .overlayPageTabs{
    gap:5px;
  }
  .overlayPageTab{
    min-height:28px;
    padding:0 9px;
    font-size:11px;
  }
  .aboutBrickGrid{
    grid-template-columns:1fr;
  }
  .aboutBrickGrid .aboutBrick{
    grid-column:1 / -1 !important;
  }
}

@media (max-width:1060px){
  .overlayHeader{
    grid-template-columns:auto minmax(0,1fr) 38px;
  }
  .overlayHeader > .iconBtn[data-close-overlay]{
    justify-self:end;
    align-self:start;
  }
}
@media (max-width:760px){
  .overlayHeader{
    grid-template-columns:minmax(0,1fr) 38px;
  }
  .overlayHeader > .iconBtn[data-close-overlay]{
    justify-self:end;
  }
}

/* v2.1.55 — deterministic About stacks and more immediate touch gestures. */
.overlayRoot[data-page="about"] .aboutBrickColumns{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  gap:12px;
  align-items:start;
}
.aboutBrickColumn{
  display:grid;
  gap:12px;
  align-content:start;
}
.overlayRoot[data-page="about"] .aboutBrickColumns .overlayFooterNote,
.overlayRoot[data-page="about"] .aboutBrickColumns .overlayScrollEndSpacer,
.overlayRoot[data-page="about"] .aboutBrickColumns .compactProductFooter{
  grid-column:1 / -1;
}
.tile,
.atbTileBtn,
.paletteBtn,
[data-add-tile],
[data-add-tile] *{
  touch-action:none !important;
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  -webkit-tap-highlight-color:transparent;
}
[data-add-tile] img,
[data-add-tile] span,
.tile *{
  -webkit-user-drag:none;
}
@media (max-width:760px){
  .overlayRoot[data-page="about"] .aboutBrickColumns{
    grid-template-columns:1fr;
  }
  .overlayRoot[data-page="about"] .aboutBrickColumns .overlayFooterNote,
  .overlayRoot[data-page="about"] .aboutBrickColumns .overlayScrollEndSpacer,
  .overlayRoot[data-page="about"] .aboutBrickColumns .compactProductFooter{
    grid-column:1;
  }
}

/* v2.1.56 — phone tile scale, side-by-side mobile palette, licence/journey overlays. */
.overlayRoot[data-page="journey"] .overlayPanel{
  width:min(1120px,calc(100vw - 28px));
}
.licenceTopRow{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(260px,3fr);
  gap:12px;
  align-items:stretch;
}
.licenceTopRow > .overlayCard{
  min-height:100%;
}
.licenceMetaCard p{
  margin-top:8px;
}
.overlayRoot[data-page="licence"] .licenceBrickColumns{
  display:grid;
  grid-template-columns:minmax(0,6fr) minmax(0,5fr);
  gap:12px;
  align-items:start;
}
.licenceBrickColumn{
  display:grid;
  gap:12px;
  align-content:start;
}
.overlayRoot[data-page="licence"] .licenceBrickColumns .overlayScrollEndSpacer{
  grid-column:1 / -1;
}
.overlayRoot[data-page="licence"] .licenceBrickColumns .compactProductFooter,
.journeyDocPage .compactProductFooter,
.helpDocPage .compactProductFooter{
  grid-column:1 / -1;
}
.journeyDocPage{
  align-items:start;
}
.journeyHeroCard{
  max-width:none;
}
.journeyCardGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.journeyStepCard{
  position:relative;
  overflow:hidden;
}
.journeyStepCard span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  margin-bottom:10px;
  border-radius:12px;
  background:#1f2933;
  color:#fff;
  font:950 15px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.journeyWideCard{
  background:rgba(238,244,255,.70);
  border-color:rgba(79,128,212,.18);
}
.helpStepsBtn{
  min-height:30px !important;
  padding:0 12px !important;
  background:#fff !important;
  color:#1f2933 !important;
  border-color:rgba(31,41,51,.16) !important;
  box-shadow:none !important;
}
.helpStepsBtn:hover{
  background:rgba(31,41,51,.06) !important;
}
.homeProductBanner{
  box-sizing:border-box;
  max-width:min(1180px,calc(100vw - 28px));
}
@media (max-width:900px){
  .journeyCardGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:760px){
  .tile[data-kind="one"],.tile--one{--tileW:18.9px !important;--tileH:18.9px !important;}
  .tile[data-kind="x"],.tile--x{--tileW:18.9px !important;--tileH:75.6px !important;}
  .tile[data-kind="x"][data-orientation="h"],.tile--x[data-orientation="h"]{--tileW:75.6px !important;--tileH:18.9px !important;}
  .tile[data-kind="x2"],.tile--x2{--tileW:75.6px !important;--tileH:75.6px !important;}
  .tile[data-kind="one"] .tile__face,.tile--one .tile__face{font-size:17px !important;}
  .tile[data-kind="x"] .tile__face,.tile--x .tile__face{font-size:21px !important;}
  .tile[data-kind="x2"] .tile__face,.tile--x2 .tile__face{font-size:27px !important;}
  .tile[data-kind="x"][data-orientation="v"].is-negative .tile__label,
  .tile[data-kind="one"].is-negative .tile__label{
    font-size:17px !important;
  }
  .tile[data-kind="x"][data-orientation="h"].is-negative .tile__label{
    font-size:21px !important;
  }
  .screen--board.is-active{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .bottomTray{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 78px !important;
    gap:8px !important;
    align-items:center !important;
    overflow:hidden !important;
    padding:7px max(8px,env(safe-area-inset-left)) calc(7px + env(safe-area-inset-bottom)) !important;
  }
  .bottomTray .mobilePaletteCluster{
    --mp-x2:44px;
    --mp-unit:19px;
    display:grid !important;
    grid-template-columns:var(--mp-x2) var(--mp-unit) 10px var(--mp-x2) var(--mp-unit) !important;
    grid-template-rows:var(--mp-x2) var(--mp-unit) !important;
    gap:3px !important;
    justify-content:start !important;
    align-items:stretch !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    min-width:0 !important;
    padding:2px 2px 4px !important;
    scrollbar-width:none;
  }
  .bottomTray .mobilePaletteCluster::-webkit-scrollbar{display:none;}
  .bottomTray .mobilePaletteCluster .paletteBtn{
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    border-radius:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(5){grid-column:4 !important;grid-row:1 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(6){grid-column:5 !important;grid-row:1 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(7){grid-column:4 !important;grid-row:2 !important;}
  .bottomTray .mobilePaletteCluster .paletteBtn:nth-child(8){grid-column:5 !important;grid-row:2 !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--x2{width:var(--mp-x2) !important;height:var(--mp-x2) !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--xV{width:var(--mp-unit) !important;height:var(--mp-x2) !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--xH{width:var(--mp-x2) !important;height:var(--mp-unit) !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--one{width:var(--mp-unit) !important;height:var(--mp-unit) !important;}
  .bottomTray .mobilePaletteCluster .tilePreview__label{font-size:18px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--x2 .tilePreview__label{font-size:22px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{font-size:16px !important;}
  .bottomTray .trayActions{
    grid-column:2 !important;
    grid-row:1 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
    align-self:stretch !important;
  }
  .bottomTray .trayActions .pillBtn{
    min-height:26px !important;
    width:100% !important;
    padding:0 5px !important;
    border-radius:8px !important;
    font-size:9px !important;
    line-height:1.05 !important;
    white-space:normal !important;
  }
  .homeProductBanner{
    max-width:calc(100vw - 28px);
    width:calc(100vw - 28px);
    margin-left:auto;
    margin-right:auto;
    overflow:visible;
  }
  .homeProductBanner > div{
    min-width:0;
  }
  .homeProductBanner strong{
    line-height:1.08;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .overlayProductBadge{
    min-width:0;
    white-space:normal;
  }
  .overlayProductBadge span{
    min-width:0;
    white-space:normal;
  }
  .licenceTopRow,
  .overlayRoot[data-page="licence"] .licenceBrickColumns{
    grid-template-columns:1fr;
  }
  .overlayRoot[data-page="licence"] .licenceBrickColumns .overlayScrollEndSpacer{
    grid-column:1;
  }
  .overlayRoot[data-page="licence"] .licenceBrickColumns .compactProductFooter{
    grid-column:1;
  }
  .journeyCardGrid{
    grid-template-columns:1fr;
  }
  .overlayRoot[data-page="journey"] .overlayStack{
    padding-bottom:14px !important;
  }
}

/* v2.1.57 — phone label scaling follows the 52.5% tile scale. */
@media (max-width:760px){
  .tile .tile__face,
  .tile[data-kind="one"] .tile__face,
  .tile[data-kind="x"] .tile__face,
  .tile[data-kind="x2"] .tile__face,
  .tile[data-kind="x"][data-orientation="v"].is-negative .tile__label,
  .tile[data-kind="x"][data-orientation="h"].is-negative .tile__label,
  .tile[data-kind="one"].is-negative .tile__label{
    font-size:16.8px !important;
  }
  .bottomTray .mobilePaletteCluster .tilePreview__label,
  .bottomTray .mobilePaletteCluster .tilePreview--x2 .tilePreview__label,
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label,
  .tilePreview--xV.tilePreview--neg .tilePreview__label,
  .tilePreview--xH.tilePreview--neg .tilePreview__label,
  .tilePreview--one.tilePreview--neg .tilePreview__label{
    font-size:12.6px !important;
  }
}

/* v2.1.58 — compact tools panel and reliable phone board label fitting. */
.boardToolsBtn,
.boardTrashDrop,
.mobileToolsPanel{
  display:none;
}
.notationPanel{
  position:absolute;
  left:14px;
  bottom:14px;
  z-index:47;
  transform:none;
  display:flex;
  align-items:center;
  gap:9px;
  max-width:min(420px,calc(100% - 220px));
  min-height:34px;
  padding:5px 11px;
  border:1px solid rgba(31,41,51,.13);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 18px rgba(31,41,51,.08);
  backdrop-filter:blur(12px);
  color:#1f2933;
  cursor:pointer;
}
.notationPanel:hover{
  background:rgba(255,255,255,.90);
}
.notationPanel span{
  color:#667085;
  font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.notationPanel strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-family:var(--tile-font-family);
  font-size:18px;
  font-weight:400;
  line-height:1;
}
.notationToggle{
  appearance:none;
  border:1px solid rgba(31,41,51,.12);
  border-radius:999px;
  background:rgba(31,41,51,.08);
  color:#40505f;
  min-height:24px;
  padding:0 8px;
  font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.boardMat,
.boardMat *,
body.is-marquee-selecting,
body.is-marquee-selecting *{
  -webkit-user-select:none !important;
  user-select:none !important;
}
@media (max-width:1060px){
  .boardToolsBtn{
    appearance:none;
    position:absolute;
    right:60px;
    bottom:12px;
    z-index:48;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 12px;
    border:1px solid rgba(31,41,51,.16);
    border-radius:999px;
    background:rgba(255,255,255,.88);
    color:#1f2933;
    box-shadow:0 10px 24px rgba(31,41,51,.12);
    font:900 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  .boardToolsBtn.is-active{
    background:#1f2933;
    color:#fff;
    border-color:#1f2933;
  }
  .boardTrashDrop{
    appearance:none;
    position:absolute;
    right:12px;
    bottom:12px;
    z-index:48;
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    padding:0;
    border:1px solid rgba(31,41,51,.16);
    border-radius:999px;
    background:rgba(255,255,255,.90);
    color:#1f2933;
    box-shadow:0 10px 24px rgba(31,41,51,.12);
  }
  .boardTrashDrop svg{
    width:19px;
    height:19px;
    fill:currentColor;
  }
  .boardTrashDrop.is-over{
    background:#1f2933;
    color:#fff;
    transform:scale(1.06);
  }
  .mobileToolsPanel{
    position:absolute;
    right:12px;
    bottom:56px;
    z-index:49;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    width:min(260px,calc(100% - 24px));
    padding:10px;
    border:1px solid rgba(31,41,51,.14);
    border-radius:18px;
    background:rgba(255,255,255,.94);
    box-shadow:0 18px 42px rgba(31,41,51,.18);
    backdrop-filter:blur(14px);
  }
  .mobileToolsPanel[hidden]{
    display:none !important;
  }
  .mobileToolBtn{
    appearance:none;
    min-height:38px;
    padding:0 9px;
    border:1px solid rgba(31,41,51,.14);
    border-radius:12px;
    background:rgba(255,255,255,.74);
    color:#1f2933;
    font:850 12px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  .mobileToolBtn.is-active{
    background:rgba(79,128,212,.16);
    border-color:rgba(79,128,212,.44);
    box-shadow:inset 0 0 0 1px rgba(79,128,212,.20);
  }
  .notationPanel{
    display:none !important;
  }
}
@media (max-width:760px){
  .boardToolsBtn{
    right:56px;
    bottom:10px;
    min-height:31px;
    padding:0 10px;
    font-size:11px;
  }
  .boardTrashDrop{
    right:10px;
    bottom:10px;
    width:32px;
    height:32px;
  }
  .boardTrashDrop svg{
    width:17px;
    height:17px;
  }
  .mobileToolsPanel{
    right:10px;
    bottom:48px;
    width:min(238px,calc(100% - 20px));
    gap:6px;
    padding:8px;
    border-radius:16px;
  }
  .mobileToolBtn{
    min-height:34px;
    font-size:11px;
  }
  .boardMat .tile .tile__face,
  .boardMat .tile[data-kind="one"] .tile__face,
  .boardMat .tile[data-kind="x"] .tile__face,
  .boardMat .tile[data-kind="x2"] .tile__face{
    font-size:16.8px !important;
  }
  .boardMat .tile .tile__label,
  .boardMat .tile .tile__label .tile-sign,
  .boardMat .tile .tile__label .tile-var,
  .boardMat .tile .tile__label .tile-const{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:16.8px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  .boardMat .tile .tile__label{
    max-width:calc(100% - 2px) !important;
    transform-origin:50% 50% !important;
  }
  .boardMat .tile[data-kind="one"].is-negative .tile__label,
  .boardMat .tile[data-kind="x"].is-negative .tile__label{
    transform:scaleX(.72) !important;
  }
  .boardMat .tile .tile-sign{
    margin-right:-2px !important;
  }
  .boardMat .tile .tile-exp{
    font-size:.63em !important;
    transform:translateY(-.42em) !important;
    margin-left:1px !important;
  }
}

/* Information and feedback are layered app pages, not small popovers. */
.boardSettingsRoot{
  opacity:0;
  transition:opacity 360ms ease;
}
.boardSettingsRoot.is-open{opacity:1}
.boardSettingsBackdrop{transition:opacity 360ms ease}
.boardSettingsPanel{
  width:min(720px,calc(100vw - 32px));
  height:min(820px,calc(100dvh - 36px));
  max-height:none;
  background:#f7fafc;
  transform:translateY(32px);
  opacity:0;
  transition:transform 540ms cubic-bezier(.22,.78,.22,1),opacity 360ms ease;
}
.boardSettingsRoot.is-open .boardSettingsPanel{transform:none;opacity:1}
.boardSettingsRoot.is-feedback-open .boardSettingsPanel{transform:none;opacity:1;transition:none}
.boardSettingsPanel > header{background:rgba(247,250,252,.94)}
.boardSettingsContent{padding:18px 20px 24px}
.boardSettingsContent > section{background:#fff}
.boardSettingsFeedbackEntry .primaryBtn{margin-top:14px}
.boardSettingsLegalSection h3{margin-bottom:12px}
.boardSettingsLegalLinks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.boardSettingsLegalLinks a{display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 12px;border:1px solid rgba(57,82,111,.12);border-radius:12px;background:#f7fafc;color:#263548;text-decoration:none;font-size:12px;font-weight:750}
.boardSettingsLegalLinks img{width:18px;height:18px;object-fit:contain}
.boardSettingsFooter{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:6px;padding:20px 12px 4px;border-top:1px solid rgba(57,82,111,.12);color:#6c7888;font-size:11px;text-align:center}
.boardSettingsFooter img{width:34px;height:34px;object-fit:contain}
.boardFeedbackPage{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;background:#f7fafc;transform:translateY(102%);transition:transform 560ms cubic-bezier(.22,.78,.22,1);will-change:transform}
.boardFeedbackPage[hidden]{display:none!important}
.boardFeedbackPage.is-open{transform:none}
.boardFeedbackPage > header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid rgba(57,82,111,.12);background:rgba(247,250,252,.95)}
.boardFeedbackPage h2,.boardFeedbackPage p{margin:0}
.boardFeedbackForm{display:grid;gap:15px;min-height:0;padding:20px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.boardFeedbackForm > p{color:#5f6d7e;font-size:13px;line-height:1.5}
.boardFeedbackForm > label:not(.boardFeedbackCheck){display:grid;gap:7px;color:#263548;font-size:13px;font-weight:800}
.boardFeedbackForm select,.boardFeedbackForm textarea{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid #bcc8d5;border-radius:11px;background:#fff;color:#172033;font:inherit}
.boardFeedbackForm textarea{resize:vertical}
.boardFeedbackCheck{display:flex;align-items:flex-start;gap:10px;color:#344357;font-size:13px;font-weight:700}
.boardFeedbackCheck input{width:18px;height:18px;margin:0;accent-color:#0877f8}
.feedbackScreenshotPicker{display:grid;gap:8px;padding:12px;border:1px solid rgba(57,82,111,.14);border-radius:12px;background:#f5f8fb}
.feedbackScreenshotPicker[hidden]{display:none!important}
.feedbackScreenshotChoose{color:#263548;font-size:13px;font-weight:850}
.feedbackScreenshotPicker input[type="file"]{display:block;width:100%;max-width:100%;color:#526176;font:13px/1.4 var(--tiles-ui-font,"Nunito",system-ui,sans-serif)}
.feedbackScreenshotPicker input[type="file"]::file-selector-button{min-height:40px;margin-right:10px;padding:8px 14px;border:1px solid #0877f8;border-radius:9px;background:#0877f8;color:#fff;font:inherit;font-weight:850;cursor:pointer}
.feedbackScreenshotPicker input[type="file"]:focus-visible{outline:3px solid rgba(8,119,248,.3);outline-offset:3px}
.feedbackScreenshotPicker p{min-height:16px;margin:0;color:#526176;font-size:11px;overflow-wrap:anywhere}
.boardFeedbackSuccess{margin:auto;padding:36px 24px;text-align:center;color:#263548}
.boardFeedbackSuccess > span{display:grid;width:60px;height:60px;margin:0 auto 18px;place-items:center;border-radius:999px;background:#e4f5ea;color:#24704a;font-size:30px;font-weight:900}
.boardFeedbackSuccess h3{margin:0 0 8px;font-size:20px}
.boardFeedbackSuccess p{margin:0 0 24px;color:#5f6d7e;font-size:14px}
.boardFeedbackSuccess .primaryBtn{min-width:150px}
.feedbackScreenshotPreview{width:min(300px,100%);margin:0 auto;padding:7px;border:1px solid rgba(57,82,111,.12);border-radius:12px;background:#fff}
.feedbackScreenshotPreview>button{display:block;width:100%;padding:0;border:0;border-radius:8px;background:#f3f7fa;cursor:zoom-in}
.feedbackScreenshotPreview>button:focus-visible{outline:3px solid rgba(8,119,248,.35);outline-offset:3px}
.feedbackScreenshotPreview img{display:block;width:auto;max-width:100%;height:auto;max-height:120px;margin:0 auto;object-fit:contain;border-radius:8px;background:#f3f7fa}
.feedbackScreenshotPreview figcaption{margin-top:6px;color:#667085;font-size:11px}
.feedbackScreenshotViewer{position:fixed;inset:0;z-index:10000;display:grid;grid-template-rows:minmax(0,1fr);padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:rgba(7,30,62,.96);color:#fff;opacity:0;isolation:isolate;transition:opacity 200ms ease}
.feedbackScreenshotViewer[hidden]{display:none!important}
.feedbackScreenshotViewer.is-open{opacity:1}
.feedbackScreenshotViewerClose{position:absolute;z-index:2;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));width:42px;height:42px;padding:0;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(7,30,62,.72);color:#fff;font:400 30px/38px system-ui,sans-serif;cursor:pointer}
.feedbackScreenshotViewerClose:focus-visible{outline:3px solid rgba(255,255,255,.72);outline-offset:3px}
.feedbackScreenshotStage{min-width:0;min-height:0;display:grid;place-items:center;overflow:hidden;background:#0d1d33;touch-action:manipulation;user-select:none}
.feedbackScreenshotStage img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.boardFeedbackForm details{padding:10px 12px;border-radius:10px;background:#eef3f7;color:#344357;font-size:12px}
.boardFeedbackForm pre{overflow:auto;white-space:pre-wrap;font:11px/1.45 ui-monospace,SFMono-Regular,monospace}
.feedbackHoneypot{position:absolute!important;left:-10000px!important}
.boardFeedbackStatus{min-height:19px;color:#526176;font-size:13px}
.boardFeedbackStatus.is-error{color:#a23849}

.appShell img[src$=".svg"],.appShell svg{
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
}

@media (max-width:1060px){
  .appShell[data-screen="board"] #boardHeaderSettingsBtn::after{display:none!important}
  .boardFeedbackForm select,.boardFeedbackForm textarea{font-size:16px}
}
@media (max-width:760px){
  .boardSettingsRoot{place-items:end center;padding:0}
  .boardSettingsPanel{width:100%;height:100dvh;max-width:none;border:0;border-radius:0;transform:translateY(100%)}
  .boardSettingsContent{padding:max(14px,env(safe-area-inset-top)) 14px max(20px,env(safe-area-inset-bottom))}
  .boardSettingsLegalLinks{grid-template-columns:1fr}
  .boardFeedbackPage > header{padding-top:max(18px,env(safe-area-inset-top))}
  .boardFeedbackForm{padding-bottom:max(20px,env(safe-area-inset-bottom))}
  .feedbackScreenshotPreview{width:min(240px,100%);padding:6px}
  .feedbackScreenshotPreview img{max-height:88px}
}
@media (min-width:761px){
  .boardSettingsRoot{place-items:stretch center;padding:0}
  .boardSettingsPanel{
    width:min(720px,calc(100vw - 32px));
    height:100dvh;
    max-height:none;
    border-top:0;
    border-bottom:0;
    border-radius:0;
  }
}
@media (prefers-reduced-motion:reduce){
  .boardSettingsRoot,.boardSettingsPanel,.boardFeedbackPage,.feedbackScreenshotViewer{transition-duration:1ms!important}
}

/* v2.1.83 - slim board action toolbar. */
.boardActionToolbar{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  z-index:49;
  display:grid;
  gap:5px;
  padding:6px;
  border:1px solid rgba(31,41,51,.12);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  box-shadow:0 10px 24px rgba(31,41,51,.10);
  backdrop-filter:blur(12px);
}
.boardToolIcon{
  appearance:none;
  position:relative;
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid transparent;
  border-radius:999px;
  background:transparent;
  color:#1f2933;
}
.boardToolIcon:hover{
  background:rgba(31,41,51,.08);
}
.boardToolIcon[data-tooltip]::after{
  content:attr(data-tooltip);
  position:absolute;
  right:calc(100% + 9px);
  top:50%;
  transform:translateY(-50%) translateX(4px);
  z-index:80;
  opacity:0;
  pointer-events:none;
  white-space:nowrap;
  padding:6px 8px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:9px;
  background:rgba(31,41,51,.93);
  color:#fff;
  box-shadow:0 8px 20px rgba(31,41,51,.16);
  font:800 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transition:opacity .14s ease, transform .14s ease;
}
.boardToolIcon[data-tooltip]:hover::after,
.boardToolIcon[data-tooltip]:focus-visible::after{
  opacity:1;
  transform:translateY(-50%);
}
.boardToolIcon.is-active{
  background:#1f2933;
  color:#fff;
  border-color:#1f2933;
}
.boardToolIcon:disabled{
  opacity:.32;
  pointer-events:none;
}
.boardToolIcon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.boardToolIcon svg text{
  fill:currentColor;
  stroke:none;
  font:900 6px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.boardMat.is-hand-pan-mode{
  cursor:grab;
}

/* v2.1.85 - mini-quiz mode. */
.fullQuizQuestion{
  margin-bottom:0 !important;
}
.quizChallengeHeader{
  display:grid;
  gap:8px;
}
.quizChallengeHeader h3,
.quizSummaryHero h3{
  margin:0;
  font-size:clamp(24px,3.2vw,40px);
  line-height:1.04;
  letter-spacing:-.045em;
}
.quizChallengeHeader p,
.quizSummaryHero p{
  margin:0;
  color:#5f6872;
  font-size:15px;
  line-height:1.45;
  font-weight:750;
}
.quizTopicGrid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.quizTopicCard{
  appearance:none;
  min-height:150px;
  display:grid;
  align-content:start;
  gap:10px;
  padding:16px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(247,250,247,.88));
  text-align:left;
  box-shadow:0 10px 24px rgba(31,41,51,.08);
}
.quizTopicCard:hover,
.quizTopicCard:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(79,128,212,.35);
  outline:none;
}
.quizTopicCard span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(156,201,189,.24);
  color:#1f2933;
  font-size:22px;
  font-weight:950;
}
.quizTopicCard strong{
  font-size:17px;
  letter-spacing:-.025em;
}
.quizTopicCard small{
  color:#667085;
  font-size:13px;
  line-height:1.35;
  font-weight:750;
}
.quizChallengeBody{
  display:grid;
  gap:16px;
}
.quizOptionGrid{
  display:grid;
  gap:10px;
}
.quizChoiceBtn.is-selected{
  border-color:rgba(79,128,212,.52);
  background:rgba(79,128,212,.12);
  box-shadow:inset 0 0 0 2px rgba(79,128,212,.12);
}
.quizDiagram,
.quizEquationDiagram,
.quizWorkspace,
.quizArrayPreview{
  border:1px solid rgba(31,41,51,.10);
  border-radius:24px;
  background:rgba(246,247,247,.74);
  padding:16px;
}
.quizEquationDiagram{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:14px;
}
.quizEquals{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(31,41,51,.12);
  color:#1f2933;
  font:950 22px/1 var(--tile-font-family);
}
.quizTileLine{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  flex-wrap:wrap;
  gap:5px;
}
.quizTile{
  display:inline-grid;
  place-items:center;
  box-sizing:border-box;
  border:3px solid #000;
  border-radius:6px;
  background:var(--tile-yellow);
  color:#000;
  font-family:var(--tile-font-family);
  font-weight:400;
  line-height:1;
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.quizTile--one{
  width:34px;
  height:34px;
}
.quizTile--x2{
  width:74px;
  height:74px;
  background:var(--tile-blue);
  color:#fff;
}
.quizTile--xV{
  width:34px;
  height:74px;
  background:var(--tile-green);
  color:#fff;
}
.quizTile--xH{
  width:74px;
  height:34px;
  background:var(--tile-green);
  color:#fff;
}
.quizTile--neg{
  background:var(--tile-negative) !important;
  color:#000 !important;
}
.quizTileLabel{
  display:inline-flex;
  align-items:baseline;
  justify-content:center;
  font-size:25px;
  line-height:1;
}
.quizTile--one .quizTileLabel{
  font-size:27px;
}
.quizTile .tile-exp{
  font-size:.58em;
  transform:translateY(-.42em);
  margin-left:1px;
}
.quizStartTiles{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border-radius:20px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(31,41,51,.09);
}
.quizStartTiles > span,
.quizPoolLabel{
  color:#667085;
  font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.quizDropZones{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(74px,1fr));
  gap:9px;
}
.quizDropZones--array{
  grid-template-columns:repeat(6,minmax(42px,1fr));
  align-items:stretch;
}
.quizDropZones--factors{
  grid-template-columns:repeat(4,minmax(54px,1fr));
}
.quizDropZone{
  appearance:none;
  min-height:76px;
  display:grid;
  place-items:center;
  padding:7px;
  border:2px dashed rgba(31,41,51,.28);
  border-radius:16px;
  background:rgba(230,233,236,.72);
  color:#6b7280;
  font:900 11px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.quizDropZone.has-tile{
  border-style:solid;
  background:rgba(255,255,255,.78);
}
.quizTilePool{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.quizPoolTile{
  appearance:none;
  display:grid;
  place-items:center;
  min-width:46px;
  min-height:46px;
  padding:4px;
  border:1px solid rgba(31,41,51,.12);
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 12px rgba(31,41,51,.07);
}
.quizPoolTile.is-selected{
  border-color:rgba(79,128,212,.58);
  box-shadow:0 0 0 4px rgba(79,128,212,.12);
}
.quizPoolTile:disabled{
  opacity:.28;
}
.quizArrayFactors{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:10px;
  border-radius:18px;
  background:rgba(255,255,255,.7);
  color:#40505f;
  font:900 18px/1 var(--tile-font-family);
}
.quizArrayPreview{
  display:grid;
  gap:8px;
  place-items:center;
  min-height:118px;
  background:linear-gradient(135deg,rgba(230,233,236,.9),rgba(246,247,247,.78));
}
.quizArrayPreview span{
  color:#667085;
  font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.quizArrayPreview strong{
  font:400 clamp(28px,4vw,42px)/1 var(--tile-font-family);
}
.quizActionRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.quizFeedback.is-correct{
  background:#eaf7ed !important;
  border-color:rgba(46,125,50,.28) !important;
}
.quizFeedback.is-wrong{
  background:#fdecec !important;
  border-color:rgba(190,18,60,.26) !important;
}
.quizFeedback--reveal,
.quizFeedback--review{
  background:#eef4ff !important;
  border-color:rgba(79,128,212,.24) !important;
}
.quizFeedback--quiet{
  background:#fff !important;
}
.quizWorkspace.is-correct{
  box-shadow:0 0 0 4px rgba(46,125,50,.16);
  border-color:rgba(46,125,50,.32);
}
.quizWorkspace.is-wrong{
  box-shadow:0 0 0 4px rgba(190,18,60,.12);
  border-color:rgba(190,18,60,.28);
}
.quizCelebration strong,
.quizRetry strong{
  display:block;
  font-size:20px;
  margin-bottom:5px;
}
.quizStatsGrid,
.quizSummaryStats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.quizStatsGrid span,
.quizSummaryStats span{
  display:grid;
  gap:2px;
  padding:12px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(31,41,51,.08);
  color:#667085;
  font-size:12px;
  font-weight:850;
}
.quizStatsGrid strong,
.quizSummaryStats strong{
  color:#1f2933;
  font-size:21px;
  line-height:1;
}
.quizReviewItem{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(31,41,51,.08);
}
.quizReviewItem span{
  color:#667085;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.quizReviewItem h4{
  margin:5px 0 6px;
  font-size:15px;
}
.quizReviewItem p{
  margin:5px 0 0;
}
@media (max-width:1060px){
  .quizTopicGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .quizEquationDiagram{
    grid-template-columns:1fr;
  }
  .quizEquals{
    margin:auto;
  }
}
@media (max-width:760px){
  .quizTopicGrid,
  .quizStatsGrid,
  .quizSummaryStats{
    grid-template-columns:1fr;
  }
  .quizDropZones--array{
    grid-template-columns:repeat(3,minmax(42px,1fr));
  }
  .quizTile--x2{
    width:58px;
    height:58px;
  }
  .quizTile--xV{
    width:30px;
    height:58px;
  }
  .quizTile--xH{
    width:58px;
    height:30px;
  }
  .quizTile--one{
    width:30px;
    height:30px;
  }
  .quizTileLabel,
  .quizTile--one .quizTileLabel{
    font-size:21px;
  }
}
.boardMat.is-hand-pan-mode.is-panning{
  cursor:grabbing;
}
.notationPanel[hidden]{
  display:none !important;
}
@media (min-width:1061px){
  .notationPanel{
    display:grid !important;
    grid-template-columns:minmax(0,1fr);
    gap:8px;
    width:min(580px,calc(100% - 330px));
    min-height:0;
    padding:9px 10px 10px;
    border-radius:18px;
    cursor:default;
  }
  .notationPanelTop{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-width:0;
  }
  .notationPanelTop > span{
    color:#667085;
    font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .notationViewButtons{
    display:flex;
    gap:4px;
    padding:3px;
    border-radius:999px;
    background:rgba(31,41,51,.06);
  }
  .notationViewBtn{
    appearance:none;
    min-height:23px;
    padding:0 8px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:#536170;
    font:900 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  .notationViewBtn.is-active{
    background:#fff;
    color:#1f2933;
    box-shadow:0 2px 8px rgba(31,41,51,.10);
  }
  .notationText{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    min-width:0;
    color:#1f2933;
    font-family:var(--tile-font-family);
    font-size:19px;
    line-height:1.05;
  }
  .notationTerm{
    appearance:none;
    min-height:30px;
    padding:2px 9px 1px;
    border:1px solid rgba(79,128,212,.18);
    border-radius:999px;
    background:rgba(79,128,212,.09);
    color:#1f2933;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.52);
    cursor:grab;
    font:400 20px/1 var(--tile-font-family);
  }
  .notationTerm:hover,
  .notationTerm:focus-visible{
    border-color:rgba(79,128,212,.42);
    background:rgba(79,128,212,.15);
    outline:none;
  }
  .notationTerm.is-dragging{
    opacity:.48;
    cursor:grabbing;
  }
}
@media (max-width:1060px){
  .boardActionToolbar{
    right:8px;
    gap:4px;
    padding:5px;
  }
  .boardToolIcon{
    width:29px;
    height:29px;
  }
  .boardToolIcon svg{
    width:17px;
    height:17px;
  }
}

/* v2.1.68 - expression/readout and compact overlay polish. */
@media (min-width:1061px){
  .notationPanel{
    left:50% !important;
    right:auto !important;
    bottom:12px !important;
    transform:translateX(-50%) !important;
    max-width:min(540px,calc(100% - 310px)) !important;
    z-index:46 !important;
  }
}
@media (max-width:1060px){
  .taskDrawer,
  .taskDrawer.is-open{
    display:none !important;
  }
  .boardWorkspaceWrap{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .overlayHeader{
    grid-template-columns:auto minmax(0,1fr) 38px !important;
    grid-template-areas:
      "nav title close"
      "product product product"
      "tabs tabs tabs" !important;
  }
  .overlayProductBadge{
    grid-area:product !important;
    justify-self:start !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
    white-space:nowrap !important;
  }
  .overlayProductBadge span{
    min-width:0 !important;
    overflow:visible !important;
    white-space:nowrap !important;
  }
}
@media (max-width:760px){
  .overlayHeader{
    grid-template-columns:minmax(0,1fr) 38px !important;
    grid-template-areas:
      "title close"
      "nav nav"
      "product product"
      "tabs tabs" !important;
  }
  .overlayProductBadge{
    justify-self:start !important;
    max-width:calc(100vw - 58px) !important;
    font-size:10px !important;
  }
  .overlayProductBadge img{
    flex:0 0 auto !important;
  }
}


/* v2.1.78 - help overlay footer placement refinement. */
@media (min-width:900px){
  .overlayRoot[data-page="help"] .helpMainCards{
    display:flex;
    flex-direction:column;
    align-content:stretch;
  }
  .overlayRoot[data-page="help"] .helpMainCards .compactProductFooter{
    grid-column:auto;
    margin-top:auto;
    margin-bottom:0;
    flex:0 0 auto;
  }
  .overlayRoot[data-page="help"] .helpShortcutsCard{
    grid-column:auto;
  }
}
@media (max-width:899px){
  .helpDocPage{
    display:flex;
    flex-direction:column;
  }
  .helpDocPage .helpShortcutsCard{
    order:1;
  }
  .helpDocPage .helpMainCards{
    order:2;
  }
  .helpDocPage > .compactProductFooter{
    order:3;
    margin-top:4px;
    margin-bottom:18px;
  }
}

/* v2.1.87 - cleaner board toolbar and calmer quiz layout. */
.paletteActions,
#snapBtn,
#zeroPairBtn,
#resetBtn,
#mobileSnapBtn,
#mobileZeroPairBtn,
#mobileResetBtn{
  display:none !important;
}
.paletteBtn,
.atbTileBtn,
.tile{
  cursor:grab;
}
.paletteBtn:active,
.atbTileBtn:active,
.tile.is-dragging,
.paletteDragProxy{
  cursor:grabbing !important;
}
.boardModeBadge{
  display:none !important;
}
@media (max-width:1060px){
  .boardModeBadge{
    display:flex !important;
    right:auto !important;
    left:10px !important;
    top:10px !important;
    max-width:min(260px,calc(100% - 74px)) !important;
    padding:6px 9px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.78) !important;
  }
  .boardModeBadge span,
  .boardModeHelpBtn{
    display:none !important;
  }
}
.modeCard.is-active,
.compactModeCard.is-active{
  border-color:rgba(79,128,212,.45) !important;
  background:linear-gradient(180deg,rgba(238,244,255,.96),rgba(255,255,255,.90)) !important;
  box-shadow:inset 0 0 0 2px rgba(79,128,212,.14), 0 14px 30px rgba(31,41,51,.08) !important;
}
.railBtn.is-active{
  background:rgba(79,128,212,.16) !important;
  border-color:rgba(79,128,212,.34) !important;
  box-shadow:inset 0 0 0 2px rgba(79,128,212,.10);
}
.boardToolsBtn,
.mobileToolsPanel{
  display:none !important;
}
.boardActionToolbar{
  transition:padding .18s ease, gap .18s ease, background .18s ease, box-shadow .18s ease;
}
.boardToolIcon{
  transition:width .18s ease, height .18s ease, opacity .16s ease, transform .18s ease, background .14s ease, color .14s ease;
}
.boardToolIcon--collapse{
  background:rgba(31,41,51,.06);
}
.boardActionToolbar.is-collapsed{
  gap:0;
  padding:5px;
  background:rgba(255,255,255,.86);
}
.boardActionToolbar.is-collapsed .boardToolIcon:not(.boardToolIcon--collapse){
  width:0;
  height:0;
  min-height:0;
  opacity:0;
  overflow:hidden;
  transform:scale(.65);
  pointer-events:none;
  border-width:0;
}
#boardToolZeroBtn svg,
#boardToolFlipBtn svg{
  width:20px;
  height:20px;
}
#boardToolFlipBtn svg text{
  font-size:7.4px;
  letter-spacing:0;
}
@media (max-width:1060px){
  #boardToolHandBtn{
    display:none !important;
  }
  .boardToolIcon[data-tooltip]::after{
    right:calc(100% + 7px);
  }
  .boardToolIcon[data-tooltip].show-label::after{
    opacity:1;
    transform:translateY(-50%);
  }
}
@media (hover:none) and (max-width:1060px){
  .boardToolIcon[data-tooltip]:hover::after,
  .boardToolIcon[data-tooltip]:focus-visible::after{
    opacity:0;
    transform:translateY(-50%) translateX(4px);
  }
  .boardToolIcon[data-tooltip].show-label::after{
    opacity:1;
    transform:translateY(-50%);
  }
}
@media (min-width:1061px){
  .notationTerm{
    padding:1px 3px !important;
    border-color:transparent !important;
    border-radius:7px !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .notationTerm:hover,
  .notationTerm:focus-visible{
    border-color:rgba(79,128,212,.24) !important;
    background:rgba(79,128,212,.08) !important;
  }
  .notationTerm.is-dragging,
  .notationTerm:active{
    background:rgba(79,128,212,.16) !important;
    border-color:rgba(79,128,212,.38) !important;
  }
}
.quizModePanel{
  background:#fff !important;
  border-color:rgba(31,41,51,.08) !important;
  border-radius:22px !important;
  padding:clamp(14px,2.2vw,24px) !important;
  box-shadow:0 12px 34px rgba(31,41,51,.08) !important;
}
.quizModeHero{
  padding:6px 4px 2px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.quizModeHero h2{
  font-size:clamp(24px,3vw,36px) !important;
  letter-spacing:-.04em !important;
}
.quizModeGrid{
  grid-template-columns:minmax(0,1fr) minmax(250px,300px) !important;
  align-items:start;
}
.quizModeCard,
.quizModeGuide{
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:none !important;
}
.quizModeCard{
  min-height:min(620px,calc(100vh - 260px));
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:14px;
}
.quizModeCard.is-correct-state{
  background:#eef9f1 !important;
  border-color:rgba(46,125,50,.30) !important;
}
.quizModeCard.is-wrong-state{
  background:#fff1f1 !important;
  border-color:rgba(190,18,60,.24) !important;
}
.fullQuizQuestion{
  font-size:clamp(22px,2.6vw,34px) !important;
  text-align:center;
}
.quizChallengeHeader{
  justify-items:center;
  text-align:center;
}
.quizChallengeBody{
  align-content:start;
}
.fullQuizFeedback{
  min-height:0 !important;
  margin-top:0 !important;
  border-radius:16px !important;
}
.quizTopicGrid{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important;
}
.quizTopicCard{
  min-height:132px !important;
  border-radius:18px !important;
  box-shadow:none !important;
  background:#fff !important;
}
.quizTopicCard span{
  border-radius:12px !important;
}
.quizDiagram,
.quizEquationDiagram,
.quizWorkspace,
.quizArrayPreview{
  border-radius:16px !important;
  background:#f6f7f7 !important;
}
.quizPoolTile{
  border-color:transparent !important;
  background:transparent !important;
  box-shadow:none !important;
}
.quizPoolTile.is-selected{
  border-color:rgba(79,128,212,.45) !important;
  background:rgba(79,128,212,.08) !important;
}
.quizWorkspace[data-quiz-workspace="fillArray"],
.quizWorkspace[data-quiz-workspace="fillFactors"]{
  background:#f7f8f8 !important;
}
.quizDropZones--array{
  grid-template-columns:repeat(6,minmax(36px,52px)) !important;
  justify-content:center;
  gap:0 !important;
  padding:10px;
  border:1px dashed rgba(31,41,51,.30);
  border-radius:12px;
  background:#f2f3f3;
}
.quizDropZones--array .quizDropZone{
  min-height:44px !important;
  border-radius:0 !important;
  border-color:rgba(31,41,51,.34) !important;
  background:rgba(255,255,255,.55) !important;
}
.quizDropZones--array .quizDropZone:first-child{
  grid-column:span 3;
  grid-row:span 3;
  min-height:132px !important;
}
.quizDropZones--factors{
  grid-template-columns:repeat(4,minmax(50px,72px)) !important;
  justify-content:center;
  gap:0 !important;
  padding:10px;
  border:1px dashed rgba(31,41,51,.30);
  border-radius:12px;
  background:#f2f3f3;
}
.quizDropZones--factors .quizDropZone{
  min-height:50px !important;
  border-radius:0 !important;
  border-color:rgba(31,41,51,.34) !important;
  background:rgba(255,255,255,.55) !important;
}

/* v2.1.89 rotation, toolbar and quiz polish */
.appBack{
  display:none !important;
}
.appHeader{
  gap:16px;
}
.boardTrashDrop{
  border:1px solid rgba(31,41,51,.12) !important;
  border-style:solid !important;
  background:rgba(31,41,51,.045) !important;
  box-shadow:none !important;
  color:#3f4b56 !important;
}
.boardTrashDrop svg{
  opacity:.72;
}
.boardTrashDrop.is-dragging,
.boardTrashDrop.is-over{
  border-color:rgba(190,18,60,.48) !important;
  background:rgba(190,18,60,.11) !important;
  color:#8f1232 !important;
  box-shadow:0 10px 24px rgba(190,18,60,.12) !important;
}
#boardToolFlipBtn svg text{
  font-size:9px !important;
  font-weight:950 !important;
  paint-order:stroke;
  stroke:rgba(255,255,255,.75);
  stroke-width:.45px;
}
.quizTopicCard{
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.quizTopicCard:hover,
.quizTopicCard:focus-visible{
  border-color:rgba(79,128,212,.48) !important;
  background:linear-gradient(180deg,rgba(246,249,255,.98),#fff) !important;
  box-shadow:0 14px 30px rgba(31,41,51,.10) !important;
  transform:translateY(-2px);
}
.quizTopicCard:hover span,
.quizTopicCard:focus-visible span{
  border-color:rgba(79,128,212,.34) !important;
  background:rgba(79,128,212,.12) !important;
}
.quizDiagramWrap{
  display:grid;
  gap:10px;
  justify-items:center;
}
.quizDiagramExpression{
  font-family:Cambria, "Times New Roman", serif;
  font-size:clamp(21px,2.2vw,30px);
  font-weight:700;
  color:#1f2937;
  line-height:1.1;
  white-space:nowrap;
}
@media (max-width:1060px){
  .quizModePanel{
    min-height:calc(100dvh - var(--header-h) - var(--nav-h) - 24px);
  }
  .quizModeGrid{
    grid-template-columns:1fr !important;
  }
  .quizModeGuide{
    order:3;
  }
  .quizTopicGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-height:calc(100dvh - var(--header-h) - var(--nav-h) - 230px);
    overflow:auto;
    padding-right:2px;
  }
}
@media (max-width:760px){
  .quizModeCard{
    min-height:0;
    padding:12px !important;
  }
  .fullQuizQuestion{
    text-align:left;
  }
  .quizChallengeHeader{
    justify-items:start;
    text-align:left;
  }
  .quizTopicGrid{
    grid-template-columns:1fr !important;
    max-height:none;
  }
  .quizDropZones--array{
    grid-template-columns:repeat(4,minmax(34px,48px)) !important;
  }
}

/* v2.1.88 - live-board mini-quiz state, toolbar feedback and drop-zone delete. */
.boardActionToolbar{
  top:12px !important;
  right:12px !important;
  transform:none !important;
  transform-origin:top right !important;
}
.boardActionToolbar.is-collapsed{
  transform:none !important;
}
.boardToolIcon.is-shortcut-flash{
  background:#0877f8 !important;
  color:#fff !important;
  border-color:#0877f8 !important;
  box-shadow:0 0 0 4px rgba(8,119,248,.2);
}
.boardTrashDrop{
  appearance:none;
  position:absolute;
  left:14px;
  right:auto;
  bottom:14px;
  z-index:48;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:auto;
  min-width:0;
  height:auto;
  min-height:34px;
  padding:0 11px 0 10px;
  border:1.5px dashed rgba(31,41,51,.32);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  color:#40505f;
  box-shadow:0 10px 24px rgba(31,41,51,.08);
  backdrop-filter:blur(12px);
  font:900 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  pointer-events:none;
}
.boardTrashDrop svg{
  width:16px;
  height:16px;
  fill:currentColor;
}
.boardTrashDrop span{
  white-space:nowrap;
}
.boardTrashDrop.is-over{
  border-color:rgba(190,18,60,.58);
  background:#fff1f1;
  color:#be123c;
  transform:scale(1.03);
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .boardWorkspaceWrap{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 164px !important;
  min-height:0;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .rightPalette{
  display:block;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .taskDrawer{
  display:none !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .bottomTray{
  display:flex !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModePanel{
  display:block !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModeHero,
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModeGuide{
  display:none !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModeGrid{
  display:block !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModeCard{
  min-height:0 !important;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(220px,.8fr) auto;
  align-items:center;
  gap:14px;
  padding:12px 14px !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.86) !important;
  box-shadow:0 12px 34px rgba(31,41,51,.10) !important;
  backdrop-filter:blur(18px);
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .fullQuizQuestion{
  text-align:left !important;
  font-size:clamp(17px,2vw,24px) !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizChallengeHeader{
  justify-items:start !important;
  text-align:left !important;
  gap:5px !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizChallengeHeader h3{
  font-size:clamp(20px,2.4vw,30px) !important;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizChallengeBody--live{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-start;
}
.quizLiveBoardPrompt{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:9px 11px;
  border:1px solid rgba(31,41,51,.10);
  border-radius:14px;
  background:#f6f7f7;
  color:#40505f;
  font:800 13px/1.25 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.quizLiveBoardPrompt strong{
  color:#1f2933;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .fullQuizFeedback{
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizActionRow,
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizCelebration,
.appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizRetry{
  margin:0;
}
@media (max-width:1060px){
  .boardTrashDrop{
    left:12px !important;
    bottom:12px !important;
    padding:0 9px;
    min-height:32px;
  }
  .boardTrashDrop span{
    display:none;
  }
  .appShell[data-mode="mini-quiz"][data-quiz-board="active"] .boardWorkspaceWrap{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .appShell[data-mode="mini-quiz"][data-quiz-board="active"] .rightPalette{
    display:none;
  }
  .appShell[data-mode="mini-quiz"][data-quiz-board="active"] .quizModeCard{
    grid-template-columns:1fr;
    gap:10px;
  }
  .appShell[data-mode="mini-quiz"][data-quiz-board="active"] .fullQuizFeedback{
    justify-content:stretch;
  }
}

/* v2.1.89 final responsive refinements */
.boardTrashDrop{
  border:1px solid rgba(31,41,51,.12) !important;
  border-style:solid !important;
  background:rgba(31,41,51,.045) !important;
  box-shadow:none !important;
}
.boardTrashDrop.is-over{
  border-color:rgba(190,18,60,.48) !important;
  background:rgba(190,18,60,.11) !important;
  box-shadow:0 10px 24px rgba(190,18,60,.12) !important;
}
@media (max-width:1060px){
  .quizTopicGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-height:none !important;
    overflow:visible !important;
    padding:2px !important;
  }
  .quizTopicCard{
    aspect-ratio:1 / 1;
    min-height:0 !important;
    justify-content:center;
  }
}
@media (max-width:420px){
  .quizTopicGrid{
    gap:10px !important;
  }
  .quizTopicCard{
    padding:12px 10px !important;
  }
}

/* v2.1.90 zoom flyout and delete-zone clarity */
.boardZoomTool{
  position:relative;
  display:grid;
  place-items:center;
}
.boardZoomFlyout{
  position:absolute;
  top:50%;
  right:calc(100% + 8px);
  z-index:80;
  display:grid;
  gap:6px;
  padding:6px;
  border:1px solid rgba(31,41,51,.12);
  border-radius:18px;
  background:rgba(255,255,255,.88);
  box-shadow:0 14px 30px rgba(31,41,51,.12);
  backdrop-filter:blur(14px);
  transform:translateY(-50%);
}
.boardZoomFlyout[hidden]{
  display:none !important;
}
.boardMat.is-zoom-marquee-mode{
  cursor:zoom-in;
}
.boardMat.is-zoom-marquee-mode *{
  cursor:zoom-in !important;
}
body.is-zoom-marquee-active,
body.is-zoom-marquee-active *{
  cursor:zoom-in !important;
}
.selectionMarquee--zoom{
  border-color:rgba(31,41,51,.72) !important;
  background:rgba(79,128,212,.10) !important;
}
#boardToolZeroBtn svg{
  width:21px !important;
  height:21px !important;
}
#boardToolZeroBtn svg rect{
  stroke-width:1.9px;
}
#boardToolZeroBtn svg path{
  stroke-width:2.1px;
}
.boardTrashDrop{
  border:1.5px dashed rgba(31,41,51,.34) !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  transition:border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.boardTrashDrop.is-over{
  border-color:rgba(79,128,212,.78) !important;
  background:rgba(79,128,212,.16) !important;
  color:#245db3 !important;
  box-shadow:0 0 0 4px rgba(79,128,212,.14) !important;
  transform:scale(1.04);
}
@media (max-width:1060px){
  .boardToolIcon[data-mobile-tooltip]::after{
    content:attr(data-mobile-tooltip) !important;
  }
}

/* v2.1.93 - centred rotation polish and full-screen mini-quiz layout. */
.appShell[data-mode="mini-quiz"] .appHeader,
.appShell[data-mode="mini-quiz"] .modeRail,
.appShell[data-mode="mini-quiz"] .bottomNav{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .screen--board.is-active{
  display:block !important;
  height:100dvh !important;
}
.appShell[data-mode="mini-quiz"] .boardStage{
  height:100dvh !important;
  padding:0 !important;
  gap:0 !important;
  display:grid !important;
  grid-template-rows:minmax(0,1fr) !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .boardWorkspaceWrap,
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .bottomTray,
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .taskDrawer{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModePanel[hidden]{
  display:none !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModePanel{
  min-height:100dvh !important;
  height:100dvh !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  gap:clamp(16px,3vh,28px) !important;
  overflow:hidden !important;
  padding:clamp(18px,4vw,42px) !important;
  border:0 !important;
  border-radius:0 !important;
  background:linear-gradient(155deg,#f2efff 0%,#f9fbff 48%,#f4f8fc 100%) !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero{
  width:min(980px,100%) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:14px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.quizTopBackBtn{
  appearance:none;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:15px;
  background:rgba(255,255,255,.86);
  color:#1f2933;
  box-shadow:0 10px 24px rgba(31,41,51,.10);
  font:900 34px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer;
}
.quizTopBackBtn:hover,
.quizTopBackBtn:focus-visible{
  background:#fff;
  box-shadow:0 12px 28px rgba(31,41,51,.14);
  outline:none;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero > div:nth-child(2){
  text-align:center;
  justify-self:center;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero .eyebrow{
  margin:0 0 8px !important;
  color:#6b7280 !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero h2{
  margin:0 !important;
  font-size:clamp(28px,4.4vw,46px) !important;
  line-height:1.03 !important;
  letter-spacing:-.045em !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero p:not(.eyebrow){
  max-width:460px;
  margin:12px auto 0 !important;
  color:#4b5563 !important;
  font-size:clamp(15px,2vw,19px) !important;
  line-height:1.35 !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeMeta{
  align-self:start !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.76) !important;
  color:#40505f !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeGrid{
  min-height:0 !important;
  width:min(920px,100%) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  align-items:center !important;
  justify-items:center !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeGuide{
  display:none !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeCard{
  width:min(760px,100%) !important;
  max-height:100% !important;
  min-height:min(560px,100%) !important;
  overflow:auto !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  gap:18px !important;
  padding:clamp(22px,4vw,34px) !important;
  border:1px solid rgba(255,255,255,.82) !important;
  border-radius:28px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 24px 54px rgba(31,41,51,.13) !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .fullQuizQuestion{
  text-align:center !important;
  font-size:clamp(21px,3vw,34px) !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizChallengeHeader{
  justify-items:center !important;
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizChallengeHeader h3{
  font-size:clamp(24px,4vw,40px) !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizChallengeBody{
  align-content:center !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .fullQuizFeedback{
  border-radius:20px !important;
  background:#f7f8fb !important;
}
.quizBottomNav{
  width:min(760px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:16px;
  align-items:center;
}
.quizNavBtn{
  appearance:none;
  min-height:54px;
  border:0;
  border-radius:18px;
  cursor:pointer;
  font:900 16px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.quizNavBtn--back{
  background:rgba(255,255,255,.88);
  color:#1f2933;
  box-shadow:0 10px 24px rgba(31,41,51,.09);
}
.quizNavBtn--next{
  background:linear-gradient(180deg,#8b8cf6,#6267df);
  color:#fff;
  box-shadow:0 14px 28px rgba(98,103,223,.28);
}
.quizNavBtn:disabled{
  opacity:.42;
  cursor:default;
  box-shadow:none;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizTopicGrid{
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr)) !important;
  gap:14px !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizTopicCard{
  aspect-ratio:1 / 1;
  min-height:0 !important;
  align-content:center !important;
  justify-items:center;
  text-align:center !important;
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModePanel{
    overflow:auto !important;
    padding:18px 18px max(18px,env(safe-area-inset-bottom)) !important;
  }
  .appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeHero{
    grid-template-columns:44px minmax(0,1fr) !important;
  }
  .appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeMeta{
    grid-column:1 / -1;
    justify-self:center;
  }
  .appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModeCard{
    min-height:auto !important;
    max-height:none !important;
  }
  .appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizTopicGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* v2.1.98 - toolbar, mode rail and Mini-Quiz fixes. */
.boardEraserTool{
  position:relative;
  display:grid;
  place-items:center;
}
.boardEraserFlyout{
  position:absolute;
  right:calc(100% + 10px);
  top:50%;
  transform:translateY(-50%);
  display:grid;
  gap:8px;
  padding:8px;
  border-radius:20px;
  background:rgba(248,251,255,.94);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 18px 42px rgba(31,41,51,.18);
  backdrop-filter:blur(18px);
  z-index:45;
}
.boardEraserFlyout[hidden]{
  display:none !important;
}
.boardEraserFlyout .boardToolIcon{
  width:42px;
  height:42px;
}
.boardToolIcon svg{
  overflow:visible;
}
.boardTrashDrop{
  background:rgba(255,255,255,.02) !important;
  border-color:rgba(83,98,113,.34) !important;
}
.boardTrashDrop.is-over,
.boardTrashDrop.is-active,
.boardTrashDrop[data-over="true"]{
  border-color:#0877f8 !important;
  background:rgba(8,119,248,.22) !important;
  color:#075bd4 !important;
  box-shadow:0 0 0 6px rgba(8,119,248,.16),0 18px 34px rgba(8,119,248,.22) !important;
  transform:scale(1.07);
}
.toolbarHelpFlyout{
  width:min(420px,calc(100vw - 34px)) !important;
  max-height:min(620px,calc(100dvh - 110px)) !important;
  overflow:auto !important;
}
.toolbarHelpList{
  gap:8px !important;
}
.toolbarHelpItem{
  grid-template-columns:42px minmax(0,1fr) !important;
  align-items:center !important;
  padding:10px 12px !important;
}
.toolbarHelpSymbol--icon{
  width:34px !important;
  height:34px !important;
  border-radius:12px;
  display:grid !important;
  place-items:center;
  background:rgba(8,119,248,.07);
  color:#1f2933;
}
.toolbarHelpSymbol--icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.toolbarHelpItem strong{
  font-family:var(--tiles-ui-font,"Nunito",system-ui,sans-serif);
  font-weight:950;
}
.toolbarHelpItem small{
  line-height:1.32;
}
@media (max-width:1060px){
  .toolbarHelpFlyout{
    position:fixed !important;
    right:max(12px,env(safe-area-inset-right)) !important;
    left:auto !important;
    top:calc(var(--header-h,64px) + 10px) !important;
    width:min(360px,calc(100vw - 24px)) !important;
    max-height:calc(100dvh - var(--header-h,64px) - var(--nav-h,76px) - 28px) !important;
    border-radius:24px !important;
  }
  .boardEraserFlyout{
    right:calc(100% + 8px);
    top:50%;
    transform:translateY(-50%);
  }
}
@media (min-width:1061px){
  .screen--board.is-active{
    grid-template-columns:126px minmax(0,1fr) !important;
  }
  .modeRail{
    width:126px !important;
    min-width:126px !important;
    padding:14px 12px !important;
    overflow:visible !important;
  }
  .modeRailList{
    gap:10px !important;
  }
  .railBtn{
    min-height:86px !important;
    width:100% !important;
    padding:12px 6px !important;
    border-radius:24px !important;
    text-align:center !important;
    justify-items:center !important;
    align-content:center !important;
    font-family:var(--tiles-ui-font,"Nunito",system-ui,sans-serif);
    font-size:13px !important;
    font-weight:950 !important;
    line-height:1.05 !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow:visible !important;
  }
  .railBtn span{
    font-size:28px !important;
    line-height:1 !important;
    margin-bottom:4px;
  }
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .screen--board.is-active{
  display:block !important;
  min-height:100dvh !important;
  height:auto !important;
  overflow:auto !important;
  background:linear-gradient(135deg,#f3f0ff 0%,#f4f8fc 62%,#f8fbff 100%) !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .boardStage{
  display:block !important;
  min-height:100dvh !important;
  height:auto !important;
  overflow:visible !important;
  padding:0 !important;
  background:transparent !important;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModePanel{
  position:relative !important;
  z-index:5 !important;
  min-height:100dvh !important;
  height:auto !important;
  overflow:auto !important;
  isolation:isolate;
}
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModePanel::before,
.appShell[data-mode="mini-quiz"]:not([data-quiz-board="active"]) .quizModePanel::after{
  pointer-events:none !important;
}

/* v3.0.0 b200 — final Prompt 4 board, help and mini-quiz fixes. */
.boardToolIcon svg .eraserBody{
  fill:rgba(8,119,248,.08);
  stroke:currentColor;
  stroke-width:2.25;
  stroke-linejoin:round;
  stroke-linecap:round;
}
.boardToolIcon svg .eraserBand{
  stroke:currentColor;
  stroke-width:2.25;
  stroke-linecap:round;
}
.boardToolIcon svg .selectionDashedBox{
  fill:none;
  stroke:currentColor;
  stroke-width:2.15;
  stroke-dasharray:2.7 2.3;
  stroke-linecap:round;
}
#boardToolClearSelectionBtn svg rect[stroke-dasharray]{
  stroke-dasharray:2.7 2.3 !important;
  stroke-width:2.15 !important;
  stroke-linecap:round !important;
}
.toolbarHelpFlyout,
.overlayRoot[data-page="help"] .overlayPanel,
.screen--compact-overlay[data-page="help"] .compactOverlayPanel{
  overflow:hidden !important;
}
.toolbarHelpFlyout{
  max-height:min(640px,calc(100dvh - 104px)) !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) !important;
}
.toolbarHelpList,
.overlayRoot[data-page="help"] .overlayStack,
.screen--compact-overlay[data-page="help"] .compactOverlayBody{
  overflow:auto !important;
  -webkit-overflow-scrolling:touch;
}
.overlayRoot[data-page="help"] .overlayPanel{
  max-height:min(760px,calc(100dvh - 28px)) !important;
}
/* Mini-quiz should be the visible page, not hidden under board rectangles. */
.appShell[data-mode="mini-quiz"] .boardWorkspaceWrap,
.appShell[data-mode="mini-quiz"] .rightPalette,
.appShell[data-mode="mini-quiz"] .taskDrawer,
.appShell[data-mode="mini-quiz"] .bottomTray,
.appShell[data-mode="mini-quiz"] .modeRail,
.appShell[data-mode="mini-quiz"] .floatingHint,
.appShell[data-mode="mini-quiz"] .transformPanel{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.appShell[data-mode="mini-quiz"] .screen--board.is-active{
  display:block !important;
  height:100% !important;
  min-height:0 !important;
  overflow:auto !important;
  background:linear-gradient(135deg,#f3f0ff 0%,#f4f8fc 62%,#f8fbff 100%) !important;
}
.appShell[data-mode="mini-quiz"] .boardStage{
  display:block !important;
  width:100% !important;
  min-height:0 !important;
  height:auto !important;
  padding:clamp(16px,3vw,30px) !important;
  background:transparent !important;
  overflow:visible !important;
}
.appShell[data-mode="mini-quiz"] .quizModePanel{
  display:grid !important;
  visibility:visible !important;
  position:relative !important;
  z-index:999 !important;
  width:min(1120px,calc(100vw - 32px)) !important;
  margin:0 auto !important;
  min-height:auto !important;
  height:auto !important;
  overflow:visible !important;
  pointer-events:auto !important;
  isolation:isolate !important;
}
.appShell[data-mode="mini-quiz"] .quizModePanel[hidden]{
  display:grid !important;
}
.appShell[data-mode="mini-quiz"] .quizModePanel::before,
.appShell[data-mode="mini-quiz"] .quizModePanel::after,
.appShell[data-mode="mini-quiz"] .boardStage::before,
.appShell[data-mode="mini-quiz"] .boardStage::after{
  display:none !important;
  content:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid,
.appShell[data-mode="mini-quiz"] .quizModeCard,
.appShell[data-mode="mini-quiz"] .quizModeGuide,
.appShell[data-mode="mini-quiz"] .quizBottomNav{
  position:relative !important;
  z-index:1000 !important;
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] .boardStage{
    padding:14px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModePanel{
    width:100% !important;
  }
}


/* v3.0.0 b202 — mini-quiz overlay removal and snap magnet icon. */
.snapMagnetIcon path{
  fill:none;
  stroke:currentColor;
  stroke-width:2.05;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.snapMagnetIcon path:nth-child(2),
.snapMagnetIcon path:nth-child(3){
  fill:rgba(8,119,248,.08);
}
/* The unusable mini-quiz rectangle was the live board workspace/mat being shown for quiz questions above the quiz card. Keep the quiz in-card and hide board layers in Mini-Quiz mode. */
.appShell[data-mode="mini-quiz"] .boardToolbar,
.appShell[data-mode="mini-quiz"] .boardWorkspaceWrap,
.appShell[data-mode="mini-quiz"] .boardMat,
.appShell[data-mode="mini-quiz"] .tileLayer,
.appShell[data-mode="mini-quiz"] .rightPalette,
.appShell[data-mode="mini-quiz"] .taskDrawer,
.appShell[data-mode="mini-quiz"] .bottomTray,
.appShell[data-mode="mini-quiz"] .floatingHint,
.appShell[data-mode="mini-quiz"] .transformPanel{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.appShell[data-mode="mini-quiz"] .appHeader{
  display:flex !important;
}
.appShell[data-mode="mini-quiz"] .screen--board.is-active{
  display:block !important;
  height:100% !important;
  min-height:0 !important;
  overflow:auto !important;
  background:linear-gradient(135deg,#f3f0ff 0%,#f4f8fc 62%,#f8fbff 100%) !important;
}
.appShell[data-mode="mini-quiz"] .boardStage{
  display:block !important;
  min-height:0 !important;
  height:auto !important;
  padding:clamp(16px,3vw,30px) !important;
  overflow:visible !important;
  background:transparent !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel[hidden]{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  display:grid !important;
  visibility:visible !important;
  position:relative !important;
  z-index:1000 !important;
  width:min(1040px,calc(100vw - 32px)) !important;
  margin:0 auto !important;
  min-height:auto !important;
  height:auto !important;
  overflow:visible !important;
  pointer-events:auto !important;
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel::before,
.appShell[data-mode="mini-quiz"] #quizModePanel::after,
.appShell[data-mode="mini-quiz"] .boardStage::before,
.appShell[data-mode="mini-quiz"] .boardStage::after{
  display:none !important;
  content:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid,
.appShell[data-mode="mini-quiz"] .quizModeCard,
.appShell[data-mode="mini-quiz"] .fullQuizQuestion,
.appShell[data-mode="mini-quiz"] .fullQuizOptions,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback,
.appShell[data-mode="mini-quiz"] .quizBottomNav{
  position:relative !important;
  z-index:1001 !important;
  visibility:visible !important;
  opacity:1 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  display:grid !important;
  grid-template-rows:auto auto auto !important;
  gap:16px !important;
  max-height:none !important;
  overflow:visible !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizOptionGrid,
.appShell[data-mode="mini-quiz"] .quizTopicGrid{
  position:relative !important;
  z-index:1002 !important;
  visibility:visible !important;
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] .boardStage{padding:14px !important;}
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){width:100% !important;}
}

/* v3.0.0 build 210 - toolbar, quiz and zero-pair refinements. */
.snapStateAsset{
  width:22px;
  height:22px;
  display:block;
  object-fit:contain;
  filter:contrast(1.08);
}
#boardToolSnapBtn.is-active .snapStateAsset,
#boardToolSnapBtn[aria-pressed="true"] .snapStateAsset{
  filter:brightness(0) invert(1) !important;
}
#boardToolSnapBtn:not(.is-active):not([aria-pressed="true"]) .snapStateAsset{
  filter:contrast(1.08);
}
.toolbarHelpSymbol--icon img,
.toolbarHelpSymbol img{
  width:22px;
  height:22px;
  object-fit:contain;
}
.toolbarHelpFlyout{
  width:min(460px,calc(100vw - 34px)) !important;
  max-height:min(620px,calc(100dvh - 92px)) !important;
  padding:12px !important;
}
.toolbarHelpFlyout header{
  margin-bottom:8px !important;
}
.toolbarHelpFlyout h2{
  font-size:22px !important;
}
.toolbarHelpList{
  gap:6px !important;
}
.toolbarHelpItem{
  grid-template-columns:34px minmax(0,1fr) !important;
  gap:8px !important;
  padding:7px 8px !important;
  border-radius:14px !important;
}
.toolbarHelpSymbol{
  width:30px !important;
  height:30px !important;
  border-radius:10px !important;
}
.toolbarHelpSymbol svg{
  width:21px !important;
  height:21px !important;
}
.toolbarHelpItem strong{
  font-size:13px !important;
}
.toolbarHelpItem small{
  margin-top:1px !important;
  font-size:12px !important;
  line-height:1.28 !important;
}
.boardTrashDrop.is-over,
.boardTrashDrop.is-active,
.boardTrashDrop[data-over="true"]{
  border-color:#0877f8 !important;
  background:rgba(8,119,248,.26) !important;
  color:#075bd4 !important;
  box-shadow:0 0 0 7px rgba(8,119,248,.18),0 18px 38px rgba(8,119,248,.24) !important;
  transform:scale(1.08);
}
.quizModePanel{
  gap:12px !important;
}
.quizModeHero{
  min-height:0 !important;
  padding:4px 0 8px !important;
}
.quizModeHero h2{
  font-size:clamp(22px,3vw,34px) !important;
}
.quizModeHero p:not(.eyebrow){
  display:none !important;
}
.quizModeGuide{
  padding:14px !important;
}
.quizModeGuide p,
.quizModeGuide ol{
  display:none !important;
}
.quizModeCard{
  gap:12px !important;
}
.quizChallengeHeader{
  gap:5px !important;
}
.quizChallengeHeader h3,
.quizSummaryHero h3{
  font-size:clamp(22px,3vw,34px) !important;
  line-height:1.08 !important;
}
.quizChallengeHeader p{
  margin:0 !important;
}
.quizDiagramWrap,
.quizEquationDiagram{
  padding:10px !important;
}
.quizOptionGrid{
  gap:10px !important;
}
.quizOption{
  min-height:52px !important;
  padding:10px 12px !important;
  color:#111827 !important;
}
.quizFeedback{
  padding:10px !important;
}
@media (max-width:760px){
  .toolbarHelpFlyout{
    right:10px !important;
    top:10px !important;
    width:calc(100vw - 20px) !important;
    max-height:calc(100dvh - 110px) !important;
  }
  .appShell[data-mode="mini-quiz"] .boardStage{
    padding:10px !important;
  }
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    width:100% !important;
    gap:10px !important;
  }
  .quizModeGrid{
    gap:10px !important;
  }
  .quizModeGuide{
    display:none !important;
  }
  .quizModeHero{
    grid-template-columns:auto minmax(0,1fr) auto !important;
  }
  .quizModeMeta{
    font-size:11px !important;
    white-space:nowrap;
  }
  .quizOptionGrid{
    grid-template-columns:1fr !important;
  }
  .quizOptionGrid--two,
  .quizOptionGrid--compact2{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* v3.0.0 build 212 - structured board and quiz surfaces. */
.screen--board.is-active{
  background:
    linear-gradient(180deg,rgba(8,119,248,.13),rgba(255,255,255,0) 150px),
    #f8fbff !important;
}
.appShell[data-screen="board"] .screen--board.is-active{
  background:transparent !important;
}
.modeRail{
  background:#fff !important;
  border-right:1px solid rgba(18,26,47,.10) !important;
  box-shadow:none !important;
}
.railBtn{
  border-radius:8px !important;
  font-weight:650 !important;
}
.railBtn.is-active{
  background:#eef6ff !important;
  border-color:#b8d8ff !important;
  color:#0877f8 !important;
}
.boardStage{
  gap:10px !important;
}
.boardToolbar,
.bottomTray,
.taskDrawer{
  border-radius:10px !important;
  border:1px solid rgba(18,26,47,.10) !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.90) !important;
  backdrop-filter:blur(14px) !important;
}
.boardToolbar{
  padding:8px 10px !important;
}
.modeSelect{
  border-radius:8px !important;
  border:1px solid rgba(18,26,47,.14) !important;
  background:#fff !important;
  font-weight:650 !important;
}
.boardMat{
  border-radius:12px !important;
  border:1px solid rgba(18,26,47,.18) !important;
  box-shadow:none !important;
}
.boardActionToolbar,
.boardZoomFlyout,
.boardEraserFlyout,
.toolbarHelpFlyout{
  border-radius:10px !important;
  border:1px solid rgba(18,26,47,.12) !important;
  box-shadow:0 14px 34px rgba(18,26,47,.14) !important;
  background:#fff !important;
}
.boardToolIcon{
  border-radius:8px !important;
}
.boardToolIcon.is-active,
.boardToolIcon[aria-pressed="true"]{
  background:#0877f8 !important;
  color:#fff !important;
  border-color:#0877f8 !important;
}
.boardModeBadge{
  border-radius:9px !important;
  box-shadow:none !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.10) !important;
}
.stepCard,
.quizCard{
  border-radius:8px !important;
  box-shadow:none !important;
}
.quizProgressPath--bar{
  width:100%;
  margin:0 0 10px !important;
  padding:0 !important;
  display:block !important;
}
.quizProgressTrack{
  display:block;
  width:100%;
  height:7px;
  border-radius:999px;
  background:rgba(18,26,47,.10);
  overflow:hidden;
}
.quizProgressTrack i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#0877f8;
  transition:width .24s ease;
}
.quizProgressPath--bar::before,
.quizProgressPath--bar .quizProgressPathLine,
.quizProgressPath--bar .quizProgressNode{
  display:none !important;
}
.quizChallengeHeader,
.quizSummaryHero{
  gap:6px !important;
}
.quizChallengeHeader h3,
.quizSummaryHero h3{
  font-size:clamp(22px,3vw,32px) !important;
  line-height:1.12 !important;
}
.quizChallengeHeader p{
  font-weight:400 !important;
}
.quizOption{
  border-radius:8px !important;
  box-shadow:none !important;
}
@media (max-width:1060px){
  .boardToolbar{
    display:grid !important;
    grid-template-columns:minmax(150px,1fr) auto !important;
    align-items:center !important;
  }
  .toolbarGroup--mode{
    min-width:0 !important;
  }
  .modeSelect{
    width:100% !important;
    max-width:340px !important;
  }
}
@media (max-width:760px){
  .boardStage{
    padding:8px !important;
  }
  .boardToolbar,
  .bottomTray{
    border-radius:9px !important;
  }
  .boardMat{
    border-radius:10px !important;
  }
  .taskDrawer{
    border-radius:10px !important;
  }
  .quizChallengeHeader h3,
  .quizSummaryHero h3{
    font-size:24px !important;
  }
}

/* v3.0.0 build 213 - compact phone board mode picker and lighter UI weights. */
.boardModeBadge{
  overflow:visible !important;
}
.boardModeMenuBtn{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:0;
  font:inherit;
}
.boardModeMenuBtn strong{
  min-width:0;
  max-width:150px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:600 !important;
}
.boardModeMenuBtn svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.72;
  flex:0 0 auto;
}
.boardModeFlyout{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  width:min(240px,calc(100vw - 24px));
  display:grid;
  gap:2px;
  padding:6px;
  border-radius:10px;
  border:1px solid rgba(18,26,47,.12);
  background:#fff;
  box-shadow:0 16px 38px rgba(18,26,47,.16);
  z-index:80;
}
.boardModeFlyout[hidden]{
  display:none !important;
}
.boardModeFlyout button{
  min-height:38px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#1f2933;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:8px;
  padding:7px 9px;
  text-align:left;
  font:500 13px/1.15 var(--tiles-ui-font, system-ui, sans-serif);
}
.boardModeFlyout button span{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:#eef6ff;
  color:#0877f8;
  font-size:13px;
}
.boardModeFlyout button strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:500 !important;
}
.boardModeFlyout button:hover,
.boardModeFlyout button:focus-visible,
.boardModeFlyout button.is-active{
  background:#eef6ff;
  color:#0877f8;
}
.floatingHint,
.drawerHeader p,
.stepCard p,
.quizFeedback,
.quizScore,
.toolBtn,
.boardModeBadge,
.boardModeHelpBtn,
.modeSelect,
.railBtn,
.toolbarHelpItem small,
.boardToolIcon{
  font-weight:400 !important;
}
.drawerHeader h2,
.stepCard h3,
.quizCard h3,
.toolbarHelpItem strong,
.boardToolIcon.is-active,
.boardToolIcon[aria-pressed="true"],
.railBtn.is-active{
  font-weight:600 !important;
}
@media (min-width:1061px){
  .boardModeFlyout{
    display:none !important;
  }
}
@media (max-width:1060px){
  .boardModeBadge{
    padding:7px 9px !important;
    border-radius:10px !important;
    background:rgba(255,255,255,.92) !important;
  }
  .boardModeMenuBtn > span{
    display:none !important;
  }
  .boardModeFlyout span{
    display:grid !important;
  }
}
@media (max-width:760px){
  .boardModeMenuBtn strong{
    max-width:128px;
  }
}

/* v3.0.0 build 214 - targeted board and mini-quiz visual polish. */
@media (max-width:1060px){
  .appShell[data-screen="board"] .screen--board.is-active{
    height:100% !important;
  }
  .appShell[data-screen="board"] .boardStage{
    padding-top:8px !important;
  }
  .appShell[data-screen="board"] .boardWorkspaceWrap{
    min-height:0 !important;
  }
  .appShell[data-screen="board"] .taskDrawer{
    top:64px !important;
  }
}

.appShell[data-mode="mini-quiz"] .boardStage{
  background:#F7F7F7 !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  width:min(760px,calc(100vw - 28px)) !important;
  padding:clamp(10px,2vw,16px) !important;
  background:#F7F7F7 !important;
  border-radius:0 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:2px 0 8px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2){
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .eyebrow,
.appShell[data-mode="mini-quiz"] .quizProgressText{
  font-weight:500 !important;
  letter-spacing:.08em !important;
  color:#6b7280 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero h2{
  font-size:clamp(22px,3.2vw,34px) !important;
  line-height:1.08 !important;
  color:#2f3747 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero p:not(.eyebrow),
.appShell[data-mode="mini-quiz"] .quizChallengeHeader p{
  font-weight:400 !important;
  color:#667085 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid{
  grid-template-columns:minmax(0,1fr) !important;
  max-width:760px !important;
  margin-inline:auto !important;
  gap:12px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGuide{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  min-height:0 !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  gap:13px !important;
  padding:clamp(14px,2.6vw,24px) !important;
  border-radius:28px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 18px 42px rgba(18,26,47,.10) !important;
  overflow:visible !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard.is-correct-state,
.appShell[data-mode="mini-quiz"] .quizModeCard.is-wrong-state{
  background:#fff !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion{
  text-align:center !important;
  font-size:clamp(20px,3vw,30px) !important;
  line-height:1.16 !important;
  color:#303849 !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  justify-items:center !important;
  text-align:center !important;
  gap:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
  font-weight:700 !important;
  letter-spacing:-.02em !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizDiagram,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  border-radius:22px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody{
  background:#fff !important;
  gap:12px !important;
}
.appShell[data-mode="mini-quiz"] .quizDiagram,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  background:#f7f7f7 !important;
  border:1px solid rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizTile{
  border-radius:8px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 5px 10px rgba(18,26,47,.12) !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid--truefalse{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.appShell[data-mode="mini-quiz"] .quizOption,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  min-height:54px !important;
  border-radius:18px !important;
  background:#fff !important;
  color:#303849 !important;
  border:1px solid rgba(18,26,47,.10) !important;
  box-shadow:0 8px 18px rgba(18,26,47,.06) !important;
  font-weight:500 !important;
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected{
  border-color:#0877f8 !important;
  background:#eef6ff !important;
  box-shadow:0 0 0 3px rgba(8,119,248,.12) !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressTrack{
  height:8px !important;
  background:#e7eaf0 !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressTrack i{
  background:#0877f8 !important;
  box-shadow:0 0 10px rgba(8,119,248,.34) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback{
  position:sticky !important;
  bottom:10px !important;
  z-index:1100 !important;
  margin-top:0 !important;
  min-height:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}
.appShell[data-mode="mini-quiz"] .quizActionRow{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizActionRow .quizScore,
.appShell[data-mode="mini-quiz"] #quizResetQuestionBtn{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
  width:100% !important;
  min-height:56px !important;
  border-radius:18px !important;
  text-transform:uppercase !important;
  letter-spacing:.055em !important;
  font-weight:700 !important;
  background:#0877f8 !important;
  color:#fff !important;
  box-shadow:0 12px 26px rgba(8,119,248,.22) !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:disabled{
  background:#e5e7eb !important;
  color:#9aa3af !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  display:block !important;
  padding:18px !important;
  border-radius:28px 28px 22px 22px !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 22px 46px rgba(18,26,47,.18) !important;
  animation:quizFeedbackRise214 .28s cubic-bezier(.2,.8,.2,1) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct{
  background:linear-gradient(180deg,#eafaf2,#dff6ef) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong{
  background:linear-gradient(180deg,#fff0f1,#ffe2e3) !important;
  animation-name:quizFeedbackShake214 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  background:linear-gradient(180deg,#eef6ff,#e6f0ff) !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration strong,
.appShell[data-mode="mini-quiz"] .quizRetry strong,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal strong{
  display:block !important;
  font-size:clamp(22px,3vw,30px) !important;
  line-height:1.08 !important;
  color:#233047 !important;
  margin-bottom:6px !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration p,
.appShell[data-mode="mini-quiz"] .quizRetry p,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal p{
  margin:0 0 12px !important;
  color:#4b5563 !important;
  font-weight:400 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .primaryBtn,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .secondaryBtn{
  min-height:48px !important;
  border-radius:16px !important;
  font-weight:700 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .secondaryBtn{
  background:rgba(255,255,255,.58) !important;
}
@keyframes quizFeedbackRise214{
  from{opacity:0;transform:translateY(24px) scale(.985);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes quizFeedbackShake214{
  0%{opacity:0;transform:translateY(24px);}
  45%{opacity:1;transform:translateY(0) translateX(-4px);}
  70%{transform:translateX(3px);}
  100%{transform:translateX(0);}
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    width:100% !important;
    padding:8px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeCard{
    border-radius:24px !important;
    padding:13px !important;
    gap:10px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOptionGrid{
    grid-template-columns:1fr 1fr !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOption,
  .appShell[data-mode="mini-quiz"] .quizChoiceBtn{
    min-height:50px !important;
    padding:10px 8px !important;
  }
}

/* v3.0.0 build 215 - full-screen Duolingo-style quiz presentation. */
.appShell[data-mode="mini-quiz"] .screen--board.is-active{
  display:block !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  background:#F7F7F7 !important;
}
.appShell[data-mode="mini-quiz"] .boardStage{
  display:block !important;
  height:100% !important;
  min-height:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#F7F7F7 !important;
}
.appShell[data-mode="mini-quiz"] .boardToolbar,
.appShell[data-mode="mini-quiz"] .boardWorkspaceWrap,
.appShell[data-mode="mini-quiz"] .rightPalette,
.appShell[data-mode="mini-quiz"] .taskDrawer,
.appShell[data-mode="mini-quiz"] .bottomTray,
.appShell[data-mode="mini-quiz"] .modeRail,
.appShell[data-mode="mini-quiz"] .floatingHint,
.appShell[data-mode="mini-quiz"] .transformPanel,
.appShell[data-mode="mini-quiz"] .quizModeGuide,
.appShell[data-mode="mini-quiz"] .quizBottomNav{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel[hidden]{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  position:relative !important;
  z-index:1200 !important;
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:12px clamp(14px,4vw,32px) calc(112px + env(safe-area-inset-bottom)) !important;
  overflow:auto !important;
  background:
    radial-gradient(circle at 18% 0%,rgba(8,119,248,.12),transparent 34%),
    #F7F7F7 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
  width:min(820px,100%) !important;
  margin:0 auto 12px !important;
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:8px 0 12px !important;
  border:0 !important;
  background:linear-gradient(180deg,rgba(247,247,247,.96),rgba(247,247,247,.78)) !important;
  box-shadow:none !important;
  backdrop-filter:blur(14px) !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn{
  width:40px !important;
  height:40px !important;
  border:1px solid rgba(18,26,47,.08) !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#313a4d !important;
  box-shadow:0 8px 18px rgba(18,26,47,.08) !important;
  font:700 26px/1 var(--tiles-ui-font,system-ui,sans-serif) !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn:active{
  transform:scale(.96) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2){
  min-width:0 !important;
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .eyebrow{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero h2{
  margin:0 !important;
  color:#303849 !important;
  font-size:clamp(19px,2.5vw,26px) !important;
  font-weight:700 !important;
  letter-spacing:-.02em !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero p:not(.eyebrow){
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta{
  max-width:180px !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  color:#586273 !important;
  box-shadow:0 8px 18px rgba(18,26,47,.06) !important;
  font-size:12px !important;
  font-weight:600 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid{
  display:block !important;
  width:min(820px,100%) !important;
  max-width:820px !important;
  margin:0 auto !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  display:block !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion,
.appShell[data-mode="mini-quiz"] .fullQuizOptions{
  width:100% !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion{
  margin:0 0 14px !important;
  padding:20px clamp(16px,3vw,28px) !important;
  border-radius:30px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 18px 42px rgba(18,26,47,.09) !important;
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressPath--bar{
  margin:0 0 18px !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressTrack{
  height:9px !important;
  border-radius:999px !important;
  background:#e6e9ef !important;
  box-shadow:inset 0 1px 2px rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressTrack i{
  background:linear-gradient(90deg,#0b78ff,#4ea1ff) !important;
  box-shadow:0 0 14px rgba(8,119,248,.32) !important;
  transition:width .3s cubic-bezier(.22,.8,.22,1) !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  display:grid !important;
  justify-items:center !important;
  gap:8px !important;
  text-align:center !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressText{
  font-size:11px !important;
  font-weight:600 !important;
  letter-spacing:.08em !important;
  color:#7b8492 !important;
  text-transform:uppercase !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
  margin:0 !important;
  color:#303849 !important;
  font-size:clamp(24px,4vw,40px) !important;
  line-height:1.08 !important;
  font-weight:700 !important;
  letter-spacing:-.025em !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader p,
.appShell[data-mode="mini-quiz"] .quizSummaryHero p{
  color:#667085 !important;
  font-weight:400 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizOptions{
  display:grid !important;
  gap:14px !important;
  padding-bottom:18px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizTopicGrid,
.appShell[data-mode="mini-quiz"] .quizSummaryStats{
  border-radius:30px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace{
  padding:clamp(14px,3vw,24px) !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 18px 42px rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizDiagram,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  background:#F7F7F7 !important;
  border-color:rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizTile{
  border-radius:9px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 7px 14px rgba(18,26,47,.14) !important;
  transition:transform .18s cubic-bezier(.22,.8,.22,1),box-shadow .18s ease !important;
}
.appShell[data-mode="mini-quiz"] .quizTile:hover{
  transform:translateY(-1px) !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--two,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--compact2{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
}
.appShell[data-mode="mini-quiz"] .quizOption,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  min-height:58px !important;
  padding:14px 12px !important;
  border-radius:22px !important;
  background:#fff !important;
  color:#303849 !important;
  border:1px solid rgba(18,26,47,.10) !important;
  box-shadow:0 10px 24px rgba(18,26,47,.07) !important;
  font-size:clamp(15px,2.5vw,18px) !important;
  font-weight:500 !important;
  text-align:center !important;
  transition:transform .16s cubic-bezier(.22,.8,.22,1),box-shadow .16s ease,border-color .16s ease,background .16s ease !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:hover,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:focus-visible{
  transform:translateY(-1px) !important;
  border-color:rgba(8,119,248,.30) !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:active{
  transform:scale(.985) !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected{
  border-color:#0877f8 !important;
  background:#eef6ff !important;
  box-shadow:0 0 0 4px rgba(8,119,248,.12),0 10px 24px rgba(8,119,248,.10) !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-correct{
  background:#e8f8f0 !important;
  border-color:rgba(37,166,105,.34) !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-wrong{
  background:#fff0f1 !important;
  border-color:rgba(232,75,73,.28) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:calc(14px + env(safe-area-inset-bottom)) !important;
  width:min(680px,calc(100vw - 28px)) !important;
  z-index:3000 !important;
  transform:translateX(-50%) !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizActionRow{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
  width:100% !important;
  min-height:62px !important;
  border-radius:22px !important;
  border:0 !important;
  background:linear-gradient(180deg,#1989ff,#0877f8) !important;
  color:#fff !important;
  box-shadow:0 16px 30px rgba(8,119,248,.26),inset 0 1px 0 rgba(255,255,255,.25) !important;
  font-size:16px !important;
  font-weight:700 !important;
  letter-spacing:.075em !important;
  transition:transform .13s cubic-bezier(.22,.8,.22,1),box-shadow .13s ease,filter .13s ease !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:active{
  transform:translateY(2px) scale(.985) !important;
  box-shadow:0 8px 18px rgba(8,119,248,.22),inset 0 1px 0 rgba(255,255,255,.20) !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:disabled{
  background:#e5e7eb !important;
  color:#9aa3af !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  padding:24px !important;
  border-radius:34px 34px 26px 26px !important;
  border:1px solid rgba(255,255,255,.72) !important;
  box-shadow:0 26px 58px rgba(18,26,47,.22),inset 0 1px 0 rgba(255,255,255,.42) !important;
  backdrop-filter:blur(18px) !important;
  animation:quizHeroPanelSpring215 .46s cubic-bezier(.18,.92,.24,1.08) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct{
  background:linear-gradient(180deg,rgba(232,250,242,.96),rgba(212,245,232,.96)) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong{
  background:linear-gradient(180deg,rgba(255,241,242,.98),rgba(255,222,225,.98)) !important;
  animation-name:quizHeroPanelWrong215 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  background:linear-gradient(180deg,rgba(238,246,255,.98),rgba(224,238,255,.98)) !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedbackIcon{
  width:48px !important;
  height:48px !important;
  display:grid !important;
  place-items:center !important;
  margin-bottom:12px !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.72) !important;
  color:#0877f8 !important;
  font-size:26px !important;
  font-weight:800 !important;
  box-shadow:0 10px 20px rgba(18,26,47,.08) !important;
  animation:quizIconPop215 .42s cubic-bezier(.18,.9,.22,1.25) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong .quizFeedbackIcon{
  color:#e84b49 !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration strong,
.appShell[data-mode="mini-quiz"] .quizRetry strong,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal strong{
  display:block !important;
  color:#263247 !important;
  font-size:clamp(25px,4vw,36px) !important;
  line-height:1.05 !important;
  font-weight:800 !important;
  letter-spacing:-.025em !important;
  margin:0 0 8px !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration p,
.appShell[data-mode="mini-quiz"] .quizRetry p,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal p{
  margin:0 0 18px !important;
  color:#475467 !important;
  font-size:15px !important;
  line-height:1.4 !important;
  font-weight:400 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .primaryBtn,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .secondaryBtn{
  min-height:52px !important;
  border-radius:18px !important;
  font-weight:700 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .primaryBtn{
  background:#0877f8 !important;
  color:#fff !important;
  box-shadow:0 12px 24px rgba(8,119,248,.20) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback .secondaryBtn{
  background:rgba(255,255,255,.64) !important;
  color:#3f4858 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--review{
  position:static !important;
  transform:none !important;
  width:100% !important;
  margin-top:14px !important;
  padding:18px !important;
  border-radius:26px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 14px 34px rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizSummaryStats{
  padding:0 !important;
  background:transparent !important;
}
@keyframes quizHeroPanelSpring215{
  0%{opacity:0;transform:translateX(-50%) translateY(46px) scale(.96);}
  70%{opacity:1;transform:translateX(-50%) translateY(-3px) scale(1.012);}
  100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
}
@keyframes quizHeroPanelWrong215{
  0%{opacity:0;transform:translateX(-50%) translateY(46px) scale(.96);}
  55%{opacity:1;transform:translateX(calc(-50% - 4px)) translateY(0) scale(1);}
  75%{transform:translateX(calc(-50% + 3px)) translateY(0) scale(1);}
  100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
}
@keyframes quizIconPop215{
  from{opacity:0;transform:scale(.7) rotate(-5deg);}
  to{opacity:1;transform:scale(1) rotate(0);}
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    padding:10px 12px calc(104px + env(safe-area-inset-bottom)) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeHero{
    grid-template-columns:40px minmax(0,1fr) auto !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeMeta{
    max-width:118px !important;
    font-size:11px !important;
    padding-inline:9px !important;
  }
  .appShell[data-mode="mini-quiz"] .fullQuizQuestion{
    padding:16px 14px !important;
    border-radius:26px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizChallengeBody,
  .appShell[data-mode="mini-quiz"] .quizDiagramWrap,
  .appShell[data-mode="mini-quiz"] .quizWorkspace{
    padding:13px !important;
    border-radius:24px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOptionGrid,
  .appShell[data-mode="mini-quiz"] .quizOptionGrid--two,
  .appShell[data-mode="mini-quiz"] .quizOptionGrid--compact2{
    gap:9px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOption,
  .appShell[data-mode="mini-quiz"] .quizChoiceBtn{
    min-height:52px !important;
    border-radius:18px !important;
    padding:11px 8px !important;
  }
  .appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
    min-height:58px !important;
    border-radius:20px !important;
  }
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
    padding:20px !important;
    border-radius:30px 30px 24px 24px !important;
  }
}
@media (prefers-reduced-motion:reduce){
  .appShell[data-mode="mini-quiz"] *,
  .appShell[data-mode="mini-quiz"] *::before,
  .appShell[data-mode="mini-quiz"] *::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}

/* v3.0.0 build 216 - targeted quiz fit, selected-state and completion polish. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  padding:8px clamp(12px,2vw,22px) calc(92px + env(safe-area-inset-bottom)) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  min-height:0 !important;
  grid-template-columns:44px minmax(0,1fr) auto !important;
  align-items:center !important;
  margin:0 auto 6px !important;
  padding:2px 0 6px !important;
  max-width:min(980px,100%) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2),
.appShell[data-mode="mini-quiz"] .quizModeHero h2,
.appShell[data-mode="mini-quiz"] .quizModeHero p:not(.eyebrow){
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta{
  min-height:34px !important;
  padding:7px 12px !important;
  font-size:12px !important;
  font-weight:600 !important;
  white-space:nowrap !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta:empty{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn{
  width:40px !important;
  height:40px !important;
  border-radius:15px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid{
  max-width:min(920px,100%) !important;
  gap:10px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  gap:10px !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion{
  margin:0 0 8px !important;
  padding:14px clamp(14px,2.4vw,24px) !important;
  border-radius:26px !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressPath--bar{
  margin:0 0 12px !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressTrack{
  height:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  gap:6px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader .quizProgressText{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
  font-size:clamp(21px,3vw,34px) !important;
  line-height:1.08 !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader p,
.appShell[data-mode="mini-quiz"] .quizSummaryHero p{
  margin:0 !important;
  font-size:14px !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizOptions{
  gap:10px !important;
  padding-bottom:10px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace{
  padding:12px !important;
  border-radius:22px !important;
}
.appShell[data-mode="mini-quiz"] .quizDiagram{
  gap:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--two,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--compact2{
  gap:9px !important;
}
.appShell[data-mode="mini-quiz"] .quizOption,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  min-height:50px !important;
  padding:10px 10px !important;
  border-radius:18px !important;
  font-weight:500 !important;
  color:#202939 !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn[aria-pressed="true"]{
  border-color:#0877f8 !important;
  background:linear-gradient(180deg,#eef6ff,#e4f0ff) !important;
  box-shadow:0 0 0 4px rgba(8,119,248,.14),0 10px 24px rgba(8,119,248,.12) !important;
  color:#102a4f !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid--two .quizChoiceBtn{
  font-size:clamp(18px,3vw,24px) !important;
  font-weight:650 !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
  min-height:56px !important;
  border-radius:20px !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  padding:18px !important;
  border-radius:30px 30px 24px 24px !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration strong,
.appShell[data-mode="mini-quiz"] .quizRetry strong,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal strong{
  font-size:clamp(22px,3.5vw,32px) !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration p,
.appShell[data-mode="mini-quiz"] .quizRetry p,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal p{
  margin-bottom:14px !important;
}
.appShell[data-mode="mini-quiz"] .quizSummaryHero{
  display:grid !important;
  justify-items:center !important;
  gap:8px !important;
  padding:18px clamp(16px,3vw,28px) !important;
  border-radius:26px !important;
  background:linear-gradient(180deg,#fff,#f7fbff) !important;
  border:1px solid rgba(8,119,248,.12) !important;
  box-shadow:0 16px 34px rgba(18,26,47,.08) !important;
}
.appShell[data-mode="mini-quiz"] .quizSummaryStats{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizSummaryStats span{
  display:grid !important;
  gap:2px !important;
  min-height:64px !important;
  align-content:center !important;
  border-radius:18px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 10px 22px rgba(18,26,47,.06) !important;
  color:#667085 !important;
  font-weight:400 !important;
}
.appShell[data-mode="mini-quiz"] .quizSummaryStats strong{
  color:#0877f8 !important;
  font-weight:700 !important;
}
.appShell[data-mode="mini-quiz"] .overlayActions.quizActions{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--review{
  max-height:min(34vh,280px) !important;
  overflow:auto !important;
}
@media (max-height:760px){
  .appShell[data-mode="mini-quiz"] .quizDiagramWrap,
  .appShell[data-mode="mini-quiz"] .quizWorkspace,
  .appShell[data-mode="mini-quiz"] .quizChallengeBody{
    padding:10px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizTile{
    transform:scale(.92) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizTileLine{
    gap:6px !important;
  }
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    padding:6px 10px calc(88px + env(safe-area-inset-bottom)) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeHero{
    grid-template-columns:40px minmax(0,1fr) auto !important;
    padding-bottom:4px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeMeta{
    min-height:32px !important;
    max-width:none !important;
    padding-inline:10px !important;
  }
  .appShell[data-mode="mini-quiz"] .fullQuizQuestion{
    padding:12px 11px !important;
    border-radius:22px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
  .appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
    font-size:clamp(20px,6.2vw,28px) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOption,
  .appShell[data-mode="mini-quiz"] .quizChoiceBtn{
    min-height:48px !important;
    border-radius:16px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizSummaryStats{
    grid-template-columns:1fr !important;
  }
  .appShell[data-mode="mini-quiz"] .overlayActions.quizActions{
    grid-template-columns:1fr !important;
  }
}

/* v3.0.0 build 217 - simplified Duolingo-style quiz structure. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  display:block !important;
  min-height:100dvh !important;
  background:#f7f7f7 !important;
  padding:10px clamp(12px,2.4vw,24px) calc(98px + env(safe-area-inset-bottom)) !important;
  overflow:auto !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  position:sticky !important;
  top:0 !important;
  z-index:120 !important;
  display:grid !important;
  grid-template-columns:42px minmax(80px,1fr) auto !important;
  gap:12px !important;
  width:min(900px,100%) !important;
  max-width:min(900px,100%) !important;
  margin:0 auto 10px !important;
  padding:6px 0 8px !important;
  background:linear-gradient(180deg,#f7f7f7 70%,rgba(247,247,247,0)) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2){
  display:block !important;
  min-width:0 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero h2,
.appShell[data-mode="mini-quiz"] .quizModeHero .eyebrow,
.appShell[data-mode="mini-quiz"] .quizModeHero p:not(.eyebrow){
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressPath--bar{
  display:block !important;
  margin:0 !important;
  padding-top:16px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack{
  height:8px !important;
  background:#e3e7ee !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack i{
  background:linear-gradient(90deg,#0877f8,#5da9ff) !important;
  transition:width .32s cubic-bezier(.22,.8,.22,1) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta{
  align-self:start !important;
  min-height:38px !important;
  display:grid !important;
  place-items:center !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  color:#42526a !important;
  box-shadow:0 8px 18px rgba(18,26,47,.06) !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn{
  align-self:start !important;
  background:#fff !important;
  border-color:rgba(18,26,47,.08) !important;
  box-shadow:0 8px 18px rgba(18,26,47,.06) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeGrid{
  display:block !important;
  width:min(900px,100%) !important;
  max-width:min(900px,100%) !important;
  margin-inline:auto !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  display:block !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion{
  margin:0 0 12px !important;
  padding:clamp(16px,3vw,28px) !important;
  border-radius:28px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 14px 32px rgba(18,26,47,.07) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion > .quizProgressPath--bar{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  justify-items:start !important;
  text-align:left !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
  color:#242b3a !important;
  font-size:clamp(22px,3vw,34px) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizOptions{
  display:block !important;
  padding:0 0 18px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody{
  display:grid !important;
  gap:12px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  border-radius:24px !important;
  background:#fff !important;
  border:1px solid rgba(18,26,47,.08) !important;
  box-shadow:0 10px 24px rgba(18,26,47,.05) !important;
}
.appShell[data-mode="mini-quiz"] .quizOptionGrid,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--two,
.appShell[data-mode="mini-quiz"] .quizOptionGrid--compact2{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  min-height:58px !important;
  border-radius:20px !important;
  border:1px solid rgba(18,26,47,.10) !important;
  background:#fff !important;
  box-shadow:0 8px 18px rgba(18,26,47,.05) !important;
  transition:transform .14s cubic-bezier(.22,.8,.22,1),box-shadow .14s ease,border-color .14s ease,background .14s ease !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:active{
  transform:scale(.985) !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn[aria-pressed="true"]{
  background:#eef6ff !important;
  border-color:#0877f8 !important;
  box-shadow:0 0 0 4px rgba(8,119,248,.13),0 10px 24px rgba(8,119,248,.10) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback:not(.quizFeedback--quiet):not(.quizFeedback--review){
  position:fixed !important;
  left:50% !important;
  bottom:calc(14px + env(safe-area-inset-bottom)) !important;
  z-index:4000 !important;
  width:min(680px,calc(100vw - 28px)) !important;
  transform:translateX(-50%) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback:not(.is-correct):not(.is-wrong):not(.quizFeedback--reveal):not(.quizFeedback--review):not(.quizFeedback--quiet){
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedback--quiet{
  position:static !important;
  transform:none !important;
  width:auto !important;
  margin-top:12px !important;
}
.appShell[data-mode="mini-quiz"] .quizActionRow{
  display:grid !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
  width:100% !important;
  min-height:62px !important;
  border-radius:22px !important;
  letter-spacing:.07em !important;
  transition:transform .14s cubic-bezier(.22,.8,.22,1),box-shadow .14s ease,background .14s ease,color .14s ease !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:not(:disabled){
  background:linear-gradient(180deg,#1688ff,#0877f8) !important;
  color:#fff !important;
  box-shadow:0 16px 28px rgba(8,119,248,.24) !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:disabled{
  background:#e5e7eb !important;
  color:#98a2b3 !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn:active{
  transform:translateY(2px) scale(.988) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  border-radius:34px 34px 26px 26px !important;
  animation:quizHeroPanelSpring215 .46s cubic-bezier(.18,.92,.24,1.08) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong{
  animation-name:quizHeroPanelWrong215 !important;
}
@media (max-height:760px){
  .appShell[data-mode="mini-quiz"] .fullQuizQuestion{
    padding:14px !important;
    margin-bottom:8px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizDiagramWrap,
  .appShell[data-mode="mini-quiz"] .quizWorkspace{
    padding:10px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizChoiceBtn{
    min-height:50px !important;
  }
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    padding:8px 10px calc(92px + env(safe-area-inset-bottom)) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeHero{
    grid-template-columns:40px minmax(70px,1fr) auto !important;
    gap:9px !important;
    margin-bottom:8px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeMeta{
    min-height:34px !important;
    padding:7px 9px !important;
    font-size:11px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizOptionGrid,
  .appShell[data-mode="mini-quiz"] .quizOptionGrid--two,
  .appShell[data-mode="mini-quiz"] .quizOptionGrid--compact2{
    gap:8px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizChoiceBtn{
    min-height:52px !important;
    border-radius:18px !important;
  }
}

/* v3.0.0 build 218 - no app header during quizzes, persistent top progress and slower feedback. */
.appShell[data-mode="mini-quiz"]{
  grid-template-rows:minmax(0,1fr) !important;
}
.appShell[data-mode="mini-quiz"] .appHeader,
.appShell[data-mode="mini-quiz"] .desktopTopNav,
.appShell[data-mode="mini-quiz"] .bottomNav,
.appShell[data-mode="mini-quiz"] .modeRail{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .appMain,
.appShell[data-mode="mini-quiz"] .screen--board.is-active{
  height:100dvh !important;
  min-height:100dvh !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  grid-template-columns:42px minmax(110px,1fr) auto !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2){
  display:block !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero > div:nth-child(2):empty{
  min-height:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressPath--bar{
  display:block !important;
  width:100% !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack{
  height:9px !important;
  background:#e1e7ef !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack i{
  transition:width .62s cubic-bezier(.22,.8,.22,1) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  animation-duration:.82s !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedbackIcon{
  animation-duration:.66s !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  transition:transform .22s cubic-bezier(.22,.8,.22,1),box-shadow .22s ease,border-color .22s ease,background .22s ease !important;
}
.appShell[data-mode="mini-quiz"] #quizCheckAnswerBtn{
  transition:transform .22s cubic-bezier(.22,.8,.22,1),box-shadow .22s ease,background .22s ease,color .22s ease !important;
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] .quizModeHero{
    grid-template-columns:40px minmax(82px,1fr) auto !important;
  }
}

/* v3.0.0 build 219 - cleaner quiz canvas and stronger feedback panels. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  background:#f7f7f7 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero{
  grid-template-columns:42px minmax(0,1fr) minmax(0,auto) !important;
  padding-top:8px !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn{
  width:38px !important;
  height:38px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#9aa3af !important;
  font-size:30px !important;
  font-weight:500 !important;
  line-height:1 !important;
}
.appShell[data-mode="mini-quiz"] .quizTopBackBtn:hover,
.appShell[data-mode="mini-quiz"] .quizTopBackBtn:focus-visible{
  color:#667085 !important;
  background:rgba(18,26,47,.045) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta{
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#f97316 !important;
  font-size:18px !important;
  font-weight:750 !important;
  opacity:1 !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta:not(:empty){
  animation:quizFireCounterPop219 .55s cubic-bezier(.17,.9,.22,1.28) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizQuestion{
  margin:0 0 14px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  padding:6px 2px 14px !important;
  justify-items:start !important;
  text-align:left !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
  font-size:clamp(25px,3.8vw,42px) !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizDiagram,
.appShell[data-mode="mini-quiz"] .quizTileLine,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram{
  justify-content:flex-start !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  background:#fff !important;
  border-color:rgba(18,26,47,.10) !important;
  box-shadow:0 6px 16px rgba(18,26,47,.05) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  padding:22px 22px 22px 90px !important;
  border-radius:36px 36px 26px 26px !important;
  animation-duration:1.08s !important;
  animation-timing-function:cubic-bezier(.16,.86,.18,1.03) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct{
  background:linear-gradient(180deg,#c9f7df,#91e8bd) !important;
  border-color:rgba(16,185,129,.34) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong{
  background:linear-gradient(180deg,#ffd0d4,#ff9da7) !important;
  border-color:rgba(239,68,68,.34) !important;
  animation-name:quizHeroPanelWrong219 !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration,
.appShell[data-mode="mini-quiz"] .quizRetry{
  position:relative !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedbackIcon{
  position:absolute !important;
  left:-70px !important;
  top:0 !important;
  width:54px !important;
  height:54px !important;
  margin:0 !important;
  border-radius:999px !important;
  color:#fff !important;
  font-size:30px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 12px 24px rgba(18,26,47,.18),inset 0 1px 0 rgba(255,255,255,.30) !important;
  animation-duration:.82s !important;
}
.appShell[data-mode="mini-quiz"] .is-correct .quizFeedbackIcon{
  background:#10b981 !important;
}
.appShell[data-mode="mini-quiz"] .is-wrong .quizFeedbackIcon{
  background:#ef4444 !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration strong,
.appShell[data-mode="mini-quiz"] .quizRetry strong{
  color:#162033 !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration p,
.appShell[data-mode="mini-quiz"] .quizRetry p{
  color:#253142 !important;
}
@keyframes quizFireCounterPop219{
  0%{opacity:0;transform:translateY(6px) scale(.82);}
  65%{opacity:1;transform:translateY(-2px) scale(1.12);}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes quizHeroPanelWrong219{
  0%{opacity:0;transform:translateX(-50%) translateY(74px) scale(.94);}
  45%{opacity:1;transform:translateX(calc(-50% - 7px)) translateY(-8px) scale(1.01);}
  62%{transform:translateX(calc(-50% + 6px)) translateY(0) scale(1);}
  78%{transform:translateX(calc(-50% - 3px)) translateY(0) scale(1);}
  100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
  .appShell[data-mode="mini-quiz"] .quizSummaryHero h3{
    font-size:clamp(24px,7vw,34px) !important;
  }
  .appShell[data-mode="mini-quiz"] .quizModeMeta{
    font-size:16px !important;
  }
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
    padding:20px 18px 20px 78px !important;
  }
  .appShell[data-mode="mini-quiz"] .quizFeedbackIcon{
    left:-60px !important;
    width:48px !important;
    height:48px !important;
    font-size:27px !important;
  }
}

/* v3.0.0 build 220 - transparent quiz canvas, unclipped choices and algebra typography. */
.appShell[data-mode="mini-quiz"] .fullQuizQuestion,
.appShell[data-mode="mini-quiz"] .quizModeCard,
.appShell[data-mode="mini-quiz"] .quizChallengeHeader,
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizArrayPreview,
.appShell[data-mode="mini-quiz"] .quizDropZones,
.appShell[data-mode="mini-quiz"] .quizTilePool{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard{
  padding:0 !important;
  border-radius:0 !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader{
  padding:4px 0 14px !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3{
  margin-inline:0 !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn{
  box-shadow:none !important;
  overflow:visible !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:hover,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn:focus-visible,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected:hover,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected:focus-visible{
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn[aria-pressed="true"]{
  box-shadow:none !important;
  outline:0 !important;
  border-color:#0877f8 !important;
  background:#eef6ff !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected::before,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn[aria-pressed="true"]::before,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn.is-selected::after,
.appShell[data-mode="mini-quiz"] .quizChoiceBtn[aria-pressed="true"]::after{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizModeMeta{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#f97316 !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
.appShell[data-mode="mini-quiz"] .quizProgressText{
  display:none !important;
}
.appShell[data-mode="mini-quiz"] .quizAlgebraText,
.appShell[data-mode="mini-quiz"] .quizOptionMath,
.appShell[data-mode="mini-quiz"] .quizDiagramExpression,
.appShell[data-mode="mini-quiz"] .quizArrayPreview strong,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .tile-var,
.appShell[data-mode="mini-quiz"] .tile-exp{
  font-family:"Cambria Math","STIX Two Math","STIXGeneral","Times New Roman",serif !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong .quizFeedbackIcon,
.appShell[data-mode="mini-quiz"] .is-wrong .quizFeedbackIcon{
  color:#fff !important;
}

/* v3.0.0 build 225 - stronger quiz feedback flyouts without incorrect-answer shake. */
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  border-radius:22px 22px 16px 16px !important;
  border:1px solid rgba(255,255,255,.76) !important;
  box-shadow:0 34px 72px rgba(18,26,47,.28), inset 0 1px 0 rgba(255,255,255,.42) !important;
  animation:quizFeedbackFly225 .82s cubic-bezier(.16,.9,.18,1.05) both !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct{
  background:linear-gradient(180deg,#24e38a 0%,#08bd6f 100%) !important;
  border-color:rgba(16,185,129,.55) !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong{
  background:linear-gradient(180deg,#ff5b68 0%,#e9303f 100%) !important;
  border-color:rgba(239,68,68,.58) !important;
  animation-name:quizFeedbackFly225 !important;
}
.appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
  background:linear-gradient(180deg,#49a0ff 0%,#0877f8 100%) !important;
  border-color:rgba(8,119,248,.52) !important;
}
.appShell[data-mode="mini-quiz"] .quizCelebration strong,
.appShell[data-mode="mini-quiz"] .quizRetry strong,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal strong,
.appShell[data-mode="mini-quiz"] .quizCelebration p,
.appShell[data-mode="mini-quiz"] .quizRetry p,
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal p{
  color:#fff !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedbackIcon{
  background:rgba(255,255,255,.20) !important;
  border:2px solid rgba(255,255,255,.78) !important;
  box-shadow:0 14px 30px rgba(18,26,47,.20), inset 0 1px 0 rgba(255,255,255,.28) !important;
  animation:quizFeedbackIconPop225 .76s cubic-bezier(.16,.9,.2,1.25) .12s both !important;
}
.appShell[data-mode="mini-quiz"] .is-correct .quizFeedbackIcon{
  background:#00a967 !important;
}
.appShell[data-mode="mini-quiz"] .is-wrong .quizFeedbackIcon{
  background:#c81f2d !important;
  color:#fff !important;
}
.appShell[data-mode="mini-quiz"] .quizFeedback--reveal .quizFeedbackIcon{
  background:#005ed1 !important;
}
@keyframes quizFeedbackFly225{
  0%{
    opacity:0;
    transform:translateX(-50%) translateY(132px) scale(.94);
  }
  56%{
    opacity:1;
    transform:translateX(-50%) translateY(-16px) scale(1.025);
  }
  78%{
    transform:translateX(-50%) translateY(5px) scale(.995);
  }
  100%{
    opacity:1;
    transform:translateX(-50%) translateY(0) scale(1);
  }
}
@keyframes quizFeedbackIconPop225{
  0%{opacity:0;transform:translateY(12px) scale(.6) rotate(-8deg);}
  64%{opacity:1;transform:translateY(-3px) scale(1.15) rotate(2deg);}
  100%{opacity:1;transform:translateY(0) scale(1) rotate(0);}
}
@media (max-width:760px){
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-correct,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.is-wrong,
  .appShell[data-mode="mini-quiz"] .fullQuizFeedback.quizFeedback--reveal{
    border-radius:20px 20px 14px 14px !important;
  }
}

/* v3.0.0 build 226 - Foundations world artwork and premium quiz progress. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  background-color:#eef6ff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.84),rgba(255,255,255,.60)),
    url("../../assets/worlds/1-foundations/world-bible/mobile/background.png") !important;
  background-size:cover !important;
  background-position:center top !important;
  isolation:isolate !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressPath--bar{
  width:min(680px,100%) !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack,
.appShell[data-mode="mini-quiz"] .quizProgressTrack{
  height:11px !important;
  background:rgba(15,27,58,.12) !important;
  border:1px solid rgba(255,255,255,.62) !important;
  box-shadow:inset 0 2px 5px rgba(15,27,58,.10),0 8px 20px rgba(0,95,229,.08) !important;
  overflow:hidden !important;
}
.appShell[data-mode="mini-quiz"] .quizModeHero .quizProgressTrack i,
.appShell[data-mode="mini-quiz"] .quizProgressTrack i{
  background:linear-gradient(90deg,#1a7dff 0%,#46a6ff 55%,#7bdcff 100%) !important;
  box-shadow:0 0 18px rgba(26,125,255,.42),inset 0 1px 0 rgba(255,255,255,.42) !important;
  transition:width .78s cubic-bezier(.2,.78,.18,1) !important;
}
@media (min-width:761px) and (orientation:portrait){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:
      linear-gradient(90deg,rgba(255,255,255,.84),rgba(255,255,255,.58)),
      url("../../assets/worlds/1-foundations/world-bible/tablet-portrait/background.png") !important;
  }
}
@media (min-width:761px) and (orientation:landscape){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:
      linear-gradient(90deg,rgba(255,255,255,.86),rgba(255,255,255,.48)),
      url("../../assets/worlds/1-foundations/world-bible/tablet-landscape/background.png") !important;
    background-position:center center !important;
  }
}
@media (min-width:1120px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:
      linear-gradient(90deg,rgba(255,255,255,.86),rgba(255,255,255,.44)),
      url("../../assets/worlds/1-foundations/world-bible/desktop/background.png") !important;
    background-position:center center !important;
  }
}

/* v3.0.0 build 228 - transparent quiz question canvas over full world-bible artwork. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  background-image:url("../../assets/worlds/1-foundations/world-bible/mobile/background.png") !important;
  background-size:cover !important;
  background-position:center center !important;
}
.appShell[data-mode="mini-quiz"] .quizModeCard,
.appShell[data-mode="mini-quiz"] .fullQuizQuestion,
.appShell[data-mode="mini-quiz"] .quizChallengeHeader,
.appShell[data-mode="mini-quiz"] .quizChallengeBody,
.appShell[data-mode="mini-quiz"] .quizDiagramWrap,
.appShell[data-mode="mini-quiz"] .quizWorkspace,
.appShell[data-mode="mini-quiz"] .quizEquationDiagram,
.appShell[data-mode="mini-quiz"] .quizArrayPreview{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.appShell[data-mode="mini-quiz"] .quizChoiceBtn,
.appShell[data-mode="mini-quiz"] .quizOption,
.appShell[data-mode="mini-quiz"] .quizDropZone,
.appShell[data-mode="mini-quiz"] .quizTilePool,
.appShell[data-mode="mini-quiz"] .quizStartTiles{
  background:rgba(255,255,255,.90) !important;
}
.appShell[data-mode="mini-quiz"] .quizChallengeHeader h3,
.appShell[data-mode="mini-quiz"] .quizChallengeHeader p{
  text-shadow:0 1px 0 rgba(255,255,255,.75) !important;
}
@media (min-width:761px) and (orientation:portrait){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:url("../../assets/worlds/1-foundations/world-bible/tablet-portrait/background.png") !important;
  }
}
@media (min-width:761px) and (orientation:landscape){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:url("../../assets/worlds/1-foundations/world-bible/tablet-landscape/background.png") !important;
  }
}
@media (min-width:1120px){
  .appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
    background-image:url("../../assets/worlds/1-foundations/world-bible/desktop/background.png") !important;
  }
}

/* v3.2.1 build 248 - share the blurred world-backdrop treatment with quizzes/challenges. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  position:relative !important;
  overflow:hidden !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden])::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  background:
    radial-gradient(circle at 16% 10%,rgba(255,255,255,.34),transparent 27%),
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02)) !important;
  backdrop-filter:blur(3px) saturate(1.04) !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]) > *{
  position:relative !important;
  z-index:1 !important;
}

/* v3.2.3 build 250 - shared pointer drag ghost for Learn, Quiz and Challenge drop activities. */
.sharedDropDragGhost{
  position:fixed !important;
  z-index:10000 !important;
  left:0 !important;
  top:0 !important;
  margin:0 !important;
  pointer-events:none !important;
  touch-action:none !important;
  box-sizing:border-box !important;
  transform:translate3d(0,0,0) scale(1.02) !important;
  transform-origin:0 0 !important;
  filter:drop-shadow(0 18px 28px rgba(15,35,75,.22)) !important;
  opacity:.96 !important;
}
.sharedDropDragGhost.tile{
  display:block !important;
}
.sharedDropDragGhost.learnLabelToken,
.sharedDropDragGhost.learnTextToken,
.sharedDropDragGhost.quizPoolTile{
  display:grid !important;
  place-items:center !important;
}
.quizPoolTile{
  touch-action:none !important;
  -webkit-user-select:none !important;
  user-select:none !important;
}
.quizPoolTile.is-dragging{
  opacity:.56 !important;
}
.quizDropZone.is-drag-hover{
  border-color:rgba(28,125,255,.74) !important;
  background:rgba(232,244,255,.88) !important;
  box-shadow:0 0 0 5px rgba(28,125,255,.14),0 14px 28px rgba(15,35,75,.12) !important;
}

/* v3.2.7 build 254 - balanced compact tile and algebra-label scaling. */
@media (min-width:761px) and (max-width:1060px){
  .boardMat .tile[data-kind="one"] .tile__label{font-size:20px !important;}
  .boardMat .tile[data-kind="x"] .tile__label{font-size:24px !important;}
  .boardMat .tile[data-kind="x2"] .tile__label{font-size:28px !important;}

  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="one"],
  .foundationJourneyOverlay .foundationBoardTile.tile--one{
    --tileW:30px !important;
    --tileH:30px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x{
    --tileW:30px !important;
    --tileH:112px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"][data-orientation="h"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x[data-orientation="h"]{
    --tileW:112px !important;
    --tileH:30px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x2"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x2{
    --tileW:112px !important;
    --tileH:112px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="one"] .tile__label{font-size:18px !important;}
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"] .tile__label{font-size:21px !important;}
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x2"] .tile__label{font-size:25px !important;}

  .bottomTray .mobilePaletteCluster .tilePreview__label{font-size:17px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--x2 .tilePreview__label{font-size:19px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{font-size:18px !important;}

  .appShell[data-mode="mini-quiz"] .quizTile--x2{width:68px !important;height:68px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--xV{width:30px !important;height:68px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--xH{width:68px !important;height:30px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--one{width:30px !important;height:30px !important;}
  .appShell[data-mode="mini-quiz"] .quizTileLabel{font-size:22px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--one .quizTileLabel{font-size:23px !important;}
}
@media (max-width:760px){
  .boardMat .tile[data-kind="one"] .tile__label{font-size:13px !important;}
  .boardMat .tile[data-kind="x"] .tile__label{font-size:15px !important;}
  .boardMat .tile[data-kind="x2"] .tile__label{font-size:18px !important;}

  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="one"],
  .foundationJourneyOverlay .foundationBoardTile.tile--one{
    --tileW:26px !important;
    --tileH:26px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x{
    --tileW:26px !important;
    --tileH:92px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"][data-orientation="h"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x[data-orientation="h"]{
    --tileW:92px !important;
    --tileH:26px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x2"],
  .foundationJourneyOverlay .foundationBoardTile.tile--x2{
    --tileW:92px !important;
    --tileH:92px !important;
  }
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="one"] .tile__label{font-size:16px !important;}
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x"] .tile__label{font-size:19px !important;}
  .foundationJourneyOverlay .foundationBoardTile.tile[data-kind="x2"] .tile__label{font-size:23px !important;}

  .bottomTray .mobilePaletteCluster .tilePreview__label{font-size:15px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--x2 .tilePreview__label{font-size:17px !important;}
  .bottomTray .mobilePaletteCluster .tilePreview--one .tilePreview__label{font-size:15px !important;}

  .appShell[data-mode="mini-quiz"] .quizTile--x2{width:54px !important;height:54px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--xV{width:28px !important;height:54px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--xH{width:54px !important;height:28px !important;}
  .appShell[data-mode="mini-quiz"] .quizTile--one{width:28px !important;height:28px !important;}
  .appShell[data-mode="mini-quiz"] .quizTileLabel,
  .appShell[data-mode="mini-quiz"] .quizTile--one .quizTileLabel{font-size:19px !important;}
}

/* v3.2.10 build 257 - keep quiz/challenge artwork surfaces matched to the viewport. */
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden]){
  width:100vw !important;
  max-width:none !important;
  margin-inline:calc(50% - 50vw) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.appShell[data-mode="mini-quiz"] #quizModePanel:not([hidden])::before{
  width:100vw !important;
  max-width:none !important;
}

/* Free-play board shell: no modes or guided-task columns. */
.screen--board.is-active{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  height:100% !important;
}
.screen--board .modeRail,
.screen--board .boardModeBadge,
.screen--board .taskDrawer{
  display:none !important;
}
.appShell[data-screen="board"] .boardToolIcon > img{
  display:block !important;
  width:22px !important;
  height:22px !important;
  object-fit:contain !important;
}
.appShell[data-screen="board"] .boardToolIcon.is-active > img,
.appShell[data-screen="board"] .boardToolIcon[aria-pressed="true"] > img,
.appShell[data-screen="board"] .boardToolIcon.is-shortcut-flash > img{
  filter:brightness(0) invert(1) !important;
}
.appShell[data-screen="board"] .boardStage{
  height:100% !important;
  min-height:0 !important;
  grid-template-rows:minmax(0,1fr) !important;
  padding:0 14px 14px !important;
  gap:0 !important;
}
.appShell[data-screen="board"] .boardWorkspaceWrap,
.appShell[data-screen="board"] .boardWorkspaceWrap.palette-hidden,
.appShell[data-screen="board"] .boardWorkspaceWrap.drawer-collapsed{
  min-height:0 !important;
  height:100% !important;
  grid-template-columns:minmax(0,1fr) 164px !important;
  gap:12px !important;
}
.appShell[data-screen="board"] #rightPalette.rightPalette,
.appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
  display:block !important;
  position:relative !important;
  inset:auto !important;
  min-height:0 !important;
  max-height:none !important;
  border:1px solid rgba(18,26,47,.10) !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 10px 28px rgba(18,26,47,.08) !important;
  backdrop-filter:blur(16px) !important;
}
.appShell[data-screen="board"] .boardMat{
  border-radius:22px !important;
}
.appShell[data-screen="board"] .bottomTray{
  display:none !important;
}

/* Phone/tablet palette accordion. It begins expanded and collapses to its handle. */
.mobilePaletteHeader{
  display:none;
}
@media (max-width:1060px){
  .appShell[data-screen="board"] .boardStage{
    grid-template-rows:minmax(0,1fr) auto !important;
    padding:0 10px 10px !important;
    gap:8px !important;
  }
  .appShell[data-screen="board"] .boardWorkspaceWrap,
  .appShell[data-screen="board"] .boardWorkspaceWrap.palette-hidden,
  .appShell[data-screen="board"] .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) !important;
    gap:0 !important;
    height:auto !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
    display:none !important;
  }
  .appShell[data-screen="board"] .bottomTray.mobilePalette{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    gap:8px !important;
    padding:8px 10px 10px !important;
    overflow:visible !important;
    border:1px solid rgba(18,26,47,.10) !important;
    border-radius:22px !important;
    background:rgba(255,255,255,.90) !important;
    box-shadow:0 10px 28px rgba(18,26,47,.10) !important;
    backdrop-filter:blur(16px) !important;
  }
  .appShell[data-screen="board"] .bottomTray.mobilePalette.is-collapsed{
    grid-template-rows:auto !important;
    padding-bottom:8px !important;
  }
  .mobilePaletteHeader{
    display:flex !important;
    min-height:34px !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    padding-left:4px !important;
    color:#172033 !important;
  }
  .mobilePaletteHeader strong{
    font-size:13px !important;
    letter-spacing:.02em !important;
  }
  .mobilePaletteToggleBtn{
    width:36px !important;
    height:36px !important;
    padding:6px !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid rgba(18,26,47,.10) !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#172033 !important;
    cursor:pointer !important;
  }
  .mobilePaletteToggleBtn img{
    display:block !important;
    width:22px !important;
    height:22px !important;
    object-fit:contain !important;
  }
  .appShell[data-screen="board"] .mobilePaletteCluster{
    --compact-palette-x2:50px;
    --compact-palette-unit:24px;
    display:grid !important;
    width:100% !important;
    min-width:0 !important;
    grid-template-columns:var(--compact-palette-x2) var(--compact-palette-unit) 14px var(--compact-palette-x2) var(--compact-palette-unit) !important;
    grid-template-rows:var(--compact-palette-x2) var(--compact-palette-unit) !important;
    gap:4px !important;
    justify-content:center !important;
    align-items:stretch !important;
    overflow-x:hidden !important;
    overflow-y:hidden !important;
    padding:2px 2px 4px !important;
    scrollbar-width:none !important;
  }
  .appShell[data-screen="board"] .mobilePaletteCluster[hidden]{
    display:none !important;
  }
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn{
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    display:grid !important;
    place-items:center !important;
  }
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(5){grid-column:4 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(6){grid-column:5 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(7){grid-column:4 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .paletteBtn:nth-child(8){grid-column:5 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .tilePreview--x2{width:var(--compact-palette-x2) !important;height:var(--compact-palette-x2) !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .tilePreview--xV{width:var(--compact-palette-unit) !important;height:var(--compact-palette-x2) !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .tilePreview--xH{width:var(--compact-palette-x2) !important;height:var(--compact-palette-unit) !important;}
  .appShell[data-screen="board"] .mobilePaletteCluster .tilePreview--one{width:var(--compact-palette-unit) !important;height:var(--compact-palette-unit) !important;}
}
@media (max-width:760px){
  .appShell[data-screen="board"] .boardStage{
    padding:0 8px 8px !important;
    gap:6px !important;
  }
  .appShell[data-screen="board"] .bottomTray.mobilePalette{
    border-radius:18px !important;
    padding:6px 8px 8px !important;
    gap:5px !important;
  }
  .mobilePaletteHeader{
    min-height:32px !important;
  }
  .mobilePaletteToggleBtn{
    width:34px !important;
    height:34px !important;
  }
}

/* Slightly larger desktop palette previews and labels. */
@media (min-width:1061px){
  .appShell[data-screen="board"] #rightPalette .atbTileButtons.pwaTileButtons{
    --palette-x2:94px !important;
    --palette-unit:34px !important;
  }
  .appShell[data-screen="board"] #rightPalette .atbTileButtons.pwaTileButtons .tilePreview__label{
    font-size:27px !important;
  }
  .appShell[data-screen="board"] #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--xV .tilePreview__label{
    font-size:24px !important;
  }
  .appShell[data-screen="board"] #rightPalette .atbTileButtons.pwaTileButtons .tilePreview--one .tilePreview__label{
    font-size:30px !important;
  }
}

/* Board surface visual trial — remove this block to restore the previous appearance. */
.appShell[data-screen="board"] .boardMat{
  background-color:#f3f7fa !important;
  background-image:
    radial-gradient(circle,rgba(79,128,212,.13) 1px,transparent 1.35px),
    linear-gradient(145deg,rgba(255,255,255,.58),rgba(226,237,246,.34)) !important;
  background-size:24px 24px,100% 100% !important;
  border:1px solid rgba(57,82,111,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.90),
    inset 0 0 40px rgba(70,105,140,.035),
    0 10px 30px rgba(31,55,83,.08) !important;
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease !important;
}
.appShell[data-screen="board"] .boardMat.is-over{
  outline:none !important;
  border-color:rgba(8,119,248,.46) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.90),
    inset 0 0 0 3px rgba(8,119,248,.10),
    0 0 0 4px rgba(8,119,248,.08),
    0 14px 36px rgba(31,55,83,.12) !important;
}
.appShell[data-screen="board"] #rightPalette.rightPalette,
.appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
  border-color:rgba(57,82,111,.14) !important;
  background:rgba(255,255,255,.84) !important;
  box-shadow:0 14px 34px rgba(31,55,83,.10) !important;
}
.appShell[data-screen="board"] .boardActionToolbar{
  border-color:rgba(57,82,111,.13) !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 14px 32px rgba(31,55,83,.14) !important;
  backdrop-filter:blur(16px) !important;
}
.appShell[data-screen="board"] .boardTrashDrop > img{
  display:block;
  width:16px;
  height:16px;
  object-fit:contain;
  opacity:.82;
}
.appShell[data-screen="board"] .boardTrashDrop.is-over > img{
  filter:invert(18%) sepia(78%) saturate(3374%) hue-rotate(335deg) brightness(82%) contrast(94%);
}

/* The toolbar expander reports its state without looking permanently selected. */
.appShell[data-screen="board"] #boardToolCollapseBtn[aria-pressed="true"]{
  border-color:transparent !important;
  background:transparent !important;
  color:#1f2933 !important;
  box-shadow:none !important;
}
.appShell[data-screen="board"] #boardToolCollapseBtn[aria-pressed="true"] > img{
  filter:none !important;
}
.appShell[data-screen="board"] #boardToolCollapseBtn:hover{
  background:rgba(31,41,51,.08) !important;
}

/* Board layout refinement: one responsive palette with signed sections. */
.boardPaletteToggleBtn,
.boardPaletteCloseBtn,
.boardPaletteBackdrop{
  display:none;
}
.appShell[data-screen="board"] #rightPalette[hidden]{
  display:none !important;
}
.appShell[data-screen="board"] .tilePaletteSections{
  display:grid;
  gap:16px;
  min-height:0;
}
.appShell[data-screen="board"] .tilePaletteSection{
  display:grid;
  gap:8px;
}
.appShell[data-screen="board"] .tilePaletteSection + .tilePaletteSection{
  padding-top:14px;
  border-top:1px solid rgba(31,41,51,.10);
}
.appShell[data-screen="board"] .tilePaletteSection h2{
  display:flex;
  align-items:center;
  gap:7px;
  margin:0;
  color:#40505f;
  font-size:12px;
  font-weight:850;
  line-height:1.2;
  letter-spacing:.01em;
}
.appShell[data-screen="board"] .tilePaletteSection h2 > span{
  width:8px;
  height:8px;
  flex:0 0 auto;
  border:1px solid rgba(31,41,51,.24);
  border-radius:999px;
}
.appShell[data-screen="board"] .tilePaletteSection--positive h2 > span{
  background:var(--tile-yellow);
}
.appShell[data-screen="board"] .tilePaletteSection--negative h2 > span{
  background:var(--tile-negative);
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
  --palette-x2:94px;
  --palette-unit:34px;
  --palette-gap:5px;
  display:grid !important;
  grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
  grid-template-rows:var(--palette-x2) var(--palette-unit) !important;
  gap:var(--palette-gap) !important;
  width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
  margin:0 auto !important;
  align-items:stretch !important;
  justify-items:stretch !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn{
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:grid !important;
  place-items:center !important;
  touch-action:none;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid .tilePreview--x2{
  width:var(--palette-x2) !important;
  height:var(--palette-x2) !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid .tilePreview--xV{
  width:var(--palette-unit) !important;
  height:var(--palette-x2) !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid .tilePreview--xH{
  width:var(--palette-x2) !important;
  height:var(--palette-unit) !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid .tilePreview--one{
  width:var(--palette-unit) !important;
  height:var(--palette-unit) !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:focus-visible{
  outline:3px solid rgba(8,119,248,.26) !important;
  outline-offset:3px !important;
}

@media (min-width:1061px){
  .appShell[data-screen="board"] .boardWorkspaceWrap,
  .appShell[data-screen="board"] .boardWorkspaceWrap.palette-hidden,
  .appShell[data-screen="board"] .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) 184px !important;
    gap:10px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
    display:flex !important;
    width:184px !important;
    padding:12px 13px 14px !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader{
    display:block !important;
    margin:0 0 12px !important;
    text-align:left !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader .eyebrow{
    text-align:left !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHint{
    max-width:none !important;
    margin:4px 0 0 !important;
    text-align:left !important;
  }
}

@media (max-width:1060px){
  .appShell[data-screen="board"] .boardStage{
    position:relative !important;
    grid-template-rows:minmax(0,1fr) !important;
  }
  .appShell[data-screen="board"] .boardWorkspaceWrap,
  .appShell[data-screen="board"] .boardWorkspaceWrap.palette-hidden,
  .appShell[data-screen="board"] .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) !important;
    height:100% !important;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    appearance:none;
    position:absolute;
    left:max(12px,env(safe-area-inset-left));
    top:12px;
    z-index:55;
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:42px;
    padding:0 12px 0 10px;
    border:1px solid rgba(57,82,111,.14);
    border-radius:999px;
    background:rgba(255,255,255,.88);
    color:#172033;
    box-shadow:0 10px 26px rgba(31,55,83,.12);
    backdrop-filter:blur(14px);
    font:800 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    cursor:pointer;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn img{
    display:block;
    width:20px;
    height:20px;
    object-fit:contain;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn.is-active{
    border-color:#0877f8;
    background:#0877f8;
    color:#fff;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn.is-active img{
    filter:brightness(0) invert(1);
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn:focus-visible,
  .appShell[data-screen="board"] .boardPaletteCloseBtn:focus-visible{
    outline:3px solid rgba(8,119,248,.28);
    outline-offset:2px;
  }
  .appShell[data-screen="board"] .boardPaletteBackdrop{
    position:fixed;
    top:64px;
    right:0;
    bottom:0;
    left:0;
    z-index:79;
    display:block;
    background:rgba(31,41,51,.20);
    backdrop-filter:blur(3px);
    transition:opacity .16s ease;
  }
  .appShell[data-screen="board"] .boardPaletteBackdrop[hidden]{
    display:none !important;
  }
  .appShell[data-screen="board"].is-palette-dragging .boardPaletteBackdrop{
    opacity:0;
    pointer-events:none;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    position:fixed !important;
    top:max(72px,calc(env(safe-area-inset-top) + 64px)) !important;
    right:auto !important;
    bottom:max(10px,env(safe-area-inset-bottom)) !important;
    left:max(10px,env(safe-area-inset-left)) !important;
    z-index:90 !important;
    display:none !important;
    width:min(300px,calc(100vw - 24px)) !important;
    max-height:none !important;
    padding:14px !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border-radius:24px !important;
    background:rgba(248,251,255,.97) !important;
    box-shadow:0 24px 68px rgba(31,41,51,.24) !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader{
    position:sticky;
    top:-14px;
    z-index:2;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    margin:-2px -2px 12px !important;
    padding:2px 2px 10px !important;
    text-align:left !important;
    background:rgba(248,251,255,.94);
    backdrop-filter:blur(12px);
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader .eyebrow,
  .appShell[data-screen="board"] #rightPalette .paletteHint{
    text-align:left !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHint{
    max-width:none !important;
    margin:3px 0 0 !important;
  }
  .appShell[data-screen="board"] .boardPaletteCloseBtn{
    appearance:none;
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    flex:0 0 auto;
    padding:0;
    border:1px solid rgba(31,41,51,.10);
    border-radius:999px;
    background:#fff;
    cursor:pointer;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteSections{
    gap:14px;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    --palette-x2:88px;
    --palette-unit:34px;
    --palette-gap:6px;
  }
  .appShell[data-screen="board"] .boardActionToolbar.is-collapsed{
    z-index:95 !important;
  }
}

/* Keep the established palette order without permanent positive/negative headings. */
.appShell[data-screen="board"] #rightPalette .tilePaletteSection > h2{
  display:none !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteSections{
  gap:12px !important;
}
.appShell[data-screen="board"] #rightPalette .tilePaletteSection,
.appShell[data-screen="board"] #rightPalette .tilePaletteSection + .tilePaletteSection{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}

@media (max-width:760px){
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    left:max(9px,env(safe-area-inset-left));
    top:9px;
    min-height:40px;
    padding-inline:9px 11px;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    top:max(66px,calc(env(safe-area-inset-top) + 60px)) !important;
    width:min(286px,calc(100vw - 18px)) !important;
    border-radius:20px !important;
  }
}

/* Final compact palette presentation: horizontal, bottom-aligned and non-modal. */
@media (max-width:1060px){
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    left:max(12px,env(safe-area-inset-left)) !important;
    right:auto !important;
    top:auto !important;
    bottom:max(12px,env(safe-area-inset-bottom)) !important;
    z-index:96 !important;
    min-height:48px !important;
    padding:0 13px 0 11px !important;
  }
  .appShell[data-screen="board"] .boardPaletteToggleBtn img{
    width:23px !important;
    height:23px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    position:absolute !important;
    inset:auto max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(88px,calc(env(safe-area-inset-left) + 82px)) !important;
    z-index:94 !important;
    display:none !important;
    align-self:auto !important;
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:116px !important;
    padding:9px 10px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    border-radius:20px !important;
    background:rgba(248,251,255,.95) !important;
    box-shadow:0 14px 38px rgba(31,55,83,.18) !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    --palette-x2:64px;
    --palette-unit:26px;
    --palette-gap:4px;
    grid-template-columns:var(--palette-x2) var(--palette-unit) 12px var(--palette-x2) var(--palette-unit) !important;
    grid-template-rows:var(--palette-x2) var(--palette-unit) !important;
    width:calc((var(--palette-x2) + var(--palette-unit)) * 2 + 28px) !important;
    min-width:calc((var(--palette-x2) + var(--palette-unit)) * 2 + 28px) !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(1){grid-column:1 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(2){grid-column:2 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(3){grid-column:1 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(4){grid-column:2 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(5){grid-column:4 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(6){grid-column:5 !important;grid-row:1 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(7){grid-column:4 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid > .paletteBtn:nth-child(8){grid-column:5 !important;grid-row:2 !important;}
  .appShell[data-screen="board"] .boardTrashDrop{
    left:max(12px,env(safe-area-inset-left)) !important;
    bottom:max(132px,calc(env(safe-area-inset-bottom) + 126px)) !important;
    min-width:136px !important;
    min-height:52px !important;
  }
  .appShell[data-screen="board"] .boardTrashDrop > span{
    display:inline !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader,
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection > h2{
    display:none !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteSections{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    width:max-content !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection,
  .appShell[data-screen="board"] #rightPalette .tilePaletteSection + .tilePaletteSection{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
    grid-template-rows:var(--palette-x2) var(--palette-unit) !important;
    width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
    min-width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
  }
}

@media (max-width:360px){
  .appShell[data-screen="board"] .boardPaletteToggleBtn{
    left:max(8px,env(safe-area-inset-left)) !important;
    min-height:44px !important;
    padding-inline:9px 10px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    left:max(78px,calc(env(safe-area-inset-left) + 72px)) !important;
    right:max(8px,env(safe-area-inset-right)) !important;
    padding-inline:7px !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteGrid{
    --palette-x2:58px;
    --palette-unit:24px;
    grid-template-columns:var(--palette-x2) var(--palette-unit) !important;
    width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
    min-width:calc(var(--palette-x2) + var(--palette-unit) + var(--palette-gap)) !important;
  }
}

/* Final desktop palette alignment and empty-state tile composition. */
.appShell[data-screen="board"] .boardEmptyStateTiles{
  gap:0 !important;
}
.appShell[data-screen="board"] .boardEmptyStateTile--positive{
  position:relative;
  z-index:2;
  transform:translateX(5px) rotate(-8deg);
}
.appShell[data-screen="board"] .boardEmptyStateTile--negative{
  position:relative;
  z-index:1;
  transform:translateX(-5px) translateY(3px) rotate(8deg);
}

@media (min-width:1061px){
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
    align-items:stretch !important;
    justify-content:flex-start !important;
    padding-top:16px !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader{
    display:block !important;
    width:100% !important;
    margin:0 0 14px !important;
    text-align:center !important;
  }
  .appShell[data-screen="board"] #rightPalette .paletteHeader .eyebrow,
  .appShell[data-screen="board"] #rightPalette .paletteHint{
    width:100% !important;
    max-width:none !important;
    margin-inline:auto !important;
    text-align:center !important;
  }
}

/* Final compact placement correction: the palette always contracts to its
   attached right-hand control, while delete remains on the board bottom-left. */
@media (max-width:1060px){
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open,
  .appShell[data-screen="board"] #rightPalette.rightPalette[hidden]{
    position:absolute !important;
    inset:auto max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) auto !important;
    z-index:96 !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    justify-content:flex-end !important;
    width:72px !important;
    min-width:72px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:116px !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid rgba(57,82,111,.14) !important;
    border-radius:18px !important;
    background:rgba(248,251,255,.96) !important;
    box-shadow:0 14px 38px rgba(31,55,83,.18) !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    width:min(430px,calc(100vw - 176px)) !important;
    height:116px !important;
    border-radius:20px !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    display:flex !important;
    flex:0 0 70px !important;
    width:70px !important;
    min-width:70px !important;
    min-height:50px !important;
    height:auto !important;
    align-items:center !important;
    justify-content:center !important;
    flex-direction:column !important;
    gap:3px !important;
    padding:5px 7px !important;
    border:0 !important;
    border-left:1px solid transparent !important;
    border-radius:17px !important;
    background:transparent !important;
    color:#536174 !important;
    box-shadow:none !important;
    filter:none !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
  .appShell[data-screen="board"] #rightPalette.is-open .boardPaletteToggleBtn{
    border-left-color:rgba(57,82,111,.12) !important;
    border-radius:0 19px 19px 0 !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn.is-active{
    background:transparent !important;
    color:#536174 !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn img{
    width:22px !important;
    height:22px !important;
    filter:none !important;
  }
  .appShell[data-screen="board"] .boardTrashDrop{
    position:fixed !important;
    inset:auto auto max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) !important;
    height:56px !important;
    min-height:56px !important;
    margin:0 !important;
    transform:none;
  }
  .appShell[data-screen="board"] .boardTrashDrop.is-over,
  .appShell[data-screen="board"] .boardTrashDrop.is-active,
  .appShell[data-screen="board"] .boardTrashDrop[data-over="true"]{
    transform:scale(1.07);
  }
}

@media (max-width:420px){
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    width:calc(100vw - 174px) !important;
  }
}

/* The expanded compact palette spans the device bottom. The collapsed state
   remains the attached TILES control on the right. */
@media (max-width:1060px){
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    position:fixed !important;
    right:env(safe-area-inset-right) !important;
    bottom:0 !important;
    left:auto !important;
    width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
    min-width:0 !important;
    height:calc(132px + env(safe-area-inset-bottom)) !important;
    min-height:calc(132px + env(safe-area-inset-bottom)) !important;
    max-height:none !important;
    padding:10px 0 calc(10px + env(safe-area-inset-bottom)) 10px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
    border-radius:20px 20px 0 0 !important;
    transition:
      width .38s cubic-bezier(.22,.72,.2,1),
      height .38s cubic-bezier(.22,.72,.2,1),
      border-radius .34s ease !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open .tilePaletteSections{
    flex:1 1 auto !important;
    min-width:0 !important;
    min-height:calc(64px + 26px + 4px) !important;
    justify-content:flex-start !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    overscroll-behavior-inline:contain;
    scrollbar-width:none;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open .tilePaletteSections::-webkit-scrollbar{
    display:none;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open .boardPaletteToggleBtn{
    align-self:stretch !important;
  }
}

/* The installed board is a focused workspace, so website navigation is hidden. */
html.tiles-board-installed .appShell[data-screen="board"] #headerHomeBtn{
  display:none !important;
}

/* Saved-board choice and compact device palette refinements. */
.savedBoardPrompt{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  background:rgba(15,33,60,.46);
  backdrop-filter:blur(12px);
}
.savedBoardPrompt[hidden]{display:none !important}
.savedBoardPromptCard{
  width:min(480px,100%);
  padding:28px;
  border:1px solid rgba(255,255,255,.42);
  border-radius:28px;
  background:linear-gradient(145deg,#0a83fb 0%,#0669e9 58%,#0758c8 100%);
  box-shadow:0 28px 80px rgba(11,55,115,.34);
  color:#fff;
  text-align:center;
}
.savedBoardPromptCard>img{
  display:block;
  width:auto;
  height:34px;
  max-width:160px;
  margin:0 auto 22px;
  object-fit:contain;
}
.savedBoardPromptCard .eyebrow{margin:0 0 8px;color:rgba(255,255,255,.76)}
.savedBoardPromptCard h2{margin:0;font-size:clamp(25px,6vw,34px);line-height:1.08}
.savedBoardPromptCard>p:not(.eyebrow){margin:14px auto 0;max-width:350px;color:rgba(255,255,255,.84);line-height:1.5}
.savedBoardPromptCard>div{display:grid;gap:10px;margin-top:24px}
.savedBoardPromptCard button{min-height:48px;border-radius:14px;font-weight:900}
.savedBoardPromptCard .primaryBtn{background:#fff;color:#0758c8}
.savedBoardPromptCard .secondaryBtn{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.10);color:#fff}
.appShell[data-screen="board"] .boardEmptyStateTile{
  display:grid;
  place-items:center;
  width:36px !important;
  height:36px !important;
  border:2px solid #111;
  border-radius:4px !important;
  box-shadow:none !important;
  font:400 20px/1 var(--tile-font-family) !important;
}
.appShell[data-screen="board"] .boardEmptyStateTile>span{display:flex;align-items:baseline;justify-content:center}
.appShell[data-screen="board"] .boardEmptyStateTile b{font:inherit}

@media (max-width:1060px){
  .appShell[data-screen="board"] .boardEmptyState{gap:7px !important}
  .appShell[data-screen="board"] .boardEmptyState p{font-size:13px !important}
  .appShell[data-screen="board"] .boardEmptyStateTile{
    width:28px !important;
    height:28px !important;
    border-radius:4px !important;
    font-size:15px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    right:max(10px,env(safe-area-inset-right)) !important;
    bottom:max(10px,env(safe-area-inset-bottom)) !important;
    width:max-content !important;
    max-width:calc(100vw - max(10px,env(safe-area-inset-left)) - max(10px,env(safe-area-inset-right))) !important;
    height:auto !important;
    min-height:0 !important;
    padding:8px 0 8px 8px !important;
    border-radius:20px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open .tilePaletteSections{
    flex:0 1 auto !important;
    min-height:94px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open .boardPaletteToggleBtn{
    flex-basis:58px !important;
    width:58px !important;
    min-width:58px !important;
  }
}

@media (min-width:761px) and (max-width:1060px) and (orientation:landscape){
  .appShell[data-screen="board"] .boardWorkspaceWrap,
  .appShell[data-screen="board"] .boardWorkspaceWrap.palette-hidden,
  .appShell[data-screen="board"] .boardWorkspaceWrap.drawer-collapsed{
    grid-template-columns:minmax(0,1fr) max-content !important;
    gap:10px !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open,
  .appShell[data-screen="board"] #rightPalette.rightPalette[hidden]{
    position:relative !important;
    inset:auto !important;
    display:flex !important;
    width:max-content !important;
    min-width:0 !important;
    height:max-content !important;
    min-height:0 !important;
    max-height:100% !important;
    padding:10px !important;
    overflow:auto !important;
    border-radius:22px !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteContent{display:block !important}
  .appShell[data-screen="board"] #rightPalette .tilePaletteSections{
    flex-direction:column !important;
    align-items:center !important;
    gap:10px !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{display:none !important}
}

/* Animate the compact palette while keeping tablet landscape as a fixed rail. */
@media (max-width:760px), (min-width:761px) and (max-width:1060px) and (orientation:portrait){
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-hidden{
    transition:
      width .32s cubic-bezier(.22,.72,.2,1),
      height .32s cubic-bezier(.22,.72,.2,1),
      min-height .32s cubic-bezier(.22,.72,.2,1),
      border-radius .28s ease,
      box-shadow .28s ease !important;
  }
  .appShell[data-screen="board"] #rightPalette.rightPalette.is-open{
    width:min(310px,calc(100vw - max(10px,env(safe-area-inset-left)) - max(10px,env(safe-area-inset-right)))) !important;
    height:114px !important;
    min-height:114px !important;
  }
  .appShell[data-screen="board"] #rightPalette .tilePaletteContent{
    opacity:0;
    transform:translateY(8px) scale(.985);
    transform-origin:right bottom;
    transition:opacity .16s ease,transform .28s cubic-bezier(.22,.72,.2,1) !important;
  }
  .appShell[data-screen="board"] #rightPalette.is-open .tilePaletteContent{
    opacity:1;
    transform:translateY(0) scale(1);
    transition-delay:.06s !important;
  }
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{
    transition:background-color .2s ease,border-radius .28s ease,color .2s ease !important;
  }
}

/* Use the settings space as a readable, left-aligned policy list. */
.appShell[data-screen="board"] .boardSettingsLegalLinks{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px !important;
  justify-content:stretch !important;
  text-align:left !important;
}
.appShell[data-screen="board"] .boardSettingsLegalLinks a,
.appShell[data-screen="board"] .boardSettingsLegalLinks button{
  display:flex !important;
  width:100%;
  min-height:42px;
  align-items:center;
  justify-content:flex-start;
  padding:9px 10px;
  border:1px solid rgba(8,119,248,.13);
  border-radius:11px;
  background:rgba(238,246,255,.72);
  color:inherit;
  font:inherit;
  cursor:pointer;
  text-align:left;
  text-decoration:none;
}

.appShell[data-screen="board"] .boardSettingsInstallSection{
  display:block;
  border-color:rgba(8,119,248,.22);
  background:linear-gradient(135deg,rgba(238,246,255,.92),rgba(255,255,255,.98));
}
.appShell[data-screen="board"] .boardSettingsInstallSection[hidden]{
  display:none !important;
}
.appShell[data-screen="board"] .boardSettingsInstallHeader{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  align-items:center;
  gap:12px;
}
.appShell[data-screen="board"] .boardSettingsInstallHeader > img{
  display:block;
  width:44px;
  height:44px;
  border-radius:12px;
  box-shadow:0 7px 16px rgba(8,119,248,.16);
}
.appShell[data-screen="board"] .boardSettingsInstallHeader h3{
  margin:0 0 3px;
}
.appShell[data-screen="board"] .boardSettingsInstallSection p{
  margin:0;
}
.appShell[data-screen="board"] .boardSettingsInstallMobile,
.appShell[data-screen="board"] .boardSettingsInstallDesktop{
  margin-top:15px;
  padding-top:15px;
  border-top:1px solid rgba(8,119,248,.13);
}
.appShell[data-screen="board"] .boardSettingsInstallMobile[hidden],
.appShell[data-screen="board"] .boardSettingsInstallDesktop[hidden]{
  display:none !important;
}
.appShell[data-screen="board"] .boardSettingsInstallMobile button{
  display:inline-flex;
  width:100%;
  min-height:46px;
  align-items:center;
  justify-content:center;
  margin-top:13px;
  padding:9px 15px;
  border:0;
  border-radius:13px;
  background:#0877f8;
  color:#fff;
  font:inherit;
  font-weight:850;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(8,119,248,.18);
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop{
  display:grid;
  grid-template-columns:minmax(0,1fr) 132px;
  align-items:center;
  gap:20px;
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop h4{
  margin:0 0 7px;
  color:#172033;
  font-size:14px;
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop strong{
  color:#344054;
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop figure{
  margin:0;
  text-align:center;
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop figure img{
  display:block;
  width:116px;
  height:116px;
  margin:0 auto;
  padding:9px;
  border:1px solid rgba(31,41,51,.1);
  border-radius:15px;
  background:#fff;
  box-shadow:0 8px 20px rgba(31,55,83,.1);
}
.appShell[data-screen="board"] .boardSettingsInstallDesktop figcaption{
  margin-top:7px;
  color:#667085;
  font-size:10px;
  font-weight:800;
}

@media (max-width:560px){
  .appShell[data-screen="board"] .boardSettingsLegalLinks{
    grid-template-columns:1fr;
  }
}

@media (prefers-reduced-motion:reduce){
  .appShell[data-screen="board"] #rightPalette.rightPalette,
  .appShell[data-screen="board"] #rightPalette .tilePaletteContent,
  .appShell[data-screen="board"] #rightPalette .boardPaletteToggleBtn{
    transition:none !important;
  }
}

/* Compact board surface alignment: reserve the toolbar footprint when centring
   the empty state and keep every exposed board gutter cool and neutral. */
@media (max-width:1060px){
  html:has(.appShell[data-screen="board"]),
  body:has(.appShell[data-screen="board"]),
  .appShell[data-screen="board"],
  .appShell[data-screen="board"] .appMain,
  .appShell[data-screen="board"] .screen--board,
  .appShell[data-screen="board"] .boardStage,
  .appShell[data-screen="board"] .boardWorkspaceWrap{
    background:#f3f7fa !important;
  }

  .appShell[data-screen="board"] .boardMat{
    border-color:rgba(57,82,111,.14) !important;
  }

  .appShell[data-screen="board"] .boardEmptyState{
    left:calc(50% - 28px) !important;
  }
}

/* Phone delete target: icon-only, with the full touch target retained. */
@media (max-width:760px){
  .appShell[data-screen="board"] .boardTrashDrop{
    width:54px !important;
    min-width:54px !important;
    padding-inline:0 !important;
  }
  .appShell[data-screen="board"] .boardTrashDrop > span{
    display:none !important;
  }
}

@media (max-width:1060px){
  .appShell[data-screen="board"] .boardTrashDrop{
    transition:bottom 380ms cubic-bezier(.22,.72,.2,1),transform 180ms ease,background-color 180ms ease,border-color 180ms ease !important;
  }
  .appShell[data-screen="board"].is-board-palette-open .boardTrashDrop{
    bottom:max(12px,env(safe-area-inset-bottom)) !important;
  }
  .appShell[data-screen="board"].is-trash-palette-overlap .boardTrashDrop{
    bottom:var(--trash-palette-bottom,calc(144px + env(safe-area-inset-bottom))) !important;
  }
}

/* Feedback capture and diagnostics stay explicit, readable and child-friendly. */
.feedbackPrivacyNote{
  margin:-7px 0 0 !important;
  padding-left:28px;
  color:#667085 !important;
  font-size:12px !important;
}
.feedbackDiagnosticsPreview{
  display:grid;
  gap:12px;
  margin-top:10px;
}
.feedbackDiagnosticsPreview section{
  overflow:hidden;
  border:1px solid rgba(57,82,111,.12);
  border-radius:11px;
  background:#fff;
}
.feedbackDiagnosticsPreview h4{
  margin:0;
  padding:9px 11px;
  background:#edf5ff;
  color:#075fcb;
  font-size:12px;
}
.feedbackDiagnosticsPreview dl{margin:0}
.feedbackDiagnosticsPreview dl > div{
  display:grid;
  grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr);
  gap:12px;
  padding:8px 11px;
  border-top:1px solid rgba(57,82,111,.09);
}
.feedbackDiagnosticsPreview dt{
  color:#657286;
  font-weight:750;
}
.feedbackDiagnosticsPreview dd{
  min-width:0;
  margin:0;
  color:#172033;
  overflow-wrap:anywhere;
}

/* The sent state becomes a complete TILES-blue screen rather than a small card. */
.boardFeedbackSuccess[hidden]{display:none !important}
.boardFeedbackSuccess{
  position:absolute;
  inset:0;
  z-index:12;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:100%;
  margin:0;
  padding:max(32px,env(safe-area-inset-top)) 24px max(32px,env(safe-area-inset-bottom));
  background:linear-gradient(145deg,#0a83fb 0%,#0669e9 56%,#0758c8 100%);
  color:#fff;
  text-align:center;
  transform:translateY(100%);
  transition:transform 560ms cubic-bezier(.22,.78,.22,1);
  will-change:transform;
}
.boardSettingsRoot.is-feedback-success .boardFeedbackSuccess{transform:translateY(0)}
.boardFeedbackSuccess > span{
  width:76px;
  height:76px;
  margin:0 auto 22px;
  border:2px solid rgba(255,255,255,.64);
  background:rgba(255,255,255,.16);
  color:#fff;
  box-shadow:0 16px 40px rgba(0,45,122,.25);
}
.boardFeedbackSuccess h3{
  margin:0 0 14px;
  color:#fff;
  font-size:clamp(28px,6vw,42px);
}
.boardFeedbackSuccess p{
  max-width:520px;
  margin:0 0 7px;
  color:rgba(255,255,255,.92);
  font-size:clamp(16px,3.8vw,20px);
}
.boardFeedbackSuccess p + p{
  margin-bottom:28px;
  color:rgba(255,255,255,.76);
  font-size:14px;
}
.boardFeedbackSuccess .primaryBtn{
  min-width:180px;
  border:1px solid rgba(255,255,255,.5);
  background:#fff;
  color:#075fcb;
  box-shadow:0 14px 34px rgba(0,45,122,.24);
}

@media (prefers-reduced-motion:reduce){
  .boardFeedbackSuccess{transition-duration:1ms!important}
}

@media (max-width:760px){
  .boardSettingsRoot.is-feedback-success .boardSettingsPanel{
    position:fixed;
    inset:0;
    width:100vw;
    height:100dvh;
    max-width:none;
    max-height:none;
    border:0;
    border-radius:0;
  }
}