:root{--surface-primary:#f0efed;--surface-secondary:#f8f7f6;--surface-tertiary:#fff;--surface-elevated:#fff;--text-primary:#2c3440;--text-secondary:#686e77;--text-tertiary:#9da1a8;--text-disabled:#c5c7cc;--text-inverse:#fff;--border-light:#e5e4e2;--border-medium:#d8d6d3;--border-dark:#b8b6b3;--divider:#e5e4e2;--brand-primary:#2b8ed9;--brand-primary-dark:#1474b8;--brand-primary-light:#5fa8e3;--brand-accent:#f28925;--brand-accent-warm:#f0a348;--brand-accent-light:#f5b569;--color-success:#34a853;--color-success-light:#e8f5ec;--color-success-dark:#2d8e45;--color-error:#dc3545;--color-error-light:#fadee0;--color-error-dark:#c32936;--color-warning:#f59e0b;--color-warning-light:#fff4e5;--color-warning-dark:#d68509;--color-info:#0ea5e9;--color-info-light:#e0f2fe;--color-info-dark:#0c87c5;--feature-finance:#34a853;--feature-admin:#9333ea;--feature-documents:#0ea5e9;--feature-community:#f28925;--feature-messaging:#d946ef;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--radius-none:0;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--radius-2xl:1.5rem;--radius-full:9999px;--font-family-base:"Titillium Web",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;--font-family-display:"Cambo",Georgia,serif;--font-family-mono:"SF Mono",Monaco,"Cascadia Code","Roboto Mono",Consolas,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--leading-none:1;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2;--shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,.25);--shadow-focus:0 0 0 3px rgba(43,142,217,.15);--z-base:0;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal-backdrop:1040;--z-modal:1050;--z-popover:1060;--z-tooltip:1070;--z-toast:1080;--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-base:200ms cubic-bezier(0.4,0,0.2,1);--transition-slow:300ms cubic-bezier(0.4,0,0.2,1);--transition-slower:500ms cubic-bezier(0.4,0,0.2,1);--ease-in:cubic-bezier(0.4,0,1,1);--ease-out:cubic-bezier(0,0,0.2,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--sidebar-width-collapsed:80px;--sidebar-width-expanded:280px;--header-height:64px;--header-height-mobile:56px;--card-width-sm:320px;--card-width-md:400px;--card-width-lg:600px;--breakpoint-sm:640px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1280px;--breakpoint-2xl:1536px}@media (prefers-color-scheme:dark){:root{--surface-primary:#1a1e25;--surface-secondary:#252931;--surface-tertiary:#2f3542;--surface-elevated:#3a3f4a;--text-primary:#eaeae8;--text-secondary:#b0aea9;--text-tertiary:#7f7d7a;--text-disabled:#5a5856;--text-inverse:#1a1e25;--border-light:#3a3f4a;--border-medium:#4a4f5a;--border-dark:#5a5f6a;--divider:#3a3f4a;--brand-primary:#3d9fe8;--brand-primary-dark:#1a85d9;--brand-primary-light:#6bb4ed;--brand-accent:#f49b3d;--brand-accent-warm:#f3b366;--brand-accent-light:#f7bd7f;--color-success:#3bb75d;--color-success-light:#1a3e27;--color-success-dark:#48d06f;--color-error:#eb4d5c;--color-error-light:#3e1b1f;--color-error-dark:#f16c78;--color-warning:#f7a720;--color-warning-light:#3e2f1a;--color-warning-dark:#f9ba4d;--color-info:#1fb4f5;--color-info-light:#1a3240;--color-info-dark:#4cc3f7;--feature-finance:#3bb75d;--feature-admin:#a855f7;--feature-documents:#1fb4f5;--feature-community:#f49b3d;--feature-messaging:#e879f9;--shadow-xs:0 1px 2px 0 rgba(0,0,0,.3);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.4),0 1px 2px 0 rgba(0,0,0,.3);--shadow-md:0 4px 6px -1px rgba(0,0,0,.4),0 2px 4px -1px rgba(0,0,0,.3);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.4),0 4px 6px -2px rgba(0,0,0,.3);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.4),0 10px 10px -5px rgba(0,0,0,.3);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,.5);--shadow-focus:0 0 0 3px rgba(61,159,232,.25)}}:root{--webos-bg-primary:#e8e8e8;--webos-bg-secondary:#f5f5f5;--webos-bg-tertiary:#fff;--webos-bg-elevated:#fafafa;--webos-bg-dark-primary:#403930;--webos-bg-dark-secondary:#080907;--webos-bg-dark-tertiary:#d0cec7;--webos-bg-dark-quaternary:#f0f0f0;--webos-text-primary:#1e1e1e;--webos-text-secondary:#666;--webos-text-tertiary:#999;--webos-text-disabled:#ccc;--webos-text-inverse:#fff;--webos-border-light:#e0e0e0;--webos-border-medium:#ccc;--webos-border-dark:#999;--webos-divider:#dedede;--webos-accent-primary:#06c;--webos-accent-selected:#403930;--webos-accent-active:#333;--webos-accent-hover:#f0f0f0;--webos-status-unread:#06c;--webos-status-important:#c00;--webos-status-success:#0a0;--webos-status-warning:#fa0;--webos-status-archived:#999;--webos-spacing-xs:4px;--webos-spacing-sm:8px;--webos-spacing-md:12px;--webos-spacing-lg:16px;--webos-spacing-xl:24px;--webos-spacing-2xl:32px;--webos-spacing-3xl:48px;--webos-radius-none:0;--webos-radius-sm:4px;--webos-radius-md:8px;--webos-radius-lg:12px;--webos-radius-full:9999px;--webos-font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--webos-font-mono:"SF Mono",Monaco,"Cascadia Code","Roboto Mono",Consolas,"Courier New",monospace;--webos-text-xs:11px;--webos-text-sm:13px;--webos-text-base:14px;--webos-text-lg:16px;--webos-text-xl:18px;--webos-text-2xl:24px;--webos-text-3xl:30px;--webos-font-normal:400;--webos-font-medium:500;--webos-font-semibold:600;--webos-font-bold:700;--webos-leading-none:1;--webos-leading-tight:1.25;--webos-leading-snug:1.375;--webos-leading-normal:1.5;--webos-leading-relaxed:1.625;--webos-leading-loose:2;--webos-shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);--webos-shadow-base:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);--webos-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--webos-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--webos-shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);--webos-z-base:0;--webos-z-dropdown:1000;--webos-z-sticky:1020;--webos-z-fixed:1030;--webos-z-modal-backdrop:1040;--webos-z-modal:1050;--webos-z-popover:1060;--webos-z-tooltip:1070;--webos-transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--webos-transition-base:200ms cubic-bezier(0.4,0,0.2,1);--webos-transition-slow:300ms cubic-bezier(0.4,0,0.2,1);--webos-transition-slower:500ms cubic-bezier(0.4,0,0.2,1);--webos-pane-narrow:240px;--webos-pane-medium:360px;--webos-pane-wide:100%;--webos-header-height:56px;--webos-footer-height:56px;--webos-toolbar-height:48px;--webos-list-item-sm:44px;--webos-list-item-md:56px;--webos-list-item-lg:72px;--webos-list-item-xl:88px;--webos-breakpoint-sm:640px;--webos-breakpoint-md:768px;--webos-breakpoint-lg:1024px;--webos-breakpoint-xl:1280px;--webos-breakpoint-2xl:1536px}@media (prefers-color-scheme:dark){:root{--webos-bg-primary:#1e1e1e;--webos-bg-secondary:#2a2a2a;--webos-bg-tertiary:#333;--webos-bg-elevated:#3a3a3a;--webos-text-primary:#fff;--webos-text-secondary:#ccc;--webos-text-tertiary:#999;--webos-text-disabled:#666;--webos-border-light:#3a3a3a;--webos-border-medium:#4a4a4a;--webos-border-dark:#5a5a5a;--webos-divider:#3a3a3a}}.webos-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:600;line-height:1.25;border-radius:4px;border:none;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);white-space:nowrap}.webos-button-light{background-color:#f5f5f5;color:#1e1e1e;border:1px solid #e0e0e0}.webos-button-light:hover:not(:disabled){background-color:#e8e8e8;border-color:#ccc}.webos-button-light:active:not(:disabled){background-color:#dedede;transform:translateY(1px)}.webos-button-medium{background-color:#ccc;color:#1e1e1e;border:1px solid #b3b3b3}.webos-button-medium:hover:not(:disabled){background-color:#b3b3b3;border-color:#999}.webos-button-medium:active:not(:disabled){background-color:#999;transform:translateY(1px)}.webos-button-affirmative{background-color:#0a0;color:#fff;border:1px solid #090}.webos-button-affirmative:hover:not(:disabled){background-color:#090;border-color:#080;box-shadow:0 2px 4px rgba(0,170,0,.2)}.webos-button-affirmative:active:not(:disabled){background-color:#080;transform:translateY(1px)}.webos-button-negative{background-color:#c00;color:#fff;border:1px solid #b00}.webos-button-negative:hover:not(:disabled){background-color:#b00;border-color:#a00;box-shadow:0 2px 4px rgba(204,0,0,.2)}.webos-button-negative:active:not(:disabled){background-color:#a00;transform:translateY(1px)}.webos-button-blue{background-color:#06c;color:#fff;border:1px solid #05b}.webos-button-blue:hover:not(:disabled){background-color:#05b;border-color:#04a;box-shadow:0 2px 4px rgba(0,102,204,.2)}.webos-button-blue:active:not(:disabled){background-color:#04a;transform:translateY(1px)}.webos-button:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.webos-dialog-overlay{position:fixed;inset:0;background-color:rgba(0,0,0,.5);z-index:var(--webos-z-modal-backdrop);animation:fadeIn .2s cubic-bezier(.4,0,.2,1)}.webos-dialog-content{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#f5f5f5;border-radius:8px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);z-index:var(--webos-z-modal);max-width:90vw;max-height:90vh;overflow:hidden;animation:slideIn .2s cubic-bezier(.4,0,.2,1)}.webos-dialog-header{padding:20px 24px;background-color:#fff;border-bottom:1px solid #e0e0e0}.webos-dialog-title{font-size:18px;font-weight:700;color:#1e1e1e;margin:0}.webos-dialog-body{padding:24px;color:#666;font-size:14px;line-height:1.5;overflow-y:auto;max-height:calc(90vh - 160px)}.webos-dialog-footer{padding:16px 24px;background-color:#fff;border-top:1px solid #e0e0e0;display:flex;justify-content:flex-end;gap:12px}.webos-list{background-color:#fff;border-radius:8px;overflow:hidden}.webos-list-section-header{padding:8px 16px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#06c;background-color:#f5f5f5;border-bottom:1px solid #e0e0e0}.webos-list-item{padding:12px 16px;border-bottom:1px solid #dedede;transition:background-color .15s cubic-bezier(.4,0,.2,1);cursor:pointer}.webos-list-item:last-child{border-bottom:none}.webos-list-item:hover{background-color:#f0f0f0}.webos-list-item.selected{background-color:#403930;color:#fff}.webos-list-item.unread{background-color:#0066cc05}.webos-list-item.unread:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#06c}.webos-notification-banner{position:fixed;top:32px;left:50%;transform:translateX(-50%);min-width:360px;max-width:480px;background:linear-gradient(135deg,#403930,#2a2520);color:#fff;padding:16px;border-radius:8px;box-shadow:0 10px 15px -3px rgba(0,0,0,.3),0 4px 6px -2px rgba(0,0,0,.2);z-index:var(--webos-z-tooltip);animation:slideDown .25s cubic-bezier(.4,0,.2,1)}.webos-notification-banner.dismissing{animation:slideUp .25s cubic-bezier(.4,0,.2,1)}.webos-segmented-control{display:inline-flex;background-color:#e8e8e8;border-radius:4px;padding:2px;gap:2px}.webos-segmented-control-item{padding:8px 16px;font-size:13px;font-weight:600;color:#666;background-color:transparent;border:none;border-radius:2px;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);white-space:nowrap}.webos-segmented-control-item:hover:not(.active){color:#1e1e1e;background-color:#dedede}.webos-segmented-control-item.active{color:#fff;background-color:#06c;box-shadow:0 2px 4px rgba(0,0,0,.1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translate(-50%,-48%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes slideDown{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}@keyframes slideUp{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}.webos-container{position:relative;width:100vw;height:100vh;overflow:hidden}.desktop-area,.webos-touchscreen{position:relative;width:100%;height:100%}.desktop-area{overflow:hidden}@media (max-width:768px){.webos-button{padding:12px 18px;font-size:15px}.webos-notification-banner{min-width:calc(100vw - 32px);max-width:calc(100vw - 32px);left:16px;right:16px;transform:none}.webos-dialog-content{width:calc(100vw - 32px);max-width:calc(100vw - 32px)}}