.figma-clone-root{--fig-header-h:57px;--fig-surface:#fff;--fig-input-bg:#f3f3f3;--fig-input-bg-hover:#ececec;--fig-text:#333;--fig-text-2:#888;--fig-disabled:#ccc;--fig-border:#e6e6e6;--fig-border-2:#ececec;--fig-hover:#f0f0f0;--fig-active:#e5f4ff;--fig-accent:#0d99ff;--fig-danger:#f24822;--fig-danger-bg:#ffe9e4;background:var(--fig-surface);height:calc(100vh - 57px);color:var(--fig-text);-webkit-user-select:none;user-select:none;flex-direction:row;font-family:Inter,-apple-system,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-size:12px;display:flex;overflow:hidden}@supports (height:100dvh){.figma-clone-root{height:calc(100dvh - 57px)}}.fig-mobile-only{display:none!important}.figma-clone-root[data-theme=dark]{--fig-surface:#2c2c2c;--fig-input-bg:#383838;--fig-input-bg-hover:#404040;--fig-text:#fff;--fig-text-2:#9b9b9b;--fig-disabled:#666;--fig-border:#444;--fig-border-2:#4d4d4d;--fig-hover:#383838;--fig-active:#134d80;--fig-accent:#0d99ff;--fig-danger:#ff4d33;--fig-danger-bg:#4a201a}.figma-clone-root *,.figma-clone-root :before,.figma-clone-root :after{box-sizing:border-box}.fig-main-col{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex}.fig-main-row{flex:1;min-height:0;display:flex;position:relative}.fig-panel-layer{display:contents}.fig-panel-scrim{display:none}.fig-icon-btn{width:28px;height:28px;color:var(--fig-text);cursor:pointer;background:0 0;border:none;border-radius:6px;flex:none;justify-content:center;align-items:center;transition:background 80ms;display:inline-flex}.fig-icon-btn:hover:not(:disabled){background:var(--fig-hover)}.fig-icon-btn:disabled{color:var(--fig-disabled);cursor:default}.fig-icon-btn-active{color:var(--fig-accent);background:var(--fig-active)!important}.fig-icon-btn-danger:hover:not(:disabled){color:var(--fig-danger)}.fig-tool-btn{width:32px;height:32px;color:var(--fig-text);cursor:pointer;background:0 0;border:none;border-radius:6px;flex:none;justify-content:center;align-items:center;display:inline-flex}.fig-tool-btn:hover:not(:disabled){background:var(--fig-hover)}.fig-tool-btn:disabled{color:var(--fig-disabled);cursor:default}.fig-tool-btn-active{background:var(--fig-active);color:var(--fig-accent)}.fig-number-input{background:var(--fig-input-bg);height:24px;color:var(--fig-text);text-align:left;border:1px solid #0000;border-radius:4px;outline:none;min-width:0;padding:0 6px;font-size:11px}.fig-number-input:hover:not(:disabled){background:var(--fig-input-bg-hover)}.fig-number-input:focus{border-color:var(--fig-accent);background:var(--fig-surface)}.fig-number-input:disabled{color:var(--fig-disabled)}.fig-text-input{border:1px solid var(--fig-border);background:var(--fig-surface);height:24px;color:var(--fig-text);border-radius:4px;outline:none;min-width:0;padding:0 6px;font-size:11px}.fig-text-input:focus{border-color:var(--fig-accent)}.fig-swatch{cursor:pointer;border:1px solid #80808059;border-radius:3px;flex:none;width:16px;height:16px;padding:0;overflow:hidden}.fig-swatch>span{width:100%;height:100%;display:block}.fig-popover{background:var(--fig-surface);border-radius:8px;min-width:160px;padding:4px 0;position:absolute;top:22px;left:0;box-shadow:0 4px 16px #0000001f,0 0 0 1px #80808033}.figma-clone-root .fig-popover .react-colorful{width:160px;height:120px}.fig-select{border:1px solid var(--fig-border);background:var(--fig-surface);height:24px;color:var(--fig-text);border-radius:4px;outline:none;max-width:100%;padding:0 4px;font-size:11px}.fig-menu{background:var(--fig-surface);z-index:100;border-radius:8px;min-width:180px;padding:6px;position:fixed;box-shadow:0 6px 20px #00000026,0 0 0 1px #80808033}.fig-menu-item{width:100%;color:var(--fig-text);cursor:pointer;text-align:left;white-space:nowrap;background:0 0;border:none;border-radius:5px;justify-content:space-between;align-items:center;gap:16px;padding:5px 10px;font-size:12px;display:flex}.fig-menu-item:hover:not(:disabled){background:var(--fig-hover)}.fig-menu-item:disabled{color:var(--fig-disabled);cursor:default}.fig-menu-item-danger:hover:not(:disabled){background:var(--fig-danger-bg);color:var(--fig-danger)}.fig-menu-sep{background:var(--fig-border-2);height:1px;margin:5px 8px}.fig-menu-label{color:var(--fig-text-2);pointer-events:none;padding:5px 10px 2px;font-size:10px}.fig-menu-kbd{color:var(--fig-text-2);letter-spacing:.03em;font-size:10px}.fig-layer-row{cursor:default;border-radius:0;align-items:center;height:26px;padding-right:6px;display:flex;position:relative}.fig-layer-row:hover{background:var(--fig-hover)}.fig-layer-row-selected{background:var(--fig-active)}.fig-layer-row-selected:hover{background:var(--fig-active);filter:brightness(1.08)}.fig-layer-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--fig-text);flex:1;font-size:12px;overflow:hidden}.fig-layer-rename{border:1px solid var(--fig-accent);border-radius:3px;outline:none;flex:1;min-width:0;height:20px;padding:0 4px;font-size:12px}.fig-canvas-node{will-change:transform;position:absolute}.fig-canvas-node-unselected:hover{outline-offset:0;outline:1px solid #0d99ff99}.fig-node-content{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.fig-text-edit{cursor:text;-webkit-user-select:text;user-select:text;white-space:pre-wrap;word-break:break-word;outline:none;overflow:hidden}.fig-selection-handle{pointer-events:auto;z-index:5;background:#fff;border:1px solid #0d99ff;border-radius:2px;width:8px;height:8px;position:absolute}.fig-selection-handle:hover{background:#e5f4ff}.fig-guide-line{pointer-events:none;z-index:4;background:#ff3b6b;position:absolute}.figma-clone-root ::-webkit-scrollbar{width:8px;height:8px}.figma-clone-root ::-webkit-scrollbar-thumb{background:#80808073;border-radius:4px}.figma-clone-root ::-webkit-scrollbar-thumb:hover{background:#808080a6}.figma-clone-root ::-webkit-scrollbar-track{background:0 0}.fig-modal-overlay{z-index:200;background:#00000059;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.fig-modal{background:var(--fig-surface);color:var(--fig-text);border-radius:12px;padding:16px;font-size:12px;box-shadow:0 12px 40px #00000040}.fig-modal-title{margin-bottom:12px;font-size:13px;font-weight:600}.fig-export-row{align-items:center;gap:10px;margin-bottom:10px;display:flex}.fig-export-label{width:34px;color:var(--fig-text-2);flex:none}.fig-seg{border:1px solid var(--fig-border);border-radius:6px;flex:1;display:flex;overflow:hidden}.fig-seg-item{background:var(--fig-surface);color:var(--fig-text);cursor:pointer;border:none;border-right:1px solid var(--fig-border);flex:1;padding:5px 0;font-size:12px}.fig-seg-item:last-child{border-right:none}.fig-seg-item:disabled{color:var(--fig-disabled);cursor:default}.fig-seg-item-active{background:var(--fig-accent);color:#fff}.fig-export-meta{color:var(--fig-text-2);margin:10px 0 14px;font-size:11px}.fig-modal-footer{justify-content:flex-end;gap:8px;display:flex}.fig-btn{border:1px solid var(--fig-border);background:var(--fig-surface);color:var(--fig-text);cursor:pointer;border-radius:6px;padding:6px 14px;font-size:12px}.fig-btn:disabled{opacity:.5;cursor:default}.fig-btn-primary{background:var(--fig-accent);border-color:var(--fig-accent);color:#fff}@media (max-width:1023px){.fig-panel-layer{z-index:60;display:block;position:absolute;top:0;bottom:0}.fig-panel-layer-left{left:0}.fig-panel-layer-right{right:0}.fig-panel-layer-left>*{width:min(78vw,300px)!important;min-width:0!important;max-width:none!important}.fig-panel-layer-right>*{width:min(80vw,320px)!important;min-width:0!important;max-width:none!important}.fig-panel-layer>*{box-shadow:0 8px 32px #00000038;height:100%!important}.fig-panel-scrim{z-index:50;background:#0000004d;display:block;position:absolute;inset:0}[data-sidebar-handle]{display:none}.fig-toolbar{scrollbar-width:thin;overflow-x:auto}.fig-toolbar::-webkit-scrollbar{height:4px}}@media (max-width:767px){.figma-clone-root{--fig-header-h:63px;height:calc(100vh - 63px)}@supports (height:100dvh){.figma-clone-root{height:calc(100dvh - 63px)}}.fig-mobile-only{display:inline-flex!important}.fig-navbar{display:none!important}.figma-clone-root{--fig-bevel-hi:#fff;--fig-bevel-lo:#d7dde6;--fig-bevel-border:#b7c1cd;--fig-bevel-text:#39434f}.figma-clone-root[data-theme=dark]{--fig-bevel-hi:#4b525c;--fig-bevel-lo:#30363e;--fig-bevel-border:#171b20;--fig-bevel-text:#d7dfe7}.fig-toolbar{flex-wrap:wrap;gap:6px;overflow:visible;height:auto!important;max-height:none!important;padding:6px 10px!important}.fig-toolbar-spacer{display:none}.figma-clone-root .fig-tool-btn{border:1px solid var(--fig-bevel-border);background:linear-gradient(180deg,var(--fig-bevel-hi),var(--fig-bevel-lo));width:40px;height:40px;color:var(--fig-bevel-text);border-radius:11px;transition:transform 80ms,box-shadow 80ms,filter 80ms;box-shadow:0 2px #00000029,inset 0 1px #ffffffd9}.figma-clone-root .fig-tool-btn:hover:not(:disabled){background:linear-gradient(180deg,var(--fig-bevel-hi),var(--fig-bevel-lo));filter:brightness(1.04)}.figma-clone-root .fig-tool-btn:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 5px #00000038}.figma-clone-root .fig-tool-btn:disabled{background:linear-gradient(180deg,var(--fig-bevel-hi),var(--fig-bevel-lo));opacity:.45}.figma-clone-root .fig-tool-btn-active,.figma-clone-root .fig-tool-btn-active:hover:not(:disabled){border-color:#0b86e0;color:#fff!important;background:linear-gradient(#4db2ff,#0d99ff)!important}.figma-clone-root .fig-icon-btn{width:30px;height:30px}.fig-mb-bar{padding:8px 10px;padding-bottom:calc(8px + env(safe-area-inset-bottom));background:var(--fig-surface);border-top:1px solid var(--fig-border);scrollbar-width:none;flex:none;align-items:stretch;gap:8px;display:flex;overflow-x:auto}.fig-mb-bar::-webkit-scrollbar{display:none}.fig-mb-btn{border:1px solid var(--fig-bevel-border);background:linear-gradient(180deg,var(--fig-bevel-hi),var(--fig-bevel-lo));min-width:56px;height:48px;color:var(--fig-bevel-text);cursor:pointer;border-radius:12px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:3px;padding:0 12px;font-size:10px;font-weight:600;transition:transform 80ms,box-shadow 80ms;display:flex;box-shadow:0 3px #00000026,inset 0 1px #ffffffd9}.fig-mb-btn:active{transform:translateY(2px);box-shadow:inset 0 2px 5px #00000038}.fig-mb-btn-active{color:#fff;background:linear-gradient(#4db2ff,#0d99ff);border-color:#0b86e0}.fig-mb-sep{background:var(--fig-border);flex:none;width:1px;margin:4px 2px}.fig-menu{-webkit-overflow-scrolling:touch;max-height:calc(100dvh - 140px);overflow-y:auto}.fig-menu-item{padding:9px 10px}}
