html,body,#root{min-height:100%;margin:0}body{background:var(--ds-page)}.bd-studio{flex-direction:column;gap:12px;display:flex}.bd-intro+.file-group{margin-top:-26px}.bd-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.bd-bar-label{color:#1d484e;margin-right:4px;font-weight:600}.bd-edit{border:1px solid var(--ds-hairline);background:#f4f8f7;border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;display:flex}.bd-edit-name{color:#1d484e;margin-right:4px;font-weight:600}.bd-eraser-value{text-align:center;font-variant-numeric:tabular-nums;min-width:4ch}.bd-colors{border:1px solid var(--ds-hairline);background:#fff;border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;display:flex}.bd-colors-label{color:#1d484e;margin-right:4px;font-weight:600}.bd-palette{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.bd-swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;flex:none;width:28px;height:28px;padding:0}.bd-swatch.is-on{border-color:var(--ds-ink);box-shadow:inset 0 0 0 2px #fff}@media (width<=600px){.bd-swatch{width:32px;height:32px}}.bd-board{aspect-ratio:720/560;border:1px solid var(--ds-hairline);-webkit-user-select:none;user-select:none;background:#f4f8f7;border-radius:12px;width:100%;max-width:680px;margin:0 auto;overflow:hidden}.bd-board svg{touch-action:none;cursor:pointer;width:100%;height:100%;display:block}.bd-board.is-drawing svg{cursor:crosshair}.bd-board.is-erasing svg{cursor:none}.bd-intro{color:var(--ds-ink);margin:0 0 4px;padding-left:20px;font-size:14px;line-height:1.55}.bd-intro li{margin:0 0 6px}@media (width>=720px){.bd-intro{columns:2;column-gap:48px}}.bd-total{text-align:center;color:#1d484e;font-variant-numeric:tabular-nums;margin:0;font-size:18px;font-weight:700}.bd-total-detail{color:var(--ds-ink-2);font-size:13px;font-weight:500;display:block}.bd-context{flex-direction:column;justify-content:center;min-height:58px;display:flex}.bd-context .bd-edit{box-sizing:border-box;min-height:58px}.bd-hint{color:var(--ds-ink-2);margin:0;padding:0 4px;font-size:14px}@media (width<=600px){.bd-context,.bd-context .bd-edit{min-height:92px}}.bd-open{background:#fffcf0;border:1px solid #d9a400;border-radius:12px;padding:14px}.bd-open h3{color:#1d484e;margin:0 0 8px;font-size:16px}.bd-open p{margin:0 0 12px;font-size:14px;line-height:1.5}.bd-open svg{width:100%;display:block}.bd-intro li{break-inside:avoid}
