:root{--brand:#127c6d;--bg:#f5f7f8;--ink:#23323c;--muted:#73818c;--line:#e6ebee}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:9px 15px;background:#fff;color:var(--ink)}button:hover{border-color:var(--brand);color:var(--brand)}button:disabled{opacity:.5;cursor:wait}.primary{background:var(--brand);border-color:var(--brand);color:#fff}.primary:hover{color:#fff;filter:brightness(.95)}.secondary{background:#f3f6f7}.danger{color:#b94c4c}.wide{width:100%}.icon{border:0;padding:3px 10px;font-size:24px}.shell{display:grid;grid-template-columns:216px 1fr;min-height:100vh}.sidebar{background:#fff;border-right:1px solid var(--line);padding:28px 18px;display:flex;flex-direction:column;gap:8px}.logo{font-weight:750;font-size:25px;letter-spacing:1px;display:flex;align-items:center;gap:10px}.rabbit{color:var(--brand);font-size:32px;line-height:1}.tagline{color:var(--muted);font-size:12px;margin:2px 0 30px}.nav{border:0;text-align:left;color:#6a7782;background:transparent;padding:12px 14px}.nav.active{background:color-mix(in srgb,var(--brand) 8%,white);color:var(--brand);font-weight:600}.sidebar footer{margin-top:auto;font-size:12px;color:var(--muted);padding:22px 10px}.workspace{min-width:0}.topbar{background:#fff;border-bottom:1px solid var(--line);height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;gap:16px}.topbar small{display:block;color:var(--muted)}.topbar .actions{margin:0}.environment{color:#7c704e;background:#faf7ef;font-size:12px;padding:8px 38px;border-bottom:1px solid #eee9dd}.content{padding:30px 38px 70px;max-width:1450px}.page-head{display:flex;justify-content:space-between;align-items:center;margin:0 0 24px;gap:12px}h1{font-size:25px;letter-spacing:.5px;margin:0}h2{font-size:18px;margin:0 0 16px}h3{font-size:15px;margin:0}.muted{color:var(--muted)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.metric{padding:22px;background:#fff;border:1px solid var(--line);border-radius:12px}.metric b{display:block;font-size:28px;font-weight:650;margin-top:8px;letter-spacing:-.5px}.metric:first-child b{color:var(--brand)}.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.row{display:flex;align-items:center;justify-content:space-between;gap:16px}.list-row{padding:16px 0;border-bottom:1px solid var(--line)}.list-row:last-child{border:0}.amount{font-size:20px;font-weight:650;font-variant-numeric:tabular-nums}.badge{font-size:12px;padding:4px 9px;border-radius:5px;color:#856935;background:#faf5e9;white-space:nowrap}.badge.paid{background:#edf7f1;color:#307556}.badge.failed,.badge.rejected{background:#fff1f1;color:#b64b4b}.badge.processing{background:#eef4fc;color:#3c6b9a}.empty{padding:35px;text-align:center;color:var(--muted)}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{font-size:12px;font-weight:500;color:var(--muted);background:#f8fafb}td,th{padding:13px 14px;border-bottom:1px solid var(--line)}.link{border:0;color:var(--brand);padding:3px 0;background:transparent}.filters{display:flex;gap:12px;flex-wrap:wrap;align-items:end;margin-bottom:24px}.filters label{margin:0;min-width:150px}label{display:block;font-size:13px;color:#586873;margin:0 0 16px}input,select,textarea{display:block;width:100%;border:1px solid #dce3e7;border-radius:7px;background:#fff;color:var(--ink);padding:10px 12px;margin-top:7px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 12%,white)}textarea{min-height:85px;resize:vertical}.check{display:flex;align-items:center;gap:8px}.check input{width:auto;margin:0}dialog{border:1px solid var(--line);border-radius:14px;width:500px;max-width:94vw;max-height:90vh;padding:26px;box-shadow:0 24px 80px #22334422}dialog::backdrop{background:#172a3e55}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dialog-head h2{margin:0}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#253841;color:white;padding:12px 22px;border-radius:10px;z-index:20;display:none}.error{color:#b34444}.notice{font-size:13px;background:#f7f9fa;padding:12px 16px;border-radius:8px;margin:16px 0;color:#697a85}.login{max-width:440px;margin:8vh auto;padding:35px}.login .tagline{margin-bottom:22px}.login button{margin-top:12px}.detail-value{font-size:32px;color:var(--brand)}.divider{border-top:1px solid var(--line);margin:20px 0}.swatches{display:flex;gap:12px}.swatch{border:3px solid white;width:38px;height:38px;border-radius:50%;box-shadow:0 0 0 1px #dce3e8;padding:0}.tiny{font-size:12px}.mobile-nav{display:none}.check-grid{display:grid;grid-template-columns:1fr 1fr}.stack{display:flex;flex-direction:column;gap:4px}.preview-mode .shell{max-width:440px;margin:0 auto;display:block;border:1px solid var(--line);min-height:100vh}.preview-mode .sidebar{display:none}.preview-mode .topbar{padding:16px;height:auto}.preview-mode .environment{padding:8px 16px}.preview-mode .content{padding:22px 16px 90px}.preview-mode .metrics{grid-template-columns:1fr 1fr;gap:10px}.preview-mode .metric{padding:16px}.preview-mode .metric b{font-size:23px}.preview-mode .grid{display:block}.preview-mode .mobile-nav{display:flex;position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(440px,100%);background:white;border-top:1px solid var(--line);z-index:5;justify-content:space-around;padding:8px 3px}.preview-mode .mobile-nav button{font-size:12px;padding:8px 5px;text-align:center}.preview-mode .card{padding:18px}
.rabbit{position:relative;display:inline-block;width:26px;height:23px;border:2px solid var(--brand);border-radius:11px 11px 9px 9px;font-size:0;margin-top:13px;margin-right:2px}.rabbit::before,.rabbit::after{content:'';position:absolute;top:-14px;width:6px;height:15px;border:2px solid var(--brand);border-radius:8px;background:white}.rabbit::before{left:2px;transform:rotate(-15deg)}.rabbit::after{right:2px;transform:rotate(15deg)}
@media(max-width:760px){.shell{display:block}.sidebar{display:none}.topbar{padding:15px 18px;height:auto}.topbar .muted{font-size:12px}.environment{padding:8px 18px}.content{padding:24px 16px 90px}.metrics{grid-template-columns:1fr 1fr;gap:10px}.metric{padding:16px}.metric b{font-size:23px}.grid{display:block}.card{padding:18px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:white;border-top:1px solid var(--line);z-index:5;justify-content:space-around;padding:8px 3px}.mobile-nav button{font-size:12px;padding:8px 5px;text-align:center}h1{font-size:22px}.page-head{align-items:flex-start}.topbar .actions button{font-size:12px;padding:6px 9px}.login{margin:24px 16px}dialog{padding:22px}}
:root{--ink:#20323b;--muted:#5d707b;--line:#dfe7eb}.shell{grid-template-columns:238px 1fr}.sidebar{padding:30px 20px}.sidebar .nav{font-size:15px;padding:13px 16px}.sidebar .nav.active{border-left:3px solid var(--brand)}.content{max-width:1560px;padding:34px 36px 70px}.topbar{padding:0 36px}.topbar b{font-size:17px}.topbar small{font-size:12px}.environment{padding:8px 36px;background:#edf6f3;color:#356555}h1{font-size:28px}h2{font-size:19px}.page-head p{margin:8px 0 0}.section-tag{font-size:12px;font-weight:650;letter-spacing:1px;color:var(--brand);margin-bottom:8px}.task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:28px 0 20px}.task-card{text-align:left;padding:24px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 3px 12px #20323b03}.task-card:hover{box-shadow:0 6px 20px #127c6d10}.task-card h2{margin:7px 0 12px;font-size:19px}.task-card strong{font-size:38px;line-height:1.2;color:var(--ink)}.task-card small{font-size:14px;font-weight:400;color:var(--muted)}.task-card p{font-size:13px;color:var(--muted);margin:15px 0}.task-link{color:var(--brand);font-weight:600}.summary-strip{display:flex;gap:32px;flex-wrap:wrap;padding:14px 20px;margin-bottom:24px;border:1px solid var(--line);border-radius:10px;color:var(--muted);background:#eef3f4}.summary-strip b{color:var(--ink);font-size:18px}.business-table{white-space:normal}.business-table th{font-size:13px;font-weight:600}.business-table td{font-size:14px}.business-table td:first-child{min-width:170px}.business-table small{display:block;color:var(--muted);font-size:12px;margin-top:5px}.table-actions{display:flex;gap:8px;flex-wrap:wrap;min-width:120px}.table-actions button{padding:7px 10px;font-size:13px}.quick-links{display:flex;gap:12px;flex-wrap:wrap}.quick-links button{padding:12px 24px}.empty b{font-weight:400}.preview-mode .task-grid{grid-template-columns:1fr}.preview-mode .summary-strip{gap:12px}.preview-mode .business-table{min-width:650px}@media(max-width:900px){.task-grid{grid-template-columns:1fr}.task-card{padding:20px}.task-card strong{font-size:30px}.summary-strip{gap:14px}.content{padding:24px 18px 90px}.business-table{min-width:650px}}
.login-hub{max-width:1100px;margin:7vh auto;padding:24px}.login-hub .task-card button{width:100%;margin-top:12px}.mobile-nav{overflow-x:auto}.mobile-nav .nav{flex-shrink:0}.card .row p{margin:0 0 16px}
/* 依据2026-11-01设计原图：白底、单主色、紧凑后台 */
:root{--bg:#f4f7fa;--ink:#1f2937;--muted:#8792a2;--line:#e5ebf1}.shell{grid-template-columns:188px 1fr}.sidebar{padding:22px 13px;gap:4px;background:linear-gradient(#fff,#eef3f8);border-right:1px solid #e0e7ee}.sidebar .logo{font-size:22px;padding:0 9px}.sidebar .tagline{font-size:10px;margin:6px 9px 24px}.sidebar .nav{font-size:13px;padding:11px 12px;border-radius:6px}.sidebar .nav.active{border-left:0;background:var(--brand);color:white;box-shadow:0 3px 8px #127c6d15}.sidebar .nav:not(.active){color:#526071}.sidebar footer{font-size:10px}.topbar{height:62px;padding:0 28px}.topbar b{font-size:14px}.topbar small{font-size:11px}.topbar .actions button{font-size:12px;padding:7px 11px}.environment{background:#f9fbfc;color:#86909e;font-size:11px;padding:6px 28px}.content{max-width:1550px;padding:24px 28px 50px}h1{font-size:23px}h2{font-size:16px}.page-head{margin-bottom:19px}.page-head p{font-size:12px}.card{padding:21px;border-radius:10px;border-color:#e5ebf1;box-shadow:0 2px 8px #22334403}button{border-radius:6px;font-size:13px;padding:8px 13px}.overview-filters{display:flex;align-items:end;gap:22px;margin-bottom:22px;background:#fff;padding:15px 18px;border:1px solid var(--line);border-radius:9px}.overview-filters label{margin:0;display:flex;align-items:center;gap:12px;font-size:12px}.overview-filters input,.overview-filters select{margin:0;min-width:160px;width:auto;padding:7px 10px;font-size:12px}.overview-filters>button{margin-left:auto;color:var(--brand);border-color:var(--brand)}.metrics{gap:16px;margin-bottom:20px}.design-metrics .metric{border:0;padding:17px 20px;border-radius:9px}.design-metrics .metric .muted{color:#526071;font-size:12px}.design-metrics .metric b{font-size:27px;margin-top:5px}.design-metrics .paid{background:#eef9f2;color:#24ad64}.design-metrics .paid b{color:#24ad64}.design-metrics .waiting{background:#fff5ed;color:var(--brand)}.design-metrics .expense{background:#fff9eb;color:#d69a27}.design-metrics .peer{background:#edf4fd;color:#428de3}.chart-grid{gap:18px}.chart-grid .card{min-height:292px}.chart-grid h2{margin-bottom:7px}.donut-layout{display:flex;align-items:center;justify-content:space-around;gap:24px;margin-top:24px}.donut{width:160px;height:160px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}.donut>div{width:112px;height:112px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column}.donut span{font-size:11px;color:#8792a2}.donut b{font-size:21px;color:#1f2937}.chart-legend{flex:1;max-width:260px}.chart-legend>div{display:flex;align-items:center;gap:8px;margin:13px 0;font-size:12px}.chart-legend i{width:7px;height:7px;border-radius:50%;flex-shrink:0}.chart-legend b{margin-left:auto;font-weight:500}.trend{width:100%;height:180px;display:block;margin-top:12px}.trend text{font-size:10px;fill:#8792a2}th{font-size:12px;color:#667085;background:#f5f8fb;font-weight:550}td,th{padding:11px 12px}td{font-size:12px}.accent{color:var(--brand)}.filters{gap:8px}.filters button{font-size:12px}.business-table td{font-size:13px}.business-table .amount{font-size:17px}.preview-mode .overview-filters{flex-direction:column;align-items:stretch}.preview-mode .donut-layout{gap:12px}.preview-mode .donut{width:130px;height:130px}.preview-mode .donut>div{width:92px;height:92px}.preview-mode .chart-grid .card{min-height:0}@media(max-width:760px){.shell{display:block}.overview-filters{flex-wrap:wrap;gap:12px}.overview-filters>button{margin-left:0}.content{padding:20px 16px 90px}.donut-layout{gap:12px}.donut{width:135px;height:135px}.donut>div{width:98px;height:98px}.chart-legend>div{font-size:11px}.topbar{height:auto;padding:14px 16px}.environment{padding:6px 16px}}

/* 四张用户指定原稿：橙色品牌，紧凑侧栏与完整模块 */
.overview-actions{display:flex;justify-content:flex-end;gap:10px;margin-bottom:12px}.sidebar .tagline{color:var(--brand);font-size:11px}.sidebar .nav.active{background:linear-gradient(110deg,var(--brand),#ff923d);color:white}.sidebar .nav{margin-bottom:4px}.sidebar .logo{color:var(--brand)}.sidebar{background:linear-gradient(180deg,#fff,#eef2f6)}

.grant-section{border:1px solid #e6ebf0;border-radius:12px;margin:16px 0;padding:16px}.grant-section legend{color:var(--brand);font-weight:600}.grant-section input[type=checkbox]{accent-color:var(--brand)}

/* 紧凑员工工资日历与真正的三/四项底部导航 */
:root{--brand:#ff6a00}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.wage-tabs{display:flex;gap:8px;margin-bottom:14px}.wage-tabs button{flex:1}.wage-period{display:flex;align-items:center;justify-content:center;gap:14px;margin:8px 0 14px}.wage-period label{margin:0}.wage-period input{width:145px;margin:0;padding:6px 10px}.wage-period button{border:0;background:transparent;color:var(--brand);font-size:22px;padding:0 10px}.wage-totals{display:grid;grid-template-columns:1.3fr .8fr 1.2fr;gap:12px;margin:14px 0}.wage-totals>div{background:#fff;padding:12px 9px;border-radius:10px;border:1px solid var(--line)}.wage-totals small{font-size:11px;color:#718096}.wage-totals b{display:block;font-size:21px;white-space:nowrap;margin-top:4px}.wage-totals>div:first-child b{color:var(--brand)}.wage-totals b small{margin-left:3px}.wage-week,.wage-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.wage-week{text-align:center;color:#89929d;font-size:12px;margin-bottom:8px}.wage-day{min-height:88px;border:0;background:#f8fafc;padding:9px 3px;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:14px;min-width:0;overflow:hidden}.wage-day.blank{background:transparent}.wage-day.worked{background:#fff4eb}.wage-day.selected{outline:1px solid var(--brand);outline-offset:-1px}.wage-day b{font-size:12px;color:var(--brand);white-space:nowrap}.wage-day small{font-size:10px;color:#8b95a3}.wage-calendar{margin-bottom:8px}
@media(max-width:760px){.topbar{height:auto;min-height:60px;padding:10px 14px;gap:6px}.topbar>div:first-child{flex:1;min-width:0}.topbar b{font-size:13px}.topbar small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}.topbar .actions{gap:4px;flex-wrap:nowrap}.topbar .actions button{font-size:11px;padding:5px 7px;white-space:nowrap}.topbar [data-action="preview"],.topbar [data-action="logout"]{display:none}.environment{padding:4px 14px;font-size:10px}.content{padding:16px 12px 96px}.page-head{gap:8px;margin-bottom:14px}.page-head h1{font-size:19px}.page-head p{font-size:11px}.page-head>button{font-size:11px;padding:6px 8px}.mobile-nav{overflow:visible;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;padding:6px 4px calc(8px + env(safe-area-inset-bottom));min-height:62px}.mobile-nav .nav{margin:0;border:0;background:transparent;padding:3px 0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;color:#718096;min-width:0}.mobile-nav .nav>span{font-size:21px;line-height:24px;height:24px}.mobile-nav .nav small{font-size:11px;line-height:16px}.mobile-nav .nav.active{color:var(--brand);font-weight:650;background:transparent;box-shadow:none}.filters{gap:6px}.filters label{min-width:0;flex:1;font-size:11px}.filters input,.filters select{padding:6px;font-size:12px;min-width:0}.filters button{padding:6px 8px;font-size:11px}.overview-filters{padding:10px;gap:8px;flex-direction:row;flex-wrap:wrap}.overview-filters label{font-size:11px;gap:5px;min-width:0;flex:1}.overview-filters input,.overview-filters select{min-width:0;max-width:100%;padding:5px;font-size:11px}.overview-filters>button{font-size:11px;padding:5px 8px}.card{padding:14px}.wage-totals{gap:6px}.wage-totals b{font-size:17px}.wage-calendar{padding:10px}.wage-day{min-height:70px;padding:7px 1px}.wage-day b{font-size:10px}.wage-day small{font-size:9px}.wage-period input{height:32px;font-size:13px;padding:3px 8px}}
 .preview-mode .topbar{height:auto;min-height:60px;padding:10px 14px;gap:6px} .preview-mode .topbar>div:first-child{flex:1;min-width:0} .preview-mode .topbar b{font-size:13px} .preview-mode .topbar small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px} .preview-mode .topbar .actions{gap:4px;flex-wrap:nowrap} .preview-mode .topbar .actions button{font-size:11px;padding:5px 7px;white-space:nowrap} .preview-mode .topbar [data-action="preview"],.preview-mode .topbar [data-action="logout"]{display:none} .preview-mode .environment{padding:4px 14px;font-size:10px} .preview-mode .content{padding:16px 12px 96px} .preview-mode .page-head{gap:8px;margin-bottom:14px} .preview-mode .page-head h1{font-size:19px} .preview-mode .page-head p{font-size:11px} .preview-mode .page-head>button{font-size:11px;padding:6px 8px} .preview-mode .mobile-nav{overflow:visible;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;padding:6px 4px calc(8px + env(safe-area-inset-bottom));min-height:62px} .preview-mode .mobile-nav .nav{margin:0;border:0;background:transparent;padding:3px 0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;color:#718096;min-width:0} .preview-mode .mobile-nav .nav>span{font-size:21px;line-height:24px;height:24px} .preview-mode .mobile-nav .nav small{font-size:11px;line-height:16px} .preview-mode .mobile-nav .nav.active{color:var(--brand);font-weight:650;background:transparent;box-shadow:none} .preview-mode .filters{gap:6px} .preview-mode .filters label{min-width:0;flex:1;font-size:11px} .preview-mode .filters input,.preview-mode .filters select{padding:6px;font-size:12px;min-width:0} .preview-mode .filters button{padding:6px 8px;font-size:11px} .preview-mode .overview-filters{padding:10px;gap:8px;flex-direction:row;flex-wrap:wrap} .preview-mode .overview-filters label{font-size:11px;gap:5px;min-width:0;flex:1} .preview-mode .overview-filters input,.preview-mode .overview-filters select{min-width:0;max-width:100%;padding:5px;font-size:11px} .preview-mode .overview-filters>button{font-size:11px;padding:5px 8px} .preview-mode .card{padding:14px} .preview-mode .wage-totals{gap:6px} .preview-mode .wage-totals b{font-size:17px} .preview-mode .wage-calendar{padding:10px} .preview-mode .wage-day{min-height:70px;padding:7px 1px} .preview-mode .wage-day b{font-size:10px} .preview-mode .wage-day small{font-size:9px} .preview-mode .wage-period input{height:32px;font-size:13px;padding:3px 8px}
.employee-shortcuts{margin-bottom:16px}.employee-shortcuts button{flex:1;color:var(--brand);background:#fff8f2;padding:10px 14px}

/* 唯一视觉基准：2026-11-02用户指定整版 */
.reference-banner{text-align:center;background:linear-gradient(#fff8f4,#fff);padding:18px 12px 14px}.reference-banner strong{display:block;color:var(--brand);font-size:18px;font-weight:600}.reference-banner small{color:#7b8793;display:block;margin-top:3px;font-size:12px}.reference-brand{height:48px;background:#fff;display:flex;align-items:center;gap:8px;padding:0 14px;border-bottom:1px solid #f0f2f5}.reference-brand .rabbit{width:17px;height:17px;border-width:2px;margin-top:8px}.reference-brand .rabbit:before,.reference-brand .rabbit:after{width:4px;height:10px;top:-11px}.reference-brand button{margin-left:auto;border:0;padding:4px;background:transparent}.reference-brand svg{width:18px;height:18px}.reference-dashboard{background:#f7f8fa;border-radius:12px;overflow:hidden}.reference-card{border:0;margin:10px 0;padding:14px;border-radius:11px;box-shadow:none}.reference-card h2{font-size:15px;margin:0 0 12px;color:#15202d}.reference-card h2 small{font-size:11px;font-weight:400;color:#86909c}.reference-card .row h2{margin:0}.reference-wages{display:grid;grid-template-columns:repeat(3,1fr);background:#fafbfc;border:1px solid #f0f2f5;border-radius:8px;margin:14px 0 8px;padding:11px 4px}.reference-wages>div{border-right:1px solid #edf0f3;text-align:center}.reference-wages>div:last-child{border:0}.reference-wages small{display:block;color:#85909f;font-size:11px}.reference-wages b{font-size:20px;white-space:nowrap;color:#202b3a}.reference-wages>div:nth-child(2) b{color:var(--brand)}.ref-month{border:0;background:#f5f7f9;padding:5px 7px;font-size:11px}.reference-features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px}.reference-features button{border:0;padding:6px 0;background:transparent;display:flex;align-items:center;flex-direction:column;gap:7px;min-width:0}.reference-features small{font-size:11px;white-space:nowrap}.ref-icon{width:36px;height:36px;border-radius:12px;color:#fff;display:grid;place-items:center;box-shadow:inset 0 1px 3px #ffffff55}.ref-icon svg{width:20px;height:20px}.ref-icon.orange{background:linear-gradient(135deg,#ff9343,#ff6508)}.ref-icon.green{background:linear-gradient(135deg,#53dc8b,#00bd66)}.ref-icon.blue{background:linear-gradient(135deg,#47b6ff,#1879ff)}.ref-icon.purple{background:linear-gradient(135deg,#be8aff,#8751ee)}.ref-project{width:100%;border:0;background:#f7f8fa;display:flex;align-items:center;text-align:left;padding:11px 8px;margin-top:10px;gap:9px;min-width:0}.ref-project>span:nth-child(2){flex:1;min-width:0}.ref-project b{font-size:12px;display:block;overflow:hidden;text-overflow:ellipsis}.ref-project small{font-size:10px;color:#8b95a3;display:block}.ref-small-icon{color:var(--brand);background:#fff1e8;width:32px;height:32px;display:grid;place-items:center;flex-shrink:0;border-radius:7px}.ref-small-icon svg{width:20px;height:20px}.ref-days{text-align:right}.ref-days b{color:#17bf65;font-size:20px}.reference-counts{display:flex;justify-content:space-around;padding:13px 0;border-bottom:1px solid #f2f4f7}.reference-counts b{font-size:24px;color:#16bf65}.reference-counts span:nth-child(2) b{color:var(--brand)}.ref-roster{white-space:normal;font-size:12px}.ref-roster td,.ref-roster th{padding:8px 4px;font-size:11px}.reference-card>.primary{width:100%;margin-top:12px;background:linear-gradient(110deg,#ff8a34,#ff6508);padding:9px}.reference-secondary{display:flex;gap:8px;margin:10px 0}.reference-secondary>button{flex:1;background:white}.reference-status{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.reference-status button{border:0;background:#fff5eb;color:#ff780d;padding:10px 4px}.reference-status button:last-child{background:#fff2f2;color:#f45757}.reference-status small,.reference-status b{display:block}.reference-status b{font-size:25px}.role-admin .reference-features{grid-template-columns:repeat(3,minmax(0,1fr))}.reference-mobile-only{display:none}.mobile-nav svg{width:22px;height:22px}.reference-desktop-only{display:block}.preview-mode .reference-mobile-only{display:block}.preview-mode .reference-desktop-only{display:none}.preview-mode .content:has(.reference-dashboard){padding:0 12px 95px}.preview-mode .topbar:has(+.environment+.content .reference-dashboard){min-height:36px;padding:4px 12px}.preview-mode .topbar:has(+.environment+.content .reference-dashboard)>div:first-child{display:none}.preview-mode .topbar:has(+.environment+.content .reference-dashboard) .actions{margin-left:auto}.preview-mode .environment:has(+.content .reference-dashboard){display:none}@media(max-width:760px){.reference-mobile-only{display:block}.reference-desktop-only{display:none}.content:has(.reference-dashboard){padding:0 12px 95px}.topbar:has(+.environment+.content .reference-dashboard){min-height:36px;padding:4px 12px}.topbar:has(+.environment+.content .reference-dashboard)>div:first-child{display:none}.topbar:has(+.environment+.content .reference-dashboard) .actions{margin-left:auto}.environment:has(+.content .reference-dashboard){display:none}}

@media(max-width:760px){.filters:has(#export-kind){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:end}.filters:has(#export-kind) label{display:block;min-width:0;max-width:100%;font-size:11px;line-height:1.4;margin:0}.filters:has(#export-kind) input,.filters:has(#export-kind) select{width:100%;height:36px;min-width:0;margin-top:5px;padding:6px;font-size:12px}.filters:has(#export-kind)>button{grid-column:1/-1;height:38px}.filters:has(#export-kind) label:nth-child(2){font-size:10px}}
 .preview-mode .filters:has(#export-kind){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:end} .preview-mode .filters:has(#export-kind) label{display:block;min-width:0;max-width:100%;font-size:11px;line-height:1.4;margin:0} .preview-mode .filters:has(#export-kind) input,.preview-mode .filters:has(#export-kind) select{width:100%;height:36px;min-width:0;margin-top:5px;padding:6px;font-size:12px} .preview-mode .filters:has(#export-kind)>button{grid-column:1/-1;height:38px} .preview-mode .filters:has(#export-kind) label:nth-child(2){font-size:10px}