*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;font-family:Nunito,system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.bottom-nav-spacer{display:none}@media(max-width:768px){.bottom-nav-spacer{display:block;height:var(--bottom-nav-height)}}.page-fade-enter-active,.page-fade-leave-active{transition:opacity .3s ease,transform .3s ease}.page-fade-enter-from{opacity:0;transform:translateY(10px)}.page-fade-leave-to{opacity:0;transform:translateY(-10px)}.page-slide-enter-active,.page-slide-leave-active{transition:opacity .4s ease,transform .4s cubic-bezier(.4,0,.2,1)}.page-slide-enter-from{opacity:0;transform:translate(30px)}.page-slide-leave-to{opacity:0;transform:translate(-30px)}.page-scale-enter-active,.page-scale-leave-active{transition:opacity .35s ease,transform .35s cubic-bezier(.34,1.56,.64,1)}.page-scale-enter-from{opacity:0;transform:scale(.95)}.page-scale-leave-to{opacity:0;transform:scale(1.02)}:root{--header-height: 70px;--bottom-nav-height: 64px;--bg-primary: #fffcf7;--bg-secondary: #fff8f0;--bg-card: #ffffff;--bg-hover: rgba(255, 107, 91, .05);--text-primary: #3d2c29;--text-secondary: #6b5a56;--text-muted: #8a7a75;--accent: #ff6b5b;--accent-dark: #e85a4a;--accent-light: #ff8a7d;--accent-text: #c4402e;--peach: #ffb599;--yellow-soft: #ffd93d;--orange-soft: #ffab5e;--accent-gradient: linear-gradient(135deg, #ff6b5b 0%, #ffb599 100%);--shimmer-color: rgba(255, 255, 255, .4);--skeleton-base: rgba(61, 44, 41, .06);--border-color: rgba(61, 44, 41, .08);--border-color-light: rgba(61, 44, 41, .05);--border-color-hover: rgba(255, 107, 91, .2);--overlay-bg: rgba(61, 44, 41, .6);--tab-hover-bg: rgba(255, 255, 255, .5);--tab-active-shadow: 0 1px 3px rgba(0, 0, 0, .08);--shadow-sm: 0 2px 8px rgba(61, 44, 41, .08);--shadow-md: 0 4px 16px rgba(61, 44, 41, .12);--shadow-lg: 0 8px 32px rgba(61, 44, 41, .16);--shadow-accent: 0 6px 20px rgba(255, 107, 91, .35);--shadow-accent-sm: 0 4px 12px rgba(255, 107, 91, .3);--success: #48bb78;--warning: #f6ad55;--error: #e53e3e;--error-bg: rgba(229, 62, 62, .1);--text-on-accent: #ffffff;--confidence-high: #2f855a;--confidence-medium: #b7791f;--confidence-low: #c53030;--loading-overlay-bg: rgba(255, 252, 247, .9);--accent-focus-ring: rgba(255, 107, 91, .15);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--ease-default: cubic-bezier(.34, 1.56, .64, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--duration-fast: .15s;--duration-normal: .25s;--duration-slow: .4s;--success-dark: #38a169;--success-bg: rgba(72, 187, 120, .12);--error-dark: #c53030;--warning-bg: rgba(246, 173, 85, .12);--warning-dark: #92400e;--warning-surface: #fef3c7;--warning-surface-end: #fde68a;--accent-bg: rgba(255, 107, 91, .1);--accent-bg-subtle: rgba(255, 107, 91, .12);--shadow-accent-hover: 0 6px 16px rgba(255, 107, 91, .4);--shadow-success: 0 6px 20px rgba(72, 187, 120, .35);--category-purple: #8b7cf6;--category-pink: #f472b6;--category-blue: #38bdf8;--avatar-david: linear-gradient(135deg, #4a90d9 0%, #7ab8ff 100%);--avatar-david-shadow: rgba(74, 144, 217, .3);--role-owner-bg: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%);--role-owner-text: #9a4217;--role-owner-text-bg: rgba(237, 137, 54, .15);--role-member-bg: linear-gradient(135deg, #ff6b5b 0%, #ffb599 100%);--role-guest-bg: rgba(61, 44, 41, .12);--role-guest-text: #655350;--role-guest-avatar: linear-gradient(135deg, #a0aec0 0%, #718096 100%)}[data-theme=dark]{--bg-primary: #1a1410;--bg-secondary: #2d2420;--bg-card: #3d322e;--bg-hover: rgba(255, 138, 125, .1);--text-primary: #f5f0ed;--text-secondary: #b8aea8;--text-muted: #8a817c;--accent: #ff8a7d;--accent-dark: #ff6b5b;--accent-light: #ffb599;--accent-text: #ff8a7d;--peach: #ffcbb8;--yellow-soft: #d4b535;--orange-soft: #cc8a4e;--accent-gradient: linear-gradient(135deg, #ff8a7d 0%, #ffcbb8 100%);--shimmer-color: rgba(255, 255, 255, .08);--skeleton-base: rgba(255, 255, 255, .06);--border-color: rgba(255, 255, 255, .1);--border-color-light: rgba(255, 255, 255, .05);--border-color-hover: rgba(255, 138, 125, .3);--overlay-bg: rgba(0, 0, 0, .7);--tab-hover-bg: rgba(255, 255, 255, .08);--tab-active-shadow: 0 1px 3px rgba(0, 0, 0, .3);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .5);--shadow-accent: 0 6px 20px rgba(255, 138, 125, .25);--shadow-accent-sm: 0 4px 12px rgba(255, 138, 125, .2);--success: #68d391;--warning: #fbd38d;--error: #fc8181;--error-bg: rgba(252, 129, 129, .12);--text-on-accent: #ffffff;--confidence-high: #68d391;--confidence-medium: #fbd38d;--confidence-low: #fc8181;--loading-overlay-bg: rgba(26, 20, 16, .9);--accent-focus-ring: rgba(255, 138, 125, .2);--success-dark: #48bb78;--success-bg: rgba(104, 211, 145, .15);--error-dark: #fc8181;--warning-bg: rgba(251, 211, 141, .15);--warning-dark: #fbd38d;--warning-surface: rgba(251, 211, 141, .15);--warning-surface-end: rgba(251, 211, 141, .25);--accent-bg: rgba(255, 138, 125, .1);--accent-bg-subtle: rgba(255, 138, 125, .15);--shadow-accent-hover: 0 6px 16px rgba(255, 138, 125, .3);--shadow-success: 0 6px 20px rgba(104, 211, 145, .25);--category-purple: #a78bfa;--category-pink: #f9a8d4;--category-blue: #7dd3fc;--avatar-david: linear-gradient(135deg, #5a9de0 0%, #8bc4ff 100%);--avatar-david-shadow: rgba(90, 157, 224, .3);--role-owner-bg: linear-gradient(135deg, #fbd38d 0%, #f6ad55 100%);--role-owner-text: #fbd38d;--role-owner-text-bg: rgba(251, 211, 141, .15);--role-member-bg: linear-gradient(135deg, #ff8a7d 0%, #ffcbb8 100%);--role-guest-bg: rgba(255, 255, 255, .1);--role-guest-text: #b8aea8;--role-guest-avatar: linear-gradient(135deg, #8a9bb0 0%, #607080 100%)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}html{transition:background-color .3s ease,color .3s ease}body{background-color:var(--bg-primary);color:var(--text-primary)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 4px var(--accent-focus-ring)}button:focus:not(:focus-visible),a:focus:not(:focus-visible){outline:none}