:root{--blue: #2196f3;--blue-hover: #1976d2;--blue-dark: #1565c0;--blue-light: #e3f2fd;--blue-mid: #bbdefb;--green: #25d366;--green-dark: #1faa54;--green-light: #dcfce7;--red: #ef4444;--red-dark: #b91c1c;--red-light: #fef2f2;--amber: #f59e0b;--amber-light: #fef3c7;--bg: #ffffff;--surface: #f8fafc;--surface-2: #f1f5f9;--card-bg: #ffffff;--text: #0f1117;--text-2: #4b5563;--text-3: #9ca3af;--border: #e5e7eb;--color-primary: var(--blue);--color-primary-hover: var(--blue-hover);--color-primary-active: var(--blue-dark);--color-primary-tint: var(--blue-light);--color-primary-mid: var(--blue-mid);--color-success: var(--green);--color-success-strong: var(--green-dark);--color-success-tint: var(--green-light);--color-danger: var(--red);--color-danger-strong: var(--red-dark);--color-danger-tint: var(--red-light);--color-warning: var(--amber);--color-warning-tint: var(--amber-light);--color-bg: var(--bg);--color-surface: var(--surface);--color-surface-raised: var(--surface-2);--color-card: var(--card-bg);--color-text: var(--text);--color-text-secondary: var(--text-2);--color-text-tertiary: var(--text-3);--color-border: var(--border);--color-on-color: #ffffff;--color-overlay: rgba(15, 17, 23, .4);--color-rating: #fbbf24;--font-light: "Space Grotesk", system-ui, sans-serif;--font-roman: "Space Grotesk", system-ui, sans-serif;--font-bold: "Space Grotesk", system-ui, sans-serif;--text-hero-bold: 700 38px/50px var(--font-bold);--text-hero-regular: 400 38px/50px var(--font-roman);--text-xlarge-bold: 700 22px/30px var(--font-bold);--text-xlarge-regular: 400 22px/30px var(--font-roman);--text-large-light: 300 18px/26px var(--font-light);--text-large-regular: 400 18px/26px var(--font-roman);--text-large-bold: 700 18px/26px var(--font-bold);--text-medium-light: 300 16px/26px var(--font-light);--text-medium-regular: 400 16px/26px var(--font-roman);--text-medium-bold: 700 16px/26px var(--font-bold);--text-normal-light: 300 14px/22px var(--font-light);--text-normal-regular: 400 14px/22px var(--font-roman);--text-normal-bold: 700 14px/22px var(--font-bold);--text-small-light: 300 12px/22px var(--font-light);--text-small-regular: 400 12px/22px var(--font-roman);--text-small-bold: 700 12px/22px var(--font-bold);--text-xsmall-light: 300 10px/14px var(--font-light);--text-xsmall-regular: 400 10px/14px var(--font-roman);--text-xsmall-bold: 700 10px/14px var(--font-bold);--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-2xl: 30px;--radius-full: 9999px;--radius-input: 15px;--radius-sheet: 40px;--radius-button: 10px;--space-4: 4px;--space-8: 8px;--space-12: 12px;--space-16: 16px;--space-20: 20px;--space-24: 24px;--space-32: 32px;--space-40: 40px;--space-48: 48px;--screen-pad-x: 24px;--shadow-card: 0 4px 20px rgba(15, 17, 23, .08);--measure: #ff4d6d}[data-theme=dark]{--blue: #2196f3;--blue-hover: #1976d2;--blue-dark: #1565c0;--blue-light: #1e3a5f;--blue-mid: #2a4a73;--green: #25d366;--green-dark: #1faa54;--green-light: #1a3324;--red: #ef4444;--red-dark: #fca5a5;--red-light: #3a1818;--amber: #f59e0b;--amber-light: #3a2a08;--text: #f5f5f5;--text-2: #d1d5db;--text-3: #9ca3af;--border: #383d46;--bg: #1e2229;--surface: #2d3139;--surface-2: #383d46;--card-bg: #2d3139;--shadow-card: 0 4px 20px rgba(0, 0, 0, .35);--color-primary: var(--blue);--color-primary-hover: var(--blue-hover);--color-primary-active: var(--blue-dark);--color-primary-tint: var(--blue-light);--color-primary-mid: var(--blue-mid);--color-success: var(--green);--color-success-strong: var(--green-dark);--color-success-tint: var(--green-light);--color-danger: var(--red);--color-danger-strong: var(--red-dark);--color-danger-tint: var(--red-light);--color-warning: var(--amber);--color-warning-tint: var(--amber-light);--color-bg: var(--bg);--color-surface: var(--surface);--color-surface-raised: var(--surface-2);--color-card: var(--card-bg);--color-text: var(--text);--color-text-secondary: var(--text-2);--color-text-tertiary: var(--text-3);--color-border: var(--border);--color-on-color: #ffffff;--color-overlay: rgba(15, 17, 23, .4);--color-rating: #fbbf24}[lang=ar]{--font-light: "Cairo", system-ui, sans-serif;--font-roman: "Cairo", system-ui, sans-serif;--font-bold: "Cairo", system-ui, sans-serif;--text-hero-bold: 700 35px/46px var(--font-bold);--text-hero-regular: 400 35px/46px var(--font-roman);--text-xlarge-bold: 700 20px/28px var(--font-bold);--text-xlarge-regular: 400 20px/28px var(--font-roman);--text-large-light: 300 17px/24px var(--font-light);--text-large-regular: 400 17px/24px var(--font-roman);--text-large-bold: 700 17px/24px var(--font-bold);--text-medium-light: 300 15px/24px var(--font-light);--text-medium-regular: 400 15px/24px var(--font-roman);--text-medium-bold: 700 15px/24px var(--font-bold);--text-normal-light: 300 13px/20px var(--font-light);--text-normal-regular: 400 13px/20px var(--font-roman);--text-normal-bold: 700 13px/20px var(--font-bold);--text-small-light: 300 11px/20px var(--font-light);--text-small-regular: 400 11px/20px var(--font-roman);--text-small-bold: 700 11px/20px var(--font-bold);--text-xsmall-light: 300 9px/13px var(--font-light);--text-xsmall-regular: 400 9px/13px var(--font-roman);--text-xsmall-bold: 700 9px/13px var(--font-bold)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font-roman);background:var(--color-bg);color:var(--color-text);line-height:1.5;font-size:14px;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}input,button{font-family:inherit}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-track{background:transparent}.app{display:grid;grid-template-columns:240px 1fr 340px;height:100vh;background:var(--color-bg)}.sidebar{background:var(--color-card);border-right:1px solid var(--color-border);padding:var(--space-20) var(--space-16);overflow-y:auto;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:var(--space-12);padding:4px 8px var(--space-20);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-16)}.brand-mark{width:32px;height:32px;background:var(--color-primary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:#fff;font:var(--text-small-bold)}.brand-name{font:var(--text-medium-bold);letter-spacing:-.01em}.brand-sub{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.06em;margin-top:2px}.nav-category{display:flex;flex-direction:column}.nav-label-btn{font:var(--text-xsmall-bold);color:var(--color-primary);letter-spacing:.08em;padding:12px;margin-top:8px;background:none;border:none;display:flex;align-items:center;gap:8px;text-align:left;border-radius:var(--radius-xs);transition:background .15s ease;width:100%}.nav-label-btn:hover{background:var(--color-surface)}.nav-chevron{display:inline-block;transition:transform .18s ease;font-size:9px;color:var(--color-primary)}.nav-label-btn.collapsed .nav-chevron{transform:rotate(-90deg)}.nav-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:var(--radius-sm);font:var(--text-small-regular);color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none;border:1px solid transparent;text-decoration:none}.nav-item:hover{background:var(--color-surface);color:var(--color-text)}.nav-item.active{background:var(--color-primary-tint);color:var(--color-primary-active);border-color:var(--color-primary-mid);font:var(--text-small-bold)}.nav-num{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);min-width:18px}.nav-item.active .nav-num{color:var(--color-primary)}.sidebar-footer{margin-top:auto;padding:12px;border-top:1px solid var(--color-border);font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.04em}.canvas{display:flex;flex-direction:column;align-items:center;padding:var(--space-24) var(--space-40);overflow-y:auto;background:var(--color-bg)}.canvas-header{width:100%;display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-24)}.screen-title{font:var(--text-large-bold);letter-spacing:-.01em}.screen-meta{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);margin-top:2px;letter-spacing:.04em}.canvas-actions{display:flex;gap:var(--space-8);align-items:center}.hint-pill{font:var(--text-xsmall-bold);padding:8px 12px;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);border-radius:var(--radius-sm);letter-spacing:.04em}.hint-pill kbd{font-family:var(--font-roman);background:var(--color-card);border:1px solid var(--color-border);padding:1px 5px;border-radius:4px;font-size:10px;margin:0 2px;color:var(--color-primary)}.icon-btn{min-width:36px;height:36px;padding:0 12px;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-card);color:var(--color-text-secondary);display:flex;align-items:center;justify-content:center;gap:8px;transition:all .15s ease;font:var(--text-xsmall-bold)}.icon-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.icon-btn svg{width:18px;height:18px}.inspector{background:var(--color-card);border-left:1px solid var(--color-border);overflow-y:auto;display:flex;flex-direction:column}.inspector-header{padding:var(--space-20) var(--space-20) var(--space-16);border-bottom:1px solid var(--color-border);position:sticky;top:0;background:var(--color-card);z-index:5}.inspector-title{font:var(--text-xsmall-bold);color:var(--color-primary);letter-spacing:.08em;margin-bottom:8px}.inspector-name{font:var(--text-medium-bold);letter-spacing:-.01em}.inspector-tag{display:inline-block;margin-top:8px;font:var(--text-xsmall-bold);padding:3px 8px;background:var(--color-surface-raised);color:var(--color-text-secondary);border-radius:var(--radius-sm);letter-spacing:.04em}.inspector-body{padding:var(--space-16) var(--space-20) var(--space-24)}.inspector-empty{padding:40px var(--space-24);text-align:center;color:var(--color-text-tertiary);font:var(--text-small-regular)}.inspector-empty-icon{width:48px;height:48px;margin:0 auto 12px;border-radius:var(--radius-lg);background:var(--color-surface);display:flex;align-items:center;justify-content:center;color:var(--color-primary)}.inspector-empty kbd{font:var(--text-xsmall-bold);background:var(--color-surface);border:1px solid var(--color-border);padding:1px 8px;border-radius:4px;color:var(--color-primary);margin:0 2px}.spec-group{margin-bottom:var(--space-20)}.spec-group-title{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}.spec-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-family:var(--font-roman);font-size:11.5px;gap:var(--space-12)}.spec-key{color:var(--color-text-tertiary);font-weight:500;white-space:nowrap}.spec-val{color:var(--color-text);font-weight:600;display:flex;align-items:center;gap:8px;text-align:right;word-break:break-word;flex-wrap:wrap;justify-content:flex-end}.color-chip{width:14px;height:14px;border-radius:4px;border:1px solid var(--color-border);flex-shrink:0}.token-pill{font-family:var(--font-roman);font-size:10.5px;padding:2px 7px;background:var(--color-primary-tint);color:var(--color-primary-active);border-radius:var(--radius-sm);font-weight:700}[data-component]{cursor:crosshair}[data-component]:hover{outline:1.5px dashed var(--color-primary);outline-offset:2px}[data-component].is-selected{outline:2px solid var(--color-primary)!important;outline-offset:2px}[data-component].is-measure-target{outline:2px solid var(--measure)!important;outline-offset:2px}.hover-tip{position:fixed;pointer-events:none;background:var(--color-primary);color:#fff;font:var(--text-xsmall-bold);padding:5px 12px;border-radius:6px;z-index:9999;letter-spacing:.04em;white-space:nowrap;box-shadow:0 4px 12px #2196f359;opacity:0;transform:translateY(-4px);transition:opacity .12s ease,transform .12s ease}.hover-tip.show{opacity:1;transform:translateY(-10px)}.measure-overlay{position:fixed;pointer-events:none;z-index:9998;top:0;right:0;bottom:0;left:0}.measure-line{position:absolute;background:var(--measure);pointer-events:none}.measure-line.horizontal{height:1px}.measure-line.vertical{width:1px}.measure-label{position:absolute;background:var(--measure);color:#fff;font-family:var(--font-roman);font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:4px;white-space:nowrap;transform:translate(-50%,-50%);box-shadow:0 2px 8px #ff4d6d66}body.is-measuring [data-component]:hover{outline:2px dashed var(--measure)!important;outline-offset:2px}body.is-measuring{cursor:crosshair}.phone-wrap{display:flex;justify-content:center;padding:12px 0 32px}.phone{width:375px;height:812px;background:#0f1117;border-radius:50px;padding:12px;box-shadow:0 0 0 2px #ffffff0f,0 30px 80px -20px #0f111780,0 0 0 8px #1a1d24;position:relative;flex-shrink:0}.phone-screen{width:100%;height:100%;border-radius:40px;overflow:hidden;position:relative;background:var(--color-bg);display:flex;flex-direction:column}.phone:before{content:"";position:absolute;top:12px;left:50%;transform:translate(-50%);width:156px;height:28px;background:#000;border-radius:0 0 18px 18px;z-index:10;pointer-events:none}.status-bar{height:44px;display:flex;justify-content:space-between;align-items:flex-end;padding:0 24px 8px;font:var(--text-small-bold);flex-shrink:0}.status-bar.dark-text{color:#0f1117}.status-bar.light-text,[data-theme=dark] .status-bar{color:#fff}.status-icons{display:flex;gap:8px;align-items:center}.status-icons svg{display:block}[lang=ar] .icon-chevron-left,[lang=ar] .icon-chevron-right,[lang=ar] .icon-arrow-left{transform:scaleX(-1)}.screen-splash{background:var(--color-primary);color:var(--color-on-color);flex:1;display:flex;flex-direction:column}.splash-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 var(--space-40)}.splash-name{font:var(--text-hero-bold);letter-spacing:-.02em;color:var(--color-on-color);margin-top:24px}.splash-logo{display:flex;align-items:center;justify-content:center}.splash-tagline{font:var(--text-normal-regular);color:color-mix(in srgb,var(--color-on-color) 85%,transparent);text-align:center}.splash-footer{padding:0 0 var(--space-48);display:flex;flex-direction:column;align-items:center;gap:8px}.splash-by{font:var(--text-xsmall-bold);color:color-mix(in srgb,var(--color-on-color) 60%,transparent);letter-spacing:.08em}.splash-version{font:var(--text-xsmall-bold);color:color-mix(in srgb,var(--color-on-color) 80%,transparent)}.screen-onboarding{background:var(--color-bg);flex:1;display:flex;flex-direction:column}.onb-image{margin:var(--space-16) auto 0;width:calc(100% - 50px);height:394px;border-radius:var(--radius-xl);overflow:hidden;background-size:cover;background-position:center;background-color:var(--color-surface)}.onb-content{padding:var(--space-24) var(--space-32) 0;text-align:center}.onb-title{font:var(--text-large-bold);letter-spacing:-.01em;color:var(--color-text);margin-bottom:12px}.onb-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);padding:0 8px}.page-dots{display:flex;justify-content:center;gap:var(--space-8);margin-top:12px}.dot{width:8px;height:8px;border-radius:50%;background:var(--color-border);transition:all .2s ease}.dot.active{background:var(--color-primary);width:24px;border-radius:var(--radius-full)}.onb-actions{margin-top:auto;padding:var(--space-20) var(--space-24) var(--space-24);display:flex;flex-direction:column;gap:var(--space-12);align-items:center}.btn-primary{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:background .2s ease,transform .1s ease}.btn-primary:hover{background:var(--color-primary-hover)}.btn-primary:active{transform:scale(.98)}.btn-link{background:none;border:none;color:var(--color-primary);font:var(--text-small-bold);cursor:pointer;padding:8px}.btn-link:hover{color:var(--color-primary-hover)}.ds-page{width:100%;max-width:980px;padding:8px 0 80px}.ds-section{margin-bottom:40px}.ds-section-label{font:var(--text-xsmall-bold);color:var(--color-primary);letter-spacing:.08em;margin-bottom:8px}.ds-section-title{font:var(--text-xlarge-bold);letter-spacing:-.01em;margin-bottom:8px}.ds-section-desc{font:var(--text-small-regular);color:var(--color-text-secondary);margin-bottom:20px;max-width:560px}.ds-color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.ds-color{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:all .15s ease}.ds-color:hover{border-color:var(--color-primary)}.ds-color-swatch{height:80px}.ds-color-info{padding:12px 14px}.ds-color-name{font:var(--text-small-bold)}.ds-color-token{font:var(--text-xsmall-bold);color:var(--color-primary);margin-top:2px}.ds-color-hex{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);margin-top:8px;padding-top:8px;border-top:1px solid var(--color-border)}.ds-type-list{display:flex;flex-direction:column;gap:14px}.ds-type{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px 22px}.ds-type-meta{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}.ds-type-meta .tok{color:var(--color-primary)}.ds-radius-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}.ds-radius{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px;text-align:center}.ds-radius:hover{border-color:var(--color-primary)}.ds-radius-shape{width:72px;height:72px;background:var(--color-primary);margin:0 auto 12px}.ds-radius-token{font:var(--text-xsmall-bold);color:var(--color-primary)}.ds-radius-val{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);margin-top:2px}.ds-shadow-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.ds-shadow{background:var(--color-card);border-radius:var(--radius-lg);padding:32px 20px 16px}.ds-shadow-box{width:100%;height:70px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-bottom:16px;box-shadow:var(--shadow-card)}.ds-shadow-token{font:var(--text-xsmall-bold);color:var(--color-primary);margin-bottom:4px}.ds-shadow-val{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);word-break:break-all}.ds-spacing-list{display:flex;flex-direction:column;gap:8px}.ds-space-row{display:grid;grid-template-columns:80px 1fr 80px;gap:16px;align-items:center;padding:12px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-sm)}.ds-space-name{font:var(--text-xsmall-bold);color:var(--color-primary)}.ds-space-bar{height:10px;background:var(--color-primary);border-radius:var(--radius-full);max-width:100%}.ds-space-val{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);text-align:right}.ds-component{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px var(--screen-pad-x);margin-bottom:12px}.ds-component-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:16px;gap:12px;flex-wrap:wrap}.ds-component-name{font:var(--text-medium-bold);letter-spacing:-.01em}.ds-component-token{font:var(--text-xsmall-bold);color:var(--color-primary)}.ds-component-preview{display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:flex-start;padding:28px;background:var(--color-surface);border-radius:var(--radius-sm)}.ds-component-state{display:flex;flex-direction:column;align-items:center;gap:12px;flex:0 0 auto}.ds-component-state-label{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.04em}.ds-component-button-stack,.ds-component-input-stack{flex:1 1 100%;display:flex;flex-direction:column;gap:12px;min-width:280px;max-width:360px}.icons-search{display:flex;align-items:center;gap:12px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:0 16px;height:44px;margin-bottom:20px;max-width:400px}.icons-search input{flex:1;border:none;outline:none;background:none;font:var(--text-small-regular);color:var(--color-text)}.icons-search input::placeholder{color:var(--color-text-tertiary)}.icons-search .field-icon{color:var(--color-text-tertiary)}.icons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.icon-card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px 12px 12px;display:flex;flex-direction:column;align-items:center;gap:12px;transition:all .15s ease;position:relative}.icon-card:hover{border-color:var(--color-primary);transform:translateY(-2px)}.icon-card-preview{width:32px;height:32px;color:var(--color-text);display:flex;align-items:center;justify-content:center}.icon-card-name{font:var(--text-xsmall-bold);color:var(--color-text-secondary);text-align:center;word-break:break-word}.icon-card-download{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:var(--radius-sm);background:var(--color-surface);border:none;color:var(--color-text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .15s ease}.icon-card:hover .icon-card-download{opacity:1}.icon-card-download:hover{background:var(--color-primary);color:var(--color-on-color)}.icons-empty{padding:40px 0;color:var(--color-text-tertiary);font:var(--text-small-regular);text-align:center}.icons-category-label{font:var(--text-xsmall-bold);color:var(--color-primary);letter-spacing:.08em;margin:28px 0 12px}.icons-category-label:first-child{margin-top:0}.animations-empty{padding:60px var(--screen-pad-x);text-align:center;background:var(--color-card);border:2px dashed var(--color-border);border-radius:var(--radius-lg);color:var(--color-text-tertiary);font:var(--text-small-regular)}.animations-empty strong{display:block;color:var(--color-text);font:var(--text-medium-bold);margin-bottom:8px}.animations-empty code{font:var(--text-xsmall-bold);background:var(--color-surface);padding:2px 8px;border-radius:4px;color:var(--color-primary)}.screen-home{background:var(--color-bg);flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden;height:100%;min-height:0}.home-header{display:flex;align-items:center;gap:var(--space-12)}.home-avatar{width:44px;height:44px;border-radius:50%;background-image:url(/react-native-course/design/images/avatars/jonathan.jpg);background-size:cover;background-position:center;flex-shrink:0;overflow:hidden}.home-greeting{display:flex;flex-direction:column;flex:1;min-width:0}.home-greeting-name{font:var(--text-small-bold);color:var(--color-text);letter-spacing:-.01em}.home-greeting-sub{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.home-action-icon{position:relative;width:22px;height:22px;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;color:var(--color-text);padding:0;flex-shrink:0}.home-action-bell{position:relative}.home-action-badge{position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:50%;background:var(--color-danger);border:1.5px solid var(--color-bg)}.home-tabs{display:flex;padding:0 var(--screen-pad-x);margin-top:var(--space-16);flex-shrink:0;background:var(--color-bg)}.home-tab{flex:1;padding:8px 0;text-align:center;font:var(--text-small-bold);color:var(--color-text-tertiary);cursor:pointer;position:relative;background:none;border:none}.home-tab.home-tab-active{font:var(--text-small-bold);color:var(--color-text)}.home-tab.home-tab-active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--color-primary)}.home-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px}.hero-banner{width:100%;height:137px;border-radius:var(--radius-lg);background:var(--color-surface);padding:var(--space-24);position:relative;overflow:hidden;display:flex;align-items:center;margin-top:var(--space-24)}.hero-decoration{position:absolute;top:-50px;left:-50px;width:140px;height:140px;border-radius:50%;background:var(--color-primary);opacity:.25}.hero-content{position:relative;z-index:1;max-width:60%}.hero-title{font:var(--text-normal-bold);color:var(--color-text);letter-spacing:-.01em}.hero-subtitle{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:4px}.hero-image{position:absolute;right:-60px;top:50%;transform:translateY(-50%);width:160px;height:130px;border-radius:var(--radius-md);background-image:url(/react-native-course/design/images/products/woven-tote.jpg);background-size:cover;background-position:center;box-shadow:0 4px 12px #00000026}[lang=ar] .hero-image{display:none}.hero-dots{display:flex;gap:var(--space-8);justify-content:center;margin-top:var(--space-12)}.hero-dots .dot{width:8px;height:8px;border-radius:50%;background:var(--color-border);transition:all .2s ease}.hero-dots .dot.dot-active{background:var(--color-primary);width:8px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-16);margin-bottom:var(--space-16)}.section-title{font:var(--text-medium-bold);color:var(--color-text);letter-spacing:-.01em}.section-link{font:var(--text-xsmall-bold);color:var(--color-primary);cursor:pointer}.product-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:17px;row-gap:16px}.product-card{display:flex;flex-direction:column;gap:0;align-items:center;text-align:center}.product-image{width:100%;height:174px;border-radius:var(--radius-lg);position:relative;overflow:hidden;margin-bottom:8px}.fav-btn{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,var(--color-on-color) 95%,transparent);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.fav-btn:hover{background:#fff;transform:scale(1.05)}.fav-btn-active{background:#fff}.fav-btn-active svg{color:var(--color-danger);fill:var(--color-danger)}.product-title{font:var(--text-normal-bold);color:var(--color-text)}.product-brand{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.product-price{font:var(--text-small-bold);color:var(--color-text)}.bottom-tabs{width:100%;background:var(--color-bg);border-top:1px solid var(--color-border);display:flex;align-items:flex-start;padding:0 8px 21px;flex-shrink:0;z-index:5;position:relative}.bottom-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:13.5px 19px;background:none;border:none;cursor:pointer;color:var(--color-text-tertiary);position:relative}.bottom-tab.bottom-tab-active:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--color-primary)}.bottom-tab.bottom-tab-active{color:var(--color-primary)}.bottom-tab-label{font:var(--text-xsmall-bold);color:inherit}.ios-indicator{position:absolute;bottom:9px;left:50%;transform:translate(-50%);width:134px;height:5px;border-radius:var(--radius-full);background:var(--color-text)}.ds-type-table{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.ds-type-table-header{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;gap:16px;padding:12px 16px;background:var(--color-surface);border-bottom:1px solid var(--color-border);font:var(--text-xsmall-bold);color:var(--color-text-tertiary);letter-spacing:.06em;text-transform:uppercase}.ds-type-row{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;gap:16px;padding:12px 16px;border-bottom:1px solid var(--color-border);align-items:center;transition:background .15s ease}.ds-type-row:last-child{border-bottom:none}.ds-type-row:hover{background:var(--color-surface)}.ds-type-token{font:var(--text-xsmall-bold);color:var(--color-primary)}.ds-type-cell{color:var(--color-text)}.ds-type-row .ds-type-meta{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);margin:0}.ds-tabs{display:flex;gap:8px;margin-bottom:var(--space-24);padding:4px;background:var(--color-surface);border-radius:var(--radius-full);width:fit-content;border:1px solid var(--color-border)}.ds-tab{padding:8px 16px;border-radius:var(--radius-full);border:none;background:none;cursor:pointer;font:var(--text-small-bold);color:var(--color-text-secondary);transition:all .15s ease;white-space:nowrap}.ds-tab:hover{color:var(--color-text);background:var(--color-card)}.ds-tab.active{background:var(--color-primary);color:var(--color-on-color)}.feedback-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.feedback-card{display:flex;flex-direction:column;gap:12px}.feedback-static{background:var(--color-surface);border-radius:var(--radius-lg);padding:16px}.feedback-static .toast-progress{animation:none;transform:scaleX(1)}.feedback-trigger{padding:0 16px;height:36px;border-radius:var(--radius-full);font:var(--text-small-bold)}.screen-detail{background:var(--color-bg);flex:1;display:flex;flex-direction:column;position:relative;overflow-y:auto}.detail-image-wrap{position:relative;width:100%;height:340px;background:var(--color-surface);margin-top:-106px;padding-top:106px;box-sizing:border-box}.detail-image{width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat}.detail-stock-badge{position:absolute;top:118px;right:12px;padding:8px 12px;border-radius:var(--radius-full);background:var(--color-success-tint);color:var(--color-success-strong);font:var(--text-xsmall-bold);display:inline-flex;align-items:center;gap:8px}.detail-stock-dot{width:6px;height:6px;border-radius:50%;background:var(--color-success)}.detail-dots{position:absolute;bottom:16px;left:0;right:0;display:flex;gap:8px;justify-content:center}.detail-sheet{margin-top:-24px;background:var(--color-bg);border-top-left-radius:var(--radius-sheet);border-top-right-radius:var(--radius-sheet);padding:24px var(--screen-pad-x);position:relative;z-index:2;flex:1}.detail-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.detail-title{font:var(--text-medium-bold);color:var(--color-text);letter-spacing:-.01em;flex:1}.detail-fav{width:32px;height:32px;border-radius:50%;background:var(--color-surface);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s ease}.detail-fav-active{background:var(--color-danger-tint)}.detail-fav:hover{transform:scale(1.05)}.detail-rating{display:flex;align-items:center;gap:8px;margin-top:8px}.detail-rating-num{font:var(--text-small-bold);color:var(--color-text)}.detail-rating-count{font:var(--text-small-regular);color:var(--color-text-tertiary)}.detail-section{margin-top:16px}.detail-section-label{font:var(--text-normal-bold);color:var(--color-text)}.detail-color-name{font:var(--text-normal-regular);color:var(--color-text-secondary)}.detail-swatches{display:flex;gap:8px;margin-top:12px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.detail-swatches::-webkit-scrollbar{display:none}.detail-swatch{width:32px;height:32px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .15s ease}.detail-swatch:hover{transform:scale(1.05)}.detail-swatch-active{outline:2px solid var(--color-bg);outline-offset:-3px}.detail-brand{width:100%;display:flex;align-items:center;gap:12px;padding:12px;background:var(--color-surface);border-radius:var(--radius-md);border:none;cursor:pointer;margin-top:16px;text-align:left}.detail-brand-logo{width:30px;height:30px;border-radius:var(--radius-sm);background:var(--color-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.detail-brand-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.detail-brand-name{font:var(--text-xsmall-bold);color:var(--color-text);display:flex;align-items:center;gap:4px}.detail-brand-check{color:var(--color-primary);font-weight:700}.detail-brand-stats{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.btn-outline{display:inline-flex;align-items:center;justify-content:center;padding:7px 16px;border-radius:var(--radius-full);border:1px solid var(--color-primary);background:var(--color-bg);color:var(--color-primary);font:var(--text-xsmall-bold);cursor:pointer;gap:12px}.btn-outline:hover{background:var(--color-primary-tint)}.detail-desc{font:var(--text-small-regular);color:var(--color-text-secondary);margin-top:16px}.detail-read-more{background:none;border:none;color:var(--color-primary);font:var(--text-small-bold);cursor:pointer;padding:0;display:inline}.detail-bottom{position:sticky;bottom:0;background:var(--color-bg);border-top:1px solid var(--color-border);padding:12px var(--screen-pad-x) 20px;display:flex;flex-direction:column;gap:12px;z-index:5}.detail-amount-row{display:flex;align-items:center;justify-content:space-between}.detail-amount-label{font:var(--text-normal-bold);color:var(--color-text)}.detail-price-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.detail-total-label{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.detail-total-value{font:var(--text-large-bold);color:var(--color-text);margin-top:2px}.btn-cart{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);border:none;cursor:pointer;font:var(--text-small-bold);flex-shrink:0}.btn-cart:hover{background:var(--color-primary-hover)}.btn-cart:disabled{background:var(--color-border);color:var(--color-text-tertiary);cursor:not-allowed}.qty-stepper{display:inline-flex;align-items:center;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-bg);gap:4px}.qty-stepper-sm{width:70px;height:28px;padding:0 3px}.qty-stepper-md{width:86px;height:32px;padding:0 4px}.qty-stepper-lg{width:100px;height:40px;padding:0 6px}.qty-stepper-sm .qty-btn{width:20px;height:20px}.qty-stepper-md .qty-btn{width:24px;height:24px}.qty-stepper-lg .qty-btn{width:28px;height:28px}.qty-stepper-sm .qty-value{font:var(--text-xsmall-bold)}.qty-stepper-md .qty-value{font:var(--text-small-bold)}.qty-stepper-lg .qty-value{font:var(--text-normal-bold)}.qty-btn{border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.qty-btn-minus{background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-secondary)}.qty-btn-plus{background:var(--color-primary);color:var(--color-on-color)}.qty-value{flex:1;text-align:center;color:var(--color-text)}.detail-dots .dot{width:8px;height:8px;border-radius:50%;background:var(--color-overlay)}.detail-dots .dot-active{background:var(--color-primary);width:24px;border-radius:var(--radius-full)}.category-list{display:flex;flex-direction:column;gap:16px;margin-top:var(--space-24)}.category-card{width:100%;height:100px;background:var(--color-surface);border-radius:var(--radius-lg);display:flex;align-items:stretch;overflow:hidden;position:relative}.category-text{flex:0 0 50%;padding:24px 20px;display:flex;flex-direction:column;justify-content:center;gap:4px}.category-title{font:var(--text-normal-bold);color:var(--color-text);letter-spacing:-.01em}.category-count{font:var(--text-xsmall-regular);color:var(--color-text)}.category-image{flex:1;background-size:cover;background-position:center;background-repeat:no-repeat}.screen-cart{background:var(--color-bg);flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden;height:100%;min-height:0}.cart-scroll{flex:1;min-height:0;overflow-y:auto}.cart-scroll-with-sheet{padding-bottom:340px}.cart-item{display:flex;padding:16px var(--screen-pad-x);gap:12px;align-items:flex-start;position:relative}.cart-item:not(:last-child):after{content:"";position:absolute;left:var(--screen-pad-x);right:var(--screen-pad-x);bottom:0;height:1px;background:var(--color-border)}.cart-checkbox-col{display:flex;align-items:center;height:86px;flex-shrink:0}.cart-item-image{width:71px;height:86px;border-radius:var(--radius-md);background-size:cover;background-position:center;background-color:var(--color-surface);flex-shrink:0}.cart-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.cart-item-title{font:var(--text-normal-bold);color:var(--color-text);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cart-item-color{font:var(--text-small-regular)}.cart-color-label{color:var(--color-text-tertiary)}.cart-color-value{color:var(--color-text)}.cart-item-price{font:var(--text-small-bold);color:var(--color-text);white-space:nowrap}.cart-price-currency{font:var(--text-small-bold);color:var(--color-text);margin-right:2px}.cart-stepper-row{display:flex;align-items:center;justify-content:space-between;margin-top:4px}.cart-bottom-sheet{position:absolute;bottom:0;left:0;right:0;background:var(--color-surface);border-top-left-radius:var(--radius-sheet);border-top-right-radius:var(--radius-sheet);padding:8px var(--screen-pad-x) 16px;box-shadow:0 -8px 24px #00000014;display:flex;flex-direction:column;gap:12px;z-index:10}.sheet-handle{width:36px;height:4px;border-radius:var(--radius-full);background:var(--color-border);align-self:center;margin-bottom:8px}.cart-promo-row{width:100%;display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--color-surface);border-radius:var(--radius-full);border:1px dashed var(--color-border);cursor:pointer;text-align:left}.cart-promo-placeholder{flex:1;font:var(--text-small-regular);color:var(--color-text-tertiary)}.cart-totals{display:flex;flex-direction:column;gap:8px}.cart-total-row{display:flex;align-items:center;justify-content:space-between}.cart-total-label{font:var(--text-small-bold);color:var(--color-text-tertiary)}.cart-total-value{font:var(--text-normal-bold);color:var(--color-text)}.cart-total-final{font:var(--text-small-bold);color:var(--color-text-tertiary)}.cart-total-final.cart-total-value{font:var(--text-normal-bold);color:var(--color-text)}.cart-dashed-divider{border-top:1px dashed var(--color-border);margin:4px 0}.btn-checkout{width:100%;height:48px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);border:none;cursor:pointer;font:var(--text-normal-bold)}.btn-checkout:hover{background:var(--color-primary-hover)}.home-search{margin:16px 0 0;height:48px;border:1px solid var(--color-border);border-radius:var(--radius-input);padding:0 16px;display:flex;align-items:center;gap:12px;background:var(--color-bg);cursor:text}.home-search-placeholder{font:var(--text-small-regular);color:var(--color-text-tertiary)}.ds-color-swatch-pair{display:flex;width:100%;height:60px;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--color-border)}.ds-color-swatch-pair .ds-color-swatch{flex:1;height:100%;border-radius:0;position:relative}.ds-color-theme-hex{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);display:flex;align-items:center;gap:8px}.ds-theme-label{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--color-surface);color:var(--color-text);font:var(--text-xsmall-bold);font-weight:700}.setting-row{display:flex;align-items:center;width:100%;height:48px;border:1px solid var(--color-border);border-radius:var(--radius-input);padding:0 16px;background:var(--color-bg);gap:12px;cursor:pointer;text-align:left}.setting-row:hover{background:var(--color-surface)}.setting-row-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.setting-row-title{font:var(--text-small-bold);color:var(--color-text);flex:1}.setting-row-value{font:var(--text-small-regular);color:var(--color-text-tertiary)}.setting-row-danger .setting-row-title{color:var(--color-danger)}.bottom-sheet{position:absolute;bottom:0;left:0;right:0;background:var(--color-surface);border-top-left-radius:var(--radius-sheet);border-top-right-radius:var(--radius-sheet);padding:20px var(--screen-pad-x) 24px;z-index:10;display:flex;flex-direction:column;gap:16px}.sheet-title{font:var(--text-medium-bold);color:var(--color-text);text-align:center}.sheet-content{display:flex;flex-direction:column;gap:12px}.modal-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:100;display:flex;align-items:center;justify-content:center;padding:24px var(--screen-pad-x)}.modal-card{position:relative;background:var(--color-surface);border-radius:var(--radius-xl);padding:16px var(--screen-pad-x) 24px;width:100%;max-width:320px;box-shadow:0 20px 60px #00000040;display:flex;flex-direction:column;gap:24px}.modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%}.modal-close:hover{background:var(--color-surface)}.accordion-item{border-bottom:1px solid var(--color-border);padding:16px 0}.accordion-header{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;cursor:pointer;padding:0;text-align:left}.accordion-title{font:var(--text-small-bold);color:var(--color-text)}.accordion-body{font:var(--text-small-regular);color:var(--color-text-secondary);margin-top:12px}.screen-account{background:var(--color-bg);flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden;height:100%;min-height:0}.account-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:20px 0 var(--space-24);display:flex;flex-direction:column;gap:24px}.account-profile{display:flex;gap:16px;padding:0 var(--screen-pad-x);align-items:center}.account-avatar{width:60px;height:60px;border-radius:50%;background-image:url(/react-native-course/design/images/avatars/jonathan.jpg);background-size:cover;background-position:center;flex-shrink:0}.account-profile-info{display:flex;flex-direction:column;gap:2px}.account-name{font:var(--text-normal-bold);color:var(--color-text)}.account-email{font:var(--text-small-regular);color:var(--color-text-tertiary)}.account-section{padding:0 var(--screen-pad-x);display:flex;flex-direction:column;gap:16px}.account-section-title{font:var(--text-medium-bold);color:var(--color-text)}.account-rows{display:flex;flex-direction:column;gap:16px}.account-form{padding:0 var(--screen-pad-x);display:flex;flex-direction:column;gap:16px}.account-form-actions{padding:0 var(--screen-pad-x);margin-top:16px}.btn-save{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);border:none;cursor:pointer;font:var(--text-normal-bold)}.btn-save:hover{background:var(--color-primary-hover)}.avatar-uploader{width:120px;height:120px;border-radius:50%;position:relative;margin:0 auto;flex-shrink:0}.avatar-uploader-img{width:100%;height:100%;border-radius:50%;background-image:url(/react-native-course/design/images/avatars/jonathan.jpg);background-size:cover;background-position:center}.avatar-camera-btn{position:absolute;bottom:0;right:0;width:36px;height:36px;border-radius:50%;background:var(--color-primary);border:3px solid var(--color-bg);cursor:pointer;display:flex;align-items:center;justify-content:center}.account-dimmed{opacity:.6}.sheet-option{display:flex;align-items:center;gap:12px;padding:12px 0;width:100%;background:none;border:none;cursor:pointer;text-align:left}.sheet-option-label{font:var(--text-normal-bold);color:var(--color-text)}.sheet-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0}.sheet-toggle-label{font:var(--text-normal-bold);color:var(--color-text)}.theme-picker{display:flex;gap:12px;justify-content:space-between}.theme-card{display:flex;flex-direction:column;align-items:center;gap:12px;flex:1;background:none;border:none;cursor:pointer;padding:0}.theme-preview{width:72px;height:141px;border-radius:10px;overflow:hidden;border:1px solid var(--color-border)}.theme-card-radio{display:flex;align-items:center;gap:8px}.theme-card-label{font:var(--text-small-bold);color:var(--color-text)}.help-scroll{gap:20px;padding-top:20px;padding-bottom:24px}.help-search{margin:0 24px;height:48px;border:1px solid var(--color-border);border-radius:var(--radius-full);padding:0 16px;background:var(--color-bg);display:flex;align-items:center;gap:12px}.help-search-placeholder{font:var(--text-small-regular);color:var(--color-text-tertiary)}.help-accordion{padding:0 var(--screen-pad-x)}.legal-scroll{gap:16px;padding-top:20px;padding-left:var(--screen-pad-x);padding-right:var(--screen-pad-x);padding-bottom:24px}.legal-section-title{font:var(--text-medium-bold);color:var(--color-text);margin-top:8px}.legal-body{font:var(--text-small-regular);color:var(--color-text-secondary);line-height:1.6}.dialog-title{font:var(--text-medium-bold);color:var(--color-text);text-align:center;margin:24px 0 0}.dialog-btn-primary{width:100%;height:52px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);border:none;cursor:pointer;font:var(--text-normal-bold)}.dialog-btn-primary:hover{background:var(--color-primary-hover)}.dialog-btn-danger-link{background:none;border:none;color:var(--color-danger);font:var(--text-normal-bold);cursor:pointer;padding:8px;text-align:center}.address-scroll{padding-top:20px;padding-left:var(--screen-pad-x);padding-right:var(--screen-pad-x);padding-bottom:24px;gap:16px}.info-card{width:100%;height:96px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg);padding:16px;display:flex;gap:12px;align-items:center;cursor:pointer;text-align:left;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;font-family:inherit;font-size:inherit}.info-card:focus{outline:none}.info-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.info-card.info-card--selected,.info-card.info-card--selected:focus-visible{border:1px solid var(--color-primary);outline:none}.info-card-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.info-card-title{font:var(--text-small-bold);color:var(--color-text)}.info-card-subtitle{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.info-card-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}.info-card-circle{width:45px;height:45px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center}.info-card-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:var(--radius-full);font:var(--text-xsmall-bold);white-space:nowrap}.dropdown-field{display:flex;flex-direction:column;gap:12px}.dropdown-label{font:var(--text-normal-bold);color:var(--color-text)}.dropdown-input{display:flex;align-items:center;height:48px;padding:0 16px;gap:12px;border:1px solid var(--color-border);border-radius:var(--radius-input);background:var(--color-bg);cursor:pointer;text-align:left}.dropdown-input:hover,.dropdown-input.has-value{border-color:var(--color-text-tertiary)}.dropdown-value{flex:1;font:var(--text-small-regular);color:var(--color-text)}.dropdown-value.is-placeholder{color:var(--color-text-tertiary)}.dropdown-option{display:flex;align-items:center;justify-content:space-between;padding:12px 0;width:100%;background:none;border:none;cursor:pointer;font:var(--text-normal-bold);color:var(--color-text);text-align:left}.dropdown-option:hover,.dropdown-option.is-selected{color:var(--color-primary)}.cart-scroll-with-tabs{padding-bottom:0}.notification-scroll{padding-top:20px;padding-left:var(--screen-pad-x);padding-right:var(--screen-pad-x);padding-bottom:24px;gap:16px}.notification-section-title{font:var(--text-medium-bold);color:var(--color-text);margin-top:4px}.notification-list{display:flex;flex-direction:column}.notification-row{display:flex;gap:12px;padding:16px 0;border-bottom:1px solid var(--color-border);align-items:flex-start}.notification-row:last-child{border-bottom:none}.notification-icon{width:48px;height:48px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center;flex-shrink:0}.notification-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}.notification-row-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.notification-title{font:var(--text-normal-bold);color:var(--color-text)}.notification-time{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);white-space:nowrap}.notification-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);line-height:1.5}.home-action-icon+.home-action-icon{margin-left:12px}.cl-page .ds-section-title{margin-bottom:12px}.cl-group-title{font:var(--text-medium-bold);color:var(--color-text);margin:40px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}.cl-group-title:first-of-type{margin-top:32px}.cl-block{margin-bottom:28px}.cl-block-head{margin-bottom:12px}.cl-block-title{font:var(--text-normal-bold);color:var(--color-text);margin:0 0 4px}.cl-block-desc{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin:0}.cl-block-body{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;max-width:600px}.cl-preview-frame{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;position:relative}.cl-bottom-tabs-static{position:relative!important;width:100%}.cl-segment-tabs{background:var(--color-bg);border-radius:var(--radius-md);padding:0 12px}.cl-accordion-wrap{background:var(--color-bg);border-radius:var(--radius-md);padding:0 16px}.cl-stepper-row{display:flex;gap:32px;align-items:flex-end;flex-wrap:wrap}.cl-stepper-item{display:flex;flex-direction:column;align-items:center;gap:8px}.cl-size-label{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);font-family:var(--font-roman)}.cl-setting-stack,.cl-stack{display:flex;flex-direction:column;gap:16px;background:var(--color-bg);padding:16px;border-radius:var(--radius-md)}.cl-theme-picker{background:var(--color-bg);padding:16px;border-radius:var(--radius-md)}.cl-sheet-preview{background:var(--color-surface-raised);border-radius:var(--radius-md);padding:80px 0 0;overflow:hidden}.cl-sheet-static{background:var(--color-bg);border-top-left-radius:var(--radius-sheet);border-top-right-radius:var(--radius-sheet);padding:20px var(--screen-pad-x) 24px;display:flex;flex-direction:column;gap:16px}.cl-sheet-body-stub{padding:24px 0;text-align:center;font:var(--text-small-regular);color:var(--color-text-tertiary);border:1px dashed var(--color-border);border-radius:var(--radius-md)}.cl-modal-preview{background:var(--color-overlay);padding:32px;border-radius:var(--radius-md);display:flex;justify-content:center}.cl-modal-static{position:relative;background:var(--color-bg);border-radius:var(--radius-xl);padding:32px var(--screen-pad-x) 24px;width:100%;max-width:320px;box-shadow:0 20px 60px #00000040;display:flex;flex-direction:column;gap:16px}.cl-search-static{margin:0}.cl-toasts{grid-template-columns:1fr 1fr}.radio{width:20px;height:20px;border-radius:50%;background:var(--color-bg);border:1.5px solid var(--color-border);display:inline-flex;align-items:center;justify-content:center}.radio.fc-selected{border-color:var(--color-primary)}.radio.fc-selected .radio-dot{width:10px;height:10px;border-radius:50%;background:var(--color-primary)}.cl-avatar-row{display:flex;gap:32px;align-items:flex-end;flex-wrap:wrap}.cl-avatar-item{display:flex;flex-direction:column;align-items:center;gap:8px}.cl-avatar{border-radius:50%;background-image:url(/react-native-course/design/images/avatars/jonathan.jpg);background-size:cover;background-position:center;flex-shrink:0}.cl-avatar-sm{width:44px;height:44px}.cl-avatar-md{width:60px;height:60px}.cl-avatar-lg{width:120px;height:120px}.cl-info{margin-top:12px;padding:16px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:12px;max-width:600px}.cl-info-row{display:flex;align-items:flex-start;gap:12px;font:var(--text-xsmall-regular)}.cl-info-label{flex:0 0 80px;font:var(--text-xsmall-bold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em}.cl-info-cases{display:flex;flex-wrap:wrap;gap:8px;flex:1}.cl-info-case,.cl-info-code{font-family:var(--font-roman);font-size:11px;padding:2px 8px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text)}.cl-info-code{color:var(--color-primary)}.cl-btn-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.cl-btn-sample{width:auto!important;padding-left:24px;padding-right:24px;height:44px!important}.cart-sheet-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--color-overlay);z-index:8;pointer-events:none}.screen-empty{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 var(--screen-pad-x);gap:12px;text-align:center}.empty-halo{width:128px;height:128px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:12px}.empty-inner{width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--color-on-color)}.empty-inner.is-spinning{animation:empty-spin 1.2s linear infinite}@keyframes empty-spin{to{transform:rotate(360deg)}}.empty-title{font:var(--text-large-bold);color:var(--color-text);text-align:center;margin:0}.empty-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);text-align:center;max-width:280px;margin:0}.empty-action{width:100%;margin-top:16px}.empty-btn-primary{width:100%;height:48px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.empty-btn-primary:hover{background:var(--color-primary-hover)}.empty-btn-outline{width:100%;height:48px;border-radius:var(--radius-button);background:var(--color-bg);border:1.5px solid var(--color-primary);color:var(--color-primary);font:var(--text-normal-bold);cursor:pointer}.empty-btn-outline:hover{background:var(--color-primary-tint)}.screen-checkout{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0;position:relative}.checkout-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 110px}.checkout-section-header,.checkout-section-header-simple{display:flex;justify-content:space-between;align-items:center;margin-top:24px;margin-bottom:12px}.checkout-section-header:first-of-type,.checkout-section-header-simple:first-of-type{margin-top:0}.checkout-section-title{font:var(--text-medium-bold);color:var(--color-text)}.checkout-change-link{color:var(--color-primary);font:var(--text-small-bold);background:none;border:none;cursor:pointer;padding:0}.checkout-address-card,.checkout-payment-card{padding:16px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg);display:flex;gap:12px;align-items:flex-start}.checkout-payment-card{align-items:center}.checkout-address-icon{width:56px;height:56px;border-radius:50%;background:var(--color-success-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}.checkout-payment-icon{width:44px;height:44px;border-radius:50%;background:var(--color-primary-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}.checkout-address-info,.checkout-payment-info{flex:1;min-width:0}.checkout-address-pill{padding:3px 12px;border-radius:var(--radius-full);background:var(--color-success-tint);color:var(--color-success-strong);font:var(--text-xsmall-bold);display:inline-block}.checkout-address-name{font:var(--text-small-bold);color:var(--color-text);margin-top:8px}.checkout-address-text{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:4px}.checkout-payment-pan{font:var(--text-small-bold);color:var(--color-text)}.checkout-payment-meta{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:2px}.checkout-summary-list{display:flex;flex-direction:column;gap:12px}.checkout-summary-item{padding:12px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg);display:flex;gap:12px;align-items:center}.checkout-summary-thumb{width:52px;height:52px;border-radius:var(--radius-md);background-color:var(--color-surface-raised);background-size:cover;background-position:center;flex-shrink:0}.checkout-summary-info{flex:1;min-width:0}.checkout-summary-title{font:var(--text-small-bold);color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.checkout-summary-meta{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:2px}.checkout-summary-price{font:var(--text-small-bold);color:var(--color-text);flex-shrink:0}.checkout-totals{margin-top:8px;padding-top:16px;border-top:1px solid var(--color-border)}.checkout-total-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.checkout-total-label{font:var(--text-small-regular);color:var(--color-text-tertiary)}.checkout-total-value{font:var(--text-small-bold);color:var(--color-text)}.checkout-total-divider{height:1px;background:var(--color-border);margin:12px 0}.checkout-total-grand{padding:0}.checkout-grand-label{font:var(--text-medium-bold);color:var(--color-text)}.checkout-grand-value{font:var(--text-large-bold);color:var(--color-primary)}.checkout-cta-bar{position:absolute;bottom:0;left:0;right:0;background:var(--color-bg);border-top:1px solid var(--color-border);padding:16px var(--screen-pad-x) 21px}.checkout-place-order-btn{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.checkout-place-order-btn:hover{background:var(--color-primary-hover)}.checkout-dim-placeholder{padding:4px 0}.screen-add-card{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0;position:relative}.add-card-scroll{flex:1;min-height:0;overflow-y:auto;padding:24px var(--screen-pad-x) 110px;display:flex;flex-direction:column;gap:16px}.add-card-row{display:flex;gap:12px}.add-card-col{flex:1}.add-card-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;margin-top:8px}.add-card-toggle-label{font:var(--text-small-bold);color:var(--color-text)}.add-card-cta-bar{position:absolute;bottom:0;left:0;right:0;background:var(--color-bg);padding:16px var(--screen-pad-x) 21px}.add-card-save-btn{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.add-card-save-btn:hover{background:var(--color-primary-hover)}.sheet-payment-row{display:flex;align-items:center;gap:12px;padding:0;background:none;border:none;width:100%;text-align:left;cursor:pointer}.sheet-payment-brand{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sheet-payment-info{flex:1;min-width:0}.sheet-payment-pan{font:var(--text-small-bold);color:var(--color-text)}.sheet-payment-meta{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:2px}.sheet-payment-add{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;margin-top:8px;border-radius:var(--radius-lg);border:1.5px dashed var(--color-border);background:var(--color-bg);color:var(--color-primary);font:var(--text-small-bold);cursor:pointer}.sheet-payment-add:hover{background:var(--color-primary-tint);border-color:var(--color-primary)}.screen-stores,.screen-stores-empty{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.stores-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px;display:flex;flex-direction:column;gap:12px}.store-row{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--color-surface);border-radius:var(--radius-md)}.store-logo{width:44px;height:44px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}.store-info{flex:1;min-width:0}.store-name{font:var(--text-small-bold);color:var(--color-text);display:flex;align-items:center;gap:4px}.store-check{color:var(--color-primary);font-size:12px}.store-stats{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:2px}.store-following-btn{padding:7px 16px;border-radius:var(--radius-full);background:var(--color-primary);color:var(--color-on-color);font:var(--text-xsmall-bold);border:none;cursor:pointer;flex-shrink:0}.store-following-btn:hover{background:var(--color-primary-hover)}.screen-store-detail{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.store-detail-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px}.store-hero-chip{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--color-surface);border-radius:var(--radius-md)}.store-hero-logo{width:44px;height:44px;border-radius:var(--radius-sm);background:var(--color-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.store-hero-info{flex:1;min-width:0}.store-hero-name{font:var(--text-small-bold);color:var(--color-text);display:flex;align-items:center;gap:4px}.store-hero-stats{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:2px}.store-carousel{margin-top:16px;position:relative}.store-carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:12px}.store-carousel-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-text-tertiary);border:none;cursor:pointer;transition:width .2s ease;padding:0}.store-carousel-dot.is-active{width:20px;background:var(--color-primary)}.store-products-header{display:flex;justify-content:space-between;align-items:center;margin-top:16px;margin-bottom:12px}.store-products-title{font:var(--text-medium-bold);color:var(--color-text)}.store-see-all{color:var(--color-primary);font:var(--text-small-bold);background:none;border:none;cursor:pointer;padding:0}.success-order-details{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:-12px}.success-order-num{font:var(--text-small-bold);color:var(--color-text)}.success-delivery{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.success-track-card{width:100%;height:64px;padding:0 16px;border-radius:var(--radius-button);background:var(--color-bg);border:1.5px solid var(--color-primary);display:flex;gap:12px;align-items:center;cursor:pointer;text-align:left}.success-track-card:hover{background:var(--color-primary-tint)}.success-track-icon{width:32px;height:32px;border-radius:50%;background:var(--color-primary-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}.success-track-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.success-track-title{font:var(--text-small-bold);color:var(--color-text)}.success-track-desc{font:var(--text-xsmall-regular);color:var(--color-text-secondary)}.success-cta-bar{padding:0 var(--screen-pad-x) 24px;display:flex;flex-direction:column;align-items:center;gap:12px;flex-shrink:0}.success-continue-btn{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.success-continue-btn:hover{background:var(--color-primary-hover)}.success-orders-link{background:none;border:none;color:var(--color-primary);font:var(--text-small-bold);cursor:pointer;padding:8px}.screen-orders{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.orders-tabs{display:flex;padding:0 var(--screen-pad-x);border-bottom:1px solid var(--color-border);flex-shrink:0}.orders-tab{flex:1;padding:8px 0;text-align:center;font:var(--text-small-bold);color:var(--color-text-tertiary);cursor:pointer;position:relative;background:none;border:none}.orders-tab.orders-tab-active{color:var(--color-text)}.orders-tab.orders-tab-active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--color-primary)}.orders-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px;display:flex;flex-direction:column;gap:12px}.order-card{padding:12px;border-radius:var(--radius-lg);background:var(--color-bg);border:1px solid var(--color-border);display:flex;flex-direction:column}.order-card-actions{display:flex;gap:12px}.order-card-btn{flex:1;height:40px;border-radius:var(--radius-button);font:var(--text-small-bold);cursor:pointer}.order-card-btn-outline{background:transparent;border:1px solid var(--color-border);color:var(--color-text)}.order-card-btn-outline:hover{background:var(--color-surface)}.order-card-btn-primary{background:var(--color-primary);border:none;color:var(--color-on-color)}.order-card-btn-primary:hover{background:var(--color-primary-hover)}.order-item-thumb{width:64px;height:64px;border-radius:var(--radius-md);background-size:cover;background-position:center;background-color:var(--color-surface-raised);flex-shrink:0}.order-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.order-item-title{font:var(--text-small-bold);color:var(--color-text)}.order-item-store{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.screen-tracking{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.tracking-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px}.tracking-item-card{display:flex;gap:12px;padding:12px;border-radius:var(--radius-lg);background:var(--color-surface);align-items:center}.tracking-eta-banner{padding:12px;border-radius:var(--radius-lg);background:var(--color-primary-tint);border:1px solid var(--color-primary-mid);display:flex;gap:12px;align-items:center;margin-top:16px}.tracking-eta-icon{width:40px;height:40px;border-radius:50%;background:var(--color-bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.tracking-eta-text{flex:1;display:flex;flex-direction:column;gap:2px}.tracking-eta-title{font:var(--text-small-bold);color:var(--color-text)}.tracking-eta-sub{font:var(--text-xsmall-regular);color:var(--color-primary-active)}.tracking-timeline{margin-top:24px;padding:16px 0;position:relative}.timeline-step{display:flex;gap:12px;position:relative;padding-bottom:24px}.timeline-step.is-last{padding-bottom:0}.timeline-step:not(.is-last):before{content:"";position:absolute;left:11px;top:22px;bottom:0;width:2px;background:var(--color-border)}.timeline-step.timeline-step-done:not(.is-last):before{background:var(--color-success)}.timeline-dot{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;z-index:1}.timeline-step-done .timeline-dot{background:var(--color-success)}.timeline-step-pending .timeline-dot{background:var(--color-bg);border:2px solid var(--color-border)}.timeline-step-current .timeline-dot{width:28px;height:28px;background:var(--color-primary);margin-left:-3px}.timeline-dot-inner{width:10px;height:10px;border-radius:50%;background:var(--color-on-color)}.timeline-content{flex:1;display:flex;flex-direction:column;gap:4px;padding-top:1px}.timeline-row{display:flex;align-items:center;gap:8px}.timeline-label{font:var(--text-small-bold);color:var(--color-text)}.timeline-label-pending{color:var(--color-text-tertiary)}.timeline-current-pill{padding:2px 8px;border-radius:var(--radius-full);background:var(--color-primary-tint);color:var(--color-primary-active);font:var(--text-xsmall-bold)}.timeline-timestamp{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.timeline-timestamp-current{color:var(--color-primary-active)}.screen-order-details{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0}.order-details-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px var(--screen-pad-x) 24px;display:flex;flex-direction:column;gap:8px}.od-hero-card{padding:12px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg);display:flex;gap:12px}.od-hero-image{width:112px;height:112px;border-radius:var(--radius-md);background-size:cover;background-position:center;background-color:var(--color-surface-raised);flex-shrink:0}.od-hero-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.od-hero-title{font:var(--text-medium-bold);color:var(--color-text)}.od-hero-meta{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.od-hero-price{font:var(--text-large-bold);color:var(--color-text);margin-top:auto}.od-section-title{font:var(--text-small-bold);color:var(--color-text);margin-top:16px;margin-bottom:4px}.od-info-card,.od-address-card,.od-payment-card,.od-summary-card{padding:12px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg)}.od-info-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.od-info-label{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.od-info-value{font:var(--text-small-bold);color:var(--color-text)}.od-info-divider{height:1px;background:var(--color-surface-raised)}.od-info-pill,.order-card-pill{padding:3px 12px;border-radius:var(--radius-full);font:var(--text-xsmall-bold);background:transparent;white-space:nowrap}.od-address-card{display:flex;gap:12px;align-items:center}.od-address-icon{width:40px;height:40px;border-radius:50%;background:var(--color-success-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}.od-address-info{flex:1;display:flex;flex-direction:column;gap:2px}.od-address-name{font:var(--text-small-bold);color:var(--color-text)}.od-address-line{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.od-payment-card{display:flex;gap:12px;align-items:center}.od-payment-logo{width:32px;height:22px;border-radius:4px;background:var(--color-primary-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}.od-payment-text{font:var(--text-small-bold);color:var(--color-text)}.od-summary-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.od-summary-label{font:var(--text-small-regular);color:var(--color-text-tertiary)}.od-summary-value{font:var(--text-small-bold);color:var(--color-text)}.od-summary-divider{height:1px;background:var(--color-border);margin:8px 0}.od-summary-total-label{font:var(--text-medium-bold);color:var(--color-text)}.od-summary-total{font:var(--text-large-bold);color:var(--color-primary)}.od-cta-bar{padding:20px var(--screen-pad-x) 24px;background:var(--color-bg);border-top:1px solid var(--color-border);flex-shrink:0}.od-track-btn{width:100%;height:48px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.od-track-btn:hover{background:var(--color-primary-hover)}.i18n-page{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;padding:32px}.i18n-header{flex-shrink:0;margin-bottom:20px}.i18n-title{font:var(--text-large-bold);color:var(--color-text);margin:0 0 4px}.i18n-subtitle{font:var(--text-small-regular);color:var(--color-text-tertiary);margin:0 0 12px;max-width:720px}.i18n-stats{display:flex;gap:12px}.i18n-stat{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);padding:8px 12px;border-radius:var(--radius-md);background:var(--color-surface)}.i18n-stat strong{color:var(--color-text);font:var(--text-xsmall-bold)}.i18n-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg)}.i18n-table{width:100%;border-collapse:collapse;font:var(--text-xsmall-regular)}.i18n-table thead{position:sticky;top:0;background:var(--color-surface);z-index:1}.i18n-table th{text-align:left;padding:12px 16px;font:var(--text-small-bold);color:var(--color-text);border-bottom:1px solid var(--color-border);white-space:nowrap}.i18n-table td{padding:12px 16px;border-bottom:1px solid var(--color-surface-raised);color:var(--color-text);vertical-align:top}.i18n-table tr:last-child td{border-bottom:none}.i18n-table tr:hover td{background:var(--color-surface)}.i18n-col-key{width:28%}.i18n-col-en,.i18n-col-ar{width:36%}.i18n-key{font-family:var(--font-roman);color:var(--color-primary);font-size:11px}.i18n-en{color:var(--color-text)}.i18n-ar{color:var(--color-text);text-align:right}.i18n-row-missing td{background:var(--color-danger-tint)!important}.i18n-row-missing .i18n-ar{color:var(--color-danger);font:var(--text-xsmall-bold)}.order-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.order-card-num-block{display:flex;flex-direction:column;gap:0}.order-card-num-label{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.order-card-num{font:var(--text-small-bold);color:var(--color-text)}.order-card-divider{height:1px;background:var(--color-surface-raised);margin-bottom:12px}.order-card-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.order-card-summary-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.order-card-first-title{font:var(--text-small-bold);color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.order-card-count{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.order-card-thumbs{display:flex;align-items:center;flex-shrink:0}.order-card-thumb{width:28px;height:28px;border-radius:50%;border:2px solid var(--color-bg);background-size:cover;background-position:center;background-color:var(--color-surface-raised)}.order-card-thumb-extra{width:28px;height:28px;border-radius:50%;border:2px solid var(--color-bg);background:var(--color-surface-raised);color:var(--color-text);font:var(--text-xsmall-bold);display:flex;align-items:center;justify-content:center}.order-card-total-row{display:flex;justify-content:space-between;align-items:center;padding-top:12px;padding-bottom:12px;border-top:1px solid var(--color-surface-raised)}.order-card-total-label{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.order-card-total{font:var(--text-medium-bold);color:var(--color-primary)}.od-items-list{display:flex;flex-direction:column;gap:8px}.od-item-row{padding:12px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg);display:flex;gap:12px;align-items:center}.od-item-image{width:60px;height:60px;border-radius:var(--radius-md);background-size:cover;background-position:center;background-color:var(--color-surface-raised);flex-shrink:0}.od-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.od-item-title{font:var(--text-small-bold);color:var(--color-text)}.od-item-meta{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.od-item-price{font:var(--text-small-bold);color:var(--color-text);flex-shrink:0}.screen-search{flex:1;display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;height:100%;min-height:0;position:relative}.search-input-row{display:flex;gap:12px;padding:16px var(--screen-pad-x) 8px;align-items:center;flex-shrink:0}.search-field{flex:1;height:44px;border-radius:var(--radius-input);border:1px solid var(--color-border);background:var(--color-bg);padding:0 12px;display:flex;gap:12px;align-items:center}.search-input{flex:1;min-width:0;border:none;outline:none;background:transparent;font:var(--text-small-regular);color:var(--color-text)}.search-input::placeholder{color:var(--color-text-tertiary)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.search-filter-btn{width:44px;height:44px;border-radius:var(--radius-button);background:var(--color-primary);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.search-filter-btn:hover{background:var(--color-primary-hover)}.search-results-count{padding:0 var(--screen-pad-x);margin-bottom:12px;font:var(--text-xsmall-regular);color:var(--color-text-tertiary);flex-shrink:0}.search-results-count strong{color:var(--color-text);font:var(--text-xsmall-bold)}.search-scroll{flex:1;min-height:0;overflow-y:auto;padding:0 var(--screen-pad-x) 24px}.sheet-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:9}.filter-sheet{position:absolute;bottom:0;left:0;right:0;background:var(--color-bg);border-top-left-radius:var(--radius-sheet);border-top-right-radius:var(--radius-sheet);padding:20px var(--screen-pad-x) 24px;z-index:10;display:flex;flex-direction:column;gap:16px}.filter-sheet-header{display:flex;justify-content:space-between;align-items:center}.filter-sheet-title{font:var(--text-medium-bold);color:var(--color-text)}.filter-sheet-reset{background:none;border:none;color:var(--color-primary);font:var(--text-small-bold);cursor:pointer;padding:0}.filter-sheet-content{display:flex;flex-direction:column;gap:16px;max-height:460px;overflow-y:auto}.filter-section{display:flex;flex-direction:column;gap:8px}.filter-section-title{font:var(--text-small-bold);color:var(--color-text)}.filter-price-display{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.filter-slider{position:relative;height:24px;display:flex;align-items:center;margin-top:4px}.filter-slider-track{position:absolute;left:0;right:0;height:4px;background:var(--color-border);border-radius:2px}.filter-slider-fill{position:absolute;left:15%;right:25%;height:4px;background:var(--color-primary);border-radius:2px}.filter-slider-thumb{position:absolute;top:50%;width:20px;height:20px;border-radius:50%;background:var(--color-bg);border:2px solid var(--color-primary);transform:translate(-50%,-50%)}.filter-chips{display:flex;flex-wrap:wrap;gap:8px}.filter-chip{padding:8px 12px;border-radius:var(--radius-button);background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text);font:var(--text-xsmall-bold);cursor:pointer}.filter-chip.is-active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-color)}.filter-colors{display:flex;flex-wrap:wrap;gap:12px}.filter-color{width:32px;height:32px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.filter-color.is-active{outline:2px solid var(--color-primary);outline-offset:2px}.filter-apply-btn{width:100%;height:48px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.filter-apply-btn:hover{background:var(--color-primary-hover)}.address-cta-bar{padding:20px var(--screen-pad-x) 24px;background:var(--color-bg);border-top:1px solid var(--color-border);flex-shrink:0}.cl-product-grid,.cl-feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.cl-feedback-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid var(--color-border);border-radius:var(--radius-md)}.cl-feedback-label{font:var(--text-small-bold);color:var(--color-text)}.gl-rule{padding:20px;border:1px solid var(--color-border);border-radius:var(--radius-md);margin-top:16px;background:var(--color-bg)}.gl-rule-warning{border-color:var(--color-danger);background:var(--color-danger-tint)}.gl-rule-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.gl-rule-num{width:28px;height:28px;border-radius:50%;background:var(--color-primary);color:var(--color-on-color);font:var(--text-xsmall-bold);display:flex;align-items:center;justify-content:center}.gl-rule-title{font:var(--text-medium-bold);color:var(--color-text);margin:0}.gl-rule-desc{font:var(--text-small-regular);color:var(--color-text-secondary);line-height:1.55;margin:0 0 12px}.gl-rule-desc code{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--color-surface);padding:2px 8px;border-radius:4px;color:var(--color-primary)}.gl-rule-desc strong{color:var(--color-text);font-weight:700}.gl-visual{margin:14px 0}.gl-phone-mini{display:flex;align-items:center;border:1.5px dashed var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);height:88px}.gl-phone-pad-left,.gl-phone-pad-right{background:var(--color-primary-tint);color:var(--color-primary-active);font:var(--text-xsmall-bold);height:100%;display:flex;align-items:center;justify-content:center;width:48px}.gl-phone-content{flex:1;display:flex;align-items:center;justify-content:center;font:var(--text-small-regular);color:var(--color-text-tertiary)}.gl-code{display:inline-block;font:12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--color-surface);padding:8px 12px;border-radius:6px;color:var(--color-primary);margin-top:8px}.gl-stack{display:flex;flex-direction:column;gap:8px;margin:12px 0}.gl-stack-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gl-token-pill{padding:4px 12px;border-radius:var(--radius-full);background:var(--color-surface);font:var(--text-xsmall-bold);color:var(--color-text)}.gl-stack-gap{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.gl-platform-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:12px 0}.gl-platform-card{padding:12px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);display:flex;flex-direction:column;gap:8px}.gl-platform-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:var(--text-xsmall-bold)}.gl-platform-name{font:var(--text-small-bold);color:var(--color-text)}.gl-platform-value{font:var(--text-medium-bold);color:var(--color-primary)}.gl-platform-detail{font:var(--text-xsmall-regular);color:var(--color-text-tertiary);line-height:1.4}.gl-code-block{background:var(--color-surface);border-radius:var(--radius-md);padding:12px;margin-top:12px}.gl-code-label{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);margin-bottom:8px}.gl-code-pre{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-text);margin:0;white-space:pre-wrap;line-height:1.5}.gl-table{display:grid;border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;margin-top:8px}.gl-table-row{display:grid;grid-template-columns:1.2fr .8fr 2fr;padding:12px;border-bottom:1px solid var(--color-surface-raised);font:var(--text-small-regular);color:var(--color-text);gap:12px}.gl-table-row:last-child{border-bottom:none}.gl-table-head{background:var(--color-surface);font:var(--text-xsmall-bold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.gl-table-row strong{color:var(--color-primary)}.gl-pattern-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:8px}.gl-pattern-card{padding:12px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.gl-pattern-icon{font-size:24px;color:var(--color-primary);margin-bottom:8px}.gl-pattern-name{font:var(--text-small-bold);color:var(--color-text);margin-bottom:8px}.gl-pattern-detail{font:var(--text-xsmall-regular);color:var(--color-text-secondary);line-height:1.55}.gl-pattern-detail code{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--color-bg);padding:1px 5px;border-radius:4px;color:var(--color-primary)}.gl-anti-list{margin:0;padding-left:20px}.gl-anti-list li{font:var(--text-small-regular);color:var(--color-text);margin-bottom:8px;line-height:1.5}.gl-anti-list code{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--color-bg);padding:2px 8px;border-radius:4px;color:var(--color-danger)}.gl-dim-card{display:flex;gap:24px;margin-top:12px;align-items:center;padding:20px;background:var(--color-surface);border-radius:var(--radius-md)}.gl-dim-phone{position:relative;flex-shrink:0}.gl-dim-w-label{text-align:center;font:var(--text-xsmall-bold);color:var(--color-primary);margin-bottom:4px;position:relative}.gl-dim-w-label:before,.gl-dim-w-label:after{content:"";position:absolute;top:50%;width:30px;border-top:1px dashed var(--color-primary)}.gl-dim-w-label:before{left:0}.gl-dim-w-label:after{right:0}.gl-dim-frame{width:90px;height:195px;border:2px solid var(--color-text);border-radius:14px;position:relative;background:var(--color-bg)}.gl-dim-h-label{position:absolute;right:-52px;top:50%;transform:translateY(-50%);font:var(--text-xsmall-bold);color:var(--color-primary)}.gl-dim-h-label:before,.gl-dim-h-label:after{content:"";position:absolute;left:-8px;width:0;border-left:1px dashed var(--color-primary);height:70px}.gl-dim-h-label:before{bottom:14px}.gl-dim-h-label:after{top:14px}.gl-dim-meta{flex:1;display:flex;flex-direction:column;gap:12px}.gl-dim-meta-row{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px dashed var(--color-border)}.gl-dim-meta-row:last-child{border-bottom:none;padding-bottom:0}.gl-dim-meta-label{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.gl-dim-meta-val{font:13px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-primary);background:var(--color-bg);padding:4px 12px;border-radius:6px}.cl-topbar-stack{display:flex;flex-direction:column;gap:16px}.cl-topbar-preview{display:flex;flex-direction:column;gap:8px}.cl-topbar-label{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-text-tertiary);letter-spacing:.04em}.cl-topbar-preview .top-bar{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg)}.cl-pagedots-stack{display:flex;flex-direction:column;gap:12px}.cl-pagedots-row{display:flex;align-items:center;gap:16px}.cl-chip-stack{display:flex;flex-direction:column;gap:12px}.cl-chip-label{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-text-tertiary);letter-spacing:.04em;margin-bottom:8px}.cl-chip-row{display:flex;flex-wrap:wrap;gap:8px}.cl-chip{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--radius-full);font:var(--text-xsmall-bold)}.cl-chip-toggle{display:inline-flex;align-items:center;padding:8px 12px;border-radius:var(--radius-button);border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-text);font:var(--text-xsmall-bold);cursor:pointer}.cl-chip-toggle.is-selected{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-color)}.i18n-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.i18n-filter{padding:8px 12px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-text-secondary);font:var(--text-xsmall-bold);cursor:pointer}.i18n-filter:hover{background:var(--color-surface)}.i18n-filter.is-active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-color)}.i18n-groups{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:20px;padding-right:4px}.i18n-group{display:flex;flex-direction:column;gap:8px}.i18n-group-title{font:var(--text-medium-bold);color:var(--color-text);margin:0}.i18n-group-count{color:var(--color-text-tertiary);font:var(--text-xsmall-regular)}.animations-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin-top:16px}.lottie-card{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg);overflow:hidden}.lottie-card-preview{height:160px;display:flex;align-items:center;justify-content:center}.lottie-live{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.lottie-live-dark{background:linear-gradient(135deg,var(--color-bg),var(--color-surface))}.lottie-live-light{background:linear-gradient(135deg,var(--color-surface),var(--color-surface-raised))}.lottie-live-blue{background:var(--color-primary)}.lottie-live svg{max-width:100%;max-height:100%}.lottie-card-info{padding:16px;display:flex;flex-direction:column;gap:8px}.lottie-card-name{font:13px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-primary)}.lottie-card-desc{font:var(--text-xsmall-regular);color:var(--color-text-secondary);line-height:1.5;margin:0}.lottie-card-meta{display:flex;flex-direction:column;gap:4px;margin-top:4px}.lottie-meta-item{font:var(--text-xsmall-regular);color:var(--color-text-tertiary)}.lottie-meta-item strong{color:var(--color-text-secondary);font-weight:600}.lottie-card-download{padding:12px 16px;background:var(--color-primary);color:var(--color-on-color);border:none;font:var(--text-small-bold);cursor:pointer;margin:0;text-align:center}.lottie-card-download:hover{background:var(--color-primary-hover)}.animations-note{margin-top:20px;padding:12px 16px;border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-md);font:var(--text-small-regular);color:var(--color-text-secondary);line-height:1.55}.animations-note code{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--color-bg);padding:2px 8px;border-radius:4px;color:var(--color-primary)}.detail-image-wrap-partial{flex:1 1 auto!important;height:auto!important;margin-top:0!important;padding-top:0!important}.detail-stock-badge-partial{top:12px}.detail-image-wrap-partial .detail-dots{bottom:36px}.detail-sheet-partial{display:flex;flex-direction:column;gap:12px;flex:0 0 auto}.detail-desc-partial{font:var(--text-small-regular);color:var(--color-text-tertiary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;position:relative}.detail-read-more{background:none;border:none;padding:0;font:var(--text-small-bold);color:var(--color-primary);cursor:pointer}.detail-read-more:hover{text-decoration:underline}.detail-rating-score{font:var(--text-small-bold);color:var(--color-text)}.detail-rating-reviews{font:var(--text-small-regular);color:var(--color-text-tertiary)}.detail-stock-badge.is-oos{background:var(--color-danger-tint);color:var(--color-danger-strong)}.detail-stock-dot.is-oos{background:var(--color-danger-strong)}.detail-qty-row-v2{display:flex;align-items:center;justify-content:space-between}.detail-qty-label-v2{font:var(--text-normal-bold);color:var(--color-text)}.btn-detail-cta{width:100%;height:56px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-normal-bold);border:none;cursor:pointer}.btn-detail-cta:hover{background:var(--color-primary-hover)}.btn-detail-cta.is-disabled{background:var(--color-surface-raised);color:var(--color-text-tertiary);cursor:not-allowed}.btn-detail-cta.is-disabled:hover{background:var(--color-surface-raised)}.logo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin-top:24px}.logo-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;display:flex;flex-direction:column}.logo-icon-frame{display:block;aspect-ratio:1;width:100%}.logo-icon-img{display:block;width:100%;height:100%;object-fit:cover;border-radius:22%}.logo-card-body{padding:16px;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--color-border)}.logo-card-head{display:flex;align-items:center;gap:8px}.logo-card-title{font:var(--text-normal-bold);color:var(--color-text)}.logo-env-dot{width:8px;height:8px;border-radius:50%}.logo-env-amber{background:var(--color-warning)}.logo-env-red{background:var(--color-danger)}.logo-card-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);margin:0}.logo-download-btn{margin-top:4px;height:40px;border-radius:var(--radius-button);background:var(--color-primary);color:var(--color-on-color);font:var(--text-small-bold);border:none;cursor:pointer}.logo-download-btn:hover{background:var(--color-primary-hover)}.logo-mark-row{display:flex;flex-wrap:wrap;gap:20px;margin-top:24px}.logo-mark-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.logo-mark-frame{display:flex;align-items:center;justify-content:center;width:120px;height:120px;background:var(--color-on-color);border-radius:var(--radius-md)}.logo-mark-img{width:88px;height:88px;object-fit:contain}.logo-mark-meta{display:flex;flex-direction:column;align-items:center;gap:2px}.logo-mark-res{font:var(--text-small-bold);color:var(--color-text)}.logo-mark-px{font:var(--text-xsmall-bold);color:var(--color-text-tertiary)}.logo-download-btn--sm{height:34px;padding:0 16px;font:var(--text-xsmall-bold)}.logo-lockup-spec{margin-top:24px;padding:40px;background:var(--color-on-color);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center}.logo-lockup-mark img{width:88px;height:88px;display:block}.logo-lockup-gap{height:45px;width:2px;background:repeating-linear-gradient(var(--color-primary) 0 3px,transparent 3px 6px);position:relative;display:flex;align-items:center;justify-content:center}.logo-lockup-gap-label{position:absolute;left:12px;font:var(--text-xsmall-bold);color:var(--color-primary);white-space:nowrap}.logo-lockup-word{font:var(--text-hero-bold);letter-spacing:-.02em;color:var(--color-primary)}.logo-spec-note{margin-top:16px;font:var(--text-small-regular);color:var(--color-text-tertiary)}.ds-fonts{margin-top:40px;padding-top:32px;border-top:1px solid var(--color-border)}.ds-fonts-head{margin-bottom:20px}.ds-fonts-title{font:var(--text-large-bold);color:var(--color-text);margin:0 0 8px}.ds-fonts-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);margin:0;max-width:620px}.ds-font-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.ds-font-card{border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px;background:var(--color-surface)}.ds-font-card-head{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}.ds-font-name{font:var(--text-medium-bold);color:var(--color-text)}.ds-font-var{font:var(--text-xsmall-bold);color:var(--color-text-tertiary)}.ds-font-usage{font:var(--text-small-regular);color:var(--color-text-secondary);margin:0 0 12px}.ds-font-files{display:flex;flex-direction:column;gap:8px}.ds-font-dl{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--color-border);border-radius:var(--radius-button);background:var(--color-bg);cursor:pointer;text-align:left;transition:border-color .15s,background .15s}.ds-font-dl:hover{border-color:var(--color-primary);background:var(--color-primary-tint)}.ds-font-dl-label{font:var(--text-small-bold);color:var(--color-text);min-width:56px}.ds-font-dl-name{font:var(--text-xsmall-bold);color:var(--color-text-tertiary);flex:1}.ds-font-dl-icon{font:var(--text-normal-bold);color:var(--color-primary)}.ds-export{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px;margin-bottom:24px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.ds-export-info{display:flex;flex-direction:column;gap:2px}.ds-export-title{font:var(--text-normal-bold);color:var(--color-text)}.ds-export-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);max-width:520px}.ds-export-actions{display:flex;gap:12px}.ds-export-btn{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:9px 16px;background:var(--color-primary);border:none;border-radius:var(--radius-button);cursor:pointer}.ds-export-btn:hover{background:var(--color-primary-active)}.ds-export-btn-label{font:var(--text-small-bold);color:var(--color-on-color)}.ds-export-btn-file{font:var(--text-xsmall-bold);color:var(--color-on-color);opacity:.85}.ds-color-group+.ds-color-group{margin-top:28px}.ds-color-group-title{font:var(--text-medium-bold);color:var(--color-text);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}.i18n-header-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.i18n-interp-note{font:var(--text-small-regular);color:var(--color-text-secondary);background:var(--color-primary-tint);border:1px solid var(--color-primary-mid);border-radius:var(--radius-md);padding:12px;margin:12px 0}.i18n-interp-note code{font:var(--text-xsmall-bold);background:var(--color-bg);border:1px solid var(--color-border);border-radius:4px;padding:1px 8px;color:var(--color-primary)}.i18n-interp-note strong{color:var(--color-text)}.gl-interactive-link{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:var(--color-primary-tint);border:1px solid var(--color-primary-mid);border-radius:var(--radius-md);text-decoration:none;transition:background .15s ease,transform .15s ease}.gl-interactive-link:hover{background:var(--color-primary-mid);transform:translateY(-1px)}.gl-interactive-link-title{font:var(--text-medium-bold);color:var(--color-primary);margin-bottom:4px}.gl-interactive-link-desc{font:var(--text-small-regular);color:var(--color-text-secondary)}.gl-interactive-link-arrow{font-size:24px;color:var(--color-primary);flex-shrink:0}.i18n-group-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.i18n-group-actions{display:flex;align-items:center;gap:8px}.i18n-json-btn{font:var(--text-xsmall-bold);letter-spacing:.04em;text-transform:uppercase;color:var(--color-primary);background:var(--color-primary-tint);border:1px solid var(--color-primary-mid);border-radius:var(--radius-sm);padding:4px 12px;cursor:pointer;transition:background .15s ease}.i18n-json-btn:hover{background:var(--color-primary-mid)}.i18n-json-block{margin:8px 0 16px;padding:16px;background:var(--color-surface-raised, #f5f7fa);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-roman);font-size:12px;line-height:1.6;color:var(--color-text);overflow-x:auto;white-space:pre;direction:ltr}.screen-auth{background:var(--color-bg);flex:1;display:flex;flex-direction:column;position:relative}.top-bar,.auth-topbar{height:50px;display:flex;align-items:center;padding:0 var(--space-16);gap:var(--space-16);background:var(--color-bg);position:relative;z-index:2}.top-bar-transparent{background:transparent}.top-bar-back,.auth-back{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;color:var(--color-text);border-radius:var(--radius-sm);flex-shrink:0}.top-bar-back:hover,.auth-back:hover{background:var(--color-surface)}.top-bar-light .top-bar-back{color:var(--color-on-color)}.top-bar-title,.auth-topbar-title{font:var(--text-normal-bold);letter-spacing:-.01em;flex:1;text-align:center;color:var(--color-text)}.top-bar-light .top-bar-title{color:var(--color-on-color)}[lang=ar] .top-bar-title,[lang=ar] .auth-topbar-title{margin:0}.top-bar-right,.top-bar-right-spacer,.top-bar-left-spacer{width:36px;height:36px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--color-text)}.top-bar-light .top-bar-right{color:var(--color-on-color)}.auth-heading{padding:var(--space-24) var(--screen-pad-x) var(--space-32)}.auth-title{font:var(--text-large-bold);letter-spacing:-.01em;color:var(--color-text);margin-bottom:8px}.auth-sub{font:var(--text-small-regular);color:var(--color-text-tertiary)}.auth-form{padding:0 var(--screen-pad-x);display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:12px}.field-label{font:var(--text-normal-bold);color:var(--color-text)}.field-input{position:relative;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-input);height:48px;display:flex;align-items:center;padding:13px;gap:13px;transition:border-color .15s ease}.field-input.is-focused{border-color:var(--color-primary)}.field-input.is-error{border-color:var(--color-danger)}.field-icon{color:var(--color-text-tertiary);flex-shrink:0;display:flex;align-items:center;justify-content:center;width:20px;height:20px}.field-input.is-focused .field-icon,.field-input.has-value .field-icon{color:var(--color-primary)}.field-input.is-error .field-icon{color:var(--color-danger)}.field-helper{display:block;font:var(--text-xsmall-regular);color:var(--color-text-tertiary);margin-top:8px}.field-helper-error{color:var(--color-danger)}.field-text-wrap{flex:1;min-width:0;display:flex}.field-text{flex:1;font:var(--text-small-regular);color:var(--color-text);background:none;border:none;outline:none;min-width:0;padding:0}.field-text::placeholder{color:var(--color-text-tertiary)}.field-text:read-only{cursor:default}.field-action{background:none;border:none;cursor:pointer;color:var(--color-text-tertiary);display:flex;align-items:center;justify-content:center;flex-shrink:0;width:20px;height:20px;padding:0}.field-action:hover{color:var(--color-primary)}.field-status{color:var(--color-success);flex-shrink:0;display:flex}.auth-actions{margin-top:auto;padding:var(--space-32) var(--screen-pad-x) var(--space-24);display:flex;flex-direction:column;gap:var(--space-12);align-items:stretch}.auth-actions-row{display:flex;gap:12px;align-items:center;width:100%}.auth-actions-row>.btn-primary{flex:1}.field-link-row{display:flex;justify-content:flex-end;margin-top:-8px}[lang=ar] .field-link-row{justify-content:flex-start}.field-link{background:none;border:none;color:var(--color-primary);font:var(--text-small-bold);cursor:pointer;padding:4px}.verify-body{flex:1;display:flex;flex-direction:column;align-items:center;padding:12px var(--screen-pad-x) 0}.halo{width:130px;height:130px;border-radius:50%;margin:var(--space-24) 0 var(--space-32);display:flex;align-items:center;justify-content:center;position:relative}.halo-bg{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:var(--color-primary);opacity:.1}.halo-inner{width:90px;height:90px;border-radius:50%;background:var(--color-primary);display:flex;align-items:center;justify-content:center;color:var(--color-on-color);position:relative;z-index:1}.halo.halo-success .halo-bg,.halo.halo-success .halo-inner{background:var(--color-success)}.verify-title{font:var(--text-large-bold);color:var(--color-text);margin-bottom:var(--space-12)}.verify-desc{font:var(--text-small-regular);color:var(--color-text-tertiary);text-align:center;margin-bottom:var(--space-32)}.verify-desc strong{display:block;font:var(--text-small-bold);color:var(--color-text)}.otp-row{display:flex;gap:var(--space-12);margin-bottom:var(--space-32)}.otp-box{width:54px;height:64px;border-radius:var(--radius-lg);background:var(--color-surface);display:flex;align-items:center;justify-content:center;font:var(--text-large-bold);color:var(--color-text);border:1.5px solid transparent}.otp-box.active{background:var(--color-bg);border-color:var(--color-primary)}.verify-resend{margin-top:var(--space-20);font:var(--text-small-regular);color:var(--color-text-secondary);text-align:center}.verify-resend .link{color:var(--color-primary);font:var(--text-small-bold);cursor:pointer}.sheet-dim{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:5}.sheet{position:absolute;bottom:0;left:0;right:0;background:var(--color-bg);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);padding:12px var(--screen-pad-x) var(--space-32);z-index:6;display:flex;flex-direction:column;align-items:center;gap:var(--space-16)}.sheet-handle{width:48px;height:5px;background:var(--color-border);border-radius:var(--radius-full);margin-bottom:8px}.sheet-title{font:var(--text-large-bold);color:var(--color-text);margin-bottom:4px;text-align:center}.sheet-desc{font:var(--text-small-regular);color:var(--color-text-secondary);text-align:center;white-space:pre-line;margin-bottom:var(--space-16)}.sheet-actions{width:100%;display:flex;flex-direction:column;gap:var(--space-12)}.sheet-form{width:100%;display:flex;flex-direction:column;gap:16px;margin-top:8px}.fc{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;flex-shrink:0}.fc.fc-disabled,.fc.fc-selected-disabled{opacity:.4;cursor:not-allowed}.fc-checkbox{width:20px;height:20px;border-radius:var(--radius-xs);background:var(--color-bg);border:1.5px solid var(--color-border)}.fc-checkbox:not(.fc-disabled):not(.fc-selected-disabled):hover{border-color:var(--color-primary)}.fc-checkbox.fc-selected,.fc-checkbox.fc-selected-disabled{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-color)}.fc-radio{width:20px;height:20px;border-radius:50%;background:var(--color-bg);border:1.5px solid var(--color-border);padding:2px}.fc-radio:not(.fc-disabled):not(.fc-selected-disabled):hover{border-color:var(--color-primary)}.fc-radio.fc-selected,.fc-radio.fc-selected-disabled{border-color:var(--color-primary)}.fc-radio-dot{width:10px;height:10px;border-radius:50%;background:var(--color-primary)}.fc-switch{width:36px;height:20px;border-radius:var(--radius-full);background:var(--color-border);padding:2px;align-items:center;justify-content:flex-start;transition:background .2s ease}.fc-switch:not(.fc-disabled):not(.fc-selected-disabled):hover{background:var(--color-text-tertiary)}.fc-switch.fc-selected,.fc-switch.fc-selected-disabled{background:var(--color-primary);justify-content:flex-end}.fc-switch-knob{width:16px;height:16px;border-radius:50%;background:var(--color-on-color)}.toast-stack{position:absolute;top:var(--space-16);left:var(--space-24);right:var(--space-24);z-index:10000;display:flex;flex-direction:column;gap:12px;pointer-events:none}.toast-stack>*{pointer-events:auto}.toast{position:relative;display:flex;align-items:flex-start;gap:12px;background:var(--color-bg);border-radius:var(--radius-lg);border:2px solid var(--color-border);padding:12px 16px 16px;overflow:hidden;box-shadow:var(--shadow-card)}.toast-success{border-color:var(--color-success)}.toast-warning{border-color:var(--color-warning)}.toast-info{border-color:var(--color-primary)}.toast-danger{border-color:var(--color-danger)}.toast-icon{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.toast-success .toast-icon{background:var(--color-success-tint);color:var(--color-success-strong)}.toast-warning .toast-icon{background:var(--color-warning-tint);color:var(--color-warning)}.toast-info .toast-icon{background:var(--color-primary-tint);color:var(--color-primary-active)}.toast-danger .toast-icon{background:var(--color-danger-tint);color:var(--color-danger)}.toast-content{flex:1;min-width:0}.toast-title{font:var(--text-small-bold);color:var(--color-text);margin-bottom:2px}.toast-desc{font:var(--text-xsmall-regular);color:var(--color-text-secondary)}.toast-close{width:20px;height:20px;border-radius:50%;background:var(--color-surface);border:none;color:var(--color-text-tertiary);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;margin-top:4px}.toast-close:hover{background:var(--color-surface-raised);color:var(--color-text)}.toast-progress{position:absolute;bottom:0;left:0;height:4px;width:100%;background:var(--color-border);display:block;transform-origin:left center;animation:toast-shrink 5s linear forwards}.toast-success .toast-progress{background:var(--color-success)}.toast-warning .toast-progress{background:var(--color-warning)}.toast-info .toast-progress{background:var(--color-primary)}.toast-danger .toast-progress{background:var(--color-danger)}@keyframes toast-shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.auth-biometric-btn{width:56px;height:56px;border-radius:var(--radius-button);background:var(--color-bg);border:1.5px solid var(--color-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-primary);flex-shrink:0;transition:background .15s ease}.auth-biometric-btn:hover,.auth-biometric-btn:active{background:var(--color-primary-tint)}.auth-create-link-row{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:16px}.auth-create-link-label{font:var(--text-small-regular);color:var(--color-text-secondary)}.auth-create-link{font:var(--text-small-bold);color:var(--color-primary);background:none;border:none;cursor:pointer;padding:0}.auth-error-banner{margin:0 var(--screen-pad-x) 16px;padding:12px;border-radius:var(--radius-md);background:var(--color-danger-tint);border:1px solid var(--color-danger);display:flex;gap:12px;align-items:center}.auth-error-text{font:var(--text-small-bold);color:var(--color-danger);flex:1}