.color-examples[data-v-ae2b5127]{display:flex;gap:1rem;flex-wrap:wrap;margin:1rem 0}.color-demo[data-v-ae2b5127]{flex:1;min-width:150px;padding:1rem;border-radius:4px;text-align:center;box-shadow:0 2px 4px #0000001a}.color-demo p[data-v-ae2b5127]{margin:0;font-weight:700;background:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.color-demo code[data-v-ae2b5127]{display:block;margin-top:.5rem;background:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.color-demo.light-bg p[data-v-ae2b5127],.color-demo.light-bg code[data-v-ae2b5127]{color:#333;text-shadow:none}.css-icon[data-v-ae2b5127]{color:#639;margin-right:.5rem}.tutorial-header[data-v-ae2b5127]{margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid var(--color-border)}.color-wheel[data-v-ae2b5127]{width:100%;max-width:400px;margin:0 auto;display:block;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.color-wheel text[data-v-ae2b5127]{font-family:system-ui,-apple-system,sans-serif;fill:#666}.text-center[data-v-ae2b5127]{text-align:center}.demo-container[data-v-ae2b5127]{display:flex;gap:1rem;margin-bottom:1.5rem}.background-demo[data-v-ae2b5127]{flex:1;padding:2rem;border-radius:8px;text-align:center;box-shadow:0 2px 4px #0000001a}.background-demo p[data-v-ae2b5127]{margin-bottom:1rem;font-weight:700}.background-demo code[data-v-ae2b5127]{display:block;margin-top:1rem;font-size:.9em}.opacity-demo[data-v-ae2b5127]{background-image:url(/images/checkerboard.png);background-repeat:repeat}.opacity-demo>div[data-v-ae2b5127]{padding:2rem;border-radius:8px}.gradient-demo[data-v-ae2b5127]{min-height:150px;display:flex;flex-direction:column;justify-content:center;align-items:center}.themed-component[data-v-ae2b5127]{border:2px solid var(--primary-color, #3b82f6);border-radius:8px;overflow:hidden}.themed-header[data-v-ae2b5127]{background-color:var(--primary-color, #3b82f6);color:#fff;padding:1rem}.themed-content[data-v-ae2b5127]{padding:1rem;background-color:var(--background-color, #f9fafb)}.themed-button[data-v-ae2b5127]{background-color:var(--accent-color, #f59e0b);color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer}.contrast-demo[data-v-ae2b5127]{flex:1;padding:2rem;border-radius:8px;text-align:center}.good-contrast[data-v-ae2b5127]{background-color:#1a237e;color:#fff}.poor-contrast[data-v-ae2b5127]{background-color:#e3f2fd;color:#a5c7f9}.contrast-ratio[data-v-ae2b5127]{display:block;margin-top:1rem;font-size:.9em;opacity:.8}.brand-palette[data-v-ae2b5127]{display:flex;gap:1rem;width:100%}.brand-color[data-v-ae2b5127]{flex:1;padding:2rem;border-radius:8px;text-align:center;color:#fff}.brand-color span[data-v-ae2b5127]{display:block;margin-bottom:.5rem}.brand-color.primary[data-v-ae2b5127]{background-color:#3b82f6}.brand-color.secondary[data-v-ae2b5127]{background-color:#f59e0b}.brand-color.accent[data-v-ae2b5127]{background-color:#10b981}.layout-preview[data-v-ae2b5127]{margin-top:4rem;margin-bottom:6rem}.layout-mockup[data-v-ae2b5127]{width:100%;height:auto;max-width:600px;margin:0 auto;display:block}.annotations text[data-v-ae2b5127]{font-size:12px;opacity:.8}