:root{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"}body{margin:0;background:var(--elevation-page);color:var(--black-100)}#app{min-height:100vh}.page{max-width:1400px;margin:0 auto;padding:12px 12px 28px;display:grid;gap:10px}.top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.title{font-size:16px;font-weight:650;letter-spacing:-.02em}.meta{font-size:11px;color:var(--color-quaternary)}.toolbar{display:flex;gap:8px;align-items:center}.input{width:100%;height:32px;padding:0 10px;border-radius:10px;border:1px solid var(--border-secondary-default);background:var(--bg-input-default);color:var(--color-primary);outline:none}.input:focus{border-color:var(--border-primary-hover);box-shadow:0 0 0 3px var(--border-primary-focus)}.section{display:grid;gap:8px}.sectionHeader{display:flex;align-items:center;justify-content:space-between;gap:10px}.sectionTitle{font-size:11px;font-weight:650;color:var(--color-quaternary);text-transform:uppercase;letter-spacing:.08em}.pill{font-size:11px;padding:3px 7px;border-radius:999px;background:var(--bg-tertiary-default);border:1px solid var(--border-secondary-default);color:var(--color-quaternary)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}.grid--token{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.card{border-radius:10px;border:1px solid var(--border-secondary-default);background:var(--elevation-surface);padding:8px;display:grid;gap:8px}.name{font-size:11px;font-weight:600;color:var(--black-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.themes{display:grid;grid-template-columns:1fr 1fr;gap:8px}.theme{display:grid;gap:5px;padding:7px;border-radius:9px;border:1px solid var(--border-secondary-default);background:var(--bg-tertiary-default)}.tag{font-size:9px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--color-quaternary)}.row{display:grid;grid-template-columns:22px 1fr;align-items:center;gap:7px}.row--single{grid-template-columns:28px 1fr}.swatch{width:16px;height:16px;border-radius:5px;border:1px solid var(--border-secondary-default)}.swatch--xl{width:22px;height:22px;border-radius:6px}.value{font-size:10px;color:var(--color-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:10px;color:var(--color-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tabs{display:flex;gap:6px;align-items:center}.tab{height:32px;padding:0 10px;border-radius:10px;border:1px solid var(--border-secondary-default);background:var(--elevation-surface);color:var(--color-primary);font-size:11px;font-weight:650;letter-spacing:-.01em;cursor:pointer}.tab--active{background:var(--bg-secondary-default);border-color:var(--border-primary-default)}.badge{display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:999px;border:1px solid var(--border-secondary-default);background:var(--bg-tertiary-default);color:var(--color-primary);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.swatch--gradient{border-radius:6px}:root{--white-100: rgb(255 255 255 / 1);--white-90: rgb(255 255 255 / .9);--white-80: rgb(255 255 255 / .8);--white-70: rgb(255 255 255 / .7);--white-60: rgb(255 255 255 / .6);--white-50: rgb(255 255 255 / .5);--white-40: rgb(255 255 255 / .4);--white-30: rgb(255 255 255 / .3);--white-20: rgb(255 255 255 / .2);--white-10: rgb(255 255 255 / .1);--white-5: rgb(255 255 255 / .05);--white-0: rgb(255 255 255 / 0);--black-100: rgb(0 0 0 / 1);--black-90: rgb(0 0 0 / .9);--black-80: rgb(0 0 0 / .8);--black-70: rgb(0 0 0 / .7);--black-60: rgb(0 0 0 / .6);--black-50: rgb(0 0 0 / .5);--black-40: rgb(0 0 0 / .4);--black-30: rgb(0 0 0 / .3);--black-20: rgb(0 0 0 / .2);--black-10: rgb(0 0 0 / .1);--black-5: rgb(0 0 0 / .05);--black-0: rgb(0 0 0 / 0);--gray-50: #F5F6F8;--gray-100: #E4E7EF;--gray-200: #DADEE8;--gray-300: #CCD0DB;--gray-400: #A4A9B6;--gray-500: #747C8C;--gray-600: #3E434C;--gray-700: #2E3138;--gray-800: #1B1D1F;--gray-900: #131416;--gray-1000: #090A0B;--blue-50: #EBF1FF;--blue-100: #D7E3FE;--blue-200: #B4CAFD;--blue-300: #86A8F9;--blue-400: #3D74F5;--blue-500: #1353EC;--blue-600: #1248CA;--blue-700: #123CA1;--blue-800: #102C70;--blue-900: #0E214E;--blue-1000: #101B37;--mint-50: #EBFFFD;--mint-100: #D7FEF9;--mint-200: #B5FCF4;--mint-300: #86F9EB;--mint-400: #3FF3DE;--mint-500: #19E6CD;--mint-600: #18BFAB;--mint-700: #17A190;--mint-800: #147166;--mint-900: #104C45;--mint-1000: #082B26;--emerald-50: #EBFEF1;--emerald-100: #D8FDE2;--emerald-200: #B6FBCA;--emerald-300: #89F5A8;--emerald-400: #47EB76;--emerald-500: #20DF55;--emerald-600: #20B64A;--emerald-700: #1D9A40;--emerald-800: #14712E;--emerald-900: #104C20;--emerald-1000: #122517;--herbal-50: #F8FFEB;--herbal-100: #F1FDD8;--herbal-200: #E5FBB6;--herbal-300: #D4F986;--herbal-400: #B8F042;--herbal-500: #A4E51A;--herbal-600: #89BF18;--herbal-700: #74A117;--herbal-800: #547411;--herbal-900: #394E0E;--herbal-1000: #202C06;--yellow-50: #FFFAEB;--yellow-100: #FEF6D7;--yellow-200: #FDEDB4;--yellow-300: #FCE183;--yellow-400: #FACF38;--yellow-500: #F9C306;--yellow-600: #C99F0D;--yellow-700: #AD890B;--yellow-800: #7B620A;--yellow-900: #554407;--yellow-1000: #302605;--orange-50: #FFF3EB;--orange-100: #FFE7D7;--orange-200: #FDD3B4;--orange-300: #FAB585;--orange-400: #F7893B;--orange-500: #F06E0F;--orange-600: #C95B0D;--orange-700: #A74F11;--orange-800: #77390D;--orange-900: #50280B;--orange-1000: #311908;--rubin-50: #FFEBEC;--rubin-100: #FED7D9;--rubin-200: #FCB6B9;--rubin-300: #F7878D;--rubin-400: #EB4750;--rubin-500: #DF202A;--rubin-600: #B1252D;--rubin-700: #93252A;--rubin-800: #632125;--rubin-900: #4F191A;--rubin-1000: #2F0E0F;--magenta-50: #FDEBFF;--magenta-100: #FAD7FE;--magenta-200: #F5B5FC;--magenta-300: #ED86F9;--magenta-400: #DE42F0;--magenta-500: #C626D9;--magenta-600: #AF15C1;--magenta-700: #9414A3;--magenta-800: #6A1174;--magenta-900: #470E4E;--magenta-1000: #2E0E32;--purple-50: #F4EBFF;--purple-100: #E8D7FF;--purple-200: #D4B4FD;--purple-300: #B883FC;--purple-400: #8F42F0;--purple-500: #7319E5;--purple-600: #641BC0;--purple-700: #51169C;--purple-800: #3A1070;--purple-900: #2A0E4E;--purple-1000: #1A0634}[data-theme=light]{--elevation-page: var(--gray-50);--elevation-surface: var(--white-100);--elevation-container: var(--gray-50);--elevation-elevated: var(--gray-100);--elevation-overlay: var(--white-100);--bg-primary-default: var(--blue-500);--bg-primary-hover: var(--blue-400);--bg-primary-click: var(--blue-600);--bg-secondary-default: var(--blue-50);--bg-secondary-hover: var(--blue-100);--bg-secondary-click: var(--blue-200);--bg-tertiary-default: var(--gray-100);--bg-tertiary-hover: var(--gray-200);--bg-tertiary-click: var(--gray-300);--bg-danger-default: var(--rubin-50);--bg-danger-hover: var(--rubin-100);--bg-danger-click: var(--rubin-200);--bg-input-default: var(--white-100);--bg-additional-mint: var(--mint-50);--bg-additional-emerald: var(--emerald-50);--bg-additional-herbal: var(--herbal-100);--bg-additional-yellow: var(--yellow-50);--bg-additional-orange: var(--orange-50);--bg-additional-magenta: var(--magenta-50);--bg-additional-purple: var(--purple-50);--border-primary-default: var(--blue-400);--border-primary-hover: var(--blue-500);--border-primary-focus: var(--blue-100);--border-secondary-default: var(--gray-200);--border-secondary-hover: var(--gray-400);--border-danger-default: var(--rubin-400);--border-danger-hover: var(--rubin-500);--border-danger-focus: var(--rubin-100);--color-primary: var(--gray-1000);--color-secondary: var(--gray-200);--color-tertiary: var(--gray-300);--color-quaternary: var(--gray-500);--color-error: var(--rubin-300);--color-error-hover: var(--rubin-200);--color-warning: var(--yellow-300);--color-success: var(--emerald-300);--color-info: var(--blue-300);--color-mint: var(--mint-300);--color-herbal: var(--herbal-300);--color-orange: var(--orange-400);--color-magenta: var(--magenta-300);--color-purple: var(--purple-200);--link-default: var(--blue-300);--link-hover: var(--blue-400);--link-click: var(--blue-500);--link-disabled: var(--gray-400);--status-error-accent: var(--rubin-300);--status-error-additional: var(--rubin-100);--status-warning-accent: var(--yellow-300);--status-warning-additional: var(--yellow-200);--status-success-accent: var(--emerald-300);--status-success-additional: var(--emerald-200);--status-info-accent: var(--blue-300);--status-info-additional: var(--blue-100);--chart-purple-default: var(--purple-200);--chart-purple-hover: var(--purple-300);--chart-purple-disabled: var(--magenta-50);--chart-blue-default: var(--blue-300);--chart-blue-hover: var(--blue-400);--chart-blue-disabled: var(--blue-100);--chart-mint-default: var(--mint-300);--chart-mint-hover: var(--mint-600);--chart-mint-disabled: var(--mint-100);--chart-magenta-default: var(--magenta-300);--chart-magenta-hover: var(--magenta-600);--chart-magenta-disabled: var(--magenta-100);--chart-herbal-default: var(--herbal-400);--chart-herbal-hover: var(--herbal-600);--chart-herbal-disabled: var(--herbal-200);--gradient-base-transparent-0: var(--black-0);--gradient-base-transparent-50: var(--black-50);--gradient-base-transparent-100: var(--black-100);--gradient-base-blur-50: var(--black-50);--gradient-decorative-default: var(--blue-100);--gradient-decorative-error: var(--rubin-100);--gradient-decorative-success: var(--emerald-100);--gradient-decorative-warning: var(--yellow-100);--gradient-brand-blue: var(--blue-400);--gradient-brand-emerald: var(--emerald-500);--gradient-brand-yellow: var(--yellow-300);--gradient-brand-red: var(--rubin-300)}[data-theme=dark]{--elevation-page: var(--gray-1000);--elevation-surface: var(--gray-900);--elevation-container: var(--gray-800);--elevation-elevated: var(--gray-700);--elevation-overlay: var(--gray-700);--bg-primary-default: var(--blue-500);--bg-primary-hover: var(--blue-400);--bg-primary-click: var(--blue-600);--bg-secondary-default: var(--blue-1000);--bg-secondary-hover: var(--blue-900);--bg-secondary-click: var(--blue-800);--bg-tertiary-default: var(--gray-700);--bg-tertiary-hover: var(--gray-600);--bg-tertiary-click: var(--gray-500);--bg-danger-default: var(--rubin-1000);--bg-danger-hover: var(--rubin-900);--bg-danger-click: var(--rubin-800);--bg-input-default: var(--gray-800);--bg-additional-mint: var(--mint-1000);--bg-additional-emerald: var(--emerald-1000);--bg-additional-herbal: var(--herbal-1000);--bg-additional-yellow: var(--yellow-1000);--bg-additional-orange: var(--orange-1000);--bg-additional-magenta: var(--magenta-1000);--bg-additional-purple: var(--purple-1000);--border-primary-default: var(--blue-500);--border-primary-hover: var(--blue-400);--border-primary-focus: var(--blue-800);--border-secondary-default: var(--gray-700);--border-secondary-hover: var(--gray-500);--border-danger-default: var(--rubin-500);--border-danger-hover: var(--rubin-400);--border-danger-focus: var(--rubin-800);--color-primary: var(--white-100);--color-secondary: var(--gray-800);--color-tertiary: var(--gray-700);--color-quaternary: var(--gray-400);--color-error: var(--rubin-500);--color-error-hover: var(--rubin-600);--color-warning: var(--yellow-600);--color-success: var(--emerald-600);--color-info: var(--blue-500);--color-mint: var(--mint-600);--color-herbal: var(--herbal-600);--color-orange: var(--orange-500);--color-magenta: var(--magenta-500);--color-purple: var(--purple-500);--link-default: var(--blue-500);--link-hover: var(--blue-600);--link-click: var(--blue-700);--link-disabled: var(--gray-400);--status-error-accent: var(--rubin-400);--status-error-additional: var(--rubin-800);--status-warning-accent: var(--yellow-500);--status-warning-additional: var(--yellow-900);--status-success-accent: var(--emerald-600);--status-success-additional: var(--emerald-900);--status-info-accent: var(--blue-400);--status-info-additional: var(--blue-800);--chart-purple-default: var(--purple-700);--chart-purple-hover: var(--purple-300);--chart-purple-disabled: var(--magenta-50);--chart-blue-default: var(--blue-700);--chart-blue-hover: var(--blue-400);--chart-blue-disabled: var(--blue-100);--chart-mint-default: var(--mint-700);--chart-mint-hover: var(--mint-600);--chart-mint-disabled: var(--mint-100);--chart-magenta-default: var(--magenta-700);--chart-magenta-hover: var(--magenta-600);--chart-magenta-disabled: var(--magenta-100);--chart-herbal-default: var(--herbal-800);--chart-herbal-hover: var(--herbal-600);--chart-herbal-disabled: var(--herbal-200);--gradient-base-transparent-0: var(--black-0);--gradient-base-transparent-50: var(--black-50);--gradient-base-transparent-100: var(--black-100);--gradient-base-blur-50: var(--black-50);--gradient-decorative-default: var(--blue-800);--gradient-decorative-error: var(--rubin-900);--gradient-decorative-success: var(--emerald-900);--gradient-decorative-warning: var(--yellow-900);--gradient-brand-blue: var(--blue-700);--gradient-brand-emerald: var(--emerald-800);--gradient-brand-yellow: var(--yellow-800);--gradient-brand-red: var(--rubin-800)}