.interactive-demo-section{--blue: #3478F6;--blue-hover: #2563EB;--blue-bg: #EEF2FF;--blue-fill: #6B8DD6;--text: #1d1d1f;--text-secondary: #6e6e73;--text-tertiary: #aeaeb2;--bg: #f5f5f7;--white: #ffffff;--sidebar-bg: #f2f2f7;--sidebar-active: #007AFF;--border: #e5e5ea;--red: #ff5f56;--yellow: #ffbd2e;--green: #27c93f;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 12px rgba(0,0,0,.1);--shadow-lg: 0 12px 40px rgba(0,0,0,.15);--radius: 10px;--radius-sm: 6px;--spring: cubic-bezier(.32, .72, 0, 1)}.interactive-demo-section .page{min-height:100vh;padding:24px 32px 48px}.interactive-demo-section .hero{text-align:center;padding:32px 0 28px}.interactive-demo-section .hero-logo{display:inline-flex;align-items:center;gap:12px;margin-bottom:12px}.interactive-demo-section .hero-logo-icon{width:48px;height:48px;background:linear-gradient(135deg,#4a7adb,#5b6ae8);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px}.interactive-demo-section .hero-logo-text{font-size:28px;font-weight:700;letter-spacing:-.02em}.interactive-demo-section .hero p{font-size:16px;color:var(--text-secondary);max-width:500px;margin:0 auto;line-height:1.5}.interactive-demo-section .hero-badge{display:inline-flex;align-items:center;gap:6px;background:var(--text-main);color:#fff;font-size:12px;font-weight:500;padding:6px 14px;border-radius:980px;margin-bottom:12px;letter-spacing:0}.interactive-demo-section .demo-layout{display:flex;align-items:flex-start;gap:40px;margin-left:auto;margin-right:auto;width:fit-content;scroll-margin-top:60px;transition:margin-left .7s var(--spring),margin-right .7s var(--spring)}.interactive-demo-section .demo-layout.collapsed .left-column{cursor:pointer;transition:filter .3s ease}.interactive-demo-section .demo-layout.collapsed .left-column:hover{filter:brightness(1.03)}.interactive-demo-section .demo-layout.collapsed .right-column{opacity:0;width:0;min-width:0;overflow:hidden;pointer-events:none;margin-left:-40px;transition:opacity .3s ease,width .7s var(--spring),min-width .7s var(--spring),margin-left .7s var(--spring)}.interactive-demo-section .demo-layout.expanded{margin-left:20px;margin-right:auto}.interactive-demo-section .demo-layout.expanded .right-column{opacity:1;width:640px;min-width:640px;overflow:visible;pointer-events:auto;margin-left:0;transition:opacity .5s ease .2s,width .7s var(--spring),min-width .7s var(--spring),margin-left .7s var(--spring)}.interactive-demo-section .left-column{display:flex;flex-direction:column;gap:20px;flex-shrink:0}.interactive-demo-section .right-column{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:20px;position:sticky;top:24px}.interactive-demo-section .app-window{width:840px;background:var(--white);border-radius:10px;box-shadow:0 1px #0000000d,0 8px 30px #0000001f,0 0 0 .5px #00000014;overflow:hidden}.interactive-demo-section .app-titlebar{height:38px;background:linear-gradient(180deg,#fafafa,#f0f0f0);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 14px;position:relative}.interactive-demo-section .traffic-lights{display:flex;gap:7px}.interactive-demo-section .traffic-light{width:11px;height:11px;border-radius:50%}.interactive-demo-section .traffic-light.red{background:var(--red)}.interactive-demo-section .traffic-light.yellow{background:var(--yellow)}.interactive-demo-section .traffic-light.green{background:var(--green)}.interactive-demo-section .app-titlebar-text{position:absolute;left:50%;transform:translate(-50%);font-size:12px;font-weight:500;color:var(--text-secondary)}.interactive-demo-section .app-body{display:flex;height:560px}.interactive-demo-section .app-sidebar{width:190px;background:var(--sidebar-bg);padding:8px;border-right:1px solid var(--border);overflow-y:auto;flex-shrink:0;display:flex;flex-direction:column;scrollbar-width:none;-ms-overflow-style:none}.interactive-demo-section .app-sidebar::-webkit-scrollbar{display:none}.interactive-demo-section .sidebar-logo{display:flex;align-items:center;gap:8px;padding:6px 8px 14px}.interactive-demo-section .sidebar-logo-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.interactive-demo-section .sidebar-logo-img{width:100%;height:100%;object-fit:cover}.interactive-demo-section .sidebar-logo-text{font-size:14px;font-weight:600;line-height:1.2}.interactive-demo-section .sidebar-logo-sub{font-size:10px;color:var(--text-tertiary)}.interactive-demo-section .sidebar-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:5px;font-size:12.5px;cursor:pointer;color:var(--text);transition:all .15s;margin-bottom:1px;-webkit-user-select:none;user-select:none}.interactive-demo-section .sidebar-item:hover{background:#0000000a}.interactive-demo-section .sidebar-item.active{background:var(--sidebar-active);color:#fff}.interactive-demo-section .sidebar-item i{width:16px;text-align:center;font-size:11px;opacity:.7}.interactive-demo-section .sidebar-item.active i{opacity:1}.interactive-demo-section .sidebar-section{margin-bottom:2px}.interactive-demo-section .sidebar-section-title{font-size:10px;font-weight:600;color:var(--text-tertiary);padding:8px 10px 3px;text-transform:uppercase;letter-spacing:.3px}.interactive-demo-section .sidebar-divider{height:1px;background:var(--border);margin:6px 10px}.interactive-demo-section .sidebar-bottom-area{margin-top:auto;padding-top:4px}.interactive-demo-section .sidebar-bottom-link{color:var(--text-secondary);font-size:12px}.interactive-demo-section .sidebar-bottom-link i{opacity:.5}.interactive-demo-section .app-content{flex:1;padding:18px 20px;overflow-y:hidden;overflow-x:hidden}.interactive-demo-section .app-content.scrollable{overflow-y:auto}.interactive-demo-section .app-window:not(.app-window-active) .app-sidebar,.interactive-demo-section .app-window:not(.app-window-active) .layouts-side-nav-list,.interactive-demo-section .app-window:not(.app-window-active) .layouts-content,.interactive-demo-section .app-window:not(.app-window-active) .shortcut-sequence-side-nav-list{overflow-y:hidden}.interactive-demo-section .page-header{margin-bottom:16px}.interactive-demo-section .page-title{font-size:20px;font-weight:700;margin-bottom:4px;letter-spacing:-.02em}.interactive-demo-section .page-desc{font-size:11px;color:var(--text-secondary);line-height:1.5}.interactive-demo-section .page-header-row{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.interactive-demo-section .page-header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.interactive-demo-section .btn-add-group{display:flex;align-items:center;gap:5px;background:var(--apple-blue, #007AFF);color:#fff;border:none;padding:6px 14px;border-radius:7px;font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;white-space:nowrap}.interactive-demo-section .btn-add-group:hover{background:var(--blue-hover)}.interactive-demo-section .btn-more{width:28px;height:28px;border-radius:6px;border:none;background:transparent;cursor:pointer;font-size:14px;color:var(--text-secondary);display:flex;align-items:center;justify-content:center}.interactive-demo-section .btn-more:hover{background:var(--bg)}.interactive-demo-section .group-label{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text);margin-bottom:12px;font-weight:500}.interactive-demo-section .group-label-bar{width:3px;height:14px;background:var(--apple-blue, #007AFF);border-radius:2px}.interactive-demo-section .group-label i{font-size:10px;color:var(--text-secondary)}.interactive-demo-section .layout-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.interactive-demo-section .layout-card{display:flex;flex-direction:column;align-items:center;padding:16px 8px 10px;border-radius:10px;border:1px solid var(--border);cursor:pointer;transition:border-color .2s,background .2s;background:var(--white)}.interactive-demo-section .layout-card:hover{background:#f0f5ff;border-color:#c4d9f8}.interactive-demo-section .layout-card.active{border-color:var(--apple-blue, #007AFF);background:#e8f0fe}.interactive-demo-section .layout-card-name{font-size:11px;color:var(--text);margin-top:8px;text-align:center;line-height:1.2;font-weight:500}.interactive-demo-section .layout-card-shortcut{display:flex;gap:3px;margin-top:6px;align-items:center;justify-content:center}.interactive-demo-section .key-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 4px;border-radius:4px;border:1px solid var(--border);background:var(--white);font-size:10px;font-family:SF Mono,Monaco,monospace;color:var(--text-secondary);line-height:1}.interactive-demo-section .layout-card-unset{font-size:10px;color:var(--text-tertiary);margin-top:6px}.interactive-demo-section .layout-icon{width:52px;height:34px;background:#edf1f8;border-radius:4px;position:relative;overflow:hidden;border:1px solid #dde1e8}.interactive-demo-section .layout-icon:before{content:"";display:block;position:absolute;top:0;left:0;right:0;height:10%;min-height:3px;background:#d2d2d259;z-index:1}.interactive-demo-section .layout-icon-rect{position:absolute;background:#2563eb;border-radius:3px;overflow:hidden;box-shadow:0 0 0 .5px #edf1f8}.interactive-demo-section .layout-icon-rect:before{display:none}.interactive-demo-section .layout-card .layout-icon{width:72px;height:46px}.interactive-demo-section .shortcut-sequence-page{display:grid;grid-template-columns:152px minmax(0,1fr);gap:22px;align-items:start;min-height:100%}.interactive-demo-section .shortcut-sequence-side-nav{position:sticky;top:0;align-self:start;padding-right:18px;border-right:1px solid rgba(15,23,42,.08)}.interactive-demo-section .shortcut-sequence-side-nav-title{font-size:14px;font-weight:700;color:var(--text)}.interactive-demo-section .shortcut-sequence-side-nav-total{margin-top:4px;margin-bottom:14px;font-size:11px;color:var(--text-secondary)}.interactive-demo-section .shortcut-sequence-side-nav-list{display:flex;flex-direction:column;gap:4px}.interactive-demo-section .shortcut-sequence-side-nav-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:none;border-radius:10px;background:transparent;color:var(--text-secondary);cursor:pointer;font-family:inherit;text-align:left;transition:background .18s ease,color .18s ease}.interactive-demo-section .shortcut-sequence-side-nav-item:hover{background:#0f172a0d;color:var(--text)}.interactive-demo-section .shortcut-sequence-side-nav-item.active{background:#007aff17;color:var(--text)}.interactive-demo-section .shortcut-sequence-side-nav-icon{width:24px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--text-tertiary)}.interactive-demo-section .shortcut-sequence-side-nav-item.active .shortcut-sequence-side-nav-icon{color:var(--blue)}.interactive-demo-section .shortcut-sequence-side-nav-name{flex:1;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.interactive-demo-section .shortcut-sequence-side-nav-count{font-size:11px;color:var(--text-tertiary);flex-shrink:0}.interactive-demo-section .shortcut-sequence-content{min-width:0}.interactive-demo-section .shortcut-sequence-hero-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;min-height:160px;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:linear-gradient(180deg,#fafbfff5,#f6f8fcf0);margin-bottom:18px}.interactive-demo-section .shortcut-sequence-hero-copy{min-width:0;flex:1}.interactive-demo-section .shortcut-sequence-hero-eyebrow{font-size:11px;font-weight:700;color:var(--text-secondary);margin-bottom:8px}.interactive-demo-section .shortcut-sequence-hero-stage{display:flex;align-items:center;gap:16px;flex-shrink:0}.interactive-demo-section .shortcut-sequence-hero-preview{display:flex;flex-direction:column;align-items:center;gap:6px}.interactive-demo-section .shortcut-sequence-hero-preview-label{font-size:11px;font-weight:700;color:var(--blue)}.interactive-demo-section .shortcut-sequence-subnav{display:flex;align-items:center;gap:8px;margin-bottom:16px;overflow-x:auto;padding-bottom:2px}.interactive-demo-section .shortcut-sequence-subnav-item{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(15,23,42,.08);border-radius:999px;background:#ffffffe6;color:var(--text-secondary);cursor:pointer;font-family:inherit;transition:border-color .18s ease,background .18s ease,color .18s ease;white-space:nowrap}.interactive-demo-section .shortcut-sequence-subnav-item:hover{border-color:#007aff3d;color:var(--text)}.interactive-demo-section .shortcut-sequence-subnav-item.active{border-color:#007aff4d;background:#007aff14;color:var(--blue)}.interactive-demo-section .shortcut-sequence-subnav-label{font-size:11.5px;font-weight:700}.interactive-demo-section .shortcut-sequence-subnav-count{min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:#0f172a0f;color:inherit;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}.interactive-demo-section .shortcut-sequence-keycaps{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.interactive-demo-section .shortcut-sequence-keycaps.compact{gap:4px}.interactive-demo-section .shortcut-sequence-keycap{min-width:28px;height:28px;padding:0 8px;border-radius:8px;border:1px solid rgba(15,23,42,.08);background:var(--white);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--text);box-shadow:0 2px 8px #0f172a0f}.interactive-demo-section .shortcut-sequence-keycaps.compact .shortcut-sequence-keycap{min-width:24px;height:24px;padding:0 7px;border-radius:7px;font-size:11px;box-shadow:none}.interactive-demo-section .shortcut-sequence-trail{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}.interactive-demo-section .shortcut-sequence-trail.compact{gap:6px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px}.interactive-demo-section .shortcut-sequence-trail-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border-radius:8px;color:var(--text-secondary);background:#0f172a0a;transition:background .18s ease,color .18s ease;white-space:nowrap}.interactive-demo-section .shortcut-sequence-trail-chip.active{background:#007aff1a;color:var(--blue)}.interactive-demo-section .shortcut-sequence-trail-chip span{font-size:11px;font-weight:600}.interactive-demo-section .shortcut-sequence-trail.compact .shortcut-sequence-trail-chip{padding:3px 6px;gap:5px;background:transparent}.interactive-demo-section .shortcut-sequence-trail.compact .shortcut-sequence-trail-chip span{font-size:10.5px}.interactive-demo-section .shortcut-sequence-trail-separator{font-size:9px;color:var(--text-tertiary);flex-shrink:0}.interactive-demo-section .shortcut-sequence-category-sections{display:flex;flex-direction:column;gap:8px}.interactive-demo-section .shortcut-sequence-category-section{scroll-margin-top:8px}.interactive-demo-section .shortcut-sequence-category-header{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:13px;font-weight:700;color:var(--text)}.interactive-demo-section .shortcut-sequence-category-count{min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:#0f172a0f;color:var(--text-secondary);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}.interactive-demo-section .shortcut-sequence-panels{display:flex;flex-direction:column;gap:4px}.interactive-demo-section .shortcut-sequence-panel{border:1px solid rgba(15,23,42,.08);border-radius:14px;background:#fffffff2;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.interactive-demo-section .shortcut-sequence-panel.focused{border-color:#007aff3d;box-shadow:0 8px 24px #007aff12}.interactive-demo-section .shortcut-sequence-panel.expanded{background:linear-gradient(180deg,#fafcfffa,#fffffffa)}.interactive-demo-section .shortcut-sequence-panel-header{width:100%;display:flex;align-items:center;gap:12px;padding:12px 14px;border:none;background:transparent;cursor:pointer;font-family:inherit;text-align:left}.interactive-demo-section .shortcut-sequence-panel-leading{flex-shrink:0}.interactive-demo-section .shortcut-sequence-panel-summary{min-width:0;flex:1}.interactive-demo-section .shortcut-sequence-panel-chevron{flex-shrink:0;color:var(--text-tertiary);font-size:11px;transition:transform .18s ease}.interactive-demo-section .shortcut-sequence-panel-chevron.expanded{transform:rotate(180deg)}.interactive-demo-section .shortcut-sequence-panel-body-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease}.interactive-demo-section .shortcut-sequence-panel.expanded .shortcut-sequence-panel-body-wrap{grid-template-rows:1fr}.interactive-demo-section .shortcut-sequence-panel-body{overflow:hidden;padding:0 14px 14px}.interactive-demo-section .shortcut-sequence-panel-divider{height:1px;background:#0f172a14;margin-bottom:14px}.interactive-demo-section .shortcut-sequence-panel-body-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:12px}.interactive-demo-section .shortcut-sequence-panel-body-title{font-size:13px;font-weight:700;color:var(--text)}.interactive-demo-section .shortcut-sequence-panel-body-hint{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;background:#0f172a0d;color:var(--text-secondary);font-size:10.5px;font-weight:600}.interactive-demo-section .shortcut-sequence-panel-body-hint i{color:#f59e0b}.interactive-demo-section .shortcut-sequence-step-row{display:flex;align-items:stretch;gap:6px;padding-bottom:2px;min-width:0}.interactive-demo-section .shortcut-sequence-step-card{position:relative;flex:1 1 0;min-width:0;min-height:96px;padding:8px 8px 10px;border:1px solid rgba(15,23,42,.08);border-radius:12px;background:var(--white);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;font-family:inherit;transition:border-color .18s ease,box-shadow .18s ease;box-shadow:0 6px 18px #0f172a0d}.interactive-demo-section .shortcut-sequence-step-card:hover{border-color:#007aff47}.interactive-demo-section .shortcut-sequence-step-card.active{border-color:#007aff6b;box-shadow:0 10px 24px #007aff1f}.interactive-demo-section .shortcut-sequence-step-header{display:flex;align-items:center;justify-content:space-between;width:100%;gap:6px;min-width:0}.interactive-demo-section .shortcut-sequence-step-index{flex-shrink:0;width:18px;height:18px;border-radius:999px;background:#0f172a1a;color:var(--text);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}.interactive-demo-section .shortcut-sequence-step-card.active .shortcut-sequence-step-index{background:var(--blue);color:#fff}.interactive-demo-section .shortcut-sequence-step-badge{flex:1 1 auto;min-width:0;font-size:9.5px;font-weight:700;color:var(--text-secondary);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.interactive-demo-section .shortcut-sequence-step-more{flex-shrink:0;font-size:11px;color:var(--text-tertiary);line-height:1}.interactive-demo-section .shortcut-sequence-step-preview{margin-top:0;max-width:100%;display:flex;justify-content:center}.interactive-demo-section .shortcut-sequence-step-label{font-size:11px;font-weight:700;color:var(--text);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.interactive-demo-section .shortcut-sequence-step-separator{flex:0 0 auto;color:var(--text-tertiary);font-size:10px;display:flex;align-items:center}.interactive-demo-section .shortcut-sequence-step-card-add{flex:0 0 auto;min-width:60px;max-width:72px;justify-content:center;border-style:dashed;box-shadow:none;color:var(--text-secondary);background:#0f172a04}.interactive-demo-section .shortcut-sequence-step-card-add:hover{color:var(--blue);background:#007aff0d}.interactive-demo-section .shortcut-sequence-step-plus{font-size:28px;line-height:1;color:inherit}.interactive-demo-section .shortcut-sequence-step-add-label{font-size:10.5px;font-weight:700}.interactive-demo-section .disc-container{display:flex;flex-direction:column;align-items:center;gap:16px}.interactive-demo-section .disc-trigger{display:flex;gap:0;background:var(--bg);border-radius:8px;overflow:hidden;border:1px solid var(--border)}.interactive-demo-section .disc-trigger-btn{padding:6px 16px;font-size:12px;border:none;background:transparent;cursor:pointer;transition:all .15s;font-family:inherit}.interactive-demo-section .disc-trigger-btn.active{background:var(--apple-blue, #007AFF);color:#fff}.interactive-demo-section .disc-wrapper{position:relative;width:220px;height:220px}.interactive-demo-section .disc-circle{width:220px;height:220px;border-radius:50%;background:var(--bg);border:2px solid var(--border);position:relative}.interactive-demo-section .disc-center{position:absolute;width:50px;height:50px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--white);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-secondary)}.interactive-demo-section .disc-btn{position:absolute;width:42px;height:42px;border-radius:8px;border:1.5px solid var(--border);background:var(--white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;transform:translate(-50%,-50%);padding:4px}.interactive-demo-section .disc-btn:hover{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg);transform:translate(-50%,-50%) scale(1.1)}.interactive-demo-section .disc-btn.active{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg)}.interactive-demo-section .disc-btn .layout-icon{width:30px;height:20px}.interactive-demo-section .sd-settings-card{background:var(--bg);border-radius:10px;padding:16px 18px;margin-bottom:14px}.interactive-demo-section .sd-trigger-group{display:inline-flex;gap:10px;margin-top:6px}.interactive-demo-section .sd-trigger-btn{padding:14px 28px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);cursor:pointer;text-align:center;transition:border-color .15s,background .15s;font-family:inherit}.interactive-demo-section .sd-trigger-btn.active{border-color:var(--blue);background:var(--blue-bg)}.interactive-demo-section .sd-trigger-main{display:block;font-weight:700;font-size:15px;color:var(--text)}.interactive-demo-section .sd-trigger-sub{display:block;font-size:10px;color:var(--text-tertiary);margin-top:4px}.interactive-demo-section .sd-current-combo{font-size:11px;color:var(--text-secondary);margin-top:10px}.interactive-demo-section .sd-reset-link{color:var(--blue);cursor:pointer;font-weight:500}.interactive-demo-section .sd-reset-link:hover{text-decoration:underline}.interactive-demo-section .disc-divider{height:1px;background:var(--border);margin:12px 0}.interactive-demo-section .sd-layer-tabs{display:flex;justify-content:center;gap:20px;margin-bottom:16px}.interactive-demo-section .sd-layer-tab{font-size:13px;font-weight:500;color:var(--text-tertiary);background:none;border:none;cursor:pointer;padding:4px 12px;border-radius:6px;font-family:inherit;transition:all .15s}.interactive-demo-section .sd-layer-tab.active{color:var(--blue);background:var(--blue-bg);font-weight:600}.interactive-demo-section .sd-disc-wrapper{position:relative;width:280px;height:280px;margin:0 auto}.interactive-demo-section .sd-disc-circle{width:280px;height:280px;border-radius:50%;background:var(--bg);border:1.5px solid var(--border);position:relative}.interactive-demo-section .sd-disc-center{position:absolute;width:20px;height:20px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--border)}.interactive-demo-section .sd-disc-btn{width:48px;height:48px;border-radius:10px;border:1.5px solid var(--border);background:var(--white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;padding:6px;position:relative}.interactive-demo-section .sd-disc-btn:hover,.interactive-demo-section .sd-disc-btn.active{border-color:var(--blue);background:var(--blue-bg)}.interactive-demo-section .sd-disc-btn .layout-icon{width:36px;height:24px}.interactive-demo-section .sd-disc-hint{text-align:center;font-size:11px;color:var(--text-tertiary);margin-top:14px;display:flex;align-items:center;justify-content:center;gap:4px}.interactive-demo-section .sd-mode-selector{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}.interactive-demo-section .sd-mode-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 12px;border:1.5px solid var(--border);border-radius:10px;background:var(--white);cursor:pointer;transition:all .15s;font-family:inherit;font-size:13px;font-weight:500;color:var(--text)}.interactive-demo-section .sd-mode-btn:hover{border-color:var(--blue)}.interactive-demo-section .sd-mode-btn.active{border-color:var(--blue);background:var(--blue-bg);color:var(--blue)}.interactive-demo-section .sd-setting-row{display:flex;align-items:center;justify-content:space-between;padding:4px 0}.interactive-demo-section .sd-setting-label{font-size:13px;font-weight:600;color:var(--text)}.interactive-demo-section .sd-setting-value{font-size:13px;color:var(--text-secondary)}.interactive-demo-section .sd-setting-hint{font-size:11px;color:var(--text-tertiary);margin-top:4px;margin-bottom:8px}.interactive-demo-section .sd-setting-divider{height:1px;background:var(--border);margin:8px 0}.interactive-demo-section .sd-toggle-switch{width:40px;height:24px;border-radius:12px;background:#ccc;position:relative;cursor:pointer;transition:background .2s;flex-shrink:0}.interactive-demo-section .sd-toggle-switch.active{background:var(--blue)}.interactive-demo-section .sd-toggle-knob{width:20px;height:20px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:transform .2s;box-shadow:0 1px 3px #0003}.interactive-demo-section .sd-toggle-switch.active .sd-toggle-knob{transform:translate(16px)}.interactive-demo-section .sd-grid-spec-section{margin-bottom:16px}.interactive-demo-section .sd-grid-spec-label{font-size:12px;color:var(--text-secondary);margin-bottom:8px}.interactive-demo-section .sd-grid-spec-group{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.interactive-demo-section .sd-grid-spec-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 8px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);cursor:pointer;transition:all .15s;font-family:inherit}.interactive-demo-section .sd-grid-spec-btn:hover{border-color:var(--blue)}.interactive-demo-section .sd-grid-spec-btn.active{border-color:var(--blue);background:var(--blue-bg)}.interactive-demo-section .sd-grid-spec-main{font-size:14px;font-weight:700;color:var(--text)}.interactive-demo-section .sd-grid-spec-sub{font-size:11px;color:var(--text-tertiary)}.interactive-demo-section .sd-grid-panel{display:grid;gap:1px;background:var(--border);border-radius:14px;overflow:hidden;box-shadow:0 4px 20px #00000014;max-width:280px;margin:0 auto}.interactive-demo-section .sd-grid-cell{display:flex;align-items:center;justify-content:center;background:var(--white);aspect-ratio:1;cursor:pointer;transition:background .15s}.interactive-demo-section .sd-grid-cell:hover{background:var(--bg)}.interactive-demo-section .disc-layout-dropdown{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);width:200px;max-height:280px;overflow-y:auto;background:var(--white);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 30px #00000026;z-index:100;padding:4px}.interactive-demo-section .disc-dropdown-group{padding:4px 0}.interactive-demo-section .disc-dropdown-group+.disc-dropdown-group{border-top:1px solid var(--border)}.interactive-demo-section .disc-dropdown-group-label{font-size:11px;font-weight:500;color:var(--text-tertiary);padding:4px 10px 2px}.interactive-demo-section .disc-dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 10px;border:none;background:none;border-radius:6px;cursor:pointer;font-size:12px;font-family:inherit;color:var(--text);transition:background .1s;position:relative}.interactive-demo-section .disc-dropdown-item:hover{background:var(--bg)}.interactive-demo-section .disc-dropdown-item.selected{color:var(--blue);font-weight:600}.interactive-demo-section .disc-dropdown-check{font-size:10px;color:var(--blue);width:12px;flex-shrink:0}.interactive-demo-section .disc-dropdown-item:not(.selected){padding-left:30px}.interactive-demo-section .dt-display-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px}.interactive-demo-section .dt-mode-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;border:1.5px solid var(--border);border-radius:10px;background:var(--white);cursor:pointer;transition:all .15s;font-family:inherit}.interactive-demo-section .dt-mode-card:hover{border-color:#aaa}.interactive-demo-section .dt-mode-card.active{border-color:var(--blue);background:#007aff0a}.interactive-demo-section .dt-mode-icon{display:flex;align-items:center;gap:6px;height:28px}.interactive-demo-section .dt-mode-title{font-size:13px;font-weight:600;color:var(--text)}.interactive-demo-section .dt-mode-desc{font-size:10px;color:var(--text-tertiary)}.interactive-demo-section .dt-shortcut-box{padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--white)}.interactive-demo-section .dt-current-combo{font-size:11px;color:var(--text-secondary);margin-top:10px}.interactive-demo-section .dt-reset-link{color:var(--blue);cursor:pointer;font-weight:500}.interactive-demo-section .dt-reset-link:hover{text-decoration:underline}.interactive-demo-section .dt-combo-desc{font-size:11px;color:var(--text-tertiary);margin-top:6px}.interactive-demo-section .dt-preview-box{background:var(--bg);border-radius:10px;padding:10px 12px;border:1px solid var(--border)}.interactive-demo-section .dt-preview-label{font-size:11px;font-weight:500;color:var(--text-tertiary);text-align:center;margin-bottom:8px}.interactive-demo-section .toolbar-preview{display:flex;gap:4px;justify-content:center;flex-wrap:wrap}.interactive-demo-section .toolbar-btn{width:36px;height:28px;border-radius:4px;border:1px solid var(--border);background:var(--white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;padding:2px}.interactive-demo-section .toolbar-btn.toolbar-btn-default{border-style:dashed;border-color:#bbb;background:var(--bg)}.interactive-demo-section .toolbar-btn:hover{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg)}.interactive-demo-section .toolbar-btn .layout-icon{width:28px;height:18px}.interactive-demo-section .dt-buttons-desc{font-size:11px;color:var(--text-tertiary);margin-bottom:10px}.interactive-demo-section .dt-button-list{display:flex;flex-direction:column}.interactive-demo-section .dt-button-row{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid var(--border)}.interactive-demo-section .dt-button-row:last-child{border-bottom:none}.interactive-demo-section .dt-button-left{display:flex;align-items:center;gap:10px}.interactive-demo-section .dt-lock-icon{font-size:10px;color:var(--text-tertiary);width:28px;text-align:center}.interactive-demo-section .dt-drag-handles{display:flex;align-items:center;gap:2px;width:28px}.interactive-demo-section .dt-drag-icon{font-size:10px;color:#ccc;cursor:grab}.interactive-demo-section .dt-sort-arrows{display:flex;flex-direction:column;gap:3px;font-size:7px;color:#ccc;line-height:1}.interactive-demo-section .dt-sort-arrows i{cursor:pointer;padding:1px 2px;border-radius:2px;transition:color .15s,background .15s}.interactive-demo-section .dt-sort-arrows i:hover{color:#007aff;background:#007aff14}.interactive-demo-section .dt-button-icon{width:38px;height:24px;border:1px solid var(--border);border-radius:4px;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.interactive-demo-section .dt-button-icon .layout-icon{width:32px;height:20px}.interactive-demo-section .dt-button-info{display:flex;flex-direction:column}.interactive-demo-section .dt-button-name{font-size:12px;font-weight:500}.interactive-demo-section .dt-button-subtitle{font-size:10px;color:var(--text-tertiary)}.interactive-demo-section .dt-remove-btn{width:22px;height:22px;border:none;background:none;color:#ccc;cursor:pointer;font-size:12px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .15s}.interactive-demo-section .dt-remove-btn:hover{color:#ff3b30;background:#ff3b3014}.interactive-demo-section .dt-button-row.dragging{opacity:.4;background:#007aff0a}.interactive-demo-section .dt-button-row.drag-over{border-top:2px solid #007AFF;padding-top:6px}.interactive-demo-section .dt-button-row[draggable=true]{cursor:grab}.interactive-demo-section .dt-button-row[draggable=true]:active{cursor:grabbing}.interactive-demo-section .setting-group{margin-bottom:16px}.interactive-demo-section .setting-label{font-size:12px;font-weight:600;margin-bottom:8px}.interactive-demo-section .setting-row{display:flex;align-items:center;justify-content:space-between;padding:6px 0}.interactive-demo-section .setting-row-label{font-size:13px}.interactive-demo-section .toggle-switch{width:36px;height:20px;background:#ccc;border-radius:10px;position:relative;cursor:pointer;transition:background .2s}.interactive-demo-section .toggle-switch.on{background:var(--blue)}.interactive-demo-section .toggle-switch:after{content:"";width:16px;height:16px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;transition:transform .2s;box-shadow:0 1px 3px #0003}.interactive-demo-section .toggle-switch.on:after{transform:translate(16px)}.interactive-demo-section .pro-badge{display:inline-block;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;font-size:9px;font-weight:700;padding:1px 6px;border-radius:3px;margin-left:6px;letter-spacing:.5px}.interactive-demo-section .demo-hero-card{display:flex;height:130px;border-radius:14px;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 2px 4px #0000000a;overflow:hidden;margin-bottom:16px;flex-shrink:0}.interactive-demo-section .demo-hero-card-left{position:relative;width:130px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.interactive-demo-section .demo-hero-card-deco-circle{position:absolute;width:81px;height:81px;border-radius:50%;background:#ffffff1a;left:calc(50% + 24px);top:calc(50% + 33px);transform:translate(-50%,-50%);pointer-events:none}.interactive-demo-section .demo-hero-card-icon{position:relative;z-index:1;width:33px;height:33px;color:#fff;display:flex;align-items:center;justify-content:center}.interactive-demo-section .demo-hero-card-icon svg{width:100%;height:100%}.interactive-demo-section .demo-hero-card-right{flex:1;min-width:0;padding:16px 18px;display:flex;flex-direction:column;justify-content:space-between}.interactive-demo-section .demo-hero-card-top{display:flex;align-items:flex-start;gap:12px}.interactive-demo-section .demo-hero-card-text{flex:1;min-width:0}.interactive-demo-section .demo-hero-card-title{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700;letter-spacing:-.02em;color:#1d1d1f;margin-bottom:4px;line-height:1.2}.interactive-demo-section .demo-hero-card-desc{font-size:11px;color:var(--text-secondary);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.interactive-demo-section .demo-hero-card-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.interactive-demo-section .demo-hero-card-stats{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--text-secondary)}.interactive-demo-section .demo-hero-card-stats-icon{display:inline-flex;width:12px;height:12px;color:var(--text-secondary)}.interactive-demo-section .demo-hero-card-stats-icon svg{width:100%;height:100%}.interactive-demo-section .demo-hero-card-gradient-layouts{background:linear-gradient(135deg,#1e3a8a,#3b82f5)}.interactive-demo-section .demo-hero-card-gradient-shortcuts{background:linear-gradient(135deg,#9f1239,#f43f5e)}.interactive-demo-section .demo-hero-card-gradient-swipedisc{background:linear-gradient(135deg,#0891b2,#14b8a6)}.interactive-demo-section .demo-hero-card-gradient-dragtoolbar{background:linear-gradient(135deg,#047857,#84cc16)}.interactive-demo-section .demo-hero-card-gradient-margins{background:linear-gradient(135deg,#92400e,#ea580c)}.interactive-demo-section .demo-hero-card-gradient-settings{background:linear-gradient(135deg,#1f2937,#64748b)}.interactive-demo-section .demo-hero-card-gradient-cloudsync{background:linear-gradient(135deg,#6b8cf5,#4b6ce8)}.interactive-demo-section .demo-hero-card-gradient-cloudsync:before{content:"";position:absolute;width:32px;height:32px;border-radius:50%;background:#ffffff26;right:-12px;top:12px;pointer-events:none;z-index:0}.interactive-demo-section .demo-hero-card-gradient-cloudsync:after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:#ffffff2e;left:22px;top:50%;transform:translateY(-50%);pointer-events:none;z-index:0}.interactive-demo-section .demo-hero-card-ctrl-btn{width:26px;height:26px;border-radius:6px;border:none;background:transparent;color:var(--text-secondary);font-size:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;font-family:inherit}.interactive-demo-section .demo-hero-card-ctrl-btn:hover{background:#0000000f;color:#1d1d1f}.interactive-demo-section .demo-hero-card-toggle{display:inline-block;width:30px;height:17px;border-radius:9px;background:#007aff;position:relative;transition:background .2s ease;flex-shrink:0;border:none;padding:0}.interactive-demo-section .demo-hero-card-toggle:after{content:"";width:13px;height:13px;border-radius:50%;background:#fff;position:absolute;top:2px;left:15px;transition:left .2s ease;box-shadow:0 1px 2px #00000026}.interactive-demo-section .demo-hero-card-toggle[aria-checked=false]{background:#d1d5db}.interactive-demo-section .demo-hero-card-toggle[aria-checked=false]:after{left:2px}.interactive-demo-section .modifier-keys{display:flex;gap:6px;margin-top:8px}.interactive-demo-section .mod-key{font-size:11px;padding:3px 8px;border:1px solid var(--border);border-radius:4px;cursor:pointer;transition:all .15s;background:var(--white)}.interactive-demo-section .mod-key.active{background:var(--blue-bg);color:var(--blue);border-color:var(--blue);font-weight:600}.interactive-demo-section .app-list-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background .15s}.interactive-demo-section .app-list-item:hover{background:var(--bg)}.interactive-demo-section .app-icon-sm{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff}.interactive-demo-section .app-list-name{font-size:13px;flex:1}.interactive-demo-section .workspace-card{background:var(--bg);border-radius:8px;padding:12px}.interactive-demo-section .workspace-monitors{display:flex;gap:12px;margin-top:10px}.interactive-demo-section .workspace-monitor{flex:1;aspect-ratio:16/10;background:#1a1a2e;border-radius:4px;position:relative;overflow:hidden}.interactive-demo-section .workspace-monitor-label{font-size:9px;color:var(--text-tertiary);text-align:center;margin-top:4px}.interactive-demo-section .demo-macbook-wrapper{display:flex;justify-content:center;width:100%}.interactive-demo-section .demo-macbook-wrapper .device-macbook-pro{transform:scale(.84);transform-origin:top center;margin-bottom:-69.44px}.interactive-demo-section .demo-macbook-wrapper .device-screen{overflow:hidden;position:relative}.interactive-demo-section .desktop{width:100%;height:100%;background:linear-gradient(135deg,#1a1a4e,#2d1b69,#4b2882 60%,#6d3a9c);position:relative;overflow:hidden}.interactive-demo-section .desktop-menubar{height:22px;background:#00000059;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);display:flex;align-items:center;padding:0 10px;font-size:11px;color:#ffffffe6;gap:14px;position:relative;z-index:100}.interactive-demo-section .menubar-apple{font-size:13px}.interactive-demo-section .menubar-bold{font-weight:600}.interactive-demo-section .menubar-right{margin-left:auto;display:flex;gap:10px;font-size:10px}.interactive-demo-section .desktop-dock{position:absolute;bottom:4px;left:50%;transform:translate(-50%);display:flex;gap:3px;background:#ffffff26;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:3px 6px;border-radius:12px;z-index:100}.interactive-demo-section .dock-icon{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff;cursor:pointer;transition:transform .15s;position:relative}.interactive-demo-section .dock-icon:hover{transform:scale(1.25) translateY(-4px)}.interactive-demo-section .dock-icon.running:after{content:"";position:absolute;bottom:-3px;width:3px;height:3px;border-radius:50%;background:#fffc}.interactive-demo-section .desktop-area{position:absolute;inset:22px 0 38px}.interactive-demo-section .desktop-window{position:absolute;border-radius:6px;overflow:hidden;box-shadow:0 4px 16px #0000004d,0 0 0 .5px #ffffff1a;transition:left .55s var(--spring),top .55s var(--spring),width .55s var(--spring),height .55s var(--spring),opacity .3s ease;display:flex;flex-direction:column}.interactive-demo-section .desktop-window.animating{box-shadow:0 4px 16px #0000004d,0 0 0 2px #007aff99}.interactive-demo-section .desktop-window.selected{box-shadow:0 4px 16px #00000059,0 0 0 2px #007aff80}.interactive-demo-section .desktop-window:not(.selected){cursor:pointer}.interactive-demo-section .desktop-window:not(.selected):hover{box-shadow:0 4px 16px #0000004d,0 0 0 1px #ffffff4d}.interactive-demo-section .dw-titlebar{height:22px;display:flex;align-items:center;padding:0 8px;gap:4px;flex-shrink:0}.interactive-demo-section .dw-dot{width:6px;height:6px;border-radius:50%}.interactive-demo-section .dw-dot.r{background:#ff5f56}.interactive-demo-section .dw-dot.y{background:#ffbd2e}.interactive-demo-section .dw-dot.g{background:#27c93f}.interactive-demo-section .dw-title{font-size:9px;margin-left:auto;margin-right:auto;opacity:.6}.interactive-demo-section .dw-safari{background:#f5f5f7}.interactive-demo-section .dw-safari .dw-titlebar{background:#e8e8ed}.interactive-demo-section .dw-safari .dw-title{color:#333}.interactive-demo-section .dw-safari-toolbar{background:#f5f5f7;padding:2px 4px;border-radius:3px;margin-bottom:4px;display:flex;align-items:center;gap:3px}.interactive-demo-section .dw-safari-url{flex:1;background:#e8e8ed;border-radius:3px;padding:1px 4px;font-size:7px;color:#888}.interactive-demo-section .safari-content-line{height:3px;background:#e8e8ed;border-radius:1px;margin-bottom:3px}.interactive-demo-section .safari-content-heading{height:5px;width:60%;background:#d0d0d5;border-radius:1px;margin-bottom:5px}.interactive-demo-section .dw-code{background:#1e1e1e}.interactive-demo-section .dw-code .dw-titlebar{background:#323233}.interactive-demo-section .dw-code .dw-title{color:#ccc}.interactive-demo-section .code-line{height:2.5px;border-radius:1px;margin-bottom:2.5px}.interactive-demo-section .code-line-1{width:40%;background:#569cd6}.interactive-demo-section .code-line-2{width:65%;background:#4ec9b0}.interactive-demo-section .code-line-3{width:55%;background:#ce9178}.interactive-demo-section .code-line-4{width:30%;background:#9cdcfe}.interactive-demo-section .code-line-5{width:75%;background:#dcdcaa}.interactive-demo-section .code-line-6{width:50%;background:#6a9955}.interactive-demo-section .dw-finder{background:#f5f5f7}.interactive-demo-section .dw-finder .dw-titlebar{background:#e8e8ed}.interactive-demo-section .dw-finder .dw-title{color:#333}.interactive-demo-section .finder-sidebar{width:30%;background:#f0f0f5;padding:4px}.interactive-demo-section .finder-sidebar-item{height:3px;background:#d0d0d5;border-radius:1px;margin-bottom:3px}.interactive-demo-section .finder-sidebar-item.active-item{background:var(--apple-blue, #007AFF)}.interactive-demo-section .finder-content{flex:1;padding:4px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;align-content:start}.interactive-demo-section .finder-file{text-align:center}.interactive-demo-section .finder-file-icon{width:14px;height:14px;background:#e8e8ed;border-radius:2px;margin:0 auto 2px}.interactive-demo-section .finder-file-icon.folder{background:#5b9bd5}.interactive-demo-section .layout-notification{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);background:#000000bf;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;padding:12px 24px;border-radius:12px;font-size:14px;font-weight:600;opacity:0;transition:opacity .3s var(--spring),transform .3s var(--spring);pointer-events:none;z-index:200;text-align:center;white-space:nowrap}.interactive-demo-section .layout-notification.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.interactive-demo-section .disc-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:150;pointer-events:none;animation:disc-overlay-in .4s cubic-bezier(.32,.72,0,1)}@keyframes disc-overlay-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.interactive-demo-section .disc-overlay-ring{width:120px;height:120px;border-radius:50%;background:#ffffffd9;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 8px 32px #0000002e,0 0 0 1px #ffffff4d;position:relative}.interactive-demo-section .disc-overlay-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#2563eb;box-shadow:0 0 8px #2563eb80;z-index:2}.interactive-demo-section .disc-overlay-btn{position:absolute;width:24px;height:24px;border-radius:50%;background:#0000000a;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);transition:background .25s ease,box-shadow .25s ease;z-index:3}.interactive-demo-section .disc-overlay-btn.active{background:transparent;box-shadow:none}.interactive-demo-section .disc-overlay-btn.active .layout-icon-rect{background:#2563eb!important}.interactive-demo-section .disc-overlay-sector{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;transform-origin:center center;transition:transform .35s cubic-bezier(.32,.72,0,1)}.interactive-demo-section .control-bar{background:var(--white);border-radius:10px;padding:14px 18px;box-shadow:var(--shadow-md);width:840px}.interactive-demo-section .control-section{margin-bottom:12px}.interactive-demo-section .control-section:last-child{margin-bottom:0}.interactive-demo-section .control-section-title{font-size:11px;font-weight:600;color:var(--text-secondary);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.interactive-demo-section .control-btns{display:flex;flex-wrap:wrap;gap:6px}.interactive-demo-section .control-btn{display:flex;align-items:center;gap:5px;padding:6px 10px;border-radius:6px;border:1px solid var(--border);background:var(--white);cursor:pointer;transition:all .15s;font-family:inherit;font-size:11px}.interactive-demo-section .control-btn:hover{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg)}.interactive-demo-section .control-btn:active{transform:scale(.96)}.interactive-demo-section .control-btn.active{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg);color:var(--apple-blue, #007AFF)}.interactive-demo-section .control-btn-key{font-family:SF Mono,Monaco,monospace;font-size:10px;font-weight:600;background:var(--bg);padding:1px 5px;border-radius:3px}.interactive-demo-section .control-btn .layout-icon{width:24px;height:16px}.interactive-demo-section .control-reset{display:flex;align-items:center;gap:4px;padding:5px 12px;border-radius:6px;border:1px solid var(--border);background:var(--white);cursor:pointer;font-family:inherit;font-size:11px;color:var(--text-secondary);transition:all .15s}.interactive-demo-section .control-reset:hover{border-color:#ff3b30;color:#ff3b30;background:#fff5f5}.interactive-demo-section .gesture-btn{display:flex;align-items:center;gap:5px;padding:6px 10px;border-radius:6px;border:1px solid var(--border);background:var(--white);cursor:pointer;transition:all .15s;font-family:inherit;font-size:11px}.interactive-demo-section .gesture-btn:hover{border-color:var(--apple-blue, #007AFF);background:var(--blue-bg)}.interactive-demo-section .gesture-btn:active{transform:scale(.96)}.interactive-demo-section .gesture-icon{font-size:14px}.interactive-demo-section .margin-preview{width:100%;aspect-ratio:16/10;background:#e8ecf4;border-radius:8px;position:relative;display:flex;align-items:center;justify-content:center;margin-top:12px}.interactive-demo-section .margin-inner{width:75%;height:75%;background:#5b9bd526;border:2px dashed rgba(91,155,213,.4);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-secondary)}.interactive-demo-section .margin-arrow{position:absolute;font-size:8px;color:var(--text-tertiary)}.interactive-demo-section .margin-arrow.top{top:8px;left:50%;transform:translate(-50%)}.interactive-demo-section .margin-arrow.bottom{bottom:8px;left:50%;transform:translate(-50%)}.interactive-demo-section .margin-arrow.left{left:8px;top:50%;transform:translateY(-50%)}.interactive-demo-section .margin-arrow.right{right:8px;top:50%;transform:translateY(-50%)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%{box-shadow:0 4px 16px #0000004d,0 0 0 2px #007aff99}50%{box-shadow:0 4px 16px #0000004d,0 0 0 4px #007aff4d}to{box-shadow:0 4px 16px #0000004d,0 0 0 2px #007aff00}}.interactive-demo-section .desktop-window.glow{animation:pulseGlow .8s ease-out}.interactive-demo-section .tab-enter{animation:fadeIn .25s ease-out}.interactive-demo-section .layouts-page{display:flex;margin:-18px -20px;height:calc(100% + 36px);align-items:stretch;overflow:hidden;min-height:0}.interactive-demo-section .layouts-side-nav{width:158px;flex-shrink:0;padding:14px 10px 10px;background:#ffffff80;display:flex;flex-direction:column;min-height:0;height:100%}.interactive-demo-section .layouts-side-nav-title{font-size:12px;font-weight:600;color:var(--text-secondary);padding:0 6px}.interactive-demo-section .layouts-side-nav-total{margin-top:2px;margin-bottom:10px;font-size:10px;color:var(--text-tertiary);padding:0 6px}.interactive-demo-section .layouts-side-nav-list{display:flex;flex-direction:column;gap:1px;flex:1 1 auto;min-height:0;overflow-y:auto}.interactive-demo-section .layouts-side-nav-item{display:flex;align-items:center;gap:7px;width:100%;padding:6px 8px;border:none;border-radius:7px;background:transparent;color:var(--text-secondary);cursor:pointer;font-family:inherit;text-align:left;transition:background .15s,color .15s;font-size:12px}.interactive-demo-section .layouts-side-nav-item:hover{background:#0f172a0d;color:var(--text)}.interactive-demo-section .layouts-side-nav-item.active{background:#007aff17;color:var(--text);font-weight:500}.interactive-demo-section .layouts-side-nav-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.interactive-demo-section .layouts-side-nav-count{font-size:10px;color:var(--text-tertiary);flex-shrink:0}.interactive-demo-section .layouts-side-nav-footer{margin-top:8px;padding-top:8px;border-top:1px solid rgba(15,23,42,.06)}.interactive-demo-section .layouts-add-group-btn{display:flex;align-items:center;gap:6px;width:100%;padding:6px 8px;border:none;border-radius:7px;background:transparent;color:var(--text-secondary);cursor:pointer;font-family:inherit;font-size:12px;transition:background .15s}.interactive-demo-section .layouts-add-group-btn:hover{background:#0f172a0d;color:var(--text)}.interactive-demo-section .layouts-content{flex:1 1 auto;padding:18px 20px;background:#fff;min-width:0;min-height:0;height:100%;overflow-y:auto}.interactive-demo-section .hint-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:50;pointer-events:none}.interactive-demo-section .hint-text{background:#0009;color:#fff;padding:6px 14px;border-radius:8px;font-size:12px;animation:fadeIn .5s ease-out}.interactive-demo-section .drag-toolbar-overlay{position:absolute;top:7.5%;left:50%;transform:translate(-50%);z-index:150;pointer-events:none;animation:drag-toolbar-in .35s cubic-bezier(.32,.72,0,1)}@keyframes drag-toolbar-in{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.interactive-demo-section .drag-toolbar-bar{display:flex;gap:2px;padding:3px 4px;background:#c8c8cde0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:6px;box-shadow:0 2px 12px #00000026,0 0 0 .5px #00000014}.interactive-demo-section .drag-toolbar-item{width:24px;height:18px;border-radius:2px;display:flex;align-items:center;justify-content:center;background:#0000008c;transition:all .25s ease;border:1px solid transparent}.interactive-demo-section .drag-toolbar-item .layout-icon{background:transparent!important;border:none!important;border-radius:1px!important}.interactive-demo-section .drag-toolbar-item .layout-icon:before{display:none!important}.interactive-demo-section .drag-toolbar-item .layout-icon-rect{background:#fff!important;border-radius:.5px!important}.interactive-demo-section .drag-toolbar-item.active .layout-icon-rect{background:#fff!important}.interactive-demo-section .drag-toolbar-item.active{background:#1a5ccc;box-shadow:0 1px 6px #143cb480;border:1px solid rgba(255,255,255,.35)}.interactive-demo-section .gesture-overlay{position:absolute;inset:0;z-index:150;display:flex;align-items:center;justify-content:center;pointer-events:none}.interactive-demo-section .gesture-hand{font-size:36px;opacity:0;transition:all .4s ease-out}.interactive-demo-section .gesture-hand.visible{opacity:1}.interactive-demo-section .qs-dim-bg{position:absolute;inset:0;background:#0000004d;z-index:50;animation:qs-fade-in .25s ease-out}@keyframes qs-fade-in{0%{opacity:0}to{opacity:1}}.interactive-demo-section .qs-panel{position:absolute;top:28%;left:50%;transform:translate(-50%);width:58%;background:#ffffffe0;backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);border-radius:10px;box-shadow:0 20px 60px #00000059,0 0 0 .5px #00000014 inset;border:.5px solid rgba(255,255,255,.4);overflow:hidden;z-index:51;animation:qs-slide-up .3s ease-out}@keyframes qs-slide-up{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.interactive-demo-section .qs-input-area{display:flex;align-items:center;padding:10px 14px;border-bottom:.5px solid rgba(0,0,0,.08)}.interactive-demo-section .qs-search-icon{color:#af52de;font-size:14px;margin-right:10px;flex-shrink:0}.interactive-demo-section .qs-input-text{flex:1;font-size:13px;color:var(--text);display:flex;align-items:center}.interactive-demo-section .qs-cursor{display:inline-block;width:1.5px;height:14px;background:var(--blue);margin-left:1px;animation:qs-blink 1s step-end infinite}@keyframes qs-blink{0%,to{opacity:1}50%{opacity:0}}.interactive-demo-section .qs-shortcut-key{font-family:SF Mono,Menlo,Monaco,monospace;font-size:10px;color:var(--text-secondary);background:#0000000d;padding:2px 5px;border-radius:3px;border:.5px solid rgba(0,0,0,.06);flex-shrink:0}.interactive-demo-section .qs-results{display:flex;flex-direction:column;animation:qs-fade-in .2s ease-out}.interactive-demo-section .qs-result-item{display:flex;align-items:center;padding:7px 14px;position:relative;transition:background .15s ease}.interactive-demo-section .qs-result-item:not(:last-child):after{content:"";position:absolute;bottom:0;left:44px;right:14px;height:.5px;background:#0000000d}.interactive-demo-section .qs-result-item.active{background:#007aff14}.interactive-demo-section .qs-result-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--blue);border-radius:0 1px 1px 0}.interactive-demo-section .qs-result-icon{width:22px;height:22px;border-radius:5px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;margin-right:10px;flex-shrink:0}.interactive-demo-section .qs-result-title{flex:1;font-size:12px;font-weight:600;color:var(--text)}.interactive-demo-section .qs-result-cat{font-size:9px;color:var(--text-secondary);background:#0000000a;padding:1px 5px;border-radius:3px;flex-shrink:0}.interactive-demo-section .cb-panel{position:absolute;top:22%;left:50%;transform:translate(-50%);width:62%;background:#ffffffe0;backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);border-radius:10px;box-shadow:0 20px 60px #00000059,0 0 0 .5px #00000014 inset;border:.5px solid rgba(255,255,255,.4);overflow:hidden;z-index:51;animation:qs-slide-up .3s ease-out}.interactive-demo-section .cb-header{display:flex;justify-content:space-between;align-items:center;padding:9px 14px;border-bottom:.5px solid rgba(0,0,0,.06)}.interactive-demo-section .cb-title{font-size:13px;font-weight:600;color:var(--text)}.interactive-demo-section .cb-search{padding:7px 14px;border-bottom:.5px solid rgba(0,0,0,.06)}.interactive-demo-section .cb-search-box{background:#0000000d;border-radius:5px;padding:4px 8px;display:flex;align-items:center;gap:6px}.interactive-demo-section .cb-search-box i{color:var(--text-tertiary);font-size:10px}.interactive-demo-section .cb-search-box span{color:var(--text-tertiary);font-size:11px}.interactive-demo-section .cb-list{display:flex;flex-direction:column;padding:2px 0}.interactive-demo-section .cb-item{display:flex;align-items:center;padding:6px 14px;gap:8px;position:relative;transition:background .15s ease}.interactive-demo-section .cb-item.active{background:#007aff14}.interactive-demo-section .cb-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--blue);border-radius:0 1px 1px 0}.interactive-demo-section .cb-key{font-family:SF Mono,Menlo,Monaco,monospace;font-size:9px;color:var(--text-tertiary);width:18px;flex-shrink:0;text-align:center}.interactive-demo-section .cb-text{flex:1;font-size:11px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.interactive-demo-section .cb-text.code{font-family:SF Mono,Menlo,Monaco,monospace;font-size:10px;background:#0000000a;padding:1px 4px;border-radius:3px}.interactive-demo-section .cb-meta{font-size:9px;color:var(--text-secondary);white-space:nowrap;flex-shrink:0}.interactive-demo-section .fe-overlay{position:absolute;inset:0;overflow:hidden}.interactive-demo-section .fe-finder{position:absolute;left:40px;top:35px;width:260px;height:165px;background:#1e1e1e;border:1px solid rgba(255,255,255,.1);border-radius:6px;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;overflow:hidden}.interactive-demo-section .fe-titlebar{height:20px;background:#323232f2;display:flex;align-items:center;padding:0 8px;position:relative;border-bottom:1px solid #000;flex-shrink:0}.interactive-demo-section .fe-lights{display:flex;gap:5px}.interactive-demo-section .fe-light{width:8px;height:8px;border-radius:50%;flex-shrink:0}.interactive-demo-section .fe-red{background:#ff5f56}.interactive-demo-section .fe-yellow{background:#ffbd2e}.interactive-demo-section .fe-green{background:#27c93f}.interactive-demo-section .fe-window-title{position:absolute;left:0;right:0;text-align:center;font-size:10px;color:#ccc;font-weight:500;pointer-events:none}.interactive-demo-section .fe-finder-body{display:flex;flex:1;overflow:hidden}.interactive-demo-section .fe-sidebar{width:70px;background:#232323f2;border-right:1px solid #000;padding:8px 4px;flex-shrink:0}.interactive-demo-section .fe-sidebar-item{font-size:9px;color:#aaa;padding:3px 5px;border-radius:3px;margin-bottom:2px;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden}.interactive-demo-section .fe-sidebar-item.fe-active{background:#ffffff1a;color:#fff}.interactive-demo-section .fe-files{flex:1;padding:8px;display:flex;flex-direction:column;gap:2px;overflow:hidden}.interactive-demo-section .fe-file-item{display:flex;align-items:center;gap:7px;padding:4px 5px;border-radius:3px;font-size:10px;color:#ddd}.interactive-demo-section .fe-file-app{animation:fe-file-select 7s infinite}.interactive-demo-section .fe-cursor{position:absolute;top:110px;left:170px;color:#fff;font-size:14px;-webkit-text-stroke:1px #000;z-index:25;opacity:0;pointer-events:none;animation:fe-cursor-move 7s infinite}.interactive-demo-section .fe-hud{position:absolute;top:50%;left:50%;background:#000000c7;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:10px;padding:8px 14px;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:20;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 15px #00000080;opacity:0;animation:fe-hud-fade 7s infinite}.interactive-demo-section .fe-keys{display:flex;gap:4px}.interactive-demo-section .fe-key{background:#ffffff24;border:1px solid rgba(255,255,255,.1);border-radius:5px;padding:3px 8px;font-size:13px;color:#fff;line-height:1}.interactive-demo-section .fe-hud-text{font-size:9px;color:#ffffffb3;white-space:nowrap}.interactive-demo-section .fe-vscode{position:absolute;inset:0;background:#1e1e1e;z-index:15;display:flex;flex-direction:column;animation:fe-vscode-slide 7s infinite}.interactive-demo-section .fe-vscode-body{display:flex;flex:1;overflow:hidden}.interactive-demo-section .fe-vscode-sidebar{width:65px;background:#252526;border-right:1px solid #333;padding:5px;flex-shrink:0;overflow:hidden}.interactive-demo-section .fe-vs-item{font-size:9px;color:#ccc;padding:2px 4px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.interactive-demo-section .fe-vs-active{background:#37373d;color:#fff}.interactive-demo-section .fe-vscode-editor{flex:1;padding:8px;background:#1e1e1e;font-family:SF Mono,Consolas,monospace;font-size:9px;line-height:1.5;overflow:hidden}.interactive-demo-section .fe-code-line{white-space:nowrap;overflow:hidden}.interactive-demo-section .fe-num{color:#858585;margin-right:6px}.interactive-demo-section .fe-c-blue{color:#569cd6}.interactive-demo-section .fe-c-lb{color:#9cdcfe}.interactive-demo-section .fe-c-yellow2{color:#dcdcaa}.interactive-demo-section .fe-c-orange{color:#ce9178}.interactive-demo-section .fe-c-purple{color:#c586c0}.interactive-demo-section .fe-c-green2{color:#6a9955}@keyframes fe-hud-fade{0%,22.85%{opacity:0;transform:translate(-50%,-45%)}31.43%,78.57%{opacity:1;transform:translate(-50%,-50%)}82.86%,to{opacity:0;transform:translate(-50%,-55%)}}@keyframes fe-vscode-slide{0%,37.13%{transform:translate(100%);opacity:0}37.14%{transform:translate(100%);opacity:1}45.71%,82.86%{transform:translate(0);opacity:1}88.57%,to{transform:translate(100%);opacity:0}}@keyframes fe-cursor-move{0%,11.42%{transform:translate(150px,120px);opacity:0}11.43%{transform:translate(150px,120px);opacity:1}18.57%,22.86%{transform:translate(0);opacity:1}37.14%,to{transform:translate(0);opacity:0}}@keyframes fe-file-select{0%,18.57%{background:transparent;color:#ddd}22.86%,82.86%{background:#006eff4d;color:#fff}97.14%,to{background:transparent;color:#ddd}}.interactive-demo-section .sa-overlay{position:absolute;inset:0;overflow:hidden}.interactive-demo-section .sa-dark-mask{position:absolute;inset:0;background:#000000e0;z-index:10;opacity:0;animation:sa-dark 12s infinite}.interactive-demo-section .sa-hud{position:absolute;top:50%;left:50%;background:#000000c7;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:10px;padding:8px 14px;display:flex;flex-direction:column;align-items:center;gap:5px;opacity:0;z-index:40;pointer-events:none}.interactive-demo-section .sa-keys{display:flex;gap:4px}.interactive-demo-section .sa-key{background:#ffffff24;border:1px solid rgba(255,255,255,.1);border-radius:5px;padding:3px 8px;font-size:13px;color:#fff;line-height:1;min-width:12px;text-align:center}.interactive-demo-section .sa-hud-text{font-size:9px;color:#ffffffb3;white-space:nowrap}.interactive-demo-section .sa-osd{position:absolute;background:#1c1c1ee6;border-radius:8px;padding:6px 10px;display:flex;align-items:center;gap:8px;width:100px;box-sizing:border-box;opacity:0;z-index:20;color:#fff;font-size:10px;box-shadow:0 4px 12px #0003}.interactive-demo-section .sa-osd i{width:14px;text-align:center;flex-shrink:0}.interactive-demo-section .sa-bar-track{flex:1;height:4px;background:#fff3;border-radius:2px;overflow:hidden}.interactive-demo-section .sa-bar-fill{height:100%;background:#0a84ff;border-radius:2px}.interactive-demo-section .sa-osd-vol{top:6px;right:10px;animation:sa-osd-vol 12s infinite}.interactive-demo-section .sa-osd-bright{top:6px;left:50%;transform:translate(-50%);animation:sa-osd-bright 12s infinite}.interactive-demo-section .sa-bar-vol{width:60%;animation:sa-bar-vol 12s infinite}.interactive-demo-section .sa-bar-bright{width:80%;animation:sa-bar-bright 12s infinite}.interactive-demo-section .sa-bezel{position:absolute;top:50%;left:50%;background:#1c1c1e80;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:16px;width:80px;height:80px;display:flex;justify-content:center;align-items:center;font-size:32px;color:#fff;opacity:0;z-index:15;animation:sa-moon 12s infinite}.interactive-demo-section .sa-lock-mask{position:absolute;inset:0;background:#000000e6;display:flex;justify-content:center;align-items:center;opacity:0;z-index:30;animation:sa-lock 12s infinite}.interactive-demo-section .sa-lock-mask i{font-size:40px;color:#fffc}.interactive-demo-section .sa-hud-a{animation:sa-hud-a 12s infinite}.interactive-demo-section .sa-hud-b{animation:sa-hud-b 12s infinite}.interactive-demo-section .sa-hud-c{animation:sa-hud-c 12s infinite}.interactive-demo-section .sa-hud-d{animation:sa-hud-d 12s infinite}@keyframes sa-hud-a{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}8.33%{opacity:1;transform:translate(-50%,-50%) scale(1)}23%{opacity:1;transform:translate(-50%,-50%) scale(1)}25%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:0}}@keyframes sa-hud-b{0%,25%{opacity:0;transform:translate(-50%,-50%) scale(.95)}33.33%{opacity:1;transform:translate(-50%,-50%) scale(1)}48%{opacity:1;transform:translate(-50%,-50%) scale(1)}50%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:0}}@keyframes sa-hud-c{0%,50%{opacity:0;transform:translate(-50%,-50%) scale(.95)}58.33%{opacity:1;transform:translate(-50%,-50%) scale(1)}73%{opacity:1;transform:translate(-50%,-50%) scale(1)}75%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:0}}@keyframes sa-hud-d{0%,75%{opacity:0;transform:translate(-50%,-50%) scale(.95)}83.33%{opacity:1;transform:translate(-50%,-50%) scale(1)}98%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.95)}}@keyframes sa-osd-vol{0%,14%{opacity:0;transform:translateY(-6px)}16.66%{opacity:1;transform:translateY(0)}23%{opacity:1}25%{opacity:0;transform:translateY(-6px)}to{opacity:0}}@keyframes sa-osd-bright{0%,39%{opacity:0;transform:translate(-50%) translateY(-6px)}41.66%{opacity:1;transform:translate(-50%) translateY(0)}48%{opacity:1;transform:translate(-50%) translateY(0)}50%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:0}}@keyframes sa-bar-vol{0%,16.66%{width:60%}20%,to{width:80%}}@keyframes sa-bar-bright{0%,41.66%{width:80%}45%,to{width:50%}}@keyframes sa-dark{0%,50%{opacity:0}58.33%{opacity:1}73%{opacity:1}75%,to{opacity:0}}@keyframes sa-moon{0%,58.33%{opacity:0;transform:translate(-50%,-50%) scale(.8)}66.66%{opacity:1;transform:translate(-50%,-50%) scale(1)}73%{opacity:1;transform:translate(-50%,-50%) scale(1)}75%{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:0}}@keyframes sa-lock{0%,83.33%{opacity:0}91.66%{opacity:1}98%{opacity:1}to{opacity:0}}.interactive-demo-section .qp-overlay{position:absolute;inset:0;overflow:hidden}.interactive-demo-section .qp-editor{position:absolute;left:60px;top:32px;width:300px;height:170px;background:#fafafa;border-radius:8px;box-shadow:0 10px 30px #0006,0 0 0 1px #0000001a;overflow:hidden;display:flex;flex-direction:column}.interactive-demo-section .qp-titlebar{height:20px;background:#2d2d2d;display:flex;align-items:center;padding:0 8px;position:relative;flex-shrink:0}.interactive-demo-section .qp-lights{display:flex;gap:4px}.interactive-demo-section .qp-light{width:8px;height:8px;border-radius:50%}.interactive-demo-section .qp-red{background:#ff5f56}.interactive-demo-section .qp-yellow{background:#ffbd2e}.interactive-demo-section .qp-green{background:#27c93f}.interactive-demo-section .qp-window-title{position:absolute;left:0;right:0;text-align:center;font-size:10px;color:#999;pointer-events:none}.interactive-demo-section .qp-content{flex:1;padding:10px 14px;color:#333;font-size:11px;line-height:1.6;overflow:hidden}.interactive-demo-section .qp-static-line{color:#aaa}.interactive-demo-section .qp-anim-line{position:relative;height:20px;margin-top:4px}.interactive-demo-section .qp-group{position:absolute;inset:0;display:flex;align-items:center}.interactive-demo-section .qp-typing{position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;padding:0 2px;border-radius:2px;margin-left:-2px}.interactive-demo-section .qp-char{display:inline-block;max-width:0;opacity:0;overflow:hidden;vertical-align:bottom;white-space:pre;animation:qp-char-on 9s infinite}.interactive-demo-section .qp-expanded{position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;color:#06c;white-space:nowrap}.interactive-demo-section .qp-cursor{display:inline-block;width:1.5px;height:12px;background:#333;margin-left:1px;animation:qp-blink 1s step-end infinite}.interactive-demo-section .qp-expanded .qp-cursor{background:#06c}.interactive-demo-section .qp-hint{position:absolute;right:10px;bottom:48px;background:#000000bf;border-radius:6px;padding:3px 8px;color:#fff;font-size:8px;pointer-events:none;box-shadow:0 2px 8px #0003;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);white-space:nowrap}.interactive-demo-section .qp-group-a{animation:qp-grp-a 9s infinite}.interactive-demo-section .qp-group-b{animation:qp-grp-b 9s infinite;opacity:0}.interactive-demo-section .qp-group-c{animation:qp-grp-c 9s infinite;opacity:0}.interactive-demo-section .qp-hint-a{animation:qp-grp-a 9s infinite}.interactive-demo-section .qp-hint-b{animation:qp-grp-b 9s infinite;opacity:0}.interactive-demo-section .qp-hint-c{animation:qp-grp-c 9s infinite;opacity:0}.interactive-demo-section .qp-typing-a{animation:qp-typing-fx 9s infinite}.interactive-demo-section .qp-typing-b{animation:qp-typing-fx 9s infinite 3s;opacity:0}.interactive-demo-section .qp-typing-c{animation:qp-typing-fx 9s infinite 6s;opacity:0}.interactive-demo-section .qp-exp-a{animation:qp-show-exp 9s infinite;opacity:0}.interactive-demo-section .qp-exp-b{animation:qp-show-exp 9s infinite 3s;opacity:0}.interactive-demo-section .qp-exp-c{animation:qp-show-exp 9s infinite 6s;opacity:0}@keyframes qp-grp-a{0%,31.11%{opacity:1;z-index:1}33.33%,97.77%{opacity:0;z-index:0}to{opacity:1;z-index:1}}@keyframes qp-grp-b{0%,31.11%{opacity:0;z-index:0}33.33%,64.44%{opacity:1;z-index:1}66.66%,to{opacity:0;z-index:0}}@keyframes qp-grp-c{0%,64.44%{opacity:0;z-index:0}66.66%,97.77%{opacity:1;z-index:1}to{opacity:0;z-index:0}}@keyframes qp-typing-fx{0%,13.32%{background:transparent;opacity:1}13.33%,16.66%{background:#ffc8004d;opacity:1}16.67%,to{background:transparent;opacity:0}}@keyframes qp-char-on{0%{max-width:0;opacity:0}0.01%,16.66%{max-width:24px;opacity:1}16.67%,to{max-width:0;opacity:0}}@keyframes qp-show-exp{0%,16.66%{opacity:0}16.67%,to{opacity:1}}@keyframes qp-blink{0%,49%{opacity:1}50%,to{opacity:0}}.interactive-demo-section .qset-overlay{position:absolute;inset:0;overflow:hidden;z-index:50;pointer-events:none}.interactive-demo-section .qset-cat-overlay{position:absolute;inset:0;background:#000000a6;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;opacity:0;z-index:5;animation:qset-cat-overlay 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-cat-paw{font-size:52px;color:#fb923c;filter:drop-shadow(0 0 14px rgba(251,146,60,.55));transform:scale(.4);animation:qset-cat-paw 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-cat-text{color:#fff;font-size:13px;font-weight:500;letter-spacing:.3px;text-shadow:0 2px 4px rgba(0,0,0,.5);opacity:0;animation:qset-cat-text 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-black-floor{position:absolute;inset:0;background:#000;display:flex;justify-content:center;align-items:center;opacity:0;z-index:6;animation:qset-black-floor 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-clean-text{color:#fff6;font-size:10px;font-weight:400;letter-spacing:.3px}.interactive-demo-section .qset-cursor{position:absolute;top:44%;left:52%;width:16px;height:22px;opacity:0;z-index:15;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="22" viewBox="0 0 16 22"><path d="M0 0 L0 18 L4.5 13.5 L8 20 L10 19 L6.5 12.5 L12 12.5 Z" fill="white" stroke="black" stroke-width="1"/></svg>') no-repeat center/contain;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5));animation:qset-cursor 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-hud{position:absolute;bottom:52px;left:50%;background:#121212e0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:20px;padding:6px 14px;display:flex;flex-direction:row;align-items:center;gap:5px;opacity:0;z-index:20;border:1px solid rgba(255,255,255,.1);box-shadow:0 6px 20px #0006;pointer-events:none;white-space:nowrap;font-size:10px;color:#fffc}.interactive-demo-section .qset-key{background:#ffffff26;border:1px solid rgba(255,255,255,.12);border-radius:4px;padding:2px 5px;font-size:10px;color:#fff;line-height:1.3}.interactive-demo-section .qset-notif{position:absolute;top:28px;right:10px;width:152px;background:#222222eb;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:10px;padding:8px 10px;display:flex;gap:9px;align-items:center;opacity:0;transform:translate(80px);z-index:30;box-shadow:0 4px 16px #00000059;border:1px solid rgba(255,255,255,.08)}.interactive-demo-section .qset-notif-icon{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;color:#fff}.interactive-demo-section .qset-notif-content{display:flex;flex-direction:column;gap:2px}.interactive-demo-section .qset-notif-title{font-size:10px;font-weight:600;color:#fff}.interactive-demo-section .qset-notif-desc{font-size:9px;color:#ffffffa6;white-space:nowrap}.interactive-demo-section .qset-notif-a .qset-notif-icon{background:linear-gradient(135deg,#fb923c,#ea580c)}.interactive-demo-section .qset-notif-c .qset-notif-icon{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}.interactive-demo-section .qset-notif-d1 .qset-notif-icon{background:linear-gradient(135deg,#10b981,#059669)}.interactive-demo-section .qset-notif-d2 .qset-notif-icon{background:linear-gradient(135deg,#ef4444,#b91c1c)}.interactive-demo-section .qset-hud-a{animation:qset-hud-a 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-hud-b{animation:qset-hud-b 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-hud-c{animation:qset-hud-c 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-hud-d{animation:qset-hud-d 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-notif-a{animation:qset-notif-a 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-notif-c{animation:qset-notif-c 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-notif-d1{animation:qset-notif-d1 16s cubic-bezier(.16,1,.3,1) infinite}.interactive-demo-section .qset-notif-d2{animation:qset-notif-d2 16s cubic-bezier(.16,1,.3,1) infinite}@keyframes qset-cat-overlay{0%{opacity:0}2%{opacity:1}22%{opacity:1}25%{opacity:0}to{opacity:0}}@keyframes qset-cat-paw{0%{transform:scale(.4)}4%{transform:scale(1.08)}6%{transform:scale(1)}22%{transform:scale(1)}25%{transform:scale(.6)}to{transform:scale(.4)}}@keyframes qset-cat-text{0%{opacity:0}5%{opacity:1}21%{opacity:1}24%{opacity:0}to{opacity:0}}@keyframes qset-hud-a{0%{opacity:0;transform:translate(-50%) translateY(14px)}1%{opacity:1;transform:translate(-50%) translateY(0)}20%{opacity:1;transform:translate(-50%) translateY(0)}23%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:0;transform:translate(-50%) translateY(14px)}}@keyframes qset-notif-a{0%{opacity:0;transform:translate(80px)}2%{opacity:1;transform:translate(0)}21%{opacity:1;transform:translate(0)}24%{opacity:0;transform:translate(80px)}to{opacity:0;transform:translate(80px)}}@keyframes qset-black-floor{0%{opacity:0}25%{opacity:0}26%{opacity:1}47%{opacity:1}50%{opacity:0}to{opacity:0}}@keyframes qset-hud-b{0%{opacity:0;transform:translate(-50%) translateY(14px)}25%{opacity:0;transform:translate(-50%) translateY(14px)}26%{opacity:1;transform:translate(-50%) translateY(0)}45%{opacity:1;transform:translate(-50%) translateY(0)}48%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:0;transform:translate(-50%) translateY(14px)}}@keyframes qset-cursor{0%{opacity:0}50%{opacity:0}52%{opacity:1}64%{opacity:1}72%{opacity:0}to{opacity:0}}@keyframes qset-hud-c{0%{opacity:0;transform:translate(-50%) translateY(14px)}50%{opacity:0;transform:translate(-50%) translateY(14px)}51%{opacity:1;transform:translate(-50%) translateY(0)}70%{opacity:1;transform:translate(-50%) translateY(0)}73%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:0;transform:translate(-50%) translateY(14px)}}@keyframes qset-notif-c{0%{opacity:0;transform:translate(80px)}50%{opacity:0;transform:translate(80px)}52%{opacity:1;transform:translate(0)}72%{opacity:1;transform:translate(0)}74%{opacity:0;transform:translate(80px)}to{opacity:0;transform:translate(80px)}}@keyframes qset-hud-d{0%{opacity:0;transform:translate(-50%) translateY(14px)}75%{opacity:0;transform:translate(-50%) translateY(14px)}76%{opacity:1;transform:translate(-50%) translateY(0)}95%{opacity:1;transform:translate(-50%) translateY(0)}98%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:0;transform:translate(-50%) translateY(14px)}}@keyframes qset-notif-d1{0%{opacity:0;transform:translate(80px)}75%{opacity:0;transform:translate(80px)}76%{opacity:1;transform:translate(0)}81%{opacity:1;transform:translate(0)}83%{opacity:0;transform:translate(80px)}to{opacity:0;transform:translate(80px)}}@keyframes qset-notif-d2{0%{opacity:0;transform:translate(80px)}84%{opacity:0;transform:translate(80px)}85%{opacity:1;transform:translate(0)}97%{opacity:1;transform:translate(0)}99%{opacity:0;transform:translate(80px)}to{opacity:0;transform:translate(80px)}}.device,.device:before,.device:after,.device *,.device *:before,.device *:after{box-sizing:border-box;display:block}.device{position:relative;transform:scale(1);z-index:1}.device .device-frame{z-index:1}.device .device-screen{background-color:#000;background-position:center center;background-size:cover;object-fit:cover;position:relative}.device-iphone-14-pro{height:868px;width:428px}.device-iphone-14-pro .device-frame{background:#010101;border:1px solid #1b1721;border-radius:68px;box-shadow:inset 0 0 4px 2px #c0b7cd,inset 0 0 0 6px #342c3f;height:868px;padding:19px;width:428px}.device-iphone-14-pro .device-screen{border-radius:49px;height:830px;width:390px}.device-iphone-14-pro .device-stripe:after,.device-iphone-14-pro .device-stripe:before{border:solid rgba(1,1,1,.25);border-width:0 7px;content:"";height:7px;left:0;position:absolute;width:100%;z-index:9}.device-iphone-14-pro .device-stripe:after{top:85px}.device-iphone-14-pro .device-stripe:before{bottom:85px}.device-iphone-14-pro .device-header{background:#010101;border-radius:20px;height:35px;left:50%;margin-left:-60px;position:absolute;top:29px;width:120px}.device-iphone-14-pro .device-sensors:after,.device-iphone-14-pro .device-sensors:before{content:"";position:absolute}.device-iphone-14-pro .device-sensors:after{background:#010101;border-radius:17px;height:33px;left:50%;margin-left:-60px;top:30px;width:74px}.device-iphone-14-pro .device-sensors:before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px #ffffff0d;height:9px;left:50%;margin-left:36px;top:42px;width:9px}.device-iphone-14-pro .device-btns{background:#1b1721;border-radius:2px;height:32px;left:-2px;position:absolute;top:115px;width:3px}.device-iphone-14-pro .device-btns:after,.device-iphone-14-pro .device-btns:before{background:#1b1721;border-radius:2px;content:"";height:62px;left:0;position:absolute;width:3px}.device-iphone-14-pro .device-btns:after{top:60px}.device-iphone-14-pro .device-btns:before{top:140px}.device-iphone-14-pro .device-power{background:#1b1721;border-radius:2px;height:100px;position:absolute;right:-2px;top:200px;width:3px}.device-iphone-14-pro .device-home:after,.device-iphone-14-pro .device-home:before{border:solid rgba(1,1,1,.25);border-width:6px 0;content:"";height:6px;position:absolute;width:6px;z-index:9}.device-iphone-14-pro .device-home:after{right:86px;top:0}.device-iphone-14-pro .device-home:before{bottom:0;left:86px}.device-iphone-14-pro.device-silver .device-frame{border-color:#c8cacb;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #e2e3e4}.device-iphone-14-pro.device-silver .device-btns{background:#c8cacb}.device-iphone-14-pro.device-silver .device-btns:after,.device-iphone-14-pro.device-silver .device-btns:before{background:#c8cacb}.device-iphone-14-pro.device-silver .device-power{background:#c8cacb}.device-iphone-14-pro.device-black .device-frame{border-color:#5c5956;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #76726f}.device-iphone-14-pro.device-black .device-btns{background:#5c5956}.device-iphone-14-pro.device-black .device-btns:after,.device-iphone-14-pro.device-black .device-btns:before{background:#5c5956}.device-iphone-14-pro.device-black .device-power{background:#5c5956}.device-iphone-14-pro.device-gold .device-frame{border-color:#e7d19e;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #d2ab4c}.device-iphone-14-pro.device-gold .device-btns{background:#e7d19e}.device-iphone-14-pro.device-gold .device-btns:after,.device-iphone-14-pro.device-gold .device-btns:before{background:#e7d19e}.device-iphone-14-pro.device-gold .device-power{background:#e7d19e}.device-iphone-14{height:868px;width:428px}.device-iphone-14 .device-frame{background:#010101;border:1px solid #101315;border-radius:68px;box-shadow:inset 0 0 4px 2px #b0b8c0,inset 0 0 0 6px #272c31;height:868px;padding:19px;width:428px}.device-iphone-14 .device-screen{border-radius:49px;height:830px;width:390px}.device-iphone-14 .device-stripe:after,.device-iphone-14 .device-stripe:before{border:solid rgba(1,1,1,.25);border-width:0 7px;content:"";height:7px;left:0;position:absolute;width:100%;z-index:9}.device-iphone-14 .device-stripe:after{top:85px}.device-iphone-14 .device-stripe:before{bottom:85px}.device-iphone-14 .device-header{background:#010101;border-bottom-left-radius:20px;border-bottom-right-radius:20px;height:30px;left:50%;margin-left:-80px;position:absolute;top:20px;width:160px}.device-iphone-14 .device-header:after,.device-iphone-14 .device-header:before{content:"";height:10px;position:absolute;top:0;width:10px}.device-iphone-14 .device-header:after{background:radial-gradient(circle at bottom left,transparent 0,transparent 75%,#010101 75%,#010101 100%);left:-10px}.device-iphone-14 .device-header:before{background:radial-gradient(circle at bottom right,transparent 0,transparent 75%,#010101 75%,#010101 100%);right:-10px}.device-iphone-14 .device-sensors:after,.device-iphone-14 .device-sensors:before{content:"";position:absolute}.device-iphone-14 .device-sensors:after{background:#151515;border:1px solid #010101;border-radius:4px;box-shadow:0 0 4px #151515;height:7px;left:50%;margin-left:-35px;top:8px;width:70px}.device-iphone-14 .device-sensors:before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px #ffffff0d;height:9px;left:50%;margin-left:-60px;top:26px;width:9px}.device-iphone-14 .device-btns{background:#101315;border-radius:2px;height:32px;left:-2px;position:absolute;top:115px;width:3px}.device-iphone-14 .device-btns:after,.device-iphone-14 .device-btns:before{background:#101315;border-radius:2px;content:"";height:62px;left:0;position:absolute;width:3px}.device-iphone-14 .device-btns:after{top:60px}.device-iphone-14 .device-btns:before{top:140px}.device-iphone-14 .device-power{background:#101315;border-radius:2px;height:100px;position:absolute;right:-2px;top:200px;width:3px}.device-iphone-14 .device-home:after,.device-iphone-14 .device-home:before{border:solid rgba(1,1,1,.25);border-width:6px 0;content:"";height:6px;position:absolute;width:6px;z-index:9}.device-iphone-14 .device-home:after{right:86px;top:0}.device-iphone-14 .device-home:before{bottom:0;left:86px}.device-iphone-14.device-purple .device-frame{border-color:#af9bbf;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #c8bad3}.device-iphone-14.device-purple .device-btns{background:#af9bbf}.device-iphone-14.device-purple .device-btns:after,.device-iphone-14.device-purple .device-btns:before{background:#af9bbf}.device-iphone-14.device-purple .device-power{background:#af9bbf}.device-iphone-14.device-starlight .device-frame{border-color:#bdb4aa;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #d3cdc7}.device-iphone-14.device-starlight .device-btns{background:#bdb4aa}.device-iphone-14.device-starlight .device-btns:after,.device-iphone-14.device-starlight .device-btns:before{background:#bdb4aa}.device-iphone-14.device-starlight .device-power{background:#bdb4aa}.device-iphone-14.device-red .device-frame{border-color:#d11813;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #ec302b}.device-iphone-14.device-red .device-btns{background:#d11813}.device-iphone-14.device-red .device-btns:after,.device-iphone-14.device-red .device-btns:before{background:#d11813}.device-iphone-14.device-red .device-power{background:#d11813}.device-iphone-14.device-blue .device-frame{border-color:#7992aa;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #98abbe}.device-iphone-14.device-blue .device-btns{background:#7992aa}.device-iphone-14.device-blue .device-btns:after,.device-iphone-14.device-blue .device-btns:before{background:#7992aa}.device-iphone-14.device-blue .device-power{background:#7992aa}.device-iphone-x{height:868px;width:428px}.device-iphone-x .device-frame{background:#222;border-radius:68px;box-shadow:inset 0 0 2px 2px #c8cacb,inset 0 0 0 7px #e2e3e4;height:868px;padding:28px;width:428px}.device-iphone-x .device-screen{border-radius:40px;height:812px;width:375px}.device-iphone-x .device-stripe:after,.device-iphone-x .device-stripe:before{border:solid rgba(1,1,1,.25);border-width:0 7px;content:"";height:7px;left:0;position:absolute;width:100%;z-index:9}.device-iphone-x .device-stripe:after{top:85px}.device-iphone-x .device-stripe:before{bottom:85px}.device-iphone-x .device-header{background:#222;border-bottom-left-radius:20px;border-bottom-right-radius:20px;height:30px;left:50%;margin-left:-102px;position:absolute;top:28px;width:204px}.device-iphone-x .device-header:after,.device-iphone-x .device-header:before{content:"";height:10px;position:absolute;top:0;width:10px}.device-iphone-x .device-header:after{background:radial-gradient(circle at bottom left,transparent 0,transparent 75%,#222 75%,#222 100%);left:-10px}.device-iphone-x .device-header:before{background:radial-gradient(circle at bottom right,transparent 0,transparent 75%,#222 75%,#222 100%);right:-10px}.device-iphone-x .device-sensors:after,.device-iphone-x .device-sensors:before{content:"";position:absolute}.device-iphone-x .device-sensors:after{background:#333;border-radius:3px;height:6px;left:50%;margin-left:-25px;top:32px;width:50px}.device-iphone-x .device-sensors:before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px #ffffff0d;height:10px;left:50%;margin-left:42px;top:30px;width:10px}.device-iphone-x .device-btns{background:#c8cacb;height:32px;left:-3px;position:absolute;top:115px;width:3px}.device-iphone-x .device-btns:after,.device-iphone-x .device-btns:before{background:#c8cacb;content:"";height:62px;left:0;position:absolute;width:3px}.device-iphone-x .device-btns:after{top:60px}.device-iphone-x .device-btns:before{top:140px}.device-iphone-x .device-power{background:#c8cacb;height:100px;position:absolute;right:-3px;top:200px;width:3px}.device-iphone-8{height:871px;width:419px}.device-iphone-8 .device-frame{background:#fff;border-radius:68px;box-shadow:inset 0 0 0 2px #c8cacb,inset 0 0 0 7px #e2e3e4;height:871px;padding:102px 22px;width:419px}.device-iphone-8 .device-screen{border:2px solid #222;border-radius:4px;height:667px;width:375px}.device-iphone-8 .device-stripe:after,.device-iphone-8 .device-stripe:before{border:solid rgba(51,51,51,.15);border-width:0 7px;content:"";height:6px;left:0;position:absolute;width:100%;z-index:9}.device-iphone-8 .device-stripe:after{top:68px}.device-iphone-8 .device-stripe:before{bottom:68px}.device-iphone-8 .device-home{border:2px solid #c8cacb;border-radius:50%;bottom:25px;height:58px;left:50%;margin-left:-29px;position:absolute;width:58px}.device-iphone-8 .device-sensors{background:#666;border-radius:3px;height:6px;left:50%;margin-left:-38px;position:absolute;top:52px;width:76px}.device-iphone-8 .device-sensors:after,.device-iphone-8 .device-sensors:before{background:#666;border-radius:50%;content:"";position:absolute}.device-iphone-8 .device-sensors:after{height:10px;left:50%;margin-left:-5px;top:-25px;width:10px}.device-iphone-8 .device-sensors:before{height:12px;left:-42px;margin-top:-6px;top:50%;width:12px}.device-iphone-8 .device-btns{background:#c8cacb;height:30px;left:-3px;position:absolute;top:102px;width:3px}.device-iphone-8 .device-btns:after,.device-iphone-8 .device-btns:before{background:#c8cacb;content:"";height:56px;left:0;position:absolute;width:3px}.device-iphone-8 .device-btns:after{top:62px}.device-iphone-8 .device-btns:before{top:132px}.device-iphone-8 .device-power{background:#c8cacb;height:80px;position:absolute;right:-2px;top:160px;width:3px}.device-iphone-8.device-gold .device-frame{box-shadow:inset 0 0 0 2px #e4b08a,inset 0 0 0 7px #f7e8dd}.device-iphone-8.device-gold .device-home{border-color:#e4b08a}.device-iphone-8.device-gold .device-btns,.device-iphone-8.device-gold .device-btns:after,.device-iphone-8.device-gold .device-btns:before{background:#e4b08a}.device-iphone-8.device-gold .device-power{background:#e4b08a}.device-iphone-8.device-spacegray .device-frame{background:#222;box-shadow:inset 0 0 0 2px #74747a,inset 0 0 0 7px #9b9ba0}.device-iphone-8.device-spacegray .device-stripe:after,.device-iphone-8.device-spacegray .device-stripe:before{border-color:#cccccc59}.device-iphone-8.device-spacegray .device-btns,.device-iphone-8.device-spacegray .device-btns:after,.device-iphone-8.device-spacegray .device-btns:before{background:#74747a}.device-the-iphone{height:610px;width:320px}.device-the-iphone .device-frame{background:#010101;border:1px solid darkgray;border-radius:56px;box-shadow:inset 0 0 4px 3px #010101,inset 0 0 2px 13px #f5f5f5;height:610px;padding:100px 22px;width:320px}.device-the-iphone .device-frame:before{border:8px solid #010101;border-left-width:2px;border-radius:48px;border-right-width:2px;box-shadow:inset 0 0 8px 2px #010101;content:"";height:594px;left:2px;position:absolute;top:9px;width:316px}.device-the-iphone .device-frame:after{border:4px solid gainsboro;border-radius:38px;content:"";height:590px;left:13px;position:absolute;top:11px;width:294px}.device-the-iphone .device-screen{border:2px solid #272727;border-radius:4px;height:410px;width:276px}.device-the-iphone .device-sensors:before{background:linear-gradient(to bottom,#272727 50%,#dcdcdc40 50%,#a9a9a9);border-radius:5px;content:"";height:10px;left:50%;margin-left:-28px;position:absolute;top:52px;width:56px}.device-the-iphone .device-sensors:after{background:#272727;border:1px solid #010101;border-radius:3px;content:"";height:6px;left:50%;margin-left:-26px;position:absolute;top:54px;width:52px}.device-the-iphone .device-btns{background:#696969;border-radius:2px 0 0 2px;height:30px;left:-2px;position:absolute;top:60px;width:2px}.device-the-iphone .device-btns:after,.device-the-iphone .device-btns:before{background:#696969;content:"";height:56px;left:0;position:absolute;width:2px}.device-the-iphone .device-btns:after{border-radius:2px 0 0 50%;top:50px}.device-the-iphone .device-btns:before{border-radius:50% 0 0 2px;top:131px}.device-the-iphone .device-home{background:radial-gradient(circle at top center,#010101 70%,#dcdcdc40 70%,#a9a9a9);border:1px solid #292929;border-radius:50%;bottom:28px;height:56px;left:50%;margin-left:-28px;position:absolute;width:56px}.device-the-iphone .device-home:before{border:1px solid gainsboro;border-radius:4px;content:"";height:20px;left:17px;position:absolute;top:17px;width:20px}.device-the-iphone .device-power{background:#696969;border-radius:2px 2px 0 0;height:2px;position:absolute;right:52px;top:-2px;width:52px}.device-google-pixel-6-pro{height:862px;width:404px}.device-google-pixel-6-pro .device-frame{background:#121212;border-radius:28px;box-shadow:inset 0 0 12px #8d8d86,inset 0 7px 0 3px #fdfdfc,inset 0 -6px 0 3px #fdfdfc;height:862px;margin:0 2px;padding:20px 12px 26px;width:400px}.device-google-pixel-6-pro .device-screen{border-radius:27px;height:816px;width:376px}.device-google-pixel-6-pro .device-header{background:linear-gradient(to bottom,#8d8d86 0,#cbcbc8 30% 100%);height:10px;left:50%;margin-left:-147px;position:absolute;top:0;width:294px}.device-google-pixel-6-pro .device-stripe:after{background:linear-gradient(to top,#121212,#666661);border-radius:50px 50px 0 0;bottom:0;content:"";height:2px;left:50%;margin-left:-22px;position:absolute;width:44px}.device-google-pixel-6-pro .device-stripe:before{background:#cbcbc8;bottom:0;content:"";height:9px;left:50%;margin-left:40px;position:absolute;width:11px}.device-google-pixel-6-pro .device-sensors{background:#121212;border-radius:50%;height:22px;left:50%;margin-left:-11px;margin-top:-11px;position:absolute;top:39px;width:22px}.device-google-pixel-6-pro .device-sensors:after,.device-google-pixel-6-pro .device-sensors:before{content:"";position:absolute}.device-google-pixel-6-pro .device-sensors:after{background:linear-gradient(to bottom,#121212,#666661);border-radius:0 0 50px 50px;height:4px;left:50%;margin-left:-103px;top:-18px;width:206px}.device-google-pixel-6-pro .device-sensors:before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px #ffffff0d;height:8px;left:7px;top:7px;width:8px}.device-google-pixel-6-pro .device-btns{background:#b2b2ae;height:102px;position:absolute;right:0;top:306px;width:3px}.device-google-pixel-6-pro .device-power{background:#b2b2ae;height:58px;position:absolute;right:0;top:194px;width:3px}.device-google-pixel-6-pro.device-gold .device-frame{box-shadow:inset 0 0 12px #ff962e,inset 0 7px 0 3px #fff,inset 0 -6px 0 3px #fff}.device-google-pixel-6-pro.device-gold .device-header{background:linear-gradient(to bottom,#ff962e 0,#ffd6ad 30% 100%)}.device-google-pixel-6-pro.device-gold .device-stripe:after{background:linear-gradient(to top,#121212,#e07000)}.device-google-pixel-6-pro.device-gold .device-stripe:before{background:#ffd6ad}.device-google-pixel-6-pro.device-gold .device-btns,.device-google-pixel-6-pro.device-gold .device-power{background:#ffbd7a}.device-google-pixel-6-pro.device-black .device-frame{box-shadow:inset 0 0 12px #000,inset 0 7px 0 3px #646668,inset 0 -6px 0 3px #646668}.device-google-pixel-6-pro.device-black .device-header{background:linear-gradient(to bottom,#000 0,#323334 30% 100%)}.device-google-pixel-6-pro.device-black .device-stripe:after{background:linear-gradient(to top,#121212,#000)}.device-google-pixel-6-pro.device-black .device-stripe:before{background:#323334}.device-google-pixel-6-pro.device-black .device-btns,.device-google-pixel-6-pro.device-black .device-power{background:#191a1a}.device-google-pixel-2-xl{height:832px;width:404px}.device-google-pixel-2-xl .device-frame{background:#121212;border-radius:36px;box-shadow:inset 0 0 0 2px #cfcfcf,inset 0 0 0 7px #9c9c9c;height:832px;padding:56px 22px;width:404px}.device-google-pixel-2-xl .device-screen{border-radius:27px;height:720px;width:360px}.device-google-pixel-2-xl .device-header{height:832px;left:50%;margin-left:-150px;position:absolute;top:0;width:300px}.device-google-pixel-2-xl .device-header:after,.device-google-pixel-2-xl .device-header:before{background:#333;border-radius:3px;content:"";height:6px;left:50%;margin-left:-73px;margin-top:-3px;position:absolute;width:146px}.device-google-pixel-2-xl .device-header:after{top:24px}.device-google-pixel-2-xl .device-header:before{bottom:28px}.device-google-pixel-2-xl .device-sensors{background:#333;border-radius:7px;height:14px;left:54px;margin-top:-7px;position:absolute;top:36px;width:14px}.device-google-pixel-2-xl .device-btns{background:#cfcfcf;height:102px;position:absolute;right:-3px;top:306px;width:3px}.device-google-pixel-2-xl .device-power{background:#cfcfcf;height:58px;position:absolute;right:-3px;top:194px;width:3px}.device-google-pixel{height:744px;width:360px}.device-google-pixel .device-frame{background:#f7f7f8;border-radius:54px;box-shadow:inset 0 0 0 2px #c8cacb,inset 0 0 0 6px #e2e3e4,inset 0 0 0 10px #fff;height:744px;padding:82px 18px 86px;width:360px}.device-google-pixel .device-screen{border:2px solid #222;border-radius:2px;height:576px;width:324px}.device-google-pixel .device-stripe{border-top:6px solid rgba(51,51,51,.15);bottom:0;left:254px;position:absolute;top:0;width:8px}.device-google-pixel .device-stripe:after,.device-google-pixel .device-stripe:before{border:solid rgba(51,51,51,.15);border-width:0 6px;content:"";height:10px;left:-254px;position:absolute;width:360px;z-index:9}.device-google-pixel .device-stripe:after{top:60px}.device-google-pixel .device-stripe:before{bottom:46px}.device-google-pixel .device-sensors{background:#ddd;border-radius:2.5px;height:5px;left:50%;margin-left:-39px;margin-top:-2.5px;position:absolute;top:41px;width:78px}.device-google-pixel .device-sensors:after,.device-google-pixel .device-sensors:before{background:#333;border-radius:6px;content:"";position:absolute}.device-google-pixel .device-sensors:after{height:12px;left:50%;margin-left:-14px;top:21.5px;width:28px}.device-google-pixel .device-sensors:before{height:10px;left:-81px;margin-top:-5px;top:50%;width:10px}.device-google-pixel .device-btns{background:#c8cacb;height:102px;position:absolute;right:-2px;top:298px;width:3px}.device-google-pixel .device-power{background:#c8cacb;height:50px;position:absolute;right:-2px;top:184px;width:3px}.device-google-pixel.device-black .device-frame{background:#211d1c;box-shadow:inset 0 0 0 2px #363635,inset 0 0 0 6px #6a6967,inset 0 0 0 10px #3d3533}.device-google-pixel.device-black .device-stripe,.device-google-pixel.device-black .device-stripe:after,.device-google-pixel.device-black .device-stripe:before{border-color:#0d0d0d59}.device-google-pixel.device-black .device-sensors{background:#444}.device-google-pixel.device-black .device-sensors:after{background:#0d0d0d}.device-google-pixel.device-black .device-btns,.device-google-pixel.device-black .device-btns:after,.device-google-pixel.device-black .device-btns:before{background:#363635}.device-google-pixel.device-black .device-power{background:#363635}.device-google-pixel.device-blue .device-frame{box-shadow:inset 0 0 0 2px #2a5aff,inset 0 0 0 6px #7695ff,inset 0 0 0 10px #fff}.device-google-pixel.device-blue .device-btns,.device-google-pixel.device-blue .device-btns:after,.device-google-pixel.device-blue .device-btns:before{background:#2a5aff}.device-google-pixel.device-blue .device-power{background:#2a5aff}.device-galaxy-s8{height:828px;width:380px}.device-galaxy-s8 .device-frame{background:#222;border:solid #cfcfcf;border-radius:55px;border-width:5px 0;box-shadow:inset 0 0 0 2px #9c9c9c;height:828px;padding:48px 10px 40px;width:380px}.device-galaxy-s8 .device-screen{border:2px solid #222;border-radius:34px;height:740px;width:360px}.device-galaxy-s8 .device-stripe:after,.device-galaxy-s8 .device-stripe:before{border:solid rgba(51,51,51,.15);border-width:5px 0;content:"";height:828px;position:absolute;top:0;width:6px;z-index:9}.device-galaxy-s8 .device-stripe:after{left:48px}.device-galaxy-s8 .device-stripe:before{right:48px}.device-galaxy-s8 .device-sensors{background:#666;border-radius:3px;height:6px;left:50%;margin-left:-24px;margin-top:-3px;position:absolute;top:32px;width:48px}.device-galaxy-s8 .device-sensors:after,.device-galaxy-s8 .device-sensors:before{background:#666;border-radius:50%;content:"";position:absolute;top:50%}.device-galaxy-s8 .device-sensors:after{box-shadow:-192px 0 #333,-174px 0 #333,-240px 0 #333;height:8px;margin-top:-4px;right:-90px;width:8px}.device-galaxy-s8 .device-sensors:before{box-shadow:186px 0 #666;height:12px;left:-90px;margin-top:-6px;width:12px}.device-galaxy-s8 .device-btns{background:#9c9c9c;border-radius:3px 0 0 3px;height:116px;left:-3px;position:absolute;top:144px;width:3px}.device-galaxy-s8 .device-btns:after{background:#9c9c9c;border-radius:3px 0 0 3px;content:"";height:54px;left:0;position:absolute;top:164px;width:3px}.device-galaxy-s8 .device-power{background:#9c9c9c;border-radius:0 3px 3px 0;height:54px;position:absolute;right:-3px;top:260px;width:3px}.device-galaxy-s8.device-blue .device-frame{border-color:#a3c5e8;box-shadow:inset 0 0 0 2px #5192d4}.device-galaxy-s8.device-blue .device-stripe:after,.device-galaxy-s8.device-blue .device-stripe:before{border-color:#ffffff59}.device-galaxy-s8.device-blue .device-btns,.device-galaxy-s8.device-blue .device-btns:after{background:#5192d4}.device-galaxy-s8.device-blue .device-power{background:#5192d4}.device-macbook-pro{height:434px;width:740px}.device-macbook-pro .device-frame{background:#0d0d0d;border-radius:20px;box-shadow:inset 0 0 0 2px #c8cacb;height:418px;margin:0 auto;padding:9px 9px 23px;position:relative;width:618px}.device-macbook-pro .device-frame:after{background:linear-gradient(to bottom,#272727,#0d0d0d);border-radius:0 0 20px 20px;bottom:2px;content:"";height:24px;left:2px;position:absolute;width:614px}.device-macbook-pro .device-header{background:#0d0d0d;border-bottom-left-radius:4px;border-bottom-right-radius:4px;height:12px;left:50%;margin-left:-32px;position:absolute;top:11px;width:64px;z-index:2}.device-macbook-pro .device-header:after,.device-macbook-pro .device-header:before{content:"";height:4px;position:absolute;top:0;width:4px}.device-macbook-pro .device-header:after{background:radial-gradient(circle at bottom left,transparent 0,transparent 75%,#0d0d0d 75%,#0d0d0d 100%);left:-4px}.device-macbook-pro .device-header:before{background:radial-gradient(circle at bottom right,transparent 0,transparent 75%,#0d0d0d 75%,#0d0d0d 100%);right:-4px}.device-macbook-pro .device-screen{border:2px solid #121212;border-radius:10px 10px 0 0;height:375px;width:600px}.device-macbook-pro .device-power{background:radial-gradient(circle at center,#e2e3e4 85%,#c8cacb);border:solid #a0a3a7;border-radius:2px 2px 12px 12px;border-width:1px 2px 0 2px;box-shadow:inset 0 -2px 8px #6c7074;height:24px;margin-top:-10px;position:relative;width:740px;z-index:9}.device-macbook-pro .device-power:after{background:#e2e3e4;border-radius:0 0 10px 10px;box-shadow:inset 0 0 4px 2px #babdbf;content:"";height:10px;left:50%;margin-left:-60px;position:absolute;top:0;width:120px}.device-macbook-pro .device-power:before{background:transparent;border-radius:0 0 3px 3px;bottom:-2px;box-shadow:-300px 0 #272727,300px 0 #272727;content:"";height:2px;left:50%;margin-left:-20px;position:absolute;width:40px}.device-macbook-pro.device-spacegray .device-frame{box-shadow:inset 0 0 0 2px #767a7d}.device-macbook-pro.device-spacegray .device-power{background:radial-gradient(circle at center,#83878a 85%,#767a7d);border-color:#454749;box-shadow:inset 0 -2px 8px #202121}.device-macbook-pro.device-spacegray .device-power:after{background:#b7babc;box-shadow:inset 0 0 4px 2px #6a6d70}.device-macbook-pro-2018{height:444px;width:740px}.device-macbook-pro-2018 .device-frame{background:#0d0d0d;border-radius:20px;box-shadow:inset 0 0 0 2px #c8cacb;height:428px;margin:0 auto;padding:29px 19px 39px;position:relative;width:614px}.device-macbook-pro-2018 .device-frame:after{background:#272727;border-radius:0 0 20px 20px;bottom:2px;content:"";height:26px;left:2px;position:absolute;width:610px}.device-macbook-pro-2018 .device-frame:before{bottom:10px;color:#c8cacb;content:"MacBook Pro";font-size:12px;height:16px;left:50%;line-height:16px;margin-left:-100px;position:absolute;text-align:center;width:200px;z-index:1}.device-macbook-pro-2018 .device-screen{border:2px solid #121212;border-radius:2px;height:360px;width:576px}.device-macbook-pro-2018 .device-power{background:#e2e3e4;border:solid #d5d6d8;border-radius:2px 2px 0 0;border-width:2px 4px 0 4px;height:14px;margin-top:-10px;position:relative;width:740px;z-index:9}.device-macbook-pro-2018 .device-power:after,.device-macbook-pro-2018 .device-power:before{content:"";position:absolute}.device-macbook-pro-2018 .device-power:after{background:#d5d6d8;border-radius:0 0 10px 10px;box-shadow:inset 0 0 4px 2px #babdbf;height:10px;left:50%;margin-left:-60px;top:-2px;width:120px}.device-macbook-pro-2018 .device-power:before{background:#a0a3a7;border-radius:0 0 180px 180px/0 0 12px 12px;box-shadow:inset 0 -2px 6px #474a4d;height:12px;left:-4px;margin:0 auto;top:10px;width:740px}.device-macbook-pro-2018.device-spacegray .device-frame{box-shadow:inset 0 0 0 2px #767a7d}.device-macbook-pro-2018.device-spacegray .device-power{background:#909496;border-color:#767a7d}.device-macbook-pro-2018.device-spacegray .device-power:after{background:#83878a;box-shadow:inset 0 0 4px 2px #6a6d70}.device-macbook-pro-2018.device-spacegray .device-power:before{background:#515456;box-shadow:inset 0 -2px 6px #000}.device-macbook{height:432px;width:740px}.device-macbook .device-frame{background:#0d0d0d;border-radius:20px;box-shadow:inset 0 0 0 2px #c8cacb;height:428px;margin:0 auto;padding:29px 19px 39px;position:relative;width:614px}.device-macbook .device-frame:after{background:#272727;border-radius:0 0 20px 20px;bottom:2px;content:"";height:26px;left:2px;position:absolute;width:610px}.device-macbook .device-frame:before{bottom:10px;color:#c8cacb;content:"MacBook";font-size:12px;height:16px;left:50%;line-height:16px;margin-left:-100px;position:absolute;text-align:center;width:200px;z-index:1}.device-macbook .device-screen{border:2px solid #121212;border-radius:2px;height:360px;width:576px}.device-macbook .device-power{background:#e2e3e4;border:solid #d5d6d8;border-radius:2px 2px 0 0;border-width:0 4px;height:4px;margin-top:-10px;position:relative;width:740px;z-index:9}.device-macbook .device-power:after,.device-macbook .device-power:before{content:"";position:absolute}.device-macbook .device-power:after{background:radial-gradient(circle at center,#e2e3e4 0 85%,#a0a3a7);border:solid #adb0b3;border-width:0 2px;height:4px;left:50%;margin-left:-60px;width:120px}.device-macbook .device-power:before{background:#a0a3a7;border-radius:0 0 180px 180px/0 0 10px 10px;box-shadow:inset 0 -2px 6px #474a4d;height:10px;left:-4px;margin:0 auto;top:4px;width:740px}.device-macbook.device-gold .device-frame{box-shadow:inset 0 0 0 2px #edccb4}.device-macbook.device-gold .device-power{background:#f7e8dd;border-color:#edccb4}.device-macbook.device-gold .device-power:after{background:radial-gradient(circle at center,#f7e8dd 0 85%,#dfa276);border-color:#e4b08a}.device-macbook.device-gold .device-power:before{background:#edccb4;box-shadow:inset 0 -2px 6px #83491f}.device-macbook.device-rosegold .device-frame{box-shadow:inset 0 0 0 2px #f6a69a}.device-macbook.device-rosegold .device-power{background:#facfc9;border-color:#f6a69a}.device-macbook.device-rosegold .device-power:after{background:radial-gradient(circle at center,#facfc9 0 85%,#ef6754);border-color:#f6a69a}.device-macbook.device-rosegold .device-power:before{background:#f6a69a;box-shadow:inset 0 -2px 6px #851b0c}.device-macbook.device-spacegray .device-frame{box-shadow:inset 0 0 0 2px #767a7d}.device-macbook.device-spacegray .device-power{background:#909496;border-color:#767a7d}.device-macbook.device-spacegray .device-power:after{background:radial-gradient(circle at center,#909496 0 85%,#515456);border-color:#5d6163}.device-macbook.device-spacegray .device-power:before{background:#515456;box-shadow:inset 0 -2px 6px #000}.device-imac{height:540px;width:640px}.device-imac .device-frame{background:#edeef0;border-radius:18px;box-shadow:inset 0 0 0 1px #d4d5d7;height:440px;padding:16px 16px 80px;position:relative;width:640px}.device-imac .device-frame:after{background:#d4d5d7;border-radius:0 0 18px 18px;bottom:1px;box-shadow:inset 0 0 18px #c7c8cb;content:"";height:63px;left:1px;position:absolute;width:638px}.device-imac .device-frame:before{background:#050505;border-radius:50%;content:"";height:6px;left:50%;margin-left:-3px;position:absolute;text-align:center;top:6px;width:6px;z-index:9}.device-imac .device-screen{border:2px solid #121212;border-radius:2px;height:342px;width:608px}.device-imac .device-power:after{background:radial-gradient(circle at center,#d4d5d7 85%,#9fa1a6);border-top:1px solid #d4d5d7;content:"";height:6px;margin:0 auto;position:relative;width:152px}.device-imac .device-power:before{background:linear-gradient(to bottom,#9fa1a6 0,#c7c8cb 40% 85%,#fff 90%,#6b6e74);content:"";height:92px;margin:0 auto;position:relative;width:152px}.device-imac .device-home{background:transparent;border-radius:0 0 3px 3px;bottom:0;box-shadow:-61px 0 #d4d5d7,61px 0 #d4d5d7;height:2px;left:50%;margin-left:-15px;position:absolute;width:30px}.device-imac.device-blue .device-frame{box-shadow:inset 0 0 0 2px #b4c7da}.device-imac.device-blue .device-frame:after{background:#b4c7da;box-shadow:inset 0 0 18px #a3bad2}.device-imac.device-blue .device-power:after{background:radial-gradient(circle at center,#b4c7da 85%,#7094b8);border-top-color:#b4c7da}.device-imac.device-blue .device-power:before{background:linear-gradient(to bottom,#7094b8 0,#a3bad2 40% 85%,#fff 90%,#406182)}.device-imac.device-blue .device-home{box-shadow:-61px 0 #b4c7da,61px 0 #b4c7da}.device-imac.device-green .device-frame{box-shadow:inset 0 0 0 2px #bbd0c8}.device-imac.device-green .device-frame:after{background:#bbd0c8;box-shadow:inset 0 0 18px #acc6bc}.device-imac.device-green .device-power:after{background:radial-gradient(circle at center,#bbd0c8 85%,#7fa697);border-top-color:#bbd0c8}.device-imac.device-green .device-power:before{background:linear-gradient(to bottom,#7fa697 0,#acc6bc 40% 85%,#fff 90%,#4e7164)}.device-imac.device-green .device-home{box-shadow:-61px 0 #bbd0c8,61px 0 #bbd0c8}.device-imac.device-pink .device-frame{box-shadow:inset 0 0 0 2px #edccc6}.device-imac.device-pink .device-frame:after{background:#edccc6;box-shadow:inset 0 0 18px #e7bbb3}.device-imac.device-pink .device-power:after{background:radial-gradient(circle at center,#edccc6 85%,#d58778);border-top-color:#edccc6}.device-imac.device-pink .device-power:before{background:linear-gradient(to bottom,#d58778 0,#e7bbb3 40% 85%,#fff 90%,#b04a37)}.device-imac.device-pink .device-home{box-shadow:-61px 0 #edccc6,61px 0 #edccc6}.device-imac.device-yellow .device-frame{box-shadow:inset 0 0 0 2px #f4d595}.device-imac.device-yellow .device-frame:after{background:#f4d595;box-shadow:inset 0 0 18px #f2cc7e}.device-imac.device-yellow .device-power:after{background:radial-gradient(circle at center,#f4d595 85%,#eab039);border-top-color:#f4d595}.device-imac.device-yellow .device-power:before{background:linear-gradient(to bottom,#eab039 0,#f2cc7e 40% 85%,#fff 90%,#ab7912)}.device-imac.device-yellow .device-home{box-shadow:-61px 0 #f4d595,61px 0 #f4d595}.device-imac.device-orange .device-frame{box-shadow:inset 0 0 0 2px #e9b5a0}.device-imac.device-orange .device-frame:after{background:#e9b5a0;box-shadow:inset 0 0 18px #e4a58b}.device-imac.device-orange .device-power:after{background:radial-gradient(circle at center,#e9b5a0 85%,#d6744d);border-top-color:#e9b5a0}.device-imac.device-orange .device-power:before{background:linear-gradient(to bottom,#d6744d 0,#e4a58b 40% 85%,#fff 90%,#994524)}.device-imac.device-orange .device-home{box-shadow:-61px 0 #e9b5a0,61px 0 #e9b5a0}.device-imac.device-purple .device-frame{box-shadow:inset 0 0 0 2px #c4c4e5}.device-imac.device-purple .device-frame:after{background:#c4c4e5;box-shadow:inset 0 0 18px #b2b2dd}.device-imac.device-purple .device-power:after{background:radial-gradient(circle at center,#c4c4e5 85%,#7d7dc6);border-top-color:#c4c4e5}.device-imac.device-purple .device-power:before{background:linear-gradient(to bottom,#7d7dc6 0,#b2b2dd 40% 85%,#fff 90%,#449)}.device-imac.device-purple .device-home{box-shadow:-61px 0 #c4c4e5,61px 0 #c4c4e5}.device-imac-pro{height:484px;width:624px}.device-imac-pro .device-frame{background:#0d0d0d;border-radius:18px;box-shadow:inset 0 0 0 2px #080808;height:428px;padding:24px 24px 80px;position:relative;width:624px}.device-imac-pro .device-frame:after{background:#2f2e33;border-radius:0 0 18px 18px;bottom:2px;content:"";height:54px;left:2px;position:absolute;width:620px}.device-imac-pro .device-frame:before{bottom:15px;color:#0d0d0d;content:"";font-size:24px;height:24px;left:50%;line-height:24px;margin-left:-100px;position:absolute;text-align:center;width:200px;z-index:9}.device-imac-pro .device-screen{border:2px solid #121212;border-radius:2px;height:324px;width:576px}.device-imac-pro .device-power:after,.device-imac-pro .device-power:before{content:""}.device-imac-pro .device-power:after{background:#222225;border-radius:2px;height:6px;margin:0 auto;position:relative;width:180px}.device-imac-pro .device-power:before{border:solid transparent;border-bottom-color:#333;border-width:0 8px 50px 8px;height:50px;margin:0 auto;position:relative;width:130px}.device-surface-book{height:424px;width:728px}.device-surface-book .device-frame{background:#0d0d0d;border-radius:12px;box-shadow:inset 0 0 0 2px #c8c8c8;height:408px;margin:0 auto;padding:24px 22px;position:relative;width:584px}.device-surface-book .device-screen{border:2px solid #121212;border-radius:2px;height:360px;width:540px}.device-surface-book .device-btns:after,.device-surface-book .device-btns:before{background:#c8c8c8;content:"";height:2px;position:absolute;top:-2px}.device-surface-book .device-btns:after{left:122px;width:20px}.device-surface-book .device-btns:before{left:168px;width:44px}.device-surface-book .device-power{background:linear-gradient(to bottom,#eee,#c8c8c8);border:solid #c8c8c8;border-radius:2px;border-width:0 2px;height:16px;margin-top:4px;position:relative;width:728px}.device-surface-book .device-power:after,.device-surface-book .device-power:before{content:"";position:absolute}.device-surface-book .device-power:after{background:radial-gradient(circle at center,#eee 0 95%,#a2a2a2);border-radius:0 0 6px 6px;height:8px;left:50%;margin-left:-125px;top:0;width:250px;z-index:1}.device-surface-book .device-power:before{background:linear-gradient(to bottom,#eee,#c8c8c8);border-radius:2px 2px 0 0;bottom:16px;height:8px;left:50%;margin-left:-292px;width:584px}.device-surface-studio{height:506px;width:640px}.device-surface-studio .device-frame{background:#0d0d0d;border-radius:10px;box-shadow:inset 0 0 0 2px #000;height:440px;padding:20px;width:640px}.device-surface-studio .device-screen{border:2px solid #121212;border-radius:2px;height:400px;width:600px}.device-surface-studio .device-stripe{background:#444;border-radius:0 0 2px 2px;bottom:0;height:4px;left:50%;margin-left:-117px;position:absolute;width:234px}.device-surface-studio .device-stripe:after,.device-surface-studio .device-stripe:before{content:"";left:50%;position:absolute;top:-75px}.device-surface-studio .device-stripe:after{border:1px solid #e2e3e4;border-radius:0 0 18px 18px;border-top:0;box-shadow:inset 0 0 4px 1px #c8cacb,inset 0 0 4px 2px #e2e3e4,inset 0 0 0 8px #c8cacb;height:60px;margin-left:-140px;width:280px;z-index:-1}.device-surface-studio .device-stripe:before{border:15px solid #e2e3e4;border-radius:0 0 8px 8px;border-top:0;height:70px;margin-left:-150px;width:300px;z-index:-2}.device-surface-studio .device-power{background:radial-gradient(circle at center,#e2e3e4 85%,#c8cacb);border-radius:0 0 2px 2px;height:32px;margin:30px auto 0;position:relative;width:250px}.device-surface-studio .device-power:after{background:#babdbf;content:"";height:1px;left:0;position:absolute;top:4px;width:250px}.device-ipad-pro{height:778px;width:560px}.device-ipad-pro .device-frame{background:#0d0d0d;border-radius:36px;box-shadow:inset 0 0 0 1px #babdbf,inset 0 0 1px 3px #e2e3e4;height:778px;padding:27px;width:560px}.device-ipad-pro .device-screen{border:2px solid #121212;border-radius:11px;height:724px;width:506px}.device-ipad-pro .device-btns:after,.device-ipad-pro .device-btns:before{background:#babdbf;content:"";position:absolute}.device-ipad-pro .device-btns:after{height:2px;right:40px;top:-2px;width:36px}.device-ipad-pro .device-btns:before{box-shadow:0 37px #babdbf;height:32px;right:-2px;top:63px;width:2px}.device-ipad-pro .device-sensors:after,.device-ipad-pro .device-sensors:before{content:"";position:absolute}.device-ipad-pro .device-sensors:after{background:#1a1a1a;border-radius:17px;box-shadow:-20px 0 #1a1a1a,70px 0 #1a1a1a;height:10px;left:50%;margin-left:-30px;top:12px;width:10px}.device-ipad-pro .device-sensors:before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px #ffffff0d;height:6px;left:50%;margin-left:-3px;top:14px;width:6px}.device-ipad-pro.device-spacegray .device-frame{box-shadow:inset 0 0 0 1px #6a6d70,inset 0 0 1px 3px #83878a}.device-ipad-pro.device-spacegray .device-btns:after,.device-ipad-pro.device-spacegray .device-btns:before{background:#6a6d70}.device-ipad-pro.device-spacegray .device-btns:before{box-shadow:0 37px #6a6d70}.device-ipad-pro-2017{height:804px;width:560px}.device-ipad-pro-2017 .device-frame{background:#fff;border-radius:38px;box-shadow:inset 0 0 0 2px #c8cacb,inset 0 0 0 6px #e2e3e4;height:804px;padding:62px 25px;width:560px}.device-ipad-pro-2017 .device-screen{border:2px solid #222;border-radius:2px;height:680px;width:510px}.device-ipad-pro-2017 .device-home{border:2px solid #c8cacb;border-radius:50%;bottom:17px;height:34px;left:50%;margin-left:-17px;position:absolute;width:34px}.device-ipad-pro-2017 .device-sensors{background:#666;border-radius:50%;height:10px;left:50%;margin-left:-5px;margin-top:-5px;position:absolute;top:34px;width:10px}.device-ipad-pro-2017.device-gold .device-frame{box-shadow:inset 0 0 0 2px #e4b08a,inset 0 0 0 6px #f7e8dd}.device-ipad-pro-2017.device-gold .device-header{border-color:#e4b08a}.device-ipad-pro-2017.device-rosegold .device-frame{box-shadow:inset 0 0 0 2px #f6a69a,inset 0 0 0 6px #facfc9}.device-ipad-pro-2017.device-rosegold .device-home{border-color:#f6a69a}.device-ipad-pro-2017.device-spacegray .device-frame{background:#222;box-shadow:inset 0 0 0 2px #818187,inset 0 0 0 6px #9b9ba0}.device-ipad-pro-2017.device-spacegray .device-home{border-color:#818187}.device-surface-pro-2017{height:394px;width:561px}.device-surface-pro-2017 .device-frame{background:#0d0d0d;border-radius:10px;box-shadow:inset 0 0 0 2px #c8c8c8;height:394px;margin:0 auto;padding:26px 24px;width:561px}.device-surface-pro-2017 .device-screen{border:2px solid #121212;border-radius:2px;height:342px;width:513px}.device-surface-pro-2017 .device-btns:after,.device-surface-pro-2017 .device-btns:before{background:#c8c8c8;content:"";height:2px;position:absolute;top:-2px}.device-surface-pro-2017 .device-btns:after{left:48px;width:26px}.device-surface-pro-2017 .device-btns:before{left:94px;width:48px}.device-surface-pro-2017 .device-sensors{background:#333;border-radius:50%;height:6px;left:50%;margin-left:-3px;margin-top:-3px;position:absolute;top:14px;width:6px}.device-apple-watch-ultra{height:380px;width:360px}.device-apple-watch-ultra .device-frame{background:#0d0d0d;border-radius:92px;box-shadow:inset 0 0 12px 1px #0d0d0dbf,inset 0 0 0 6px #d6ccc2,inset 0 0 0 12px #d6ccc2;height:380px;margin:0 20px;padding:38px;position:relative;width:320px}.device-apple-watch-ultra .device-frame:before{border:1px solid #f5f2f0;border-radius:80px;box-shadow:0 0 6px #0d0d0d33,inset 0 0 4px 1px #f5f2f0,inset 0 0 0 10px #d6ccc2;content:"";height:356px;left:12px;position:absolute;top:12px;width:296px}.device-apple-watch-ultra .device-screen{border:2px solid #121212;border-radius:62px;height:304px;width:244px}.device-apple-watch-ultra .device-header{background:radial-gradient(circle at center,#d6ccc2 50%,#ebe6e1 85%,#a38c76);border-radius:4px/8px 4px 4px 8px;box-shadow:inset 0 0 16px 1px #0d0d0d80,-8px 0 4px #0d0d0d33,inset 4px 0 4px #0d0d0d33;height:214px;margin-top:-107px;position:absolute;right:4px;top:50%;width:18px;z-index:1}.device-apple-watch-ultra .device-header:before{border-radius:8px 4px 4px 8px/32px 4px 4px 32px;box-shadow:-10px 0 8px #0d0d0d33;content:"";height:194px;margin-top:-97px;position:absolute;right:8px;top:50%;width:12px}.device-apple-watch-ultra .device-btns{background:#d6ccc2;border-left:1px solid #4c4033;border-radius:8px 6px 6px 8px/20px 6px 6px 20px;box-shadow:inset 8px 0 8px #5c4d3e,inset -2px 0 6px #a38c76;height:72px;position:absolute;right:1px;top:108px;width:24px;z-index:9}.device-apple-watch-ultra .device-btns:after{background:#d6ccc2;border-radius:2px 4px 4px 2px/20px 8px 8px 20px;box-shadow:inset -2px 0 2px #6b5948,inset -6px 0 18px #a38c76;content:"";height:78px;position:absolute;right:0;top:-4px;width:6px}.device-apple-watch-ultra .device-btns:before{background:#d6ccc2;border-radius:20%;box-shadow:0 -30px #a38c7680,0 -27px #d6ccc2,0 -25px #89735c,0 -21px #a38c7680,0 -18px #d6ccc2,0 -16px #89735c,0 -12px #a38c7680,0 -9px #d6ccc2,0 -7px #89735c,0 -3px #a38c7680,0 0 #d6ccc2,0 2px #89735c,0 6px #a38c7680,0 9px #d6ccc2,0 11px #89735c,0 15px #a38c7680,0 18px #d6ccc2,0 20px #89735c,0 24px #a38c7680,0 27px #d6ccc2,0 29px #89735c;content:"";height:3px;margin-top:-2px;position:absolute;right:2px;top:50%;width:16px;z-index:9}.device-apple-watch-ultra .device-stripe{background:#e0d9d1;border-radius:2px 8px 8px 2px;box-shadow:0 14px #d6ccc2,0 28px #d6ccc2;height:10px;left:19px;position:absolute;top:98px;width:4px;z-index:1}.device-apple-watch-ultra .device-power{background:#d6ccc2;border-radius:2px 4px 4px 2px/2px 8px 8px 2px;box-shadow:inset 0 0 2px 1px #a38c76;height:72px;position:absolute;right:1px;top:212px;width:4px}.device-apple-watch-ultra .device-home{background:#f18f42;border:1px solid #a7500c;border-radius:2px 4px 4px 2px/2px 8px 8px 2px;box-shadow:inset 0 0 1px 1px #ef812a;height:106px;left:19px;position:absolute;top:162px;width:4px;z-index:1}.device-apple-watch-s8{height:380px;width:360px}.device-apple-watch-s8 .device-frame{background:#0d0d0d;border-radius:92px;box-shadow:inset 0 0 24px 1px #0d0d0d,inset 0 0 0 12px #606c78;height:380px;margin:0 20px;padding:28px 26px;position:relative;width:320px}.device-apple-watch-s8 .device-frame:before{border:1px solid #0d0d0d;border-radius:80px;box-shadow:0 0 12px #ffffff80,inset 0 0 12px 2px #ffffffbf;content:"";height:356px;left:12px;position:absolute;top:12px;width:298px}.device-apple-watch-s8 .device-screen{border:2px solid #121212;border-radius:62px;height:324px;width:268px}.device-apple-watch-s8 .device-btns{background:#606c78;border-left:1px solid black;border-radius:8px 6px 6px 8px/20px 6px 6px 20px;box-shadow:inset 8px 0 8px #1c1f23,inset -2px 0 6px #272c31,-4px 0 8px #0d0d0d40;height:72px;position:absolute;right:10px;top:108px;width:18px;z-index:9}.device-apple-watch-s8 .device-btns:after{background:#272c31;border-radius:2px 4px 4px 2px/20px 8px 8px 20px;box-shadow:inset -2px 0 2px #000,inset -6px 0 18px #272c31;content:"";height:72px;position:absolute;right:0;top:0;width:6px}.device-apple-watch-s8 .device-btns:before{background:#272c31;border-radius:20%;box-shadow:0 -30px #3e464dbf,0 -27px #272c31,0 -25px #000,0 -21px #3e464dbf,0 -18px #272c31,0 -16px #000,0 -12px #3e464dbf,0 -9px #272c31,0 -7px #000,0 -3px #3e464dbf,0 0 #272c31,0 2px #000,0 6px #3e464dbf,0 9px #272c31,0 11px #000,0 15px #3e464dbf,0 18px #272c31,0 20px #000,0 24px #3e464dbf,0 27px #272c31,0 29px #000;content:"";height:3px;margin-top:-2px;position:absolute;right:2px;top:50%;width:10px;z-index:9}.device-apple-watch-s8 .device-power{background:#272c31;border-radius:2px 4px 4px 2px/2px 8px 8px 2px;box-shadow:inset 0 0 2px 1px #101315;height:72px;position:absolute;right:18px;top:212px;width:4px}.device-homepod{height:395px;width:320px}.device-homepod .device-frame{background:linear-gradient(to right,#36373a 0,#8d8f95 25%,#1d1e20 60%,#111112 90%,#1d1e20);border-radius:80px;box-shadow:inset 0 0 0 2px #36373a,inset 0 0 40px 1px #1d1e20,inset 0 12px 40px 1px #fff,inset 0 -24px 40px 1px #000;height:385px;margin:5px auto;overflow:hidden;position:relative;width:320px}.device-homepod .device-stripe{background:repeating-linear-gradient(45deg,rgba(141,143,149,.35) 0,rgba(141,143,149,.35) 2px,transparent 2px,transparent 6px),repeating-linear-gradient(135deg,rgba(141,143,149,.35) 0,rgba(141,143,149,.35) 2px,transparent 2px,transparent 6px),repeating-linear-gradient(45deg,transparent 0,transparent 2px,rgba(29,30,32,.35) 2px,rgba(29,30,32,.35) 4px,transparent 4px,transparent 6px),repeating-linear-gradient(135deg,transparent 0,transparent 2px,rgba(29,30,32,.35) 2px,rgba(29,30,32,.35) 4px,transparent 4px,transparent 6px);border-radius:80px;box-shadow:inset 0 0 0 2px #36373a,inset 0 0 40px 1px #1d1e20,inset 0 12px 24px 1px #9b9ca1,inset 0 -12px 24px 1px #050505;height:385px;left:0;overflow:hidden;position:absolute;top:5px;width:320px;z-index:9}.device-homepod .device-stripe:before{top:0;transform:translateY(-34%) perspective(500px) rotateX(51deg)}.device-homepod .device-stripe:after{bottom:0;transform:translateY(34%) perspective(500px) rotateX(-51deg)}.device-homepod .device-home:before,.device-homepod .device-home:after{background:#36373a;content:"";left:50%;position:absolute}.device-homepod .device-home:before{border-radius:50% 50% 8px 8px;height:10px;margin-left:-85px;top:0;width:170px}.device-homepod .device-home:after{border-radius:0 0 10% 10%/0 0 8px 8px;bottom:0;box-shadow:inset 0 0 4px #111112;height:5px;margin-left:-85px;width:170px}.device-pro-display-xdr{height:475px;width:640px}.device-pro-display-xdr .device-frame{background:#151515;border-radius:4px;box-shadow:inset 0 0 2px #d4d5d7;height:368px;padding:8px;position:relative;width:640px}.device-pro-display-xdr .device-frame:before{background:#050505;border-radius:50%;content:"";height:6px;left:50%;margin-left:-3px;position:absolute;text-align:center;top:6px;width:6px;z-index:9}.device-pro-display-xdr .device-screen{border:2px solid #121212;border-radius:2px;height:352px;width:624px}.device-pro-display-xdr .device-power:after{background:radial-gradient(circle at center,#d4d5d7 85%,#9fa1a6);border-top:1px solid #d4d5d7;content:"";height:6px;margin:0 auto;position:relative;width:152px}.device-pro-display-xdr .device-power:before{background:linear-gradient(to bottom,#9fa1a6 0,#c7c8cb 40% 85%,#fff 90%,#6b6e74);content:"";height:102px;margin:0 auto;position:relative;width:152px}.device-pro-display-xdr .device-home{background:transparent;border-radius:0 0 3px 3px;bottom:-2px;box-shadow:-61px 0 #6b6e74,61px 0 #6b6e74;height:1px;left:50%;margin-left:-15px;position:absolute;width:30px}
