:root{font-family:"Helvetica Neue",Helvetica,-apple-system,BlinkMacSystemFont,Arial,sans-serif;color:#0F1E2A;background:#F4F6F7;--accent:#FF5A1F;--line:#D3D9DD;--muted:#66727C;--blue:#2366d6;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,textarea{font:inherit}button{border:0;background:none;color:inherit;cursor:pointer}button:hover{background:#F4F6F7}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.5;cursor:default}header{height:56px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;padding:0 24px;position:relative;z-index:10;font-size:13px}.brand{display:flex;align-items:center}.brand img{width:166px;height:auto}.divider{height:20px;width:1px;background:var(--line);display:inline-block;flex-shrink:0}#boardTitle{background:none;border:0;outline:none;font-weight:500;font-size:14px;color:inherit;width:220px;padding:6px 0}#saveStatus{font-size:11px;color:var(--muted)}#saveStatus i{display:none}.header-right{margin-left:auto;display:flex;align-items:center;gap:12px}.header-right button{padding:8px 14px;border-radius:6px}.primary{background:var(--accent);color:#fff;padding:9px 16px;border-radius:6px;font-size:13px;font-weight:500}.primary:hover{background:#e94b13}#canvas{position:absolute;inset:56px 0 0;overflow:hidden;background:#F4F6F7;background-image:none;touch-action:none}#world{position:absolute;transform-origin:0 0;width:10000px;height:10000px}#wires{position:absolute;top:0;left:0;overflow:visible;pointer-events:none}.edge{pointer-events:stroke;cursor:pointer;stroke:#66727C;stroke-width:1.5;fill:none}.edge:hover{stroke:var(--accent);stroke-width:3}.card{position:absolute;min-width:140px;min-height:100px;border-radius:5px;box-shadow:0 2px 7px #0F1E2A0a;border:1px solid #D3D9DD;user-select:none;overflow:visible}.card.selected{outline:1.5px solid var(--accent);outline-offset:2px}.grip{height:19px;cursor:grab;display:flex;align-items:center;justify-content:center;font-size:13px;color:#66727C}.grip .dots{opacity:0;line-height:1}.card:hover .grip .dots,.card.selected .grip .dots{opacity:.45}.content{padding:3px 17px 17px;outline:none;user-select:text;cursor:text;min-height:78px;overflow-wrap:anywhere;line-height:1.6;font-size:14px}.content:empty:before{content:'Write…';color:#929aa1}.content h2{font:600 18px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif;margin:0 0 10px}.content p{margin:0 0 8px}.content p:last-child{margin-bottom:0}.content ul,.content ol{padding-left:20px;margin:5px 0}.smart{color:var(--blue);font-weight:700;cursor:pointer;border-bottom:1px dashed #2366d640}.card .handle,#selection .handle{display:none;position:absolute;width:8px;height:8px;background:#fff;border:1px solid var(--accent);z-index:5;border-radius:1px}.card.selected .handle,#selection .handle{display:block}.nw{left:-6px;top:-6px;cursor:nwse-resize}.ne{right:-6px;top:-6px;cursor:nesw-resize}.sw{left:-6px;bottom:-6px;cursor:nesw-resize}.se{right:-6px;bottom:-6px;cursor:nwse-resize}#selection{position:absolute;border:1px solid var(--accent);display:none;pointer-events:none}#selection .handle{pointer-events:auto}#marquee{display:none;position:absolute;background:#FF5A1F0a;border:1px solid var(--accent);pointer-events:none}.tools{position:fixed;left:16px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid var(--line);border-radius:8px;padding:4px;display:flex;flex-direction:column;gap:3px;z-index:15}.tools>button{width:36px;height:36px;border-radius:5px;display:grid;place-items:center}.tools svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.tools>button.active{background:#FFF0E9;color:var(--accent)}#connectorOptions{position:absolute;left:51px;bottom:0;background:#fff;border:1px solid var(--line);border-radius:6px;padding:4px;display:flex;box-shadow:0 2px 10px #0F1E2A08}#connectorOptions button{font-size:12px;border-radius:4px;padding:8px 12px}#connectorOptions button.active{color:var(--accent)}.floating{position:fixed;z-index:20;background:#fff;border:1px solid var(--line);border-radius:7px;padding:3px;display:flex;align-items:center;box-shadow:0 2px 10px #0F1E2A08}.floating button{width:32px;height:30px;border-radius:4px;font-size:14px}.floating em{font-family:Georgia,serif}footer{position:fixed;bottom:16px;right:16px;z-index:12}.zoom{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px}.zoom button{width:28px;height:28px;border-radius:4px}#zoomLabel{font-size:11px;width:43px}.hidden{display:none!important}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#0F1E2A;color:white;padding:11px 17px;border-radius:7px;z-index:100;font-size:12px;opacity:0;transition:opacity .15s;pointer-events:none;max-width:90vw}#toast.show{opacity:1}dialog{padding:28px;border:1px solid var(--line);border-radius:10px;width:420px;max-width:calc(100vw - 30px);box-shadow:0 15px 70px #0F1E2A18;color:inherit}dialog::backdrop{background:#0F1E2A30}.close{position:absolute;right:12px;top:10px;font-size:23px;color:var(--muted);border-radius:4px;width:27px}dialog h2{font-size:23px;letter-spacing:-.5px;margin:0 0 12px;line-height:1.2}dialog p{font-size:13px;color:var(--muted);line-height:1.6}dialog label{display:block;font-size:12px;margin:17px 0 6px}dialog input{width:100%;border:1px solid var(--line);padding:10px;border-radius:5px;background:#fff;outline-color:var(--accent)}dialog .primary{width:100%;margin-top:17px}dialog .link{font-size:12px;text-decoration:underline;margin-top:17px}dialog .board-row{width:100%;padding:14px 5px;border-bottom:1px solid var(--line);text-align:left;display:flex;justify-content:space-between;font-size:13px}dialog .board-row small{color:var(--muted)}.error{color:#b24432;font-size:12px}#qr{display:grid;place-items:center;margin:20px 0}#qr svg{max-width:180px;height:auto}#popover{position:fixed;z-index:40;width:300px;background:#fff;padding:16px;border-radius:8px;box-shadow:0 5px 25px #0F1E2A18;border:1px solid var(--line)}#popover label{font-size:12px;font-weight:500}#popover textarea{width:100%;margin:10px 0;border:1px solid var(--line);border-radius:5px;padding:9px;resize:vertical;min-height:65px;font-size:13px;outline-color:var(--accent)}#popover .actions{display:flex;justify-content:flex-end;gap:7px}#popover button{padding:8px 12px;font-size:12px;border-radius:5px}.cursor{position:absolute;pointer-events:none;font-size:11px;color:#2366d6;white-space:nowrap}.cursor span{background:#2366d6;color:white;padding:3px 7px;border-radius:4px;margin-left:6px}.content.ai-input{min-height:44px;padding-bottom:8px}.ai-question{margin:0 17px 12px;padding:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;background:none;border:0;user-select:none}.ai-hint{font-size:10px;color:#8a939b}.ai-question button{font-size:11px;font-weight:500;color:#FF5A1F;padding:5px 8px;border-radius:4px;background:#FF5A1F0a}.ai-question button:hover{background:#FF5A1F18}@media(max-width:800px){header{gap:12px;padding:0 14px}.brand img{width:130px}#boardTitle{width:150px}#saveStatus{display:none}}@media(max-width:540px){.brand img{width:95px}header>.divider{display:none}header{gap:8px}#boardTitle{width:110px;font-size:12px}.header-right{gap:2px}.header-right button{padding:7px 9px;font-size:12px}.tools{left:10px}}

.card .handle.bottom,#selection .handle.bottom{left:10px;right:10px;bottom:-5px;width:calc(100% - 20px);height:9px;background:transparent;border:0;cursor:ns-resize;border-radius:0}.card:hover .handle.bottom{display:block}.card .handle.bottom::after,#selection .handle.bottom::after{content:'';position:absolute;left:calc(50% - 12px);top:3px;width:24px;height:2px;background:#66727C66;border-radius:2px}#boardTitle{width:auto;flex:1;min-width:0}#saveStatus{white-space:nowrap}.header-right{flex-shrink:0}.confirm-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px}.confirm-actions button{padding:9px 16px;border-radius:5px}.confirm-actions .primary{width:auto;margin:0}@media(max-width:1100px){#saveStatus{display:none}}@media(max-width:700px){header{height:90px;flex-wrap:wrap;align-content:center;gap:8px 12px}header>.divider{display:none}#boardTitle{order:3;flex:0 0 100%;width:100%;font-size:14px;padding:3px 0}#canvas{top:90px}.brand img{width:130px}.header-right{margin-left:auto}}

.board-name{flex:1;min-width:0;display:flex;align-items:center;gap:5px}.board-name #boardTitle{order:0;flex:1;width:0;min-width:0}#renameBoard{width:27px;height:28px;display:grid;place-items:center;border-radius:4px;flex-shrink:0;color:#66727C}#renameBoard svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}#boardTitle:hover{background:#F4F6F7;border-radius:4px}@media(max-width:900px){header{height:90px;flex-wrap:wrap;align-content:center;gap:8px 12px}header>.divider{display:none}.board-name{order:3;flex:0 0 100%;width:100%}.board-name #boardTitle{font-size:14px;padding:3px 0}#canvas{top:90px}}

.card .handle.side,#selection .handle.side{top:10px;bottom:10px;width:9px;height:calc(100% - 20px);background:transparent;border:0;cursor:ew-resize;border-radius:0}.card .handle.side.left,#selection .handle.side.left{left:-5px}.card .handle.side.right,#selection .handle.side.right{right:-5px}.card:hover .handle.side{display:block}.card .handle.side::after,#selection .handle.side::after{content:"";position:absolute;left:3px;top:calc(50% - 12px);width:2px;height:24px;background:#66727C66;border-radius:2px}

#colorOptions{display:flex;gap:7px;padding:6px}#colorOptions button{width:20px;height:20px;border:1px solid #D3D9DD;border-radius:50%}#colorOptions button:hover{outline:1px solid #FF5A1F;outline-offset:2px}.canvas-hint{position:fixed;bottom:23px;left:70px;right:145px;text-align:center;font-size:10px;color:#8a939b;pointer-events:none;line-height:1.5;z-index:10}@media(max-width:600px){.canvas-hint{left:12px;right:130px;bottom:17px;font-size:9px}}

dialog .board-row{padding:4px 0;gap:8px;align-items:center}.board-open{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-width:0;padding:12px 5px;text-align:left;border-radius:4px}.board-open>span{overflow-wrap:anywhere}.board-open small{white-space:nowrap}.delete-board{width:30px;height:32px;display:grid;place-items:center;flex-shrink:0;border-radius:4px;color:#66727C}.delete-board:hover{color:#bf3b24;background:#fff0e9}.delete-board svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.smart .ai-source{font-size:.72em;font-weight:500;margin-left:5px;text-decoration:none;color:#2366d6;border-bottom:1px solid #2366d655}.smart .ai-source:hover{border-bottom-color:#2366d6}

.remote-selection{position:absolute;border:1.5px solid #426cdf;border-radius:2px;pointer-events:none;z-index:8}.remote-selection>span{position:absolute;left:-1px;top:-20px;background:#426cdf;color:white;font-size:10px;line-height:18px;padding:0 6px;border-radius:3px 3px 0 0;white-space:nowrap}#participants{display:flex;align-items:center;margin-right:3px}.participant{width:27px;height:27px;border:2px solid white;border-radius:50%;background:#e1eaf4;color:#28445d;font-size:10px;font-weight:600;display:grid;place-items:center;margin-left:-5px}.participant:first-child{margin-left:0}.touch-hint{display:none}@media(pointer:coarse){.desktop-hint{display:none}.touch-hint{display:inline}.card .handle.side,#selection .handle.side{display:block;width:28px;touch-action:none}.card .handle.side.left,#selection .handle.side.left{left:-14px}.card .handle.side.right,#selection .handle.side.right{right:-14px}.card .handle.side::after,#selection .handle.side::after{left:13px}.card .handle.bottom,#selection .handle.bottom{display:block;height:28px;bottom:-14px;touch-action:none}.card .handle.bottom::after,#selection .handle.bottom::after{top:13px}.card .handle.nw,.card .handle.ne,.card .handle.sw,.card .handle.se,#selection .handle.nw,#selection .handle.ne,#selection .handle.sw,#selection .handle.se{width:28px;height:28px;background:transparent;border:0;touch-action:none}.handle.nw,.handle.sw{left:-15px}.handle.ne,.handle.se{right:-15px}.handle.nw,.handle.ne{top:-15px}.handle.sw,.handle.se{bottom:-15px}.card .handle.nw::after,.card .handle.ne::after,.card .handle.sw::after,.card .handle.se::after,#selection .handle.nw::after,#selection .handle.ne::after,#selection .handle.sw::after,#selection .handle.se::after{content:'';position:absolute;left:10px;top:10px;width:8px;height:8px;border:1px solid var(--accent);background:white}}

.brand{gap:12px;text-decoration:none;white-space:nowrap}@media(max-width:540px){.brand{gap:8px}.brand img{width:112px}}

#participants{cursor:pointer}@media(max-width:540px){.header-right{gap:3px}.header-right button{padding:7px;font-size:11px}.brand img{width:95px}.brand{gap:7px}#participants .participant{width:23px;height:23px;font-size:9px}#participants .participant:nth-child(n+3){display:none}}

.brand{--logo-width:166px;--logo-height:18.14px;gap:12px}.brand img{width:var(--logo-width)}.brand .jam-wordmark{display:block;width:auto;height:var(--logo-height);flex-shrink:0}@media(max-width:800px){.brand{--logo-width:130px;--logo-height:14.2px;gap:10px}}@media(max-width:540px){.brand{--logo-width:112px;--logo-height:12.24px;gap:7px}}@media(max-width:360px){.brand{--logo-width:95px;--logo-height:10.38px}}

html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none;touch-action:none}header{position:fixed;top:0;left:0;right:0}header,.tools,footer{touch-action:manipulation}

/* Safari must not extend native text selection across canvas cards or controls. */
body{-webkit-user-select:none;user-select:none}header,.tools,footer,.floating,#cursors,.grip,.handle{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.content{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.content:focus,input,textarea{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}

.card .handle.top,#selection .handle.top{left:10px;right:10px;top:-5px;width:calc(100% - 20px);height:9px;background:transparent;border:0;cursor:ns-resize;border-radius:0}.card:hover .handle.top{display:block}.card .handle.top::after,#selection .handle.top::after{content:'';position:absolute;left:calc(50% - 12px);top:3px;width:24px;height:2px;background:#66727C66;border-radius:2px}
@media(any-pointer:coarse){
.card,#selection{--touch-hit:calc(44px / var(--canvas-zoom,1));--touch-half:calc(22px / var(--canvas-zoom,1))}
.card .handle.nw,.card .handle.ne,.card .handle.sw,.card .handle.se,#selection .handle.nw,#selection .handle.ne,#selection .handle.sw,#selection .handle.se{width:var(--touch-hit);height:var(--touch-hit);background:transparent;border:0;touch-action:none;z-index:7}
.handle.nw,.handle.sw{left:calc(-1 * var(--touch-half))}.handle.ne,.handle.se{right:calc(-1 * var(--touch-half))}.handle.nw,.handle.ne{top:calc(-1 * var(--touch-half))}.handle.sw,.handle.se{bottom:calc(-1 * var(--touch-half))}
.card .handle.nw::after,.card .handle.ne::after,.card .handle.sw::after,.card .handle.se::after,#selection .handle.nw::after,#selection .handle.ne::after,#selection .handle.sw::after,#selection .handle.se::after{content:'';position:absolute;left:calc(50% - 4px);top:calc(50% - 4px);width:8px;height:8px;border:1px solid var(--accent);background:white}
.card .handle.top,#selection .handle.top{height:var(--touch-hit);top:calc(4px / var(--canvas-zoom,1) - var(--touch-hit));touch-action:none}.card .handle.top::after,#selection .handle.top::after{top:calc(100% - 4px / var(--canvas-zoom,1) - 1px)}
}

.brand{gap:9px;--logo-width:140px;--logo-height:24px;color:#0F1E2A}.brand-by{font-size:12px;font-weight:400;color:#66727C}.brand img{flex-shrink:0}@media(max-width:800px){.brand{--logo-width:115px;--logo-height:22px;gap:7px}.brand-by{font-size:11px}}@media(max-width:540px){.brand{--logo-width:100px;--logo-height:20px;gap:6px}.brand-by{font-size:10px}}@media(max-width:360px){.brand{--logo-width:85px;--logo-height:18px;gap:5px}}

/* Keep the product and maker wordmarks at the same optical height. */
.brand{--logo-width:166px;--logo-height:18.14px;gap:9px;align-items:center}.brand-by{font-size:11px;line-height:1;color:#7b858d;align-self:center}@media(max-width:800px){.brand{--logo-width:140px;--logo-height:15.3px;gap:8px}.brand-by{font-size:10px}}@media(max-width:540px){.brand{--logo-width:115px;--logo-height:12.57px;gap:7px}.brand-by{font-size:9px}}@media(max-width:360px){.brand{--logo-width:100px;--logo-height:10.93px;gap:6px}}