:root{--ink:#172d28;--muted:#79847e;--green:#174c42;--green2:#276c5e;--cream:#f5f6f2;--line:#e6eae3;--accent:#d8e9b2;--red:#a63e3b;--shadow:0 3px 22px #19372c04;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--cream);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}[hidden]{display:none!important}input,select,textarea{width:100%;border:1px solid #dce2da;border-radius:9px;background:#fff;color:var(--ink);padding:12px 14px;min-height:46px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green2);box-shadow:0 0 0 3px #276c5e12}input:disabled,select:disabled,textarea:disabled{background:#f5f6f2;color:#7a827e}input[type=number]{appearance:textfield}input::-webkit-inner-spin-button{appearance:none}label{display:block;font-size:13px;font-weight:600;margin:21px 0 9px}h1,h2,p{margin:0}h2{font-size:17px;font-weight:650;letter-spacing:.2px}h1{font-size:28px;font-weight:650;letter-spacing:.3px}a{color:var(--green)}.muted{color:var(--muted);font-size:12px;line-height:1.7}.eyebrow{font-size:12px;letter-spacing:1px;color:var(--muted);margin-bottom:10px}.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:750;letter-spacing:1px}.brand img{flex-shrink:0}.loading{padding:30vh 20px;text-align:center;color:var(--green)}.primary,.secondary{border-radius:9px;min-height:44px;padding:12px 19px;font-size:13px;font-weight:600;transition:background .15s}.primary{border:1px solid var(--green);background:var(--green);color:#fff}.primary:hover{background:#216051}.secondary{border:1px solid #dce2da;background:#fff;color:var(--green)}.secondary:hover{background:#f1f5ed}.full{width:100%}.small{min-height:36px;padding:8px 12px;font-size:12px}.link-button{display:flex;align-items:center;justify-content:center;text-decoration:none}.icon-button{border:0;background:transparent;color:var(--muted);font-size:23px;min-width:40px;min-height:40px}.pill{display:inline-block;background:#eef3e6;color:var(--green);padding:6px 12px;border-radius:20px;font-size:12px}.auth-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;max-width:1280px;margin:auto;padding:80px 64px;gap:90px;align-items:center}.auth-story .eyebrow{margin-top:78px}.auth-story h1{font-size:46px;line-height:1.5;font-weight:650;letter-spacing:2px}.auth-story>p:not(.eyebrow){color:#738078;line-height:1.9;margin-top:20px;font-size:15px}.story-grid{display:flex;gap:40px;margin-top:55px}.story-grid>span{font-size:28px;font-weight:650;font-variant-numeric:tabular-nums}.story-grid small{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:10px}.auth-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:42px;box-shadow:var(--shadow);max-width:440px;width:100%}.auth-card h2{font-size:25px;margin:22px 0 12px}.auth-card .primary{margin-top:10px}.auth-foot{font-size:11px;color:var(--muted);margin-top:25px;text-align:center}.error{color:var(--red);font-size:12px;margin:12px 0;line-height:1.6}.app-shell{display:flex;min-height:100vh}.sidebar{width:230px;background:#fff;border-right:1px solid var(--line);position:fixed;inset:0 auto 0 0;padding:34px 24px;display:flex;flex-direction:column;z-index:5}.sidebar .brand{font-size:20px;gap:10px}.sidebar-caption{font-size:11px;color:var(--muted);margin:14px 0 40px 50px}.sidebar nav{display:grid;gap:8px}.nav{display:flex;align-items:center;gap:15px;border:0;background:transparent;color:#707d75;text-align:left;border-radius:10px;padding:15px;font-size:14px;min-height:50px}.nav span{font-size:21px;line-height:1;width:24px;text-align:center}.nav.active{background:#edf3e7;color:var(--green);font-weight:650}.sidebar-bottom{margin-top:auto;display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding-top:20px}.sidebar-bottom strong{display:block;max-width:95px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.sidebar-bottom small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.sidebar-bottom .icon-button{margin-left:auto;min-width:28px}.avatar{width:36px;height:36px;border-radius:50%;background:#edf2e8;color:var(--green);display:grid;place-items:center;font-size:13px;flex-shrink:0}.avatar.large{width:50px;height:50px;background:#ffffff16;color:var(--accent);font-size:19px}.app-shell main{margin-left:230px;max-width:1530px;width:calc(100% - 230px);padding:38px 46px 20px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.month-picker{display:flex;align-items:center;gap:12px;margin:0}.month-picker>span{color:var(--muted);font-size:12px;white-space:nowrap}.month-picker input{max-width:178px;background:#fff;min-height:40px;font-size:13px}.hero{background:var(--green);color:#fff;border-radius:16px;padding:30px 34px;display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;min-height:190px}.hero-top{display:flex;gap:20px;align-items:center;font-size:13px;color:#dae4d8}.status{display:inline-flex;background:#ffffff16;border:1px solid #ffffff18;border-radius:5px;padding:4px 8px;font-size:10px;letter-spacing:.5px;color:#dfedc7}.hero-amount{display:flex;align-items:baseline;gap:11px;margin:12px 0 9px;font-variant-numeric:tabular-nums}.hero-amount>span{font-size:24px;color:#b7d1b7}.hero-amount strong{font-size:48px;font-weight:550;letter-spacing:1px}.hero p{font-size:11px;color:#b2cbbb;line-height:1.8}.hero-person{display:flex;flex-direction:column;align-items:center;gap:9px;padding-left:30px;border-left:1px solid #ffffff1a;min-width:175px}.hero-person strong{font-size:14px;max-width:180px;word-break:break-all}.hero-person>span{font-size:10px;color:#b3c8b7}.salary-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(275px,1fr);gap:24px;align-items:start}.card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:26px;box-shadow:var(--shadow)}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.card-heading p{margin-top:8px}.card-heading .muted{font-size:11px}fieldset{border:0;padding:0;margin:0;min-width:0}fieldset>label:first-child{margin-top:10px}.required{font-size:10px;font-weight:400;margin-left:8px;color:#6f8778}.optional{color:#9ca49d;font-size:11px;font-weight:400;margin-left:7px}.money-input{display:flex;align-items:center;border:1px solid #dce2da;border-radius:9px;padding-left:16px}.money-input:focus-within{border-color:var(--green2);box-shadow:0 0 0 3px #276c5e12}.money-input>span{color:#8a958c;font-size:18px}.money-input input{border:0;font-size:25px;height:62px;padding-left:10px;box-shadow:none}.commission-summary{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:17px 0 12px;color:#7a877b}.commission-summary strong{color:var(--green);font-size:15px}progress{width:100%;height:6px;border:0;border-radius:5px;display:block;appearance:none;background:#edf1e8}progress::-webkit-progress-bar{background:#edf1e8;border-radius:5px}progress::-webkit-progress-value{background:#a9c580;border-radius:5px}progress::-moz-progress-bar{background:#a9c580;border-radius:5px}.tiers{display:flex;justify-content:space-between;color:#84917f;font-size:10px;margin-top:9px}.tiers>span{text-align:center}.tiers>span:first-child{text-align:left}.tiers>span:last-child{text-align:right}.tiers small{display:block;font-size:10px;margin-top:5px;color:#a0a99b}.divider{border-top:1px solid var(--line);margin:25px 0}.field-note{color:#929b92;font-size:11px;line-height:1.8;margin-top:9px}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}.two-columns label{font-size:12px}.form-actions{display:flex;gap:10px;margin-top:24px}.form-actions .primary{flex:1}.subtle-tag{font-size:10px;color:#8a9686;background:#f2f5ee;padding:5px 8px;border-radius:4px;white-space:nowrap}.breakdown dl{margin:0}.breakdown dl>div{display:flex;justify-content:space-between;gap:10px;padding:13px 0;font-size:12px}.breakdown dt{color:#7e887f}.breakdown dd{margin:0;font-variant-numeric:tabular-nums;font-size:14px;font-weight:500;white-space:nowrap}.breakdown dt small{font-size:9px;background:#fbf5e8;color:#ac8c48;padding:3px 5px;margin-left:4px;border-radius:3px}.breakdown .sum{border-top:1px dashed #dce3d7;margin:14px 0 18px;padding-top:22px}.sum dt{color:var(--ink);font-weight:600}.sum dd{color:var(--green);font-size:21px;font-weight:650}.right-column{display:grid;gap:16px}.tip-card{background:#ecf1e6;border:1px solid #e4ebda;border-radius:12px;padding:20px;display:flex;gap:12px}.tip-icon{width:23px;height:23px;background:#dbe7cb;border-radius:50%;display:grid;place-items:center;color:var(--green);font-size:12px;flex-shrink:0}.tip-card strong{font-size:12px;font-weight:600;color:#53714c}.tip-card p{color:#829078;font-size:11px;line-height:1.9;margin-top:7px}.quiet-note{color:#a0a799;font-size:10px;line-height:1.8;padding:0 10px}.attendance-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0}.stat{background:#f6f8f3;border-radius:9px;padding:15px;font-size:12px;color:#7a8876}.stat strong{display:block;font-size:24px;color:var(--green);font-weight:600;margin-bottom:7px}.calendar-week,.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.calendar-week{font-size:12px;color:#8a9586;text-align:center;margin:24px 0 12px}.day{height:92px;min-width:0;border:1px solid var(--line);border-radius:9px;background:#fff;display:flex;flex-direction:column;align-items:flex-start;padding:12px;color:var(--ink);gap:9px}.day:hover{border-color:#86a675}.day>span{font-size:14px}.day small{font-size:10px;padding:3px 6px;border-radius:4px;background:#eef4e8;color:#618052}.day.has-leave small{background:#fff0e6;color:#b88259}.day.has-rest small{background:#edf2f5;color:#7f929e}.day.has-overtime small{background:#f3eef8;color:#9b7aae}.day.today{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.day.empty{border-color:transparent;background:transparent}.history-item{display:flex;align-items:center;gap:20px;padding:22px 0;border-top:1px solid var(--line)}.history-date{font-size:16px;font-weight:600}.history-meta{font-size:11px;color:var(--muted);margin-top:7px}.history-amount{margin-left:auto;font-size:22px;font-weight:550;font-variant-numeric:tabular-nums}.history-item .status{background:#edf3e7;color:#66825a;border:0}.empty-state{text-align:center;padding:64px 20px;color:#91a08e}.empty-state strong{display:block;font-size:16px;color:#64765e;margin:12px 0}.empty-state p{font-size:12px;line-height:1.8}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.rules-list{margin:20px 0}.rules-list>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;font-size:13px}.rules-list dt{color:var(--muted)}.rules-list dd{margin:0}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}th{color:#7e8e75;background:#f4f7f0;font-weight:500}td,th{padding:13px 10px;border-bottom:1px solid var(--line)}th:last-child,td:last-child{text-align:right}#settingsForm .primary{margin-top:24px}.banner{padding:14px 18px;margin-bottom:20px;border-radius:9px;font-size:13px;line-height:1.7}.error-banner{background:#fff0eb;color:#a05343;border:1px solid #f1dcd2}footer{display:flex;justify-content:center;gap:10px;color:#a7afa1;font-size:10px;padding:32px 0 12px}dialog{border:1px solid var(--line);border-radius:16px;padding:28px;width:420px;max-width:calc(100% - 30px);box-shadow:0 20px 70px #173c2920}dialog::backdrop{background:#142d2266;backdrop-filter:blur(3px)}dialog .primary{margin-top:20px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#183d32;color:#fff;border:1px solid #527663;padding:13px 22px;border-radius:10px;font-size:13px;z-index:30;box-shadow:0 7px 25px #183d3225;max-width:90vw;text-align:center}button:focus-visible,a:focus-visible{outline:3px solid #94b571;outline-offset:3px}
@media(min-width:1600px){.app-shell main{padding:42px 70px}.hero{padding:35px 40px}}
@media(max-width:1100px){.sidebar{width:195px;padding:30px 16px}.sidebar .brand{font-size:18px}.app-shell main{margin-left:195px;width:calc(100% - 195px);padding:30px 25px}.salary-grid{grid-template-columns:minmax(0,1.3fr) minmax(250px,1fr);gap:16px}.card{padding:21px}.hero-person{min-width:150px}.auth-shell{gap:40px;padding:50px}.auth-story h1{font-size:38px}}
@media(max-width:850px){.sidebar{width:165px;padding:28px 12px}.sidebar .brand{font-size:16px;gap:7px}.sidebar .brand img{width:32px;height:32px}.sidebar-caption{margin-left:38px}.nav{padding:12px 10px;gap:8px;font-size:13px}.sidebar-bottom{gap:6px}.sidebar-bottom strong{max-width:65px}.app-shell main{margin-left:165px;width:calc(100% - 165px);padding:28px 20px}.salary-grid{grid-template-columns:1fr}.right-column{grid-template-columns:1fr}.hero-amount strong{font-size:42px}.hero{padding:25px}.hero-person{min-width:125px;padding-left:20px}.settings-grid{grid-template-columns:1fr}.day{height:78px;padding:9px}.auth-shell{padding:40px;gap:30px}.auth-card{padding:30px}.auth-story h1{font-size:31px}.story-grid{gap:25px}.story-grid>span{font-size:23px}}
@media(max-width:600px){.auth-shell{grid-template-columns:1fr;gap:24px;padding:35px 22px;align-content:start}.auth-story .brand{font-size:21px}.auth-story .eyebrow{margin-top:32px}.auth-story h1{font-size:30px;line-height:1.45}.auth-story>p:not(.eyebrow){font-size:12px;margin-top:10px}.story-grid{display:none}.auth-card{max-width:none;padding:26px;border-radius:14px}.auth-card h2{margin-top:15px;font-size:22px}.app-shell main{margin:0;width:100%;padding:24px 16px 95px}.sidebar{top:auto;bottom:0;left:0;right:0;width:100%;height:auto;padding:5px 8px calc(7px + env(safe-area-inset-bottom));border-right:0;border-top:1px solid var(--line);background:#fffffffa;backdrop-filter:blur(8px)}.sidebar>.brand,.sidebar-caption,.sidebar-bottom{display:none}.sidebar nav{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.nav{flex-direction:column;justify-content:center;gap:5px;padding:8px 4px;min-height:52px;font-size:10px;border-radius:8px}.nav span{font-size:20px}.topbar{margin-bottom:21px;gap:12px}.topbar h1{font-size:24px}.topbar .eyebrow{font-size:9px;letter-spacing:.3px;margin-bottom:8px}.month-picker>span{display:none}.month-picker input{max-width:142px;padding:9px;min-height:40px;font-size:12px}.hero{min-height:174px;padding:23px 21px;margin-bottom:17px;border-radius:13px;align-items:flex-start;position:relative}.hero-top{gap:12px;font-size:12px}.hero-amount{margin-top:18px;gap:7px}.hero-amount strong{font-size:39px;letter-spacing:0}.hero-amount>span{font-size:20px}.hero p{font-size:10px;max-width:235px}.hero-person{padding:0;border:0;min-width:0;gap:7px;position:absolute;right:20px;top:25px}.hero-person .avatar{width:34px;height:34px;font-size:12px}.hero-person strong{font-size:10px;max-width:63px}.hero-person>span{display:none}.card{padding:21px 19px;border-radius:12px}.card-heading h2{font-size:16px}.card-heading .muted{font-size:10px}.two-columns{gap:12px}.two-columns label{font-size:11px}.money-input input{height:58px;font-size:25px}input,select,textarea{font-size:16px}.field-note{font-size:10px}.form-actions .primary,.form-actions .secondary{font-size:12px;padding:12px 14px}.breakdown dl>div{font-size:13px}.breakdown dd{font-size:15px}.sum dd{font-size:23px}.salary-grid{gap:17px}.tip-card{padding:18px}.attendance-stats{gap:7px;margin:20px 0}.stat{padding:12px 9px;font-size:10px}.stat strong{font-size:21px}.calendar,.calendar-week{gap:5px}.calendar-week{font-size:10px}.day{height:66px;padding:7px 4px;gap:7px;border-radius:6px;align-items:center}.day>span{font-size:12px}.day small{font-size:9px;padding:2px 4px}.history-item{gap:10px;flex-wrap:wrap}.history-date{font-size:14px}.history-amount{font-size:20px}.history-item .small{padding:8px 11px}.history-meta{font-size:10px}.history-item .status{font-size:9px}.history-item .history-open{width:100%;margin-top:5px}.view>.card>.card-heading{flex-wrap:wrap}.settings-grid{gap:18px}footer{font-size:9px;gap:6px;text-align:center;line-height:1.8;padding-top:24px}#toast{bottom:90px;width:max-content;max-width:calc(100vw - 35px)}dialog{padding:23px}.sidebar .nav.active{color:var(--green);background:#edf3e7}.mobile-logout{display:block!important;margin-top:22px}.quiet-note{font-size:10px}}

.install-button{margin-top:18px}.install-guide{margin:22px 0}.install-guide>div+div{margin-top:20px}.install-guide dt{font-size:14px;font-weight:650;margin-bottom:7px}.install-guide dd{margin:0;font-size:13px;color:var(--muted);line-height:1.8}#installDialog{max-height:90vh;overflow:auto}#installUrl{margin-top:10px;font-size:13px}
.clock-page{background:var(--cream)}.clock-shell{max-width:600px;margin:auto;padding:30px 20px}.clock-brand{display:flex;gap:12px;align-items:center;margin-bottom:28px}.clock-brand strong{font-size:19px}.clock-today h1{font-size:25px;margin:20px 0 10px}.clock-times{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:30px 0}.clock-times>div{background:#f4f7f0;border-radius:12px;padding:20px 12px}.clock-times span{display:block;font-size:12px;color:var(--muted);margin-bottom:12px}.clock-times strong{font-size:26px;font-weight:650;font-variant-numeric:tabular-nums}.clock-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.clock-actions button{min-height:60px;font-size:16px}.clock-history{margin:20px 0}.clock-record{display:flex;justify-content:space-between;gap:15px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.clock-record span{color:var(--muted);font-variant-numeric:tabular-nums}.clock-foot{text-align:center;font-size:12px;color:var(--muted);margin:28px 0}.clock-admin-panel{margin-bottom:24px}.clock-editor{margin:20px 0;padding:16px;background:#f5f7f2;border-radius:10px}.clock-editor summary{cursor:pointer;font-size:13px;font-weight:600}.clock-editor label{font-size:12px}