:root { /* MD3 Colors - Green Theme */ --md-primary: #2e7d32; --md-on-primary: #FFFFFF; --md-primary-container: #b8e6b9; --md-on-primary-container: #005006; --md-secondary: #466c48; --md-on-secondary: #FFFFFF; --md-surface: #fbfdf7; --md-surface-variant: #dde5db; --md-on-surface: #191c18; --md-on-surface-variant: #414942; --md-outline: #727971; --md-error: #be3920; /* Elevation */ --md-elevation-1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.14); --md-elevation-2: 0 3px 6px rgba(0,0,0,0.15), 0 2px 4px rgba(0,0,0,0.12); } .md3-text-field { padding: 12px 16px; border-radius: 4px; border: 1px solid var(--md-outline); background: var(--md-surface); color: var(--md-on-surface); font-family: Roboto, sans-serif; font-size: 16px; transition: border-color 0.2s; } .md3-text-field:focus { outline: none; border-color: var(--md-primary); } .md3-button { padding: 10px 24px; border-radius: 20px; border: none; background: var(--md-primary); color: var(--md-on-primary); font-family: Roboto, sans-serif; font-weight: 500; font-size: 14px; text-transform: uppercase; letter-spacing: 0.1px; cursor: pointer; transition: background 0.2s; text-decoration: none; /* 添加这一行 */ } .md3-button:hover { background: var(--md-primary-container); color: var(--md-on-primary-container); } .md3-card { background: var(--md-surface); border-radius: 12px; padding: 24px; box-shadow: var(--md-elevation-1); transition: box-shadow 0.2s; } .md3-card:hover { box-shadow: var(--md-elevation-2); } .md3-label { color: var(--md-on-surface-variant); font-size: 14px; font-weight: 500; margin-bottom: 8px; }