:root{--green:#16705a;--ink:#193b30;--line:#e7eeea;--muted:#93a298}body.app-shell{background:#f5f7f9;font-size:14px;color:var(--ink)}.app-shell .app-header{margin-right:258px;height:78px;padding:0 38px;border-bottom:1px solid var(--line)}.header-title{font-size:13px;color:#7e9185}.header-actions{display:flex;align-items:center;gap:18px}.header-date{font-size:11px;color:#9eaca2}.app-shell main.app-main{max-width:1600px;margin:0 258px 0 0;padding:34px 38px;min-height:calc(100vh - 78px)}.sidebar{position:fixed;right:0;top:0;bottom:0;width:258px;background:white;border-left:1px solid var(--line);z-index:50;display:flex;flex-direction:column;padding:28px 18px 0;overflow-y:auto;transition:transform .2s}.brand{display:flex;align-items:center;gap:10px;padding:0 12px 25px;font-size:31px;font-weight:900;line-height:1.3}.brand small{display:block;font-size:10px;color:#9aaba0;font-weight:400;margin-top:5px}.brand-dot{color:#a6b775}.brand-symbol{width:44px;height:48px;border-radius:14px;background:#143f34;color:white;display:flex;align-items:center;justify-content:center;font-size:32px}.workspace-switch{background:#f8faf9;border:1px solid var(--line);border-radius:11px;padding:12px;display:flex;align-items:center;gap:10px;margin:3px 0 26px}.workspace-avatar{background:#e4ede7;color:#5f866e;width:35px;height:35px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:bold}.workspace-switch b{font-size:12px}.workspace-switch small,.sidebar-user small{display:block;font-size:10px;color:#a0ada3}.online-dot{width:6px;height:6px;border-radius:50%;display:inline-block;background:#51a987}.workspace-switch>.online-dot{margin-right:auto}.nav-caption{font-size:10px;color:#a4b0a6;padding:0 15px;margin-bottom:11px}.side-nav{display:flex;flex-direction:column;align-items:stretch;gap:5px}.side-link{display:flex;align-items:center;gap:12px;padding:12px 14px;color:#819286;border-radius:9px;font-size:12px;min-height:46px}.side-link:hover{background:#f4f8f5;color:var(--green)}.side-link.active{color:var(--green);background:#eaf4ef;font-weight:bold;position:relative}.side-link.active:before{content:'';position:absolute;right:-18px;top:10px;bottom:10px;background:var(--green);width:3px;border-radius:3px}.nav-count{margin-right:auto;font-size:10px;background:white;padding:0 7px;border-radius:5px}.side-nav>.nav-caption{margin-top:24px}.new-subscriber{border:1px dashed #c9dfd1;margin:12px 0 5px;color:var(--green);justify-content:center}.sidebar-bottom{margin-top:auto;padding-top:30px}.sidebar-tip{font-size:10px;color:#9cac9f;padding:15px 10px;border-bottom:1px solid var(--line)}.sidebar-tip .online-dot{margin-left:5px}.sidebar-user{display:flex;align-items:center;gap:10px;padding:20px 0}.sidebar-user b{font-size:11px}.sidebar-user form{margin-right:auto}.user-avatar,.person-avatar{width:38px;height:38px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:#eaf3ef;color:var(--green);font-weight:bold;flex-shrink:0}.logout-button{padding:5px!important;background:transparent!important;color:#9caea1!important;margin:0!important}.eyebrow{font-size:10px;color:#a0afa3;margin-bottom:7px}.eyebrow span{margin:0 8px;color:#bec9c0}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:27px}.app-shell h1{font-size:27px;margin:4px 0 7px;letter-spacing:-.7px}.page-heading p{font-size:12px;margin:0;color:#95a499}.app-shell h2{font-size:16px;margin:0 0 5px;line-height:1.7}.app-shell h3{font-size:13px;margin:0}.app-shell .button,.app-shell button{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:bold;padding:11px 17px;background:var(--green);border-radius:8px;line-height:1.7}.app-shell .secondary{color:#60816d;background:#edf4f0}.app-shell .card{border:1px solid var(--line);box-shadow:0 3px 10px #183d3502;border-radius:13px;padding:23px}.app-shell .card p{font-size:12px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:25px}.metric{border:1px solid var(--line);background:white;border-radius:12px;padding:20px}.metric-label{display:flex;justify-content:space-between;align-items:center;color:#8d9f91;font-size:11px;gap:8px}.metric-icon{display:inline-flex;align-items:center;justify-content:center;width:35px;height:35px;border-radius:9px;background:#eef6f2;color:#6a9c7c;flex-shrink:0}.metric strong{font-size:32px;font-weight:bold;display:block;line-height:1.4;margin:11px 0 7px}.metric small{font-size:10px;color:#a5b3a7}.metric .storage-number{font-size:25px}.metric .storage-number small{font-size:13px}.overview-columns{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(240px,1fr);gap:22px;margin-bottom:24px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:19px}.section-heading p{margin:0;color:#a6b3a8;font-size:11px!important}.text-link{font-size:11px;color:var(--green);font-weight:bold;white-space:nowrap}.table-scroll{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;text-align:right;font-size:11px;white-space:nowrap}.data-table th{background:#f9fbfa;color:#a1afa3;font-size:10px;font-weight:400;padding:12px}.data-table td{border-bottom:1px solid #f0f3f1;padding:17px 12px;vertical-align:top}.data-table tr:last-child td{border-bottom:0}.person-cell{display:flex;align-items:center;gap:10px}.person-avatar{width:33px;height:33px;border-radius:9px;font-size:13px}.person-cell small{display:block;color:#a7b3aa;font-size:10px;margin-top:3px;text-align:right}.table-id{display:block;color:#b3beb5;font-size:9px;margin-top:4px}.plan-chip{font-size:10px;background:#f2f5f3;color:#839688;padding:4px 8px;border-radius:5px}.status-pill{display:inline-flex;gap:5px;align-items:center;padding:3px 8px;border-radius:5px;font-size:10px;white-space:nowrap}.is-active{color:#5b9b71;background:#edf7ee}.is-expired{color:#b39960;background:#fcf5e7}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor}.dot.green{color:#78ae89}.dot.amber{color:#c8af75}.data-table time{color:#a1aea3;font-size:10px}.quick-card{background:#eff5f0!important;display:flex;flex-direction:column;align-items:flex-start}.feature-icon{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:#e1ede4;color:#669473;border-radius:12px;margin-bottom:15px}.quick-card h2{font-size:22px!important;line-height:1.6}.quick-card p{color:#94a797;margin-bottom:20px}.quick-card .button{width:100%;margin-bottom:22px}.quick-summary{width:100%;margin-top:auto;padding-top:17px;border-top:1px solid #dce9dd;display:flex;flex-direction:column;gap:12px;font-size:10px;color:#9cac9d}.quick-summary span{display:flex;justify-content:space-between;gap:10px}.quick-summary b{color:#68896c}.activity-row{display:flex;align-items:center;gap:13px;padding:15px 2px;border-bottom:1px solid #f0f4f1;font-size:11px}.activity-row:last-child{border-bottom:0}.activity-row small{display:block;color:#acb8ae;font-size:10px}.activity-row time{margin-right:auto;font-size:10px;color:#a1ada6}.activity-dot{width:8px;height:8px;border:2px solid #c8ddce;background:#f5faf6;border-radius:50%;margin:0 8px}.subtle-badge{font-size:10px;color:#9cab9d;background:#f2f6f3;padding:5px 9px;border-radius:6px}.empty-state{text-align:center;padding:40px 20px;color:#aebbb0}.empty-state>.feature-icon{margin-left:auto;margin-right:auto}.empty-state>svg{width:36px;height:36px;color:#b3c7b9;margin-bottom:10px}.empty-state h3{color:#74917a;font-size:15px!important}.empty-state p{font-size:11px;color:#a9b6aa;margin:8px 0 17px}.mini-metrics{display:flex;gap:28px;font-size:11px;color:#9bac9d;margin-bottom:22px}.mini-metrics b{color:#537858;margin-right:7px}.mini-metrics i{margin-left:4px}.filter-bar{display:flex;align-items:center;gap:10px;margin-bottom:20px}.search-field{display:flex;align-items:center;gap:8px;background:#fafcfb;border:1px solid var(--line);border-radius:8px;padding:0 12px;flex:1}.search-field svg{width:17px;color:#aebcb0}.app-shell .search-field input{border:0;background:transparent;padding:11px 0;min-width:100px}.filter-bar select{width:auto;min-width:130px}.app-shell .filter-bar button{margin:0}.app-shell input,.app-shell textarea,.app-shell select{border:1px solid #e2e9e4;border-radius:7px;background:#fcfdfc;font-size:12px;padding:11px;color:#5d7962;line-height:1.8;outline:none}.app-shell input:focus,.app-shell textarea:focus,.app-shell select:focus{border-color:#86b092;box-shadow:0 0 0 3px #e7f2eb}.app-shell label{font-size:11px;color:#819984;margin:16px 0 0}.app-shell label input,.app-shell label select,.app-shell label textarea{display:block;margin-top:7px}.app-shell label small{display:block;font-size:10px;color:#afbbaf;margin-top:4px}.app-shell em{font-style:normal;color:#b9a083}.create-layout{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(240px,1fr);gap:24px}.form-section-title{display:flex;align-items:center;gap:12px}.form-section-title>span{width:34px;height:34px;background:#eff5f0;color:#8cad91;font-size:11px;border-radius:9px;display:flex;align-items:center;justify-content:center}.form-section-title p{margin:0;font-size:10px!important;color:#aeb9b0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.full-width{grid-column:1/-1}.divided{padding-top:23px;border-top:1px solid var(--line);margin-top:25px}.form-footer{display:flex;gap:12px;border-top:1px solid var(--line);padding-top:22px;margin-top:28px;align-items:center}.form-footer button{margin:0}.plan-preview{background:#143f34;color:white;border-radius:13px;padding:27px}.plan-preview .subtle-badge{background:#2a5246;color:#b4cbbd}.plan-preview h2{font-size:28px;margin-top:20px}.plan-preview p{font-size:11px;color:#a5bdb0}.plan-preview>div{display:flex;justify-content:space-between;font-size:11px;border-top:1px solid #386051;padding:18px 0}.plan-preview>div span{color:#a3bdaf}.help-note{display:flex;align-items:flex-start;gap:12px;padding:22px 10px;color:#a0afa5}.help-note svg{flex-shrink:0;margin-top:4px}.help-note p{font-size:11px;margin:0}.plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.plan-card h2{font-size:22px;margin-top:12px}.plan-price{font-size:28px;color:#537b56;margin:10px 0 20px}.plan-price small{font-size:11px;color:#a1ada5}.renew-details summary{list-style:none;font-size:10px}.renew-form{background:#f6f9f7;padding:14px;border-radius:8px;margin-top:12px;min-width:210px}.renew-form label:first-child{margin:0}.customer-columns{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(250px,1fr);gap:24px}.project-row{display:flex;align-items:center;gap:13px;padding:19px 0;border-bottom:1px solid var(--line);font-size:12px}.project-row:last-child{border-bottom:0}.project-icon{width:42px;height:42px;background:#eff5ef;color:#91ac8e;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.project-row>div{flex:1}.project-row small{display:block;font-size:10px;color:#b0bcaf;margin-top:4px}.project-row>svg{width:15px;color:#a0b2a5}.full-button{width:100%}.subscription-mini{display:flex;align-items:center;gap:13px;margin-top:20px;background:#edf4ed;border:1px solid #e0ecdf;border-radius:12px;padding:18px;font-size:12px}.subscription-mini>div{flex:1}.subscription-mini small{display:block;font-size:10px;color:#a5b59b;margin-top:4px}.subscription-facts{display:grid;grid-template-columns:repeat(3,1fr);margin:28px 0;gap:12px}.subscription-facts>div{background:#f6faf6;border:1px solid var(--line);padding:17px;border-radius:9px}.subscription-facts small{display:block;font-size:10px;color:#a2b29c}.subscription-facts strong{font-size:24px;color:#5d7b53}.detail-line{display:flex;justify-content:space-between;font-size:12px;border-bottom:1px solid var(--line);padding:16px 0}.detail-line span{color:#a0af9f}.app-shell progress{height:5px;display:block;border:0;border-radius:9px;background:#edf3ef;margin:9px 0}.app-shell .foot{font-size:10px;color:#b4beb7;margin:35px 0 0}.app-shell .notice{font-size:12px;border:1px solid #dcebdc;border-radius:9px;background:#eff7ed}.mobile-menu{display:none!important}.sidebar-backdrop{display:none}.app-shell .top{gap:20px}.app-shell .pagination{font-size:11px;color:#8ea488}.app-shell .pagination nav{display:block}.app-shell .pagination nav>div{margin-top:12px}
@media(min-width:1600px){.app-shell main.app-main{padding:42px 55px}.app-shell .app-header{padding:0 55px}}
@media(max-width:1150px){.sidebar{width:225px;padding-left:14px;padding-right:14px}.app-shell .app-header{margin-right:225px;padding:0 25px}.app-shell main.app-main{margin-right:225px;padding:28px 25px}.metric-grid{gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.overview-columns,.customer-columns{grid-template-columns:minmax(0,1fr)}.overview-columns>.quick-card{display:none}.create-layout{grid-template-columns:minmax(0,1fr) 230px}.app-shell .split{grid-template-columns:minmax(0,1fr)}}
@media(max-width:850px){.sidebar{transform:translateX(100%);width:258px}.app-shell .app-header{margin-right:0;padding:0 22px;height:66px}.app-shell main.app-main{margin-right:0;padding:24px 20px}.mobile-menu{display:inline-flex!important;background:transparent!important;color:#537952!important;padding:5px!important}.header-date{display:none}.header-title{font-size:12px}.app-shell.sidebar-open .sidebar{transform:translateX(0)}.app-shell.sidebar-open .sidebar-backdrop{display:block;position:fixed;inset:0;background:#12332966;z-index:49}.app-shell.sidebar-open{overflow:hidden}.page-heading{align-items:flex-start}.page-heading h1{font-size:24px}.page-heading p{font-size:11px}.page-heading>.button{padding:10px 12px;flex-shrink:0}.create-layout{grid-template-columns:1fr}.create-layout>aside{order:-1}.plan-preview{padding:20px}.plan-preview>div{padding:9px 0}.plan-preview h2{font-size:22px;margin-top:10px}.plan-preview p,.help-note{display:none}.plan-grid{grid-template-columns:1fr}.activity-row time{font-size:9px}.mini-metrics{gap:16px;flex-wrap:wrap}}
@media(max-width:500px){.app-shell main.app-main{padding:20px 14px}.app-shell .card{padding:18px 15px}.metric{padding:16px}.metric-grid{gap:10px}.metric-label{font-size:10px}.metric-icon{width:29px;height:29px}.metric strong{font-size:27px}.metric small{font-size:9px}.page-heading{gap:12px}.page-heading h1{font-size:22px}.page-heading>.button{font-size:10px;padding:9px}.page-heading p{max-width:235px}.filter-bar{flex-wrap:wrap}.filter-bar .search-field{flex-basis:100%}.filter-bar select{flex:1}.form-grid{grid-template-columns:1fr}.form-footer{flex-wrap:wrap}.form-footer button{width:100%}.subscription-facts{grid-template-columns:1fr}.activity-row{gap:9px}.activity-row time{max-width:75px;text-align:left}.project-row{gap:9px}.project-row .status-pill{font-size:9px}.header-actions{gap:10px}.app-shell .top{flex-wrap:wrap}.app-shell .grid{grid-template-columns:1fr}}