:root{color-scheme:dark;--color-neutral-950: #161516;--color-neutral-900: rgba(22, 21, 22, .95);--color-neutral-900-soft: rgba(22, 21, 22, .92);--color-white: #efedf4;--color-white-02: rgba(239, 237, 244, .02);--color-white-03: rgba(239, 237, 244, .03);--color-white-04: rgba(239, 237, 244, .04);--color-white-05: rgba(239, 237, 244, .05);--color-white-06: rgba(239, 237, 244, .06);--color-white-08: rgba(239, 237, 244, .08);--color-white-10: rgba(239, 237, 244, .1);--color-white-12: rgba(239, 237, 244, .12);--color-white-14: rgba(239, 237, 244, .14);--color-white-18: rgba(239, 237, 244, .18);--color-white-20: rgba(239, 237, 244, .2);--color-white-26: rgba(239, 237, 244, .26);--color-white-30: rgba(239, 237, 244, .3);--color-white-35: rgba(239, 237, 244, .35);--color-white-45: rgba(239, 237, 244, .45);--color-white-55: rgba(239, 237, 244, .55);--color-white-65: rgba(239, 237, 244, .65);--color-white-70: rgba(239, 237, 244, .7);--color-white-85: rgba(239, 237, 244, .85);--color-success-500: #f085ff;--color-success-600: #d063e6;--color-warning-500: #f085ff;--color-warning-400: #f085ff;--color-danger-500: #ef4444;--color-info-500: #8255ff;--color-accent-500: #f085ff;--color-brand-purple-500: #8255ff;--color-brand-green-500: #f085ff;--color-pro-500: #8255ff;--color-pro-600: #6f46ed;--color-responsive-500: #ff7a00;--color-responsive-600: #e06600;--color-responsive-rgb: 255, 122, 0;--color-brand-green-rgb: 240, 133, 255;--color-brand-purple-rgb: 130, 85, 255;--ui-color-bg-canvas: var(--color-neutral-950);--ui-color-bg-panel: var(--color-white-03);--ui-color-bg-panel-strong: var(--color-white-04);--ui-color-bg-elevated: var(--color-white-06);--ui-color-bg-overlay: rgba(0, 0, 0, .7);--ui-color-bg-overlay-soft: rgba(0, 0, 0, .5);--ui-color-bg-solid: var(--color-neutral-900-soft);--ui-color-bg-solid-strong: var(--color-neutral-900);--ui-color-border-subtle: var(--color-white-08);--ui-color-border-default: var(--color-white-10);--ui-color-border-strong: var(--color-white-14);--ui-color-border-focus: var(--color-white-30);--ui-color-text: var(--color-white);--ui-color-text-muted: var(--color-white-45);--ui-color-text-faint: rgba(255, 255, 255, .22);--ui-color-text-soft: var(--color-white-65);--ui-color-text-inverse: var(--color-neutral-950);--ui-color-status-success: var(--color-brand-green-500);--ui-color-status-warning: var(--color-brand-green-500);--ui-color-status-danger: var(--color-danger-500);--ui-color-status-info: var(--color-brand-purple-500);--ui-color-status-pro: var(--color-brand-purple-500);--ui-font-family-sans: "Zalando Sans Expanded", system-ui, -apple-system, sans-serif;--ui-font-family-display: "Zalando Sans Expanded", system-ui, -apple-system, sans-serif;--ui-font-family-mono: "Zalando Sans Expanded", system-ui, -apple-system, sans-serif;--ui-font-size-label-xs: .625rem;--ui-font-size-label-sm: .6875rem;--ui-font-size-body-sm: .75rem;--ui-font-size-body-md: .8125rem;--ui-font-size-body-lg: .875rem;--ui-font-size-title-sm: 1rem;--ui-font-size-title-md: 1.125rem;--ui-font-size-title-lg: 1.5rem;--ui-font-weight-medium: 500;--ui-font-weight-semibold: 600;--ui-font-weight-bold: 700;--ui-letter-spacing-label: .06em;--ui-space-1: 4px;--ui-space-2: 6px;--ui-space-3: 8px;--ui-space-4: 10px;--ui-space-5: 12px;--ui-space-6: 14px;--ui-space-7: 16px;--ui-space-8: 20px;--ui-space-9: 24px;--ui-space-10: 32px;--ui-space-11: 40px;--ui-space-12: 48px;--ui-radius-1: 4px;--ui-radius-2: 6px;--ui-radius-3: 8px;--ui-radius-4: 10px;--ui-radius-5: 12px;--ui-radius-6: 14px;--ui-radius-soft: clamp(4px, .32em + .2vmin, 6px);--ui-radius-pill: var(--ui-radius-soft);--ui-radius-round: 50%;--ui-border-width: 1px;--ui-shadow-sm: 0 4px 16px rgba(0, 0, 0, .4);--ui-shadow-md: 0 8px 24px rgba(0, 0, 0, .45);--ui-shadow-lg: 0 12px 48px rgba(0, 0, 0, .5);--ui-shadow-xl: 0 16px 48px rgba(0, 0, 0, .6);--ui-shadow-2xl: 0 24px 80px rgba(0, 0, 0, .56);--ui-blur-md: blur(16px);--ui-duration-fast: .12s;--ui-duration-base: .2s;--ui-duration-slow: .3s;--ui-ease-standard: cubic-bezier(.16, 1, .3, 1);--ui-content-max: 680px;--ui-content-wide: 1120px;--ui-panel-width-sm: 320px;--ui-modal-width-md: 420px;--bg: var(--ui-color-bg-canvas);--surface: rgba(255, 255, 255, .025);--surface-up: var(--ui-color-bg-panel);--el: var(--ui-color-bg-panel);--el-up: var(--ui-color-bg-panel-strong);--el-hover: var(--ui-color-bg-panel-strong);--el-active: var(--ui-color-bg-elevated);--solid: var(--ui-color-bg-solid);--solid-up: var(--ui-color-bg-solid-strong);--border: var(--ui-color-border-subtle);--border-up: var(--ui-color-border-strong);--text: var(--ui-color-text);--text-dim: var(--ui-color-text-muted);--text-faint: var(--ui-color-text-faint);--glass-blur: var(--ui-blur-md);--font: var(--ui-font-family-sans);--font-display: var(--ui-font-family-display);--mono: var(--ui-font-family-mono);--r: var(--ui-radius-6);--r-sm: var(--ui-radius-3);--r-xs: var(--ui-radius-2)}*,*:before,*:after{box-sizing:border-box}html{color-scheme:dark}body{background:var(--ui-color-bg-canvas);color:var(--ui-color-text);font-family:var(--ui-font-family-sans);font-optical-sizing:auto}::selection{background:#ffffff26;color:var(--ui-color-text)}*{scrollbar-width:thin;scrollbar-color:var(--ui-color-border-subtle) transparent}::-webkit-scrollbar-thumb{background:var(--ui-color-border-subtle);background-clip:padding-box;border:3px solid transparent;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--ui-color-border-strong, rgba(255, 255, 255, .22));background-clip:padding-box}:where(button,input,select,textarea){font:inherit}:where(button){color:inherit}:where(input,textarea,select){background:var(--ui-color-bg-panel);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border-default);border-radius:var(--ui-radius-3);outline:none;transition:background var(--ui-duration-base),border-color var(--ui-duration-base),box-shadow var(--ui-duration-base),color var(--ui-duration-base)}:where(input,textarea,select):focus-visible{border-color:var(--ui-color-border-focus);background:var(--ui-color-bg-panel-strong);box-shadow:0 0 0 3px #ffffff14}:where(input,textarea,select)::placeholder{color:var(--ui-color-text-faint)}:where(select){-moz-appearance:none;appearance:none;-webkit-appearance:none;padding-right:28px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 4l3 3 3-3' stroke='rgba(255,255,255,0.4)' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;cursor:pointer}:where(option){background:var(--ui-color-bg-solid, #1a1a1e);color:var(--ui-color-text, #e0e0e0);padding:6px 10px}:where(option):checked{background:var(--ui-color-bg-panel-strong, #2a2a30)}:where(option):hover{background:var(--ui-color-bg-panel-strong, #2a2a30)}:where(button,[role=button],summary):focus-visible,:where(a):focus-visible{outline:2px solid rgba(255,255,255,.24);outline-offset:2px}:where(hr){border:0;border-top:var(--ui-border-width) solid var(--ui-color-border-subtle)}[hidden]{display:none!important}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:15px;-webkit-font-smoothing:antialiased}body{font-family:var(--font);font-optical-sizing:auto;background:var(--bg);color:var(--text);line-height:1.5;min-height:100vh}.hidden{display:none!important}[data-tip]{position:relative}[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(4px);padding:4px 10px;border-radius:6px;background:var(--solid);border:1px solid var(--border);color:var(--text);font-family:var(--font);font-size:.7rem;font-weight:400;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s,transform .25s cubic-bezier(.16,1,.3,1);z-index:100000}[data-tip]:hover:after{opacity:1;transform:translate(-50%) translateY(0)}[data-tip-below]:after{bottom:auto;top:calc(100% + 6px);transform:translate(-50%) translateY(-4px)}[data-tip-below]:hover:after{transform:translate(-50%) translateY(0)}[data-tip=""]:after{display:none!important}:root{--cur-default: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M201.163 133.54L201.149 133.528L201.134 133.515L91.6855 36.4935C86.5144 31.7659 81.4269 27.9549 76.5421 25.525C71.7671 23.1497 66.0861 21.5569 60.4133 23.1213C54.3118 24.8039 50.4875 29.4674 48.3639 34.759C46.3122 39.8715 45.4999 46.2787 45.4999 53.5383L45.4999 200.431V200.493L45.5008 200.555C45.6218 208.862 50.4279 217.843 55.9963 223.894C58.8934 227.043 62.5163 229.986 66.6704 231.742C70.9172 233.537 76.217 234.254 81.4691 231.884C85.7536 229.951 89.6754 226.055 92.8565 222.651C94.6841 220.695 96.8336 218.252 99.0355 215.749C100.71 213.847 102.414 211.91 104.03 210.126C112.189 201.122 121.346 192.286 132.161 187.407C143.013 182.511 155.809 181.375 167.963 181.146C170.959 181.089 173.85 181.087 176.65 181.085H176.663H176.686C179.447 181.083 182.164 181.081 184.662 181.019C189.231 180.906 194.643 180.609 198.777 178.88C208.711 174.723 210.972 163.838 210.753 156.445C210.521 148.596 207.57 139.272 201.163 133.54Z' fill='%23fff' stroke='%230e0e10' stroke-width='8'/%3E%3C/svg%3E") 5 3;--cur-pointer: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M120.654 226.56L209.928 225.982L220.035 124.547C222.154 103.987 196.764 95.4317 189.716 114.404C189.805 91.6041 166.436 88.7513 159.398 104.26C160.279 85.423 136.433 78.1324 129.079 94.1164V53.5431C129.079 23.1126 98.7605 23.1126 98.7605 53.5431V144.834C48.2297 94.1168 35.8398 130.561 35.8398 130.561C70.1776 153.83 91.1807 226.751 120.654 226.56Z' fill='%23fff' stroke='%230e0e10' stroke-width='8' stroke-linejoin='round'/%3E%3C/svg%3E") 9 2;--cur-text: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M127.93 223.209C136.047 229.785 146.386 233.751 157.637 233.751H163.861C170.212 233.751 175.361 228.603 175.361 222.251V209.684C175.361 203.333 170.212 198.184 163.861 198.184H157.637C151.115 198.184 145.654 192.795 145.654 186.021V69.2299C145.654 62.4559 151.115 57.0668 157.637 57.0668H163.861C170.212 57.0668 175.361 51.9181 175.361 45.5668V33C175.361 26.6487 170.212 21.5 163.861 21.5H157.637C146.386 21.5 136.047 25.4666 127.93 32.0427C119.813 25.4666 109.475 21.5 98.2233 21.5H91.9998C85.6485 21.5 80.4998 26.6487 80.4998 33V45.5668C80.4998 51.9181 85.6485 57.0668 91.9998 57.0668H98.2233C104.746 57.0668 110.207 62.4559 110.207 69.2299V186.021C110.207 192.795 104.746 198.184 98.2233 198.184H91.9998C85.6485 198.184 80.4998 203.333 80.4998 209.684V222.251C80.4998 228.603 85.6484 233.751 91.9998 233.751H98.2233C109.475 233.751 119.813 229.785 127.93 223.209Z' fill='%23fff' stroke='%230e0e10' stroke-width='8'/%3E%3C/svg%3E") 14 14;--cur-grab: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M131.161 29.4654C123.564 29.9227 117.078 37.2105 117.566 44.7415L121.494 112.736C121.69 116.132 118.607 116.829 118.171 114.234L107.597 51.3314C106.558 44.2169 99.4208 38.5277 92.1898 39.0503C84.2336 39.7593 77.8367 48.0202 79.1993 55.8246L93.7003 142.091C93.7496 143.308 93.9506 144.519 94.3044 145.685C93.7371 147.965 93.3986 149.579 93.3986 149.579C45.0621 101.653 33.28 136.1 33.28 136.1C66.1267 158.088 86.0504 226.74 114.244 226.56L199.738 226.26C199.738 226.26 202.925 158.636 209.104 134.004L223.605 76.193C225.925 67.3805 217.66 57.5471 208.499 58.221C202.303 58.5729 196.62 63.3112 195.207 69.3037L182.821 118.128C182.149 120.778 181.503 119.715 181.612 117.529L185.238 44.7419C185.767 36.6115 178.03 28.9402 169.83 29.4654C162.742 29.9001 156.519 36.2081 156.236 43.244L152.913 109.741C152.743 113.12 150.399 113.186 150.194 109.442L146.568 43.2444C146.262 35.6092 138.852 28.9826 131.161 29.4654Z' fill='%23fff' stroke='%230e0e10' stroke-width='8' stroke-linejoin='round'/%3E%3C/svg%3E") 12 7;--cur-grabbing: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M138.019 58.8846C133.638 54.856 127.743 52.4693 121.621 52.8519C113.738 53.3327 106.781 58.3167 103.207 65.0978C99.4171 62.8672 94.9982 61.7027 90.4943 62.0296L90.4231 62.0348L90.352 62.0411C83.8326 62.6245 78.3733 66.2379 74.8581 70.7949C71.355 75.3362 69.2441 81.5154 70.3437 87.9529L72.8497 103.546L71.8703 104.281C71.4687 104.582 71.0401 104.899 70.5893 105.233C66.353 108.368 60.1525 112.958 55.8777 119.277C50.6702 126.975 48.473 136.798 52.3513 149.075C56.3948 161.875 64.2957 175.615 72.9454 186.198C77.2856 191.508 82.0271 196.286 86.8381 199.81C91.423 203.168 97.1306 206.169 103.204 206.137C103.211 206.137 103.218 206.137 103.225 206.137L184.685 205.851L190.143 205.832L192.396 200.861C207.033 168.573 206.368 139.051 205.876 117.24C205.806 114.159 205.74 111.232 205.722 108.472V91.8606V91.8337L205.721 91.8068C205.683 85.7953 203.765 79.5047 200.044 74.6089C196.228 69.5891 190.094 65.6308 182.27 66.182C180.452 66.2918 178.671 66.637 176.963 67.1882C175.864 63.2435 173.673 59.7636 170.979 57.0826C166.804 52.9264 160.723 49.9915 153.986 50.4211C147.668 50.8142 141.894 54.0836 138.019 58.8846Z' fill='%23fff' stroke='%230e0e10' stroke-width='8'/%3E%3C/svg%3E") 12 10;--cur-zoom: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='117' cy='116' r='68' fill='%23fff' stroke='%230e0e10' stroke-width='8'/%3E%3Cline x1='165' y1='165' x2='218' y2='218' stroke='%230e0e10' stroke-width='14' stroke-linecap='round'/%3E%3Cline x1='87' y1='116' x2='147' y2='116' stroke='%230e0e10' stroke-width='8' stroke-linecap='round'/%3E%3Cline x1='117' y1='86' x2='117' y2='146' stroke='%230e0e10' stroke-width='8' stroke-linecap='round'/%3E%3C/svg%3E") 12 12;--cur-crosshair: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 256 256' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='128' y1='22' x2='128' y2='100' stroke='%230e0e10' stroke-width='16' stroke-linecap='round'/%3E%3Cline x1='128' y1='156' x2='128' y2='234' stroke='%230e0e10' stroke-width='16' stroke-linecap='round'/%3E%3Cline x1='22' y1='128' x2='100' y2='128' stroke='%230e0e10' stroke-width='16' stroke-linecap='round'/%3E%3Cline x1='156' y1='128' x2='234' y2='128' stroke='%230e0e10' stroke-width='16' stroke-linecap='round'/%3E%3Ccircle cx='128' cy='128' r='28' stroke='%230e0e10' stroke-width='16' fill='none'/%3E%3Cline x1='128' y1='22' x2='128' y2='100' stroke='%23fff' stroke-width='8' stroke-linecap='round'/%3E%3Cline x1='128' y1='156' x2='128' y2='234' stroke='%23fff' stroke-width='8' stroke-linecap='round'/%3E%3Cline x1='22' y1='128' x2='100' y2='128' stroke='%23fff' stroke-width='8' stroke-linecap='round'/%3E%3Cline x1='156' y1='128' x2='234' y2='128' stroke='%23fff' stroke-width='8' stroke-linecap='round'/%3E%3Ccircle cx='128' cy='128' r='28' stroke='%23fff' stroke-width='8' fill='none'/%3E%3Ccircle cx='128' cy='128' r='4' fill='%230e0e10'/%3E%3C/svg%3E") 14 14}*{cursor:var(--cur-default),auto!important}p,h1,h2,h3,h4,h5,h6,input[type=text],input[type=email],textarea,[contenteditable]{cursor:var(--cur-text),text!important}a,a *,button,button *,input[type=submit],input[type=submit] *,input[type=button],input[type=button] *,select,summary,summary *,[data-hover],[data-hover] *,.dock-item,.dock-item *,label,.paste-zone{cursor:var(--cur-pointer),pointer!important}.hero-bracket-l,.hero-bracket-r,.hero-icon,.hero-icon.dragging,.hero-icon.dragging *{cursor:var(--cur-pointer),pointer!important}::selection{background:#ffffff26}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent;margin:4px 0}::-webkit-scrollbar-thumb{background:var(--border);background-clip:padding-box;border:3px solid transparent;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#ffffff38;background-clip:padding-box}::-webkit-scrollbar-corner{background:transparent}h1,h2,h3,h4,h5,h6,.hero-title{font-family:var(--font-display);font-optical-sizing:auto}.app{display:flex;flex-direction:column;min-height:100vh}.app-header{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;padding:14px 20px;z-index:50}.header-spacer{flex:1}.app-logo{display:flex;align-items:center;transition:opacity .3s,transform .3s}.app-logo:hover{opacity:.96}.app-logo svg{overflow:visible}.logo-mark{transform-box:fill-box;transform-origin:center;transition:transform .3s,opacity .3s}.app-logo:hover .logo-mark{animation:logoMarkFloat .9s cubic-bezier(.45,0,.55,1) infinite}.app-logo:hover .logo-bracket-l{transform:translate(-1px)}.app-logo:hover .logo-bracket-r{transform:translate(1px)}@keyframes logoMarkFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.dock-wrap{position:fixed;bottom:calc(var(--footer-height) * 2);left:0;right:0;display:flex;justify-content:center;pointer-events:none;z-index:100}.dock-bar{display:flex;align-items:center;gap:2px;padding:6px 8px;background:var(--solid);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:16px;pointer-events:auto;box-shadow:0 8px 32px #00000073}.dock-item{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:10px;background:transparent;color:var(--text-dim);cursor:var(--cur-pointer),pointer!important;transition:background .2s,color .2s,border-radius .3s;will-change:width,height}.dock-item.active{color:var(--text);background:var(--el-up)}.dock-item.dock-hover{color:var(--text)}.dock-icon{display:flex;align-items:center;justify-content:center;width:60%;height:60%}.dock-icon svg{width:100%;height:100%}.dock-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(4px);padding:4px 10px;border-radius:6px;background:var(--solid);border:1px solid var(--border);color:var(--text);font-family:var(--font);font-size:.7rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .25s cubic-bezier(.16,1,.3,1),transform .4s cubic-bezier(.16,1,.3,1)}.dock-item.dock-hover .dock-tooltip{opacity:1;transform:translate(-50%) translateY(-6px)}.dock-sep{width:1px;height:24px;margin:0 4px;align-self:center;background:var(--border);flex-shrink:0}:root{--footer-height: 36px;--dock-height: 54px;--dock-overlay-gap: 12px;--above-dock: calc(var(--footer-height) * 2 + var(--dock-height) + var(--dock-overlay-gap))}.corner-links{position:fixed;bottom:0;left:0;right:0;height:var(--footer-height);padding:0 20px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:10}.corner-link{font-family:var(--font);font-size:.85rem;font-weight:600;letter-spacing:.15em;color:var(--text-faint);text-decoration:none;pointer-events:auto;transition:color .2s}.corner-link:hover{color:var(--text-dim)}.view{display:none;flex:1;align-items:center;justify-content:center;padding:80px 20px;overflow-y:auto}.view.active{display:flex}.view:focus{outline:none}.card{width:100%;max-width:740px;background:var(--ui-color-bg-canvas);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--border);border-radius:20px;padding:48px 40px;margin:0 auto}.card-sm{max-width:600px;padding:36px 32px}.hero-icon{display:flex;justify-content:center;color:var(--text);margin-bottom:24px}#heroLogo{overflow:visible}.hero-bracket-l,.hero-bracket-r{will-change:transform}.dock-icon-isotype svg{overflow:visible}.dock-icon-isotype .hero-bracket-l,.dock-icon-isotype .hero-bracket-r{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.dock-icon-isotype .hero-dot{transition:transform .4s cubic-bezier(.34,1.56,.64,1);transform-origin:32px 36px}.dock-item:hover .dock-icon-isotype .hero-bracket-l{transform:translate(-4.5px)}.dock-item:hover .dock-icon-isotype .hero-bracket-r{transform:translate(4.5px)}.dock-item:hover .dock-icon-isotype .hero-dot{transform:scale(1.35);animation:dock-dot-breathe 1.6s ease-in-out .4s infinite}@keyframes dock-dot-breathe{0%,to{transform:scale(1.35) translateY(0)}50%{transform:scale(1.35) translateY(-4px)}}.hero-title{display:flex;justify-content:center;text-align:center;margin-bottom:6px}.hero-logotype{display:block;height:32px;width:auto}.hero-sub{font-size:.82rem;color:var(--text-dim);text-align:center;margin-bottom:28px}.shortcut-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px}kbd{font-family:var(--font);font-size:.72rem;font-weight:500;color:var(--text-dim);background:none;border:1px solid var(--border);border-radius:var(--r-xs);padding:3px 10px;line-height:1.4}.shortcut-plus{color:var(--text-faint);font-size:.72rem}.section-title{font-size:.88rem;font-weight:600;margin-bottom:4px}.section-desc,.step-description{font-size:.78rem;color:var(--text-dim);margin-bottom:16px;line-height:1.5}.step-title{font-size:.88rem;font-weight:600;margin-bottom:4px}.label{font-size:.78rem;font-weight:500;margin-bottom:6px;display:block}textarea,input[type=text]{font-family:var(--mono);font-size:.8rem;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 14px;width:100%;resize:vertical;outline:none;transition:border-color .15s}textarea:focus,input[type=text]:focus{border-color:var(--border-up)}textarea::placeholder,input::placeholder{color:var(--text-faint)}.main-input{min-height:120px;border-radius:var(--r-sm)}.hero-input{text-align:center;min-height:44px;resize:none;border-radius:22px;padding:10px 20px;font-family:var(--font);font-size:.82rem;max-width:320px;margin:0 auto}.text-area{min-height:120px}select{font-family:var(--font);font-size:.75rem;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:var(--r-xs);padding:5px 8px;cursor:var(--cur-pointer),pointer!important;outline:none}select:focus{border-color:var(--border-up)}select option{background:var(--bg)}input[type=checkbox],input[type=radio]{accent-color:#fff}input[type=color]{width:24px;height:24px;border:1px solid var(--border);border-radius:var(--r-xs);background:none;cursor:var(--cur-pointer),pointer!important;padding:1px}button{font-family:var(--font);font-size:.78rem;font-weight:500;cursor:var(--cur-pointer),pointer!important;border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 16px;color:var(--text-dim);background:transparent;outline:none;position:relative;box-shadow:none;transition:border-color .15s,color .15s,background .15s}button:hover{color:var(--text);border-color:var(--border-up);background:var(--el-up)}button:active{background:var(--el-hover)}button:disabled{opacity:.25;cursor:not-allowed!important}.btn-primary{color:var(--text);border-color:var(--border-up);font-weight:600;background:var(--el-hover)}.btn-primary:hover{background:var(--el-active);border-color:#ffffff38}.btn-ghost{background:transparent;border-color:var(--border)}.btn-ghost:hover{background:var(--el-hover)}.btn-ghost:active{background:var(--el-up)}.btn-danger{background:transparent;border-color:#ffffff0f;color:var(--text-faint);box-shadow:none}.btn-danger:hover{border-color:var(--border);color:var(--text-dim);box-shadow:none;transform:none}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:none;border:1px solid var(--border);box-shadow:none}.btn-icon:hover{border-color:var(--border-up);box-shadow:none;transform:none}.buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.action-bar{display:flex;align-items:center;gap:10px;margin-top:20px;flex-wrap:wrap}details{border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden;background:transparent}details[open]{background:transparent}details summary{padding:10px 14px;font-size:.8rem;font-weight:500;color:var(--text-dim);cursor:var(--cur-pointer),pointer!important;-webkit-user-select:none;user-select:none;list-style:none;display:flex;align-items:center;gap:8px;transition:color .15s}details summary::-webkit-details-marker{display:none}details summary:before{content:"▸";font-size:.65rem;color:var(--text-faint);transition:transform .2s}details[open] summary:before{transform:rotate(90deg)}details summary:hover{color:var(--text)}.panel-body,details>div:not(summary){padding:14px;border-top:1px solid var(--border)}.context-panels{display:flex;flex-direction:column;gap:10px;margin-top:20px}.view-convert>.card.is-loaded{max-width:1800px;display:block;gap:20px}.converter-main{display:flex;flex-direction:column;gap:20px;min-width:0}.converter-main>*{min-width:0;box-sizing:border-box}@media (max-width: 1080px){.view-convert>.card.is-loaded{display:block}}@media (max-width: 720px){.converter-main{grid-template-columns:minmax(0,1fr)}}.pl-panel{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.pl-panel .pl-results{display:contents}.pl-panel>.pl-card{display:flex;flex-direction:column}@media (max-width: 1400px){.pl-panel{grid-template-columns:repeat(3,1fr)}}@media (max-width: 1080px){.pl-panel{grid-template-columns:repeat(2,1fr)}}@media (max-width: 720px){.pl-panel{grid-template-columns:1fr}}.pl-panel--bento{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;align-items:stretch;height:calc(100vh - var(--above-dock) - 140px);min-height:400px;overflow:hidden}.pl-bento__col{display:flex;flex-direction:column;gap:14px;min-width:0;min-height:0;align-items:stretch;overflow:hidden}.pl-bento__col>.pl-card{flex:0 0 auto;min-width:0}.pl-bento__col>.pl-card--grow{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.pl-card--pages-col.pl-card--grow{min-height:330px;padding-bottom:16px}.pl-bento__col:has(#conversionOutput.xscp-has-data) .pl-card--pages-col{flex-grow:0}.pl-bento__col .pl-card--xscp .json-preview{min-height:0}.pl-bento__col .pl-card.output-section{margin-top:0;padding-top:16px;border-top:none}.pl-bento__col>.pl-card--grow>.pl-card__body{flex:1;min-height:0}.pl-bento__col--empty{display:none}.pl-panel--bento>.pl-bento__col:nth-child(1){order:1}.pl-panel--bento>.pl-bento__col:nth-child(2){order:3}.pl-panel--bento>.pl-bento__col:nth-child(3){order:2}.pl-panel--bento>.pl-bento__col:nth-child(4){order:4}.pl-card--design .pl-card__body{overflow-y:auto;overflow-x:hidden}.conv-ds-sizes,.conv-ds-fonts{display:flex;flex-wrap:wrap;gap:8px}.conv-ds-sizes .conv-ds-more,.conv-ds-fonts .conv-ds-more{flex:1 1 100%}.conv-ds-size,.conv-ds-font{flex:1 1 calc(33.33% - 6px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:transparent;min-width:0;text-align:center}.conv-ds-font{font-size:.86rem;font-weight:600;color:#fff;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-ds-font:empty{display:none}.conv-ds-size-val{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.pl-card--design .pl-card__body>details{display:none!important}@media (max-width: 1200px){.pl-panel--bento{grid-template-columns:1fr 1fr;height:auto;min-height:0;overflow:visible}.pl-bento__col{overflow:visible}.pl-bento__col>.pl-card--grow{max-height:60vh}}@media (max-width: 640px){.pl-panel--bento{grid-template-columns:1fr}.pl-bento__col>.pl-card--grow{max-height:50vh}}.html-input-wrap{position:relative;display:flex;flex-direction:column;flex:1 1 auto;min-height:0}.pl-card--paste #htmlInput{width:100%;min-height:300px;padding:12px;background:var(--el-down, rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--r-sm);font-family:var(--mono);font-size:.7rem;resize:vertical;color:var(--text);position:relative;z-index:1}.pl-card--paste.pl-card--grow #htmlInput{flex:1 1 auto;min-height:0}.html-preview{display:none;position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:12px;background:var(--el-down, rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--r-sm);font-family:var(--mono);font-size:.7rem;line-height:1.6;white-space:pre-wrap;word-break:break-all;overflow:auto;transition:filter .15s,transform .1s;-webkit-user-select:none;user-select:none;z-index:2}.html-preview:hover{filter:brightness(1.06)}.html-preview:active{filter:brightness(.92);transform:scale(.995)}.html-input-wrap.has-content .html-preview{display:block}.html-input-wrap.is-focused .html-preview{display:none}.html-input-wrap.has-content:not(.is-focused) #htmlInput{color:transparent;caret-color:transparent;resize:none}.html-line{display:inline;background:#ffffffeb;color:#0a080ed9;border-radius:5px;padding:1px 5px;-webkit-box-decoration-break:clone;box-decoration-break:clone}.pl-card--load .pl-drop-zone{min-height:140px}.pl-card--load.pl-card--grow .pl-drop-zone{flex:1 1 auto;min-height:140px}.pl-card--pages-col #pageSelector{width:100%;display:flex;flex-direction:column;min-height:0}.pl-card--pages-col.pl-card--grow #pageSelector{flex:1 1 auto}.pl-card--pages-col #pageSelector .page-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:80px;gap:8px;min-height:0;overflow:hidden}.pl-card--pages-col #pageSelector .page-grid--stacked{grid-template-columns:1fr;grid-auto-rows:46px}.pl-card--pages-col #pageSelector .page-grid--previews{grid-auto-rows:160px}.pl-card--pages-col #pageSelector .pl-pager{flex:0 0 auto}.xscp-empty-state{flex:1 1 auto;display:flex;align-items:center;justify-content:center;color:var(--ui-color-text-muted);font-size:.82rem;font-weight:600;letter-spacing:.02em;min-height:180px}.pl-card--xscp.xscp-has-data .xscp-empty-state{display:none}.pl-card--xscp .json-preview{background:var(--color-brand-purple-500);border-color:transparent;color:var(--color-brand-purple-500);padding:14px 12px;transition:filter .15s,transform .1s;-webkit-user-select:none;user-select:none}.pl-card--xscp .json-preview:hover{filter:brightness(1.08)}.pl-card--xscp .json-preview:active{filter:brightness(.92);transform:scale(.995)}.json-line{display:inline;background:#0a080ee0;color:var(--color-brand-purple-500);border-radius:5px;padding:1px 5px;-webkit-box-decoration-break:clone;box-decoration-break:clone}.json-line--more,.html-line--more{opacity:.6;font-style:italic;cursor:zoom-in!important}.json-line--more:hover,.html-line--more:hover{opacity:1}.pl-card--xscp:not(.xscp-has-data) .json-preview,.pl-card--xscp:not(.xscp-has-data) #pureHtmlNotice,.pl-card--xscp:not(.xscp-has-data) .output-actions{display:none!important}.pl-card--xscp .json-preview{min-height:220px;max-height:clamp(240px,50vh,520px);overflow:auto;margin:0}.pl-card--xscp.pl-card--grow .json-preview{flex:1 1 auto}.pl-card--xscp .output-header{display:none}.pl-card--xscp .output-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-top:10px;border-top:1px solid rgba(0,0,0,.15);margin-top:4px}.pl-card--xscp .output-actions>button,.pl-card--xscp .output-actions>.sc-save-dropdown{width:100%}.pl-card--xscp .output-actions>button{padding:8px 12px!important}.pl-card--xscp .output-actions #copyConvertedJSON,.pl-card--xscp .output-actions #qaAuditBtn{grid-column:1 / -1}.pl-card--xscp .output-actions>.sc-save-dropdown{grid-column:1 / -1}.pl-card--design .ds-export-body{padding:0;gap:10px}.pl-card--design .ds-export-preview{margin:0;flex:0 0 auto}.pl-card--design .ds-export-controls{gap:6px}.ds-inferred-badge{display:inline-block;margin-left:6px;padding:1px 6px;font-size:.58rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--color-brand-green-500);background:rgba(var(--color-brand-green-rgb),.12);border:1px solid rgba(var(--color-brand-green-rgb),.3);border-radius:3px;vertical-align:middle}.pl-card--options .pl-card__body{max-height:520px;overflow-y:auto;gap:10px;font-size:.72rem}.pl-card--options label{display:flex;align-items:flex-start;gap:8px;color:var(--text-dim);line-height:1.35}.pl-card--options label>input[type=checkbox]{flex-shrink:0;margin-top:2px}.pl-card--options #nativeElementToggles{margin-left:22px}.pl-card--options #nativeElementToggles>div:first-child{color:var(--text-faint);font-size:.65rem;margin-bottom:6px}.pl-card--options #nativeElementToggles label{font-size:.68rem}.pl-card--deps{padding:0}.pl-card--deps .ext-deps-header{padding:10px 14px}.pl-bento__col .ext-deps.pl-card{margin-top:0}.pl-card--actions .pl-card__body{gap:10px;display:flex;flex-direction:column}.pl-card--actions .pl-actions-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}.pl-card--actions .pl-actions-row>button{width:100%;padding:10px 12px!important;font-size:.74rem!important}.pl-card--actions #convertActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:0;padding-top:10px;border-top:1px solid var(--border)}.pl-card--actions #convertActions>button:not(#convertHTML){grid-column:1 / -1}.pl-card--actions #convertActions #convertHTML{grid-column:1 / -1;background:var(--color-brand-green-500);color:var(--color-neutral-950);border-color:var(--color-brand-green-500);font-weight:700;font-size:.85rem!important;padding:14px 20px!important}.pl-card--actions #convertActions #convertHTML:hover{background:var(--color-success-600);border-color:var(--color-success-600)}.pl-card--actions #convertActions>button{width:100%;padding:10px 12px!important}.pl-card{background:var(--el-down, rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--r-sm);padding:16px;font-size:.78rem;min-height:0}.pl-card__title{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);margin-bottom:10px;flex-shrink:0}.pl-card__body{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px}.pl-card--scroll .pl-card__body{max-height:clamp(220px,36vh,420px);overflow-y:auto;padding-right:4px}.pl-card--scroll.pl-card--grow .pl-card__body{max-height:none}.pl-card--input{grid-column:1 / -1}.pl-card--pages{grid-column:span 2}@media (max-width: 1080px){.pl-card--pages{grid-column:1 / -1}}.pl-drop-zone{min-height:100px;border:1px dashed var(--border);border-radius:var(--r-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:var(--cur-pointer),pointer!important;padding:18px;background:transparent;transition:border-color .15s,background .15s;text-align:center}.pl-drop-zone:hover,.pl-drop-zone.is-dragover{border-color:var(--border-up);background:var(--el-up)}.pl-drop-zone__title{font-size:.82rem;font-weight:500;color:var(--text-dim)}.pl-drop-zone__hint{font-size:.68rem;color:var(--text-faint)}.pl-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;text-align:center;flex:1}.pl-stat{padding:16px 10px;border-radius:var(--r-sm);background:var(--el-up, rgba(255,255,255,.03));display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px}.pl-stat-num{font-size:28px;font-weight:700;color:var(--text);line-height:1}.pl-stat-label{font-size:.7rem;color:var(--text-faint)}.pl-bento__col:has(#dsExportSection.hidden) .pl-card--stats{flex:1 1 auto;display:flex;flex-direction:column}.pl-bento__col:has(#dsExportSection.hidden) .pl-stat-grid{grid-template-rows:1fr 1fr}.pl-actions-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.pl-actions-row>button{padding:8px 14px!important;font-size:.78rem!important}.pl-actions-row--utility{padding-bottom:10px;border-bottom:1px solid var(--border);margin-bottom:12px}.actions-tabs{margin-bottom:12px}.actions-tabs__bar{display:flex;width:100%}.actions-tabs__bar .mode-btn{flex:1}.actions-tab-pane{display:flex;flex-direction:column;gap:10px}.profile-controls{font-size:.68rem;color:var(--text-dim);padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-xs);display:flex;flex-direction:column;gap:8px;background:var(--color-white-04, rgba(255,255,255,.02))}.profile-controls__row{display:flex;align-items:center;gap:6px;cursor:pointer}.profile-controls__row>input[type=checkbox]{margin:0}.profile-controls__row>select{font-size:.68rem;padding:3px 8px;background:var(--color-white-04);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs)}.profile-controls__hint{color:var(--text-faint);opacity:.85;font-size:.62rem}.profile-controls__row--rename{align-items:flex-start}.profile-controls__rename-text{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.profile-controls__warning{font-size:.62rem;color:var(--text-faint);opacity:.9;line-height:1.45}.profile-controls__warning code{font-size:inherit;background:var(--color-white-04);padding:0 3px;border-radius:2px}.profile-controls__link{background:transparent;color:var(--color-brand-green-500);border:1px dashed rgba(var(--color-brand-green-rgb),.35);padding:3px 8px;border-radius:var(--r-xs);font-size:.62rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s}.profile-controls__link:hover{background:rgba(var(--color-brand-green-rgb),.06);border-color:rgba(var(--color-brand-green-rgb),.55)}.profile-controls__badge{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:var(--r-xs);font-size:.7rem;font-weight:500;background:var(--color-white-04);color:var(--text-dim);border:1px solid transparent}.profile-controls__badge--match{color:var(--color-brand-green-500);background:rgba(var(--color-brand-green-rgb),.06);border-color:rgba(var(--color-brand-green-rgb),.2)}.profile-controls__badge--forced{color:#8aa9ff;background:#8aa9ff0f;border-color:#8aa9ff2e}.profile-controls__badge--warn{color:#ffb86b;background:#ffb86b0f;border-color:#ffb86b33}.profile-controls__badge--neutral{color:var(--text-faint)}.profile-controls__badge-icon{flex:0 0 auto}.profile-controls__badge-text{flex:1;min-width:0}.ds-output-toggle-row{display:flex;align-items:center;gap:10px}.ds-output-toggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--r-xs);overflow:hidden}.ds-output-toggle .ds-output-btn{padding:5px 12px;border:none;border-radius:0;background:transparent;color:var(--text-faint);font-weight:500;font-size:.7rem;cursor:pointer;transition:color .15s,background .15s}.ds-output-toggle .ds-output-btn:hover{color:var(--text-dim);background:var(--el-hover)}.ds-output-toggle .ds-output-btn.active{color:var(--text);background:var(--el-up)}.ds-output-toggle-row .ds-export-select{flex:1;max-width:220px}.image-opts-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.image-opts-row label{display:inline-flex;align-items:center;gap:5px}.image-opts-row select{font-size:.68rem;padding:3px 8px;background:var(--color-white-04);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs)}.image-opts-row input[type=range]{width:90px;accent-color:var(--color-brand-green-500)}.image-opts-row #imageQualityValue{min-width:32px;font-variant-numeric:tabular-nums}.action-bar--secondary{display:flex;gap:8px;padding-top:4px}.action-bar--secondary>.btn-primary-soft{flex:1;background:var(--color-brand-green-500);color:var(--color-neutral-950);border:1px solid var(--color-brand-green-500);border-radius:var(--r-sm);font-weight:700;font-size:.85rem;padding:14px 20px;cursor:pointer;transition:background .15s,border-color .15s}.action-bar--secondary>.btn-primary-soft:hover{background:var(--color-success-600);border-color:var(--color-success-600)}.action-bar--secondary>.btn-primary-soft:disabled{opacity:.5;cursor:not-allowed}.pl-card--collection>summary{list-style:none;cursor:pointer}.pl-card--collection>summary::-webkit-details-marker{display:none}.pl-paste-expander{margin-top:10px;border:none;background:transparent}.pl-paste-expander>summary{font-size:.68rem;font-weight:500;color:var(--text-faint);cursor:pointer;padding:0}.pl-paste-expander>summary:hover{color:var(--text-dim)}.pl-paste-expander[open]>summary{color:var(--text-dim);margin-bottom:4px}.pl-pager{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}.pl-pager__info{font-size:.65rem;color:var(--text-faint);letter-spacing:.02em}.pl-pager__controls{display:flex;gap:4px}.pl-pager__btn{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px!important;min-width:26px;min-height:26px;line-height:1}.pl-card--pages .page-grid{gap:8px}.page-grid--stacked{grid-template-columns:1fr}.page-grid--stacked .page-card{flex-direction:row;gap:10px;text-align:left;padding:10px 12px;justify-content:flex-start;min-height:44px}.page-grid--stacked .page-card-icon{margin-bottom:0}.page-grid--stacked .page-card-name{font-size:.72rem}#pageSelector:not(:empty){background:var(--el-down, rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--r-sm);padding:14px 14px 10px}.paste-zone{border:1px dashed var(--border-up);border-radius:var(--r);padding:32px 20px;text-align:center;cursor:var(--cur-pointer),pointer!important;background:transparent;transition:border-color .15s,background .15s;-webkit-user-select:none;user-select:none}.paste-zone:hover,.paste-zone:focus{border-color:#ffffff38;outline:none}.paste-zone.active{border-color:#ffffff38}.paste-text{font-size:.88rem;font-weight:600;color:var(--text);margin-bottom:4px}.paste-hint{font-size:.75rem;color:var(--text-faint)}.hero-paste{padding:44px 20px;border-radius:var(--r)}.hero-paste .paste-hint{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px}.ignite-active{background:var(--bg)!important;padding:0!important;position:relative;overflow:hidden}.ignite-active:fullscreen,.ignite-active:-webkit-full-screen{max-width:none;width:100vw;height:100vh;border-radius:0;border:none;margin:0}.ignite-active:fullscreen .ignite-stage,.ignite-active:-webkit-full-screen .ignite-stage{min-height:100vh;border-radius:0}.ignite-stage{position:relative;width:100%;min-height:560px;background:var(--bg);overflow:hidden;border-radius:inherit;color:#fff;isolation:isolate;container-type:inline-size}.ignite-controls{position:absolute;top:14px;right:14px;display:flex;gap:6px;z-index:10}.ignite-ctrl{background:transparent;border:1px solid rgba(255,255,255,.18);border-radius:var(--r-xs);color:#ffffff8c;font-family:var(--mono);font-size:.65rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;cursor:pointer;transition:color .15s,border-color .15s,background .15s;display:inline-flex;align-items:center;justify-content:center;line-height:1}.ignite-ctrl:hover{color:#fff;border-color:#fff;background:#ffffff0a}.ignite-ctrl-fs,.ignite-ctrl-shuffle,.ignite-ctrl-copy,.ignite-ctrl-share{width:28px;height:28px;padding:0}.ignite-ctrl-fs svg,.ignite-ctrl-shuffle svg,.ignite-ctrl-copy svg,.ignite-ctrl-share svg{width:13px;height:13px;display:block}.ignite-ctrl.is-flashing{color:var(--color-brand-green-500);border-color:var(--color-brand-green-500)}.ignite-ctrl[data-flash]:after{content:attr(data-flash);position:absolute;top:calc(100% + 6px);right:0;padding:3px 7px;border-radius:var(--r-xs);background:var(--color-brand-green-500);color:#111;font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;pointer-events:none;animation:igniteFlashIn .18s ease-out}@keyframes igniteFlashIn{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}.ignite-ctrl{position:relative}.ignite-share{position:fixed;z-index:200000;width:240px;padding:12px;background:var(--solid, #1a1a1c);border:1px solid var(--border, rgba(255,255,255,.1));border-radius:var(--r-sm, 6px);font-family:var(--mono);font-size:.72rem;color:var(--text, #fff);box-shadow:0 12px 32px #0000008c;display:flex;flex-direction:column;gap:10px;animation:igniteDropdownIn .12s ease-out}.ignite-share-title{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:#fff6}.ignite-share-url{display:flex;gap:6px}.ignite-share-url input{flex:1 1 auto;min-width:0;background:#00000059;border:1px solid rgba(255,255,255,.15);border-radius:var(--r-xs);color:#fff;font-family:var(--mono);font-size:.68rem;padding:5px 7px;outline:none}.ignite-share-qr{display:flex;align-items:center;justify-content:center;min-height:168px}.ignite-share-qr-loading,.ignite-share-qr-fail{color:#fff6;font-size:.7rem;text-align:center;padding:20px}.ignite-share-hint{color:#ffffff59;font-size:.65rem;text-align:center}.ignite-center{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:24px;z-index:2;pointer-events:none}.ignite-code{font-family:var(--mono);font-size:2rem;font-weight:500;letter-spacing:0;color:#ffffffd9;text-align:center;line-height:1;-webkit-user-select:none;user-select:none;pointer-events:auto;white-space:nowrap;display:inline-block;font-variant-ligatures:none;-webkit-font-feature-settings:"liga" 0,"calt" 0;font-feature-settings:"liga" 0,"calt" 0}.ignite-fn{color:var(--color-brand-green-500);font-weight:600;cursor:pointer;outline:none;animation:ignitePulse 1.3s ease-in-out infinite}@keyframes ignitePulse{0%,to{opacity:1}50%{opacity:.55}}.ignite-fn:hover,.ignite-fn:focus-visible{animation:none;opacity:1;text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px}.ignite-punct,.ignite-quote{color:#ffffff59;font-weight:500}.ignite-tok{background:none;border:none;padding:0;margin:0;font:inherit;color:var(--color-brand-purple-500);cursor:pointer;position:relative;transition:color .1s}.ignite-tok:hover{text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px}.ignite-tok-pop{animation:igniteTokPop .18s ease-out}@keyframes igniteTokPop{0%{opacity:1}40%{opacity:.4}to{opacity:1}}.ignite-playground{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.ignite-shape{position:absolute;top:0;left:0;pointer-events:auto;cursor:pointer;will-change:transform;mix-blend-mode:var(--ignite-blend, normal)}.ignite-stage.is-bg-light{color:#111}.ignite-stage.is-bg-noise:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.25;mix-blend-mode:overlay;background-image:radial-gradient(rgba(255,255,255,.7) 1px,transparent 1px),radial-gradient(rgba(0,0,0,.35) 1px,transparent 1px);background-size:3px 3px,7px 7px;background-position:0 0,1px 2px;z-index:0}.ignite-slot{position:relative;display:inline;white-space:nowrap}.ignite-slot-plus{display:inline-flex;align-items:center;justify-content:center;margin-left:.15em;width:.9em;height:.9em;padding:0;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:transparent;color:#ffffff8c;font-family:var(--mono);font-size:.42em;line-height:1;cursor:pointer;opacity:0;transform:translateY(-.18em);transition:opacity .12s,color .12s,border-color .12s,background .12s;vertical-align:middle}.ignite-slot:hover .ignite-slot-plus,.ignite-slot-plus:focus-visible{opacity:1}.ignite-slot-plus:hover{color:#fff;border-color:#fff;background:#ffffff0f}.ignite-shape--text{font-family:var(--mono);font-weight:600;line-height:1;color:currentColor;white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;padding:0 2px;font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0}.ignite-toolbar{position:absolute;left:50%;bottom:8%;transform:translate(-50%);display:flex;align-items:center;gap:12px;padding:10px 14px;min-height:44px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:var(--r-sm);font-family:var(--mono);font-size:.78rem;color:#ffffffd9;z-index:3;max-width:90%;opacity:0;pointer-events:none;transition:opacity .15s;white-space:nowrap}.ignite-toolbar.is-visible{opacity:1;pointer-events:auto}.ignite-tool-label{color:#fff6;font-size:.65rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.ignite-tool-value{color:#fff;min-width:2.5ch;text-align:right;font-variant-numeric:tabular-nums}.ignite-tool-hint{color:#ffffff59;font-size:.7rem}.ignite-tool-hint b{color:#ffffffb3;font-weight:600}.ignite-tool-input{background:#00000059;border:1px solid rgba(255,255,255,.15);border-radius:var(--r-xs);color:#fff;font-family:var(--mono);font-size:.82rem;padding:5px 9px;width:260px;max-width:42vw;outline:none;transition:border-color .15s}.ignite-tool-input:focus{border-color:var(--color-brand-green-500)}.ignite-tool-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:160px;height:3px;background:#ffffff26;border-radius:2px;outline:none;cursor:pointer}.ignite-tool-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--color-brand-green-500);cursor:pointer;border:none}.ignite-tool-range::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--color-brand-green-500);cursor:pointer;border:none}.ignite-tool-swatch{display:inline-block;width:24px;height:24px;padding:0;border:1px solid rgba(255,255,255,.15);border-radius:6px;cursor:pointer;flex-shrink:0;transition:border-color .15s,transform .1s;outline:none;background-color:transparent;background-clip:padding-box}.ignite-tool-swatch:hover,.ignite-tool-swatch:focus-visible{border-color:#ffffff73;transform:scale(1.05)}.ignite-tool-btn{background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:var(--r-xs);color:#ffffff8c;font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;cursor:pointer;transition:color .15s,border-color .15s}.ignite-tool-btn:hover{color:#fff;border-color:#fff}.ignite-tok.is-active{text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:2px}.ignite-toolbar:has(.ignite-tool-chips){flex-direction:column;align-items:stretch;gap:8px}.ignite-tool-row{display:flex;align-items:center;gap:12px}.ignite-tool-chips{display:none;flex-wrap:wrap;gap:6px;max-width:100%}.ignite-tool-chips.is-visible{display:flex}.ignite-tool-chip{display:inline-flex;align-items:center;gap:2px;padding:3px 4px 3px 10px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:999px;font-family:var(--mono);font-size:.72rem;color:#ffffffe0;max-width:100%;overflow:hidden}.ignite-tool-chip-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:14ch}.ignite-tool-chip-x{width:18px;height:18px;padding:0;background:transparent;border:none;color:#fff6;cursor:pointer;border-radius:50%;font-size:1rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,background .15s}.ignite-tool-chip-x:hover{color:#fff;background:#ffffff1a}.ignite-dropdown{position:fixed;z-index:200000;min-width:180px;max-width:260px;padding:6px;background:var(--solid, #1a1a1c);border:1px solid var(--border, rgba(255,255,255,.1));border-radius:var(--r-sm, 6px);font-family:var(--mono);font-size:.78rem;color:var(--text, #fff);box-shadow:0 12px 32px #0000008c;animation:igniteDropdownIn .12s ease-out}@keyframes igniteDropdownIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.ignite-dropdown-item{display:block;width:100%;text-align:left;background:transparent;border:none;color:#ffffffd9;font-family:var(--mono);font-size:.78rem;padding:6px 10px;border-radius:var(--r-xs, 4px);cursor:pointer;transition:background .1s,color .1s}.ignite-dropdown-item:hover,.ignite-dropdown-item:focus-visible{background:#ffffff0f;color:#fff;outline:none}.ignite-dropdown-item.is-danger{color:#ff7878d9}.ignite-dropdown-item.is-danger:hover{background:#ff50501f;color:#ff9090}.ignite-dropdown-item b{color:#fff;font-weight:600}.ignite-dropdown-sep{height:1px;margin:4px 0;background:#ffffff14}.ignite-dropdown-cat{padding:6px 10px 2px;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:#ffffff59}.ignite-dropdown-empty{padding:10px;color:#ffffff73;font-size:.75rem;text-align:center}.ignite-trail{position:absolute;top:0;left:0;pointer-events:none;will-change:transform,opacity}.ignite-trail.ignite-shape--text{font-family:var(--mono);font-weight:600;line-height:1;white-space:nowrap}.json-preview{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-sm);padding:14px;font-family:var(--mono);font-size:.7rem;line-height:1.6;max-height:300px;overflow:auto;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;color:var(--text-dim);margin-bottom:14px;-webkit-user-select:text;user-select:text;cursor:var(--cur-text),text!important}.output-section{margin-top:24px;padding-top:24px;border-top:1px solid var(--border)}.output-header{font-weight:600;font-size:.82rem;margin-bottom:10px;color:var(--text)}.output-actions{display:flex;gap:8px;flex-wrap:wrap}.payload-grid{display:grid;gap:14px;margin-bottom:16px}.payload-card{border:1px solid var(--border);border-radius:var(--r-sm);padding:14px;background:transparent}.payload-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.payload-type{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-dim)}.payload-preview{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-xs);padding:10px;font-family:var(--mono);font-size:.65rem;max-height:220px;overflow:auto;white-space:pre-wrap;word-break:break-word;color:var(--text-dim);-webkit-user-select:text;user-select:text;cursor:var(--cur-text),text!important}.harvest-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:14px}.harvest-thumb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:72px;border:1px solid var(--border);border-radius:var(--r-sm);background:transparent;font-weight:600;font-size:.75rem;color:var(--text-dim);-webkit-user-select:none;user-select:none;position:relative;padding:10px;cursor:var(--cur-pointer),pointer!important;transition:border-color .15s}.harvest-thumb:hover{border-color:var(--border-up)}.harvest-subtitle{font-size:.65rem;font-weight:400;color:var(--text-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center}.harvest-name{font-size:.65rem;font-weight:400;color:var(--text);background:transparent;border:1px solid transparent;border-radius:var(--r-xs);text-align:center;width:100%;max-width:100%;padding:2px 4px;outline:none;text-overflow:ellipsis}.harvest-name:hover{border-color:var(--border)}.harvest-name:focus{border-color:var(--border-up);background:var(--bg-up)}.harvest-badge{font-size:.65rem;color:var(--text-dim)}.harvest-remove{position:absolute;top:5px;right:5px;width:18px;height:18px;border:1px solid var(--border);background:var(--bg);color:var(--text-faint);display:none;align-items:center;justify-content:center;font-size:11px;cursor:var(--cur-pointer),pointer!important;border-radius:var(--r-xs)}.harvest-thumb:hover .harvest-remove{display:flex}.harvest-remove:hover{color:var(--text);border-color:var(--border-up)}.harvest-actions{display:flex;gap:8px;margin-top:14px}.mode-toggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden}.mode-toggle .mode-btn{padding:7px 16px;border:none;border-radius:0;background:transparent;color:var(--text-faint);font-weight:500;font-size:.75rem;box-shadow:none;transition:color .15s,background .15s}.mode-toggle .mode-btn:hover{color:var(--text-dim);background:var(--el-hover);transform:none}.mode-toggle .mode-btn.active,.mode-toggle .mode-btn[style*="background: #000"],.mode-toggle .mode-btn[style*="background: rgb(0, 0, 0)"]{color:var(--text)!important;background:var(--el-up)!important}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;z-index:200;opacity:0;pointer-events:none;transition:opacity .3s}.drawer-overlay.open{opacity:1;pointer-events:auto}.drawer{position:fixed;top:0;right:0;width:min(560px,90vw);height:100vh;background:var(--el);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-left:1px solid var(--border);z-index:201;overflow-y:auto;padding:28px;transform:translate(100%);transition:transform .3s cubic-bezier(.2,0,0,1)}.drawer.open{transform:translate(0)}.drawer.drop-active{outline:2px dashed var(--accent, #0057ff);outline-offset:-4px}.drawer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border)}.drawer-title{font-size:1rem;font-weight:600}.drawer-close{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--r-xs);background:none;color:var(--text-dim);cursor:var(--cur-pointer),pointer!important;font-size:1rem;box-shadow:none}.drawer-close:hover{color:var(--text);border-color:var(--border-up);transform:none;box-shadow:none}.toast{position:fixed;bottom:var(--above-dock);left:50%;transform:translate(-50%);padding:10px 16px;border:1px solid rgba(255,255,255,.08);background:var(--solid);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;border-radius:10px;z-index:100010;font-family:var(--font);font-size:12px;font-weight:500;max-width:420px;text-align:center;box-shadow:0 8px 32px #0006;animation:toast-in .3s ease-out forwards,toast-out .3s ease-in 2.6s forwards}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toast-out{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(10px)}}.toast.success{border-color:#ffffff1f}.toast.error{border-color:#ef44444d;color:#fca5a5}.toast.warning{border-color:rgba(var(--color-brand-green-rgb),.3);color:#efffd4}.app-footer{text-align:center;padding:20px;font-size:.68rem;color:var(--text-faint)}#advancedOptionsPanel label{display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:500;color:var(--text-dim);cursor:var(--cur-pointer),pointer!important}#advancedOptionsPanel input[type=checkbox]{width:14px;height:14px}#nativeElementToggles{background:transparent!important;border:1px solid var(--border)!important;border-radius:var(--r-sm)!important;padding:10px!important}#nativeElementToggles label{font-weight:400!important;font-size:.72rem!important;color:var(--text-faint)!important}.page-selector-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.page-selector-label{font-size:.72rem;font-weight:600;color:var(--text-dim);letter-spacing:.02em}.page-preview-toggle{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:1px solid var(--border);border-radius:4px;background:transparent;color:var(--text-faint);cursor:var(--cur-pointer),pointer!important;transition:border-color .15s,color .15s,background .15s}.page-preview-toggle:hover{border-color:#fff3;color:var(--text-dim)}.page-preview-toggle.active{border-color:var(--accent);color:var(--accent);background:var(--el-hover)}.page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.page-card{padding:10px 8px;border:1px solid var(--border);border-radius:var(--r-sm);cursor:var(--cur-pointer),pointer!important;background:transparent;text-align:center;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:border-color .15s,background .15s;position:relative}.page-card-annotate{position:absolute;top:4px;right:4px;background:none;border:none;cursor:pointer;color:#ffffff26;padding:3px;border-radius:4px;line-height:1;transition:all .15s;display:flex}.page-card-annotate:hover{color:#fff;background:#d946ef}.page-card:hover .page-card-annotate{color:#ffffff4d}.page-card:hover{border-color:#fff3;background:var(--el-hover)}.page-card.selected{border-color:#ffffff59;background:var(--el-up)}.page-card--home{border-color:rgba(var(--color-brand-green-rgb),.2)}.page-card--home .page-card-icon{color:rgba(var(--color-brand-green-rgb),.72)}.page-card--home:hover .page-card-icon{color:rgba(var(--color-brand-green-rgb),.9)}.page-card--styleguide{border-color:rgba(var(--color-brand-purple-rgb),.25)}.page-card--styleguide .page-card-icon{color:#c09aff}.page-card--styleguide:hover .page-card-icon{color:#d4b8ff}.page-card-icon{color:var(--text-faint);margin-bottom:4px;line-height:1}.page-card:hover .page-card-icon,.page-card.selected .page-card-icon{color:var(--text-dim)}.page-card-name{font-size:.68rem;font-weight:600;color:var(--text);word-break:break-all;line-height:1.3}.page-card-title{font-size:.62rem;color:var(--text-faint);margin-top:3px;line-height:1.2}.page-grid--previews{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}.page-grid--previews .page-card{padding:6px;justify-content:flex-start}.page-grid--previews .page-card-icon{display:none}.page-card-preview{display:none;width:100%;height:100px;overflow:hidden;border-radius:3px;background:#fff;position:relative;margin-bottom:5px}.page-grid--previews .page-card-preview{display:block}.page-card-preview-loading{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(var(--color-brand-green-rgb),.07) 25%,rgba(var(--color-brand-green-rgb),.16),rgba(var(--color-brand-green-rgb),.07) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.page-card-iframe{width:1280px;height:800px;border:none;transform-origin:top left;pointer-events:none;display:block}.site-branding{display:flex;align-items:center;gap:6px;pointer-events:auto}.branding-text{font-size:.68rem;font-weight:600;letter-spacing:.15em;color:var(--text-faint)}.branding-heart{flex-shrink:0;width:14px;height:13px}.footer-logo-link{display:inline-flex;align-items:center;color:var(--ui-color-text);text-decoration:none;transition:opacity .15s,transform .15s}.footer-logo-link:visited{color:var(--ui-color-text)}.footer-logo-link:hover{color:var(--ui-color-text);opacity:.8;transform:translateY(-1px)}.footer-logo{height:12px;width:auto;display:block}[style*="background: #"]:not(.conv-ds-swatch):not([data-cs]),[style*="background:#"]:not(.conv-ds-swatch):not([data-cs]),[style*="background-color: #"]:not(.conv-ds-swatch):not([data-cs]),[style*="background-color:#"]:not(.conv-ds-swatch):not([data-cs]){background:transparent!important;background-color:transparent!important}[style*="background: white"]:not([data-cs]),[style*="background: #fff"]:not([data-cs]),[style*="background: #ffffff"]:not([data-cs]),[style*="background: rgb("]:not([data-cs]){background:transparent!important}[style*="color: #"],[style*="color:#"]{color:var(--text-dim)!important}[style*="color: white"]{color:var(--text)!important}[style*="border: 1px solid #"],[style*="border: 2px solid #"],[style*="border: 2px dashed #"],[style*="border: 1px solid rgb"],[style*="border-color: #"]{border-color:var(--border)!important}button[style*=background]:not(.mode-btn){background:transparent!important;background-color:transparent!important;color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:var(--r-xs)!important}button[style*=background]:not(.mode-btn):hover{border-color:var(--border-up)!important;color:var(--text)!important;background:var(--el-hover)!important}span[style*="background: #"],span[style*="background:#"],div[style*="background: #28"],div[style*="background: #66"],div[style*="background: #ff"],div[style*="background: #e8"],div[style*="background: #f0"],div[style*="background: #fff3"],div[style*="background: #fff8"]{background:transparent!important;color:var(--text-dim)!important;border-color:var(--border)!important}code[style*="background: #f"],code[style*="background:#f"],code[style*="color: #3"]{background:transparent!important;color:var(--text-dim)!important}textarea[style*=border],input[type=text][style*=border]{background:transparent!important;border-color:var(--border)!important;color:var(--text)!important}select[style*=border]{background:var(--bg)!important;border-color:var(--border)!important;color:var(--text)!important}.css-indicator{background:var(--el-up)!important;color:var(--text-dim)!important;border:1px solid var(--border)!important;font-size:.68rem!important}.ext-deps{margin-top:16px;border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden}.ext-deps-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;cursor:var(--cur-pointer),pointer!important;transition:background .15s}.ext-deps-header:hover{background:var(--el-hover)}.ext-deps-title{font-size:.78rem;font-weight:600;color:var(--text)}.ext-deps-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:var(--bg);font-size:.6rem;font-weight:700;margin-left:6px;vertical-align:middle}.ext-deps-header-actions{display:flex;align-items:center;gap:6px}.ext-dep-copy-all--top{font-size:.6rem!important;padding:3px 9px!important;background:var(--el-up)!important}.ext-deps-body{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;padding:0 14px}.ext-deps-open .ext-deps-body{max-height:600px;padding:0 14px 14px}.ext-dep-group{margin-top:10px}.ext-dep-group:first-child{margin-top:0}.ext-dep-group-label{display:flex;align-items:center;gap:8px;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint);margin-bottom:6px}.ext-dep-copy-all{padding:2px 8px;font-size:.55rem;font-weight:600;text-transform:none;letter-spacing:0;cursor:var(--cur-pointer),pointer!important;background:var(--el-up);color:var(--text-dim);border:1px solid var(--border);border-radius:var(--r-xs);transition:border-color .15s,color .15s}.ext-dep-copy-all:hover{border-color:var(--accent);color:var(--accent)}.ext-dep-copy-all.ext-dep-copy-done{border-color:var(--accent)!important;color:var(--accent)!important}.ext-dep-item{position:relative;margin-top:6px}.ext-dep-code{display:block;padding:14px 62px 12px 12px;background:#ffffff0a;border:1px solid var(--border);border-radius:var(--r-xs);font-family:var(--mono);font-size:.65rem;line-height:1.5;word-break:break-all;color:var(--text-dim)}.ext-dep-copy{position:absolute;top:10px;right:8px;padding:3px 10px;font-size:.6rem;font-weight:600;cursor:var(--cur-pointer),pointer!important;background:var(--el-up);color:var(--text-dim);border:1px solid var(--border);border-radius:var(--r-xs);box-shadow:none;transition:border-color .15s,color .15s}.ext-dep-copy:hover{border-color:var(--accent);color:var(--accent);background:var(--el-up);box-shadow:none}.ext-dep-copy-done{border-color:var(--accent)!important;color:var(--accent)!important}.ext-dep-fontfix{position:relative;margin-top:10px;padding-top:10px;border-top:1px dashed var(--border)}.ext-dep-fontfix-label{position:relative;font-size:.62rem;line-height:1.5;color:var(--text-dim);margin-bottom:8px;padding-right:62px}.ext-dep-code--block{white-space:pre;word-break:normal;overflow-x:auto;padding-right:12px}.ext-dep-note{font-size:.6rem;color:var(--text-faint);margin-top:3px;padding-left:10px;font-style:italic}.ext-dep-badge{display:inline-block;font-size:.55rem;font-weight:700;text-transform:uppercase;padding:1px 5px;border-radius:3px;background:var(--accent);color:var(--bg);margin-left:6px;vertical-align:middle}#externalCssWarning{align-items:center;justify-content:space-between;gap:12px;word-break:break-word;overflow-wrap:anywhere}#externalCssWarning .ecw-text{flex:1;min-width:0}.btn-fallback-gen{flex-shrink:0;padding:6px 12px;border-radius:4px;font-size:.68rem;font-weight:600;letter-spacing:.02em;background:var(--color-brand-green-500);color:#0a0a0a;border:none;cursor:var(--cur-pointer),pointer!important;transition:background .15s,transform .1s;white-space:nowrap}.btn-fallback-gen:hover{background:#f5a0ff;color:#0a0a0a}.btn-fallback-gen:active{transform:translateY(1px);color:#0a0a0a}.btn-fallback-gen:focus{color:#0a0a0a;outline:2px solid rgba(var(--color-brand-green-rgb),.4);outline-offset:2px}#htmlConverter .card.drag-active{background:var(--color-brand-green-500)}#htmlConverter .card.drag-active .hero-sub,#htmlConverter .card.drag-active .paste-text,#htmlConverter .card.drag-active .paste-hint,#htmlConverter .card.drag-active .shortcut-plus{color:#0a0a0c}#htmlConverter .card.drag-active .hero-logotype{filter:brightness(0)}#htmlConverter .card.drag-active .hero-paste{border-color:#0a0a0c38}#htmlConverter .card.drag-active kbd{color:#0a0a0c;border-color:#0a0a0c4d;background:#0a0a0c14}#htmlConverter .card.drag-active .hero-bracket-l,#htmlConverter .card.drag-active .hero-bracket-r{color:#0a0a0c!important}#htmlConverter .card.drag-active .hero-dot path{fill:#0a0a0c}#htmlConverter .card.drag-active .hero-bracket-l{animation:bracketOpenLeft .55s cubic-bezier(.22,1,.36,1) forwards}#htmlConverter .card.drag-active .hero-bracket-r{animation:bracketOpenRight .55s cubic-bezier(.22,1,.36,1) forwards}#htmlConverter .card.drag-active .hero-dot{animation:dotBounce 1s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.conv-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100000;background:#0a0a0c;color:#fff;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;scrollbar-gutter:stable;transition:opacity .35s ease,color .3s ease;isolation:isolate}.conv-overlay.fill-active{color:#fff;transition:opacity .35s ease,color .3s ease .62s}.conv-overlay.fade-out{opacity:0;pointer-events:none}.conv-overlay.success-phase .screen-loading-bar--conv,.conv-overlay.fade-out .screen-loading-bar--conv{opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}.conv-loader-fill{display:none}.conv-fluid-container{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:var(--bg, #0a0a0c);overflow:hidden;pointer-events:none;opacity:0;transition:opacity .8s ease;will-change:opacity}.conv-overlay.success-phase .conv-fluid-container{opacity:1}.conv-fluid-canvas{position:absolute;top:-3rem;right:-3rem;bottom:-3rem;left:-3rem;width:calc(100% + 6rem);height:calc(100% + 6rem);filter:blur(14px);opacity:.6}.conv-fluid-grain{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23g)'/></svg>");background-size:256px 256px;mix-blend-mode:overlay;opacity:.3}.conv-fluid-noise{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;opacity:.12;mix-blend-mode:color-burn;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'><filter id='a'><feTurbulence type='fractalNoise' baseFrequency='.99' numOctaves='20' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23a)'/></svg>")}.conv-fluid-vignette{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 60% 55% at 50% 50%,#0a0a0cd1,#0a0a0c8c 38%,#0a0a0c00 72%);opacity:0;transition:opacity 1s ease .3s}.conv-overlay.success-phase .conv-fluid-vignette{opacity:1}.conv-loader-wave{display:none}.conv-wave-svg{position:absolute;top:0;left:0;width:100%;height:80px;display:block}.conv-overlay.fill-active .conv-loader-wave{animation:waveRise .95s cubic-bezier(.76,0,.24,1) forwards}@keyframes waveRise{0%{transform:translateY(calc(100% + 80px))}to{transform:translateY(0)}}.conv-center{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;gap:0;width:100%;min-height:100vh;justify-content:center;padding:48px 20px;box-sizing:border-box}.conv-shared-icon{flex-shrink:0;line-height:0;margin-bottom:20px;transition:transform .5s cubic-bezier(.22,1,.36,1),margin .5s ease}.conv-overlay.success-phase .conv-shared-icon{transform:scale(.65);margin-bottom:6px}.conv-shared-icon svg{overflow:visible}.conv-bracket-left,.conv-bracket-right{will-change:transform}.conv-overlay.fill-active .conv-bracket-left{animation:bracketOpenLeft .6s ease-out forwards}.conv-overlay.fill-active .conv-bracket-right{animation:bracketOpenRight .6s ease-out forwards}@keyframes bracketOpenLeft{0%{transform:translate(4px)}to{transform:translate(-4px)}}@keyframes bracketOpenRight{0%{transform:translate(-4px)}to{transform:translate(4px)}}.conv-center-dot{animation:dotBounce 1s ease-in-out infinite;transform-box:fill-box;transform-origin:center;will-change:transform}.conv-overlay.success-phase .conv-center-dot{opacity:0!important;animation-play-state:paused}@keyframes dotBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.conv-checkmark{stroke-dasharray:30;stroke-dashoffset:30;opacity:0}.conv-overlay.success-phase .conv-checkmark{animation:drawCheck .45s .15s ease forwards;opacity:1}@keyframes drawCheck{0%{stroke-dashoffset:30}to{stroke-dashoffset:0}}.conv-loading-content{white-space:nowrap;text-align:center;opacity:1;max-height:40px;overflow:hidden;transition:opacity .2s ease,max-height .35s ease .05s}.conv-overlay.success-phase .conv-loading-content{opacity:0;max-height:0;pointer-events:none}.conv-loading-text{font-size:.82rem;color:inherit;letter-spacing:.04em;animation:loadingPulse 1.5s ease-in-out infinite}@keyframes loadingPulse{0%,to{opacity:.4}50%{opacity:1}}.conv-overlay-success-wrap{width:min(480px,calc(100vw - 48px));display:grid;grid-template-rows:0fr;opacity:0;pointer-events:none;transition:grid-template-rows .55s cubic-bezier(.22,1,.36,1) .1s,opacity .35s ease .15s}.conv-overlay.success-phase .conv-overlay-success-wrap{grid-template-rows:1fr;opacity:1;pointer-events:auto}.conv-overlay-success{overflow:hidden;min-height:0;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;opacity:0;pointer-events:none;transition:opacity .35s .15s ease;width:100%}.conv-overlay.success-phase .conv-overlay-success{opacity:1;pointer-events:auto;padding-bottom:8px}@keyframes convItemIn{0%{transform:translateY(20px) scale(.96);opacity:0}60%{opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes convStatIn{0%{transform:translateY(12px) scale(.82);opacity:0}65%{transform:translateY(-3px) scale(1.05);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes convCardIn{0%{transform:translateY(14px);opacity:0}to{transform:translateY(0);opacity:1}}.conv-overlay.success-phase .conv-success-title{animation:convItemIn .55s cubic-bezier(.22,1,.36,1) .1s both}.conv-overlay.success-phase .conv-success-subtitle{animation:convItemIn .5s cubic-bezier(.22,1,.36,1) .18s both}.conv-overlay.success-phase .conv-stat:nth-child(1){animation:convStatIn .5s cubic-bezier(.34,1.56,.64,1) .28s both}.conv-overlay.success-phase .conv-stat:nth-child(2){animation:convStatIn .5s cubic-bezier(.34,1.56,.64,1) .35s both}.conv-overlay.success-phase .conv-stat:nth-child(3){animation:convStatIn .5s cubic-bezier(.34,1.56,.64,1) .42s both}.conv-overlay.success-phase .conv-stat:nth-child(4){animation:convStatIn .5s cubic-bezier(.34,1.56,.64,1) .49s both}.conv-overlay.success-phase .conv-success-actions{animation:convItemIn .5s cubic-bezier(.22,1,.36,1) .36s both}.conv-overlay.success-phase .conv-extra-card:nth-child(1){animation:convCardIn .45s cubic-bezier(.22,1,.36,1) .44s both}.conv-overlay.success-phase .conv-extra-card:nth-child(2){animation:convCardIn .45s cubic-bezier(.22,1,.36,1) .52s both}.conv-overlay.success-phase .conv-extra-card:nth-child(3){animation:convCardIn .45s cubic-bezier(.22,1,.36,1) .6s both}.conv-overlay.success-phase .conv-extra-card:nth-child(4){animation:convCardIn .45s cubic-bezier(.22,1,.36,1) .68s both}.conv-overlay.success-phase .conv-dep-section:nth-child(1){animation:convCardIn .38s cubic-bezier(.22,1,.36,1) .5s both}.conv-overlay.success-phase .conv-dep-section:nth-child(2){animation:convCardIn .38s cubic-bezier(.22,1,.36,1) .58s both}.conv-overlay.success-phase .conv-dep-section:nth-child(3){animation:convCardIn .38s cubic-bezier(.22,1,.36,1) .66s both}.conv-overlay.success-phase .conv-dep-tag{animation:convCardIn .35s cubic-bezier(.22,1,.36,1) .54s both}.conv-overlay.success-phase .conv-dep-section:nth-child(2) .conv-dep-tag{animation-delay:.62s}.conv-overlay.success-phase .conv-dep-section:nth-child(3) .conv-dep-tag{animation-delay:.7s}@keyframes convCenterOut{0%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-14px) scale(.98);opacity:0}}.conv-overlay.fade-out .conv-center{animation:convCenterOut .3s cubic-bezier(.4,0,1,1) forwards}.conv-overlay.fade-out{transition:opacity .35s .1s ease,color .3s ease}.conv-success-title{font-size:1.5rem;font-weight:800;color:#fff;letter-spacing:-.02em}.conv-success-subtitle{font-size:.88rem;color:#ffffff8c;max-width:360px;line-height:1.5}@keyframes fadeUp{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}.conv-success-stats{display:flex;gap:24px;margin-top:8px}.conv-stat{text-align:center}.conv-stat-num{font-size:1.25rem;font-weight:800;color:#fff}.conv-stat-label{font-size:.68rem;color:#ffffff80;text-transform:uppercase;letter-spacing:.05em}.conv-success-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px;width:100%;max-width:480px;margin-left:auto;margin-right:auto}.conv-success-actions .conv-btn{flex:1 1 0;min-width:0;padding-left:12px;padding-right:12px}.conv-success-extras{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:8px;width:100%;max-width:480px}.conv-btn{font-family:var(--font);font-size:.82rem;font-weight:600;padding:10px 24px;border-radius:8px;cursor:var(--cur-pointer),pointer!important;border:none;box-shadow:none;transition:background .15s,color .15s,border-color .15s}.conv-btn:active{opacity:.8}.conv-btn-ghost{background:transparent;color:var(--ui-color-text-soft);border:1px solid var(--color-white-18)}.conv-btn-ghost:hover{border-color:var(--color-white-35);background:var(--ui-color-bg-elevated);color:var(--ui-color-text)}.conv-btn-sm{font-size:.72rem;padding:6px 14px;border-radius:6px}.conv-extra-card{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:20px 24px;width:100%;text-align:center}.conv-extra-card+.conv-extra-card{margin-top:4px}.conv-extra-title{font-size:.82rem;font-weight:700;color:#fff;margin-bottom:4px;display:flex;align-items:center;justify-content:center;gap:8px}.conv-extra-title:before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;flex-shrink:0}.conv-extra-body{font-size:.78rem;color:#fff9;line-height:1.6}.conv-extra-body .conv-btn{margin-top:12px}.conv-dep-tag{display:block;font-family:var(--mono);font-size:.68rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:14px 58px 12px 12px;margin-top:8px;word-break:break-all;color:var(--text, #efedf4);position:relative;line-height:1.5}.conv-dep-copy{position:absolute;top:10px;right:8px;font-family:var(--font);font-size:.62rem;padding:3px 10px;background:var(--color-brand-purple-500);color:#fff;border:none;border-radius:4px;cursor:var(--cur-pointer),pointer!important;box-shadow:none}.conv-dep-copy:hover{background:var(--color-pro-600);color:var(--ui-color-text-inverse);box-shadow:none}.conv-deps-body{text-align:left}.conv-dep-section{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1)}.conv-dep-section:first-child{margin-top:0;padding-top:0;border-top:none}.conv-dep-section-label{display:flex;align-items:center;gap:8px;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#ffffffa6;margin-bottom:6px}.conv-dep-section-hint{font-size:.65rem;color:#fff6;margin-bottom:6px;line-height:1.5}.conv-dep-section-hint strong{color:#fff9;font-weight:600}.conv-dep-copy-all{padding:2px 8px;font-size:.58rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;background:#ffffff14;color:#ffffff8c;border:1px solid rgba(255,255,255,.15);border-radius:4px;cursor:var(--cur-pointer),pointer!important;box-shadow:none;transition:border-color .15s,color .15s;flex-shrink:0}.conv-dep-copy-all:hover{border-color:#7c7df7;color:#7c7df7}.conv-dep-font-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;margin-bottom:4px}.conv-dep-font-link{font-size:.62rem;font-weight:500;color:#5b5cf6;text-decoration:none;border:1px solid rgba(91,92,246,.3);border-radius:4px;padding:2px 8px;transition:border-color .15s}.conv-dep-font-link:hover{border-color:#5b5cf6}.conv-dep-note{font-size:.62rem;color:#ffffff59;padding:2px 4px;font-style:italic}.conv-ds-card{cursor:var(--cur-pointer),pointer!important;transition:border-color .2s;position:relative}.conv-ds-card:hover{border-color:#ffffff4d}.conv-ds-card:after{content:"Click to copy";position:absolute;top:12px;right:16px;font-size:.6rem;color:#ffffff4d;font-weight:500;transition:color .2s}.conv-ds-card:hover:after{color:#ffffff8c}.conv-ds-card-copied{border-color:#4caf50!important}.conv-ds-card-copied:after{content:"Copied!"!important;color:#4caf50!important}.conv-ds-summary{font-size:.78rem;color:#fff9;line-height:1.6}.conv-ds-expand{background:none;border:none;color:#5b5cf6;font-size:.78rem;font-weight:600;cursor:var(--cur-pointer),pointer!important;padding:0;margin-left:4px;box-shadow:none}.conv-ds-expand:hover{text-decoration:underline;color:#4f46e5;background:none;box-shadow:none}.conv-ds-collapsible{max-height:0;overflow:hidden;transition:max-height .3s ease}.conv-ds-collapsible.conv-ds-open{max-height:800px}.conv-ds-preview{display:flex;flex-direction:column;gap:14px;margin:14px 0 6px}.conv-ds-group{text-align:left}.conv-ds-group-label{font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#fff6;margin-bottom:6px}.ds-export-body{padding:14px;display:flex;flex-direction:column;gap:14px}.ds-export-preview{flex:1;display:flex;flex-direction:column;gap:14px;margin-bottom:0}.ds-export-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ds-export-select{font-size:.72rem;background:var(--color-white-04);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs);padding:6px 10px}.ds-export-btn{padding:8px 14px;font-size:.78rem}.ds-export-status{font-size:.7rem;color:var(--text-faint)}.ds-export-stats{display:flex;gap:14px;flex-wrap:wrap;font-size:.74rem;color:var(--text-dim);margin-bottom:0}.ds-export-stat{display:flex;align-items:center;gap:4px}.ds-export-stat strong{color:var(--text);font-variant-numeric:tabular-nums}.ds-export-group{margin-bottom:0}.ds-export-group-label{font-size:.68rem;font-weight:600;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}.conv-ds-swatches{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.conv-ds-swatch{width:38px;height:38px;border-radius:8px;border:1px solid rgba(255,255,255,.15);transition:transform .15s;flex:0 0 auto}.conv-ds-swatch:hover{transform:scale(1.15)}.conv-ds-more{font-size:.7rem;color:#fff6;font-weight:600;padding:0 6px}.conv-ds-fonts{display:flex;flex-wrap:wrap;gap:10px}.conv-ds-font{font-size:1rem;color:#fff;padding:10px 16px;background:transparent;border-radius:8px;border:1px solid rgba(255,255,255,.15);line-height:1.2}.conv-ds-sizes{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}.conv-ds-size{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 14px;background:transparent;border-radius:8px;border:1px solid rgba(255,255,255,.15);min-width:68px}.conv-ds-size-val{font-size:.86rem;font-weight:700;color:#fff;font-family:var(--mono)}.conv-ds-size-name{font-size:.64rem;color:#fff6;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-ds-actions{display:flex;gap:8px;justify-content:center;margin-top:14px}.conv-btn-copied{border-color:#4caf50!important;color:#4caf50!important}.conv-pages-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px 16px;cursor:default}.conv-pages-card .conv-ds-collapsible.conv-ds-open{max-height:2000px}.conv-pages-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:5px;margin:12px 0 4px;max-height:320px;overflow-y:auto}.conv-page-card{padding:8px 6px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:#ffffff0a;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;gap:2px}.conv-page-card.is-home{border-color:#ffffff26;background:#ffffff14}.conv-page-card-icon{color:#ffffff4d;line-height:1}.conv-page-card.is-home .conv-page-card-icon{color:#ffffff80}.conv-page-card-name{font-size:.6rem;font-weight:600;color:#ffffffa6;word-break:break-all;line-height:1.25}.conv-page-card-title{font-size:.54rem;color:#fff6;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.conv-export-progress{margin-top:10px}.conv-export-message{font-size:.62rem;color:#fff6;margin-top:4px;text-align:center}.conv-overlay.success-phase .conv-pages-card{animation:convCardIn .45s cubic-bezier(.22,1,.36,1) .4s both}.preloader{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:var(--bg);z-index:99999;transition:opacity .35s}.preloader.fade-out{opacity:0;pointer-events:none}.preloader-icon{display:flex;justify-content:center;color:var(--text)}.preloader-text{opacity:0;animation:preFadeIn .5s cubic-bezier(.22,.61,.36,1) .8s forwards}.preloader-logotype{display:block;height:15px;width:auto;opacity:.9}.pre-bracket-l{animation:preBracketL 1s cubic-bezier(.22,.61,.36,1) forwards}.pre-bracket-r{animation:preBracketR 1s cubic-bezier(.22,.61,.36,1) forwards}@keyframes preBracketL{0%{transform:translate(14px);opacity:.4}40%{transform:translate(5px);opacity:1}to{transform:translate(0)}}@keyframes preBracketR{0%{transform:translate(-14px);opacity:.4}40%{transform:translate(-5px);opacity:1}to{transform:translate(0)}}.pre-dot{opacity:0;transform-box:fill-box;transform-origin:center}.pre-dot-main{animation:preDotRise .45s cubic-bezier(.34,1.4,.64,1) .55s forwards,preDotWave .9s cubic-bezier(.45,0,.55,1) 1.2s infinite}@keyframes preDotRise{0%{opacity:0;transform:translateY(14px) scale(.5)}60%{opacity:1}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes preDotWave{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes preFadeIn{to{opacity:1}}body:not(.app-enter) .app-header{opacity:0;transform:translateY(-10px)}body:not(.app-enter) .dock-wrap{opacity:0;transform:translateY(14px)}body:not(.app-enter) .corner-links{opacity:0}body:not(.app-enter) #heroBlock .hero-icon{opacity:0;transform:scale(.92)}body:not(.app-enter) #heroBlock .hero-title{opacity:0;transform:translateY(8px)}body:not(.app-enter) #heroBlock .hero-sub{opacity:0;transform:translateY(6px)}body:not(.app-enter) #heroPasteZone{opacity:0;transform:translateY(8px)}body.app-enter .app-header{animation:enterSlideDown .9s cubic-bezier(.25,.46,.45,.94) .05s both}body.app-enter #heroBlock .hero-icon{animation:enterPop 1s cubic-bezier(.25,.46,.45,.94) .12s both}body.app-enter #heroBlock .hero-title{animation:enterSlideUp .85s cubic-bezier(.25,.46,.45,.94) .22s both}body.app-enter #heroBlock .hero-sub{animation:enterSlideUp .85s cubic-bezier(.25,.46,.45,.94) .34s both}body.app-enter #heroPasteZone{animation:enterFadeSlide .9s cubic-bezier(.25,.46,.45,.94) .44s both}body.app-enter .dock-wrap{animation:enterSlideUp2 .9s cubic-bezier(.25,.46,.45,.94) .38s both}body.app-enter .corner-links{animation:enterFade 1s cubic-bezier(.25,.46,.45,.94) .6s both}@keyframes enterSlideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes enterSlideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes enterSlideUp2{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes enterPop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes enterFadeSlide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes enterFade{0%{opacity:0}to{opacity:1}}@media (max-width: 640px){.card{padding:28px 20px;border-radius:16px}.card-sm{padding:24px 18px}.hero-title{font-size:1.25rem}.hero-logotype{height:26px}.mode-toggle{width:100%}.mode-toggle .mode-btn{flex:1}.action-bar{flex-direction:column}.action-bar button{width:100%}.harvest-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}.corner-links{padding:0 12px;gap:8px}.corner-link{display:none}.legal-links{gap:6px;flex-wrap:wrap}.legal-link{font-size:9px;letter-spacing:.04em}.site-branding{gap:4px}.branding-text{display:none}.footer-logo{height:10px}}.annotation-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100000;background:var(--bg, #161516);display:flex;flex-direction:column;font-family:var(--font);color:var(--ui-color-text);--color-brand-green-500: #c8f542;--color-brand-green-rgb: 200, 245, 66;--color-success-500: #c8f542;--color-success-600: #aad926;--ui-color-status-success: #c8f542}.annotation-overlay .dock-item[data-tool=converter]{--color-brand-green-500: #f085ff;--color-brand-green-rgb: 240, 133, 255;--color-success-500: #f085ff;--color-success-600: #d063e6}.annotation-overlay.canvas-enter{animation:canvasOverlayIn .6s cubic-bezier(.25,.46,.45,.94) both}.annotation-overlay.canvas-enter .annotation-breadcrumb-container{animation:canvasSlideDown .8s cubic-bezier(.25,.46,.45,.94) .1s both}.annotation-overlay.canvas-enter .annotation-body{animation:canvasFade .9s cubic-bezier(.25,.46,.45,.94) .15s both}.annotation-overlay.canvas-enter .annotation-dock-wrap{animation:canvasSlideUp .85s cubic-bezier(.25,.46,.45,.94) .2s both}.annotation-overlay.canvas-enter .annotation-navigator{animation:canvasSlideRight .8s cubic-bezier(.25,.46,.45,.94) .25s both}.annotation-overlay.canvas-enter .annotation-empty-close{animation:canvasFade .7s cubic-bezier(.25,.46,.45,.94) .2s both}.annotation-overlay.canvas-enter .annotation-empty-card{animation:canvasCardIn .9s cubic-bezier(.25,.46,.45,.94) .15s both}.annotation-overlay.canvas-enter .annotation-empty-saved-list{animation:canvasSlideUp .85s cubic-bezier(.25,.46,.45,.94) .28s both}.annotation-overlay.canvas-enter.canvas-enter-initial .artboard{animation:canvasArtboardIn .85s cubic-bezier(.25,.46,.45,.94) both;animation-delay:calc(.3s + var(--i, 0) * .1s)}.annotation-overlay.canvas-enter.canvas-enter-soft .artboard{animation:canvasArtboardSoftIn .38s cubic-bezier(.25,.46,.45,.94) both;animation-delay:0s}.annotation-viewport-container.canvas-reveal-soft .canvas-world{animation:canvasFade .4s cubic-bezier(.25,.46,.45,.94) both}@keyframes canvasOverlayIn{0%{opacity:0}to{opacity:1}}@keyframes canvasSlideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes canvasSlideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes canvasSlideRight{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}@keyframes canvasFadeScale{0%{opacity:0;transform:scale(.99)}to{opacity:1;transform:scale(1)}}@keyframes canvasCardIn{0%{opacity:0;transform:scale(.95) translateY(6px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes canvasFade{0%{opacity:0}to{opacity:1}}@keyframes canvasArtboardIn{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes canvasArtboardSoftIn{0%{opacity:0}to{opacity:1}}.annotation-status{display:flex;align-items:center;gap:8px;font-size:10px;flex-shrink:0}.annotation-filename{opacity:.35;font-family:var(--mono)}.annotation-count{opacity:.45}.annotation-dock-wrap{z-index:100010;bottom:14px}.annotation-overlay .dock-item[data-tool=select].active{color:var(--color-brand-purple-500);background:rgba(var(--color-brand-purple-rgb),.1)}.annotation-overlay .dock-item[data-tool=cms].active{color:#e879f9;background:#d946ef1a}.annotation-overlay .dock-item[data-tool=component].active{color:var(--color-brand-green-500);background:rgba(var(--color-brand-green-rgb),.1)}.annotation-overlay .dock-item[data-tool=skip].active{color:#f87171;background:#dc26261a}.annotation-overlay .dock-item[data-tool=layers].active{color:var(--color-brand-green-500);background:rgba(var(--color-brand-green-rgb),.1)}.annotation-overlay .dock-item[data-tool=hand].active{color:#fff;background:var(--el-active)}.annotation-overlay .dock-item[data-tool=settings].active{color:#a3a3a3;background:#ffffff0f}.annotation-overlay .dock-item-save,.dock-item.dock-item-convert{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse);border-radius:var(--ui-radius-soft, 6px);animation:dockSavePopIn .3s cubic-bezier(.34,1.56,.64,1) both}.annotation-overlay .dock-item-save:hover,.annotation-overlay .dock-item-save.dock-hover,.dock-item.dock-item-convert:hover,.dock-item.dock-item-convert.dock-hover{background:var(--color-success-600, #9fdd0f);color:var(--ui-color-text-inverse)}@keyframes dockSavePopIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.annotation-settings-panel{position:fixed;right:24px;bottom:var(--above-dock);width:320px;max-height:calc(100vh - 120px);background:var(--solid-up);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 12px 48px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-y:auto;z-index:10;font-family:var(--font)}.ann-settings-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.06)}.ann-settings-title{font-size:13px;font-weight:600;color:#ffffffb3}.ann-settings-close{background:none;border:none;color:#ffffff4d;font-size:18px;cursor:pointer;line-height:1}.ann-settings-close:hover{color:#fff}.ann-settings-body{padding:12px 16px}.ann-settings-section{margin-bottom:16px}.ann-settings-section:last-child{margin-bottom:4px}.ann-settings-section-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:10px}.ann-settings-hint{font-size:11px;color:#ffffff4d;line-height:1.5;margin-bottom:10px}.ann-settings-hint--nested{padding-left:22px;margin-top:-4px}.ann-settings-toggle{display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer;font-size:12px;color:#ffffffa6}.ann-settings-toggle:hover{color:#ffffffd9}.ann-settings-toggle input[type=checkbox]{width:14px;height:14px;flex-shrink:0;cursor:pointer}.home-settings-panel{position:fixed;right:24px;bottom:var(--above-dock);width:320px;max-height:calc(100vh - 120px);background:var(--solid-up);border:1px solid var(--ui-color-border-default);border-radius:12px;box-shadow:var(--ui-shadow-lg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-y:auto;z-index:var(--ui-layer-toast);font-family:var(--font)}.hand-zoom-popup{transform:translate(-50%,-100%);z-index:200001;animation:zoom-popup-in .15s ease-out}@keyframes zoom-popup-in{0%{opacity:0;transform:translate(-50%,-90%)}to{opacity:1;transform:translate(-50%,-100%)}}.hand-zoom-btn{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--solid);border:1px solid rgba(255,255,255,.1);color:#ffffff80;cursor:pointer;box-shadow:0 4px 16px #0006;transition:all .12s;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.hand-zoom-btn svg{width:24px;height:24px}.hand-zoom-btn:hover,.hand-zoom-btn.hover{color:#fff;background:var(--solid-up);border-color:#fff3;transform:scale(1.08)}.tag-tools-popup{display:flex;flex-direction:row;gap:6px}.breadcrumb-trail{display:flex;align-items:center;overflow:hidden;flex:1;min-width:0;mask-image:linear-gradient(to right,transparent 0px,black 40px,black 100%);-webkit-mask-image:linear-gradient(to right,transparent 0px,black 40px,black 100%)}.breadcrumb-trail>*{flex-shrink:0}.breadcrumb-item{padding:2px 6px;border-radius:3px;color:#fff6;cursor:pointer;transition:all .12s;border:none;background:none;font:inherit;font-size:inherit}.breadcrumb-item:hover{color:#fff;background:var(--el-active)}.breadcrumb-item--active{color:var(--ui-color-status-info);font-weight:600}.breadcrumb-sep{color:#ffffff26;margin:0 1px}.annotation-browse-banner{position:fixed;top:52px;left:50%;transform:translate(-50%) translateY(-8px);display:none;align-items:center;gap:8px;max-width:min(92vw,560px);padding:8px 14px;border-radius:999px;background:color-mix(in oklab,var(--accent, #beff0d) 88%,#000 12%);color:#161516;font-family:var(--sans);font-size:12.5px;font-weight:500;line-height:1.3;border:none;cursor:pointer;text-align:left;box-shadow:0 8px 24px #00000073;z-index:100050;opacity:0;transition:opacity .18s ease,transform .18s cubic-bezier(.16,1,.3,1)}.annotation-browse-banner svg{width:16px;height:16px;flex:0 0 auto}.annotation-browse-banner b{font-weight:700}.annotation-overlay[data-active-tool=browse] .annotation-browse-banner{display:flex;opacity:1;transform:translate(-50%) translateY(0)}.annotation-overlay.temporary-navigate .annotation-viewport-container{cursor:default}.annotation-overlay.temporary-navigate .dock-item-nav{box-shadow:inset 0 0 0 1px #38bdf873,0 0 12px #38bdf82e}.annotation-select-bubbles{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:100002}.select-bubble{position:fixed;pointer-events:auto;cursor:pointer;padding:1px 7px;border-radius:var(--ui-radius-soft);font-family:var(--mono);font-size:10px;font-weight:500;white-space:nowrap;line-height:18px;border:none;transition:background .12s,color .12s}.select-bubble--active{font-weight:600}.select-bubble{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.select-bubble:hover{background:var(--color-success-600);color:var(--ui-color-text-inverse)}.select-bubble--active{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}[data-active-tool=select] .select-bubble{background:var(--color-pro-600);color:var(--ui-color-text-inverse)}[data-active-tool=select] .select-bubble:hover,[data-active-tool=select] .select-bubble--active{background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}[data-active-tool=cms] .select-bubble{background:#c026d3;color:#fff}[data-active-tool=cms] .select-bubble:hover,[data-active-tool=cms] .select-bubble--active{background:#d946ef;color:#fff}[data-active-tool=component] .select-bubble{background:var(--color-success-600);color:var(--ui-color-text-inverse)}[data-active-tool=component] .select-bubble:hover,[data-active-tool=component] .select-bubble--active{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}[data-active-tool=skip] .select-bubble{background:#b91c1c;color:#fff}[data-active-tool=skip] .select-bubble:hover,[data-active-tool=skip] .select-bubble--active{background:#dc2626;color:#fff}.select-bubble[data-annotation-type=cms]{background:#c026d3;color:#fff}.select-bubble[data-annotation-type=cms]:hover,.select-bubble--active[data-annotation-type=cms]{background:#d946ef;color:#fff}.select-bubble[data-annotation-type=component]{background:var(--color-success-600);color:var(--ui-color-text-inverse)}.select-bubble[data-annotation-type=component]:hover,.select-bubble--active[data-annotation-type=component]{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.select-bubble[data-annotation-type=skip]{background:#b91c1c;color:#fff}.select-bubble[data-annotation-type=skip]:hover,.select-bubble--active[data-annotation-type=skip]{background:#dc2626;color:#fff}.select-bubble[data-annotation-type=form]{background:var(--color-success-600);color:var(--ui-color-text-inverse)}.select-bubble[data-annotation-type=form]:hover,.select-bubble--active[data-annotation-type=form]{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-navigator{width:240px;flex-shrink:0;background:var(--solid-up);border-right:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:100004}.annotation-navigator-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.06);font-size:11px;font-weight:600;color:#ffffff80}.annotation-navigator-actions{display:flex;align-items:center;gap:4px}.annotation-navigator-expand,.annotation-navigator-collapse{background:none;border:none;color:#ffffff40;cursor:pointer;padding:2px;display:flex;align-items:center;border-radius:3px}.annotation-navigator-expand:hover,.annotation-navigator-collapse:hover{color:#fff9;background:var(--el-up)}.annotation-navigator-close{background:none;border:none;color:#ffffff4d;font-size:16px;cursor:pointer;padding:0 2px;line-height:1}.annotation-navigator-close:hover{color:#fff}.annotation-navigator-tree{flex:1;overflow-y:auto;padding:4px 0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.08) transparent}.nav-tree-item{display:flex;align-items:center;gap:2px;min-height:24px}.nav-tree-arrow{width:14px;font-size:9px;color:#ffffff40;text-align:center;flex-shrink:0;-webkit-user-select:none;user-select:none}.nav-tree-arrow--empty{visibility:hidden}.nav-icon{width:14px;height:14px;flex-shrink:0;color:#ffffff4d;margin-right:4px}.nav-icon--cms{color:#e879f9}.nav-icon--component{color:var(--color-brand-green-500)}.nav-tree-annotation{font-size:9px;color:#f5d0fe;margin-left:4px;font-weight:600}.nav-tree-label{font-family:var(--mono);font-size:10px;color:#ffffff73;cursor:pointer;padding:2px 6px;border-radius:3px;transition:all .1s;white-space:nowrap;-webkit-user-select:none;user-select:none}.nav-tree-label:hover{color:#fff;background:var(--el-up)}.nav-tree-label--active{color:var(--ui-color-text-inverse);background:var(--color-brand-purple-500)}.nav-tree-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;margin-left:auto}.nav-tree-dot--cms{background:#d946ef}.nav-tree-dot--component{background:var(--color-brand-green-500)}.nav-tree-dot--skip{background:#dc2626}.nav-tree-dot--form{background:var(--color-brand-green-500)}.annotation-navigator-filter{background:none;border:none;color:#ffffff40;cursor:pointer;padding:2px;display:flex;align-items:center;border-radius:3px}.annotation-navigator-filter:hover{color:#fff9;background:var(--el-up)}.annotation-navigator-filter.active{color:var(--ui-color-text-inverse);background:var(--color-brand-green-500)}.annotation-viewport-container{flex:1;position:relative;overflow:hidden;cursor:grab;background:var(--bg, #161516)}.annotation-viewport-container:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle,rgba(255,255,255,.12) 1px,transparent 1px);background-size:20px 20px;z-index:0;pointer-events:none}.annotation-viewport-container.cursor-hand,.annotation-viewport-container.cursor-hand *,.annotation-viewport-container.cursor-hand .artboard,.annotation-viewport-container.cursor-hand .artboard-iframe,.annotation-viewport-container.cursor-hand .canvas-world{cursor:var(--cur-grab),grab!important}.annotation-viewport-container.cursor-zoom,.annotation-viewport-container.cursor-zoom *,.annotation-viewport-container.cursor-zoom .artboard,.annotation-viewport-container.cursor-zoom .artboard-iframe,.annotation-viewport-container.cursor-zoom .canvas-world{cursor:var(--cur-zoom),zoom-in!important}.annotation-viewport-container.grabbing,.annotation-viewport-container.grabbing *{cursor:var(--cur-grabbing),grabbing!important}.canvas-world{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform;z-index:1}.artboard{position:absolute;background:#fff;border-radius:10px;box-shadow:0 2px 12px #0000004d;overflow:visible;transition:box-shadow .2s,opacity .2s}.artboard:hover{box-shadow:0 4px 20px #ffffff14}.artboard.is-reflowing{transition:left .34s cubic-bezier(.4,0,.2,1),top .34s cubic-bezier(.4,0,.2,1),box-shadow .2s,opacity .2s}.artboard.selected{box-shadow:0 0 0 3px #fff6,0 4px 20px #ffffff1a}.artboard.entered{outline:3px solid var(--color-brand-purple-500);outline-offset:5px;box-shadow:0 4px 20px rgba(var(--color-brand-purple-rgb),.2)}.artboard.dimmed{opacity:.3;pointer-events:none}.annotation-overlay.canvas-enter.canvas-enter-initial .artboard.dimmed{animation:none;opacity:.3;pointer-events:none}.artboard.grid-mode{overflow:visible}.artboard.grid-mode .artboard-iframe{height:100%;pointer-events:auto}.annotation-viewport-container.cursor-hand .artboard.grid-mode .artboard-iframe,.annotation-viewport-container.cursor-zoom .artboard.grid-mode .artboard-iframe,.artboard.grid-mode.tile-pointer-off .artboard-iframe{pointer-events:none}.artboard.grid-mode.entered .artboard-iframe{pointer-events:auto}.artboard.flow-mode{overflow:visible}.artboard-label{display:none}.artboard-label .artboard-size{font-size:9px;opacity:.5;margin-left:4px}.artboard-name-bubble{position:absolute;bottom:calc(100% + 16px);left:0;z-index:2;display:flex;align-items:center;gap:12px;padding:10px 28px;border-radius:var(--ui-radius-soft);background:#161516cc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#ffffffd9;font-size:28px;font-weight:600;font-family:var(--font);white-space:nowrap;pointer-events:auto;border:1px solid rgba(255,255,255,.1);transform:scale(clamp(.5,var(--inv-zoom, 1) * .4,1.5));transform-origin:bottom left}.artboard-home-badge{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-home-badge svg{width:32px;height:32px}.artboard-home-badge.is-home{color:var(--color-brand-green-500)}.artboard-home-badge.is-home svg{fill:var(--color-brand-green-500)}.artboard-home-badge:hover{color:var(--color-brand-green-500)}.artboard:has(.artboard-home-badge.is-home){outline:3px solid rgba(var(--color-brand-green-rgb),.35);outline-offset:5px;box-shadow:0 2px 12px rgba(var(--color-brand-green-rgb),.08)}.artboard:has(.artboard-home-badge.is-home):hover{outline-color:rgba(var(--color-brand-green-rgb),.5);box-shadow:0 4px 20px rgba(var(--color-brand-green-rgb),.12)}.artboard-gear-btn{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-gear-btn svg{width:32px;height:32px}.artboard-gear-btn:hover{color:#ffffffe6}.artboard-reload-btn{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-reload-btn svg{width:32px;height:32px;stroke:currentColor}.artboard-reload-btn:hover{color:#ffffffe6}@keyframes artboard-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.artboard-reload-btn.spinning svg{animation:artboard-spin .5s linear}.artboard-skeleton{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;background:#111012;pointer-events:none;overflow:hidden;opacity:1;transition:opacity .2s ease}.artboard:not(.is-loading) .artboard-skeleton{opacity:0}@keyframes artboard-sk-shimmer{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.artboard-sk-nav,.artboard-sk-hero,.artboard-sk-row,.artboard-sk-card{background:#ffffff0d;animation:artboard-sk-shimmer 1s ease-in-out infinite;border-radius:8px}.artboard-sk-nav{width:100%;height:72px;border-radius:0}.artboard-sk-hero{width:100%;height:500px;margin-top:2px;border-radius:0}.artboard-sk-section{padding:80px 120px}.artboard-sk-row{height:20px}.artboard-sk-row+.artboard-sk-row{margin-top:20px}.artboard-sk-cards{display:flex;gap:32px;margin-top:60px}.artboard-sk-card{flex:1;height:280px}.preview-reload-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:var(--el-hover, rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#ffffff80;cursor:pointer;flex-shrink:0;transition:color .1s,border-color .1s}.preview-reload-btn svg{display:block;stroke:currentColor}.preview-reload-btn:hover{color:#fff;border-color:#fff3}.preview-reload-btn.spinning svg{animation:artboard-spin .5s linear}@keyframes breadcrumb-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.annotation-breadcrumb .breadcrumb-reload-btn{display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:none;background:none;border-radius:6px;color:#ffffff80;cursor:pointer;flex-shrink:0;transition:color .1s,background .12s}.annotation-breadcrumb .breadcrumb-reload-btn svg{display:block;stroke:currentColor}.annotation-breadcrumb .breadcrumb-reload-btn:hover{color:#ffffffe6;background:#ffffff14}.annotation-breadcrumb .breadcrumb-reload-btn.spinning svg{animation:breadcrumb-spin .5s linear}.annotation-breadcrumb .breadcrumb-freeze-btn{display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:none;background:none;border-radius:6px;color:#ffffff80;cursor:pointer;flex-shrink:0;transition:color .1s,background .12s}.annotation-breadcrumb .breadcrumb-freeze-btn svg{display:block;stroke:currentColor}.annotation-breadcrumb .breadcrumb-freeze-btn:hover{color:#ffffffe6;background:#ffffff14}.annotation-breadcrumb .breadcrumb-freeze-btn.active{color:#d946ef;background:#d946ef24}.annotation-breadcrumb .breadcrumb-freeze-btn.active:hover{color:#e879f9;background:#d946ef33}.annotation-breadcrumb .breadcrumb-dress-btn{display:flex;align-items:center;justify-content:center;gap:5px;height:26px;min-width:26px;padding:0 6px;border:none;background:none;border-radius:6px;color:#ffffff80;cursor:pointer;flex-shrink:0;transition:color .1s,background .12s}.annotation-breadcrumb .breadcrumb-dress-btn svg{display:block;stroke:currentColor}.annotation-breadcrumb .breadcrumb-dress-btn .dress-label{font-size:11px;font-weight:600;letter-spacing:.02em;line-height:1}.annotation-breadcrumb .breadcrumb-dress-btn .dress-label:empty{display:none}.annotation-breadcrumb .breadcrumb-dress-btn:hover{color:#ffffffe6;background:#ffffff14}.annotation-breadcrumb .breadcrumb-dress-btn.active{color:#38bdf8;background:#38bdf824}.annotation-breadcrumb .breadcrumb-dress-btn.active:hover{color:#7dd3fc;background:#38bdf833}.artboard-page-menu{z-index:200002;background:var(--solid-up, rgba(22,21,22,.95));border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:4px;min-width:180px;box-shadow:0 12px 40px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-family:var(--font)}.artboard-page-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;border:none;border-radius:6px;background:none;color:#ffffffa6;font-size:13px;font-family:var(--font);cursor:pointer;transition:background .1s,color .1s}.artboard-page-menu-item:hover{background:#ffffff0f;color:#fff}.artboard-page-menu-item svg{width:15px;height:15px;flex-shrink:0}.artboard-page-menu-item.is-danger{color:#ef4444b3}.artboard-page-menu-item.is-danger:hover{background:#ef44441a;color:#f87171}.artboard-page-menu-sep{height:1px;background:#ffffff0f;margin:4px 8px}.artboard-home-dropdown{z-index:200002;background:var(--solid, #1a1a1e);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:4px;min-width:160px;max-height:280px;overflow-y:auto;box-shadow:0 8px 32px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:zoom-popup-in .12s ease-out}.artboard-home-dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 10px;border:none;background:none;color:#ffffff8c;font-size:12px;font-family:var(--font);cursor:pointer;border-radius:7px;transition:all .1s}.artboard-home-dropdown-item:hover{background:#ffffff14;color:#fff}.artboard-home-dropdown-item.is-active{color:var(--color-brand-green-500)}.artboard-home-dropdown-item.is-active svg{fill:var(--color-brand-green-500);stroke:var(--color-brand-green-500)}.dock-icon-homepage{color:rgba(var(--color-brand-green-rgb),.72)!important}.dock-icon-styleguide{color:#c09aff!important}.artboard-styleguide-badge{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-styleguide-badge svg{width:32px;height:32px}.artboard-styleguide-badge.is-styleguide{color:#c09aff}.artboard-styleguide-badge.is-styleguide svg{fill:#c09aff}.artboard-styleguide-badge:hover{color:#c09aff}.artboard-404-badge{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-404-badge svg{width:32px;height:32px}.artboard-404-badge.is-404{color:#ff7a5c}.artboard-404-badge.is-404 svg{stroke:#ff7a5c}.artboard-404-badge:hover{color:#ff7a5c}.artboard-ignore-badge{width:36px;height:36px;border-radius:8px;background:none;border:none;color:#fff9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s;flex-shrink:0;padding:0}.artboard-ignore-badge svg{width:30px;height:30px}.artboard-ignore-badge.is-ignored,.artboard-ignore-badge:hover{color:#f5a524}.artboard-ignore-overlay{display:none}.artboard.is-ignored:not(.entered) .artboard-ignore-overlay{display:flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:#08080aa8;border-radius:10px;pointer-events:none}.artboard-ignore-overlay span{font-family:var(--font);font-weight:600;font-size:26px;letter-spacing:.18em;text-transform:uppercase;color:#ffffffd9;padding:9px 22px;border-radius:999px;background:#0006;border:1px solid rgba(255,255,255,.16);transform:scale(clamp(.5,var(--inv-zoom, 1) * .4,1.5))}.artboard-select-check{display:none}.artboard.selection-mode .artboard-select-check{display:flex;align-items:center;justify-content:center;position:absolute;top:14px;right:14px;z-index:4;width:34px;height:34px;border-radius:50%;padding:0;background:#161516d1;border:2px solid rgba(255,255,255,.55);color:transparent;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 2px 8px #00000059;transform:scale(clamp(.6,var(--inv-zoom, 1) * .5,2));transform-origin:top right;transition:background .12s,border-color .12s,color .12s}.artboard-select-check svg{width:20px;height:20px}.artboard.selection-mode .artboard-select-check:hover{border-color:var(--color-brand-green-500)}.artboard.selection-mode.is-selected .artboard-select-check{background:var(--color-brand-green-500);border-color:var(--color-brand-green-500);color:#0a0a0a}.artboard.selection-mode.is-selected{outline:3px solid var(--color-brand-green-500);outline-offset:5px}.canvas-bulk-bar{position:absolute;bottom:88px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;z-index:200010;padding:8px 10px;border-radius:12px;background:#161516f2;border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 12px 40px #00000073;font-family:var(--font);color:#ffffffd9;max-width:min(640px,calc(100vw - 32px))}.canvas-bulk-bar__count{font-size:.7rem;font-weight:600;padding:0 8px 0 4px;white-space:nowrap;color:var(--color-brand-green-500)}.canvas-bulk-bar__sep{width:1px;align-self:stretch;background:#ffffff1f;margin:2px}.canvas-bulk-bar__btn{display:inline-flex;align-items:center;gap:5px;font-size:.66rem;font-weight:500;font-family:var(--font);padding:6px 10px;border-radius:8px;cursor:pointer;background:#ffffff0f;color:inherit;border:1px solid rgba(255,255,255,.1);transition:background .12s,color .12s,border-color .12s;white-space:nowrap}.canvas-bulk-bar__btn svg{width:14px;height:14px}.canvas-bulk-bar__btn:hover:not(:disabled){background:#ffffff1f;color:#fff}.canvas-bulk-bar__btn:disabled{opacity:.4;cursor:default}.canvas-bulk-bar__btn.is-primary{background:var(--color-brand-green-500);color:#0a0a0a;border-color:var(--color-brand-green-500)}.canvas-bulk-bar__btn.is-primary:hover:not(:disabled){filter:brightness(1.08);color:#0a0a0a}.canvas-bulk-bar__btn.is-danger{color:#ef4444d9}.canvas-bulk-bar__btn.is-danger:hover:not(:disabled){background:#ef44441f;color:#f87171}.artboard:has(.artboard-styleguide-badge.is-styleguide){outline:3px solid transparent;outline-offset:5px;box-shadow:0 2px 12px rgba(var(--color-brand-purple-rgb),.12),0 2px 12px rgba(var(--color-brand-green-rgb),.06)}.artboard:has(.artboard-styleguide-badge.is-styleguide):before{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:14px;padding:3px;background:linear-gradient(135deg,#8255ff 0%,#40b0d0 50%,var(--color-brand-green-500) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:-1}.artboard:has(.artboard-styleguide-badge.is-styleguide):hover:before{background:linear-gradient(135deg,#a87cff,#5ec8e0,#d4ff5e)}.artboard-styleguide-dropdown{z-index:200002;background:var(--solid, #1a1a1e);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:4px;min-width:160px;max-height:280px;overflow-y:auto;box-shadow:0 12px 40px #00000073}.artboard-styleguide-dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 10px;border:none;background:none;color:#ffffff8c;font-size:12px;font-family:var(--font);cursor:pointer;border-radius:7px;transition:background .12s,color .12s}.artboard-styleguide-dropdown-item:hover{background:#ffffff14;color:#fff}.artboard-styleguide-dropdown-item.is-active{color:#c09aff}.artboard-styleguide-dropdown-item.is-active svg{fill:#c09aff;stroke:#c09aff}.artboard-iframe{width:100%;border:none;pointer-events:none;transform-origin:0 0;border-radius:10px}.artboard.entered .artboard-iframe{pointer-events:auto}.workspace-fullscreen{position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;height:100%!important;border:none!important;border-radius:0!important;pointer-events:auto!important;transform:none!important}.annotation-overlay.preview-active .annotation-navigator,.annotation-overlay.preview-active .annotation-sidebar,.annotation-overlay.preview-active .annotation-var-panel,.annotation-overlay.preview-active .annotation-status,.annotation-overlay.preview-active .annotation-hover-box,.annotation-overlay.preview-active .annotation-select-box,.annotation-overlay.preview-active .annotation-svg-shape-box,.annotation-overlay.preview-active .annotation-select-bubbles,.annotation-overlay.preview-active .annotation-tooltip{display:none!important}.annotation-overlay.preview-active .dock-wrap{opacity:0;transition:opacity .3s}.annotation-overlay.preview-active .dock-wrap:hover{opacity:1}.annotation-breadcrumb-container{flex-shrink:0}.annotation-breadcrumb{width:100%;flex-shrink:0;z-index:100009;display:flex;align-items:center;justify-content:space-between;padding:5px 16px;height:32px;box-sizing:border-box;background:#161516e6;border-bottom:1px solid rgba(255,255,255,.06);font-family:var(--font);font-size:11px;gap:12px}.breadcrumb-left{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow:visible;white-space:nowrap}.breadcrumb-brand{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-right:6px;opacity:.95}.breadcrumb-brand__mark{display:block;width:15px;height:auto}.breadcrumb-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.breadcrumb-exit{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:4px;background:var(--el-up);border:none;color:#fff6;cursor:pointer;transition:all .12s;flex-shrink:0;padding:0;margin-right:8px}.breadcrumb-exit:hover{color:#fff;background:#ffffff1f}.breadcrumb-mode-label{font-size:11px;font-weight:400;color:#fff6;white-space:nowrap}.canvas-notification{position:fixed;bottom:var(--above-dock);left:50%;transform:translate(-50%);z-index:var(--ui-layer-toast);display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:10px;background:var(--solid);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--ui-color-border-subtle);box-shadow:var(--ui-shadow-lg);animation:notif-in .3s ease-out}@keyframes notif-in{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.canvas-notification.annotation-tag-bubble{bottom:auto;left:auto;transform:none;animation:annotation-tag-bubble-in .22s ease-out;max-width:min(380px,calc(100vw - 24px));pointer-events:auto}@keyframes annotation-tag-bubble-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.annotation-action-tab{position:fixed;z-index:100005;display:inline-flex;align-items:stretch;background:var(--tab-bg, var(--color-brand-purple-500));color:var(--ui-color-text-inverse);border:2px solid var(--tab-bg, var(--color-brand-purple-500));border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:var(--ui-radius-3);border-bottom-right-radius:var(--ui-radius-3);font-family:var(--ui-font-family-sans);font-size:var(--ui-font-size-body-sm);font-weight:var(--ui-font-weight-semibold);line-height:1;overflow:hidden;pointer-events:auto;animation:annotation-action-tab-in .14s cubic-bezier(.16,1,.3,1)}@keyframes annotation-action-tab-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.annotation-action-tab--component,.annotation-action-tab--form{--tab-bg: var(--color-brand-green-500)}.annotation-action-tab--cms{--tab-bg: #d946ef}.annotation-action-tab--skip{--tab-bg: #dc2626}.annotation-action-tab__btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:28px;padding:0 10px;background:transparent;color:var(--ui-color-text-inverse);border:0;border-radius:0;font:inherit;cursor:pointer;transition:background .12s}.annotation-action-tab__btn:hover{background:#00000024}.annotation-action-tab__btn svg{flex-shrink:0;display:block}.annotation-action-tab--skip .annotation-action-tab__btn{color:#fff}.annotation-action-tab--skip .annotation-action-tab__btn:hover{background:#ffffff24}.annotation-action-tab__sep{display:inline-block;width:1px;background:#00000038;margin:4px 0}.annotation-action-tab--skip .annotation-action-tab__sep{background:#ffffff38}.annotation-action-tab__close{padding:0 8px}.annotation-tag-bubble .canvas-notif-title{font-family:var(--mono);font-size:11px}.annotation-tag-bubble .canvas-notif-btn.canvas-notif-btn--primary.annotation-tag-bubble-btn-ok{min-width:38px;padding:5px 10px}.canvas-notif-icon{width:28px;height:28px;border-radius:var(--ui-radius-soft, 6px);background:#ffffff1a;color:var(--ui-color-text);display:flex;align-items:center;justify-content:center;flex-shrink:0}.canvas-notif-text{display:flex;flex-direction:column}.canvas-notif-title{font-size:12px;font-weight:600;color:var(--ui-color-text)}.canvas-notif-sub{font-size:10px;color:#fff6}.canvas-notif-btn{padding:5px 12px;border-radius:6px;background:var(--el-up);color:#fff9;font-size:11px;font-weight:500;cursor:pointer;transition:all .12s;white-space:nowrap;border:1px solid rgba(255,255,255,.08)}.canvas-notif-btn:hover{background:#ffffff1a;color:#fff}.canvas-notif-btn--primary{background:var(--color-brand-green-500);border-color:rgba(var(--color-brand-green-rgb),.45);color:var(--ui-color-text-inverse)}.canvas-notif-btn--primary:hover{background:var(--color-success-600);border-color:rgba(var(--color-brand-green-rgb),.55);color:var(--ui-color-text-inverse)}.canvas-notif-close{background:none;border:none;color:#ffffff40;font-size:16px;cursor:pointer;padding:0 2px}.canvas-notif-close:hover{color:#fff}.breadcrumb-convert-btn,.breadcrumb-save-btn,.breadcrumb-save-page-btn,.breadcrumb-export-btn{display:flex;align-items:center;gap:3px;padding:2px 8px;font-size:9px;border-radius:var(--ui-radius-soft);border:1px solid transparent;background:transparent;color:#ffffff4d;font-family:var(--font);cursor:pointer;transition:all .12s;flex-shrink:0}.breadcrumb-convert-btn:hover,.breadcrumb-save-btn:hover,.breadcrumb-save-page-btn:hover,.breadcrumb-export-btn:hover{color:#fff9}.breadcrumb-convert-btn:active,.breadcrumb-save-btn:active,.breadcrumb-save-page-btn:active,.breadcrumb-export-btn:active{border-color:#ffffff26;color:#fff;background:var(--el-up)}.breadcrumb-export-btn:hover{background:var(--el-active);color:#fff}.breadcrumb-page-dropdown{position:relative;display:flex;align-items:center;gap:4px;cursor:pointer;padding:2px 6px;border-radius:4px;transition:background .12s}.breadcrumb-page-dropdown:hover{background:var(--el-up)}.breadcrumb-page{font-size:11px;font-weight:600;color:#fff9;white-space:nowrap}.breadcrumb-page-arrow{color:#ffffff4d;flex-shrink:0}.breadcrumb-page-menu{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;background:var(--solid-up);border:1px solid rgba(255,255,255,.08);border-radius:8px;box-shadow:0 8px 24px #0006;max-height:300px;overflow-y:auto;z-index:200000;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:4px 0}.breadcrumb-page-item{padding:6px 12px;font-size:12px;color:#ffffff80;cursor:pointer;transition:all .1s}.breadcrumb-page-item:hover{background:var(--el-hover);color:#fff}.breadcrumb-page-item.active{color:var(--color-brand-purple-500);font-weight:600}.breadcrumb-sep-v{width:1px;height:14px;background:#ffffff1a;flex-shrink:0}.breadcrumb-sites-dropdown{position:relative;margin-right:4px}.breadcrumb-sites-btn{display:flex;align-items:center;gap:3px;padding:3px 6px;border-radius:5px;border:none;background:transparent;color:#fff6;cursor:pointer;transition:all .12s;font-size:10px}.breadcrumb-sites-btn:hover{background:var(--el-up);color:#ffffffb3}.breadcrumb-sites-arrow{color:#ffffff4d;flex-shrink:0}.breadcrumb-sites-menu{position:absolute;top:calc(100% + 4px);left:0;min-width:200px;background:var(--solid-up);border:1px solid rgba(255,255,255,.08);border-radius:8px;box-shadow:0 8px 24px #0006;max-height:300px;overflow-y:auto;z-index:200000;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:4px 0}.breadcrumb-sites-item{padding:8px 12px;font-size:12px;color:#ffffff80;cursor:pointer;transition:all .1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.breadcrumb-sites-item:hover{background:var(--el-hover);color:#fff}.breadcrumb-page-menu::-webkit-scrollbar,.breadcrumb-sites-menu::-webkit-scrollbar{width:10px}.breadcrumb-page-menu::-webkit-scrollbar-track,.breadcrumb-sites-menu::-webkit-scrollbar-track{background:transparent;margin:4px 0}.breadcrumb-page-menu::-webkit-scrollbar-thumb,.breadcrumb-sites-menu::-webkit-scrollbar-thumb{background:var(--ui-color-border-subtle, rgba(255,255,255,.12));background-clip:padding-box;border:3px solid transparent;border-radius:6px}.view-toggle{position:relative;display:inline-flex;background:#2e2e32;border-radius:var(--ui-radius-soft);padding:2px}.view-toggle-pill{position:absolute;top:2px;left:2px;height:calc(100% - 4px);border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);transition:left .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1);pointer-events:none}.view-btn{position:relative;z-index:1;padding:3px 10px;font-size:9px;border-radius:var(--ui-radius-soft);cursor:pointer;background:transparent;color:#ffffff59;border:none;font-family:var(--font);font-weight:500;transition:color .15s;white-space:nowrap}.view-btn:hover{color:#ffffffb3}.view-btn.active{color:var(--ui-color-text-inverse);font-weight:600}.breakpoint-bar{display:inline-flex;align-items:stretch;gap:0;padding:2px;background:#2e2e32;border-radius:var(--ui-radius-soft)}.bp-pill{padding:2px 8px;font-size:9px;border-radius:0;cursor:pointer;background:transparent;color:#ffffff59;border:none;font-family:var(--font);transition:all .12s}.bp-pill:first-child{border-top-left-radius:var(--ui-radius-soft);border-bottom-left-radius:var(--ui-radius-soft)}.bp-pill:last-child{border-top-right-radius:var(--ui-radius-soft);border-bottom-right-radius:var(--ui-radius-soft)}.bp-pill:hover{color:#ffffffbf}.bp-pill.active{color:#fff;background:#3a3a3f;font-weight:600}.zoom-controls{display:flex;align-items:center;gap:2px}.zoom-btn{width:24px;height:20px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid rgba(255,255,255,.08);border-radius:4px;color:#fff6;cursor:pointer;font-size:12px;transition:all .12s}.zoom-btn:hover{border-color:#fff3;color:#fff}.zoom-fit{width:auto;padding:0 6px;font-size:9px}.zoom-label{font-size:10px;color:#fff6;min-width:36px;text-align:center;font-family:var(--mono, monospace)}.annotation-var-panel{width:300px;flex-shrink:0;display:flex;flex-direction:column;background:var(--solid-up);border-left:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.var-panel-header{padding:10px 14px;font-size:12px;font-weight:600;color:#fff9;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:8px}.var-panel-count{font-size:10px;color:#ffffff40;font-weight:400;margin-right:auto}.var-panel-close{background:none;border:none;color:#ffffff4d;font-size:16px;cursor:pointer}.var-panel-close:hover{color:#fff}.var-search{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.04)}.var-search input{width:100%;padding:7px 10px;background:var(--el);border:1px solid rgba(255,255,255,.06);border-radius:6px;color:#fff;font-size:11px;outline:none;transition:border-color .15s}.var-search input::placeholder{color:#fff3}.var-search input:focus{border-color:#ffffff26;background:var(--el-hover)}.var-list{flex:1;overflow-y:auto}.var-group{border-bottom:1px solid rgba(255,255,255,.04)}.var-group-header{padding:10px 14px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#ffffff80;font-weight:600;cursor:pointer;display:flex;align-items:center;-webkit-user-select:none;user-select:none;border-bottom:1px solid rgba(255,255,255,.03);transition:all .12s}.var-group-header:hover{color:#fffc;background:var(--el)}.var-group-header:before{content:"▸";margin-right:8px;font-size:9px;transition:transform .15s;color:#ffffff40}.var-group.open .var-group-header:before{transform:rotate(90deg)}.var-group-count{font-size:9px;opacity:.4;margin-left:auto}.var-group-body{display:none;padding:4px 8px 8px}.var-group.open .var-group-body{display:block}.var-row{display:flex;align-items:center;gap:8px;padding:5px 6px;cursor:pointer;border-radius:6px;font-size:11px;transition:background .1s}.var-row:hover{background:var(--el-up)}.var-row-highlight{background:#2e1a4a!important;animation:var-flash 1.5s ease-out}@keyframes var-flash{0%{background:var(--color-brand-purple-500)}to{background:var(--el)}}.var-name{flex:1;color:#ffffff8c;font-size:11px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.var-value{max-width:90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;color:#ffffff4d;font-family:var(--mono, monospace)}.var-swatch,.var-swatch-canvas{width:20px;height:20px;border-radius:5px;flex-shrink:0;border:1px solid rgba(255,255,255,.12)}.var-popup-swatch-canvas{width:100%;height:100%;border-radius:inherit;display:block}.var-type-icon{flex-shrink:0;color:#ffffff40;display:flex;align-items:center;width:20px;justify-content:center}.var-popup{position:fixed;z-index:200000;min-width:260px;background:var(--solid-up);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 12px 40px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.var-popup-header{padding:12px 14px;font-size:12px;font-weight:500;color:#ffffffb3;border-bottom:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center}.var-popup-close{cursor:pointer;opacity:.4;font-size:14px;background:none;border:none;color:inherit}.var-popup-close:hover{opacity:1}.var-popup-body{padding:12px 14px}.var-popup-meta{display:flex;align-items:center;gap:8px;margin-bottom:10px}.var-popup-collection{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff4d;background:var(--el-hover);padding:2px 6px;border-radius:3px}.var-popup-css-name{font-size:9px;color:#fff3;font-family:var(--mono, monospace);word-break:break-all}.var-popup-name{font-size:12px;font-weight:500;color:#ffffffb3}.var-popup-color-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}.var-popup-formula{padding:8px 10px;margin-bottom:8px;background:var(--el);border:1px solid rgba(255,255,255,.06);border-radius:6px;font-size:11px;line-height:1.8;font-family:var(--mono, monospace);color:#ffffff80;word-break:break-all}.var-formula-text{color:#ffffff80}.var-ref-pill{display:inline-flex;align-items:center;padding:1px 7px;border-radius:var(--ui-radius-soft);margin:0 1px;background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-size:10px;cursor:pointer;font-weight:500;transition:all .12s;vertical-align:middle;border:none}.var-ref-pill:hover{background:var(--color-pro-600);color:var(--ui-color-text-inverse)}.var-popup-resolved{display:flex;align-items:baseline;gap:6px;padding:6px 10px;margin-bottom:8px;background:var(--el);border-radius:4px}.var-popup-resolved-label{font-size:9px;color:#ffffff40;text-transform:uppercase;letter-spacing:.06em;flex-shrink:0}.var-popup-resolved-value{font-size:10px;color:#fff6;font-family:var(--mono, monospace);word-break:break-all}.var-popup-value-row{margin-bottom:10px}.var-popup-actions{display:flex;justify-content:flex-end}.var-popup-apply{padding:5px 16px;border-radius:6px;font-size:11px;font-weight:600;background:var(--el-up);border:1px solid rgba(255,255,255,.1);color:#ffffffb3;cursor:pointer;transition:all .12s}.var-popup-apply:hover{background:#ffffff1a;color:#fff}.var-popup-preview{display:flex;align-items:center;gap:8px;margin-bottom:8px}.var-popup-swatch-wrap,.var-popup-swatch-trigger{position:relative;width:36px;height:36px;border-radius:8px;flex-shrink:0;overflow:hidden;cursor:pointer;border:1px solid rgba(255,255,255,.1);transition:border-color .12s}.var-popup-swatch-trigger:hover{border-color:#ffffff40}.var-popup-swatch-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%),linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%);background-size:8px 8px;background-position:0 0,4px 4px}.var-popup-swatch-color{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit}.var-popup-color-picker{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;border:none}.cp-picker{position:fixed;z-index:300000;width:240px;background:var(--solid-up);border:1px solid rgba(255,255,255,.1);border-radius:10px;box-shadow:0 12px 40px #00000080;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden;-webkit-user-select:none;user-select:none}.cp-canvas-wrap{position:relative;width:100%;height:150px;cursor:crosshair}.cp-canvas{display:block;width:100%;height:100%}.cp-canvas-cursor{position:absolute;width:12px;height:12px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 0 1px #0000004d,inset 0 0 0 1px #0000004d}.cp-sliders{padding:10px 10px 6px;display:flex;flex-direction:column;gap:8px}.cp-slider{position:relative;height:14px;border-radius:7px;overflow:hidden;cursor:pointer}.cp-hue-canvas,.cp-opacity-canvas{display:block;width:100%;height:100%;border-radius:7px}.cp-slider-cursor{position:absolute;top:50%;width:6px;height:14px;background:#fff;border-radius:3px;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d,0 1px 3px #0006;pointer-events:none}.cp-preview-row{padding:8px 10px 10px;display:flex;align-items:flex-start;gap:8px}.cp-preview-swatch{position:relative;width:32px;height:32px;border-radius:6px;flex-shrink:0;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.cp-preview-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%),linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%);background-size:6px 6px;background-position:0 0,3px 3px}.cp-preview-color{position:absolute;top:0;right:0;bottom:0;left:0}.cp-inputs{flex:1;display:flex;flex-direction:column;gap:6px}.cp-mode-toggle{display:flex;border:1px solid rgba(255,255,255,.06);border-radius:5px;overflow:hidden}.cp-mode-btn{flex:1;padding:3px 0;border:none;background:transparent;color:#ffffff4d;font-size:9px;font-weight:600;cursor:pointer;transition:all .1s;border-right:1px solid rgba(255,255,255,.04)}.cp-mode-btn:last-child{border-right:none}.cp-mode-btn:hover{color:#fff9}.cp-mode-btn.active{color:#fff;background:var(--el-active)}.cp-mode-inputs{display:none}.cp-mode-inputs.active{display:block}.cp-input-row{display:flex;gap:4px}.cp-input-group{display:flex;flex-direction:column;align-items:center;flex:1}.cp-input-group label{font-size:8px;color:#ffffff40;margin-top:3px;text-transform:uppercase;letter-spacing:.06em}.cp-input-group input{width:100%;padding:4px;text-align:center;background:var(--el-hover);border:1px solid rgba(255,255,255,.08);border-radius:4px;color:#fff;font-size:10px;font-family:var(--mono, monospace);outline:none}.cp-input-group input:focus{border-color:#fff3}.cp-input-sm{flex:1}.cp-input-wide{flex:2}.var-popup-row{display:flex;align-items:center;gap:8px}.var-popup-row label{font-size:10px;color:#ffffff59;min-width:40px}.var-popup-input{flex:1;padding:5px 8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.08);border-radius:4px;color:#fff;font-size:11px;font-family:var(--mono, monospace);outline:none}.var-popup-input:focus{border-color:#fff3}.var-popup-color{width:28px;height:28px;border:none;padding:0;cursor:pointer;border-radius:4px}.preview-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200000;background:var(--bg, #161516);display:flex;flex-direction:column}.preview-toolbar{height:36px;display:flex;align-items:center;gap:12px;padding:0 16px;background:var(--el);border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0}.preview-title{font-size:12px;font-weight:600;color:#ffffff80}.preview-page-dropdown{flex:1;position:relative}.preview-url{padding:4px 12px;background:var(--el-hover);border:1px solid rgba(255,255,255,.06);border-radius:var(--ui-radius-soft);color:#fff6;font-size:11px;text-align:center;cursor:pointer;font-family:var(--font)}.preview-page-menu{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:var(--solid-up);border:1px solid rgba(255,255,255,.08);border-radius:8px;max-height:300px;overflow-y:auto;z-index:10}.preview-page-item{padding:6px 14px;font-size:12px;cursor:pointer;color:#ffffff80}.preview-page-item:hover{background:var(--el-hover);color:#fff}.preview-bp{display:inline-flex;align-items:stretch;gap:0;padding:2px;background:#2e2e32;border-radius:var(--ui-radius-soft)}.preview-bp button{padding:2px 8px;font-size:9px;border-radius:0;cursor:pointer;background:transparent;color:#ffffff59;border:none}.preview-bp button:first-child{border-top-left-radius:var(--ui-radius-soft);border-bottom-left-radius:var(--ui-radius-soft)}.preview-bp button:last-child{border-top-right-radius:var(--ui-radius-soft);border-bottom-right-radius:var(--ui-radius-soft)}.preview-bp button:hover{color:#ffffffbf}.preview-bp button.active{color:#fff;background:#3a3a3f;font-weight:600}.preview-close-btn{padding:4px 12px;background:var(--el-hover);border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#ffffff80;font-size:11px;cursor:pointer}.preview-close-btn:hover{color:#fff;border-color:#fff3}.preview-frame-wrap{flex:1;display:flex;justify-content:center;overflow:auto}.preview-iframe{border:none;height:100%;background:#fff;transition:width .2s;width:100%}.prop-classes-row{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.prop-class-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 5px 2px 8px;border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-size:11px;font-weight:600;font-family:var(--mono, monospace);border:none}.prop-class-pill--component{background:var(--color-brand-green-500);color:#161516;padding:2px 8px}.prop-class-name{cursor:text}.prop-class-name:hover{text-decoration:underline;text-underline-offset:2px}.prop-class-remove{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;padding:0;border:none;border-radius:3px;background:#0000002e;color:inherit;font-size:12px;line-height:1;cursor:pointer;opacity:.7}.prop-class-remove:hover{background:#00000061;opacity:1}.prop-class-edit{padding:2px 8px;border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-size:11px;font-weight:600;font-family:var(--mono, monospace);border:1px solid rgba(255,255,255,.6);outline:none;width:9ch;min-width:6ch}.prop-class-add-wrap{display:inline-flex;position:relative}.prop-class-add{padding:2px 8px;border-radius:var(--ui-radius-soft);background:#ffffff0d;color:#ffffffd9;border:1px dashed rgba(255,255,255,.2);font-size:11px;font-family:var(--mono, monospace);width:7ch;transition:width .15s,border-color .12s}.prop-class-add::placeholder{color:#fff6}.prop-class-add:focus{outline:none;width:12ch;border-color:var(--color-brand-purple-500)}.prop-class-add-menu{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;max-width:240px;background:var(--solid-up);border:1px solid rgba(255,255,255,.08);border-radius:8px;box-shadow:0 8px 24px #0006;max-height:240px;overflow-y:auto;z-index:200000;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:4px 0}.prop-class-add-menu[hidden]{display:none}.prop-class-add-option{padding:6px 12px;font-size:12px;color:#ffffff80;font-family:var(--mono, monospace);cursor:pointer;transition:all .1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prop-class-add-option:hover{background:var(--el-hover);color:#fff}.prop-class-add-option[hidden]{display:none}.prop-class-add-menu::-webkit-scrollbar{width:10px}.prop-class-add-menu::-webkit-scrollbar-track{background:transparent;margin:4px 0}.prop-class-add-menu::-webkit-scrollbar-thumb{background:var(--ui-color-border-subtle, rgba(255,255,255,.12));background-clip:padding-box;border:3px solid transparent;border-radius:6px}.prop-state-bar{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06)}.prop-state-chip{height:24px;box-sizing:border-box;padding:0 9px;border-radius:5px;border:1px solid rgba(255,255,255,.08);background:var(--el-hover);color:#ffffff80;font-size:10.5px;font-weight:500;cursor:pointer;font-family:var(--sans);transition:all .12s;display:inline-flex;align-items:center}.prop-state-chip:hover{background:var(--el);color:#ffffffd9;border-color:#ffffff26}.prop-state-chip.active{background:var(--color-brand-purple-500);border-color:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-weight:600}.prop-bp-bar.prop-toggle-group{flex-wrap:wrap;height:auto;overflow:visible;border:none;background:transparent;padding:0;gap:3px;margin:0 0 4px}.prop-bp-bar .prop-bp-chip,.prop-bp-bar .prop-bp-add{flex:0 0 auto;min-width:0;height:22px;padding:0 7px;border-radius:5px;border:1px solid rgba(255,255,255,.08);background:var(--el-hover);color:#ffffff80;font-size:10px;font-weight:500;display:inline-flex;align-items:center;gap:4px}.prop-bp-bar .prop-bp-chip:hover,.prop-bp-bar .prop-bp-add:hover{color:#ffffffd9;border-color:#ffffff29}.prop-bp-add{color:#fff6;font-size:13px;line-height:1;padding:0 8px}.prop-bp-x{opacity:.55;font-size:12px;line-height:1;margin-left:1px}.prop-bp-x:hover{opacity:1}.prop-bp-chip--custom{border-color:rgba(var(--color-responsive-rgb),.45)}.prop-bp-chip--custom:hover{border-color:var(--color-responsive-500)}.prop-bp-note{margin:0 0 10px;font-size:9.5px;font-weight:500;color:#ffffff52;font-family:var(--sans)}.prop-bp-note.responsive{color:var(--color-responsive-500)}.prop-bp-note.embed{color:var(--color-responsive-500);font-weight:600}.prop-bp-chip.active{background:var(--color-brand-purple-500);border-color:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}.prop-bp-bar:has(+.prop-bp-note.responsive) .prop-bp-chip.active,.prop-bp-bar:has(+.prop-bp-note.embed) .prop-bp-chip.active{background:var(--color-responsive-500);border-color:var(--color-responsive-500);color:var(--color-neutral-950)}.prop-bp-popover{z-index:2147483000;width:230px;padding:10px;background:var(--solid-up, #1f1e22);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 8px 28px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-family:var(--font, system-ui, sans-serif)}.prop-bp-popover-row{display:flex;gap:6px;align-items:stretch;margin-bottom:8px}.prop-bp-popover-width{width:64px;flex:0 0 auto;height:26px;box-sizing:border-box;padding:0 8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.1);border-radius:5px;color:#fff;font-size:11px;outline:none;font-family:var(--mono, monospace)}.prop-bp-popover-width:focus{border-color:var(--color-brand-purple-500)}.prop-bp-popover-dir{flex:1;height:26px}.prop-bp-popover-dir .prop-toggle-btn{font-size:10px}.prop-bp-popover-hint{font-size:10px;line-height:1.4;color:#ffffff73;margin-bottom:10px}.prop-bp-popover-hint.embed{color:var(--color-responsive-500)}.prop-bp-popover-actions{display:flex;justify-content:flex-end;gap:6px}.prop-bp-popover-actions button{height:26px;padding:0 12px;border-radius:5px;font-size:11px;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:transparent;color:#ffffffb3}.prop-bp-popover-cancel:hover{background:#ffffff14;color:#fff}.prop-bp-popover-add{background:var(--color-brand-purple-500)!important;border-color:var(--color-brand-purple-500)!important;color:var(--ui-color-text-inverse)!important;font-weight:600}.prop-rt-row{display:flex;align-items:center;gap:8px;margin:0 0 4px}.prop-rt-toggle{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:5px;border:1px solid rgba(255,255,255,.08);background:var(--el-hover);color:#ffffff8c;font-size:10.5px;font-weight:500;cursor:pointer;font-family:var(--sans);transition:all .12s}.prop-rt-toggle svg{opacity:.8}.prop-rt-toggle:hover{color:#ffffffe6;border-color:#ffffff29}.prop-rt-toggle.active{background:var(--color-responsive-500);border-color:var(--color-responsive-500);color:var(--color-neutral-950);font-weight:600}.prop-rt-toggle.active svg{opacity:1}.prop-rt-dots{display:inline-flex;align-items:center;gap:4px}.prop-rt-dot{width:6px;height:6px;border-radius:50%;background:#ffffff24}.prop-rt-dot.on{background:var(--color-responsive-500)}.prop-bp-pill{flex:1;min-width:0;display:inline-flex;align-items:center;height:var(--pi-ctl-h, 28px);box-sizing:border-box;padding:0 9px;border-radius:5px;background:var(--color-responsive-500);color:var(--color-neutral-950);font-size:11px;font-weight:600;font-family:var(--mono, monospace);cursor:pointer;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prop-bp-pill:hover{background:var(--color-responsive-600)}.prop-bp-override-field .box-val-input,.box-val-input.prop-bp-override-field{color:var(--color-responsive-500)!important;font-weight:700;box-shadow:inset 0 0 0 1px var(--color-responsive-500);border-radius:4px}.prop-bp-override-field{cursor:pointer}.prop-bp-val-note{font-size:10px;color:#ffffff73;line-height:1.4}.prop-bp-inherited .prop-input,.prop-bp-inherited .prop-select,.prop-bp-inherited .prop-c-input{color:var(--color-responsive-500);box-shadow:inset 0 0 0 1px var(--color-responsive-500);border-radius:4px}.prop-bp-inherited .prop-color-swatch{box-shadow:inset 0 0 0 2px var(--color-responsive-500)}.prop-toggle-btn.prop-bp-inherited-btn.active{background:var(--color-responsive-500);color:var(--color-neutral-950)}.prop-bp-dot{flex:none;width:5px;height:5px;border-radius:50%;background:var(--color-responsive-500);margin:0 4px 0 5px;align-self:center}.box-val-wrap.prop-bp-has-variants{position:relative}.box-val-wrap.prop-bp-has-variants:after{content:"";position:absolute;top:3px;right:3px;width:5px;height:5px;border-radius:50%;background:var(--color-responsive-500);pointer-events:none}.prop-bp-val-popover{z-index:2147483000;width:220px;padding:10px;background:var(--solid-up, #1f1e22);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 8px 28px #00000080;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-family:var(--font, system-ui, sans-serif)}.prop-bp-val-head{display:flex;align-items:center;gap:6px;margin-bottom:8px}.prop-bp-tag{display:inline-flex;align-items:center;padding:1px 7px;border-radius:4px;background:var(--color-responsive-500);color:var(--color-neutral-950);font-size:9.5px;font-weight:700;letter-spacing:.02em}.prop-bp-val-prop{font-size:10px;color:#ffffff80;font-family:var(--mono, monospace);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prop-bp-val-input{width:100%;box-sizing:border-box;height:28px;padding:0 8px;margin-bottom:8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.1);border-radius:5px;color:#fff;font-size:11px;font-family:var(--mono, monospace);outline:none}.prop-bp-val-input:focus{border-color:var(--color-responsive-500)}.prop-bp-val-clear{width:100%;height:26px;border-radius:5px;cursor:pointer;font-size:10.5px;border:1px solid rgba(255,255,255,.12);background:transparent;color:#fff9}.prop-bp-val-clear:hover{color:#fff;border-color:#ffffff40;background:#ffffff0f}.prop-subhead{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff47;font-weight:600;margin:6px 0 4px}.prop-check{display:inline-flex;align-items:center}.prop-check input{width:14px;height:14px;cursor:pointer;accent-color:var(--color-brand-purple-500)}.prop-element-info{display:flex;align-items:center;gap:8px;margin-bottom:10px}.prop-tag{font-family:var(--mono, monospace);font-size:13px;font-weight:600;color:#ffffff80}.prop-dims{font-size:11px;color:#ffffff40}.prop-actions{display:flex;gap:6px;margin-bottom:14px}.prop-convert-btn,.prop-save-btn{display:flex;align-items:center;gap:4px;padding:4px 12px;border-radius:6px;background:#ffffff0a;color:#ffffff80;border:1px solid rgba(255,255,255,.08);font-size:11px;font-weight:500;cursor:pointer;transition:all .12s}.prop-convert-btn:hover,.prop-save-btn:hover{background:#ffffff14;color:#fff}.annotation-sidebar-content{--pi-ctl-h: 26px;--pi-label-w: 62px}.prop-section{border-bottom:1px solid rgba(255,255,255,.05);padding:0 0 3px}.prop-section:last-child{border-bottom:none}.prop-section-title{display:flex;align-items:center;gap:6px;font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;color:#ffffff6b;font-weight:600;padding:7px 2px 5px;margin:0;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .12s}.prop-section-title:hover{color:#ffffffbf}.prop-section-title:before{content:"›";display:inline-block;font-size:13px;line-height:1;color:#ffffff59;transition:transform .15s ease;transform:rotate(90deg);width:8px}.prop-section.collapsed .prop-section-title:before{transform:rotate(0)}.prop-section.collapsed>:not(.prop-section-title){display:none}.prop-row{display:flex;align-items:center;gap:6px;min-height:26px;margin-bottom:4px}.prop-row-wrap{flex-wrap:wrap}.prop-label{font-size:10.5px;color:#ffffff6b;width:var(--pi-label-w);flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prop-input{flex:1;height:var(--pi-ctl-h);box-sizing:border-box;padding:0 8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.07);border-radius:5px;color:#fff;font-size:11px;font-family:var(--mono, monospace);outline:none;min-width:0}.prop-input::placeholder{color:#ffffff47}.prop-input:focus{border-color:var(--color-brand-purple-500)}.prop-select{flex:1;height:var(--pi-ctl-h);box-sizing:border-box;padding:0 24px 0 8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.07);border-radius:5px;color:#fff;font-size:11px;font-family:var(--mono, monospace);outline:none;min-width:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='6' viewBox='0 0 8 6'><path d='M1 1l3 3 3-3' fill='none' stroke='%23ffffff' stroke-opacity='0.5' stroke-width='1.4'/></svg>");background-repeat:no-repeat;background-position:right 8px center}.prop-select:focus{border-color:var(--color-brand-purple-500)}.prop-select option{background:var(--solid, #1a1a1e);color:#fff}.fw-select{position:relative;display:flex;flex:1 1 auto;width:100%;min-width:0;max-width:100%;vertical-align:middle}.fw-select select[data-fw-enhanced]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;padding:0;border:0;clip:rect(0 0 0 0)}.fw-select .fw-select-trigger{flex:1 1 auto;width:100%;min-width:0;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:space-between;gap:6px;height:var(--pi-ctl-h, 28px);padding:0 8px;background:var(--el-hover);border:1px solid rgba(255,255,255,.07);border-radius:5px;color:#fff;font-size:11px;font-family:var(--mono, monospace);text-align:left;cursor:pointer;outline:none;background-image:none;-moz-appearance:none;appearance:none;-webkit-appearance:none}.fw-select .fw-select-trigger:hover{border-color:#ffffff29}.fw-select .fw-select-trigger.fw-select-open,.fw-select .fw-select-trigger:focus-visible{border-color:var(--color-brand-purple-500)}.fw-select .fw-select-trigger:disabled{opacity:.45;cursor:default}.fw-select .fw-select-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fw-select .fw-select-arrow{flex-shrink:0;color:#ffffff80;transition:transform .12s}.fw-select .fw-select-trigger.fw-select-open .fw-select-arrow{transform:rotate(180deg)}.fw-select-menu{background:var(--solid-up, #1f1e22);border:1px solid rgba(255,255,255,.08);border-radius:8px;box-shadow:0 8px 24px #0006;max-height:300px;overflow-y:auto;z-index:2147483000;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:4px 0;font-family:var(--font, system-ui, sans-serif)}.fw-select-item{padding:6px 12px;font-size:12px;color:#fff9;cursor:pointer;transition:background .1s,color .1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fw-select-item:hover,.fw-select-item.kbd{background:var(--el-hover);color:#fff}.fw-select-item.active{color:var(--color-brand-purple-500);font-weight:600}.fw-select-item.disabled{opacity:.4;cursor:default}.fw-select-menu::-webkit-scrollbar{width:10px}.fw-select-menu::-webkit-scrollbar-track{background:transparent;margin:4px 0}.fw-select-menu::-webkit-scrollbar-thumb{background:var(--ui-color-border-subtle, rgba(255,255,255,.12));background-clip:padding-box;border:3px solid transparent;border-radius:6px}.prop-num-wrap{position:relative;flex:1;display:flex;align-items:center;min-width:0;height:var(--pi-ctl-h)}.prop-num-wrap .prop-input{width:100%;padding-right:16px}.prop-num-arrows{position:absolute;right:2px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;gap:1px;opacity:0;transition:opacity .12s;pointer-events:none}.prop-num-wrap:hover .prop-num-arrows,.prop-num-wrap:focus-within .prop-num-arrows{opacity:1;pointer-events:auto}.prop-arrow-btn{width:13px;height:9px;padding:0;background:#ffffff12;border:none;border-radius:2px;color:#fff6;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .1s,color .1s}.prop-arrow-btn:hover{background:#ffffff2e;color:#fff}.prop-color-swatch{width:var(--pi-ctl-h);height:var(--pi-ctl-h);border:1px solid rgba(255,255,255,.12);border-radius:5px;cursor:pointer;flex-shrink:0;transition:border-color .12s}.prop-color-swatch:hover{border-color:#ffffff40}.prop-color-swatch--var{box-shadow:0 0 0 2px var(--color-brand-purple-500);cursor:default}.prop-color-swatch--var:hover{border-color:#ffffff1a}.prop-color-text{flex:1}.prop-color-text--var{opacity:.5;pointer-events:none;cursor:default}.prop-value-static{font-size:11px;color:#ffffff80;font-family:var(--mono, monospace)}.prop-value-dim{opacity:.4}.prop-value-computed{font-size:9px;color:#ffffff40;margin-left:4px;font-family:var(--mono, monospace)}.prop-img-src-row{gap:6px;align-items:center;padding:4px 0;min-height:unset}.prop-img-thumb{width:36px;height:36px;object-fit:contain;border-radius:4px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);flex-shrink:0}.prop-bg-preview{width:36px;height:36px;border-radius:4px;flex-shrink:0;background-color:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.prop-img-src-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-family:var(--mono, monospace);color:#ffffff73}.prop-upload-btn{flex-shrink:0;display:flex;align-items:center;gap:4px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:4px;padding:4px 6px;color:#fff9;cursor:pointer;font-size:10px;transition:background .12s,color .12s}.prop-upload-btn:hover{background:#ffffff1f;color:#fff}.prop-upload-btn--text{padding:4px 8px}.prop-bg-remove-btn{flex-shrink:0;display:flex;align-items:center;justify-content:center;background:none;border:1px solid rgba(255,255,255,.08);border-radius:4px;padding:4px 5px;color:#ffffff59;cursor:pointer;transition:color .12s,background .12s}.prop-bg-remove-btn:hover{color:#f87171;background:#f871711a;border-color:#f871714d}.prop-pos-grid{display:flex;flex-direction:column;gap:2px}.prop-pos-row{display:flex;gap:2px}.prop-pos-cell{width:14px;height:14px;border-radius:2px;cursor:pointer;background:#ffffff12;border:1px solid rgba(255,255,255,.1);transition:background .1s,border-color .1s}.prop-pos-cell:hover{background:#ffffff26;border-color:#ffffff40}.prop-pos-cell.active{background:#7c3aed;border-color:#a855f7}.spacing-box-model{padding:4px 0}.box-margin{position:relative;padding:8px;background:var(--el);border:1px dashed rgba(255,255,255,.08);border-radius:6px}.box-padding{position:relative;padding:8px;background:var(--el);border:1px dashed rgba(255,255,255,.1);border-radius:4px;flex:1}.box-content{height:16px;flex:1;background:#1e1a28;border:1px solid var(--color-brand-purple-500);border-radius:2px}.box-label{position:absolute;top:2px;left:6px;font-size:8px;letter-spacing:.08em;color:#fff3;text-transform:uppercase;pointer-events:none}.box-margin>.box-top,.box-margin>.box-bottom,.box-padding>.box-top,.box-padding>.box-bottom{display:flex;justify-content:center;padding:2px 0;cursor:ns-resize;-webkit-user-select:none;user-select:none}.box-margin>.box-middle,.box-padding>.box-middle{display:flex;align-items:center}.box-margin>.box-middle>.box-left,.box-margin>.box-middle>.box-right,.box-padding>.box-middle>.box-left,.box-padding>.box-middle>.box-right{display:flex;align-items:center;justify-content:center;min-width:28px;padding:0 2px;cursor:ns-resize;-webkit-user-select:none;user-select:none}.box-margin>.box-top input,.box-margin>.box-bottom input,.box-margin>.box-middle>.box-left input,.box-margin>.box-middle>.box-right input,.box-padding>.box-top input,.box-padding>.box-bottom input,.box-padding>.box-middle>.box-left input,.box-padding>.box-middle>.box-right input{cursor:inherit}.box-val-input{width:32px;text-align:center;background:transparent;border:1px solid transparent;color:#ffffff80;font-size:10px;font-family:var(--mono, monospace);padding:1px 2px;border-radius:3px;outline:none}.box-val-input:hover{border-color:#ffffff1a}.box-val-input:focus{border-color:rgba(var(--color-brand-purple-rgb),.5);color:#fff;background:rgba(var(--color-brand-purple-rgb),.08)}.box-val-var{display:inline-block;padding:1px 4px;border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-size:8px;cursor:pointer;font-family:var(--mono, monospace);white-space:nowrap;transition:background .12s;max-width:50px;overflow:hidden;text-overflow:ellipsis;border:none}.box-val-var:hover{background:var(--color-pro-600);color:var(--ui-color-text-inverse)}.box-val-wrap{position:relative;display:inline-flex;align-items:center}.box-val-wrap .var-link-btn.var-link-sm{position:absolute;top:-5px;right:-5px;width:13px;height:13px;border-radius:3px;padding:0;opacity:0;pointer-events:none;z-index:1}.box-val-wrap:hover .var-link-btn.var-link-sm{opacity:1;pointer-events:auto}.box-var-wrap{position:relative;display:inline-flex;align-items:center}.box-var-wrap .var-unlink-btn.var-unlink-sm{position:absolute;top:-5px;right:-5px;width:13px;height:13px;border-radius:3px;padding:0;opacity:0;pointer-events:none;z-index:1;color:#fff6}.box-var-wrap:hover .var-unlink-btn.var-unlink-sm{opacity:1;pointer-events:auto}.box-var-wrap .var-unlink-btn.var-unlink-sm:hover{color:#fffc}.prop-toggle-group{display:flex;flex:1;height:var(--pi-ctl-h);box-sizing:border-box;padding:2px;gap:2px;background:var(--el-hover);border:1px solid rgba(255,255,255,.07);border-radius:6px}.prop-toggle-btn{flex:1;min-width:0;padding:0 4px;border:none;background:transparent;border-radius:4px;color:#ffffff73;font-size:9.5px;cursor:pointer;transition:background .12s,color .12s;display:flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prop-toggle-btn:hover{color:#fffc;background:#ffffff0f}.prop-toggle-btn.active{color:var(--ui-color-text-inverse);background:var(--color-brand-purple-500);font-weight:600;box-shadow:0 1px 3px #00000040}.prop-toggle-sm .prop-toggle-btn{font-size:9px}.prop-toggle-icons .prop-toggle-btn{padding:0}.prop-toggle-icons .prop-toggle-btn svg{opacity:.85}.prop-toggle-icons .prop-toggle-btn.active svg{opacity:1}.var-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);border:none;color:var(--ui-color-text-inverse);font-size:10px;cursor:pointer;font-family:var(--mono, monospace);white-space:nowrap;transition:all .12s}.var-pill:hover{background:var(--color-pro-600);color:var(--ui-color-text-inverse)}.var-pill-sm{font-size:9px;padding:1px 5px}.var-pill-swatch{width:10px;height:10px;border-radius:2px;border:1px solid rgba(255,255,255,.15);flex-shrink:0}.var-unlink-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:4px;background:none;border:none;color:#ffffff4d;cursor:pointer;padding:0;flex-shrink:0;opacity:0;transition:opacity .15s,color .15s}.prop-row:hover .var-unlink-btn{opacity:1}.var-unlink-btn:hover{color:#fff9}.var-link-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:4px;background:none;border:none;color:#ffffff26;cursor:pointer;padding:0;flex-shrink:0;opacity:0;transition:opacity .15s,color .15s}.prop-row:hover .var-link-btn{opacity:1}.var-link-btn:hover{color:#ffffff80}.keyword-pill{display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--ui-radius-soft, 4px);background:var(--color-accent-500);color:var(--ui-color-text-inverse);font-size:10px;font-family:var(--mono, monospace);cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0;transition:background .12s}.keyword-pill:hover{background:var(--color-success-600)}.box-keyword-val{display:inline-block;padding:1px 4px;border-radius:var(--ui-radius-soft, 3px);background:var(--color-accent-500);color:var(--ui-color-text-inverse);font-size:8px;cursor:pointer;font-family:var(--mono, monospace);white-space:nowrap;transition:background .12s;max-width:50px;overflow:hidden;text-overflow:ellipsis;border:none}.box-keyword-val:hover{background:var(--color-success-600)}.mode-panel-container:empty{display:none}.mode-panel{padding:4px 0 8px;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:4px}.mode-panel-header{font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;color:#ffffff6b;font-weight:600;padding:4px 2px 6px}.mode-panel-empty{font-size:10.5px;color:#ffffff59;padding:2px 0 4px;font-style:italic}.mode-collection{margin-bottom:2px}.mode-collection-toggle{display:flex;align-items:center;gap:6px;width:100%;padding:6px 2px 5px;background:none;border:none;cursor:pointer;text-align:left;color:#ffffff6b;font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;font-family:var(--font);transition:color .12s}.mode-collection-toggle:hover{color:#ffffffbf}.mode-collection-caret{display:inline-block;transition:transform .15s ease;order:-1;font-size:13px;line-height:1;color:#ffffff59;width:8px}.mode-collection.expanded .mode-collection-caret{transform:rotate(90deg)}.mode-collection-name{flex:1}.mode-collection-body{max-height:0;overflow:hidden;transition:max-height .2s ease,opacity .15s ease;opacity:0}.mode-collection.expanded .mode-collection-body{max-height:600px;opacity:1;padding-bottom:6px}.mode-btns{display:flex;flex-wrap:wrap;gap:4px}.mode-btn{height:26px;box-sizing:border-box;padding:0 10px;border-radius:5px;border:1px solid rgba(255,255,255,.08);background:var(--el-hover);color:#ffffff8c;font-size:10.5px;cursor:pointer;font-family:var(--font);display:inline-flex;align-items:center;transition:background .12s,border-color .12s,color .12s}.mode-btn:hover{background:var(--el);color:#ffffffe6;border-color:#ffffff26}.mode-btn.active{background:var(--color-brand-purple-500);border-color:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-weight:600}.mode-add{margin-top:6px}.mode-add-btn{width:100%;height:26px;box-sizing:border-box;padding:0 8px;border-radius:5px;border:1px dashed rgba(255,255,255,.18);background:transparent;color:#ffffff80;font-size:10.5px;cursor:pointer;font-family:var(--font);transition:background .12s,border-color .12s,color .12s}.mode-add-btn:hover{background:var(--el-hover);border-color:var(--color-brand-purple-500);color:#ffffffd9}.mode-add-menu{display:flex;flex-direction:column;gap:2px;margin-top:4px;padding:4px;background:var(--solid-up);border-radius:6px;border:1px solid rgba(255,255,255,.08)}.mode-add-menu[hidden]{display:none}.mode-add-option{text-align:left;padding:6px 10px;border-radius:4px;border:none;background:transparent;color:#fff9;font-size:11px;cursor:pointer;font-family:var(--font)}.mode-add-option:hover{background:var(--el-hover);color:#fff}.corner-handle{box-sizing:border-box;position:fixed;width:10px;height:10px;border-radius:999px;background:var(--color-brand-purple-500);border:1.5px solid rgba(24,24,24,.82);outline:1px solid rgba(255,255,255,.32);box-shadow:0 1px 3px #0000006b;cursor:crosshair;z-index:100004;pointer-events:all;transform:translate(-50%,-50%);transition:background .1s,outline-color .1s,box-shadow .1s}.corner-handle:after{content:none}.corner-handle:hover{background:#8f6cff;outline-color:#ffffff70;box-shadow:0 2px 5px #00000075}.corner-handle:active{cursor:grabbing}.corner-handle:active{background:#7457ff}.spacing-handle{position:fixed;z-index:100003;pointer-events:all;background:transparent}.spacing-handle.top,.spacing-handle.bottom{cursor:ns-resize}.spacing-handle.left,.spacing-handle.right{cursor:ew-resize}.spacing-handle:before{content:"";position:absolute;opacity:0;border-radius:999px;background:currentColor;box-shadow:0 1px 4px #00000057,0 0 0 1px #ffffff29;transform:scaleX(.72);transition:opacity .1s ease,transform .1s ease,box-shadow .1s ease}.spacing-handle.top:before,.spacing-handle.bottom:before{left:10px;right:10px;top:50%;height:2px;transform:translateY(-50%) scaleX(.72)}.spacing-handle.left:before,.spacing-handle.right:before{top:10px;bottom:10px;left:50%;width:2px;transform:translate(-50%) scaleY(.72)}.spacing-handle.padding{color:#f085ff}.spacing-handle.margin{color:#c8f542}.spacing-handle.is-ready:before{opacity:.42}.spacing-handle:hover:before,.spacing-handle.active:before{opacity:1;box-shadow:0 2px 8px #0006,0 0 0 2px #ffffff2e}.spacing-handle.top:hover:before,.spacing-handle.bottom:hover:before,.spacing-handle.top.active:before,.spacing-handle.bottom.active:before{transform:translateY(-50%) scaleX(1)}.spacing-handle.left:hover:before,.spacing-handle.right:hover:before,.spacing-handle.left.active:before,.spacing-handle.right.active:before{transform:translate(-50%) scaleY(1)}.spacing-dot{position:absolute;width:5px;height:5px;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;pointer-events:none;transition:opacity .1s ease,transform .1s ease;box-shadow:0 1px 3px #0006}.spacing-handle.padding>.spacing-dot{background:#f085ff}.spacing-handle.margin>.spacing-dot{background:#c8f542}.gap-dot{width:18px;height:18px;background:transparent;border-radius:0;box-shadow:none}.gap-dot:before,.gap-dot:after{content:"";position:absolute;left:50%;top:50%;background:#38bdf8;box-shadow:0 1px 4px #0000006b,0 0 0 1px #ffffff2e}.gap-dot.column-gap:before{width:2px;height:18px;border-radius:999px;transform:translate(-50%,-50%)}.gap-dot.row-gap:before{width:18px;height:2px;border-radius:999px;transform:translate(-50%,-50%)}.gap-dot:after{width:6px;height:6px;border-radius:2px;transform:translate(-50%,-50%) rotate(45deg)}.spacing-handle.is-ready>.spacing-dot{opacity:0;transform:translate(-50%,-50%) scale(1)}.spacing-handle:hover>.spacing-dot{opacity:1;transform:translate(-50%,-50%) scale(1.6)}.spacing-handle.active>.spacing-dot{opacity:1;transform:translate(-50%,-50%) scale(1.3)}.spacing-fill{position:fixed;z-index:100001;pointer-events:none;display:none;mix-blend-mode:normal;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff38,0 0 0 1px #00000029;background-size:10px 10px}.spacing-fill.padding{background-color:#f085ff57;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.28) 0 1px,transparent 1px 7px)}.spacing-fill.margin{background-color:#c8f5424d;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.26) 0 1px,transparent 1px 7px)}.spacing-fill.gap{background-color:#38bdf857;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.26) 0 1px,transparent 1px 7px)}.spacing-fill.is-active{opacity:1}.prop-longhand-toggle{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:4px;flex-shrink:0;background:none;border:none;color:#ffffff40;cursor:pointer;padding:0;transition:color .12s,background .12s}.prop-longhand-toggle:hover{color:#fff9}.prop-longhand-toggle.active{color:var(--color-brand-purple-500);background:rgba(var(--color-brand-purple-rgb,130,85,255),.12)}.prop-corner-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px 0 6px}.prop-corner-cell{display:flex;align-items:center;gap:3px;min-width:0}.prop-corner-icon{flex-shrink:0;opacity:.4}.prop-side-label{font-size:9px;color:#ffffff59;font-family:var(--mono, monospace);flex-shrink:0;width:10px;text-align:center}.prop-input-sm{width:100%;min-width:0;font-size:10px;padding:2px 4px;height:20px}.prop-label--clickable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .12s}.prop-label--clickable:hover{color:#ffffffd9}.prop-menu{position:fixed;z-index:200001;background:#1e1a28;border:1px solid rgba(255,255,255,.1);border-radius:7px;padding:4px;min-width:148px;box-shadow:0 6px 20px #00000080}.prop-menu-item{display:block;width:100%;text-align:left;padding:5px 10px;background:none;border:none;color:#ffffffbf;cursor:pointer;font-size:11px;border-radius:4px;font-family:var(--sans)}.prop-menu-item:hover{background:#ffffff14;color:#fff}.prop-menu-item--var{color:var(--color-brand-purple-300, #a78bfa)}.prop-menu-item--var:hover{color:#c4b5fd}.prop-menu-sep{height:1px;background:#ffffff12;margin:3px 2px}.var-picker{position:fixed;z-index:200001;width:260px;max-height:300px;background:var(--solid-up, rgba(22,21,22,.95));border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 12px 40px #00000080;display:flex;flex-direction:column;font-family:var(--font)}.var-picker-search{padding:8px 10px;border:none;border-bottom:1px solid rgba(255,255,255,.06);background:transparent;color:#fff;font-size:11px;outline:none;font-family:var(--font)}.var-picker-search::placeholder{color:#ffffff40}.var-picker-list{overflow-y:auto;max-height:250px;padding:4px}.var-picker-item{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:5px;cursor:pointer;transition:background .1s;font-size:11px}.var-picker-item:hover{background:#ffffff0f}.var-picker-swatch{width:14px;height:14px;border-radius:3px;flex-shrink:0;border:1px solid rgba(255,255,255,.12)}.var-picker-name{flex:1;color:#ffffffa6;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.var-picker-val{max-width:70px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;color:#ffffff40}.prop-spacing-group{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.prop-spacing-val{font-size:10px;color:#fff6;font-family:var(--mono, monospace);min-width:28px;text-align:center}.nav-page-item{cursor:pointer;position:relative}.nav-page-item:hover .nav-page-label{color:#fff}.nav-page-item--active .nav-page-label{color:var(--color-brand-purple-500)!important;font-weight:600}.nav-page-home-btn{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#ffffff40;cursor:pointer;padding:2px;line-height:0;border-radius:3px}.nav-page-home-btn svg{width:14px;height:14px}.nav-page-item:hover .nav-page-home-btn{display:block}.nav-page-home-btn.is-home{display:block;color:rgba(var(--color-brand-green-rgb),.8)}.nav-page-home-btn:hover{color:var(--color-brand-green-500)}.nav-icon-home{color:rgba(var(--color-brand-green-rgb),.8)}.annotation-body{flex:1;display:flex;overflow:hidden;position:relative}.annotation-canvas{flex:1;position:relative;overflow:auto}.annotation-iframe{width:100%;height:100%;border:none;background:#fff}.annotation-svg-shape-box{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;display:none;z-index:100001;overflow:visible}.annotation-hover-box,.annotation-select-box{position:fixed;pointer-events:none;z-index:100001;display:none;box-sizing:border-box;transition:border-color .15s,background .15s}.annotation-hover-box,.annotation-select-box{border:2px solid var(--color-brand-green-500);background:transparent}[data-active-tool=select] .annotation-hover-box,[data-active-tool=select] .annotation-select-box{border-color:var(--color-brand-purple-500);background:transparent}[data-active-tool=cms] .annotation-hover-box,[data-active-tool=cms] .annotation-select-box{border-color:#d946ef;background:transparent}[data-active-tool=component] .annotation-hover-box,[data-active-tool=component] .annotation-select-box{border-color:var(--color-brand-green-500);background:transparent}[data-active-tool=skip] .annotation-hover-box,[data-active-tool=skip] .annotation-select-box{border-color:#dc2626;background:transparent}.annotation-hover-box[data-annotation-type=cms],.annotation-select-box[data-annotation-type=cms]{border-color:#d946ef;background:transparent}.annotation-hover-box[data-annotation-type=component],.annotation-select-box[data-annotation-type=component]{border-color:var(--color-brand-green-500);background:transparent}.annotation-hover-box[data-annotation-type=skip],.annotation-select-box[data-annotation-type=skip]{border-color:#dc2626;background:transparent}.annotation-hover-box[data-annotation-type=form],.annotation-select-box[data-annotation-type=form]{border-color:var(--color-brand-green-500);background:transparent}.annotation-tooltip{position:fixed;z-index:100002;display:none;padding:2px 8px;border-radius:var(--ui-radius-soft);background:var(--color-brand-green-500);color:var(--ui-color-text-inverse);border:none;font-size:10px;font-weight:600;white-space:nowrap;pointer-events:none;font-family:var(--mono);transition:background .15s,color .15s}[data-active-tool=select] .annotation-tooltip{background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}[data-active-tool=cms] .annotation-tooltip{background:#d946ef;color:#fff}[data-active-tool=component] .annotation-tooltip{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}[data-active-tool=skip] .annotation-tooltip{background:#dc2626;color:#fff}.annotation-tooltip[data-annotation-type=cms]{background:#d946ef;color:#fff}.annotation-tooltip[data-annotation-type=component]{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-tooltip[data-annotation-type=skip]{background:#dc2626;color:#fff}.annotation-tooltip[data-annotation-type=form]{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-badges{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:100001}.annotation-badge{position:fixed;pointer-events:auto;cursor:pointer;display:flex;align-items:center;gap:3px;padding:1px 6px;border-radius:var(--ui-radius-soft);font-family:var(--mono);font-size:8px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border:none;opacity:1;transition:filter .15s}.annotation-badge:hover{filter:brightness(1.08)}.annotation-badge-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.annotation-badge--cms{background:#d946ef;color:#fff}.annotation-badge--cms .annotation-badge-dot{background:#fff}.annotation-badge--component{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-badge--component .annotation-badge-dot{background:var(--ui-color-text-inverse)}.annotation-badge--skip{background:#dc2626;color:#fff}.annotation-badge--skip .annotation-badge-dot{background:#fff}.annotation-badge--form{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-badge--form .annotation-badge-dot{background:var(--ui-color-text-inverse)}.sidebar-tabs{display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;padding:0 4px}.sidebar-tab{padding:8px 12px;border:none;background:transparent;color:#ffffff59;font-size:11px;font-weight:500;cursor:pointer;transition:all .12s;border-bottom:2px solid transparent;margin-bottom:-1px}.sidebar-tab:hover{color:#fff9}.sidebar-tab.active{color:#fff;border-bottom-color:var(--color-brand-purple-500)}.annotation-sidebar--tag-manager .sidebar-tab[data-tab=tags].active{border-bottom-color:var(--color-brand-green-500)}.sidebar-tab-close{margin-left:auto;background:none;border:none;color:#ffffff40;font-size:16px;cursor:pointer;padding:4px 8px}.sidebar-tab-close:hover{color:#fff}.sidebar-pane{display:none;flex:1;overflow-y:auto;padding:12px}.sidebar-pane.active{display:block}.convert-progress{position:relative;width:100%;height:3px;margin-top:8px;background:#ffffff0f;border-radius:2px;overflow:hidden;pointer-events:none}.convert-progress--artboard{position:absolute;top:100%;left:0;right:0;width:100%;margin-top:24px;height:4px}.convert-progress__fill{position:absolute;top:0;left:0;height:100%;width:35%;background:linear-gradient(90deg,transparent 0%,var(--color-brand-purple-500) 30%,var(--color-brand-green-500) 70%,transparent 100%);border-radius:2px;transform:translate(-100%);animation:convertProgressSlide 1.4s cubic-bezier(.4,0,.6,1) infinite;will-change:transform}@keyframes convertProgressSlide{0%{transform:translate(-100%)}to{transform:translate(400%)}}.seo-settings-wrap{display:flex;flex-direction:column;gap:0}.prop-row--col{flex-direction:column;align-items:flex-start;gap:4px;min-height:unset;padding:4px 0}.prop-row--col .prop-label{min-width:unset}.prop-row--col .prop-input{width:100%;box-sizing:border-box;flex:unset}.prop-row--col textarea.prop-input{resize:vertical;min-height:54px;font-family:var(--font)}.seo-save-row{display:flex;align-items:center;gap:8px;padding:12px 0 4px}.seo-save-btn{padding:5px 12px;background:#a3e6351f;color:#a3e635;border:1px solid rgba(163,230,53,.25);border-radius:5px;font-size:11px;font-family:var(--font);cursor:pointer;transition:background .15s}.seo-save-btn:hover{background:#a3e63538}.seo-save-status{font-size:10px;opacity:.8}.seo-badge{display:inline-block;padding:2px 6px;border-radius:3px;background:#ffffff0f;color:#ffffff80;font-size:10px;font-family:var(--mono)}.annotation-sidebar{width:300px;flex-shrink:0;background:linear-gradient(var(--el),var(--el)),var(--bg);border-left:1px solid rgba(255,255,255,.08);overflow-y:auto;display:flex;flex-direction:column;font-family:var(--font);position:relative;z-index:100004}.annotation-sidebar-content{padding:16px}.annotation-sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.annotation-element-tag{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--color-brand-purple-500)}.annotation-sidebar-close{background:none;border:none;color:#ffffff4d;font-size:18px;cursor:pointer}.annotation-sidebar-close:hover{color:#fff}.annotation-sidebar--tag-manager .sidebar-pane-tags{padding:10px 12px 14px}.annotation-tag-manager{display:flex;flex-direction:column;gap:10px;min-height:0}.annotation-tag-manager-head{display:flex;flex-direction:column;gap:10px;flex-shrink:0}.annotation-tag-manager-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.annotation-tag-manager-title{font-size:13px;font-weight:600;color:#ffffffd9}.annotation-tag-manager-scope{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59}.annotation-tag-mode-row{display:flex;gap:4px;background:#00000040;padding:4px;border-radius:8px}.annotation-tag-mode-tab{flex:1;border:none;border-radius:6px;padding:7px 8px;font-size:11px;font-weight:500;cursor:pointer;background:transparent;color:#ffffff73;transition:background .15s,color .15s}.annotation-tag-mode-tab:hover{color:#ffffffbf}.annotation-tag-mode-tab.active{background:var(--el-hover);color:#fff}.annotation-tag-sub-row{display:flex;gap:4px}.annotation-tag-sub-tab{flex:1;border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:6px 8px;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;background:transparent;color:#fff6}.annotation-tag-sub-tab:hover{border-color:#ffffff24;color:#ffffffb3}.annotation-tag-sub-tab[data-tm-reg=component].active{border-color:var(--color-brand-green-500);color:#fff;background:rgba(var(--color-brand-green-rgb),.14)}.annotation-tag-sub-tab[data-tm-reg=cms].active{border-color:var(--color-brand-purple-500);color:#fff;background:#a855f71f}.annotation-tag-sub-tab[data-tm-reg=skip].active{border-color:#ffffff38;color:#ffffffe6;background:#ffffff0f}.annotation-tag-candidate-bulk{display:flex;flex-wrap:wrap;gap:6px;background:#00000040;padding:6px;border-radius:8px}.annotation-tag-bulk-btn{flex:1;min-width:120px;border-radius:6px;padding:7px 10px;font-size:11px;font-weight:600;cursor:pointer;border:1px solid rgba(255,255,255,.08);background:transparent;color:#ffffffb8;transition:border-color .15s,color .15s,background .15s}.annotation-tag-bulk-btn:hover{border-color:#ffffff24;color:#ffffffe6;background:#ffffff0a}.annotation-tag-bulk-btn--primary{background:var(--color-brand-green-500);border-color:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-tag-bulk-btn--primary:hover{filter:brightness(1.06);color:var(--ui-color-text-inverse)}.annotation-tag-manager-body{flex:1;min-height:0}.annotation-tm-page-block{margin-bottom:14px}.annotation-tm-page-title{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:8px}.annotation-tag-manager .annotation-tm-mini{border-radius:6px;padding:7px 10px;font-size:11px;font-weight:500;cursor:pointer;border:1px solid rgba(255,255,255,.08);background:var(--el-hover);color:#ffffffbf;white-space:nowrap;transition:border-color .15s,color .15s,background .15s}.annotation-tag-manager .annotation-tm-mini--ghost{background:transparent;border-color:#ffffff1a;color:#ffffff8c}.annotation-tag-manager .annotation-tm-mini--ghost:hover{color:#fff;border-color:#ffffff2e;background:#ffffff0a}.annotation-tag-manager .annotation-tm-mini--go{background:var(--color-brand-green-500);border-color:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-tag-manager .annotation-tm-mini--go:hover{filter:brightness(1.06)}.annotation-tag-manager .annotation-tm-mini--remove{background:var(--el-hover);border-color:#ffffff14;color:#ffffff6b}.annotation-tag-manager .annotation-tm-mini--remove:hover{border-color:#ffffff24;color:#ffffffd9;background:var(--el-active)}.annotation-tm-reg-row{display:grid;grid-template-columns:minmax(0,1fr) 4.75rem;gap:8px;align-items:stretch;margin-bottom:6px}.annotation-tm-reg-row .annotation-page-item{margin-bottom:0;min-width:0;width:100%}.annotation-tm-reg-row .annotation-tm-mini--remove,.annotation-tm-reg-row--candidate .annotation-tm-mini--go{width:100%;min-height:100%;display:inline-flex;align-items:center;justify-content:center;padding-left:6px;padding-right:6px}.annotation-sidebar--tag-manager .annotation-page-item--component .annotation-page-item-icon{color:var(--color-brand-green-500)}.annotation-sidebar--tag-manager .annotation-page-item--component .annotation-page-item-icon svg{stroke:currentColor}.annotation-site-page-group{margin-bottom:14px}.annotation-classes{font-size:11px;color:#ffffff80;margin-bottom:6px;font-family:var(--mono)}.annotation-dims{font-size:11px;color:#ffffff59;margin-bottom:8px}.annotation-preview{font-size:11px;color:#ffffff4d;font-style:italic;margin-bottom:12px;line-height:1.4}.annotation-siblings{font-size:11px;padding:6px 10px;border-radius:6px;margin-bottom:12px}.annotation-siblings--cms{background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}.annotation-siblings--component{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-actions{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.annotation-action-btn{padding:8px 12px;border-radius:6px;background:var(--el-hover);border:1px solid rgba(255,255,255,.08);color:#ffffffb3;font-size:12px;font-weight:500;cursor:pointer;text-align:left;transition:all .15s}.annotation-action-btn:hover{background:var(--el-active);color:#fff}.annotation-action-cms.active{background:#d946ef;border-color:#d946ef;color:#fff}.annotation-action-component.active{background:var(--color-brand-green-500);border-color:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-action-component-inner{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%}.annotation-action-component-label{flex:1;min-width:0;text-align:left}.annotation-action-component-chip{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:30px;height:30px;border-radius:6px;box-sizing:border-box;pointer-events:auto;border:none;padding:0;cursor:pointer;font:inherit}.annotation-action-component-chip svg{display:block}.annotation-action-component-chip--register{background:color-mix(in srgb,var(--color-brand-green-500) 14%,transparent);border:1px solid var(--color-brand-green-500);color:var(--color-brand-green-500)}.annotation-action-component:not(.active):hover .annotation-action-component-chip--register{background:color-mix(in srgb,var(--color-brand-green-500) 26%,transparent)}.annotation-action-component.active .annotation-action-component-chip--registered{background:#00000038;border:1px solid rgba(255,255,255,.35);color:var(--ui-color-text-inverse)}.annotation-action-skip.active{background:#dc2626;border-color:#dc2626;color:#fff}.annotation-action-remove{color:#ffffff4d!important;border-color:transparent!important}.annotation-action-remove:hover{color:#f87171!important}.annotation-label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:6px}.annotation-cms-name,.annotation-component-name{width:100%;padding:7px 10px;border-radius:6px;background:var(--el-hover);border:1px solid rgba(255,255,255,.1);color:#fff;font-size:12px;outline:none;font-family:var(--font)}.annotation-cms-name:focus,.annotation-component-name:focus{border-color:#fff3}.annotation-cms-config,.annotation-component-config{margin-top:4px}.annotation-suggestions{margin-top:14px}.annotation-suggestion-group{margin-top:10px}.annotation-suggestion-group-title{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:6px}.annotation-suggestion-item{display:flex;align-items:center;gap:8px;margin-bottom:6px}.annotation-suggestion-link{flex:1;min-width:0;text-align:left;cursor:pointer;background:var(--el-hover);border:1px solid rgba(255,255,255,.08);color:#ffffffd1;border-radius:6px;padding:7px 10px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.annotation-suggestion-link:hover{color:#fff;border-color:#ffffff29}.annotation-suggestion-approve{cursor:pointer;border-radius:6px;padding:7px 10px;font-size:11px;border:none;background:#3a3a3f;color:#fff;font-weight:600}.annotation-suggestion-approve--cms{background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}.annotation-suggestion-approve--component{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.annotation-suggestion-approve--skip{background:#dc2626;color:#fff}.annotation-page-summary{padding:0}.annotation-page-summary-title{font-size:12px;font-weight:600;color:#ffffffb3;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}.annotation-page-summary-empty{font-size:11px;color:#ffffff4d;line-height:1.5;padding:8px 0}.annotation-page-group{margin-bottom:14px}.annotation-page-group-title{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:6px}.annotation-page-item{display:flex;align-items:center;gap:8px;width:100%;background:var(--el-hover);border:1px solid rgba(255,255,255,.06);color:#ffffffbf;border-radius:6px;padding:7px 10px;font-size:11px;cursor:pointer;margin-bottom:4px;text-align:left;transition:border-color .15s}.annotation-page-item:hover{border-color:#ffffff2e;color:#fff}.annotation-page-item--component .annotation-page-item-icon{color:var(--color-brand-green-500)}.annotation-page-item--cms .annotation-page-item-icon{color:var(--color-brand-purple-500)}.annotation-page-item--skip .annotation-page-item-icon{color:#dc2626}.annotation-page-item--form .annotation-page-item-icon{color:#3b82f6}.annotation-page-item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.annotation-page-item-auto{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#ffffff40;background:#ffffff0f;padding:1px 5px;border-radius:3px}.annotation-page-item-repeat{flex-shrink:0;font-size:9px;font-weight:600;letter-spacing:.02em;color:#ffffff73;background:rgba(var(--color-brand-green-rgb),.12);border:1px solid rgba(var(--color-brand-green-rgb),.22);padding:1px 6px;border-radius:3px;max-width:9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.annotation-fields{margin-top:12px}.annotation-field-header{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#ffffff59;margin-bottom:8px}.annotation-field-row{display:flex;align-items:center;gap:6px;margin-bottom:4px}.annotation-field-tag{font-family:var(--mono);font-size:10px;color:#ffffff4d;min-width:30px}.annotation-field-name{flex:1;padding:4px 8px;border-radius:4px;background:var(--el-hover);border:1px solid rgba(255,255,255,.08);color:#fff;font-size:11px;outline:none}.annotation-field-type{font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;min-width:55px;text-align:right;padding:2px 6px;border-radius:var(--ui-radius-soft);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse)}.ai-chat-panel{position:fixed;bottom:var(--above-dock);left:50%;transform:translate(-50%) translateY(12px);width:480px;max-width:calc(100vw - 48px);display:flex;flex-direction:column;background:var(--solid-up);border:var(--ui-border-width) solid var(--ui-color-border-default);border-radius:var(--r);box-shadow:var(--ui-shadow-xl);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);z-index:100009;font-family:var(--font);opacity:0;transition:opacity .25s var(--ui-ease-standard),transform var(--ui-duration-slow) var(--ui-ease-standard),max-height .35s var(--ui-ease-standard);max-height:120px;overflow:hidden;--color-brand-green-500: #f085ff;--color-brand-green-rgb: 240, 133, 255;--color-success-500: #f085ff;--color-success-600: #d063e6;--ui-color-status-success: #f085ff}.ai-chat-panel.ai-chat-visible{opacity:1;transform:translate(-50%) translateY(0)}.ai-chat-panel.ai-chat-expanded{max-height:min(560px,calc(100vh - 140px));width:520px}.ai-chat-panel.ai-chat-custom-pos,.ai-chat-panel.ai-chat-custom-pos.ai-chat-visible{transform:none}.ai-chat-panel.ai-chat-dragging{transition:none;-webkit-user-select:none;user-select:none;box-shadow:var(--ui-shadow-2xl);border-color:var(--ui-color-border-strong)}.ai-chat-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px 0;flex-shrink:0;opacity:0;max-height:0;overflow:hidden;transition:opacity var(--ui-duration-base),max-height .25s,padding .25s;cursor:var(--cur-grab),grab!important}.ai-chat-header *{cursor:var(--cur-grab),grab!important}.ai-chat-header button,.ai-chat-header button *{cursor:var(--cur-pointer),pointer!important}.ai-chat-dragging .ai-chat-header,.ai-chat-dragging .ai-chat-header *{cursor:var(--cur-grabbing),grabbing!important}.ai-chat-expanded .ai-chat-header{opacity:1;max-height:40px;padding:10px 14px 6px}.ai-chat-header-left{display:flex;align-items:center;gap:var(--ui-space-2)}.ai-chat-grip{display:flex;color:var(--text-faint);margin-right:2px}.ai-chat-brand{display:flex;align-items:center;gap:var(--ui-space-3)}.ai-chat-brand-mark{display:flex;align-items:center;justify-content:center}.ai-chat-brand-text{display:flex;flex-direction:column;line-height:1.05}.ai-chat-title{font-family:var(--font-display);font-size:var(--ui-font-size-body-lg);font-weight:var(--ui-font-weight-bold);color:var(--ui-color-text);letter-spacing:.01em}.ai-chat-subtitle{font-size:9px;font-weight:var(--ui-font-weight-semibold);text-transform:uppercase;letter-spacing:var(--ui-letter-spacing-label);color:var(--color-brand-purple-500)}.ai-chat-header-actions{display:flex;align-items:center;gap:2px}.ai-chat-settings,.ai-chat-clear,.ai-chat-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:var(--r-xs);background:transparent;color:var(--color-white-30);cursor:pointer;transition:background var(--ui-duration-fast),color var(--ui-duration-fast)}.ai-chat-settings:hover,.ai-chat-clear:hover,.ai-chat-close:hover{background:var(--ui-color-bg-elevated);color:var(--ui-color-text-soft)}.ai-chat-settings.active{color:var(--color-brand-purple-500);background:rgba(var(--color-brand-purple-rgb),.1)}.ai-chat-messages{flex:1;overflow-y:auto;padding:0 14px;display:flex;flex-direction:column;gap:var(--ui-space-3);opacity:0;max-height:0;transition:opacity var(--ui-duration-base) .05s,max-height .35s;scrollbar-width:thin;scrollbar-color:var(--ui-color-border-default) transparent}.ai-chat-expanded .ai-chat-messages{opacity:1;max-height:400px;padding:8px 14px}.ai-chat-welcome{display:flex;flex-direction:column;align-items:center;padding:16px 8px 8px;gap:var(--ui-space-4)}.ai-chat-welcome-icon{display:flex;opacity:.95}.ai-chat-welcome-text{font-size:var(--ui-font-size-body-sm);color:var(--color-white-35);text-align:center;line-height:1.5;max-width:280px}.ai-chat-ai-notice{font-size:var(--ui-font-size-label-xs);color:var(--text-faint);text-align:center;line-height:1.45;max-width:300px;margin-top:10px}.ai-chat-input-hint .ai-chat-hint-ai{margin-left:auto;opacity:.85}.ai-chat-suggestions{display:flex;flex-wrap:wrap;gap:var(--ui-space-2);justify-content:center;margin-top:4px}.ai-chat-suggestion{padding:5px 12px;border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--ui-radius-soft);background:transparent;color:var(--ui-color-text-muted);font-family:var(--font);font-size:var(--ui-font-size-label-sm);cursor:pointer;transition:all var(--ui-duration-fast);white-space:nowrap}.ai-chat-suggestion:hover{border-color:rgba(var(--color-brand-purple-rgb),.3);color:var(--ui-color-text-soft);background:rgba(var(--color-brand-purple-rgb),.08)}.ai-chat-msg{display:flex;max-width:88%;animation:ai-msg-in .25s var(--ui-ease-standard)}@keyframes ai-msg-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.ai-chat-msg--user{align-self:flex-end}.ai-chat-msg--assistant,.ai-chat-msg--error,.ai-chat-msg--thinking{align-self:flex-start}.ai-chat-msg-content{padding:8px 12px;border-radius:var(--ui-radius-5);font-size:var(--ui-font-size-body-sm);line-height:1.5;word-break:break-word}.ai-chat-msg--user .ai-chat-msg-content{background:rgba(var(--color-brand-purple-rgb),.15);color:var(--color-white-85);border-bottom-right-radius:var(--ui-radius-1)}.ai-chat-msg--assistant .ai-chat-msg-content{background:var(--ui-color-bg-panel-strong);color:var(--ui-color-text-soft);border-bottom-left-radius:var(--ui-radius-1)}.ai-chat-msg-error{color:var(--ui-color-status-danger)!important;background:#ef444414!important}.ai-chat-thinking-row{display:flex;align-items:center;gap:var(--ui-space-3)}.ai-chat-thinking-dots{display:flex;gap:4px;padding:10px 14px;background:var(--ui-color-bg-panel-strong);border-radius:var(--ui-radius-5);border-bottom-left-radius:var(--ui-radius-1)}.ai-chat-thinking-dots span{width:6px;height:6px;border-radius:var(--ui-radius-round);background:rgba(var(--color-brand-purple-rgb),.5);animation:ai-dot-bounce 1.4s ease-in-out infinite}.ai-chat-thinking-dots span:nth-child(2){animation-delay:.16s}.ai-chat-thinking-dots span:nth-child(3){animation-delay:.32s}@keyframes ai-dot-bounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-6px);opacity:1}}.ai-chat-stop{display:inline-flex;align-items:center;gap:var(--ui-space-1);padding:4px 10px;border:var(--ui-border-width) solid var(--ui-color-border-default);border-radius:var(--ui-radius-soft);background:transparent;color:var(--ui-color-text-muted);font-family:var(--font);font-size:var(--ui-font-size-label-sm);cursor:pointer;transition:all var(--ui-duration-fast)}.ai-chat-stop:hover{border-color:var(--ui-color-status-danger);color:var(--ui-color-status-danger);background:#ef444414}.ai-chat-result-card{padding:10px 14px;background:rgba(var(--color-brand-purple-rgb),.06);border:var(--ui-border-width) solid rgba(var(--color-brand-purple-rgb),.15);border-radius:var(--ui-radius-4);animation:ai-msg-in .3s var(--ui-ease-standard)}.ai-chat-result-title{display:flex;align-items:center;gap:var(--ui-space-2);font-size:var(--ui-font-size-body-sm);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-soft)}.ai-chat-result-title svg{color:var(--color-brand-green-500)}.ai-chat-result-meta{font-size:var(--ui-font-size-label-sm);color:var(--color-white-30);margin-top:4px;padding-left:20px}.ai-chat-result-warning{display:flex;align-items:flex-start;gap:var(--ui-space-2);margin-top:var(--ui-space-2);font-size:var(--ui-font-size-label-sm);line-height:1.45;color:var(--ui-color-status-warning)}.ai-chat-result-warning svg{flex-shrink:0;margin-top:1px}.ai-chat-clarify-card{display:flex;flex-direction:column;gap:var(--ui-space-5);padding:12px 14px;background:var(--ui-color-bg-panel-strong);border:var(--ui-border-width) solid var(--ui-color-border-default);border-radius:var(--ui-radius-4);animation:ai-msg-in .3s var(--ui-ease-standard)}.ai-chat-clarify-q{display:flex;flex-direction:column;gap:var(--ui-space-3)}.ai-chat-clarify-label{font-size:var(--ui-font-size-body-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text-soft)}.ai-chat-clarify-opts{display:flex;flex-wrap:wrap;gap:var(--ui-space-2)}.ai-chat-clarify-opt{padding:5px 12px;border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--ui-radius-soft);background:transparent;color:var(--ui-color-text-muted);font-family:var(--font);font-size:var(--ui-font-size-label-sm);cursor:pointer;transition:all var(--ui-duration-fast);white-space:nowrap}.ai-chat-clarify-opt:hover{border-color:rgba(var(--color-brand-purple-rgb),.4);color:var(--ui-color-text-soft)}.ai-chat-clarify-opt.selected{border-color:transparent;background:rgba(var(--color-brand-purple-rgb),.18);color:var(--ui-color-text)}.ai-chat-clarify-continue{align-self:flex-start;margin-top:2px;padding:6px 16px;border:none;border-radius:var(--r-sm);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-family:var(--font);font-size:var(--ui-font-size-body-sm);font-weight:var(--ui-font-weight-semibold);cursor:pointer;transition:opacity var(--ui-duration-fast)}.ai-chat-clarify-continue:disabled{opacity:.35;cursor:default;background:var(--ui-color-bg-elevated)}.ai-chat-clarify-card.answered{opacity:.6}.ai-chat-input-area{padding:10px 14px;flex-shrink:0}.ai-chat-input-wrap{display:flex;align-items:flex-end;gap:var(--ui-space-3);padding:8px 8px 8px 14px;background:var(--el);border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--ui-radius-5);transition:border-color var(--ui-duration-fast),background var(--ui-duration-fast),box-shadow var(--ui-duration-fast)}.ai-chat-input-wrap:focus-within{border-color:rgba(var(--color-brand-purple-rgb),.3);background:var(--el-hover)}.ai-chat-input{flex:1;border:none;border-radius:0;box-shadow:none;background:transparent;color:var(--ui-color-text);font-family:var(--font);font-size:var(--ui-font-size-body-md);line-height:1.5;resize:none;outline:none;max-height:120px;padding:2px 0}.ai-chat-input::placeholder{color:var(--text-faint)}.ai-chat-send{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;flex-shrink:0;border:none;border-radius:var(--r-sm);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);cursor:pointer;transition:opacity var(--ui-duration-fast),transform var(--ui-duration-fast)}.ai-chat-send:disabled{opacity:.3;cursor:default}.ai-chat-send:not(:disabled):hover{opacity:.9;transform:scale(1.05)}.ai-chat-send:not(:disabled):active{transform:scale(.95)}.ai-chat-input-hint{display:flex;gap:var(--ui-space-5);padding:6px 4px 0;opacity:0;max-height:0;overflow:hidden;transition:opacity var(--ui-duration-base),max-height var(--ui-duration-base)}.ai-chat-expanded .ai-chat-input-hint{opacity:1;max-height:24px}.ai-chat-input-hint span{font-size:var(--ui-font-size-label-xs);color:var(--text-faint)}.ai-chat-input-hint kbd{display:inline-block;padding:1px 4px;border:var(--ui-border-width) solid var(--ui-color-border-default);border-radius:3px;font-family:var(--mono);font-size:9px;color:var(--color-white-30);margin-right:3px}.annotation-overlay .dock-item[data-tool=ai-chat].active{color:var(--color-brand-purple-500);background:rgba(var(--color-brand-purple-rgb),.1)}.ai-chat-setup{display:flex;flex-direction:column;align-items:center;padding:20px 16px 12px;gap:var(--ui-space-4)}.ai-chat-setup-form{width:100%;display:flex;flex-direction:column;gap:var(--ui-space-3)}.ai-chat-api-key-input{width:100%;padding:8px 12px;background:var(--el);border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--r-sm);color:var(--ui-color-text);font-family:var(--mono);font-size:var(--ui-font-size-body-sm);outline:none;transition:border-color var(--ui-duration-fast)}.ai-chat-api-key-input:focus{border-color:rgba(var(--color-brand-purple-rgb),.3)}.ai-chat-api-key-input::placeholder{color:var(--text-faint)}.ai-chat-custom-model{width:100%;padding:8px 12px;background:var(--el);border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--r-sm);color:var(--ui-color-text);font-family:var(--mono);font-size:var(--ui-font-size-body-sm);outline:none;transition:border-color var(--ui-duration-fast)}.ai-chat-custom-model:focus{border-color:rgba(var(--color-brand-purple-rgb),.3)}.ai-chat-custom-model::placeholder{color:var(--text-faint)}.ai-chat-setup-row{display:flex;gap:var(--ui-space-3)}.ai-chat-model-select{flex:1;padding:6px 10px;background:var(--el);border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--r-sm);color:var(--ui-color-text-soft);font-family:var(--font);font-size:var(--ui-font-size-label-sm);outline:none;cursor:pointer}.ai-chat-save-key{padding:6px 16px;border:none;border-radius:var(--r-sm);background:var(--color-brand-purple-500);color:var(--ui-color-text-inverse);font-family:var(--font);font-size:var(--ui-font-size-body-sm);font-weight:var(--ui-font-weight-semibold);cursor:pointer;transition:opacity var(--ui-duration-fast);white-space:nowrap}.ai-chat-save-key:hover{opacity:.9}.ai-chat-setup-hint{font-size:var(--ui-font-size-label-xs);color:var(--text-faint);text-align:center}.artboard-ai-badge{display:inline-flex;align-items:center;padding:1px 5px;border-radius:var(--ui-radius-1);background:rgba(var(--color-brand-purple-rgb),.2);color:var(--color-brand-purple-500);font-size:9px;font-weight:var(--ui-font-weight-bold);letter-spacing:.04em;margin-right:4px;vertical-align:middle}.annotation-overlay.preview-active .ai-chat-panel{display:none!important}.preview-full-modal{display:none}.preview-full-modal[open]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;width:min(860px,94vw);max-height:82vh;padding:0;background:var(--ui-color-bg-solid, #18171c);border:1px solid var(--ui-color-border-subtle, rgba(255,255,255,.1));border-radius:var(--r-sm, 10px);box-shadow:var(--ui-shadow-lg, 0 24px 64px rgba(0,0,0,.6));display:flex;flex-direction:column;overflow:hidden;color:var(--text, rgba(255,255,255,.85))}.preview-full-modal::backdrop{background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.preview-full-modal__header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--ui-color-border-subtle, rgba(255,255,255,.08));flex-shrink:0}.preview-full-modal__title{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint, rgba(255,255,255,.35))}.preview-full-modal__close{background:none;border:none;color:var(--text-faint, rgba(255,255,255,.35));font-size:1.2rem;line-height:1;cursor:pointer;padding:2px 6px;border-radius:4px}.preview-full-modal__close:hover{color:var(--text, #fff);background:#ffffff0f}.preview-full-modal__body{flex:1;overflow:auto;margin:0;padding:16px;font-family:var(--mono, monospace);font-size:.68rem;line-height:1.6;white-space:pre-wrap;word-break:break-all;color:var(--text-dim, rgba(255,255,255,.6))}@keyframes font-badge-pulse{0%,to{opacity:1}50%{opacity:.72}}.ds-fonts-btn{display:block;width:100%;padding:5px 10px;background:#8255ff1f;border:1px solid rgba(130,85,255,.3);border-radius:5px;color:var(--color-brand-purple-500, #8255ff);font-size:.7rem;font-weight:600;cursor:pointer;text-align:left;transition:background .15s}.ds-fonts-btn:hover{background:#8255ff38}.ds-font-chip{padding:2px 8px;border-radius:10px;font-size:.65rem;font-weight:500;font-family:var(--mono, monospace)}.ds-font-chip--ok{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:var(--text-dim, rgba(255,255,255,.5))}.ds-font-chip--warn{background:#8255ff1a;border:1px solid rgba(130,85,255,.35);color:var(--color-brand-purple-500, #8255ff)}.pg-design-header{font-size:.72rem;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}.pg-section-label{font-size:.65rem;font-weight:600;color:var(--text-faint);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.pg-font-list{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}.pg-font-row{display:flex;align-items:center;justify-content:space-between;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.04)}.pg-font-name{font-size:.72rem;color:var(--text);font-family:var(--mono, monospace)}.pg-font-status{font-size:.65rem}.pg-font-status--ok{color:var(--text-faint)}.pg-font-status--warn{color:var(--color-brand-purple-500, #8255ff);font-weight:600}.pg-replace-btn{display:block;width:100%;padding:6px 10px;margin-top:4px;background:var(--color-brand-purple-500, #8255ff);border:none;border-radius:6px;color:var(--ui-color-text-inverse);font-size:.72rem;font-weight:600;cursor:pointer;transition:opacity .15s}.pg-replace-btn:hover{opacity:.85}.pg-font-ok-msg,.pg-design-empty,.pg-design-loading,.pg-font-empty{font-size:.72rem;color:var(--text-faint);font-style:italic;padding:4px 0}.fr-modal{width:min(620px,96vw);max-height:90vh;display:flex;flex-direction:column}.fr-header{align-items:flex-start;gap:12px}.fr-header h3{margin:0;font-size:.9rem}.fr-header-left{flex:1}.fr-header-right{display:flex;align-items:center;gap:6px;flex-shrink:0}.fr-progress-label{font-size:.68rem;color:var(--text-faint);margin-top:2px;display:block}.fr-nav-btn{width:26px;height:26px;border-radius:5px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:var(--text-dim);font-size:.8rem;cursor:pointer;transition:all .12s;display:flex;align-items:center;justify-content:center}.fr-nav-btn:hover:not(:disabled){background:#ffffff1f;color:var(--text)}.fr-nav-btn:disabled{opacity:.3;cursor:default}.fr-body{flex:1;overflow-y:auto;padding:16px 20px}.fr-step{display:none}.fr-step--active{display:block}.fr-step-header{margin-bottom:12px}.fr-unknown-label{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:4px;background:#8255ff1a;border:1px solid rgba(130,85,255,.3);color:var(--color-brand-purple-500, #8255ff);font-size:.72rem;font-weight:600;font-family:var(--mono, monospace)}.fr-unknown-hint{display:block;font-size:.65rem;color:var(--text-faint);margin-top:5px}.fr-cats{display:flex;gap:2px;flex-wrap:wrap;margin-bottom:10px}.fr-cat{padding:4px 10px;border-radius:4px;border:none;background:transparent;color:var(--text-faint);font-size:.7rem;cursor:pointer;transition:all .12s}.fr-cat:hover{color:var(--text-dim);background:#ffffff0d}.fr-cat.active{background:#8255ff26;border:1px solid rgba(130,85,255,.3);color:var(--color-brand-purple-500, #8255ff);font-weight:600}.fr-search{width:100%;padding:6px 10px;margin-bottom:10px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text);font-size:.74rem;outline:none;box-sizing:border-box}.fr-search:focus{border-color:#8255ff66}.fr-grid{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px;max-height:130px;overflow-y:auto}.fr-pill{padding:4px 10px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--text-dim);font-size:.72rem;cursor:pointer;transition:all .12s;white-space:nowrap}.fr-pill:hover{border-color:#8255ff59;color:var(--text);background:#8255ff14}.fr-pill--active{background:#8255ff2e;border-color:var(--color-brand-purple-500, #8255ff);color:var(--color-brand-purple-500, #8255ff);font-weight:600}.fr-pill--keep{color:var(--text-faint);font-style:italic}.fr-preview-wrap{min-height:90px;padding:12px;border-radius:8px;background:#ffffff08;border:1px solid rgba(255,255,255,.07)}.fr-preview-empty{font-size:.72rem;color:var(--text-faint);font-style:italic}.fr-preview-inner{color:var(--text)}.fr-prev-h1{font-size:1.4rem;font-weight:700;line-height:1.2;margin-bottom:3px}.fr-prev-h2{font-size:1rem;font-weight:600;line-height:1.3;margin-bottom:3px;color:var(--text-dim)}.fr-prev-body{font-size:.78rem;line-height:1.6;color:var(--text-dim);margin-bottom:3px}.fr-prev-caption{font-size:.64rem;color:var(--text-faint)}.fr-footer{justify-content:space-between}.fr-footer-right{display:flex;gap:8px}.fr-skip-btn{background:none;border:none;color:var(--text-faint);font-size:.72rem;cursor:pointer;padding:4px 8px}.fr-skip-btn:hover{color:var(--text-dim)}.fr-apply-btn{padding:6px 16px;background:var(--color-brand-purple-500, #8255ff);border:none;border-radius:6px;color:var(--ui-color-text-inverse);font-size:.76rem;font-weight:600;cursor:pointer;transition:opacity .15s}.fr-apply-btn:hover{opacity:.85}.fr-preview-wrap{position:relative}.fr-expand-btn{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:4px;background:#ffffff12;border:1px solid rgba(255,255,255,.1);color:var(--text-faint);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s}.fr-expand-btn:hover{background:#8255ff26;border-color:#8255ff66;color:var(--color-brand-purple-500, #8255ff)}.fr-specimen-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;background:#0a0a0ce0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.fr-specimen-overlay.active{opacity:1}.fr-specimen-panel{width:min(720px,96vw);max-height:90vh;background:var(--surface, #1a1a1e);border:1px solid rgba(255,255,255,.08);border-radius:12px;display:flex;flex-direction:column;box-shadow:0 24px 64px #0009;transform:scale(.97);transition:transform .2s}.fr-specimen-overlay.active .fr-specimen-panel{transform:scale(1)}.fr-specimen-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0}.fr-specimen-title{font-size:.82rem;font-weight:700;color:var(--text);font-family:var(--mono, monospace)}.fr-specimen-close{width:28px;height:28px;border-radius:6px;background:none;border:none;color:var(--text-faint);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s}.fr-specimen-close:hover{background:#ffffff0f;color:var(--text)}.fr-specimen-body{flex:1;overflow-y:auto;padding:20px 24px;display:flex;flex-direction:column;gap:24px}.fr-specimen-section{display:flex;flex-direction:column;gap:4px}.fr-specimen-label{font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint);margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.05)}.fr-sp-display{font-size:3rem;font-weight:700;line-height:1.1;color:var(--text)}.fr-sp-h1{font-size:2rem;font-weight:700;line-height:1.2;color:var(--text)}.fr-sp-h2{font-size:1.5rem;font-weight:600;line-height:1.25;color:var(--text)}.fr-sp-h3{font-size:1.2rem;font-weight:600;line-height:1.3;color:var(--text)}.fr-sp-h4{font-size:1rem;font-weight:600;line-height:1.4;color:var(--text-dim)}.fr-sp-h5{font-size:.875rem;font-weight:600;line-height:1.4;color:var(--text-dim)}.fr-sp-h6{font-size:.78rem;font-weight:600;line-height:1.5;color:var(--text-dim);letter-spacing:.02em}.fr-sp-lead{font-size:1.05rem;line-height:1.6;color:var(--text-dim);margin-bottom:4px}.fr-sp-body{font-size:.88rem;line-height:1.65;color:var(--text-dim)}.fr-sp-small{font-size:.78rem;line-height:1.55;color:var(--text-faint);margin-top:4px}.fr-sp-caption{font-size:.68rem;line-height:1.5;color:var(--text-faint);margin-top:2px}.fr-sp-ui-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.fr-sp-btn{padding:6px 14px;border-radius:6px;font-size:.78rem;font-weight:600;cursor:default}.fr-sp-btn--primary{background:var(--color-brand-purple-500, #8255ff);border:none;color:var(--ui-color-text-inverse)}.fr-sp-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.18);color:var(--text-dim)}.fr-sp-tag{padding:2px 8px;border-radius:10px;font-size:.68rem;font-weight:500;background:#ffffff12;border:1px solid rgba(255,255,255,.12);color:var(--text-dim)}.fr-sp-badge{padding:2px 7px;border-radius:10px;font-size:.64rem;font-weight:700;background:#8255ff33;border:1px solid rgba(130,85,255,.4);color:var(--color-brand-purple-500, #8255ff)}.fr-sp-label{font-size:.72rem;font-weight:600;color:var(--text-dim)}.fr-sp-link{font-size:.78rem;color:var(--color-brand-purple-500, #8255ff);text-decoration:underline}.fr-sp-overline{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint)}.fr-sp-alpha{font-size:1rem;line-height:1.6;color:var(--text-dim);word-spacing:4px}.fr-sp-nums{font-size:.9rem;line-height:1.5;color:var(--text-faint);margin-top:4px;word-spacing:4px}.font-warning-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;margin-bottom:6px;background:#fbbf2414;border:1px solid rgba(251,191,36,.28);border-radius:6px;animation:font-badge-pulse 2.5s ease-in-out infinite}.font-warning-strip__left{display:flex;align-items:center;gap:6px;color:#fbbf24;font-size:.72rem;font-weight:500}.font-warning-strip__btn{flex-shrink:0;padding:3px 10px;background:#fbbf2426;border:1px solid rgba(251,191,36,.4);border-radius:4px;color:#fbbf24;font-size:.7rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s}.font-warning-strip__btn:hover{background:#fbbf2440}.font-canvas-popup{position:fixed;bottom:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:9px 14px;background:#161516eb;border:1px solid rgba(251,191,36,.45);border-radius:8px;color:#fbbf24;font-size:.74rem;font-weight:500;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 4px 20px #00000080;z-index:9000;white-space:nowrap;animation:font-badge-pulse 2.5s ease-in-out infinite}.font-canvas-popup__btn{padding:4px 12px;background:#fbbf242e;border:1px solid rgba(251,191,36,.45);border-radius:5px;color:#fbbf24;font-size:.7rem;font-weight:600;cursor:pointer;transition:background .15s}.font-canvas-popup__btn:hover{background:#fbbf244d}.font-settings-list{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0}.font-settings-chip{padding:2px 8px;background:#fbbf241a;border:1px solid rgba(251,191,36,.3);border-radius:12px;color:#fbbf24;font-size:.68rem;font-weight:500;font-family:var(--mono, monospace)}.font-settings-replace-btn{margin-top:4px;padding:5px 12px;background:#fbbf241f;border:1px solid rgba(251,191,36,.35);border-radius:5px;color:#fbbf24;font-size:.72rem;font-weight:600;cursor:pointer;width:100%;text-align:left;transition:background .15s}.font-settings-replace-btn:hover{background:#fbbf2438}.fr-modal{width:min(800px,94vw);max-height:88vh;display:flex;flex-direction:column}.fr-modal__subtitle{font-size:.75rem;color:var(--text-dim, rgba(255,255,255,.5));margin:4px 0 0}.fr-modal__body{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:20px}.fr-row{display:grid;grid-template-columns:1fr 1.6fr;gap:16px;padding:16px;background:#ffffff06;border:1px solid rgba(255,255,255,.07);border-radius:8px}.fr-row__left{display:flex;flex-direction:column;gap:6px}.fr-row__label{display:flex;align-items:center;gap:8px}.fr-badge{font-size:.85rem;line-height:1}.fr-badge--warn{color:#fbbf24}.fr-font-name{font-size:.82rem;font-weight:700;color:var(--text, #efedf4);font-family:var(--mono, monospace)}.fr-row__hint{font-size:.68rem;color:var(--text-faint, rgba(255,255,255,.35));line-height:1.4}.fr-row__right{display:flex;flex-direction:column;gap:8px}.fr-search{width:100%;padding:6px 10px;background:#ffffff0d;border:1px solid rgba(255,255,255,.12);border-radius:6px;color:var(--text, #efedf4);font-size:.76rem;outline:none;box-sizing:border-box}.fr-search:focus{border-color:#ffffff47}.fr-list{list-style:none;margin:0;padding:4px 0;max-height:140px;overflow-y:auto;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:6px}.fr-list__item{padding:5px 10px;font-size:.74rem;color:var(--text-dim, rgba(255,255,255,.6));cursor:pointer;border-radius:4px}.fr-list__item:hover{background:#ffffff0f;color:var(--text, #efedf4)}.fr-list__item--active{background:#8255ff2e;color:var(--color-brand-purple-400, #a882ff)}.fr-list__item--keep{color:var(--text-faint, rgba(255,255,255,.35));font-style:italic}.fr-preview{min-height:100px;padding:12px;background:#ffffff08;border:1px solid rgba(255,255,255,.07);border-radius:6px;overflow:hidden}.fr-preview__empty{font-size:.72rem;color:var(--text-faint, rgba(255,255,255,.3));font-style:italic}.fr-preview__inner{color:var(--text, #efedf4)}.fr-preview__h1{font-size:1.4rem;font-weight:700;line-height:1.2;margin-bottom:4px}.fr-preview__h2{font-size:1.1rem;font-weight:600;line-height:1.3;margin-bottom:4px}.fr-preview__h3{font-size:.9rem;font-weight:600;line-height:1.4;margin-bottom:6px}.fr-preview__body{font-size:.8rem;font-weight:400;line-height:1.6;margin-bottom:4px}.fr-preview__caption{font-size:.65rem;font-weight:400;line-height:1.5;color:var(--text-dim, rgba(255,255,255,.5))}.sc-tabs{display:flex;gap:2px;background:var(--el);border-radius:var(--r-sm);padding:3px;margin-bottom:12px}.sc-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 12px;border:none;background:transparent;color:var(--text-dim);font-size:12px;font-weight:500;border-radius:var(--r-xs);cursor:pointer;transition:color .15s,background .15s}.sc-tab:hover{color:var(--text);background:var(--el-hover)}.sc-tab--active{color:var(--text);background:var(--el-active, rgba(255,255,255,.08))}.sc-tab__badge{min-width:20px;height:18px;padding:0 5px;border-radius:var(--ui-radius-soft);font-size:10px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;background:#2e2e32;color:var(--text, #efedf4);border:none}.sc-tab--active .sc-tab__badge{background:var(--color-brand-purple-500);color:#fff}.sc-usage{margin-bottom:14px}.sc-usage__label{font-size:11px;color:var(--text-dim);margin-bottom:4px}.sc-usage__track{height:4px;background:var(--el-up);border-radius:2px;overflow:hidden}.sc-usage__fill{height:100%;border-radius:2px;transition:width .3s ease}.sc-usage--ok .sc-usage__fill{background:var(--ui-color-status-success)}.sc-usage--warn .sc-usage__fill{background:var(--ui-color-status-warning)}.sc-usage--full .sc-usage__fill{background:var(--ui-color-status-danger)}.sc-usage--full .sc-usage__label{color:var(--ui-color-status-danger)}.sc-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.sc-card{display:flex;flex-direction:column;background:var(--el);border:1px solid var(--border);border-radius:var(--r-sm);overflow:visible;transition:border-color .15s}.sc-card:hover{border-color:var(--border-up)}.sc-card__body{padding:10px 12px;flex:1;position:relative}.sc-card__type-badge{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;opacity:1;border:none}.sc-card__name{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.sc-card__meta{display:flex;gap:8px;font-size:11px;color:var(--text-dim)}.sc-card__pages{background:#2e2e32;color:var(--text, #efedf4);padding:2px 6px;border-radius:var(--ui-radius-soft);font-size:10px;font-weight:600;border:none}.sc-card__tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.sc-card__tag{font-size:10px;padding:2px 7px;border-radius:var(--ui-radius-soft);background:#2e2e32;color:var(--text, #efedf4);font-weight:500;border:none}.sc-card__tag--more{background:transparent;color:var(--text-faint)}.sc-card__actions{display:flex;align-items:center;gap:4px;padding:8px 12px;border-top:1px solid var(--border);position:relative}.sc-card__btn{border:none;border-radius:var(--ui-radius-soft);padding:4px 10px;font-size:11px;cursor:pointer}.sc-card__btn--load{background:var(--color-brand-purple-500);color:#fff;flex:1;font-weight:600}.sc-card__btn--load:hover{background:var(--color-pro-600);color:#fff}.sc-card__btn--more{background:transparent;color:var(--text-dim);font-size:16px;padding:2px 6px;line-height:1}.sc-card__btn--more:hover{background:var(--el-up);color:var(--text)}.sc-card__menu{position:absolute;right:8px;bottom:100%;margin-bottom:4px;background:var(--bg);border:1px solid var(--border-up);border-radius:var(--r-sm);box-shadow:var(--ui-shadow-md);min-width:140px;overflow:hidden;display:none;z-index:var(--ui-layer-dropdown)}.sc-card__menu.active{display:block}.sc-card__menu-item{display:block;width:100%;padding:8px 14px;border:none;background:transparent;color:var(--text-dim);font-size:12px;text-align:left;cursor:pointer;border-radius:0}.sc-card__menu-item:hover{background:var(--el-up);color:var(--text)}.sc-card__menu-item--danger{color:var(--ui-color-status-danger)}.sc-card__menu-item--danger:hover{background:#ef44441a}.sc-card--add{border-style:dashed;border-color:var(--border);cursor:pointer;min-height:140px;font:inherit;text-align:left;width:100%}.sc-card--add:hover{border-color:var(--border-up);background:var(--el-hover)}.sc-card__add-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:6px;padding:24px}.sc-card__add-icon{font-size:28px;color:var(--text-faint);line-height:1}.sc-card__add-label{font-size:12px;color:var(--text-dim)}.sc-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:var(--ui-layer-modal);opacity:0;transition:opacity .2s}.sc-modal-overlay.active{opacity:1}.sc-modal{background:var(--bg);border:1px solid var(--border-up);border-radius:var(--r);box-shadow:var(--ui-shadow-xl);width:420px;max-width:90vw;max-height:85vh;overflow-y:auto}.sc-modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.sc-modal__header h3{margin:0;font-size:15px;font-weight:600;color:var(--text)}.sc-modal__close{background:none;border:none;color:var(--text-dim);font-size:20px;cursor:pointer;padding:0;line-height:1}.sc-modal__close:hover{color:var(--text)}.sc-modal__body{padding:16px 20px}.sc-confirm-delete-btn{background:#ef444426;color:var(--ui-color-status-danger);border:1px solid rgba(239,68,68,.3);border-radius:var(--r-xs);padding:8px 16px;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s}.sc-confirm-delete-btn:hover{background:#ef444440}.sc-modal__footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--border)}.sc-save-field{margin-bottom:14px}.sc-save-field label{display:block;font-size:11px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}.sc-save-description{width:100%;resize:vertical;min-height:38px;padding:6px 10px;font-family:inherit;font-size:13px;background:var(--el);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs)}.sc-save-description:focus{outline:none;border-color:var(--border-up)}.sc-save-quota-info{font-size:11px;margin-top:4px;color:var(--text-dim)}.sc-save-quota--full{color:var(--ui-color-status-danger)}.sc-save-size{font-size:13px;color:var(--text)}.sc-save-size--over{color:var(--ui-color-status-danger);font-weight:600}.sc-save-size__max{color:var(--text-faint)}.sc-save-size__detail{color:var(--text-faint);font-size:11px}.sc-load-warning{font-size:13px;color:var(--ui-color-status-warning);line-height:1.5;margin:0}.sc-tag-editor__pills{display:flex;flex-wrap:wrap;gap:4px;padding:6px 8px;border:1px solid var(--border);border-radius:var(--r-xs);background:var(--el);min-height:36px;align-items:center}.sc-tag-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:var(--ui-radius-soft);background:#2e2e32;color:var(--text, #efedf4);font-size:11px;font-weight:500;border:none}.sc-tag-pill__remove{background:none;border:none;color:var(--text-faint);font-size:13px;cursor:pointer;padding:0;line-height:1}.sc-tag-pill__remove:hover{color:var(--ui-color-status-danger)}.sc-tag-editor__input{border:none;background:transparent;color:var(--text);font-size:12px;outline:none;min-width:60px;flex:1}.sc-tag-editor__input::placeholder{color:var(--text-faint)}.sc-save-dropdown{position:relative;display:inline-block}.sc-save-dropdown__menu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--bg);border:1px solid var(--border-up);border-radius:var(--r-sm);box-shadow:var(--ui-shadow-md);min-width:160px;overflow:hidden;display:none;z-index:var(--ui-layer-dropdown)}.sc-save-dropdown__menu.active{display:block}.sc-save-dropdown__item{display:block;width:100%;padding:8px 14px;border:none;background:transparent;color:var(--text-dim);font-size:12px;text-align:left;cursor:pointer;border-radius:0}.sc-save-dropdown__item:hover{background:var(--el-up);color:var(--text)}.sc-breadcrumb-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:8px}.sc-breadcrumb__path{display:flex;align-items:center;gap:2px;flex:1;min-width:0;overflow-x:auto}.sc-breadcrumb__item{background:none;border:none;color:var(--text-dim);font-size:12px;cursor:pointer;padding:2px 6px;border-radius:var(--r-xs);white-space:nowrap;transition:color .15s,background .15s}.sc-breadcrumb__item:hover{color:var(--text);background:var(--el-hover)}.sc-breadcrumb__item--active{color:var(--text);font-weight:600}.sc-breadcrumb__sep{color:var(--text-faint);font-size:11px}.sc-breadcrumb__new-folder{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;flex-shrink:0;background:none;border:1px solid var(--border);border-radius:var(--r-xs);color:var(--text-dim);cursor:pointer;transition:all .15s}.sc-breadcrumb__new-folder:hover{color:var(--text);border-color:var(--border-up);background:var(--el-hover)}.sc-card--folder{overflow:visible}.sc-folder__body{cursor:pointer}.sc-folder__icon-large{color:var(--text-dim);margin-bottom:4px;display:flex}.sc-folder-tree{max-height:300px;overflow-y:auto}.sc-folder-tree__item{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;border-radius:var(--r-xs);transition:background .15s}.sc-folder-tree__item:hover{background:var(--el-hover)}.sc-folder-tree__item--selected{background:var(--el-up);color:var(--text)}.sc-folder-tree__icon{color:var(--text-dim);flex-shrink:0;display:flex}.sc-loading-mark{transform-box:fill-box;transform-origin:center}.sc-loading-mark{animation:scLoadDot .9s cubic-bezier(.45,0,.55,1) infinite}@keyframes scLoadDot{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.annotation-overlay--empty{z-index:50}.annotation-empty-close{position:absolute;top:16px;right:16px;z-index:10;width:36px;height:36px;border-radius:10px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ffffff80;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:0;transition:all .12s}.annotation-empty-close svg{width:18px;height:18px}.annotation-empty-close:hover{background:#ffffff1f;color:#fff}.annotation-empty-card{position:relative;z-index:1;width:100%;background:#0e0e10e6;border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:48px 32px;gap:16px;text-align:center;box-sizing:border-box}.annotation-empty-card-icon{color:#ffffff26}.annotation-empty-card-icon svg{width:48px;height:48px}.annotation-empty-card-title{font-size:15px;font-weight:600;color:#ffffff80}.annotation-empty-card-hint{font-size:12px;color:#ffffff40;line-height:1.5}.annotation-empty-card-hint kbd{display:inline-block;padding:1px 6px;border-radius:4px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);font-family:var(--mono);font-size:11px;color:#fff6}.annotation-empty-new-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 16px;background:var(--color-brand-purple-500, #8255ff);border:none;border-radius:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s}.annotation-empty-new-btn:hover{opacity:.88}.annotation-empty-new-btn:active{transform:scale(.98)}.annotation-empty-viewport{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;overflow-x:hidden;padding:88px 24px 150px}.annotation-empty-viewport:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle,rgba(255,255,255,.12) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}.annotation-empty-center{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;max-width:380px;width:min(380px,calc(100vw - 48px));margin:auto;flex-shrink:0}.annotation-overlay--empty.annotation-overlay--drag-over .annotation-empty-viewport:before{background-image:radial-gradient(circle,rgba(var(--color-brand-green-rgb),.35) 1px,transparent 1px)}.annotation-overlay--empty.annotation-overlay--drag-over .annotation-empty-card{border-color:var(--color-brand-green-500);box-shadow:0 0 0 4px rgba(var(--color-brand-green-rgb),.15);transition:border-color .15s,box-shadow .15s}.annotation-overlay.annotation-overlay--canvas-drag:after{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border:2px dashed var(--color-brand-green-500);border-radius:14px;pointer-events:none;z-index:9999;background:rgba(var(--color-brand-green-rgb),.04)}.annotation-empty-saved-list{display:flex;flex-direction:column;gap:8px}.annotation-empty-center:has(.annotation-empty-site-card){max-width:min(1180px,calc(100vw - 48px));width:min(1180px,calc(100vw - 48px))}.annotation-empty-center:has(.annotation-empty-site-card) .annotation-empty-new-btn{display:none}.annotation-empty-center:has(.annotation-empty-site-card) .annotation-empty-saved-list{display:grid;grid-template-columns:repeat(auto-fill,280px);justify-content:center;gap:16px;align-content:start}.annotation-empty-new-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:220px;border:1px dashed var(--border-up);border-radius:var(--r-sm);background:rgba(var(--color-brand-purple-rgb),.04);color:var(--text-dim);font-family:var(--font);font-size:14px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s,color .15s}.annotation-empty-new-tile:hover{border-color:var(--color-brand-purple-500);background:rgba(var(--color-brand-purple-rgb),.1);color:var(--text)}.annotation-empty-new-tile svg{width:28px;height:28px}.annotation-empty-site-card{display:flex;flex-direction:column;overflow:hidden;background:#0e0e10e6;border:1px solid var(--border);border-radius:var(--r-sm);transition:border-color .15s;width:100%}.annotation-empty-site-card:hover{border-color:var(--border-up)}.annotation-empty-site-thumb{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--el);display:flex;align-items:center;justify-content:center}.annotation-empty-site-initial{font-size:32px;font-weight:700;color:var(--text-faint);opacity:.4}.annotation-empty-site-preview{position:absolute;top:0;right:0;bottom:0;left:0;width:200%;height:200%;transform:scale(.5);transform-origin:top left;border:none;pointer-events:none;opacity:0;transition:opacity .3s}.annotation-empty-site-body{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}.annotation-empty-site-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.annotation-empty-site-meta{font-size:10px;color:var(--text-faint);flex-shrink:0}.annotation-empty-site-load{padding:5px 14px;border:1px solid var(--border);border-radius:var(--r-xs);background:transparent;color:var(--text-dim);font-size:11px;cursor:pointer;flex-shrink:0;transition:all .15s;margin:0 12px 10px}.annotation-empty-site-load:hover{background:var(--el-up);color:var(--text);border-color:var(--border-up)}.sc-card--dragging{opacity:.4}.sc-card--drop-target{border-color:var(--ui-color-status-info)!important;background:rgba(var(--color-brand-purple-rgb),.08)!important}.sc-card-grid--list{grid-template-columns:1fr;gap:4px}.sc-card-grid--list .sc-card{flex-direction:row;align-items:center}.sc-card-grid--list .sc-card__body{flex-direction:row;display:flex;align-items:center;gap:12px;padding:8px 12px}.sc-card-grid--list .sc-card__type-badge{position:static;opacity:1;flex-shrink:0}.sc-card-grid--list .sc-card__name{flex:1;min-width:0;margin-bottom:0}.sc-card-grid--list .sc-card__meta{flex-shrink:0}.sc-card-grid--list .sc-card__tags{display:none}.sc-card-grid--list .sc-card__actions{border-top:none;border-left:1px solid var(--border);padding:4px 8px}.sc-card-grid--list .sc-card--add{min-height:auto}.sc-card-grid--list .sc-card__add-inner{flex-direction:row;padding:8px 12px}.sc-breadcrumb__view-toggle{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;flex-shrink:0;background:none;border:1px solid var(--border);border-radius:var(--r-xs);color:var(--text-dim);cursor:pointer;transition:all .15s}.sc-breadcrumb__view-toggle:hover{color:var(--text);border-color:var(--border-up);background:var(--el-hover)}.sc-breadcrumb__tools{display:flex;gap:4px;flex-shrink:0}.help-body{max-height:60vh;overflow-y:auto}.help-section{margin-bottom:16px}.help-section-title{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);font-weight:600;margin-bottom:8px}.help-row{display:flex;align-items:center;justify-content:space-between;padding:4px 0;gap:12px}.help-keys{display:flex;align-items:center;gap:4px;flex-shrink:0}.help-key{display:inline-block;padding:2px 8px;border-radius:4px;background:var(--el-up);border:1px solid var(--border);font-family:var(--mono);font-size:11px;color:var(--text-dim);min-width:24px;text-align:center}.help-plus{color:var(--text-faint);font-size:10px}.help-desc{font-size:12px;color:var(--text-dim)}.onboarding-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:199998;background:#00000080}.onboarding-highlight{position:relative;z-index:199999!important;box-shadow:0 0 0 4px rgba(var(--color-brand-purple-rgb),.5),0 0 20px rgba(var(--color-brand-purple-rgb),.3)!important;border-radius:8px}.onboarding-tooltip{position:fixed;z-index:200000;background:var(--bg);border:1px solid var(--border-up);border-radius:var(--r-sm);box-shadow:0 8px 32px #00000080;padding:16px 20px;max-width:300px;opacity:0;transition:opacity .2s}.onboarding-tooltip.active{opacity:1}.onboarding-tooltip-title{font-size:14px;font-weight:600;color:var(--text);margin-bottom:6px}.onboarding-tooltip-text{font-size:12px;color:var(--text-dim);line-height:1.5;margin-bottom:12px}.onboarding-tooltip-actions{display:flex;align-items:center;gap:8px}.onboarding-tooltip-progress{font-size:10px;color:var(--text-faint);flex:1}.onboarding-tooltip-skip{background:none;border:none;color:var(--text-faint);font-size:11px;cursor:pointer;padding:4px 8px}.onboarding-tooltip-skip:hover{color:var(--text-dim)}.onboarding-tooltip-next{background:var(--el-up);border:1px solid var(--border);border-radius:var(--r-xs);color:var(--text);font-size:11px;padding:5px 14px;cursor:pointer;transition:all .15s}.onboarding-tooltip-next:hover{background:var(--border-up)}.legal-body{max-height:65vh;overflow-y:auto;font-size:13px;color:var(--text-dim);line-height:1.6}.legal-body h3{font-size:14px;color:var(--text);margin:16px 0 6px}.legal-body p{margin:0 0 10px}.legal-body ul{margin:0 0 10px;padding-left:20px}.legal-body li{margin-bottom:4px}.legal-body a{color:var(--ui-color-status-info)}.legal-body strong{color:var(--text)}.legal-body code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;padding:1px 4px;border-radius:3px;background:var(--el-up);color:var(--text)}.legal-body em{color:var(--text-faint);font-style:italic}.legal-link-inline{background:none;border:none;padding:0;font:inherit;color:var(--ui-color-status-info);cursor:pointer;text-decoration:underline}.legal-link-inline:hover{opacity:.8}.legal-table{width:100%;border-collapse:collapse;margin:6px 0 14px;font-size:12px}.legal-table th,.legal-table td{text-align:left;padding:6px 8px;vertical-align:top;border-bottom:1px solid var(--border)}.legal-table th{color:var(--text);font-weight:600;background:var(--el-up)}.legal-table td{color:var(--text-dim)}.legal-table code{font-size:10px}.legal-links{display:flex;gap:8px;align-items:center;pointer-events:auto}.legal-link{background:none;border:none;padding:0;color:var(--text-faint);font-size:10px;cursor:pointer;transition:color .15s;pointer-events:auto;text-decoration:none}.legal-link:hover{color:var(--text-dim)}.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid var(--border);padding:12px 24px;display:flex;align-items:center;justify-content:center;gap:16px;z-index:200000;opacity:0;transform:translateY(100%);transition:opacity .3s,transform .3s}.cookie-banner.active{opacity:1;transform:translateY(0)}.cookie-banner__text{font-size:12px;color:var(--text-dim)}.cookie-banner__link{background:none;border:none;color:var(--ui-color-status-info);font-size:12px;cursor:pointer;text-decoration:underline;padding:0}.cookie-banner__accept{padding:5px 14px;border:1px solid var(--border);border-radius:var(--r-xs);background:var(--el-up);color:var(--text);font-size:11px;cursor:pointer;flex-shrink:0;transition:all .15s}.cookie-banner__accept:hover{background:var(--border-up)}.sc-controls{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sc-search{flex:1;min-width:0;padding:6px 10px;background:var(--el);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs);font-size:12px}.sc-search:focus{outline:none;border-color:var(--border-up)}.sc-search::placeholder{color:var(--text-faint)}.sc-sort{padding:6px 8px;background:var(--el);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs);font-size:12px;cursor:pointer;flex-shrink:0}.sc-select-toggle{padding:6px 12px;background:var(--el-up);color:var(--text);border:1px solid var(--border);border-radius:var(--r-xs);font-size:12px;cursor:pointer;flex-shrink:0;transition:all .15s}.sc-select-toggle:hover{background:var(--border-up)}.sc-select-toggle--active{background:var(--color-brand-purple-500);color:#fff;border-color:var(--color-brand-purple-500)}.sc-bulk-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;padding:8px 12px;background:var(--el-up);border:1px solid var(--border-up);border-radius:var(--r-xs)}.sc-bulk-count{font-size:12px;font-weight:600;color:var(--text)}.sc-bulk-actions{display:flex;gap:6px}.sc-bulk-delete{color:var(--ui-color-status-danger)}.sc-card--selectable{position:relative}.sc-card--selectable .sc-card__select{position:absolute;top:8px;left:8px;z-index:2;width:16px;height:16px;cursor:pointer;accent-color:var(--color-brand-purple-500)}.sc-card--selected{border-color:var(--color-brand-purple-500)}.sc-card--selected:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:2px solid var(--color-brand-purple-500);border-radius:var(--r-sm);pointer-events:none}.sc-error-state{display:flex;flex-direction:column;align-items:center;gap:10px}.sc-error-state .sc-retry-btn{flex:0 0 auto}.sc-save-optional{color:var(--text-faint);font-weight:400;font-size:11px}.ui-section-label,.dashboard-section-title,.ann-settings-section-label{font-size:var(--ui-font-size-label-xs);font-weight:var(--ui-font-weight-bold);letter-spacing:var(--ui-letter-spacing-label);text-transform:uppercase;color:#ffffff59}.ui-note,.dashboard-note,.ann-settings-hint,.sc-save-quota-info{font-size:var(--ui-font-size-body-md);line-height:1.5;color:var(--ui-color-text-muted)}.ui-card,.dashboard-card,.sc-card,.conv-extra-card{background:var(--ui-color-bg-panel);border:var(--ui-border-width) solid var(--ui-color-border-subtle);border-radius:var(--ui-radius-5)}.auth-modal-content,.upgrade-content,.home-settings-panel,.sc-modal{box-shadow:var(--ui-shadow-lg)}.ui-card--strong,.dashboard-plan-card--current{border-color:rgba(var(--color-brand-green-rgb),.35);box-shadow:inset 0 0 0 1px rgba(var(--color-brand-green-rgb),.12)}.ui-btn,.auth-btn,.conv-btn,.sc-card__btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-space-2);min-height:34px;padding:0 var(--ui-space-8);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-3);background:transparent;color:var(--ui-color-text-soft);font-family:var(--ui-font-family-sans);font-size:var(--ui-font-size-body-md);font-weight:var(--ui-font-weight-semibold);line-height:1;text-decoration:none;cursor:pointer;transition:background var(--ui-duration-base),border-color var(--ui-duration-base),color var(--ui-duration-base),box-shadow var(--ui-duration-base),transform var(--ui-duration-fast)}.ui-btn:hover,.auth-btn:hover,.conv-btn:hover,.sc-card__btn:hover{color:var(--ui-color-text)}.ui-btn:active,.auth-btn:active,.conv-btn:active,.sc-card__btn:active{transform:scale(.98)}.ui-btn:disabled,.auth-btn:disabled,.conv-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.ui-btn--primary,.auth-btn-primary,.conv-btn-primary{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse);border-color:var(--color-success-600);box-shadow:0 1px #ffffff38 inset}.ui-btn--primary:hover:not(:disabled),.auth-btn-primary:hover:not(:disabled),.conv-btn-primary:hover:not(:disabled){background:var(--color-success-600);color:var(--ui-color-text-inverse);border-color:#16151673;box-shadow:0 0 0 1px #1615161f inset}.ui-btn--primary:focus-visible,.auth-btn-primary:focus-visible,.conv-btn-primary:focus-visible{outline:none;background:var(--color-success-600);color:var(--ui-color-text-inverse);border-color:var(--ui-color-bg-canvas);box-shadow:0 0 0 3px rgba(var(--color-brand-green-rgb),.28)}.ui-btn--ghost,.conv-btn-ghost,.sc-card__btn--load{background:var(--ui-color-bg-panel);color:var(--ui-color-text-muted);border-color:var(--ui-color-border-subtle)}.ui-btn--ghost:hover,.conv-btn-ghost:hover,.sc-card__btn--load:hover{background:var(--ui-color-bg-elevated);border-color:var(--ui-color-border-strong)}.ui-btn--danger,.sc-confirm-delete-btn{background:#ef444426;color:var(--ui-color-status-danger);border-color:#ef44444d}.ui-btn--danger:hover,.sc-confirm-delete-btn:hover{background:#ef444440}.ui-btn--google,.auth-btn-google{width:100%;background:var(--ui-color-bg-panel-strong);color:var(--ui-color-text);border-color:var(--ui-color-border-default)}.ui-btn--google:hover,.auth-btn-google:hover{border-color:var(--ui-color-border-strong)}.ui-field,.auth-input,.sc-tag-editor__input{border-radius:var(--ui-radius-3)}.ui-pill,.dashboard-tier-badge,.sc-card__tag,.sc-card__pages,.sc-tab__badge{display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-space-1);min-height:18px;padding:0 8px;border-radius:var(--ui-radius-soft);font-size:var(--ui-font-size-label-xs);font-weight:var(--ui-font-weight-semibold)}.dashboard-tier-badge.free{color:var(--ui-color-text-muted);background:#2e2e32;border:none}.dashboard-tier-badge.pro{color:var(--ui-color-text-inverse);background:var(--color-brand-purple-500);border:none}.dashboard-tier-badge.admin{color:#fff;background:var(--color-brand-purple-500);border:none}.ui-menu,.auth-user-menu,.sc-card__menu,.sc-save-dropdown__menu,.breadcrumb-page-menu,.breadcrumb-sites-menu{background:var(--ui-color-bg-solid);border:var(--ui-border-width) solid var(--ui-color-border-strong);border-radius:var(--ui-radius-3);box-shadow:var(--ui-shadow-md);backdrop-filter:var(--ui-blur-md);-webkit-backdrop-filter:var(--ui-blur-md)}.ui-menu__item,.auth-menu-item,.sc-card__menu-item,.sc-save-dropdown__item,.breadcrumb-page-item,.breadcrumb-sites-item{color:var(--ui-color-text-muted);transition:background var(--ui-duration-fast),color var(--ui-duration-fast)}.ui-menu__item:hover,.auth-menu-item:hover,.sc-card__menu-item:hover,.sc-save-dropdown__item:hover,.breadcrumb-page-item:hover,.breadcrumb-sites-item:hover{background:var(--ui-color-bg-panel-strong);color:var(--ui-color-text)}.sc-card__menu-item--danger,.sc-tag-pill__remove:hover,.dashboard-project-actions button.delete:hover{color:var(--ui-color-status-danger)}.ui-modal,.sc-modal{width:min(var(--ui-modal-width-md),90vw);max-height:85vh;overflow-y:auto}.ui-modal__header,.sc-modal__header,.ann-settings-header{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-space-5);padding:var(--ui-space-8);border-bottom:var(--ui-border-width) solid var(--ui-color-border-subtle)}.ui-modal__body,.sc-modal__body,.ann-settings-body{padding:var(--ui-space-8)}.ui-modal__footer,.sc-modal__footer{display:flex;justify-content:flex-end;gap:var(--ui-space-3);padding:var(--ui-space-6) var(--ui-space-8);border-top:var(--ui-border-width) solid var(--ui-color-border-subtle)}.ui-modal__copy,.sc-modal__text{margin:0;font-size:var(--ui-font-size-body-md);line-height:1.5;color:var(--ui-color-text-muted)}.ui-toast,.canvas-notification{display:flex;align-items:center;gap:var(--ui-space-4);padding:var(--ui-space-4) var(--ui-space-7);border-radius:var(--ui-radius-4);background:var(--ui-color-bg-solid);border:var(--ui-border-width) solid var(--ui-color-border-subtle);box-shadow:var(--ui-shadow-lg);backdrop-filter:var(--ui-blur-md);-webkit-backdrop-filter:var(--ui-blur-md)}.canvas-notification--success .canvas-notif-icon{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.canvas-notification--error .canvas-notif-icon{background:var(--ui-color-status-danger);color:#fff}.canvas-notification--warning .canvas-notif-icon{background:var(--color-brand-green-500);color:var(--ui-color-text-inverse)}.canvas-notification--info .canvas-notif-icon{background:var(--color-brand-purple-500);color:#fff}.canvas-notification--loading .canvas-notif-icon{background:transparent;color:var(--ui-color-text-muted)}.canvas-notif-title{color:var(--ui-color-text)}.sc-card__type-badge--site{color:#fff;background:var(--color-brand-purple-500)}.sc-card__type-badge--page{color:var(--ui-color-text-inverse);background:var(--color-brand-green-500)}.sc-card__type-badge--component{color:#fff;background:#d946ef}.sc-card__type-badge--unknown{color:#fff;background:#3a3a3f}.sc-card__btn{border-radius:var(--ui-radius-soft)}.canvas-export-bubble{position:absolute;bottom:86px;left:50%;transform:translate(-50%);z-index:100012;display:flex;flex-direction:column;gap:8px;padding:12px 18px;border-radius:var(--ui-radius-4);background:var(--ui-color-bg-solid);border:var(--ui-border-width) solid var(--ui-color-border-subtle);box-shadow:var(--ui-shadow-lg);backdrop-filter:var(--ui-blur-md);-webkit-backdrop-filter:var(--ui-blur-md);width:min(320px,calc(100vw - 32px));pointer-events:none}.canvas-export-bubble__label{font-size:11px;letter-spacing:.04em;color:#ffffffb3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-export-bubble__track{width:100%;height:4px;border-radius:2px;background:#ffffff1a;overflow:hidden}.canvas-export-bubble__fill{display:block;height:100%;width:0%;border-radius:2px;background:linear-gradient(90deg,var(--color-brand-purple-500) 0%,var(--color-brand-green-500) 100%);transition:width .3s ease}.ui-progress-track,.conv-export-bar-track{width:100%;height:3px;background:#ffffff1a;border-radius:2px;overflow:hidden}.ui-progress-fill,.conv-export-bar-fill{height:100%;width:0%;background:var(--color-brand-green-500);border-radius:2px;transition:width .3s ease}.progress-bar{margin-top:4px;height:3px;width:100%;background:#ffffff1a;border-radius:2px;overflow:hidden}.progress-bar__fill{height:100%;width:0%;background:var(--color-brand-green-500);border-radius:2px;transition:width .3s ease}.canvas-loader-fill{display:block;height:100%;width:0%;border-radius:2px;background:linear-gradient(90deg,var(--color-brand-purple-500) 0%,var(--color-brand-green-500) 100%);transition:width .3s ease}.screen-loading-bar{z-index:5;padding:0 clamp(16px,5vw,40px) max(20px,env(safe-area-inset-bottom,0px));box-sizing:border-box;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:10px}.screen-loading-bar--preloader,.screen-loading-bar--conv{position:fixed;bottom:0;left:0;right:0}.screen-loading-bar--conv{z-index:6;opacity:1;visibility:visible}.screen-loading-bar--canvas{position:absolute;left:0;right:0;bottom:86px;z-index:100012;padding-bottom:0}.screen-loading-bar__label{font-size:11px;letter-spacing:.04em;color:#ffffff73;white-space:nowrap}.screen-loading-bar__track{width:100%;max-width:min(400px,calc(100vw - 32px));height:4px;border-radius:2px;background:#ffffff1a;overflow:hidden;position:relative}.screen-loading-bar__fill{position:absolute;top:0;left:0;height:100%;width:0%;border-radius:2px;background:linear-gradient(90deg,var(--color-brand-purple-500) 0%,var(--color-brand-green-500) 100%);transition:width .15s ease-out}@media (prefers-reduced-motion: reduce){.screen-loading-bar__fill{transition:none}}
