/* Shared board geometry: used by both studio and device. Customer colours stay local. */
.flow-board.board{container-type:inline-size;box-sizing:border-box;background:#f1f5f5;color:#24363f;padding:3%;font-family:Inter,system-ui,sans-serif;display:flex;flex-direction:column;gap:0;overflow:hidden}
.flow-board .board-head{display:flex;align-items:center;gap:2.5%;margin:0 0 3%;min-height:0}.flow-board .brand{flex:0 1 20%;max-width:25%;font-size:clamp(18px,2.5cqw,42px);color:var(--dark);overflow-wrap:anywhere}.flow-board .brand img{display:block;width:100%;max-width:180px;max-height:65px;object-fit:contain;object-position:left}.flow-board .board-greeting{flex:1;min-width:0}.flow-board .board-greeting>span{display:block;font-size:clamp(8px,.8cqw,14px);letter-spacing:.12em;color:#647785;margin-bottom:7px}.flow-board .board-greeting>strong{font-size:clamp(12px,1.5cqw,27px);letter-spacing:-.03em;line-height:1.25;color:#20353e;display:block}.flow-board .clock{font-size:clamp(8px,.85cqw,15px);color:#617785;flex-shrink:0;text-align:right}.flow-board .clock>strong{display:block;font-size:clamp(20px,2.5cqw,45px);font-weight:600;letter-spacing:-.04em;line-height:1.2;color:#213b34}
.flow-board .board-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:16px;flex:1;min-height:0}.flow-board .tile{position:relative;display:flex;flex-direction:column;text-align:left;min-width:0;min-height:0;padding:6%;border-radius:17px;background:#fff;color:#23343e;border:1px solid #ffffffc0;box-shadow:0 8px 23px #243a4010;overflow:hidden;transition:box-shadow .16s,transform .16s;font-family:inherit}.flow-board .tile:nth-child(4n+1){background:var(--dark);color:var(--on-dark)}.flow-board .tile:nth-child(4n+2){background:color-mix(in srgb,var(--accent) 11%,white);color:#23343e}.flow-board .tile.weather{background:var(--accent);color:var(--on-accent)}.flow-board .tile:hover{transform:translateY(-2px);box-shadow:0 12px 26px #243a4020}.flow-board .tile-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 13%;font-size:clamp(9px,.85cqw,15px);font-weight:550;line-height:1.5}.flow-board .tile-icon{font-size:clamp(17px,1.5cqw,27px)}.flow-board .tile h3{font-size:clamp(17px,1.85cqw,34px);line-height:1.2;letter-spacing:-.04em;font-weight:650;margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:inherit}.flow-board .tile p{font-size:clamp(11px,1cqw,18px);line-height:1.65;margin:0 0 13px;color:inherit;opacity:.85;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.flow-board .tile>.tile-open{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #70808022;margin-top:auto;padding-top:12px;font-size:clamp(9px,.8cqw,14px);color:inherit;line-height:1.5}.flow-board .tile-open b{font-size:22px;font-weight:400}.flow-board .tile-image{width:100%;max-height:90px;object-fit:contain;margin-bottom:12px}.flow-board .board-foot{display:flex;justify-content:space-between;gap:15px;padding-top:2%;font-size:clamp(8px,.7cqw,13px);color:#6b7f89}.flow-board .weather-main{display:flex;justify-content:space-between;align-items:center;margin:5px 0 14px}.flow-board .weather-main strong{font-size:clamp(24px,3cqw,54px);line-height:1.1;letter-spacing:-.05em}.flow-board .weather-main>span{font-size:28px}.flow-board .weather-metrics{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:12px}.flow-board .weather-metrics>span{background:#ffffff90;border-radius:9px;padding:8px 12px;font-size:clamp(9px,.75cqw,13px);line-height:1.4;color:#23343e}.flow-board .weather-metrics b{display:block;font-size:clamp(12px,1cqw,18px)}.flow-board .weather>span.tile-open:not(:last-child){font-size:clamp(8px,.65cqw,12px);border:0;padding:0;margin:0 0 12px;opacity:.8}.flow-board[data-count="7"] .tile-top,.flow-board[data-count="8"] .tile-top{margin-bottom:8%}.flow-board[data-count="7"] .tile p,.flow-board[data-count="8"] .tile p{-webkit-line-clamp:2}
#stage>.flow-board{height:100%;width:100%;padding:3vh 3vw 38px}.portrait .flow-board .board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@container(max-width:650px){.flow-board .board-grid{gap:9px}.flow-board .tile{border-radius:11px}.flow-board .tile h3{font-size:15px}.flow-board .tile p{font-size:10px;-webkit-line-clamp:2}.flow-board .tile-top{font-size:8px}.flow-board .board-greeting>span{font-size:7px}.flow-board .tile>.tile-open{padding-top:6px;font-size:8px}.flow-board .weather-main strong{font-size:26px}}
@media(max-width:700px){#stage .flow-board .board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-board .tile-top{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){.flow-board .tile{transition:none}.flow-board .tile:hover{transform:none}}
/* Grid percentage padding is based on the whole grid; use board-relative units. */
.flow-board .tile{padding:clamp(13px,1.6cqw,30px)}.flow-board .tile-top,.flow-board[data-count="7"] .tile-top,.flow-board[data-count="8"] .tile-top{margin-bottom:12px;flex-shrink:0}.flow-board .tile h3{flex-shrink:0}.flow-board[data-count="7"] .tile h3,.flow-board[data-count="8"] .tile h3{font-size:clamp(16px,1.55cqw,29px);-webkit-line-clamp:2}.flow-board[data-count="7"] .tile p,.flow-board[data-count="8"] .tile p{display:none}.flow-board[data-count="7"] .weather>h3,.flow-board[data-count="8"] .weather>h3{display:none}.flow-board[data-count="7"] .weather .weather-main,.flow-board[data-count="8"] .weather .weather-main{margin:0 0 8px}.flow-board[data-count="7"] .weather .weather-main strong,.flow-board[data-count="8"] .weather .weather-main strong{font-size:clamp(22px,2.4cqw,42px)}.flow-board[data-count="7"] .weather .weather-metrics,.flow-board[data-count="8"] .weather .weather-metrics{margin:0 0 5px}.flow-board[data-count="7"] .weather .weather-metrics>span,.flow-board[data-count="8"] .weather .weather-metrics>span{padding:4px 8px}.flow-board[data-count="7"] .weather>.tile-open,.flow-board[data-count="8"] .weather>.tile-open{padding-top:5px;font-size:8px;margin-bottom:0}.flow-board[data-count="7"] .tile-image,.flow-board[data-count="8"] .tile-image{max-height:45px}.flow-board .tile:focus-visible{outline:3px solid var(--dark);outline-offset:3px}
.flow-board[data-count="7"] .tile,.flow-board[data-count="8"] .tile{padding:13px 18px}.flow-board[data-count="7"] .tile-top,.flow-board[data-count="8"] .tile-top{margin-bottom:8px}.flow-board[data-count="7"] .weather>span.tile-open:not(:last-child),.flow-board[data-count="8"] .weather>span.tile-open:not(:last-child){display:none}.flow-board[data-count="7"] .weather .weather-main strong,.flow-board[data-count="8"] .weather .weather-main strong{font-size:28px}.flow-board .weather .weather-main strong{color:inherit}
/* Presentation is a viewport surface, not a scrolling management page. */
.full-display .topbar,.full-display .workspace-footer{display:none!important}.full-display #main{height:100dvh;padding:0!important;overflow:hidden}.full-display .flow-board.board{width:100%;height:calc(100dvh - 64px)!important;min-height:0!important;max-height:calc(100dvh - 64px);padding:2.5vh 3vw!important}.full-display .flow-board .board-grid{min-height:0!important;grid-template-rows:repeat(2,minmax(0,1fr))}.full-display .flow-board[data-count="7"] .board-grid,.full-display .flow-board[data-count="8"] .board-grid{grid-template-rows:repeat(3,minmax(0,1fr))}.full-display .display-toolbar{height:64px;min-height:64px}.full-display .flow-board .board-head{margin-bottom:2.5vh!important}.full-display .flow-board .tile{min-height:0!important}.full-display .flow-board .board-foot{padding-bottom:0}