/* ================= v0.22.0 — DrawDeck (full-screen whiteboard, mind map, flowchart) ================= */
.widget.dd-widget .widget-body{ padding:0; overflow:hidden; display:flex; flex-direction:column; user-select:none; }
.dd-root{ position:relative; flex:1; min-height:0; display:flex; flex-direction:column; outline:none; color:var(--text-hi); font-size:13px; }
.dd-top, .dd-bottom{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; padding:7px 12px; background:rgba(255,255,255,.035); }
.dd-top{ border-bottom:1px solid var(--line); }
.dd-bottom{ border-top:1px solid var(--line); gap:6px 10px; }
.dd-grp{ display:flex; align-items:center; gap:4px; }
.dd-right{ margin-left:auto; }
.dd-main{ position:relative; flex:1; min-height:0; display:flex; }
.dd-rail{ width:54px; flex:none; display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 0; overflow-y:auto; border-right:1px solid var(--line); background:rgba(255,255,255,.025); }
.dd-stage{ position:relative; flex:1; min-width:0; overflow:hidden; background:#fff; }
.dd-canvas{ position:absolute; inset:0; width:100%; height:100%; touch-action:none; display:block; cursor:crosshair; }
.dd-btn{ appearance:none; border:1px solid transparent; background:transparent; color:var(--text-hi); min-width:34px; height:34px; padding:0 8px; border-radius:var(--radius-chip); display:inline-flex; align-items:center; justify-content:center; gap:4px; font:inherit; font-size:13px; cursor:pointer; }
.dd-btn:hover:not(:disabled){ background:rgba(255,255,255,.09); }
.dd-btn:focus-visible, .dd-tab:focus-visible, .dd-sw:focus-visible, .dd-size:focus-visible, .dd-kind:focus-visible, .dd-mi:focus-visible{ outline:2px solid var(--teal); outline-offset:1px; }
.dd-btn.on{ background:var(--amber); color:#1b1306; }
.dd-btn:disabled, .dd-btn.dis{ opacity:.35; cursor:default; }
.dd-btn.dis:hover{ background:transparent; }
.dd-wide{ max-width:210px; }
.dd-boardname{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:150px; font-weight:600; }
.dd-pageno{ min-width:44px; text-align:center; color:var(--text-lo); font-variant-numeric:tabular-nums; }
.dd-zoom{ min-width:56px; font-variant-numeric:tabular-nums; }
.dd-tabs{ display:flex; gap:3px; padding:3px; border-radius:12px; background:rgba(0,0,0,.28); }
.dd-tab{ appearance:none; border:0; background:transparent; color:var(--text-lo); font:inherit; font-weight:600; padding:6px 14px; border-radius:9px; cursor:pointer; }
.dd-tab.on{ background:var(--ink-3); color:var(--text-hi); box-shadow:0 1px 3px rgba(0,0,0,.3); }
.dd-sep{ width:26px; height:1px; background:var(--line); margin:3px 0; flex:none; }
.dd-bottom .dd-sep{ width:1px; height:24px; margin:0 2px; }
.dd-pal{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.dd-sw{ position:relative; width:26px; height:26px; padding:0; border-radius:50%; border:2px solid rgba(255,255,255,.55); cursor:pointer; box-shadow:0 0 0 1px rgba(0,0,0,.35); }
.dd-sw.on{ border-color:var(--amber); box-shadow:0 0 0 2px var(--amber-hi), 0 0 0 4px rgba(232,163,61,.28); }
.dd-custom{ background:conic-gradient(#e53935,#fdd835,#43a047,#1e88e5,#8e24aa,#e53935); display:inline-block; overflow:hidden; }
.dd-custom input{ position:absolute; inset:0; opacity:0; width:100%; height:100%; cursor:pointer; }
.dd-sizes{ display:flex; align-items:center; gap:4px; }
.dd-size{ appearance:none; width:34px; height:30px; border-radius:9px; border:1px solid transparent; background:transparent; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.dd-size i{ display:block; border-radius:50%; background:var(--text-hi); }
.dd-size:hover{ background:rgba(255,255,255,.09); }
.dd-size.on{ background:rgba(232,163,61,.22); border-color:var(--amber); }
.dd-kind{ appearance:none; border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--text-hi); font:inherit; font-size:12.5px; padding:5px 11px; border-radius:999px; cursor:pointer; }
.dd-kind:hover{ background:rgba(255,255,255,.11); }
.dd-kind.on{ background:var(--amber); border-color:var(--amber); color:#1b1306; font-weight:600; }
.dd-chk{ display:inline-flex; align-items:center; gap:5px; color:var(--text-lo); cursor:pointer; }
.dd-edit{ position:absolute; z-index:5; margin:0; padding:4px 6px; border:2px dashed var(--amber); border-radius:8px; background:transparent; font-family:Inter, system-ui, sans-serif; font-weight:500; resize:none; overflow:hidden; outline:none; user-select:text; box-sizing:border-box; }
.dd-edit[hidden], .dd-hint[hidden], .dd-pop[hidden], .dd-modal[hidden], .dd-unfocus[hidden]{ display:none; }
.dd-hint{ position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); max-width:min(520px,80%); text-align:center; color:#6b7686; font-size:15px; line-height:1.5; pointer-events:none; }
.dd-unfocus{ position:absolute; top:10px; right:10px; z-index:6; width:38px; height:38px; border-radius:50%; border:1px solid rgba(0,0,0,.2); background:rgba(255,255,255,.85); color:#1b1b1b; font-size:18px; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.dd-root.dd-focus .dd-top, .dd-root.dd-focus .dd-bottom{ display:none; }
.dd-pop{ position:absolute; z-index:20; min-width:200px; max-width:320px; background:var(--ink-2); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-panel); padding:6px; }
.dd-menu{ display:flex; flex-direction:column; }
.dd-menu hr{ width:100%; border:0; border-top:1px solid var(--line); margin:5px 0; }
.dd-mi{ appearance:none; border:0; background:transparent; color:var(--text-hi); font:inherit; text-align:left; padding:8px 10px; border-radius:8px; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dd-mi:hover{ background:rgba(255,255,255,.09); }
.dd-mi.danger{ color:var(--danger); }
.dd-modal{ position:absolute; inset:0; z-index:30; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; padding:20px; }
.dd-card{ width:min(560px,100%); max-height:100%; display:flex; flex-direction:column; gap:10px; background:var(--ink-1); border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow-panel); }
.dd-card h3{ margin:0; font-size:16px; }
.dd-card p{ margin:0; color:var(--text-lo); line-height:1.45; }
.dd-outline-ta{ width:100%; min-height:220px; resize:vertical; background:var(--ink-0); color:var(--text-hi); border:1px solid var(--line); border-radius:10px; padding:10px; font:13.5px/1.5 ui-monospace, Menlo, Consolas, monospace; user-select:text; }
.dd-card-btns{ display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
@media (max-width:760px){
  .dd-rail{ width:46px; } .dd-btn{ min-width:30px; height:30px; padding:0 5px; }
  .dd-top{ gap:4px 8px; padding:6px 8px; } .dd-boardname{ max-width:90px; }
}
/* keep the whole widget (including its bottom colour/size bar) clear of the dock */
.widget.widget-full.dd-widget{ bottom:108px; }
body:has(#dock-wrap.auto-hide) .widget.widget-full.dd-widget{ bottom:50px; }

/* Full screen: DrawDeck fills the screen edge to edge; the TeachersDeck title bar, top menu, docks and DrawDeck's own title strip are hidden */
body.dd-fs .topbar, body.dd-fs .dock-wrap, body.dd-fs #dock-wrap, body.dd-fs .edge-dock, body.dd-fs #dock-top, body.dd-fs #dock-left, body.dd-fs #dock-right{ display:none !important; }
body.dd-fs .widget.widget-full.dd-widget{ position:fixed !important; inset:0 !important; left:0 !important; right:0 !important; top:0 !important; bottom:0 !important; width:auto !important; height:auto !important; max-width:none !important; border-radius:0 !important; border:0 !important; z-index:2100 !important; }
body.dd-fs .dd-widget .widget-head{ display:none; }

/* v0.23.0 — picture menu, eraser options, and bigger targets for fingers and pens */
.dd-mh{ padding:6px 10px 4px; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-lo); }
.dd-none{ color:var(--text-lo); cursor:default; white-space:normal; }
.dd-canvas{ -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
@media (pointer:coarse){
  .dd-rail{ width:64px; gap:6px; }
  .dd-btn{ min-width:44px; height:44px; padding:0 10px; }
  .dd-wide{ max-width:240px; }
  .dd-tab{ padding:10px 16px; }
  .dd-sw{ width:36px; height:36px; }
  .dd-size{ width:46px; height:42px; }
  .dd-kind{ padding:10px 14px; font-size:14px; }
  .dd-mi{ padding:12px 14px; }
  .dd-top, .dd-bottom{ gap:8px 14px; }
}

/* v0.24.0 — properties form for math tools */
.dd-form{ display:flex; flex-direction:column; gap:10px; }
.dd-fld{ display:flex; flex-direction:column; gap:4px; color:var(--text-lo); font-size:12.5px; }
.dd-fld input[type=text], .dd-fld input[type=number], .dd-fld select{ background:var(--ink-0); color:var(--text-hi); border:1px solid var(--line); border-radius:9px; padding:9px 10px; font:inherit; font-size:14px; user-select:text; }
.dd-fld input:focus, .dd-fld select:focus{ outline:2px solid var(--teal); outline-offset:1px; }
.dd-chkrow{ flex-direction:row; align-items:center; gap:8px; color:var(--text-hi); }
