#board{padding:0!important;height:calc(100vh - 74px);overflow:hidden}.spmc-board-shell{height:100%;display:grid;grid-template-columns:230px 1fr;background:var(--bg)}.spmc-board-sidebar{border-right:1px solid var(--border);background:var(--card);padding:14px;display:flex;flex-direction:column;min-width:0}.spmc-board-sidebar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.spmc-board-list{display:flex;flex-direction:column;gap:7px;overflow:auto}.spmc-board-list-item{border:1px solid transparent;background:transparent;border-radius:12px;padding:10px;text-align:left;display:grid;grid-template-columns:25px 1fr;gap:2px 7px;color:var(--text);cursor:pointer}.spmc-board-list-item small{grid-column:2;color:var(--muted)}.spmc-board-list-item:hover,.spmc-board-list-item.active{background:var(--soft);border-color:var(--border)}.spmc-board-main{display:flex;flex-direction:column;min-width:0}.spmc-board-topbar{min-height:62px;border-bottom:1px solid var(--border);background:var(--card);display:flex;align-items:center;gap:8px;padding:8px 12px;position:relative;z-index:5}.spmc-board-title{border:none;background:transparent;font-weight:800;font-size:17px;max-width:230px;color:var(--text);padding:8px}.spmc-board-tools{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-left:auto}.spmc-board-tool{border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;padding:8px 10px;cursor:pointer}.spmc-board-tool:hover,.spmc-board-tool.active{background:var(--primary);color:#fff;border-color:var(--primary)}.spmc-board-divider{width:1px;height:28px;background:var(--border);margin:0 3px}.spmc-board-canvas{position:relative;flex:1;overflow:hidden;cursor:grab;background-color:#f8fafc;background-image:linear-gradient(#dbe3ee 1px,transparent 1px),linear-gradient(90deg,#dbe3ee 1px,transparent 1px);background-size:24px 24px;touch-action:none}.dark .spmc-board-canvas{background-color:#111827;background-image:linear-gradient(#273449 1px,transparent 1px),linear-gradient(90deg,#273449 1px,transparent 1px)}.spmc-board-canvas.is-panning{cursor:grabbing}.spmc-board-canvas[data-tool=sticky],.spmc-board-canvas[data-tool=text],.spmc-board-canvas[data-tool=shape]{cursor:crosshair}.spmc-board-stage{position:absolute;left:0;top:0;width:6000px;height:4000px;transform-origin:0 0}.spmc-board-links{position:absolute;inset:0;overflow:visible;pointer-events:none}.spmc-board-links path{fill:none;stroke:#64748b;stroke-width:3}.spmc-board-links marker path{fill:#64748b}.spmc-board-item{position:absolute;background:var(--item-color);border:1px solid rgba(15,23,42,.14);border-radius:16px;padding:32px 18px 18px;box-shadow:0 9px 24px rgba(15,23,42,.12);color:#182033;cursor:move;user-select:none;overflow:hidden;transition:box-shadow .15s,transform .15s}.spmc-board-item:hover{box-shadow:0 15px 34px rgba(15,23,42,.2)}.spmc-board-item.selected{outline:3px solid #6366f1;outline-offset:3px}.board-item-grip{position:absolute;top:6px;left:10px;color:#64748b;font-size:18px}.board-item-actions{position:absolute;top:6px;right:7px;display:flex;gap:3px;opacity:0;transition:.15s}.spmc-board-item:hover .board-item-actions,.spmc-board-item.selected .board-item-actions{opacity:1}.board-item-actions button{border:0;background:rgba(255,255,255,.72);border-radius:7px;width:24px;height:24px;cursor:pointer}.board-rich-text{white-space:normal;line-height:1.45;font-size:16px}.type-text{background:rgba(255,255,255,.92);border-style:dashed;box-shadow:none;font-size:22px;font-weight:700}.type-shape{border-radius:22px;border:3px solid rgba(79,70,229,.38);display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800}.type-checklist{background:#fff}.board-item-title{font-size:17px;font-weight:800;margin-bottom:12px}.board-checks{display:flex;flex-direction:column;gap:9px}.board-checks label{display:flex;gap:8px;align-items:flex-start}.board-checks input:checked+span{text-decoration:line-through;color:#64748b}.type-image{padding:30px 8px 10px;background:#fff}.type-image img{width:100%;height:150px;object-fit:cover;border-radius:11px}.board-image-caption{padding:8px;font-size:13px}.type-link{background:#fff;display:flex;flex-direction:column;gap:6px}.type-link small{word-break:break-all;color:#64748b}.board-link-icon{font-size:28px}.spmc-board-bottom{position:absolute;right:18px;bottom:16px;z-index:4;display:flex;align-items:center;gap:5px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:5px;box-shadow:0 8px 25px rgba(15,23,42,.15)}.spmc-board-bottom button{border:0;background:transparent;color:var(--text);padding:7px 10px;cursor:pointer}.spmc-board-bottom span{min-width:50px;text-align:center;font-weight:700}.spmc-board-status{position:absolute;left:18px;bottom:18px;z-index:4;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:8px 12px;color:var(--muted);font-size:12px}.spmc-board-template-wrap{position:relative}.spmc-board-template-menu{display:none;position:absolute;right:0;top:44px;width:260px;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 45px rgba(15,23,42,.2);padding:8px;z-index:20}.spmc-board-template-menu.show{display:grid;grid-template-columns:1fr 1fr;gap:6px}.spmc-board-template-menu button{border:1px solid var(--border);background:var(--soft);color:var(--text);border-radius:10px;padding:12px 8px;cursor:pointer;text-align:left}.spmc-board-more{position:relative}.spmc-board-hint{margin-top:auto;padding-top:12px;color:var(--muted);font-size:12px;line-height:1.5}@media(max-width:900px){#board{height:calc(100vh - 62px)}.spmc-board-shell{grid-template-columns:1fr}.spmc-board-sidebar{display:none}.spmc-board-topbar{overflow-x:auto;min-height:70px}.spmc-board-title{min-width:150px}.spmc-board-tools{min-width:max-content}.spmc-board-tool{padding:8px}.spmc-board-tool .tool-label{display:none}.spmc-board-status{display:none}}@media(max-width:600px){.spmc-board-topbar{padding:6px}.spmc-board-title{max-width:130px;font-size:14px}.spmc-board-divider{display:none}.spmc-board-item{min-width:170px}.spmc-board-bottom{right:8px;bottom:8px}}


