:root{color:#101215;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--bg:#e8edf2;--bg-soft:#f7f9fb;--surface:#ffffffa8;--surface-strong:#fffffff5;--surface-muted:#f3f7fabd;--surface-tint:#e8f0f8a3;--text:#121417;--muted:#68707b;--subtle:#8b939d;--line:#31394421;--line-strong:#31394433;--accent:#147efb;--accent-2:#34c759;--accent-3:#ff9f0a;--danger:#ff453a;--glass:#ffffff85;--shadow:0 30px 90px #2027312e;--shadow-soft:0 16px 46px #2027311c;--shadow-tight:0 7px 18px #20273114;--radius-lg:24px;--radius-md:16px;--radius-sm:10px;--control:36px;--gap:16px;background:#e7ebef;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;overflow:hidden}button,input{font:inherit}button{border:0}button:focus-visible,input:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 52%, transparent);outline-offset:2px}[data-theme=graphite]{--bg:#111316;--bg-soft:#191d22;--surface:#23272db8;--surface-strong:#2a2e35f0;--surface-muted:#1a1e23b8;--surface-tint:#292f389e;--text:#f6f7f9;--muted:#aeb6c1;--subtle:#818b98;--line:#ffffff1f;--line-strong:#fff3;--accent:#5eb0ff;--accent-2:#5bd66f;--accent-3:#ffd166;--glass:#ffffff14;--shadow:0 28px 80px #0000006b;--shadow-soft:0 14px 40px #00000047}[data-theme=pro]{--bg:#dbe1e7;--bg-soft:#edf1f4;--surface:#fbfcfdc7;--surface-strong:#fffffff5;--surface-muted:#eff4f8d1;--surface-tint:#e5ebf0c7;--text:#101418;--muted:#59636e;--subtle:#7b8590;--line:#1f2a3729;--accent:#006bd6;--accent-2:#008f5a;--accent-3:#b25600;--glass:#ffffff61}[data-theme=contrast]{--bg:#f5f5f5;--bg-soft:#fff;--surface:#fff;--surface-strong:#fff;--surface-muted:#f7f7f7;--surface-tint:#f1f1f1;--text:#000;--muted:#303030;--subtle:#555;--line:#00000047;--line-strong:#0000007a;--accent:#0040ff;--accent-2:#006b3f;--accent-3:#8f4500;--glass:#ffffffeb;--shadow:0 18px 46px #0000002e}[data-density=compact]{--control:32px;--gap:12px}[data-density=spacious]{--control:42px;--gap:20px}.studio{background:linear-gradient(115deg, #ffffff94, transparent 28%), linear-gradient(155deg, var(--bg), var(--bg-soft) 46%, color-mix(in srgb, var(--accent-2) 7%, var(--bg)) 100%);height:100vh;color:var(--text);grid-template-columns:260px 1fr;display:grid}.sidebar,.inspector,.topbar,.hero-panel,.wide-panel,.metric-card,.component-card,.showcase,.pattern-card,.pattern-preview,.asset-card,.surface-card,.motion-card,.motion-stage,.coverage-card{border:1px solid var(--line);background:var(--surface);-webkit-backdrop-filter:blur(28px)saturate(1.4);box-shadow:var(--shadow-soft)}.sidebar{box-shadow:none;border-width:0 1px 0 0;flex-direction:column;gap:24px;padding:18px;display:flex}.brand{align-items:center;gap:12px;min-height:48px;display:flex}.brand-mark{color:#fff;background:linear-gradient(145deg,#147efb,#34c759db),#147efb;border-radius:12px;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 14px 30px #147efb52}.brand strong,.inspector-device strong,.component-card strong,.pattern-card strong,.asset-card strong,.surface-card strong,.coverage-card strong{letter-spacing:0;font-size:13px;display:block}.brand span,.inspector-device span,.component-card p,.pattern-card p,.asset-card p,.metric-card p{color:var(--muted);font-size:12px;line-height:1.45}.nav-list{gap:6px;display:grid}.nav-item,.device-row,.showcase-nav,.command-items button{min-height:var(--control);color:var(--muted);cursor:pointer;background:0 0;border-radius:11px;align-items:center;gap:10px;transition:background .18s,color .18s,transform .18s;display:flex}.nav-item{text-align:left;padding:0 11px}.nav-item:hover,.device-row:hover,.showcase-nav:hover,.command-items button:hover{color:var(--text);background:var(--glass)}.nav-item.active,.device-row.active,.showcase-nav.active{color:var(--text);background:color-mix(in srgb, var(--accent) 14%, var(--glass));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent)}.sidebar-panel{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-muted);margin-top:auto;padding:14px}.sidebar-panel strong{margin-top:5px;font-size:13px;display:block}.sidebar-panel p{color:var(--muted);margin:8px 0 14px;font-size:12px;line-height:1.4}.meter{background:color-mix(in srgb, var(--muted) 16%, transparent);border-radius:99px;height:7px;overflow:hidden}.meter span{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%;display:block}.workspace{grid-template-rows:auto 1fr;width:100%;min-width:0;max-width:100%;display:grid;overflow:hidden}.topbar{background:linear-gradient(180deg, #ffffff8a, #ffffff47), var(--surface);min-width:0;max-width:100%;min-height:72px;box-shadow:inset 0 1px 0 #ffffffb8, var(--shadow-soft);border-radius:22px;justify-content:space-between;align-items:center;gap:16px;margin:14px 14px 0;padding:12px 14px 12px 18px;display:flex}.title-block h1,.section-header h2,.hero-copy h2{letter-spacing:0;margin:0}.title-block h1{font-size:24px;font-weight:760}.eyebrow{color:var(--accent);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:740}.topbar-actions{border:1px solid var(--line);background:linear-gradient(180deg, #ffffff6b, #ffffff29), var(--surface-tint);border-radius:16px;align-items:center;gap:8px;min-width:0;max-width:100%;padding:5px;display:flex;box-shadow:inset 0 1px #ffffff8f}.search-button,.primary-button,.secondary-button,.icon-button,.device-chip{min-height:var(--control);cursor:pointer;border-radius:11px;justify-content:center;align-items:center;gap:8px;transition:transform .16s,box-shadow .16s,background .16s;display:inline-flex}.search-button{min-width:216px;color:var(--muted);border:1px solid color-mix(in srgb, var(--line) 86%, transparent);background:linear-gradient(180deg, #ffffffc7, #ffffff94), var(--surface-strong);box-shadow:var(--shadow-tight);justify-content:flex-start;padding:0 10px}.search-button kbd,.command-list-mini kbd{min-width:24px;color:var(--subtle);background:color-mix(in srgb, var(--muted) 12%, transparent);border-radius:6px;margin-left:auto;padding:2px 6px;font-size:11px}.top-segment,.segmented{border:1px solid color-mix(in srgb, var(--line) 82%, transparent);background:linear-gradient(180deg, #fff6, transparent), color-mix(in srgb, var(--surface-muted) 84%, transparent);border-radius:13px;padding:2px;display:inline-flex}.top-segment button,.segmented button{min-height:calc(var(--control) - 9px);color:var(--muted);cursor:pointer;background:0 0;border-radius:10px;padding:0 11px}.top-segment button.active,.segmented button.active{color:var(--text);background:linear-gradient(180deg, #fff, color-mix(in srgb, var(--surface-strong) 86%, #eef3f7));box-shadow:inset 0 1px #ffffffdb,0 7px 18px #2027311a}.primary-button{color:#fff;background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 88%, #fff), var(--accent));box-shadow:0 12px 26px color-mix(in srgb, var(--accent) 26%, transparent);padding:0 14px}.secondary-button{color:var(--text);border:1px solid var(--line);background:var(--surface-strong);padding:0 13px}.secondary-button.compact{min-height:34px}.icon-button{width:var(--control);color:var(--muted);border:1px solid var(--line);background:linear-gradient(180deg, #ffffffbd, #ffffff8a), var(--surface-strong);box-shadow:var(--shadow-tight)}.icon-button.small{border-radius:9px;width:30px;min-height:30px}.icon-button.active{color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--surface-strong))}.primary-button:active,.secondary-button:active,.icon-button:active,.device-chip:active{transform:scale(.98)}.content-grid{grid-template-columns:minmax(0,1fr);gap:14px;min-width:0;max-width:100%;min-height:0;padding:14px;display:grid}.content-grid.inspector-visible{grid-template-columns:minmax(0,1fr) 306px}.canvas{min-width:0;max-width:100%;padding-right:2px;overflow:auto}.overview-grid,.section-stack{gap:var(--gap);min-width:0;max-width:100%;display:grid}.hero-panel{border-radius:var(--radius-lg);background:linear-gradient(90deg, #ffffffb8, #ffffff6b), var(--surface);grid-template-columns:minmax(340px,.92fr) minmax(420px,1.08fr);min-width:0;max-width:100%;min-height:600px;display:grid;overflow:hidden}.hero-copy{flex-direction:column;justify-content:center;min-width:0;max-width:100%;padding:56px;display:flex}.hero-copy h2{max-width:620px;margin-top:10px;font-size:58px;font-weight:790;line-height:.98}.hero-copy p{max-width:620px;color:var(--muted);margin:22px 0 0;font-size:17px;line-height:1.55}.hero-actions{gap:10px;margin-top:28px;display:flex}.hero-actions .primary-button,.hero-actions .secondary-button{white-space:nowrap;min-width:132px}.hero-actions .secondary-button{min-width:152px}.hero-visual{background:linear-gradient(145deg, #ffffff70, transparent 38%), linear-gradient(180deg, color-mix(in srgb, var(--accent) 9%, var(--surface-muted)), color-mix(in srgb, var(--accent-2) 8%, var(--surface-muted)));grid-template-rows:auto minmax(0,1fr) auto;gap:18px;min-width:0;max-width:100%;min-height:600px;padding:26px 28px 28px;display:grid;position:relative}.floating-island{z-index:4;color:#fff;background:#08090a;border-radius:999px;justify-self:center;align-items:center;gap:8px;min-height:36px;padding:0 12px;display:flex;position:relative;box-shadow:0 16px 38px #00000042}.floating-island span,.floating-island strong{font-size:12px}.floating-island strong{color:#66d87a}.device-stage{place-items:center;min-height:0;display:grid}.device-picker{border:1px solid color-mix(in srgb, var(--line) 86%, transparent);background:linear-gradient(180deg, #ffffff85, #ffffff47), color-mix(in srgb, var(--surface) 88%, transparent);border-radius:22px;flex-wrap:wrap;justify-content:center;justify-self:center;gap:6px;max-width:590px;padding:6px;display:flex;box-shadow:inset 0 1px #ffffffb8,0 18px 42px #2027311f}.device-chip{min-height:32px;color:var(--muted);box-shadow:none;background:0 0;border:1px solid #0000;border-radius:15px;padding:0 11px}.device-chip.active{color:var(--text);border-color:color-mix(in srgb, var(--accent) 34%, var(--line));background:linear-gradient(180deg, #ffffffeb, #ffffffb8), color-mix(in srgb, var(--accent) 10%, var(--surface-strong));box-shadow:inset 0 1px #ffffffdb,0 8px 20px #147efb1f}.foundation-grid{gap:var(--gap);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.metric-card{border-radius:var(--radius-md);min-height:170px;padding:18px}.metric-card svg{color:var(--accent)}.metric-card span{color:var(--muted);margin-top:14px;font-size:12px;display:block}.metric-card strong{margin-top:4px;font-size:36px;line-height:1;display:block}.wide-panel{border-radius:var(--radius-lg);padding:20px}.section-header{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:14px;display:flex}.section-header h2{max-width:900px;margin-top:5px;font-size:34px;line-height:1.06}.header-pill,.status{white-space:nowrap;border:1px solid var(--line);min-height:28px;color:var(--muted);background:var(--surface-strong);border-radius:999px;justify-content:center;align-items:center;padding:0 10px;font-size:12px;font-weight:650;display:inline-flex}.timeline{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;display:grid}.timeline-step{border:1px solid var(--line);background:var(--surface-muted);border-radius:16px;min-height:160px;padding:14px}.timeline-step span{color:#fff;background:var(--accent);border-radius:50%;place-items:center;width:28px;height:28px;font-size:12px;font-weight:750;display:grid}.timeline-step strong{margin-top:16px;display:block}.timeline-step p{color:var(--muted);margin:8px 0 0;font-size:12px;line-height:1.4}.device-lab{gap:var(--gap);grid-template-columns:280px minmax(0,1fr);display:grid}.device-rail,.device-canvas{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.device-rail{align-content:start;gap:6px;padding:12px;display:grid}.device-row{text-align:left;padding:10px}.device-row div{min-width:0}.device-row span{color:var(--muted);margin-top:2px;font-size:12px;display:block}.device-canvas{background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent), var(--surface);place-items:center;min-height:620px;padding:32px;display:grid;overflow:hidden}.surface-grid{gap:var(--gap);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.surface-card{border-radius:var(--radius-md);min-height:190px;padding:16px}.surface-title{color:var(--accent);align-items:center;gap:9px;display:flex}.live-activity{color:#fff;background:#08090a;border-radius:22px;justify-content:space-between;align-items:center;gap:12px;margin-top:24px;padding:16px;display:flex}.live-activity span{color:#ffffff9e;margin-bottom:4px;font-size:12px;display:block}.progress-ring{background:radial-gradient(circle at center, #08090a 52%, transparent 54%), conic-gradient(#32d74b 72%, #fff3 0);color:#fff;border-radius:50%;place-items:center;width:54px;height:54px;font-size:13px;font-weight:760;display:grid}.widget-mini-grid{grid-template-columns:.8fr 1.2fr;gap:10px;margin-top:22px;display:grid}.widget-mini-grid span{background:linear-gradient(145deg, color-mix(in srgb, var(--accent) 22%, transparent), transparent), var(--surface-strong);border-radius:14px;min-height:48px}.widget-mini-grid span:nth-child(3){grid-column:span 2}.command-list-mini{gap:8px;margin-top:22px;display:grid}.command-list-mini div{background:var(--surface-muted);border-radius:10px;align-items:center;min-height:34px;padding:0 10px;display:flex}.command-list-mini span{color:var(--muted);font-size:12px}.component-grid,.coverage-grid{gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.component-card{border-radius:var(--radius-md);padding:16px}.component-card-header{align-items:flex-start;gap:12px;margin-bottom:14px;display:flex}.component-card-header svg{color:var(--accent)}.component-card p{margin:4px 0 0}.pill-cloud,.tag-row,.asset-swatches{flex-wrap:wrap;gap:7px;display:flex}.pill-cloud span,.tag-row span,.asset-swatches span{border:1px solid var(--line);min-height:28px;color:var(--muted);background:var(--surface-muted);border-radius:999px;align-items:center;padding:0 9px;font-size:12px;display:inline-flex}.showcase{gap:var(--gap);border-radius:var(--radius-lg);grid-template-columns:180px minmax(0,1fr) 260px;min-height:360px;padding:16px;display:grid;position:relative;overflow:hidden}.showcase-sidebar{background:var(--surface-muted);border-radius:16px;align-content:start;gap:6px;padding:8px;display:grid}.showcase-nav{padding:0 10px}.showcase-main{align-content:center;gap:14px;display:grid}.control-row,.form-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.field{gap:7px;display:grid}.field span,.range-field span{color:var(--muted);font-size:12px;font-weight:650}.field input{border:1px solid var(--line);width:100%;min-height:42px;color:var(--text);background:var(--surface-strong);border-radius:12px;padding:0 12px}.search-field{position:relative}.search-field svg{color:var(--subtle);position:absolute;bottom:13px;left:12px}.search-field input{padding-left:38px}.switch{cursor:pointer;align-items:center;gap:10px;display:inline-flex}.switch input{opacity:0;position:absolute}.switch>span{background:color-mix(in srgb, var(--muted) 24%, transparent);border-radius:999px;width:48px;height:29px;transition:background .18s;display:inline-flex;position:relative}.switch>span:after{content:"";background:#fff;border-radius:50%;width:23px;height:23px;transition:transform .18s;position:absolute;top:3px;left:3px;box-shadow:0 4px 10px #00000038}.switch input:checked+span{background:var(--accent-2)}.switch input:checked+span:after{transform:translate(19px)}.switch strong{font-size:13px}.range-field{gap:7px;min-width:180px;display:grid}.range-field input{accent-color:var(--accent)}.showcase-popover{border:1px solid var(--line);background:var(--surface-strong);box-shadow:var(--shadow);border-radius:18px;align-self:center;padding:16px}.showcase-popover strong{margin-top:6px;display:block}.showcase-popover p{color:var(--muted);margin:8px 0 0;font-size:12px;line-height:1.45}.pattern-layout{gap:var(--gap);grid-template-columns:minmax(420px,.95fr) minmax(320px,1.05fr);display:grid}.pattern-preview{border-radius:var(--radius-lg);background:var(--surface-strong);overflow:hidden}.mock-window-top{border-bottom:1px solid var(--line);align-items:center;gap:7px;min-height:46px;padding:0 14px;display:flex}.mock-window-top span{border-radius:50%;width:12px;height:12px}.mock-window-top span:first-child{background:#ff5f57}.mock-window-top span:nth-child(2){background:#ffbd2e}.mock-window-top span:nth-child(3){background:#28c840}.mock-window-top strong{color:var(--muted);margin-left:10px;font-size:12px}.mock-app{grid-template-columns:150px 1fr;min-height:430px;display:grid}.mock-app aside{border-right:1px solid var(--line);background:var(--surface-muted);align-content:start;gap:8px;padding:16px;display:grid}.mock-app aside span,.mock-list-row{border-radius:10px;min-height:34px}.mock-app aside span{color:var(--muted);align-items:center;padding:0 10px;font-size:12px;display:flex}.mock-app aside span.selected{color:var(--text);background:var(--surface-strong)}.mock-app main{padding:18px}.mock-toolbar{justify-content:space-between;display:flex}.mock-toolbar button{min-height:34px;color:var(--text);background:var(--surface-muted);border-radius:10px;padding:0 10px}.mock-list{gap:10px;margin-top:22px;display:grid}.mock-list-row{background:var(--surface-muted);align-items:center;gap:10px;padding:0 12px;display:flex}.mock-list-row svg{color:var(--accent-2)}.mock-list-row span{color:var(--muted);font-size:13px}.mock-list-row strong{margin-left:auto;font-size:12px}.pattern-list{gap:var(--gap);display:grid}.pattern-card{border-radius:var(--radius-md);gap:12px;padding:16px;display:flex}.pattern-card>svg{color:var(--accent);flex:none}.asset-grid{gap:var(--gap);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.asset-card{border-radius:var(--radius-lg);gap:14px;min-height:330px;padding:16px;display:grid}.asset-visual{color:#fff;background:linear-gradient(145deg,#147efb,#34c759);border-radius:20px;place-items:center;min-height:140px;display:grid;position:relative;overflow:hidden}.asset-visual span{background:#ffffff2e;border:1px solid #ffffff47;border-radius:15px;width:46px;height:46px;position:absolute;bottom:18px;right:18px}.asset-1{background:linear-gradient(145deg,#ffffff47,#0000),linear-gradient(135deg,#3a4553,#dce7f1)}.asset-2{background:linear-gradient(145deg,#15181d,#56616e)}.asset-3{background:linear-gradient(145deg,#ff9f0a,#af52de)}.symbol-board{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);grid-template-columns:repeat(12,minmax(58px,1fr));gap:10px;padding:14px;display:grid}.symbol-tile{aspect-ratio:1;border:1px solid var(--line);color:var(--accent);background:var(--surface-strong);border-radius:17px;place-items:center;display:grid}.motion-grid{gap:var(--gap);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.motion-card{border-radius:var(--radius-lg);gap:8px;min-height:230px;padding:18px;display:grid}.motion-orbit{color:#fff;background:radial-gradient(circle at 35% 24%, #ffffff52, transparent 30%), var(--accent);width:58px;height:58px;box-shadow:0 14px 30px color-mix(in srgb, var(--accent) 24%, transparent);border-radius:50%;place-items:center;animation:4.6s ease-in-out infinite floaty;display:grid}.motion-card:nth-child(2) .motion-orbit{animation-delay:-.8s}.motion-card:nth-child(3) .motion-orbit{animation-delay:-1.6s}.motion-card:nth-child(4) .motion-orbit{animation-delay:-2.4s}.motion-card span{color:var(--accent);font-size:12px;font-weight:750}.motion-card p{color:var(--muted);margin:0;font-size:13px;line-height:1.5}.motion-stage{border-radius:var(--radius-lg);min-height:340px;padding:16px}.motion-toolbar{gap:9px;display:flex}.motion-demo{justify-content:center;align-items:center;gap:22px;min-height:260px;display:flex}.demo-panel{border:1px solid var(--line);background:var(--surface-strong);box-shadow:var(--shadow-soft);border-radius:22px}.source-panel{min-width:160px;min-height:68px;color:var(--muted);align-items:center;gap:10px;padding:0 18px;display:flex}.expanded-panel{gap:8px;width:250px;min-height:150px;padding:18px;animation:3.4s cubic-bezier(.2,.8,.2,1) infinite sheetPop;display:grid}.expanded-panel svg{color:var(--accent)}.expanded-panel p{color:var(--muted);margin:0;font-size:12px}.live-dot{background:var(--accent-2);width:16px;height:16px;box-shadow:0 0 0 0 color-mix(in srgb, var(--accent-2) 38%, transparent);border-radius:50%;animation:1.7s ease-out infinite pulse}.coverage-card{border-radius:var(--radius-lg);padding:16px}.coverage-title{align-items:center;gap:10px;margin-bottom:14px;display:flex}.coverage-title svg{color:var(--accent)}.coverage-list{gap:8px;display:grid}.coverage-row{border:1px solid var(--line);background:var(--surface-muted);border-radius:14px;justify-content:space-between;align-items:center;gap:14px;min-height:58px;padding:10px;display:flex}.coverage-row span{color:var(--muted);margin-top:3px;font-size:12px;line-height:1.35;display:block}.status{flex:none;min-height:24px}.status-mapped{color:color-mix(in srgb, var(--accent-2) 78%, var(--text));border-color:color-mix(in srgb, var(--accent-2) 30%, var(--line))}.status-prototype{color:color-mix(in srgb, var(--accent) 80%, var(--text));border-color:color-mix(in srgb, var(--accent) 30%, var(--line))}.status-next{color:color-mix(in srgb, var(--accent-3) 80%, var(--text));border-color:color-mix(in srgb, var(--accent-3) 30%, var(--line))}.inspector{border-radius:var(--radius-lg);min-width:0;padding:16px;overflow:auto}.inspector-header{justify-content:space-between;align-items:center;display:flex}.inspector-device{border:1px solid var(--line);background:var(--surface-muted);border-radius:15px;align-items:center;gap:11px;margin-top:16px;padding:12px;display:flex}.inspector-device svg{color:var(--accent)}.property-list{gap:8px;margin-top:14px;display:grid}.property{border-bottom:1px solid var(--line);gap:4px;padding:11px 0;display:grid}.property span{color:var(--subtle);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:720}.property strong{color:var(--text);font-size:13px;font-weight:650}.mini-preview{border:1px solid var(--line);background:var(--surface-muted);border-radius:20px;place-items:center;min-height:260px;margin-top:16px;display:grid}.modal-backdrop{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0c0e1147;place-items:start center;padding-top:11vh;display:grid;position:fixed;inset:0}.command-palette{border:1px solid var(--line);background:var(--surface-strong);width:min(680px,100vw - 32px);box-shadow:var(--shadow);border-radius:22px;overflow:hidden}.command-search{border-bottom:1px solid var(--line);align-items:center;gap:10px;min-height:58px;padding:0 12px;display:flex}.command-search svg{color:var(--subtle)}.command-search input{min-width:0;color:var(--text);background:0 0;border:0;outline:0;flex:1}.command-items{max-height:460px;padding:8px;display:grid;overflow:auto}.command-items button{padding:0 10px}.command-items button strong{color:var(--subtle);margin-left:auto;font-size:12px}.iphone-frame{background:linear-gradient(145deg,#1d2229,#07080a);border:1px solid #ffffff42;border-radius:48px;width:292px;height:620px;padding:14px;position:relative;box-shadow:inset 0 0 0 1px #ffffff14,0 40px 90px #00000047}.hero-visual .iphone-frame{border-radius:42px;width:258px;height:548px}.hero-visual .iphone-frame .phone-screen{border-radius:32px}.hero-visual .phone-hero{margin-top:34px}.iphone-frame.compact{border-radius:28px;width:150px;height:318px;padding:8px;transform:scale(.94)}.phone-notch{z-index:2;background:#07080a;border-radius:999px;width:86px;height:25px;position:absolute;top:21px;left:50%;transform:translate(-50%)}.iphone-frame.compact .phone-notch{width:48px;height:14px;top:12px}.phone-screen{color:#fff;background:radial-gradient(circle at 50% 8%,#147efb61,#0000 42%),linear-gradient(#18212a,#090b0f);border-radius:37px;grid-template-rows:auto auto 1fr auto;height:100%;display:grid;overflow:hidden}.iphone-frame.compact .phone-screen{border-radius:22px}.phone-status{justify-content:space-between;padding:18px 22px 0;font-size:12px;font-weight:720;display:flex}.iphone-frame.compact .phone-status{padding:10px 12px 0;font-size:7px}.phone-hero{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff1a;border:1px solid #ffffff1f;border-radius:24px;margin:40px 16px 0;padding:18px}.iphone-frame.compact .phone-hero{border-radius:14px;margin:24px 8px 0;padding:9px}.phone-hero strong{margin-top:4px;font-size:24px;display:block}.iphone-frame.compact .phone-hero strong{font-size:12px}.phone-hero p{color:#ffffffad;margin:7px 0 0;font-size:12px}.phone-list{align-content:start;gap:9px;padding:14px 16px;display:grid}.iphone-frame.compact .phone-list{gap:5px;padding:8px}.phone-row{background:#ffffff1a;border-radius:14px;justify-content:space-between;align-items:center;min-height:44px;padding:0 13px;display:flex}.iphone-frame.compact .phone-row{border-radius:8px;min-height:24px;padding:0 7px;font-size:7px}.phone-row strong{color:#66d87a;font-size:11px}.tabbar{color:#fffc;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff21;border-radius:22px;justify-content:space-around;align-items:center;min-height:62px;margin:0 14px 12px;display:flex}.iphone-frame.compact .tabbar{border-radius:12px;min-height:32px;margin:0 8px 7px}.ipad-frame{aspect-ratio:1.34;background:linear-gradient(145deg,#1d2229,#07080a);border-radius:38px;width:min(760px,100%);padding:18px;position:relative;box-shadow:0 40px 90px #0000003d}.hero-visual .ipad-frame{width:min(620px,100%)}.ipad-frame.compact{border-radius:22px;width:238px;padding:8px}.tablet-camera{background:#050608;border-radius:50%;width:7px;height:7px;position:absolute;top:9px;left:50%;transform:translate(-50%)}.tablet-screen{background:var(--surface-strong);border-radius:24px;grid-template-columns:190px 1fr;height:100%;display:grid;overflow:hidden}.ipad-frame.compact .tablet-screen{border-radius:14px;grid-template-columns:72px 1fr}.tablet-screen aside,.mac-body aside{border-right:1px solid var(--line);background:var(--surface-muted);align-content:start;gap:8px;padding:18px;display:grid}.ipad-frame.compact .tablet-screen aside{gap:5px;padding:8px}.tablet-screen aside span,.mac-body aside span{min-height:34px;color:var(--muted);border-radius:10px;padding:8px 10px;font-size:12px}.ipad-frame.compact .tablet-screen aside span{min-height:18px;padding:4px;font-size:6px}.tablet-screen aside .selected,.mac-body aside .selected{color:var(--text);background:var(--surface-strong)}.tablet-screen main{padding:24px}.ipad-frame.compact .tablet-screen main{padding:8px}.preview-header{background:linear-gradient(90deg, var(--accent), var(--accent-2));border-radius:18px;height:64px}.preview-card-row{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px;display:grid}.preview-card-row span{background:var(--surface-muted);border-radius:18px;height:110px}.preview-lines{gap:10px;margin-top:18px;display:grid}.preview-lines i,.preview-table span{background:var(--surface-muted);border-radius:12px;height:42px}.mac-frame{border:1px solid var(--line-strong);background:var(--surface-strong);border-radius:18px;width:min(820px,100%);overflow:hidden;box-shadow:0 36px 90px #00000038}.hero-visual .mac-frame{width:min(680px,100%)}.mac-frame.compact{border-radius:12px;width:238px}.mac-titlebar{border-bottom:1px solid var(--line);align-items:center;gap:7px;min-height:42px;padding:0 14px;display:flex}.mac-titlebar span{border-radius:50%;width:11px;height:11px}.mac-titlebar span:first-child{background:#ff5f57}.mac-titlebar span:nth-child(2){background:#ffbd2e}.mac-titlebar span:nth-child(3){background:#28c840}.mac-titlebar strong{color:var(--muted);margin-left:10px;font-size:12px}.mac-body{grid-template-columns:180px 1fr;min-height:470px;display:grid}.mac-frame.compact .mac-body{grid-template-columns:72px 1fr;min-height:150px}.mac-body main{grid-template-columns:1fr .74fr;gap:16px;padding:20px;display:grid}.mac-frame.compact .mac-body main{gap:6px;padding:8px}.preview-chart{background:var(--surface-muted);border-radius:18px;align-items:end;gap:10px;min-height:260px;padding:16px;display:flex}.preview-chart i{background:linear-gradient(180deg, var(--accent), var(--accent-2));border-radius:999px;flex:1}.preview-chart i:first-child{height:46%}.preview-chart i:nth-child(2){height:78%}.preview-chart i:nth-child(3){height:58%}.preview-table{align-content:start;gap:12px;display:grid}.watch-frame{background:#111316;border-radius:58px;width:220px;height:268px;padding:14px;position:relative;box-shadow:0 30px 70px #00000042}.watch-frame.compact{border-radius:34px;width:134px;height:164px;padding:8px}.watch-crown{background:#282c32;border-radius:999px;width:9px;height:48px;position:absolute;top:76px;right:-8px}.watch-screen{color:#fff;background:radial-gradient(circle at 50% 20%,#34c75952,#0000 42%),#050608;border-radius:45px;place-items:center;height:100%;display:grid}.watch-frame.compact .watch-screen{border-radius:27px}.watch-screen strong{font-size:42px;line-height:1}.watch-frame.compact .watch-screen strong{font-size:24px}.watch-screen span{color:#ffffff9e;font-size:12px}.watch-rings{gap:6px;display:flex}.watch-rings i{background:conic-gradient(#ff453a 70%, #ffffff2e 0);border-radius:50%;width:22px;height:22px}.watch-rings i:nth-child(2){background:conic-gradient(#32d74b 82%, #ffffff2e 0)}.watch-rings i:nth-child(3){background:conic-gradient(#64d2ff 54%, #ffffff2e 0)}.widget-stack{grid-template-columns:1fr .68fr;gap:14px;width:min(540px,100%);display:grid}.widget-stack.compact{gap:8px;width:220px}.widget-card{border:1px solid var(--line);background:var(--surface-strong);box-shadow:var(--shadow-soft);border-radius:28px}.widget-card.large{min-height:260px;padding:24px}.widget-card.small{place-items:center;min-height:126px;padding:14px;display:grid}.widget-card svg{color:var(--accent-3)}.widget-card strong{margin-top:12px;font-size:32px;display:block}.widget-card p{color:var(--muted)}.island-board{justify-items:center;gap:20px;width:min(560px,100%);display:grid}.island-board.compact{gap:10px;width:230px}.dynamic-island{color:#fff;background:#050608;box-shadow:0 22px 60px #00000052}.dynamic-island.minimal{border-radius:999px;width:88px;height:34px}.dynamic-island.compact{border-radius:999px;align-items:center;gap:10px;width:268px;min-height:46px;padding:0 15px;display:flex}.dynamic-island.compact strong{color:#32d74b;margin-left:auto}.dynamic-island.expanded{border-radius:34px;width:min(430px,100%);padding:18px}.dynamic-island.expanded div{align-items:center;gap:10px;display:flex}.dynamic-island.expanded p{color:#ffffff9e;font-size:13px}.island-actions{gap:8px}.island-actions button{color:#fff;background:#ffffff24;border-radius:999px;min-height:34px;padding:0 14px}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-9px)}}@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent-2) 42%, transparent)}to{box-shadow:0 0 0 24px color-mix(in srgb, var(--accent-2) 0%, transparent)}}@keyframes sheetPop{0%,to{transform:translate(-12px)scale(.97)}45%,70%{transform:translate(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@media (width<=1280px){.studio{grid-template-columns:82px 1fr}.brand div:last-child,.nav-item span,.sidebar-panel{display:none}.sidebar{align-items:center}.nav-item{justify-content:center;width:46px;padding:0}.content-grid.inspector-visible{grid-template-columns:minmax(0,1fr)}.inspector{display:none}.foundation-grid,.asset-grid,.motion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=980px){body{overflow:auto}.studio{grid-template-columns:1fr;height:auto;min-height:100vh}.sidebar{z-index:5;border-width:0 0 1px;flex-direction:row;align-items:center;width:100%;max-width:100vw;position:sticky;top:0;overflow:auto}.brand{flex:none}.brand div:last-child{display:block}.nav-list{scrollbar-width:none;flex:auto;min-width:0;display:flex;overflow-x:auto}.nav-list::-webkit-scrollbar{display:none}.nav-item{width:auto;padding:0 11px}.nav-item span{display:inline}.workspace{width:100%;max-width:100vw;overflow:visible}.canvas{overflow:visible}.topbar,.section-header{flex-direction:column;align-items:stretch}.topbar-actions{flex-wrap:wrap;align-items:center;width:100%}.search-button{flex:220px}.top-segment{width:auto;overflow:auto}.hero-panel,.device-lab,.pattern-layout,.showcase{grid-template-columns:1fr}.hero-panel{min-height:0}.hero-visual{min-height:620px}.timeline,.surface-grid,.component-grid,.coverage-grid{grid-template-columns:1fr}}@media (width<=680px){.topbar,.content-grid{margin:0;padding:10px}.topbar{border-radius:0 0 18px 18px;gap:12px}.topbar-actions{scrollbar-width:none;border-radius:18px;flex-wrap:nowrap;padding:6px;overflow-x:auto}.topbar-actions::-webkit-scrollbar{display:none}.search-button{flex:0 0 188px;min-width:188px}.search-button span{text-overflow:ellipsis;white-space:nowrap;max-width:104px;overflow:hidden}.top-segment{flex:none}.top-segment button{white-space:nowrap}.hero-copy{padding:24px}.hero-copy h2{max-width:100%;font-size:42px;line-height:1.02}.hero-copy p{max-width:100%}.hero-actions,.control-row,.form-row{flex-direction:column;align-items:stretch}.hero-visual{gap:14px;min-height:590px;padding:18px}.floating-island{max-width:100%}.floating-island span{text-overflow:ellipsis;white-space:nowrap;max-width:142px;overflow:hidden}.device-picker{scrollbar-width:none;border-radius:18px;flex-wrap:nowrap;justify-content:flex-start;width:100%;max-width:100%;overflow-x:auto}.device-picker::-webkit-scrollbar{display:none}.device-chip{flex:none}.primary-button,.secondary-button{width:100%}.foundation-grid,.asset-grid,.motion-grid,.symbol-board{grid-template-columns:1fr}.device-canvas{min-height:520px;padding:16px}.iphone-frame{transform:scale(.82)}.hero-visual .iphone-frame{transform:scale(.9)}.ipad-frame,.mac-frame{width:100%}}