:root{--ruler-top:18px;--ruler-left:36px}html,body{background:#d5d8dd;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}.board{cursor:crosshair;touch-action:none;display:block}.board.wall-mode{cursor:cell}.board.shape-mode{cursor:crosshair}.board.select-mode{cursor:default}.board.select-mode.placing{cursor:move}.board.pan-mode{cursor:grab}.board.gesture-mode{cursor:pointer}.board.dragging{cursor:grabbing}.palette{top:calc(var(--ruler-top) + 8px);left:calc(var(--ruler-left) + 8px);background:#fffffff5;border:1px solid #c3c8cf;border-radius:8px;gap:6px;padding:0 6px 8px;display:grid;position:fixed;box-shadow:0 2px 8px #0000002e}.palette[hidden],.group-tab[hidden]{display:none}.palette-header{color:#6b717a;justify-content:space-between;align-items:center;padding:4px 0 0 4px;font-size:13px;font-weight:600;display:flex}.collapse-button{color:#6b717a;cursor:pointer;background:0 0;border:none;border-radius:4px;place-items:center;width:26px;height:26px;padding:0;display:grid}.collapse-button:hover{color:#2b2f36;background:#f1f3f5}.palette-section{grid-template-columns:repeat(2,52px);gap:4px;display:grid}.sep{background:#dde0e4;height:1px}.palette .tool-button{justify-content:center;align-items:center;gap:3px;height:36px;padding:0;display:flex;position:relative}.icon{place-items:center;display:grid}.split{display:flex}.split .tool-button{border-radius:6px 0 0 6px;flex:1}.caret-button{color:#2b2f36;cursor:pointer;background:#fff;border:1px solid #8a919b;border-left:none;border-radius:0 6px 6px 0;width:16px;padding:0;font-size:11px;box-shadow:0 1px 3px #00000026}.caret-button:hover{background:#f1f3f5}.badge{font-size:10px;line-height:1;position:absolute;bottom:1px;right:2px}.shape-item .icon{width:22px}.group-tab{color:#2b2f36;font:inherit;cursor:pointer;background:#fffffff5;border:1px solid #c3c8cf;padding:6px 10px;font-size:13px;font-weight:600;position:fixed;box-shadow:0 1px 4px #00000026}.group-tab:hover:not(:disabled){background:#f1f3f5}.group-tab:disabled{color:#a3a8af;cursor:default}.group-tab.edge-left,.group-tab.edge-right{writing-mode:vertical-rl;padding:10px 6px}.group-tab.edge-left{top:calc(var(--ruler-top) + 8px);left:var(--ruler-left);border-right:none;border-radius:6px 0 0 6px;transform:rotate(180deg)}.group-tab.edge-right{top:calc(var(--ruler-top) + 8px);border-right:none;border-radius:6px 0 0 6px;right:0}.group-tab.edge-bottom{border-bottom:none;border-radius:6px 6px 0 0;bottom:0;left:50%;translate:-50%}.play{background:#fffffff5;border:1px solid #c3c8cf;border-radius:8px;align-items:flex-start;gap:10px;padding:0 8px 8px 0;display:flex;position:fixed;bottom:12px;left:50%;translate:-50%;box-shadow:0 2px 8px #0000002e}.play[hidden],.goto-error[hidden]{display:none}.play .palette-header{gap:6px;width:auto;padding-top:13px;padding-left:8px}.play-tools{gap:6px;padding-top:8px;display:flex}.goto{grid-template-columns:150px auto auto;gap:6px;padding-top:8px;display:grid}.goto-input{box-sizing:border-box;height:34px;font:inherit;border:1px solid #8a919b;border-radius:6px;padding:6px 8px;font-size:14px}.home-button{white-space:nowrap;align-items:center;gap:6px;display:flex}.goto-error{color:#d64545;grid-column:1/-1;font-size:13px}.tool-button{color:#2b2f36;font:inherit;cursor:pointer;background:#fff;border:1px solid #8a919b;border-radius:6px;padding:6px 12px;font-size:14px;box-shadow:0 1px 3px #00000026}.tool-button:hover:not(:disabled){background:#f1f3f5}.tool-button:disabled{opacity:.45;cursor:default}.status{color:#fff;background:#2b2f36;border-radius:6px;max-width:calc(100% - 32px);padding:8px 14px;font-size:14px;position:fixed;bottom:72px;left:50%;transform:translate(-50%);box-shadow:0 2px 6px #00000040}.status[hidden]{display:none}.tool-button.active,.tool-button.active:hover{color:#fff;background:#2b2f36;box-shadow:inset 0 1px 3px #0006}.hints{left:calc(var(--ruler-left) + 8px);color:#2b2f36;background:#fffffff0;border:1px solid #c3c8cf;border-radius:6px;gap:3px;padding:8px 10px;font-size:13px;display:grid;position:fixed;bottom:12px;box-shadow:0 1px 3px #0000001f}.hints-title{margin-bottom:2px;font-weight:600}.hint{grid-template-columns:150px auto;align-items:center;gap:10px;display:grid}.hint-how{color:#6b717a}.hint-button{color:#2b2f36;font:inherit;cursor:pointer;background:#fff;border:1px solid #8a919b;border-radius:4px;justify-self:start;padding:1px 8px}.hint-button:hover:not(:disabled){background:#f1f3f5}.hint-button:disabled{opacity:.45;cursor:default}.board.eraser-mode{cursor:none}.size-menu,.ink-menu{z-index:1;background:#fff;border:1px solid #8a919b;border-radius:6px;padding:4px;display:grid;position:absolute;left:calc(100% + 6px);box-shadow:0 2px 6px #0003}.size-menu[hidden],.ink-menu[hidden]{display:none}.size-item{white-space:nowrap;color:#2b2f36;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 12px;font-size:14px}.size-item:hover{background:#f1f3f5}.size-item.active{color:#fff;background:#2b2f36}.ink-toggle{align-items:center;gap:6px;padding:6px 8px;display:flex}.caret{font-size:12px}.swatch{border-radius:50%;width:18px;height:18px;display:block}.width-sample{background:#2b2f36;border-radius:3px;width:22px;height:3px;display:block}.color-menu{grid-auto-flow:column;gap:4px}.color-item{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:50%;padding:3px}.color-item:hover{border-color:#c3c8cf}.color-item.active{border-color:#2b2f36}.width-item{align-items:center;gap:10px;display:flex}.width-sample.dashed{background:repeating-linear-gradient(90deg,#2b2f36 0 6px,#0000 6px 10px)}.width-item.active .width-sample{background:#fff}.width-item.active .width-sample.dashed{background:repeating-linear-gradient(90deg,#fff 0 6px,#0000 6px 10px)}.mat-tile{background-size:72px 72px;border:1px solid #8a919b;border-radius:3px;width:18px;height:18px;display:block}.mat-item{align-items:center;gap:10px;display:flex}.color-menu.dark .color-item.active{border-color:#fff}.grid-tile{border:1px solid #8a919b;border-radius:3px;display:block}.grid-menu .size-item:hover{background:#ffffff73}.grid-menu.dark .size-item{color:#e9ecf0}.grid-menu.dark .size-item:hover{background:#ffffff1f}.grid-menu .size-item.active,.grid-menu.dark .size-item.active{color:#fff;background:#2b2f36}.grid-menu.dark .size-item.active{background:#11141a}.bold-item{white-space:nowrap;margin-top:4px}.bold-item .check{text-align:center;width:18px;font-size:16px}.catalog{top:60px;right:12px;bottom:calc(var(--people-height,40px) + 24px);background:#fffffff5;border:1px solid #c3c8cf;border-radius:8px;flex-direction:column;gap:8px;width:236px;padding:0 8px 8px;display:flex;position:fixed;box-shadow:0 2px 8px #0000002e}.catalog[hidden],.modal-backdrop[hidden],.catalog-empty[hidden],.crop-box[hidden],.crop-circle[hidden],.size-row[hidden],.form-error[hidden],.text-button[hidden]{display:none}.catalog-search,.field input:not([type=range]){box-sizing:border-box;width:100%;font:inherit;border:1px solid #c3c8cf;border-radius:4px;padding:6px 8px;font-size:14px}.text-button{color:#2b2f36;font:inherit;cursor:pointer;background:#fff;border:1px solid #c3c8cf;border-radius:4px;padding:6px 12px;font-size:14px}.text-button:hover:not(:disabled){background:#f1f3f5}.text-button:disabled{color:#a3a8af;cursor:default}.text-button.primary{color:#fff;background:#2f6fca;border-color:#2f6fca}.text-button.primary:hover:not(:disabled){background:#2a62b3}.text-button.primary:disabled{color:#8a9099;background:#e3e6ea;border-color:#c3c8cf}.text-button.danger{color:#b42318}.text-button kbd{color:#6b717a;font:inherit;border:1px solid #c3c8cf;border-radius:3px;margin-left:8px;padding:0 4px;font-size:11px}.figure-list{grid-template-columns:repeat(3,1fr);align-content:start;gap:6px;display:grid;overflow-y:auto}.figure-item{font:inherit;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-items:center;gap:4px;padding:6px 2px;display:grid}.figure-item:hover{background:#f1f3f5}.token{box-sizing:border-box;object-fit:cover;background:#e3e6ea;border:2px solid #2b2f36;border-radius:50%;width:56px;height:56px}.figure-name{color:#2b2f36;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:12px;overflow:hidden}.catalog-empty{color:#6b717a;text-align:center;margin:8px 0;font-size:13px}.modal-backdrop{z-index:10;background:#14181e73;place-items:center;display:grid;position:fixed;inset:0}.dialog{color:#2b2f36;background:#fff;border-radius:8px;gap:10px;max-width:calc(100vw - 48px);max-height:calc(100vh - 48px);padding:16px;display:grid;box-shadow:0 8px 24px #0000004d}.dialog h2{margin:0;font-size:17px}.dialog p{margin:0}.dialog-buttons,.form-row{flex-wrap:wrap;gap:8px;display:flex}.dialog-buttons{justify-content:flex-end}.figure-view{justify-items:center}.full-image{object-fit:contain;max-width:calc(100vw - 80px);max-height:calc(100vh - 160px)}.figure-form{width:600px}.field{color:#6b717a;gap:4px;font-size:13px;display:grid}.form-error{color:#b42318;font-size:13px}.crop-box{align-items:flex-start;gap:12px;display:flex}.crop-view{-webkit-user-select:none;user-select:none;background:#e3e6ea;position:relative;overflow:hidden}.crop-view img{width:100%;height:100%;display:block}.crop-circle{box-sizing:border-box;cursor:move;touch-action:none;border:2px solid #fff;border-radius:50%;position:absolute;box-shadow:0 0 0 1px #2b2f36,0 0 0 2000px #00000073}.crop-side{justify-items:center;gap:10px;display:grid}.token-preview{width:96px;height:96px}.size-row input{width:110px}.token-menu[hidden],.condition-tip[hidden]{display:none}.menu-level{box-sizing:border-box;z-index:5;background:#fff;border:1px solid #c3c8cf;border-radius:8px;min-width:150px;padding:4px;display:grid;position:fixed;overflow-y:auto;box-shadow:0 2px 8px #0000002e}.menu-item{color:inherit;font:inherit;text-align:left;white-space:nowrap;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:4px 8px;display:flex}.menu-item.separated{margin-top:5px;box-shadow:0 -3px 0 -2px #e3e6ea}.menu-item:hover,.menu-item[aria-expanded=true]{background:#f1f3f5}.menu-item[aria-checked=true]{background:#e8f0fe;font-weight:600}.menu-item.danger{color:#c0392b}.menu-lead{display:inline-flex}.menu-label{flex:1}.menu-mark{color:#5d646e;text-align:right;min-width:12px}.condition-tip{z-index:4;color:#fff;white-space:nowrap;pointer-events:none;background:#1b1d21e0;border-radius:6px;padding:4px 8px;font-size:13px;line-height:1.35;position:fixed}.person-dot.none{background:#fff;box-shadow:inset 0 0 0 1px #8a9099}.people{box-sizing:border-box;color:#2b2f36;background:#fffffff5;border:1px solid #c3c8cf;border-radius:8px;width:236px;padding:6px 8px 8px;font-size:14px;position:fixed;bottom:12px;right:12px;box-shadow:0 2px 8px #0000002e}.people-header{justify-content:space-between;align-items:center;min-height:28px;font-weight:600;display:flex}.people-header .tool-button{padding:3px 10px;font-weight:400}.people-list{margin:4px 0 0;padding:0;list-style:none}.person-row{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:4px 6px;display:flex}.person-row:hover:not(:disabled){background:#f1f3f5}.person-row:disabled{cursor:default}.person.you .person-row{background:#e8f0fe;font-weight:600}.person-dot{border-radius:50%;flex:none;width:12px;height:12px;box-shadow:0 0 0 1px #0003}.person-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.gm-tag{color:#fff;background:#2b2f36;border-radius:4px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px}.person-menu,.invite-popup{border-top:1px solid #e1e4e8;gap:8px;margin-top:8px;padding-top:8px;display:grid}.person-menu[hidden],.invite-popup[hidden],.person-rename[hidden],.person-palette[hidden],.person-error[hidden],.backup[hidden],.sign-out[hidden],.invite-link-row[hidden],.invite-expiry[hidden]{display:none}.person-rename label,.invite-popup label{gap:4px;display:grid}form.person-rename{grid-template-columns:1fr auto;align-items:end}.person-menu input,.invite-popup input,.invite-popup select{box-sizing:border-box;width:100%;font:inherit;border:1px solid #8a919b;border-radius:6px;padding:5px 6px}.person-palette{grid-template-columns:repeat(8,1fr);gap:4px;display:grid}.color-choice{aspect-ratio:1;cursor:pointer;border:2px solid #0000;border-radius:50%;padding:0}.color-choice.active{border-color:#2b2f36;box-shadow:inset 0 0 0 2px #fff}.color-choice:disabled{opacity:.25;cursor:not-allowed}.person-error{color:#c92a2a;font-size:13px}.invite-link-row{grid-template-columns:1fr auto;gap:6px;display:grid}.invite-expiry{color:#4a4f57;font-size:13px}.access-page{box-sizing:border-box;color:#2b2f36;place-content:center;justify-items:center;gap:16px;height:100%;padding:16px;display:grid}.access-page h1{margin:0;font-size:28px}.access-form{background:#fff;border:1px solid #c3c8cf;border-radius:8px;gap:12px;width:min(320px,100%);padding:20px;display:grid;box-shadow:0 2px 8px #0000002e}.access-form label{gap:6px;font-size:14px;display:grid}.access-form input{font:inherit;border:1px solid #8a919b;border-radius:6px;padding:8px}.access-form button,.join-choices button{font:inherit;cursor:pointer;background:#fff;border:1px solid #8a919b;border-radius:6px;padding:8px 12px}.access-form button[type=submit]{color:#fff;background:#2b2f36}.access-form p{margin:0}.join-choices{gap:8px;display:grid}.join-form{gap:12px;display:grid}.join-form[hidden],.access-error[hidden]{display:none}.access-error{color:#c92a2a;font-size:14px}.access-note{color:#4a4f57;font-size:13px}a.tool-button.backup{text-align:center;text-decoration:none}