:root{--bg: #f6f6f7;--surface: #ffffff;--primary: #0b0b2d;--secondary: #6b7280;--border: #e5e7eb;--hover: #f2f3f5;--accent: #ff4f93;--primary-color: #000000;--radius: 24px}:root{--p-primary-50: #f6f6f6;--p-primary-100: #e7e7e7;--p-primary-200: #d1d1d1;--p-primary-300: #b0b0b0;--p-primary-400: #888888;--p-primary-500: #000000;--p-primary-600: #000000;--p-primary-700: #000000;--p-primary-800: #000000;--p-primary-900: #000000;--p-primary-color: #000000;--p-primary-contrast-color: #ffffff}.view-toggle{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;width:100%;padding:6px;border-radius:999px;background:#f5f5f3;border:1px solid rgba(0,0,0,.05)}.view-toggle button{appearance:none;width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:8px;border:none;outline:none;border-radius:999px;background:transparent;color:#0000008c;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease}.view-toggle button:hover{background:#00000008;color:#000}.view-toggle button.active{background:#fff;color:#000;font-weight:600;box-shadow:0 1px 2px #0000000a,0 8px 24px #0000000a}.view-toggle button i{font-size:16px;line-height:1}.view-toggle button span{line-height:1}