/* Compact controls: scoped to the board, including its native popout. */
html.buddy-room-active #whiteboardModal[data-buddy-board-root=true] .board-toolbar.board-toolbar-compact,html.buddy-board-popout #whiteboardModal[data-buddy-board-root=true] .board-toolbar.board-toolbar-compact{gap:5px!important;flex-wrap:wrap!important;overflow:visible!important;max-height:none!important;height:auto!important;min-height:46px!important;align-content:center!important;padding:8px 10px!important}
html body #whiteboardModal .board-toolbar-compact .board-icon-control{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;max-width:34px!important;padding:0!important;box-sizing:border-box!important;border-radius:7px!important;flex:0 0 34px!important}
html body #whiteboardModal .board-toolbar-compact .board-icon-control svg{width:18px!important;height:18px!important;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
html body #whiteboardModal .board-toolbar-compact .board-icon-control:disabled{opacity:.28!important;cursor:default!important}
html body #whiteboardModal .board-toolbar-compact .board-icon-control:focus-visible{outline:2px solid var(--accent,#e1b86b)!important;outline-offset:2px!important}
html body #whiteboardModal .board-toolbar-compact .board-history-controls,html body #whiteboardModal .board-toolbar-compact .board-image-tool-group{display:inline-flex!important;align-items:center!important;gap:4px!important;order:0!important}
html body #whiteboardModal .board-toolbar-compact .board-pencil-controls{flex:0 0 130px!important;min-width:130px!important;max-width:130px!important;width:130px!important;height:34px!important;min-height:34px!important;padding:0 5px!important;gap:5px!important;order:0!important;border:0!important;background:transparent!important}
html body #whiteboardModal .board-toolbar-compact .board-pencil-controls>label:first-child{display:flex!important;flex:0 0 60px!important;min-width:60px!important;width:60px!important;padding:0!important}
html body #whiteboardModal .board-toolbar-compact .board-pencil-controls input[type=range]{width:60px!important;min-width:60px!important;height:24px!important;padding:0!important;margin:0!important}
html body #whiteboardModal .board-toolbar-compact .board-pencil-controls output{width:22px!important;min-width:22px!important;height:24px!important;border:0!important;background:transparent!important;font-size:10px!important}
html body #whiteboardModal .board-toolbar-compact .board-chalk-toggle{width:30px!important;min-width:30px!important;height:30px!important;padding:0!important;flex:0 0 30px!important}
html body #whiteboardModal .board-toolbar-compact .board-chalk-toggle svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
html body #whiteboardModal .board-toolbar-compact [hidden]{display:none!important}
html body #whiteboardModal .board-toolbar-compact .board-divider{height:23px!important;min-height:23px!important;margin:0 2px!important}
html body #whiteboardModal .board-toolbar-compact #boardPageLabel{font-size:10px!important;white-space:nowrap!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon{display:block!important;position:relative!important;width:34px!important;height:34px!important;min-width:34px!important;margin:0!important;flex:0 0 34px!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon>span{display:none!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon .room-select-box{width:34px!important;height:34px!important;min-width:34px!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon .room-select-toggle{position:relative!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;border-radius:7px!important;font-size:0!important;line-height:0!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon .room-select-toggle::after{display:none!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon .room-select-toggle::before{content:'';position:absolute;left:8px;top:8px;width:18px;height:18px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239baebb' stroke-width='1.6' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 15h18M9 3v18'/%3E%3C/svg%3E") center no-repeat}
html body #whiteboardModal .board-toolbar-compact .board-background-icon .room-select-list{width:180px!important;left:auto!important;right:0!important;z-index:80!important}
html body #whiteboardModal .board-toolbar-compact .board-background-icon option{color:var(--text,#e8eef8)!important;background:var(--panel,#15191b)!important}
html body #whiteboardModal .board-toolbar-compact .board-text-format-toolbar{gap:4px!important}
@media(pointer:coarse){html body #whiteboardModal .board-toolbar-compact .board-icon-control{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;flex-basis:40px!important}}
@media(max-width:600px){
 html body #whiteboardModal[data-buddy-board-root=true] .board-toolbar.board-toolbar-compact{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;max-height:none!important;gap:4px!important;padding:6px!important}
 html body #whiteboardModal .board-toolbar-compact .board-divider{display:none!important}
 html body #whiteboardModal .board-toolbar-compact #boardPageLabel{font-size:9px!important}
}

html.buddy-room-active #whiteboardModal .board-stage[data-board-orientation=portrait],html.buddy-board-popout #whiteboardModal .board-stage[data-board-orientation=portrait]{width:min(100cqw,56.25cqh)!important;aspect-ratio:9/16!important}
/* A staged phone board shares the viewport with video. Keep its toolbar in
   one swipeable row rather than consuming the remaining canvas height. */
@media(max-width:600px),(max-height:500px){
 html.buddy-room-active #whiteboardModal[data-buddy-board-root=true][data-buddy-board-surface=stage] .board-toolbar.board-toolbar-compact{flex-wrap:nowrap!important;height:50px!important;min-height:50px!important;max-height:50px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:4px 6px!important;scrollbar-width:thin}
 html.buddy-room-active #whiteboardModal[data-buddy-board-surface=stage] #boardOrientationBtn{order:-1!important}
}
.board-stage[data-board-formatted=true] .board-text-layer .board-text-box{min-height:0!important}