.tp-tile{display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:var(--radius-md);transition:transform .15s ease}.tp-tile svg{width:55%;height:55%}.tp-tile--sm{width:36px;height:36px;border-radius:var(--radius-sm)}.tp-tile--md{width:48px;height:48px}.tp-tile--lg{width:64px;height:64px;border-radius:var(--radius-lg)}.tp-tile--dark{background:var(--ink);color:#fff}.tp-tile--gray{background:var(--surface-muted);color:var(--ink)}.tp-tile--gradient{background:var(--gradient-brand);color:#fff;box-shadow:var(--shadow-brand)}.tp-tile--outline{background:#fff;color:var(--ink);border:1px solid var(--border-default)}.tp-card{position:relative;border-radius:var(--radius-xl);transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}.tp-card--white{background:var(--surface-card);border:1px solid var(--border-subtle);box-shadow:var(--shadow-sm)}.tp-card--subtle{background:var(--surface-subtle);border:1px solid transparent}.tp-card--muted{background:var(--surface-muted);border:1px solid transparent}.tp-card--inverse{background:var(--ink);border:1px solid transparent;color:#fff;border-radius:var(--radius-2xl)}.tp-card--outline{background:transparent;border:1px solid var(--border-default)}.tp-card--pad-sm{padding:16px}.tp-card--pad-md{padding:24px}.tp-card--pad-lg{padding:32px}.tp-card--pad-xl{padding:40px}.tp-card--interactive{cursor:pointer}.tp-card--interactive:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.tp-card--interactive.tp-card--white:hover{border-color:var(--border-default)}