/* v0.11.41 — surgical collapsible board rail and productivity controls */
.spmc-board-shell{position:relative;transition:grid-template-columns .22s ease}
.spmc-board-sidebar{transition:opacity .16s ease,transform .22s ease,padding .22s ease}
.spmc-board-sidebar-actions{display:flex;gap:6px;align-items:center}
.spmc-board-sidebar-handle{display:none;position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:12;width:26px;height:72px;border:1px solid var(--border);border-left:0;border-radius:0 14px 14px 0;background:var(--card);color:var(--text);font-size:24px;cursor:pointer;box-shadow:4px 7px 18px rgba(15,23,42,.14)}
.spmc-board-shell.sidebar-collapsed{grid-template-columns:0 minmax(0,1fr)}
.spmc-board-shell.sidebar-collapsed .spmc-board-sidebar{opacity:0;transform:translateX(-100%);padding-left:0;padding-right:0;pointer-events:none;overflow:hidden}
.spmc-board-shell.sidebar-collapsed .spmc-board-sidebar-handle{display:block}
.spmc-board-canvas.grid-hidden{background-image:none!important}
.spmc-board-tool.is-on{background:var(--primary);color:#fff;border-color:var(--primary)}
@media(max-width:900px){.spmc-board-shell.sidebar-mobile-open{grid-template-columns:min(82vw,280px) minmax(0,1fr)}.spmc-board-shell.sidebar-mobile-open .spmc-board-sidebar{display:flex;position:absolute;inset:0 auto 0 0;width:min(82vw,280px);z-index:15;box-shadow:10px 0 32px rgba(15,23,42,.22)}.spmc-board-sidebar-handle{display:block}.spmc-board-shell.sidebar-mobile-open .spmc-board-sidebar-handle{display:none}}

/* v0.11.42 — expanded template library */
.spmc-board-template-menu{max-height:min(70vh,520px);overflow:auto;min-width:230px}.spmc-board-template-menu button{white-space:nowrap}

/* v0.11.82 — My Boards functional objects phase 1 */
.spmc-board-palette-wrap{position:relative}
.spmc-board-palette{display:none;position:absolute;top:44px;left:0;z-index:30;width:250px;padding:8px;border:1px solid var(--border);border-radius:14px;background:var(--card);box-shadow:0 18px 45px rgba(15,23,42,.2);grid-template-columns:1fr 1fr;gap:7px}
.spmc-board-palette.show{display:grid}
.spmc-board-palette button{border:1px solid var(--border);border-radius:10px;background:var(--soft);color:var(--text);padding:10px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.spmc-board-palette button:hover{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--card))}
.spmc-board-palette button span{font-size:24px;line-height:1}
.spmc-board-palette button small{color:var(--muted)}
.shape-palette{width:300px;grid-template-columns:repeat(3,1fr)}
.shape-palette button{align-items:center;text-align:center;font-size:12px}
.board-resize-handle{display:none;position:absolute!important;right:3px!important;bottom:3px!important;top:auto!important;width:18px!important;height:18px!important;border:0!important;border-right:3px solid #6366f1!important;border-bottom:3px solid #6366f1!important;border-radius:0!important;background:transparent!important;cursor:nwse-resize!important;opacity:1!important;padding:0!important}
.spmc-board-item.selected .board-resize-handle{display:block}
.board-image-frame{width:100%;height:calc(100% - 34px);min-height:80px;overflow:hidden;border-radius:11px;background:#e5e7eb;display:flex;align-items:center;justify-content:center}
.type-image img{width:100%;height:100%;object-fit:contain;border-radius:0;pointer-events:none}
.board-image-caption{height:34px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.type-link{padding-bottom:16px}
.board-open-link{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 10px;border-radius:9px;background:#4f46e5;color:white!important;text-decoration:none;font-size:13px;font-weight:700}
.board-open-link:hover{filter:brightness(1.08)}
.board-link-invalid{font-size:12px;color:#b91c1c}
.type-shape{padding:0;background:transparent;border:0;box-shadow:none;overflow:visible}
.type-shape .board-item-grip,.type-shape .board-item-actions{z-index:4}
.board-shape-visual{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;padding:28px;color:#182033;background:var(--item-color);border:3px solid rgba(79,70,229,.42)}
.board-shape-visual.shape-rectangle{border-radius:2px}
.board-shape-visual.shape-rounded{border-radius:24px}
.board-shape-visual.shape-ellipse{border-radius:50%}
.board-shape-visual.shape-diamond{inset:12%;transform:rotate(45deg);border-radius:5px}
.board-shape-visual.shape-diamond span{transform:rotate(-45deg)}
.board-shape-visual.shape-triangle{border:0;background:transparent;clip-path:polygon(50% 0,100% 100%,0 100%);background:var(--item-color);padding-top:45%}
.board-shape-visual.shape-callout{border-radius:20px}
.board-shape-visual.shape-callout:after{content:"";position:absolute;left:22%;bottom:-20px;border:12px solid transparent;border-top-color:var(--item-color);transform:skewX(-18deg)}
.board-shape-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.board-shape-svg line{stroke:var(--item-color);stroke-width:8;stroke-linecap:round}
.board-shape-svg marker path{fill:var(--item-color)}
.type-text{padding:25px 14px 12px;display:flex;align-items:center}
.board-rich-text.text-title{font-size:30px;font-weight:850;line-height:1.15}
.board-rich-text.text-subtitle{font-size:22px;font-weight:750;line-height:1.2}
.board-rich-text.text-body{font-size:16px;font-weight:500;line-height:1.45}
.board-rich-text.text-label{font-size:13px;font-weight:750;letter-spacing:.04em;text-transform:uppercase}
@media(max-width:900px){.spmc-board-palette{position:fixed;left:12px;right:12px;top:auto;bottom:12px;width:auto;max-height:62vh;overflow:auto;z-index:10050}.shape-palette{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.shape-palette{grid-template-columns:repeat(2,minmax(0,1fr))}.text-palette{grid-template-columns:1fr 1fr}}

/* v0.11.83 — My Boards voice notes, drawing and advanced shapes */
.spmc-board-canvas[data-tool=draw]{cursor:crosshair}.spmc-board-canvas[data-tool=erase]{cursor:not-allowed}
.spmc-board-item.is-locked{cursor:default}.spmc-board-item.is-locked .board-item-grip{opacity:.75}
.type-audio{padding:30px 12px 12px;background:#fff}.board-audio-card{height:100%;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:6px 10px;align-items:center}.board-audio-icon{font-size:30px}.board-audio-copy{min-width:0;display:flex;flex-direction:column}.board-audio-copy b,.board-audio-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-audio-copy small{color:#64748b}.board-audio-card audio{grid-column:1/-1;width:100%;height:38px}
.type-drawing{padding:0;background:transparent;border:0;box-shadow:none;overflow:visible}.board-drawing-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.board-drawing-svg polyline,.board-drawing-preview polyline{fill:none;stroke-linecap:round;stroke-linejoin:round}.board-drawing-preview{position:absolute;inset:0;width:6000px;height:4000px;pointer-events:none;overflow:visible}.board-drawing-preview polyline{stroke:#4f46e5;stroke-width:5}
.audio-palette{width:320px;grid-template-columns:1fr 1fr}.audio-palette button{min-height:92px;align-items:center;text-align:center}.audio-palette button span{font-size:28px}
.spmc-board-recorder{display:none;position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:12000;width:min(520px,calc(100vw - 24px));padding:14px;border:1px solid var(--border);border-radius:16px;background:var(--card);color:var(--text);box-shadow:0 20px 60px rgba(15,23,42,.3)}.spmc-board-recorder.show{display:flex;align-items:center;justify-content:space-between;gap:12px}.spmc-board-recorder>div{display:flex;align-items:center;gap:9px}.spmc-board-recorder button{border:1px solid var(--border);border-radius:10px;background:var(--soft);color:var(--text);padding:9px 12px;cursor:pointer}.spmc-board-recorder button:nth-child(2){background:#dc2626;color:#fff;border-color:#dc2626}.rec-dot{width:12px;height:12px;border-radius:50%;background:#dc2626;box-shadow:0 0 0 0 rgba(220,38,38,.5);animation:boardPulse 1.2s infinite}@keyframes boardPulse{70%{box-shadow:0 0 0 9px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
.board-shape-visual.shape-pentagon{clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%)}.board-shape-visual.shape-hexagon{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.board-shape-visual.shape-octagon{clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}.board-shape-visual.shape-star{clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 100%,50% 73%,21% 100%,32% 57%,2% 35%,39% 35%)}.board-shape-visual.shape-cross{clip-path:polygon(35% 0,65% 0,65% 35%,100% 35%,100% 65%,65% 65%,65% 100%,35% 100%,35% 65%,0 65%,0 35%,35% 35%)}.board-shape-visual.shape-parallelogram{clip-path:polygon(18% 0,100% 0,82% 100%,0 100%)}.board-shape-visual.shape-trapezoid{clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}.board-shape-visual.shape-heart{clip-path:polygon(50% 95%,8% 53%,2% 28%,12% 8%,33% 4%,50% 22%,67% 4%,88% 8%,98% 28%,92% 53%)}.board-shape-visual.shape-chevron{clip-path:polygon(0 0,70% 0,100% 50%,70% 100%,0 100%,30% 50%)}.board-shape-visual.shape-pin{clip-path:polygon(50% 100%,37% 68%,18% 53%,10% 30%,18% 10%,35% 0,65% 0,82% 10%,90% 30%,82% 53%,63% 68%);border-radius:50% 50% 45% 45%}.board-shape-visual.shape-cloud{border-radius:45%;box-shadow:-38px 8px 0 -8px var(--item-color),38px 10px 0 -7px var(--item-color),0 -24px 0 -8px var(--item-color)}
.board-shape-visual.shape-cylinder,.board-shape-visual.shape-flow-database{border-radius:50% / 13%}.board-shape-visual.shape-cylinder:before,.board-shape-visual.shape-flow-database:before{content:"";position:absolute;left:-3px;right:-3px;top:-3px;height:24%;border:3px solid rgba(79,70,229,.42);border-radius:50%;background:color-mix(in srgb,var(--item-color) 88%,white)}.board-shape-visual.shape-flow-terminal{border-radius:999px}.board-shape-visual.shape-flow-process{border-radius:2px}.board-shape-visual.shape-flow-decision{inset:12%;transform:rotate(45deg)}.board-shape-visual.shape-flow-decision span{transform:rotate(-45deg)}.board-shape-visual.shape-flow-document{border-radius:3px 3px 35% 35% / 3px 3px 18% 18%}
.board-shape-svg path{fill:none;stroke:var(--item-color);stroke-width:8;stroke-linecap:round}
@media(max-width:900px){.shape-palette{grid-template-columns:repeat(3,minmax(105px,1fr));width:auto;max-width:calc(100vw - 24px)}.audio-palette{grid-template-columns:1fr 1fr}.spmc-board-recorder.show{flex-direction:column;align-items:stretch}.spmc-board-recorder>div{justify-content:center;flex-wrap:wrap}}
@media(max-width:520px){.shape-palette{grid-template-columns:repeat(2,minmax(0,1fr))}.audio-palette{grid-template-columns:1fr}}
.draw-palette{width:300px;grid-template-columns:1fr 1fr}.draw-palette button{align-items:center;text-align:center}.pen-swatch{display:block!important;width:42px;height:8px;border-radius:999px}.pen-indigo{background:#4f46e5}.pen-black{background:#111827}.pen-yellow{background:#f59e0b;height:14px;opacity:.55}


/* v0.12.7 — recorder mobile visibility and stable timer */
.spmc-board-recorder strong{min-width:44px;text-align:center;font-variant-numeric:tabular-nums}
@media(max-width:700px){
 .spmc-board-recorder{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));transform:none;width:auto;max-width:none}
 .spmc-board-recorder.show{display:flex!important}
 .spmc-board-recorder>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
 .spmc-board-recorder button{width:100%;padding:11px 6px}
}


/* v0.12.8 — microphone permission state and reliable recorder clock */
.spmc-board-recorder button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:520px){
 .spmc-board-recorder{padding:12px 10px!important}
 .spmc-board-recorder>div:first-child{display:grid!important;grid-template-columns:auto 1fr auto;width:100%;justify-content:stretch!important}
 .spmc-board-recorder>div:first-child b{min-width:0;white-space:normal}
}


/* v0.12.10 — Board palettes always visible above the canvas in portrait mobile/tablet */
.spmc-board-palette.spmc-board-palette-portal{
 position:fixed!important;
 left:50%!important;
 right:auto!important;
 top:auto!important;
 bottom:max(16px,env(safe-area-inset-bottom))!important;
 transform:translateX(-50%)!important;
 width:min(560px,calc(100vw - 24px))!important;
 max-width:calc(100vw - 24px)!important;
 max-height:min(68dvh,620px)!important;
 overflow:auto!important;
 overscroll-behavior:contain;
 z-index:2147483001!important;
 box-shadow:0 24px 80px rgba(15,23,42,.42)!important;
 isolation:isolate;
}
body.spmc-board-palette-open:before{
 content:"";
 position:fixed;
 inset:0;
 z-index:2147483000;
 background:rgba(15,23,42,.34);
 backdrop-filter:blur(1px);
 -webkit-backdrop-filter:blur(1px);
}
@media (orientation:portrait) and (max-width:1199px){
 .spmc-board-topbar{overflow-x:auto!important;overflow-y:visible!important}
 .spmc-board-palette.spmc-board-palette-portal.show{display:grid!important}
 .spmc-board-palette.spmc-board-palette-portal.shape-palette{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .spmc-board-palette.spmc-board-palette-portal.audio-palette{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .spmc-board-palette.spmc-board-palette-portal.draw-palette,.spmc-board-palette.spmc-board-palette-portal.text-palette{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (orientation:portrait) and (max-width:560px){
 .spmc-board-palette.spmc-board-palette-portal{bottom:max(10px,env(safe-area-inset-bottom))!important;max-height:min(72dvh,620px)!important}
 .spmc-board-palette.spmc-board-palette-portal.shape-palette{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .spmc-board-palette.spmc-board-palette-portal.audio-palette{grid-template-columns:1fr!important}
}
