@charset "UTF-8";.frame-app{display:grid;grid-template-rows:minmax(0,1fr) 56px;height:100%;min-height:0;background:var(--canvas-bg);overflow:hidden}.frame-app .frame-main{display:grid;grid-template-columns:var(--rail-width) var(--comp-width) minmax(0,1fr) var(--insp-width);min-height:0;height:100%;overflow:hidden;transition:grid-template-columns var(--panel-transition)}.frame-app.left-collapsed .frame-main{grid-template-columns:var(--rail-width) 0 1fr var(--insp-width)}.frame-app.right-collapsed .frame-main{grid-template-columns:var(--rail-width) var(--comp-width) 1fr 0}.frame-app.left-collapsed.right-collapsed .frame-main{grid-template-columns:var(--rail-width) 0 1fr 0}.frame-app .rail{width:var(--rail-width);background:var(--surface);border-right:1px solid var(--hair);display:grid;grid-auto-flow:row;align-content:start;padding:10px 0;gap:4px;justify-items:center}.frame-app .rail .ricon{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;color:var(--mute-2);cursor:pointer;background:none;border:0;padding:0;transition:background .14s,color .14s,transform .14s}.frame-app .rail .ricon:hover{background:var(--surface-3);color:var(--ink)}.frame-app .rail .ricon.active{background:var(--ink);color:var(--bg)}.frame-app .rail .ricon:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.frame-app .panel{background:var(--surface);display:grid;grid-template-rows:auto 1fr;min-height:0;min-width:0;overflow:hidden;transition:opacity var(--panel-transition),transform var(--panel-transition)}.frame-app .panel.components,.frame-app .panel.layers{border-right:1px solid var(--hair)}.frame-app .panel.inspector{border-left:1px solid var(--hair);border-right:0}.frame-app .panel.collapsed{opacity:0;pointer-events:none}.frame-app .panel.components.collapsed{transform:translate(-8px)}.frame-app .panel.inspector.collapsed{transform:translate(8px)}.frame-app .panel-head{height:44px;padding:0 10px 0 14px;border-bottom:1px solid var(--hair);display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.04em;color:var(--mute);text-transform:uppercase;font-weight:600}.frame-app .panel-body{padding:14px;overflow:auto}.frame-app .icon-btn{width:26px;height:26px;display:grid;place-items:center;border-radius:6px;border:0;background:transparent;color:var(--mute-2);cursor:pointer;transition:background .14s,color .14s}.frame-app .icon-btn:hover{background:var(--surface-3);color:var(--ink)}.frame-app .icon-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.frame-app .search{height:34px;border:1px solid var(--hair);border-radius:8px;background:var(--surface-2);display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--mute-2);font-size:12.5px;margin-bottom:6px;transition:border-color .14s,background .14s}.frame-app .search:focus-within{border-color:var(--ink);background:var(--surface)}.frame-app .search input{border:0;background:transparent;outline:none;flex:1;color:var(--ink);min-width:0;font:inherit}.frame-app .cat{margin-top:16px}.frame-app .cat:first-of-type{margin-top:10px}.frame-app .cat h4{margin:0 0 8px;font-size:10.5px;color:var(--mute-2);text-transform:uppercase;letter-spacing:.1em;font-weight:600}.frame-app .cgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.frame-app .ctile{border:1px solid var(--hair);border-radius:8px;height:72px;display:grid;grid-template-rows:1fr auto;padding:10px 8px 8px;background:var(--surface);cursor:grab;transition:border-color .14s,background .14s,transform .14s,box-shadow .14s;-webkit-user-select:none;user-select:none}.frame-app .ctile:hover{border-color:var(--ink);background:var(--surface)}.frame-app .ctile:active{cursor:grabbing}.frame-app .ctile .preview{display:grid;place-items:center;color:var(--ink)}.frame-app .ctile .preview lucide-icon{width:22px;height:22px;stroke-width:1.6}.frame-app .ctile .label{font-size:11px;color:var(--mute);text-align:center;font-weight:500}.frame-app .ctile:hover .label{color:var(--ink)}.frame-app .empty-hint{margin:12px 2px;color:var(--mute-2)}.frame-app .expand-tab{position:absolute;top:54px;width:22px;height:42px;display:grid;place-items:center;background:var(--surface);color:var(--mute);border:1px solid var(--hair);cursor:pointer;z-index:12;transition:background .14s,color .14s,border-color .14s}.frame-app .expand-tab.left{left:var(--rail-width);border-left:0;border-radius:0 8px 8px 0}.frame-app .expand-tab.right{right:0;border-right:0;border-radius:8px 0 0 8px}.frame-app .expand-tab:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}.frame-app .expand-tab:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.frame-app .canvas-wrap{position:relative;overflow:hidden;background:radial-gradient(circle at 1px 1px,var(--canvas-grid) 1px,transparent 0) 0 0/18px 18px,var(--canvas-bg);display:grid;grid-template-rows:minmax(0,1fr);min-width:0;min-height:0;height:100%;padding:0}.frame-app .canvas-wrap.commenting{cursor:crosshair}.frame-app .canvas-wrap .board-scroll{position:relative;overflow:auto;display:grid;place-items:start center;padding:56px 40px 80px;min-height:0;min-width:0;height:100%;width:100%}.frame-app .board-stage{position:relative;flex:0 0 auto}.frame-app .board{background:var(--surface);border:1px solid var(--hair);border-radius:10px;box-shadow:0 1px #0a0a0a0a,0 8px 24px #0a0a0a14;position:absolute;top:0;left:0;transform-origin:top left}.frame-app .presence{position:absolute;top:14px;right:16px;display:inline-flex;align-items:center;gap:10px;padding:6px 10px;background:var(--surface);border:1px solid var(--hair);border-radius:999px;box-shadow:0 2px 8px #0a0a0a0d;z-index:14}.frame-app .presence-state{display:inline-flex;align-items:center;gap:6px;padding-right:10px;border-right:1px solid var(--hair)}.frame-app .presence-state .dot{width:7px;height:7px;border-radius:50%;background:var(--mute-3)}.frame-app .presence-state.on .dot{background:#16a34a;box-shadow:0 0 0 3px #16a34a2e}.frame-app .presence-state .label{font-size:10.5px;color:var(--mute);letter-spacing:.04em;text-transform:uppercase;font-weight:600;line-height:1}.frame-app .presence-state.on .label{color:var(--ink)}.frame-app .peer-count{line-height:1}.frame-app .avatars{display:inline-flex}.frame-app .avatars .peer{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;background:var(--ink);color:var(--bg);font-size:10px;font-weight:600;font-family:var(--font-mono);letter-spacing:.02em;box-shadow:0 0 0 2px var(--surface);transition:transform .16s}.frame-app .avatars .peer+.peer{margin-left:-6px}.frame-app .avatars .peer[data-active=true]{box-shadow:0 0 0 2px var(--surface),0 0 0 4px #10a34a59}.frame-app .avatars .peer.solo{background:var(--surface-3);color:var(--mute-2);box-shadow:inset 0 0 0 1px var(--hair)}.frame-app .avatars .peer.solo lucide-icon{width:12px;height:12px}.frame-app .peer-count{color:var(--mute);font-size:11px}.frame-app .zoom-chip{position:absolute;right:16px;bottom:14px;display:inline-flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;box-shadow:0 2px 8px #0a0a0a0d;z-index:11}.frame-app .zoom-chip .btn{height:28px;min-width:34px;padding:0 10px;border:0;background:transparent;color:var(--ink);border-radius:6px;font-size:12px;cursor:pointer;transition:background .14s}.frame-app .zoom-chip .btn:hover{background:var(--surface-3)}.frame-app .zoom-chip .btn.active{background:var(--ink);color:var(--bg)}.frame-app .zoom-chip .btn.active:hover{background:var(--ink)}.frame-app .page-tabs{position:absolute;left:20px;bottom:14px;display:inline-flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;box-shadow:0 2px 8px #0a0a0a0d;z-index:11;max-width:calc(100% - 200px);overflow:auto}.frame-app .page-tab{height:28px;padding:0 12px;border:0;background:transparent;border-radius:6px;display:inline-flex;align-items:center;gap:8px;font-size:11.5px;color:var(--mute);cursor:pointer;white-space:nowrap;transition:background .14s,color .14s}.frame-app .page-tab:hover{background:var(--surface-3);color:var(--ink)}.frame-app .page-tab.on{background:var(--ink);color:var(--bg)}.frame-app .page-tab.on .num{color:var(--mute-3)}.frame-app .page-tab .num{font-family:var(--font-mono);font-size:10px;color:var(--mute-3)}.frame-app .page-tab.add{color:var(--mute-2);border:1px dashed var(--hair)}.frame-app .page-tab.add:hover{border-color:var(--ink);color:var(--ink)}.frame-app .empty-inspector{display:grid;place-items:center;text-align:center;padding:40px 14px 20px;color:var(--mute)}.frame-app .empty-inspector lucide-icon{width:22px;height:22px;color:var(--mute-2);margin-bottom:12px}.frame-app .empty-inspector p{margin:0 0 6px;max-width:220px;line-height:1.5}.frame-app .field{margin-bottom:14px}.frame-app .field label{display:block;font-size:10.5px;color:var(--mute-2);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;font-weight:600}.frame-app .ctrl{height:32px;padding:0 10px;border:1px solid var(--hair);border-radius:8px;background:var(--surface);display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink);transition:border-color .14s,background .14s}.frame-app .ctrl:focus-within{border-color:var(--ink)}.frame-app .ctrl:has(input:disabled){opacity:.6;background:var(--hair);cursor:not-allowed}.frame-app .ctrl:has(input:disabled)>.mono{color:var(--mute)}.frame-app .ctrl input:disabled{cursor:not-allowed;color:var(--mute)}.inspector-actions{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--hair)}.inspector-actions .btn{flex:1;justify-content:center}.inspector-actions .danger{color:var(--danger, #b91c1c);border-color:color-mix(in srgb,var(--danger, #b91c1c) 40%,var(--hair))}.inspector-actions .danger:hover{background:color-mix(in srgb,var(--danger, #b91c1c) 8%,var(--surface));border-color:var(--danger, #b91c1c)}.frame-app .ai-bar{border-top:1px solid var(--hair);background:var(--surface);padding:0 20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}.frame-app .ai-star{width:32px;height:32px;border-radius:50%;border:1.5px solid var(--ink);background:var(--surface);display:grid;place-items:center;color:var(--ink)}.frame-app .ai-star lucide-icon{width:16px;height:16px}.frame-app .ai-star.pulse{animation:aiStarPulse 1.4s ease-in-out infinite}@keyframes aiStarPulse{0%,to{box-shadow:0 0 #0a0a0a00}50%{box-shadow:0 0 0 6px #0a0a0a14}}.frame-app .ai-input{height:40px;flex:1;border:1px solid var(--hair);border-radius:999px;background:var(--surface-2);display:flex;align-items:center;gap:10px;padding:0 16px;font-size:13px;transition:border-color .14s,background .14s}.frame-app .ai-input:focus-within{border-color:var(--ink);background:var(--surface);box-shadow:0 0 0 3px #0a0a0a0f}.frame-app .ai-input .prefix{color:var(--mute-2);font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em}.frame-app .ai-input input{border:0;outline:0;background:transparent;flex:1;color:var(--ink);font:inherit}@media(max-width:1600px){mk-editor{--comp-width: 240px;--insp-width: 260px}}@media(max-width:1440px){mk-editor{--comp-width: 220px;--insp-width: 240px}.frame-app .canvas-wrap .board-scroll{padding:48px 24px 72px}}@media(max-width:1280px){mk-editor{--comp-width: 208px;--insp-width: 228px}.frame-app .canvas-wrap .board-scroll{padding:44px 20px 68px}}@media(max-width:1100px){mk-editor{--comp-width: 200px;--insp-width: 220px;--rail-width: 44px}}@media(max-width:840px){mk-editor{--comp-width: 188px;--insp-width: 208px}.frame-app .presence .peer-count{display:none}}@media(max-height:800px){.frame-app{grid-template-rows:minmax(0,1fr) 48px}.frame-app .panel-head{height:38px}.frame-app .canvas-wrap .board-scroll{padding-top:40px;padding-bottom:64px}}.frame-app .el.is-button .btn-text{font-size:inherit;font-weight:500;color:inherit;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 4px;pointer-events:none}.frame-app .el.is-input .input-text{color:var(--mute-2);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;pointer-events:none}.frame-app .el.is-tag{justify-content:center;position:relative;background:transparent;border:none;border-radius:0;padding:0 10px 0 24px;isolation:isolate}.frame-app .el.is-tag .tag-shape{position:absolute;inset:0;background:#fcd34d;clip-path:polygon(18px 0%,100% 0%,100% 100%,18px 100%,0 50%);z-index:0;pointer-events:none}.frame-app .el.is-tag .tag-hole{position:absolute;left:6px;top:50%;width:6px;height:6px;border-radius:50%;background:var(--bg, #ffffff);box-shadow:0 0 0 1px var(--ink);transform:translateY(-50%);z-index:1;pointer-events:none}.frame-app .el.is-tag.selected{box-shadow:none}.frame-app .el.is-tag.selected .tag-shape{filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink))}.frame-app .el.is-tag .tag-text{font-family:var(--font-mono);font-size:inherit;color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;position:relative;z-index:2}.frame-app .el.is-heading .el-heading-text{display:block;width:100%;color:inherit;font:inherit;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.frame-app .el.is-icon{display:grid;place-items:center;color:var(--ink);gap:4px;grid-template-rows:1fr auto}.frame-app .el.is-icon .icon-glyph{display:block;width:100%;height:100%;min-height:0;min-width:0}.frame-app .el.is-icon .icon-glyph svg{width:100%;height:100%;display:block}.frame-app .el.is-icon .icon-label{font-size:11px;line-height:1.2;color:var(--ink);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.frame-app .el.is-list{color:var(--ink);font-size:13px;line-height:1.5;overflow:hidden;display:block}.frame-app .el.is-list .el-list-body{width:100%;height:100%;overflow:hidden}.frame-app .el.is-list .list-item{display:flex;gap:6px;align-items:baseline}.frame-app .el.is-list .list-item.level-1{padding-left:18px}.frame-app .el.is-list .list-item.level-2{padding-left:36px}.frame-app .el.is-list .bullet{flex:0 0 auto;font-size:1.1em;line-height:1;color:inherit}.frame-app .el.is-list .list-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:pre-wrap;overflow-wrap:break-word}.frame-app .el.is-list .el-list-edit{display:block;width:100%;height:100%;white-space:pre-wrap;overflow-wrap:break-word;tab-size:2;-moz-tab-size:2;overflow:auto;line-height:1.5;color:inherit}.frame-app .el.is-text .el-text-body{display:block;width:100%;height:100%;color:inherit;font-size:inherit;line-height:1.5;overflow:hidden;pointer-events:none;white-space:pre-wrap;overflow-wrap:break-word}.frame-app .el.is-link{display:flex;align-items:center;color:#1d4ed8}.frame-app .el.is-link .el-link-text{display:block;width:100%;color:inherit;font-size:inherit;line-height:1.4;text-decoration:underline;text-underline-offset:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.frame-app .el.is-divider{background:transparent!important;display:flex;align-items:center;justify-content:center;overflow:visible}.frame-app .el.is-divider:before{content:"";position:absolute;inset:-6px 0}.frame-app .el.is-divider.is-divider-v:before{inset:0 -6px}.frame-app .el.is-divider .divider-line{display:block;background:transparent;width:100%;height:0;border-top:1px solid var(--ink);pointer-events:none}.frame-app .el.is-divider.is-divider-v .divider-line{width:0;height:100%;border-top:0;border-left:1px solid var(--ink)}.frame-app .el .inline-editable.editing{pointer-events:auto;outline:none;cursor:text;-webkit-user-select:text;user-select:text;white-space:pre-wrap;overflow:visible;text-overflow:clip;caret-color:var(--ink);background:#0a0a0a0a;border-radius:2px;padding:0 2px;margin:0 -2px}.frame-app .el.editing{cursor:text}.frame-app .el.is-card{padding:0;overflow:hidden}.frame-app .el.is-card .el-card-body{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;gap:8px;pointer-events:none}.frame-app .el.is-card .el-card-head{padding:12px 14px 0;font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.frame-app .el.is-card .el-card-thumb{background:repeating-linear-gradient(-45deg,var(--hair) 0 6px,var(--surface-2) 6px 12px);min-height:40px;margin:0 14px;border-radius:3px}.frame-app .el.is-card .el-card-meta{padding:0 14px 12px;display:grid;gap:6px}.frame-app .el.is-card .el-card-title-line,.frame-app .el.is-card .el-card-meta-line{display:block;height:8px;background:var(--hair);border-radius:2px}.frame-app .el.is-card .el-card-meta-line{height:6px;width:60%}.frame-app .el.is-checkbox{display:flex;align-items:center;justify-content:center;gap:0;padding:0}.frame-app .el.is-checkbox .checkbox-mark{width:100%;height:100%;border:1.5px solid var(--ink);border-radius:3px;background:var(--surface);position:relative;pointer-events:none}.frame-app .el.is-checkbox .checkbox-mark:after{content:"";position:absolute;left:28%;top:10%;width:30%;height:55%;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)}.frame-app .el.is-checkbox.is-unchecked .checkbox-mark:after{display:none}.frame-app .el.is-toggle{display:flex;align-items:center;padding:2px;background:var(--ink);border-radius:999px;border:1px solid var(--ink);overflow:hidden;transition:background .12s ease,border-color .12s ease}.frame-app .el.is-toggle .toggle-knob{display:block;height:100%;aspect-ratio:1/1;margin-left:auto;border-radius:50%;background:var(--bg);pointer-events:none;transition:margin .12s ease}.frame-app .el.is-toggle.is-unchecked{background:var(--surface);border-color:var(--mute)}.frame-app .el.is-toggle.is-unchecked .toggle-knob{margin-left:0;margin-right:auto;background:var(--mute)}.frame-app .el.is-phone-frame{padding:6px}.frame-app .el.is-phone-frame .phone-body{width:100%;height:100%;background:var(--surface-2);border-radius:28px;position:relative;border:1px solid var(--hair);overflow:hidden;pointer-events:none}.frame-app .el.is-phone-frame .phone-notch{position:absolute;top:0;left:50%;transform:translate(-50%);width:35%;height:16px;background:var(--ink);border-radius:0 0 10px 10px}.frame-app .el.is-image{display:grid;place-items:center;overflow:hidden}.frame-app .el.is-image .image-stub{display:grid;place-items:center;color:var(--mute-2);pointer-events:none}.frame-app .el.is-image .image-src{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;-webkit-user-select:none;user-select:none;border-radius:inherit}.frame-app .el.is-nav .brand{font-family:var(--font-mono);font-weight:700;font-size:12px;color:var(--ink);letter-spacing:.04em;text-transform:uppercase;margin-right:8px}.frame-app .el.is-nav .login{font-weight:600;padding:4px 12px;border:1px solid var(--ink);border-radius:4px;color:var(--ink)}.frame-app .el .handle{position:absolute;width:10px;height:10px;background:var(--bg);border:1.5px solid var(--ink);border-radius:2px;box-shadow:0 1px 2px #0000001f;z-index:20;touch-action:none}.frame-app .el .handle:hover{background:var(--ink)}.frame-app .el .handle[data-dir=nw]{top:-6px;left:-6px;cursor:nwse-resize}.frame-app .el .handle[data-dir=n]{top:-6px;left:calc(50% - 5px);cursor:ns-resize}.frame-app .el .handle[data-dir=ne]{top:-6px;right:-6px;cursor:nesw-resize}.frame-app .el .handle[data-dir=e]{top:calc(50% - 5px);right:-6px;cursor:ew-resize}.frame-app .el .handle[data-dir=se]{bottom:-6px;right:-6px;cursor:nwse-resize}.frame-app .el .handle[data-dir=s]{bottom:-6px;left:calc(50% - 5px);cursor:ns-resize}.frame-app .el .handle[data-dir=sw]{bottom:-6px;left:-6px;cursor:nesw-resize}.frame-app .el .handle[data-dir=w]{top:calc(50% - 5px);left:-6px;cursor:ew-resize}.frame-app .el .rot-handle{position:absolute;top:-34px;left:calc(50% - 11px);width:22px;height:22px;background:var(--surface);border:1.5px solid var(--ink);border-radius:50%;display:grid;place-items:center;cursor:grab;z-index:21;color:var(--ink);box-shadow:0 2px 6px #0000002e;transition:background .12s,color .12s,transform .12s;touch-action:none}.frame-app .el .rot-handle:hover{background:var(--ink);color:var(--bg);transform:scale(1.1)}.frame-app .el .rot-handle:active{cursor:grabbing}.frame-app .el .rot-handle lucide-icon{pointer-events:none}.frame-app .el.selected:before{content:"";position:absolute;top:-12px;left:calc(50% - 1px);width:1px;height:12px;background:var(--ink);opacity:.4;pointer-events:none;z-index:19}.frame-app .board .marquee-rect{position:absolute;pointer-events:none;z-index:17;border:1px dashed var(--ink, #0a0a0a);background:#0a0a0a0f}.frame-app .board .guide{position:absolute;pointer-events:none;z-index:16;background:#f43f5e}.frame-app .board .guide.vertical{width:1px}.frame-app .board .guide.horizontal{height:1px}.frame-app .board .grid-overlay{position:absolute;inset:0;pointer-events:none;z-index:1}.frame-app .board .grid-col{position:absolute;top:0;bottom:0;background:#f43f5e0f;border-left:1px dashed rgba(244,63,94,.4);border-right:1px dashed rgba(244,63,94,.4)}.frame-app .page-tabs .page-tab-wrap{position:relative;display:inline-flex;align-items:center}.frame-app .page-tabs .page-tab-wrap.has-del .page-tab{padding-right:28px}.frame-app .page-tabs .page-del{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:18px;height:18px;display:grid;place-items:center;background:transparent;border:0;border-radius:4px;padding:0;cursor:pointer;color:var(--mute-2);z-index:2;opacity:0;pointer-events:none;transition:opacity .18s ease,background .14s ease,color .14s ease}.frame-app .page-tabs .page-tab-wrap:hover .page-del,.frame-app .page-tabs .page-tab-wrap:focus-within .page-del{opacity:1;pointer-events:auto}.frame-app .page-tabs .page-del:hover{background:var(--danger, #b91c1c);color:var(--bg)}.frame-app .page-tabs .page-del:focus-visible{outline:2px solid var(--focus);outline-offset:1px;opacity:1;pointer-events:auto}.frame-app .page-tabs .page-del lucide-icon{pointer-events:none}.frame-app .page-tabs .page-tab-wrap:has(.page-tab.on) .page-del{color:var(--mute-3)}.frame-app .page-tabs .page-tab-wrap:has(.page-tab.on) .page-del:hover{color:var(--bg)}.frame-app .panel-body .grid-section{margin-top:12px;padding-top:16px;border-top:1px solid var(--hair)}.frame-app .panel-sub{font-size:10.5px;color:var(--mute-2);text-transform:uppercase;letter-spacing:.08em;font-weight:600;margin-bottom:12px}.frame-app .toggle-row{display:flex;margin-bottom:10px}.frame-app .grid-field .ctrl input,.frame-app .field .ctrl input{border:0;background:transparent;outline:none;color:var(--ink);font:inherit;flex:1;min-width:0;width:100%;appearance:textfield;-moz-appearance:textfield}.frame-app .field .ctrl input[type=number]::-webkit-inner-spin-button,.frame-app .field .ctrl input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}.frame-app .field .ctrl .font-select{border:0;background:transparent;outline:none;color:var(--ink);font:inherit;flex:1;min-width:0;width:100%;cursor:pointer}.frame-app .field .two{display:grid;grid-template-columns:1fr 1fr;gap:6px}.frame-app .rotation-field>label{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.frame-app .rotation-field .rotation-value{color:var(--mute);font-weight:500}.frame-app .slider{position:relative;padding:6px 0 20px}.frame-app .slider input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:4px;background:var(--hair);border-radius:999px;outline:none;cursor:pointer;margin:0}.frame-app .slider input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--bg);box-shadow:0 1px 3px #00000040;cursor:grab;transition:transform .12s ease}.frame-app .slider input[type=range]::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.15)}.frame-app .slider input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--bg);box-shadow:0 1px 3px #00000040;cursor:grab}.frame-app .slider input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--focus, var(--ink));outline-offset:2px}.frame-app .slider-ticks{position:relative;height:14px;margin-top:6px;pointer-events:none}.frame-app .slider-ticks span{position:absolute;top:0;transform:translate(-50%);font-size:9px;font-weight:500;color:var(--mute-2);letter-spacing:.02em;font-variant-numeric:tabular-nums;white-space:nowrap}.frame-app .slider-ticks span:before{content:"";position:absolute;top:-6px;left:50%;transform:translate(-50%);width:1px;height:4px;background:var(--hair)}.frame-app .slider-ticks span.minor:before{height:3px;background:var(--mute-3, #d4d4d8)}.frame-app .slider-ticks span.edge-start{transform:translate(0)}.frame-app .slider-ticks span.edge-start:before{left:0;transform:translate(0)}.frame-app .slider-ticks span.edge-end{transform:translate(-100%)}.frame-app .slider-ticks span.edge-end:before{left:auto;right:0;transform:translate(0)}.frame-app .inspector-actions .btn{height:30px;padding:0 12px;border:1px solid var(--hair);border-radius:6px;background:var(--surface);color:var(--ink);font-size:12px;cursor:pointer;transition:background .14s,border-color .14s,color .14s}.frame-app .inspector-actions .btn:hover{background:var(--surface-3);border-color:var(--ink)}.frame-app .inspector-actions .btn.danger{color:var(--danger, #b91c1c);border-color:color-mix(in srgb,var(--danger, #b91c1c) 40%,var(--hair))}.frame-app .inspector-actions .btn.danger:hover{background:var(--danger, #b91c1c);border-color:var(--danger, #b91c1c);color:var(--bg)}.frame-app .panel.layers .panel-body.layers-body{padding:6px 6px 10px}.frame-app .layer-row{position:relative;display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;cursor:grab;-webkit-user-select:none;user-select:none;font-size:12.5px;color:var(--ink);border:1px solid transparent;transition:background .12s ease,border-color .12s ease}.frame-app .layer-row.dragging{opacity:.4}.frame-app .layer-row.drop-above:before,.frame-app .layer-row.drop-below:after{content:"";position:absolute;left:4px;right:4px;height:2px;background:var(--ink);border-radius:2px;pointer-events:none;z-index:1}.frame-app .layer-row.drop-above:before{top:-1px}.frame-app .layer-row.drop-below:after{bottom:-1px}.frame-app .layer-row.drop-above:before,.frame-app .layer-row.drop-below:after{box-shadow:0 0 0 2px #0000}.frame-app .layer-row.drop-above:before{box-shadow:-3px 0 0 0 var(--ink)}.frame-app .layer-row.drop-below:after{box-shadow:-3px 0 0 0 var(--ink)}.frame-app .layer-row:hover{background:var(--surface-3)}.frame-app .layer-row.selected{background:var(--surface-3);border-color:var(--ink)}.frame-app .layer-row:active{cursor:grabbing}.frame-app .layer-row.locked .layer-label{color:var(--mute)}.frame-app .layer-drag{width:12px;height:12px;display:inline-grid;place-items:center;color:var(--mute-2);flex:0 0 auto}.frame-app .layer-icon{width:18px;height:18px;display:inline-grid;place-items:center;color:var(--mute);flex:0 0 auto}.frame-app .layer-label{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.frame-app .layer-lock{width:22px;height:22px;border:0;background:transparent;border-radius:4px;color:var(--mute-2);cursor:pointer;display:inline-grid;place-items:center;opacity:0;transition:opacity .14s ease,background .14s ease,color .14s ease}.frame-app .layer-row:hover .layer-lock,.frame-app .layer-row.selected .layer-lock,.frame-app .layer-row.locked .layer-lock{opacity:1}.frame-app .layer-lock:hover{background:var(--surface-2, rgba(0, 0, 0, .06));color:var(--ink)}.frame-app .layer-lock.on{color:var(--ink)}.frame-app .el.locked{cursor:default}.frame-app .el.locked.selected:after{content:"";position:absolute;inset:0;outline:1px dashed var(--mute);outline-offset:0;pointer-events:none}.frame-app .ctx-overlay{position:fixed;inset:0;z-index:80}.frame-app .ctx-menu{position:fixed;z-index:81;min-width:200px;background:var(--bg);border:1px solid var(--hair);border-radius:8px;box-shadow:0 12px 28px #0000001f;padding:4px;display:flex;flex-direction:column;font-size:12.5px}.frame-app .ctx-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 10px;border:0;background:transparent;border-radius:4px;cursor:pointer;text-align:left;color:var(--ink);font-size:12.5px}.frame-app .ctx-item:hover:not(:disabled){background:var(--surface-3)}.frame-app .ctx-item:disabled{opacity:.4;cursor:not-allowed}.frame-app .ctx-item.danger{color:var(--danger, #b91c1c)}.frame-app .ctx-item.danger:hover:not(:disabled){background:var(--danger, #b91c1c);color:var(--bg)}.frame-app .ctx-shortcut{color:var(--mute-2);font-size:11px}.frame-app .ctx-sep{height:1px;background:var(--hair);margin:4px 2px}.frame-app .level-row{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.frame-app .level-btn{appearance:none;border:1px solid var(--hair);background:var(--surface);color:var(--ink);border-radius:4px;padding:5px 0;font-size:11.5px;font-weight:600;cursor:pointer;transition:background .12s,border-color .12s,color .12s}.frame-app .level-btn:hover{border-color:var(--ink)}.frame-app .level-btn.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}.frame-app .color-row{display:flex;align-items:center;gap:6px}.frame-app .color-swatch{position:relative;width:24px;height:24px;border:1px solid var(--hair);border-radius:4px;overflow:hidden;cursor:pointer;flex:0 0 auto}.frame-app .color-swatch input[type=color]{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;cursor:pointer}.frame-app .color-chip{display:block;width:100%;height:100%}.frame-app .color-swatch.empty{background:linear-gradient(45deg,transparent 46%,#d4d4d8 46% 54%,transparent 54%),repeating-conic-gradient(#fff 0 25%,#f1f1f3 0 50%) 0 0/8px 8px}.frame-app .color-swatch.empty .color-chip{background:transparent!important}.frame-app .color-palette{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin-top:8px}.frame-app .palette-chip{appearance:none;width:100%;aspect-ratio:1/1;min-width:0;border:1px solid var(--hair);border-radius:4px;padding:0;cursor:pointer;transition:transform .12s ease,outline-offset .12s ease}.frame-app .palette-chip:hover{transform:scale(1.08)}.frame-app .palette-chip.active{outline:2px solid var(--ink);outline-offset:1px;border-color:var(--ink)}.frame-app .palette-chip.none{background:linear-gradient(45deg,transparent 46%,#d4d4d8 46% 54%,transparent 54%),#fff}.frame-app .color-hex{flex:1;min-width:0;border:1px solid var(--hair);border-radius:4px;padding:5px 8px;font-size:11.5px;background:var(--surface);color:var(--ink)}.frame-app .color-hex:focus{outline:1px solid var(--ink);outline-offset:-1px}.frame-app .btn.ghost.xs{width:24px;height:24px;padding:0;display:inline-grid;place-items:center;border-radius:4px}.frame-app .seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--hair);border-radius:6px;overflow:hidden;background:var(--surface)}.frame-app .seg.seg-3{grid-template-columns:1fr 1fr 1fr}.frame-app .seg-btn{appearance:none;border:0;background:transparent;color:var(--ink);padding:6px 0;font-size:12px;cursor:pointer;transition:background .12s,color .12s}.frame-app .seg-btn+.seg-btn{border-left:1px solid var(--hair)}.frame-app .seg-btn:hover{background:var(--surface-3)}.frame-app .seg-btn.active{background:var(--ink);color:var(--bg)}.frame-app .panel.images{border-right:1px solid var(--hair)}.frame-app .panel.images.collapsed{transform:translate(-8px)}.frame-app .panel-body.images-body{display:flex;flex-direction:column;gap:8px}.frame-app .images-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:4px}.frame-app .images-tile{position:relative;border:1px solid var(--hair);border-radius:8px;overflow:hidden;cursor:pointer;padding:0;background:var(--surface-2);aspect-ratio:1/1;display:block;transition:border-color .14s,box-shadow .14s,transform .14s}.frame-app .images-tile:hover{border-color:var(--ink);box-shadow:0 2px 8px #0a0a0a14}.frame-app .images-tile:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.frame-app .images-tile.disabled{cursor:not-allowed;opacity:.55}.frame-app .images-tile img{width:100%;height:100%;object-fit:cover;display:block}.frame-app .images-tile-credit{position:absolute;left:0;right:0;bottom:0;padding:6px 8px;font-size:10.5px;color:#fff;background:linear-gradient(transparent,#0000008c);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .14s}.frame-app .images-tile:hover .images-tile-credit,.frame-app .images-tile:focus-visible .images-tile-credit{opacity:1}.frame-app .images-sentinel{height:1px;width:100%}.frame-app .images-error{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--hair);border-radius:8px;background:var(--surface-2);color:var(--ink);font-size:12.5px}.frame-app .images-error .btn{margin-left:auto}.frame-app .images-attribution{margin:10px 2px 0;color:var(--mute-2)}.frame-app .images-attribution a{color:inherit;text-decoration:underline}.frame-app .image-field .image-preview{border:1px solid var(--hair);border-radius:8px;overflow:hidden;aspect-ratio:16/10;background:var(--surface-2);margin-bottom:6px}.frame-app .image-field .image-preview img{width:100%;height:100%;object-fit:cover;display:block}.frame-app .image-field .image-credit{margin:0 0 8px;line-height:1.45}.frame-app .image-field .image-credit a{color:inherit;text-decoration:underline}.frame-app .image-field .image-actions{display:flex;gap:6px;flex-wrap:wrap}.frame-app .image-field .image-actions .btn{display:inline-flex;align-items:center;gap:6px}mk-landing .bootstrap{min-height:100vh;display:grid;place-items:center;gap:16px}mk-landing .bootstrap .mark{width:40px;height:40px;border:1px solid var(--ink);border-radius:8px;display:grid;place-items:center;font-weight:600;font-size:18px}mk-landing .muted{color:var(--mute)}mk-landing .page{overflow-x:hidden}mk-landing .eyebrow{margin:0 0 16px;font-size:11.5px;letter-spacing:.14em;font-weight:600;color:var(--mute-2);text-transform:uppercase}mk-landing .h1{margin:0 0 24px;font-family:var(--display);font-size:clamp(28px,2.7vw,36px);font-weight:900;line-height:1.08;letter-spacing:-.035em;color:var(--ink);text-transform:uppercase}mk-landing .h2{margin:0 0 20px;font-family:var(--display);font-size:clamp(32px,4vw,52px);font-weight:900;line-height:1.05;letter-spacing:-.01em;color:var(--ink);text-transform:uppercase}mk-landing .lede{margin:0;font-size:17px;line-height:1.65;color:var(--mute);max-width:560px}mk-landing .btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:18px 36px;font-family:var(--display);font-size:14px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:2px solid transparent;border-radius:2px;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,color .16s ease}mk-landing .btn--primary{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:6px 6px #0a0a0a24}mk-landing .btn--primary:hover{transform:translate(-2px,-2px);box-shadow:10px 10px #0a0a0a2e}mk-landing .btn--primary:active{transform:translate(2px,2px);box-shadow:2px 2px #0a0a0a24}mk-landing .btn--link{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--ink);padding:8px 4px;border-bottom:1px solid var(--ink);transition:color .16s ease,border-color .16s ease}mk-landing .btn--link:after{content:"\2192";font-weight:900;font-size:15px;transition:transform .16s ease}mk-landing .btn--link:hover{color:var(--mute);border-color:var(--mute)}mk-landing .btn--link:hover:after{transform:translate(4px)}mk-landing .btn--arrow:after{content:"\2192";font-weight:900;font-size:16px;transition:transform .16s ease}mk-landing .btn--arrow:hover:after{transform:translate(4px)}mk-landing .btn--lg{padding:24px 48px;font-size:15px;letter-spacing:.14em}mk-landing .nav{position:sticky;top:0;z-index:10;background:#ffffffe0;-webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--hair)}mk-landing .nav__inner{max-width:var(--page-max);margin:0 auto;padding:18px var(--gutter);display:flex;align-items:center;gap:32px}mk-landing .nav__brand{font-family:var(--display);font-size:14px;font-weight:900;letter-spacing:.2em;color:var(--ink);text-decoration:none}mk-landing .nav__links{display:flex;gap:28px;margin-left:8px}mk-landing .nav__links a{font-size:14px;color:var(--mute);text-decoration:none}mk-landing .nav__links a:hover{color:var(--ink)}mk-landing .nav__cta{margin-left:auto;padding:10px 22px;font-size:12px;letter-spacing:.14em;box-shadow:4px 4px #0a0a0a24}mk-landing .nav__cta:hover{box-shadow:6px 6px #0a0a0a2e}mk-landing .hero{padding:72px 0 96px}mk-landing .hero__inner{max-width:var(--page-max);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:minmax(480px,1.65fr) minmax(280px,1fr);gap:48px;align-items:center}mk-landing .hero__copy{min-width:0}mk-landing .hero__ctas{display:flex;align-items:center;gap:28px;margin-top:40px}mk-landing .hero__mock{min-width:0}mk-landing .mock{background:#fff;border:1px solid var(--hair);box-shadow:0 30px 60px -32px #0003,0 8px 20px -8px #00000014;overflow:hidden;border-radius:6px}mk-landing .mock__chrome{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--hair);background:var(--alt)}mk-landing .mock__dot{width:9px;height:9px;border-radius:50%;background:var(--hair)}mk-landing .mock__url{margin-left:12px;font-family:var(--MkApp-fontFamily-mono);font-size:11px;color:var(--mute)}mk-landing .mock__body{display:grid;grid-template-columns:140px 1fr;min-height:360px}mk-landing .mock__palette{border-right:1px solid var(--hair);padding:16px 12px;display:flex;flex-direction:column;gap:6px;background:#fff}mk-landing .mock__palette-group{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute-2);margin-bottom:6px}mk-landing .mock__palette-item{padding:8px 10px;font-size:12px;border:1px solid var(--hair);border-radius:3px;color:var(--ink);background:#fff}mk-landing .mock__palette-item.is-active{background:var(--ink);color:#fff;border-color:var(--ink)}mk-landing .mock__canvas{position:relative;padding:24px;background:linear-gradient(to right,var(--hair) 1px,transparent 1px) 0 0/20px 20px,linear-gradient(to bottom,var(--hair) 1px,transparent 1px) 0 0/20px 20px,#fff}mk-landing .mock__prompt{display:inline-flex;align-items:center;gap:8px;font-family:var(--MkApp-fontFamily-mono);font-size:11px;color:var(--mute);background:#fff;border:1px solid var(--hair);padding:6px 10px;border-radius:3px;margin-bottom:16px}mk-landing .mock__prompt-dot{width:6px;height:6px;border-radius:50%;background:var(--ink);animation:pulse 1.8s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.25}}mk-landing .mock__frame{background:#fff;border:1px solid var(--ink);padding:16px;display:flex;flex-direction:column;gap:10px}mk-landing .mock__frame-title{height:14px;width:40%;background:var(--ink)}mk-landing .mock__frame-row{display:flex;gap:8px}mk-landing .mock__frame-field{flex:1;height:28px;border:1px solid var(--hair)}mk-landing .mock__frame-field--full{width:100%}mk-landing .mock__frame-cta{height:32px;width:120px;background:var(--ink);align-self:flex-start}mk-landing .mock__cursor{position:absolute;display:flex;align-items:center;gap:6px;pointer-events:none;font-size:11px;color:#fff}mk-landing .mock__cursor:before{content:"";width:0;height:0;border-left:7px solid var(--ink);border-top:4px solid transparent;border-bottom:4px solid transparent;transform:rotate(-35deg);margin-right:2px}mk-landing .mock__cursor span{background:var(--ink);padding:2px 8px;border-radius:2px;font-weight:500}mk-landing .mock__cursor--alt:before{border-left-color:var(--mute)}mk-landing .mock__cursor--alt span{background:var(--mute)}mk-landing .features{padding:96px 0;background:var(--alt);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}mk-landing .features__inner{max-width:var(--page-max);margin:0 auto;padding:0 var(--gutter)}mk-landing .features__heading{max-width:640px;margin-bottom:56px}mk-landing .features__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:48px 40px}mk-landing .feature{padding-right:16px}mk-landing .feature__icon{width:36px;height:36px;display:grid;place-items:center;color:var(--ink);margin-bottom:18px}mk-landing .feature__icon svg{width:26px;height:26px}mk-landing .feature__title{margin:0 0 8px;font-family:var(--display);font-size:19px;font-weight:900;letter-spacing:.01em;color:var(--ink);text-transform:uppercase}mk-landing .feature__body{margin:0;font-size:15px;line-height:1.6;color:var(--mute)}mk-landing .how{padding:96px 0}mk-landing .how__inner{max-width:var(--page-max);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}mk-landing .steps{list-style:none;margin:40px 0 0;padding:0;display:grid;gap:28px}mk-landing .step{display:grid;grid-template-columns:48px 1fr;gap:20px;align-items:baseline}mk-landing .step__num{font-family:var(--MkApp-fontFamily-mono);font-size:12px;letter-spacing:.1em;color:var(--mute-2)}mk-landing .step__body h3{margin:0 0 6px;font-family:var(--display);font-size:18px;font-weight:900;letter-spacing:.01em;color:var(--ink);text-transform:uppercase}mk-landing .step__body p{margin:0;font-size:15px;color:var(--mute);line-height:1.55}mk-landing .how__visual{display:grid;gap:18px;justify-items:stretch;padding:36px;background:var(--alt);border:1px solid var(--hair);border-radius:4px}mk-landing .how__chip{font-family:var(--MkApp-fontFamily-mono);font-size:13px;color:var(--ink);background:#fff;border:1px solid var(--hair);padding:18px 20px;border-radius:3px;text-align:left;position:relative}mk-landing .how__chip--active{background:var(--ink);color:#fff;border-color:var(--ink)}mk-landing .how__cursor{position:absolute;right:18px;top:14px;font-family:var(--MkApp-fontFamily-sans)}mk-landing .how__arrow{text-align:center;font-size:20px;color:var(--mute-2)}mk-landing .cta{padding:120px 0;background:var(--ink);color:#fff;text-align:center}mk-landing .cta__inner{max-width:720px;margin:0 auto;padding:0 var(--gutter);display:grid;gap:20px;justify-items:center}mk-landing .cta .eyebrow{color:#a3a3a3}mk-landing .cta .h2{color:#fff;margin:0}mk-landing .cta .lede{color:#d4d4d4}mk-landing .cta .btn--primary{background:#fff;color:var(--ink);border-color:#fff;margin-top:8px;box-shadow:6px 6px #ffffff24}mk-landing .cta .btn--primary:hover{box-shadow:10px 10px #ffffff38}mk-landing .cta .btn--primary:active{box-shadow:2px 2px #ffffff24}mk-landing .foot{border-top:1px solid var(--hair);padding:32px 0}mk-landing .foot__inner{max-width:var(--page-max);margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;gap:32px;flex-wrap:wrap;font-size:13px;color:var(--mute)}mk-landing .foot__brand{color:var(--ink);font-weight:600}mk-landing .foot__links{display:flex;gap:20px}mk-landing .foot__links a{color:var(--mute);text-decoration:none}mk-landing .foot__links a:hover{color:var(--ink)}mk-landing .foot__tagline{margin-left:auto}@media(max-width:960px){mk-landing .hero{padding:56px 0 72px}mk-landing .hero__inner{grid-template-columns:1fr;gap:48px}mk-landing .features__grid{grid-template-columns:repeat(2,1fr);gap:40px 32px}mk-landing .how__inner{grid-template-columns:1fr;gap:56px}}@media(max-width:640px){mk-landing{--gutter: 20px}mk-landing .nav__links{display:none}mk-landing .hero__ctas{flex-wrap:wrap}mk-landing .features__grid{grid-template-columns:1fr;gap:40px}mk-landing .mock__body{grid-template-columns:110px 1fr;min-height:320px}mk-landing .cta{padding:80px 0}mk-landing .foot__inner{flex-direction:column;align-items:flex-start;gap:16px}mk-landing .foot__tagline{margin-left:0}}:root{color-scheme:light;--MkApp-color-bg: #ffffff;--MkApp-color-surface: #ffffff;--MkApp-color-surface-2: #fafafa;--MkApp-color-surface-3: #f5f5f5;--MkApp-color-ink: #0a0a0a;--MkApp-color-ink-2: #171717;--MkApp-color-mute: #525252;--MkApp-color-mute-2: #737373;--MkApp-color-mute-3: #a3a3a3;--MkApp-color-hair: #e5e5e5;--MkApp-color-hair-2: #f0f0f0;--MkApp-color-focus: #0a0a0a;--MkApp-color-danger: #b91c1c;--MkApp-color-warn: #b45309;--MkApp-color-ok: #065f46;--MkApp-fontFamily-sans: "Inter", "SF Pro Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--MkApp-fontFamily-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--MkApp-fontFamily-display: "Inter", "SF Pro Display", system-ui, sans-serif;--MkApp-fontSize-xxsmall: 10px;--MkApp-fontSize-xsmall: 11px;--MkApp-fontSize-small: 12px;--MkApp-fontSize: 13px;--MkApp-fontSize-button: 12px;--MkApp-fontSize-heading5: 14px;--MkApp-fontSize-heading4: 16px;--MkApp-fontSize-heading3: 20px;--MkApp-fontSize-heading2: 24px;--MkApp-fontSize-heading1: 28px;--MkApp-fontSize-display: 40px;--MkApp-fontWeight: 400;--MkApp-fontWeight-button: 500;--MkApp-fontWeight-xxsmall: 400;--MkApp-fontWeight-small: 400;--MkApp-fontWeight-heading5: 500;--MkApp-fontWeight-heading4: 500;--MkApp-fontWeight-heading3: 600;--MkApp-fontWeight-heading2: 600;--MkApp-fontWeight-heading1: 600;--MkApp-fontWeight-display: 600;--MkApp-spacing-1: 4px;--MkApp-spacing-2: 8px;--MkApp-spacing-3: 12px;--MkApp-spacing-4: 16px;--MkApp-spacing-5: 20px;--MkApp-spacing-6: 24px;--MkApp-spacing-8: 32px;--MkApp-spacing-10: 40px;--MkApp-radius-sm: 4px;--MkApp-radius: 6px;--MkApp-radius-lg: 10px;--MkApp-radius-pill: 999px;--MkApp-size-topbar: 48px;--MkApp-size-control: 28px;--MkApp-size-control-sm: 22px;--MkApp-size-control-lg: 36px;--MkApp-size-input: 32px;--MkApp-border-hairline: 1px solid var(--MkApp-color-hair);--MkApp-border-hairline-2: 1px solid var(--MkApp-color-hair-2);--MkApp-border-ink: 1px solid var(--MkApp-color-ink);--MkApp-shadow-sm: 0 1px 0 rgba(0, 0, 0, .04);--MkApp-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .04);--MkApp-shadow-lg: 0 8px 24px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .06);--MkApp-zIndex-topbar: 20;--MkApp-zIndex-popup: 40;--MkApp-zIndex-contentOverlay: 60;--MkApp-zIndex-modal: 80;--bg: var(--MkApp-color-bg);--surface: var(--MkApp-color-surface);--surface-2: var(--MkApp-color-surface-2);--surface-3: var(--MkApp-color-surface-3);--ink: var(--MkApp-color-ink);--ink-2: var(--MkApp-color-ink-2);--mute: var(--MkApp-color-mute);--mute-2: var(--MkApp-color-mute-2);--mute-3: var(--MkApp-color-mute-3);--hair: var(--MkApp-color-hair);--hair-2: var(--MkApp-color-hair-2);--focus: var(--MkApp-color-focus);--font-sans: var(--MkApp-fontFamily-sans);--font-mono: var(--MkApp-fontFamily-mono);--font-display: var(--MkApp-fontFamily-display);--radius-sm: var(--MkApp-radius-sm);--radius: var(--MkApp-radius);--radius-lg: var(--MkApp-radius-lg);--shadow-sm: var(--MkApp-shadow-sm);--shadow: var(--MkApp-shadow);--shadow-lg: var(--MkApp-shadow-lg)}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--MkApp-color-surface);color:var(--MkApp-color-ink);font-family:var(--MkApp-fontFamily-sans);font-size:var(--MkApp-fontSize);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;height:100%}body{min-height:100vh}mk-root,#root{display:contents}a{color:inherit;text-decoration:none}button{font:inherit;background:none;border:0;color:inherit;cursor:pointer;padding:0}input,textarea{font:inherit;color:inherit}input:focus,textarea:focus{outline:none}.btn{height:28px;padding:0 12px;border-radius:6px;border:1px solid var(--hair);background:var(--surface);display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink);transition:background .12s ease,border-color .12s ease;white-space:nowrap}.btn:hover{background:var(--surface-3)}.btn.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}.btn.primary:hover{background:var(--ink-2)}.btn.ghost{border-color:transparent;background:transparent}.btn.ghost:hover{background:var(--surface-3)}.btn.sm{height:22px;padding:0 8px;font-size:11px}.btn.lg{height:36px;padding:0 16px;font-size:13px}.btn[disabled]{opacity:.5;cursor:not-allowed}.input{height:32px;padding:0 10px;border:1px solid var(--hair);border-radius:6px;background:var(--surface-2);font-size:13px;color:var(--ink);width:100%;transition:border-color .12s,background .12s}.input:focus{border-color:var(--ink);background:var(--surface)}.input-lg{height:40px;font-size:14px}.label{font-size:10.5px;color:var(--mute-2);text-transform:uppercase;letter-spacing:.06em;font-weight:500;display:block;margin-bottom:6px}.label--no-margin{margin-bottom:0}.toggle{display:inline-flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:12.5px;color:var(--ink)}.toggle input[type=checkbox]{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.toggle-switch{position:relative;display:inline-block;width:32px;height:18px;border-radius:999px;background:var(--mute-3, #d4d4d8);transition:background .16s ease;flex:0 0 auto}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0000002e;transition:transform .16s ease}.toggle input[type=checkbox]:checked+.toggle-switch{background:var(--ink)}.toggle input[type=checkbox]:checked+.toggle-switch:after{transform:translate(14px)}.toggle input[type=checkbox]:focus-visible+.toggle-switch{outline:2px solid var(--focus, var(--ink));outline-offset:2px}.toggle input[type=checkbox]:disabled+.toggle-switch{opacity:.5;cursor:not-allowed}.field{display:grid;gap:6px;margin-bottom:14px}.topbar{height:48px;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:280px 1fr auto;align-items:center;padding:0 14px;gap:16px;background:var(--surface)}.brand{display:flex;align-items:center;gap:8px;font-weight:600;letter-spacing:-.01em}.brand .mark{width:22px;height:22px;border-radius:5px;background:var(--ink);display:grid;place-items:center;color:var(--bg);font-size:11px;font-weight:700}.breadcrumb{display:flex;align-items:center;gap:6px;color:var(--mute);font-size:12.5px;min-width:0}.breadcrumb strong{color:var(--ink);font-weight:500}.breadcrumb .sep{color:var(--mute-3)}.breadcrumb .pill{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border:1px solid var(--hair);border-radius:999px;font-size:11px;color:var(--mute);background:var(--surface)}.topbar-actions{display:flex;align-items:center;gap:10px}.avatar{width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--bg);display:grid;place-items:center;font-size:10px;font-weight:600;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--hair);-webkit-user-select:none;user-select:none}.avatar.alt{background:var(--surface);color:var(--ink);border-color:var(--surface);box-shadow:0 0 0 1px var(--ink)}.avatar.bot{background:var(--surface-3);color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.avatars{display:inline-flex}.avatars .avatar+.avatar{margin-left:-6px}.rail{width:44px;background:var(--surface);border-right:1px solid var(--hair);display:grid;grid-auto-flow:row;align-content:start;padding:10px 0;gap:4px;justify-items:center}.rail .ricon{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:var(--mute-2);cursor:pointer;text-decoration:none;background:none;border:none;padding:0}.rail .ricon:hover{background:var(--surface-3);color:var(--ink)}.rail .ricon.active{background:var(--ink);color:var(--bg)}.panel{background:var(--surface);display:grid;grid-template-rows:auto 1fr;min-height:0}.panel-head{height:40px;padding:0 14px;border-bottom:1px solid var(--hair);display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.02em;color:var(--mute);text-transform:uppercase;font-weight:500}.panel-body{padding:12px;overflow:auto}.search{height:30px;border:1px solid var(--hair);border-radius:6px;background:var(--surface-2);display:flex;align-items:center;gap:6px;padding:0 10px;color:var(--mute-2);font-size:12px}.search input{border:0;background:transparent;outline:none;flex:1;color:var(--ink);min-width:0}.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-16{gap:16px}.gap-20{gap:20px}.mute-2{color:var(--mute-2)}.small{font-size:11px}.tiny{font-size:10px}.mono{font-family:var(--font-mono)}.divider{height:1px;background:var(--hair);margin:8px 0}.hidden{display:none!important}.flex-1{flex:1}.grow{flex-grow:1}.center{display:grid;place-items:center}.kbd-inline{font-family:var(--font-mono);font-size:10px;padding:1px 5px;border:1px solid var(--hair);border-bottom-width:2px;border-radius:4px;background:var(--surface);color:var(--mute)}.tag{display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 6px;border:1px solid var(--hair);border-radius:3px;font-size:10.5px;color:var(--mute);background:var(--surface)}.tag.solid{background:var(--ink);color:var(--bg);border-color:var(--ink)}.i{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.i-18{width:18px;height:18px}.i-16{width:16px;height:16px}.i-14{width:14px;height:14px}.i-12{width:12px;height:12px}.i--block svg{display:block;width:100%;height:100%}.auth-frame{min-height:100vh;display:grid;place-items:center;padding:32px;background:radial-gradient(circle at 1px 1px,var(--hair) 1px,transparent 0) 0 0/16px 16px,var(--surface)}.auth-card{width:360px;padding:28px;background:var(--surface);border:1px solid var(--hair);border-radius:12px;box-shadow:var(--shadow-lg)}.auth-card h1{font-family:var(--font-display);font-size:22px;letter-spacing:-.01em;margin:8px 0 6px;font-weight:600}.auth-card p{margin:0 0 20px;color:var(--mute);font-size:13px}.auth-error{margin-top:10px;font-size:12px;color:#b91c1c}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.project-card{border:1px solid var(--hair);border-radius:10px;background:var(--surface);overflow:hidden;display:flex;flex-direction:column;transition:border-color .12s,transform .12s;cursor:pointer}.project-card:hover{border-color:var(--ink);transform:translateY(-2px)}.project-card .thumb{aspect-ratio:16/10;background:radial-gradient(circle at 1px 1px,var(--hair) 1px,transparent 0) 0 0/12px 12px,var(--surface-2);border-bottom:1px solid var(--hair);position:relative;overflow:hidden}.project-card .thumb .pane{position:absolute;inset:16%;background:var(--surface);border:1px solid var(--hair);border-radius:4px}.project-card .body{padding:14px 16px}.project-card .title{font-weight:600;font-size:14px;margin-bottom:4px}.project-card .meta{font-size:11.5px;color:var(--mute)}.frame-app{display:grid;grid-template-rows:1fr 52px;height:100%;min-height:0}.frame-main{display:grid;grid-template-columns:44px 280px 1fr 300px;min-height:0}.frame-main>.panel{min-width:0}.panel.components,.panel.inspector{border-right:1px solid var(--hair)}.panel.inspector{border-right:0;border-left:1px solid var(--hair)}.canvas-wrap{background:radial-gradient(circle at 1px 1px,var(--hair) 1px,transparent 0) 0 0/16px 16px,var(--surface-2);position:relative;overflow:auto}.board{width:880px;min-height:620px;background:var(--surface);border:1px solid var(--hair);border-radius:8px;box-shadow:var(--shadow);margin:40px auto;position:relative}.board.dragging{cursor:grabbing}.cat{margin-top:14px}.cat h4{margin:0 0 6px;font-size:10.5px;color:var(--mute-2);text-transform:uppercase;letter-spacing:.08em;font-weight:500}.cgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.ctile{border:1px solid var(--hair);border-radius:6px;height:64px;display:grid;grid-template-rows:1fr auto;padding:8px;background:var(--surface);cursor:grab;transition:border-color .12s;-webkit-user-select:none;user-select:none}.ctile:hover{border-color:var(--ink)}.ctile:active{cursor:grabbing}.ctile .preview{display:grid;place-items:center;color:var(--mute)}.ctile .label{font-size:10.5px;color:var(--mute);text-align:center}.ctrl{height:28px;padding:0 10px;border:1px solid var(--hair);border-radius:6px;background:var(--surface);display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink)}.ctrl input{border:0;outline:0;background:transparent;width:100%;min-width:0}.ctrl .prefix{font-family:var(--font-mono);font-size:11px;color:var(--mute)}.two{display:grid;grid-template-columns:1fr 1fr;gap:6px}.segment{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hair);border-radius:6px;overflow:hidden}.segment button{padding:6px 0;font-size:11.5px;color:var(--mute);border-right:1px solid var(--hair)}.segment button:last-child{border-right:0}.segment button.on{background:var(--ink);color:var(--bg)}.ai-bar{border-top:1px solid var(--hair);background:var(--surface);padding:0 16px;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px}.ai-input{height:36px;flex:1;border:1px solid var(--hair);border-radius:8px;background:var(--surface-2);display:flex;align-items:center;gap:10px;padding:0 12px;font-size:13px}.ai-input .prefix{color:var(--mute-2);font-family:var(--font-mono);font-size:11px}.ai-input input{border:0;outline:0;background:transparent;flex:1;color:var(--ink)}.ai-star{width:28px;height:28px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-family:var(--font-mono);font-size:12px}.ai-star.pulse:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--ink);animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(.6);opacity:.4}50%{transform:scale(1.1);opacity:1}}.el{position:absolute;-webkit-user-select:none;user-select:none;cursor:pointer}.el.selected{box-shadow:0 0 0 2px var(--ink);border-radius:3px}.el-label{position:absolute;top:-22px;left:-2px;background:var(--ink);color:var(--bg);font-size:10px;font-family:var(--font-mono);padding:2px 6px;border-radius:3px;white-space:nowrap;pointer-events:none}.el.is-rect{background:var(--surface);border:1px solid var(--ink);border-radius:3px}.el.is-circle{background:var(--surface);border:1px solid var(--ink);border-radius:50%}.el.is-icon{display:grid;place-items:center;color:var(--ink)}.el.is-list{color:var(--ink);display:flex;align-items:flex-start}.el.is-card{background:var(--surface);border:1px solid var(--ink);border-radius:6px;padding:14px;white-space:pre-wrap;font-size:12px;color:var(--ink);overflow:hidden}.el.is-text{color:var(--ink);display:flex;align-items:flex-start}.el.is-heading{font-family:var(--font-display);font-size:28px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}.el.is-button{background:var(--surface);border:1px solid var(--ink);color:var(--ink);border-radius:4px;display:grid;place-items:center;font-size:12px;font-weight:500;padding:0 14px}.el.is-button.is-btn-primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}.el.is-button.is-btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--ink)}.el.is-button.is-btn-tertiary{background:transparent;color:var(--ink);border:1px solid var(--hair)}.el.is-input{background:var(--surface-2);border:1px solid var(--hair);border-radius:4px;display:flex;align-items:center;padding:0 10px;color:var(--mute-2);font-size:12px}.el.is-image{background:repeating-linear-gradient(-45deg,var(--hair) 0 6px,var(--surface) 6px 12px);border:1px solid var(--hair);border-radius:3px}.el.is-nav{background:var(--surface);border:1px solid var(--ink);border-radius:6px;display:flex;align-items:center;padding:0 14px;gap:16px;font-size:12px;font-weight:500}.el.is-nav .spacer{flex:1}.el.is-phone-frame{background:var(--surface);border:1px solid var(--ink);border-radius:36px;padding:12px}.el.is-divider{background:var(--hair);height:1px}.el.is-tag{display:inline-flex;align-items:center;padding:0 8px;border:1px solid var(--ink);border-radius:3px;font-size:10.5px}.el.is-checkbox{display:flex;align-items:center;gap:6px}.el.is-checkbox .box{width:14px;height:14px;border:1px solid var(--ink);border-radius:2px}.el.is-toggle .pill{width:24px;height:14px;border:1px solid var(--ink);border-radius:8px;background:var(--ink);position:relative}.el.is-toggle .pill:after{content:"";position:absolute;right:2px;top:1px;width:10px;height:10px;border-radius:50%;background:var(--bg)}.remote-cursor{position:absolute;pointer-events:none;transform:translate(-2px,-2px);transition:transform 60ms linear;z-index:10}.remote-cursor .cursor-label{font-size:10px;font-family:var(--font-mono);background:var(--ink);color:var(--bg);padding:2px 6px;border-radius:3px;margin-left:10px;margin-top:-2px;display:inline-block}.remote-selection{position:absolute;pointer-events:none;border-radius:3px;z-index:2}.feed{padding:12px 14px;overflow-y:auto}.feed .item{display:grid;grid-template-columns:26px 1fr;gap:10px;padding:12px 0;border-top:1px solid var(--hair-2)}.feed .item:first-child{border-top:0;padding-top:6px}.feed .av{width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--bg);display:grid;place-items:center;font-size:10px;font-weight:600}.feed .head{display:flex;align-items:baseline;gap:6px;margin-bottom:3px}.feed .who{font-size:12px;font-weight:500}.feed .action{font-size:11.5px;color:var(--mute)}.feed .when{font-size:10.5px;color:var(--mute-3);margin-left:auto;font-family:var(--font-mono)}.feed .body{font-size:12px;color:var(--ink-2)}.reply-bar{border-top:1px solid var(--hair);padding:10px 14px;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;background:var(--surface)}.reply-bar input{height:30px;border:1px solid var(--hair);border-radius:6px;padding:0 10px;background:var(--surface-2);font-size:12px;outline:none}.dialog-scrim{position:fixed;inset:0;background:#0a0a0a5c;display:grid;place-items:center;z-index:100}.dialog{width:420px;max-width:calc(100vw - 40px);background:var(--surface);border:1px solid var(--ink);border-radius:10px;box-shadow:var(--shadow-lg);overflow:hidden}.dialog-head{padding:14px 18px;border-bottom:1px solid var(--hair);font-weight:600}.dialog-body{padding:18px}.dialog-foot{padding:14px 18px;border-top:1px solid var(--hair);display:flex;justify-content:flex-end;gap:8px;background:var(--surface-2)}.stack{display:flex;flex-direction:column;gap:12px}.el-card{width:100%;height:100%;display:grid;grid-template-rows:auto 1fr;gap:8px}.el-card-head{font-weight:600;font-size:13px}.el-card-body{color:var(--mute);font-size:11px}.el-heading{font-family:var(--font-display);font-size:inherit;font-weight:600}.el-text{font-size:12px;color:var(--ink)}.el.is-image .el-image{width:100%;height:100%;display:grid;place-items:center;color:var(--mute)}.el-image{width:100%;height:100%}.el.is-nav .brand{font-family:var(--font-mono);font-weight:600;margin-right:16px}.el.is-nav>span{color:var(--mute)}.el.is-nav>span:first-child{color:var(--ink)}.el.is-phone-frame .el-phone{width:100%;height:100%;border-radius:28px;border:1px solid var(--ink);position:relative;background:var(--surface-2)}.el.is-phone-frame .el-phone .notch{position:absolute;top:6px;left:50%;transform:translate(-50%);width:72px;height:12px;background:var(--ink);border-radius:6px}.el.is-checkbox{background:var(--surface);border:1px solid var(--ink);border-radius:2px}.el.is-checkbox .el-checkbox{width:100%;height:100%}.el.is-toggle{background:var(--ink);border:1px solid var(--ink);border-radius:999px;position:relative}.el.is-toggle .el-toggle{width:100%;height:100%;position:relative}.el.is-toggle .el-toggle .knob{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:calc(100% - 4px);height:calc(100% - 4px);max-width:16px;max-height:16px;aspect-ratio:1/1;border-radius:50%;background:var(--bg)}.el-table{width:100%;height:100%;display:grid;grid-template-rows:auto repeat(3,1fr);gap:4px;font-size:11px}.el-table .row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;padding:4px 6px;border-bottom:1px solid var(--hair-2);color:var(--mute);align-items:center}.el-table .row.head{color:var(--mute-2);text-transform:uppercase;font-size:10px;font-weight:500}.el.is-bar-chart{background:var(--surface);border:1px solid var(--hair);border-radius:4px;padding:8px;overflow:hidden}.el.is-donut{background:transparent;display:grid;place-items:center}.el.is-table{background:var(--surface);border:1px solid var(--hair);border-radius:4px;padding:8px;overflow:hidden}.ai-star{width:28px;height:28px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-family:var(--font-mono);font-size:12px;color:var(--ink)}.ai-star.pulse{animation:aiPulse 1.4s ease-in-out infinite}@keyframes aiPulse{0%,to{box-shadow:0 0 #0a0a0a00}50%{box-shadow:0 0 0 6px #0a0a0a0f}}.kbd-inline{font-family:var(--font-mono);font-size:10px;color:var(--mute-2);border:1px solid var(--hair);border-radius:4px;padding:1px 6px}.small{font-size:12px}.tiny{font-size:10.5px}.mute{color:var(--mute)}.page-tabs{position:absolute;left:24px;bottom:56px;display:flex;gap:2px}.page-tab{height:26px;padding:0 10px;border:1px solid var(--hair);background:var(--surface);border-radius:4px;display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--mute);cursor:pointer}.page-tab.on{color:var(--ink);border-color:var(--ink)}.page-tab .num{font-family:var(--font-mono);font-size:10px;color:var(--mute-3)}.zoom-chip{position:absolute;right:16px;bottom:16px;display:flex;gap:4px}.zoom-chip .btn{height:26px;padding:0 8px}.canvas-wrap{position:relative;overflow:auto;background:var(--bg);display:grid;place-items:start center;padding:40px}.comment-pin{position:absolute;z-index:20;display:flex;align-items:flex-start;gap:10px;pointer-events:auto}.comment-pin .marker{width:26px;height:26px;background:var(--ink, #0a0a0a);color:var(--bg, #fff);border-radius:50% 50% 50% 2px;display:grid;place-items:center;font-size:11px;font-weight:600;box-shadow:var(--shadow, 0 4px 12px rgba(0, 0, 0, .12));cursor:pointer;flex-shrink:0;-webkit-user-select:none;user-select:none}.comment-pin.resolved .marker{background:#e5e7eb;color:#9ca3af}.comment-pin .bubble{background:var(--surface, #fff);border:1px solid var(--ink, #0a0a0a);border-radius:10px;padding:10px 12px;box-shadow:var(--shadow, 0 4px 12px rgba(0, 0, 0, .12));font-size:12.5px;color:var(--ink, #0a0a0a);width:240px;display:none}.comment-pin.open .bubble{display:block}.comment-pin .bubble .author{font-weight:600;font-size:11px;display:flex;gap:6px;align-items:center;margin-bottom:4px}.comment-pin .bubble .author .t{color:var(--mute, #6b7280);font-weight:400;font-family:var(--font-mono, monospace);font-size:10px}.comment-pin .bubble .actions{display:flex;gap:10px;margin-top:8px;font-size:10.5px;color:var(--mute, #6b7280)}.comment-pin .bubble .actions button{background:none;border:none;padding:0;color:inherit;cursor:pointer;font:inherit;text-decoration:underline}.comment-draft{position:absolute;z-index:25;background:var(--surface, #fff);border:1px solid var(--ink, #0a0a0a);border-radius:10px;padding:8px;width:240px;box-shadow:var(--shadow, 0 4px 12px rgba(0, 0, 0, .12))}.comment-draft textarea{width:100%;border:none;resize:none;font:inherit;outline:none;min-height:48px}.comment-draft .draft-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:6px}.canvas-wrap.commenting{cursor:crosshair}.activity-feed{background:var(--surface, #fff);border:1px solid var(--hair, #eee);border-radius:12px;padding:14px 16px}.activity-feed h4{margin:0 0 10px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--mute, #6b7280)}.activity-feed ul{list-style:none;padding:0;margin:0}.activity-feed li{display:flex;gap:8px;align-items:center;padding:6px 0;font-size:12.5px;border-top:1px solid var(--hair, #eee)}.activity-feed li:first-child{border-top:0}.activity-feed .act-icon{width:22px;height:22px;border-radius:50%;background:#f3f4f6;display:grid;place-items:center;font-size:11px;color:var(--ink, #0a0a0a);flex-shrink:0}.activity-feed .act-who{font-weight:600;margin-right:4px}.activity-feed .act-when{color:var(--mute, #6b7280);margin-left:auto;font-family:var(--font-mono, monospace);font-size:10.5px}