:root{--green-900: #1d4a14;--green-800: #2b6a1d;--green-600: #388828;--green-400: #7cb342;--green-100: #e6f2df;--green-50: #f4f8f1;--sun: #f5c518;--ink: #18231c;--muted: #5d6b62;--line: #dfe7dc;--card: #ffffff;--bg: #f4f8f2;--red: #c62828;--red-bg: #fdecea;--amber: #b26a00;--amber-bg: #fff4e0;--blue: #1565c0;--blue-bg: #e8f1fc;--radius: 14px;--shadow: 0 1px 2px rgba(20, 50, 30, .06), 0 4px 14px rgba(20, 50, 30, .06);--nav-h: 64px;--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;-webkit-tap-highlight-color:transparent}a{color:var(--green-800);text-decoration:none}h1,h2,h3{margin:0;line-height:1.25}h2{font-size:17px;margin:18px 0 10px}button,input,select,textarea{font:inherit;color:inherit}.app{max-width:760px;margin:0 auto;min-height:100%;background:var(--bg);position:relative}.page{padding-bottom:calc(var(--nav-h) + var(--safe-b) + 20px)}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px;background:var(--card);border-bottom:1px solid var(--line)}.topbar h1{font-size:18px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-actions{display:flex;gap:6px}.brand-dot{width:32px;height:32px;border-radius:10px;background:var(--green-800);color:var(--sun);display:grid;place-items:center}.icon-btn{border:0;background:var(--green-50);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--ink)}.icon-btn:hover{background:var(--green-100)}.content{padding:14px 16px}.plant-switch{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--green-100);color:var(--green-800);font-size:13px}.plant-switch select{border:0;background:transparent;font-weight:600;color:var(--green-900);flex:1;padding:2px 0}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:760px;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);height:calc(var(--nav-h) + var(--safe-b));padding-bottom:var(--safe-b);background:var(--card);border-top:1px solid var(--line)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11.5px;color:var(--muted)}.bottom-nav a.active{color:var(--green-800);font-weight:600}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin-bottom:12px}.list{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--ink)}.row:last-child{border-bottom:0}.row .grow{flex:1;min-width:0}.row .title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row .sub{color:var(--muted);font-size:13px}.row .right{text-align:right;font-size:13px;white-space:nowrap}.row.low{background:#f1faf0;border-left:4px solid var(--green-400)}.thumb,.img-ph{width:46px;height:46px;border-radius:10px;object-fit:cover;background:var(--green-50);display:grid;place-items:center;color:var(--muted);flex-shrink:0}.muted{color:var(--muted)}.small{font-size:13px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.filters{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.filters>:nth-child(3){grid-column:span 2}@media (min-width: 560px){.filters{grid-template-columns:repeat(3,1fr)}.filters>:nth-child(3){grid-column:auto}}.spread{display:flex;justify-content:space-between;align-items:center;gap:10px}.stack{display:flex;flex-direction:column;gap:10px}.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px}.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1.5px solid var(--green-600);color:var(--green-800);background:var(--card);font-size:13.5px;font-weight:600;white-space:nowrap;cursor:pointer}.chip.on{background:var(--green-800);color:#fff}.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}@media (min-width: 560px){.kpis{grid-template-columns:repeat(4,1fr)}}.kpi{position:relative;background:linear-gradient(135deg,#fff 55%,var(--green-100));border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;display:flex;flex-direction:column;gap:2px;color:var(--ink);min-height:92px}.kpi strong{font-size:24px;color:var(--green-800)}.kpi span:last-child{font-size:12.5px;color:var(--muted)}.kpi-icon{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--green-100);color:var(--green-800)}.kpi-icon.tone-red{background:var(--red-bg);color:var(--red)}.kpi-icon.tone-amber{background:var(--amber-bg);color:var(--amber)}.kpi-icon.tone-blue{background:var(--blue-bg);color:var(--blue)}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}@media (min-width: 560px){.tiles{grid-template-columns:repeat(4,1fr)}}.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 8px 12px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:var(--ink);font-size:13px;font-weight:600;min-height:116px;position:relative}.tile .ic{width:44px;height:44px;border-radius:50%;background:var(--green-600);color:#fff;display:grid;place-items:center}.tile.soon{opacity:.55}.tile .soon-tag{position:absolute;top:6px;right:6px;font-size:9.5px;background:var(--line);padding:1px 6px;border-radius:6px;color:var(--muted);font-weight:600}.field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}.field-label{font-size:13px;font-weight:600;color:var(--muted)}.field-hint{font-size:12px;color:var(--muted)}.req{color:var(--red)}.input,.field input,.field select,.field textarea,.pw input{width:100%;padding:12px 13px;border:1.5px solid var(--line);border-radius:11px;background:#fff;outline:none}.field textarea{min-height:80px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green-600);box-shadow:0 0 0 3px #2e7d4f1f}.pw{position:relative}.pw button{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);font-size:12.5px;font-weight:600;cursor:pointer}.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;margin:6px 0 14px}.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--green-800)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;padding:12px 18px;font-weight:600;cursor:pointer;border:1.5px solid transparent;min-height:46px}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--green-800);color:#fff}.btn-primary:hover:not(:disabled){background:var(--green-900)}.btn-outline{background:#fff;border-color:var(--green-600);color:var(--green-800)}.btn-ghost{background:transparent;color:var(--green-800)}.btn-danger{background:var(--red-bg);color:var(--red)}.btn.block{width:100%}.btn.sm{min-height:36px;padding:7px 12px;font-size:13px;border-radius:10px}.alert{padding:11px 13px;border-radius:11px;font-size:13.5px;margin-bottom:12px}.alert-error{background:var(--red-bg);color:var(--red)}.alert-success{background:var(--green-100);color:var(--green-900)}.alert-info{background:var(--blue-bg);color:var(--blue)}.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700}.badge-green{background:var(--green-100);color:var(--green-800)}.badge-red{background:var(--red-bg);color:var(--red)}.badge-amber{background:var(--amber-bg);color:var(--amber)}.badge-blue{background:var(--blue-bg);color:var(--blue)}.badge-grey{background:#eef1ee;color:var(--muted)}.search-row{display:flex;gap:8px;align-items:center;margin-bottom:12px}.search{flex:1;min-width:0;display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:0 12px;color:var(--muted)}.search input{border:0;outline:none;padding:11px 0;flex:1;background:transparent;min-width:0}.photo-picker{display:flex;gap:12px;align-items:center;margin-bottom:12px}.photo-picker img,.photo-empty{width:84px;height:84px;border-radius:12px;object-fit:cover;background:var(--green-50);border:1.5px dashed var(--line);display:grid;place-items:center;color:var(--muted)}.photo-actions{display:flex;flex-direction:column;gap:6px}.photo-actions .btn{min-height:38px;padding:7px 12px;font-size:13px}.auth{min-height:100%;display:flex;flex-direction:column;background:var(--green-900)}.auth-hero{flex:0 0 auto;min-height:230px;background:radial-gradient(circle at 30% 30%,#4d8f3a,var(--green-900) 70%);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;position:relative;overflow:hidden}.auth-hero:after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;background:#f5c51838}.brand-logo{background:#fff;border-radius:12px;padding:8px 12px;align-self:flex-start;margin-bottom:14px;position:relative;z-index:1}.brand-logo img{height:44px;display:block}.wordmark{position:relative;z-index:1}.wordmark b{display:block;font-size:28px;letter-spacing:6px;color:#fff}.wordmark small{color:var(--sun);font-weight:700;letter-spacing:1px;font-size:12px;text-transform:uppercase}.auth-hero h1,.auth-hero p{position:relative;z-index:1}.auth-hero h1{font-size:30px;letter-spacing:.5px}.auth-hero p{margin:6px 0 0;opacity:.85;max-width:330px}.auth-sheet{flex:1;background:var(--bg);border-radius:26px 26px 0 0;margin-top:-24px;padding:26px 20px 30px;position:relative;z-index:1}.auth-sheet h2{font-size:22px;margin:0 0 4px;color:var(--green-800)}.auth-sheet .lead{color:var(--muted);margin:0 0 18px}.auth-inner{max-width:440px;margin:0 auto}.auth-links{text-align:center;margin-top:16px;font-size:14px;color:var(--muted)}.role-cards{display:grid;gap:10px;margin-bottom:16px}.role-card{display:flex;gap:12px;align-items:center;padding:14px;border-radius:14px;border:2px solid var(--line);background:#fff;cursor:pointer;text-align:left}.role-card.on{border-color:var(--green-600);background:var(--green-50)}.role-card .ic{width:40px;height:40px;border-radius:12px;background:var(--green-100);color:var(--green-800);display:grid;place-items:center;flex-shrink:0}.role-card small{display:block;color:var(--muted)}.spinner{width:28px;height:28px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--green-600);animation:spin .8s linear infinite;display:inline-block}.spinner.sm{width:18px;height:18px;border-width:2.5px;border-color:#fff6;border-top-color:#fff}@keyframes spin{to{transform:rotate(360deg)}}.center-fill{min-height:50vh;display:grid;place-items:center}.empty{text-align:center;color:var(--muted);padding:36px 10px}.empty p{margin:8px 0 0}.fab{position:fixed;right:max(18px,calc(50% - 362px));bottom:calc(var(--nav-h) + var(--safe-b) + 16px);width:56px;height:56px;border-radius:18px;background:var(--green-600);color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px #1f5f3a59;z-index:25}.donut-wrap{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}.legend{list-style:none;padding:0;margin:0;flex:1;min-width:170px}.legend li{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--line);font-size:14px}.legend li:last-child{border-bottom:0}.legend i{width:10px;height:10px;border-radius:50%;display:inline-block}.legend b{margin-left:auto}.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}.cal .dow{font-size:11.5px;color:var(--muted);font-weight:600}.cal button{aspect-ratio:1;border:0;border-radius:50%;background:transparent;font-size:13.5px;cursor:pointer}.cal .present{background:#cfe9c4;color:var(--green-900);font-weight:700}.cal .absent{background:#f8c9c4;color:var(--red);font-weight:700}.cal .half_day,.cal .leave{background:var(--amber-bg);color:var(--amber);font-weight:700}.cal .week_off{background:#eef1ee}.cal .today{outline:2px solid var(--green-600)}.cal .sel{box-shadow:0 0 0 3px var(--green-800) inset}.profile-head{display:flex;gap:14px;align-items:center}.avatar{width:64px;height:64px;border-radius:50%;background:var(--green-600);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:700;flex-shrink:0;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.info-row{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}.info-row:last-child{border-bottom:0}.info-row .ic{width:34px;height:34px;border-radius:10px;background:var(--green-100);color:var(--green-800);display:grid;place-items:center;flex-shrink:0}.info-row small{display:block;color:var(--muted);font-size:12px}table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}.tbl th{text-align:left;color:var(--muted);font-weight:600;padding:8px 10px;background:var(--green-50);position:sticky;top:0}.tbl td{padding:9px 10px;border-top:1px solid var(--line)}.table-wrap{overflow-x:auto;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow)}.mi-row{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--line)}.mi-row:last-child{border-bottom:0}.mi-row input[type=checkbox]{width:20px;height:20px;margin-top:2px;accent-color:var(--green-800);flex-shrink:0}.mi-row .grow{flex:1;min-width:0}.mi-extra{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.mi-extra input[type=text]{flex:1;min-width:140px;padding:8px 10px;border:1.5px solid var(--line);border-radius:9px}.mi-extra img{width:42px;height:42px;border-radius:8px;object-fit:cover}.sticky-foot{position:sticky;bottom:calc(var(--nav-h) + var(--safe-b) + 8px);margin-top:14px}details.card summary{cursor:pointer;list-style:none}details.card summary::-webkit-details-marker{display:none}.demo-box{border:2px dashed var(--green-400)}.demo-box .role-card{width:100%}