/* Reference treatment stays scoped to the idea canvas. */
.app[data-screen=canvas]{background:#dedfdd;color:#121312;}
.canvas-screen{background:linear-gradient(180deg,#e7e8e6 0%,#dedfdd 74%,#d9dbd8 100%);}
.canvas-screen .idea-board{background:#dedfdd;border-color:#d2d4d0;isolation:isolate;}
.floating-canvas{position:absolute;inset:0;overflow:hidden;background:radial-gradient(ellipse at 48% 29%,#eceeeb80,transparent 71%),linear-gradient(180deg,#e3e5e2,#d7dad6);color:#111411;touch-action:none;user-select:none;-webkit-user-select:none;}
.floating-canvas-heading{position:absolute;top:17px;left:17px;right:17px;height:25px;display:flex;align-items:center;z-index:4;pointer-events:none;}
.canvas-board-title{font-size:17px;font-weight:750;letter-spacing:-.6px;transition:opacity 180ms;}
.canvas-rosette{position:absolute;top:0;left:50%;transform:translateX(-50%);width:19px;height:19px;opacity:0;transition:opacity 180ms;}
.canvas-rosette svg{width:100%;height:100%;stroke:currentColor;fill:none;}
.has-focus .canvas-rosette,.floating-canvas[data-layout=stack] .canvas-rosette{opacity:1;}
.has-focus .canvas-board-title,.floating-canvas[data-layout=stack] .canvas-board-title{opacity:0;}
.is-preview .floating-canvas-heading{top:13px;}
.is-preview .canvas-board-title{font-size:13px;}
.canvas-camera{position:absolute;inset:0;transform-origin:0 0;will-change:transform;}
.camera-settling .canvas-camera{transition:transform 420ms cubic-bezier(.2,.78,.22,1);}
.floating-card{position:absolute;left:0;top:0;overflow:visible;display:block;padding:0;border-radius:9px;border:1px solid #ffffff7d;background:#f5f6f2;color:#131713;text-align:left;box-shadow:0 1px 1px #20261e0c,0 5px 9px -5px #30362c26,0 16px 17px -12px #303a2c30;transform-origin:0 0;will-change:transform;transition:transform 460ms cubic-bezier(.2,.8,.22,1.03),box-shadow 220ms,translate 300ms;cursor:grab;touch-action:none;backface-visibility:hidden;}
.floating-card:focus-visible{outline:2px solid #596357;outline-offset:4px;}
.floating-card.is-lifted{cursor:grabbing;transition:box-shadow 150ms;box-shadow:0 2px 5px #252b221a,0 23px 27px -9px #29372447;}
.floating-card.is-focused{cursor:pointer;box-shadow:0 1px 2px #25292018,0 14px 21px -10px #35422a50;}
.is-panning{cursor:grabbing;}
.is-panning .canvas-camera{transition:none;}
.card-photo{padding:3px;background:#f5f6f1;border-radius:8px;border:1px solid #ffffffb0;}
.card-photo img{width:100%;height:100%;display:block;border-radius:5px;object-fit:cover;pointer-events:none;}
.floating-photo-caption{position:absolute;left:10px;bottom:-7px;padding:4px 8px;border-radius:4px;background:#fcfdf9;font-size:7px;font-weight:500;box-shadow:0 2px 3px #0000000a;white-space:nowrap;transition:opacity 180ms;}
.is-focused .floating-photo-caption,.has-focus .floating-card:not(.is-focused) .floating-photo-caption{opacity:0;}
.card-object{border:0;background:transparent;box-shadow:none!important;}
.card-object img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;filter:drop-shadow(0 15px 9px #26352220);}
.object-label{position:absolute;bottom:-5px;left:50%;transform:translateX(-50%);font-size:7px;white-space:nowrap;background:#fafbf8;padding:5px 9px;border-radius:4px;box-shadow:0 2px 5px #0000000b;}
.has-focus .object-label{opacity:0;}
.card-note{display:flex;flex-direction:column;padding:14px 12px 9px;background:linear-gradient(130deg,#fbfcf9,#eeeeea);border-radius:5px;}
.paper-tape{position:absolute;left:43%;top:-5px;width:33px;height:11px;background:#ecdfb775;backdrop-filter:blur(1px);transform:rotate(-9deg);border-left:1px dashed #f4ebd880;border-right:1px dashed #f4ebd880;}
.card-note p{font-size:var(--note-font,17px);line-height:1.12;letter-spacing:-.7px;font-weight:500;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;flex:1;min-height:0;overflow:hidden;}
.card-note small{display:block;font-size:6px;color:#969b93;margin-top:6px;flex:none;}
.canvas-note-editor{cursor:text;user-select:text;-webkit-user-select:text;touch-action:auto;outline:2px solid #cdb4efb3;outline-offset:3px;transition:height 160ms;}
.canvas-note-editor textarea{display:block;flex:1;min-width:0;min-height:0;width:100%;margin:0;padding:0;resize:none;border:0;border-radius:0;outline:0;background:transparent;color:#25212b;font:500 17px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;letter-spacing:-.5px;overflow:auto;user-select:text;-webkit-user-select:text;touch-action:auto;}
.canvas-note-editor textarea::placeholder{color:#9a929e;}
.canvas-note-footer{display:flex;align-items:center;gap:5px;justify-content:space-between;margin-top:10px;flex:none;font-size:8px;line-height:1.3;color:#93889b;}
.is-note-editing{visibility:hidden!important;pointer-events:none!important;}
.card-record{background:linear-gradient(145deg,#f9faf6,#dfe3db);border:3px solid #f9faf7;border-radius:9px;}
.canvas-record{position:absolute;width:83px;height:83px;left:50%;top:8px;transform:translateX(-50%);border-radius:50%;background:conic-gradient(from 32deg,#53584f,#cbd0c7 13%,#30362e 25%,#60665c 37%,#d4d7cf 52%,#373e32 65%,#8d9688 86%,#53584f);box-shadow:0 0 0 1px #7a8272,0 2px 3px #0003,inset 0 0 0 3px #959e8980;}
.canvas-record:before{content:"";position:absolute;inset:5px;border-radius:50%;background:repeating-radial-gradient(circle,#171d1300 0 2px,#15220f3d 2px 2.6px);}
.canvas-record:after{content:"";position:absolute;inset:28px;border:10px solid #d9ddd3;border-radius:50%;background:#444c3c;box-shadow:0 0 0 1px #0002;}
.canvas-record i{position:absolute;right:-19px;top:5px;width:7px;height:64px;border-right:3px solid #565f4c;border-bottom:3px solid #565f4c;border-radius:0 0 5px 0;transform:rotate(-9deg);filter:drop-shadow(1px 2px 1px #0003);}
.record-caption{position:absolute;bottom:4px;left:7px;font-size:6px;font-weight:500;color:#5d6554;}
.record-foot{position:absolute;right:8px;top:9px;font-size:4px;font-weight:600;display:grid;gap:3px;color:#72786c;}
.card-voice{background:linear-gradient(145deg,#fff,#eeefec);padding:12px;border-radius:13px;}
.voice-on{position:absolute;top:12px;left:12px;width:32px;height:25px;display:grid;place-items:center;border-radius:50%;background:#0b0f0b;color:#f3f5ef;font-size:7px;font-weight:600;letter-spacing:-.1px;}
.voice-orbit{position:absolute;top:16px;right:15px;width:46px;height:46px;border-radius:50%;background:conic-gradient(#e6e7e1 0 8%,#242821 10% 23%,#f2f4eb 25% 48%,#292c24 50% 60%,#edf0e7 62% 84%,#313a27 87% 93%,#f8f8f1 95%);box-shadow:inset 0 0 0 1px #bcc1b751;transform:rotate(-17deg);}
.voice-orbit:before{content:"";position:absolute;inset:13px;border-radius:50%;background:radial-gradient(ellipse at 35% 30%,#ec9d8c,#a63829 68%,#733124);border:3px solid #e4e5dc;box-shadow:0 1px 2px #0003;}
.voice-orbit:after{content:"";position:absolute;left:-6px;top:10px;width:18px;height:8px;border-radius:40%;background:linear-gradient(15deg,#2a1f14,#ac9a6b,#514a2c);transform:rotate(42deg);}
.voice-value{position:absolute;bottom:10px;left:12px;right:8px;}
.voice-value small{font-size:8px;color:#a0a59d;display:block;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.voice-value strong{display:block;font-size:36px;letter-spacing:-2px;font-weight:550;line-height:1.05;}
.card-rhythm{background:linear-gradient(140deg,#f6f567,#eced52);border:1px solid #fafb8b;border-radius:10px;padding:10px 8px;color:#252a12;box-shadow:0 7px 11px -6px #747c2440;}
.rhythm-symbol{display:grid;place-items:center;width:24px;height:21px;}
.rhythm-symbol svg{width:14px;height:14px;stroke:currentColor;fill:none;}
.rhythm-value{position:absolute;bottom:8px;left:8px;right:5px;}
.rhythm-value small{display:block;font-size:5px;color:#959a49;line-height:1.3;}
.rhythm-value strong{font-size:25px;font-weight:650;letter-spacing:-1px;line-height:1;display:block;}
.canvas-screen .canvas-done{top:5px;right:5px;bottom:auto;z-index:36;width:44px;height:44px;display:grid;place-items:center;padding:0;background:none;border:0;border-radius:50%;color:#252c22;}
.canvas-done svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.canvas-screen .canvas-done:hover{background:#ffffff25;}
.canvas-dock{position:absolute;z-index:35;left:9px;right:9px;bottom:8px;height:44px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;}
.canvas-dock button{pointer-events:auto;display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:#141b12;border:0;border-radius:50%;background:transparent;}
.canvas-dock svg,.canvas-focus-actions svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.3;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.canvas-add-control{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-sizing:border-box;width:98px;max-width:100%;height:28px;border-radius:18px;border:1px solid #eef0e84d;background-color:#f4f8e119;box-shadow:0 1px 4px #b5bbaa0d,inset 0 1px #ffffff17;backdrop-filter:blur(14px);pointer-events:auto;transition:width 300ms cubic-bezier(.2,.8,.2,1),height 300ms cubic-bezier(.2,.8,.2,1),border-radius 300ms,border-color 240ms,background-color 240ms,box-shadow 240ms;}
.canvas-add-control.is-open{width:292px;height:50px;border-radius:26px;border-color:#fff9;background-color:#f0f2e8ed;box-shadow:0 4px 14px #3a48261a,inset 0 1px #fff6;}
.canvas-dock .canvas-add{position:absolute;inset:50% 0 auto;translate:0 -50%;width:100%;height:44px;padding:0;border-radius:18px;opacity:1;visibility:visible;transition:opacity 100ms 140ms,visibility 0s;}
.canvas-add>span{display:grid;place-items:center;}
.canvas-dock .canvas-add svg{width:20px;height:20px;color:#b4baaa;}
.canvas-add-control.is-open .canvas-add{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 80ms,visibility 0s 80ms;}
.canvas-dock>button{transition:opacity 140ms 160ms,visibility 0s 160ms;}
.canvas-dock.is-add-open>button{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 100ms,visibility 0s 100ms;}
.canvas-dock button:hover{background:#ffffff19;}
.canvas-dock button:active{transform:scale(.94);}
.canvas-add-options{position:absolute;inset:0;box-sizing:border-box;padding:4px;display:flex;align-items:center;gap:4px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 90ms,visibility 0s 90ms;}
.canvas-add-control.is-open .canvas-add-options{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 160ms 100ms,visibility 0s;}
.canvas-focus-actions[hidden]{display:none;}
.canvas-dock .canvas-add-options button{flex:0 0 40px;min-width:0;width:40px;height:40px;padding:0;font-size:12px;border-radius:22px;white-space:nowrap;background:#46523c0a;}
.canvas-dock .canvas-add-options .canvas-add-primary{flex:1;gap:7px;padding:0 12px;background:#e1e5d6;}
.canvas-dock .canvas-add-options .canvas-add-close{flex:0 0 32px;width:32px;background:transparent;}
.canvas-dock .canvas-add-options button:hover{background:#d5dccb;}
.canvas-dock .canvas-add-options svg{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;}
.canvas-focus-actions{position:absolute;z-index:32;top:457px;left:0;right:0;display:flex;justify-content:center;gap:7px;align-items:center;}
.canvas-focus-actions button{position:relative;display:grid;place-items:center;width:44px;height:44px;color:#46523c;border:0;border-radius:8px;}
.canvas-focus-actions button:before{content:"";position:absolute;inset:7px;border:1px solid #c4cbbbac;border-radius:6px;background:#eef2e233;box-shadow:inset 0 1px #fafff326;}
.canvas-focus-actions button:hover:before{background:#ffffff60;}
.canvas-focus-actions svg{width:16px;height:16px;z-index:1;}
.canvas-focus-actions button:active{transform:scale(.94);}
.floating-canvas[data-layout=grid] .floating-card{border-radius:5px;}
.is-preview .canvas-camera{pointer-events:none;}
.is-preview .floating-card{transition:none;}
.floating-canvas .board-preview-hint{bottom:11px;right:14px;font-size:8px;color:#969c90;}
.floating-canvas .board-preview-hint svg{width:9px;height:9px;fill:none;stroke:currentColor;stroke-width:1.5;}
@media(prefers-reduced-motion:reduce){.floating-card,.canvas-camera,.camera-settling .canvas-camera,.canvas-add-control,.canvas-add-options,.canvas-dock button{transition:none!important;}}
.floating-card.is-thumbnail-overflow{visibility:hidden;pointer-events:none;}
