:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}body,html,#root,.app-container{margin:0;padding:0;min-height:100vh;font-family:Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(135deg,#e0e7ff,#f7f9fb);color:#232946}.app-container{display:flex;flex-direction:column;min-height:100vh}.header{background:#232946;color:#fff;padding:1.2rem 2.5rem;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 16px #23294614;position:sticky;top:0;z-index:10}.logo{font-size:2rem;font-weight:800;letter-spacing:2px;color:#eebbc3;text-shadow:0 2px 8px rgba(35,41,70,.08)}.nav{display:flex;gap:2rem}.nav a{color:#fff;text-decoration:none;font-weight:600;font-size:1.08rem;padding:.3rem .7rem;border-radius:6px;transition:background .2s,color .2s,box-shadow .2s}.nav a:hover{background:#eebbc3;color:#232946;box-shadow:0 2px 8px #eebbc326}.main-content{flex:1;padding:2.5rem 1rem 2rem;max-width:950px;margin:0 auto;width:100%}.section{background:#fff;border-radius:18px;box-shadow:0 4px 24px #23294612;padding:2rem 2rem 1.2rem;margin-bottom:2.5rem;transition:box-shadow .2s;position:relative}.section:hover{box-shadow:0 8px 32px #23294621}.section h2{margin-top:0;color:#232946;font-size:1.5rem;font-weight:700;letter-spacing:1px;margin-bottom:.7rem}.section.important{border-left:7px solid #ff595a;background:#fff0f0}.section ul{padding-left:1.2rem;margin:.5rem 0 0}.section ul li{margin-bottom:.5rem;font-size:1.08rem}.section a{color:#232946;text-decoration:underline;transition:color .2s}.section a:hover{color:#eebbc3}button{background:linear-gradient(90deg,#eebbc3,#a3cef1);color:#232946;border:none;border-radius:8px;padding:.7rem 1.5rem;font-size:1.08rem;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #23294614;transition:background .2s,color .2s,box-shadow .2s}button:hover{background:linear-gradient(90deg,#a3cef1,#eebbc3);color:#232946;box-shadow:0 4px 16px #a3cef126}.calendar-placeholder{background:#e0e7ff;border-radius:10px;padding:2rem;text-align:center;color:#232946;font-weight:600;font-size:1.1rem;margin-top:.5rem}.main-header{position:fixed;top:0;left:0;width:100vw;height:60px;background:#232946;color:#eebbc3;display:flex;align-items:center;justify-content:center;z-index:100;box-shadow:0 2px 8px #23294614;font-size:1.7rem;font-weight:800;letter-spacing:2px}.header-title{font-family:Inter,Segoe UI,Arial,sans-serif}.app-3col-layout{display:flex;min-height:100vh;width:100vw;background:linear-gradient(135deg,#e0e7ff,#f7f9fb);box-sizing:border-box;padding-top:60px}.sidebar{width:260px;min-width:180px;max-width:320px;background:#232946;color:#fff;padding:2rem 1rem 1rem;display:flex;flex-direction:column;gap:2rem;min-height:100vh;box-shadow:2px 0 16px #23294612;box-sizing:border-box}.sidebar.left-sidebar{transition:width .3s,min-width .3s,max-width .3s,padding .3s;position:relative;overflow:visible}.sidebar.left-sidebar .sidebar-toggle{position:absolute;top:50%;left:100%;transform:translateY(-50%) translate(8px);z-index:30;background:#fff;color:#232946;border:2px solid #eebbc3;border-radius:50%;width:36px;height:36px;font-size:1.3rem;font-weight:700;cursor:pointer;box-shadow:0 2px 8px #2329461a;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s,border .2s}.sidebar.left-sidebar .sidebar-toggle:hover{background:#eebbc3;color:#232946;border:2px solid #a3cef1}.sidebar.left-sidebar.collapsed .sidebar-toggle{left:100%;transform:translateY(-50%) translate(8px)}.sidebar.left-sidebar.collapsed{width:48px!important;min-width:48px!important;max-width:48px!important;padding-left:.2rem;padding-right:.2rem;overflow:visible}.sidebar.left-sidebar .sidebar-toggle{left:100%;right:auto;top:12px;margin-left:-16px;z-index:20}.sidebar.left-sidebar.collapsed h3,.sidebar.left-sidebar.collapsed .sidebar-list{opacity:0;visibility:hidden;height:0;pointer-events:none;transition:opacity .2s,visibility .2s}.sidebar.left-sidebar h3,.sidebar.left-sidebar .sidebar-list{opacity:1;visibility:visible;transition:opacity .2s,visibility .2s}.sidebar-toggle{position:absolute;top:12px;right:-18px;z-index:10;background:#eebbc3;color:#232946;border:none;border-radius:50%;width:32px;height:32px;font-size:1.2rem;font-weight:700;cursor:pointer;box-shadow:0 2px 8px #23294614;transition:background .2s,color .2s}.sidebar-toggle:hover{background:#a3cef1;color:#232946}.left-sidebar{border-top-right-radius:24px;border-bottom-right-radius:24px}.right-sidebar{border-top-left-radius:24px;border-bottom-left-radius:24px}.sidebar.right-sidebar{width:420px;min-width:320px;max-width:480px;box-sizing:border-box}.sidebar h3{margin-top:0;font-size:1.2rem;color:#eebbc3;letter-spacing:1px}.sidebar-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1rem}.sidebar-btn{background:linear-gradient(90deg,#eebbc3,#a3cef1);color:#232946;border:none;border-radius:8px;padding:.6rem 1.2rem;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #23294614;transition:background .2s,color .2s,box-shadow .2s}.sidebar-btn:hover{background:linear-gradient(90deg,#a3cef1,#eebbc3);color:#232946;box-shadow:0 4px 16px #a3cef126}.main-center{flex:1 1 0;min-width:0;padding:2.5rem 2rem 2rem;display:flex;flex-direction:column;gap:2rem;box-sizing:border-box}.company-info{background:#fff;border-radius:18px;box-shadow:0 4px 24px #23294612;padding:2rem;margin-bottom:1.5rem;width:100%;box-sizing:border-box}.widget-placeholder{background:#f7f9fb;border-radius:14px;box-shadow:0 2px 8px #2329460a;padding:1.5rem;min-height:120px;width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;box-sizing:border-box}.widget-add-placeholder{color:#a3cef1;font-size:1.1rem;margin-top:.5rem}.calendar-section,.tasks-section,.hr-section{background:#fff;color:#232946;border-radius:14px;box-shadow:0 2px 8px #2329460a;padding:1.2rem 1rem 1rem;margin-bottom:1.2rem}.calendar-section h3,.tasks-section h3,.hr-section h3{color:#232946;margin-top:0;font-size:1.1rem}.calendar-mini{background:#e0e7ff;border-radius:10px;padding:1rem;text-align:center;color:#232946;font-weight:600;font-size:1rem;margin-top:.5rem}.task-filter{display:flex;gap:.5rem;margin-bottom:.7rem}.filter-btn{background:#eebbc3;color:#232946;border:none;border-radius:6px;padding:.3rem .9rem;font-size:.98rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s}.filter-btn:hover{background:#a3cef1;color:#232946}.tasks-list{list-style:disc inside;margin:0;padding-left:1.2rem;color:#232946}.hr-section ul{list-style:none;padding:0;margin:.5rem 0 0}.hr-section ul li{margin-bottom:.5rem}.hr-section a{color:#232946;text-decoration:underline;transition:color .2s}.hr-section a:hover{color:#eebbc3}.company-details{margin-top:1rem;font-size:1.08rem;color:#232946;background:#f7f9fb;border-radius:10px;padding:1rem 1.2rem;box-shadow:0 1px 4px #2329460a}.filter-dropdown{width:100%;padding:.4rem .7rem;border-radius:6px;border:1px solid #eebbc3;font-size:1rem;font-weight:600;background:#fff;color:#232946;margin-bottom:.7rem;transition:border .2s}.filter-dropdown:focus{outline:none;border:1.5px solid #a3cef1}.company-updates{background:#fff;border-radius:18px;box-shadow:0 4px 24px #23294612;padding:2rem;margin-bottom:1.5rem;width:100%;box-sizing:border-box}.updates-list{margin:1rem 0 0;padding:0;list-style:none}.updates-list li{padding:.7rem 1rem;margin-bottom:.5rem;border-radius:8px;background:#f7f9fb;font-size:1.08rem;box-shadow:0 1px 4px #2329460a;display:flex;align-items:center;gap:.7rem}.update-employee{border-left:5px solid #a3cef1}.update-sheet{border-left:5px solid #eebbc3}.update-task{border-left:5px solid #ff595a}.update-meeting{border-left:5px solid #232946}.update-promotion{border-left:5px solid #ffd166}.sample-widget{margin-top:2rem;background:#fff;border-radius:14px;box-shadow:0 2px 8px #2329460a;padding:1.5rem 1.2rem;width:100%;max-width:400px}.sample-widget h4{margin:0 0 1rem;font-size:1.1rem;color:#232946}.bar-chart{display:flex;flex-direction:column;gap:1.1rem}.bar-row{display:flex;align-items:center;gap:1rem}.bar-label{min-width:120px;font-size:1rem;color:#232946}.bar-outer{flex:1;background:#e0e7ff;border-radius:8px;height:28px;display:flex;align-items:center;position:relative}.bar-inner{height:28px;border-radius:8px;display:flex;align-items:center;padding-left:.7rem;font-weight:600;color:#232946;transition:width .3s;position:relative}.bar-value{position:absolute;right:10px;font-size:1rem;color:#232946}.improved-task-section{background:#fff;border-radius:14px;box-shadow:0 2px 8px #23294612;padding:1.2rem 1rem 1rem;margin-bottom:1.2rem;display:flex;flex-direction:column}.task-section-flex{display:flex;gap:1.2rem;align-items:flex-start}.task-mini-sidebar{min-width:100px;max-width:120px;background:#e0e7ff;border-radius:8px;padding:.7rem .5rem;font-size:.98rem;color:#232946;box-shadow:0 1px 4px #2329460a;margin-right:.5rem;display:flex;flex-direction:column;align-items:flex-start;border:1px solid #a3cef1}.task-mini-sidebar strong{margin-bottom:.5rem;font-size:1.05rem;color:#232946}.task-mini-sidebar ul{list-style:none;padding:0;margin:.5rem 0 0;width:100%}.task-mini-sidebar li{margin-bottom:.3rem;width:100%}.task-mini-sidebar a{color:#232946;text-decoration:underline;font-size:.97rem;transition:color .2s;display:block;width:100%;padding:.2rem .3rem;border-radius:4px}.task-mini-sidebar a:hover{color:#eebbc3;background:#fff}.task-main-content{flex:1;background:#f7f9fb;border-radius:8px;padding:.7rem 1rem;min-width:0}.tasks-list{margin-top:.7rem;padding:0;list-style:none;display:flex;flex-direction:column;gap:.7rem}.tasks-list li{background:#fff;border-radius:8px;box-shadow:0 1px 4px #23294612;padding:.7rem 1rem;font-size:1.05rem;color:#232946;transition:background .2s,box-shadow .2s;cursor:pointer;border-left:4px solid #a3cef1;display:flex;align-items:center}.tasks-list li:hover{background:#e0e7ff;box-shadow:0 2px 8px #23294621}.calendar-widget{max-width:380px;margin-left:auto;margin-right:auto;padding:1.2rem 1rem 1.5rem;box-sizing:border-box}.calendar-header{text-align:center;font-weight:700;color:#232946;margin-bottom:.5rem;font-size:1.08rem}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.2rem}.calendar-day{text-align:center;padding:.3rem 0;font-size:.98rem;border-radius:6px;color:#232946;background:#f7f9fb}.calendar-day-label{font-weight:700;background:#e0e7ff;color:#232946}.calendar-today{background:#eebbc3!important;color:#232946!important;font-weight:700;border:2px solid #a3cef1}.calendar-empty{background:transparent!important;color:transparent!important;border:none!important}@media (max-width: 900px){.improved-task-section{padding:.7rem .2rem}.task-main-content{padding:.5rem}}@media (max-width: 1200px){.sidebar{width:180px;padding:1.2rem .5rem 1rem}.main-center{padding:1.2rem .5rem 1rem}.sidebar.right-sidebar{width:100vw;min-width:unset;max-width:unset}.calendar-widget{max-width:100%;padding:.7rem .2rem 1rem}}@media (max-width: 900px){.app-3col-layout{flex-direction:column;width:100vw}.sidebar{width:100vw;min-width:unset;max-width:unset;min-height:unset;flex-direction:row;gap:1.5rem;border-radius:0;box-shadow:none;padding:1rem .5rem;justify-content:flex-start;align-items:flex-start}.left-sidebar,.right-sidebar{border-radius:0}.main-center{padding:1rem .5rem}.main-header{font-size:1.2rem;height:48px;padding:0 .5rem}.app-3col-layout{padding-top:48px}.sidebar-toggle{top:6px;right:-14px;width:26px;height:26px;font-size:1rem}.sidebar.left-sidebar.collapsed{width:48px!important;min-width:48px!important;max-width:48px!important;padding:.5rem .1rem}.sidebar.left-sidebar .sidebar-toggle{top:6px;margin-left:-13px;width:26px;height:26px;font-size:1rem}.sidebar.left-sidebar .sidebar-toggle{width:28px;height:28px;font-size:1.1rem;left:100%;transform:translateY(-50%) translate(4px)}}@media (max-width: 700px){.header{flex-direction:column;align-items:flex-start;gap:.7rem;padding:1rem 1.2rem}.main-content{padding:1.2rem .3rem 1rem}.section{padding:1.1rem .7rem .7rem}.nav{gap:.7rem;flex-wrap:wrap}.logo{font-size:1.3rem}.main-center{padding:.7rem .2rem .5rem}.sidebar{flex-direction:column;gap:1rem;padding:1rem .3rem;width:100vw}}@media (max-width: 500px){.main-center,.company-info,.widget-placeholder{padding:.5rem!important}.sidebar{padding:.5rem .1rem}}@media (max-width: 400px){.logo{font-size:1rem}.section h2{font-size:1.1rem}}