:root{--green:#254d40;--muted:#7a827c;--line:#e5e8e2;--cream:#f6f7f2}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:#263c32;font:14px 'Noto Sans SC',system-ui,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:9px;background:white;color:var(--green);padding:10px 16px}button:hover{filter:brightness(.96)}button:disabled{opacity:.5;cursor:wait}.primary{background:var(--green);color:white;border-color:var(--green)}.danger{color:#a34b3c}.shell{display:flex;min-height:100vh}.sidebar{width:230px;background:#fff;border-right:1px solid var(--line);padding:32px 22px;position:fixed;height:100vh;display:flex;flex-direction:column}.brand{font-size:24px;font-weight:700;letter-spacing:3px}.brand small{display:block;font-size:10px;letter-spacing:2px;color:var(--muted);margin-top:8px}.nav{margin-top:48px;display:grid;gap:10px}.nav button{text-align:left;border:0;background:transparent;padding:14px}.nav .active{background:#edf2e9}.side-foot{margin-top:auto;color:var(--muted);font-size:12px;line-height:2}.main{margin-left:230px;flex:1;padding:38px 44px;position:relative;min-width:0}.main:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:9;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='180'%3E%3Ctext x='30' y='110' transform='rotate(-25 100 90)' fill='%23254d40' opacity='.055' font-size='24'%3E西西饰品%3C/text%3E%3C/svg%3E")}.top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:28px}.eyebrow{color:var(--muted);font-size:11px;letter-spacing:2px}.top h1{margin:8px 0 0;font-size:27px}.profile{display:flex;align-items:center;gap:10px}.avatar{background:#e3eadf;border-radius:50%;width:38px;height:38px;display:grid;place-items:center}.hero{background:#e7edde;border-radius:15px;padding:26px 30px;display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.hero h2{font-size:22px;margin:0 0 10px}.muted{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:28px}.stat,.panel{background:white;border:1px solid var(--line);border-radius:13px;padding:24px}.stat strong{font-size:34px;display:block;margin:12px 0 0}.panel h2{font-size:18px;margin:0 0 20px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.filters{margin-bottom:20px;gap:10px}.filters input{width:160px}.filters input[type=search]{width:220px}input,select,textarea{border:1px solid #dce2d9;border-radius:8px;background:#fff;padding:11px 12px;color:#263c32;max-width:100%}input:focus,textarea:focus,select:focus{outline:2px solid #aac0a5;outline-offset:1px}label{display:block;margin-bottom:18px;color:#42584b}label input,label textarea,label select{display:block;width:100%;margin-top:8px}textarea{min-height:100px;resize:vertical}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{font-size:12px;color:var(--muted);font-weight:500;background:#f7f9f5}td,th{padding:16px 12px;border-bottom:1px solid #edf0ea}td small{display:block;color:var(--muted);margin-top:4px}.badge{background:#edf4e8;color:#527347;font-size:11px;padding:5px 9px;border-radius:5px}.badge.void{background:#f9eeeb;color:#a34b3c}.thumb{width:45px;height:45px;object-fit:cover;border-radius:7px;vertical-align:middle;margin-right:10px}.empty{text-align:center;padding:55px 20px;color:var(--muted)}.empty b{display:block;font-size:18px;color:#4b6154;margin-bottom:12px}.pager{margin-top:20px;display:flex;justify-content:space-between;align-items:center}.form-panel{max-width:880px}.drop{border:2px dashed #d8e1d3;background:#f8faf5;border-radius:12px;padding:24px;text-align:center;margin:8px 0 18px}.drop input{margin:12px auto;width:100%;border:0;background:transparent}.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:18px 0}.photo img{width:100%;height:150px;object-fit:cover;border-radius:9px;cursor:zoom-in}.photo button{width:100%;margin-top:5px;font-size:12px}.detail{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-bottom:26px}.detail span{display:block;color:var(--muted);font-size:12px;margin-bottom:8px}.detail strong{font-weight:500}.log{border-left:2px solid #dce5d6;padding:0 0 18px 18px;overflow-wrap:anywhere}.log small{color:var(--muted)}.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-story{background:#244d40;color:#fff;padding:10vh 9vw;display:flex;flex-direction:column;justify-content:space-between}.login-story .brand small{color:#b3c6ba}.login-story h1{font-size:42px;font-weight:500;line-height:1.6}.login-story p{color:#b7cbbd;line-height:2}.login-box{display:grid;place-items:center;padding:30px}.login-box form{width:100%;max-width:350px}.login-box h2{font-size:27px;margin-bottom:10px}.login-box .primary{width:100%;margin-top:10px}.login-box .muted{margin-bottom:30px}.error{color:#a34b3c;min-height:20px;margin-top:12px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#254d40;color:white;padding:12px 20px;border-radius:10px;z-index:100;display:none}.lightbox{position:fixed;inset:0;background:#000d;z-index:50;display:flex;align-items:center;justify-content:center;padding:35px}.lightbox img{max-width:100%;max-height:90vh}.lightbox button{position:absolute;right:20px;top:20px}.help{font-size:12px;line-height:1.9;color:var(--muted)}@media(max-width:900px){.sidebar{width:175px;padding:25px 14px}.main{margin-left:175px;padding:25px 20px}.profile small{display:none}.login-story{padding:50px}.login-story h1{font-size:30px}}@media(max-width:650px){.sidebar{position:static;width:100%;height:auto;padding:16px}.shell{display:block}.brand{font-size:20px}.brand small,.side-foot{display:none}.nav{display:flex;margin-top:16px;gap:2px}.nav button{padding:10px;font-size:12px;flex:1}.main{margin:0;padding:20px 14px}.top h1{font-size:22px}.profile{font-size:12px}.hero{padding:20px;gap:12px}.hero h2{font-size:18px}.hero p{font-size:12px}.stats{gap:8px}.stat{padding:15px 12px;font-size:12px}.stat strong{font-size:27px}.panel{padding:18px}.grid2{grid-template-columns:1fr}.filters input,.filters input[type=search]{width:100%}.filters>*{flex:1;min-width:120px}.login{display:block}.login-story{padding:24px}.login-story h1,.login-story p,.login-story>small{display:none}.login-box{padding:50px 25px}.detail{gap:18px}.top .avatar{display:none}}
.draft-notice{background:#edf4e8;border-radius:9px;padding:14px 16px;margin-bottom:22px;color:#42683c}.draft-notice small{display:block;margin-top:6px;color:#687a62}.draft-card{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}.draft-card p{margin:8px 0;overflow-wrap:anywhere}.draft-card>div{min-width:0}.draft-card button{flex-shrink:0}
@media(max-width:650px){.nav{flex-wrap:wrap}.nav button{flex:1 0 28%}.receipt-table{overflow:visible}.receipt-table table,.receipt-table tbody,.receipt-table tr,.receipt-table td{display:block;width:100%;white-space:normal}.receipt-table thead{display:none}.receipt-table tr{border:1px solid var(--line);border-radius:10px;margin:12px 0;padding:12px}.receipt-table td{border:0;padding:8px 0;overflow-wrap:anywhere}.receipt-table td[data-label]{display:flex;gap:12px;justify-content:space-between;text-align:right}.receipt-table td[data-label]:before{content:attr(data-label);color:var(--muted);flex-shrink:0;text-align:left}.receipt-table td:last-child button{width:100%}.pager{gap:8px;flex-wrap:wrap}.draft-card{align-items:flex-start}.draft-card button{padding:10px}.draft-notice{font-size:12px}}
.nav button{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 12px;border-radius:12px;color:#667b6e;transition:background-color .18s,color .18s}.nav button:hover{background:#f4f7f0;color:var(--green);filter:none}.nav-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;flex:0 0 32px;transition:background-color .18s,color .18s}.nav-icon svg{width:21px;height:21px}.nav button.active{background:#edf2e9;color:var(--green);font-weight:600}.nav button.active .nav-icon{background:#254d40;color:#fff;box-shadow:0 3px 8px #254d4018}.nav button:focus-visible{outline:2px solid #86a78e;outline-offset:3px}.nav-label{line-height:1.4}
@media(max-width:650px){.nav button{min-height:46px;padding:8px;gap:7px;border-radius:10px;justify-content:center}.nav-icon{width:26px;height:26px;flex-basis:26px;border-radius:7px}.nav-icon svg{width:18px;height:18px}.nav-label{font-size:12px}}
@media(prefers-reduced-motion:reduce){.nav button,.nav-icon{transition:none}}
.bottom-nav,.filter-toggle{display:none}.advanced-filters,.filter-actions{display:contents}.upload-choices{display:flex;gap:12px;justify-content:center}.upload-choices label{position:relative;margin:0;background:#254d40;color:white;border-radius:10px;padding:14px 20px;cursor:pointer;min-width:150px}.upload-choices input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.camera-choice{display:none}.upload-choices label:focus-within{outline:2px solid #86a78e;outline-offset:3px}.my-profile{display:flex;gap:16px;align-items:center;margin-bottom:20px}.my-profile .avatar{width:58px;height:58px;font-size:22px}.my-profile h2{margin:0}.my-profile p{margin-bottom:0}.my-menu{padding:8px 22px}.my-menu button{display:flex;align-items:center;gap:12px;border:0;border-radius:0;padding:18px 0;width:100%;text-align:left;border-bottom:1px solid var(--line)}.my-menu button:last-child{border-bottom:0}.my-menu small{display:block;font-size:12px;color:var(--muted);margin-top:6px}.my-menu b{margin-left:auto;font-size:24px;font-weight:400}.my-logout{width:100%;margin-top:22px;color:#a34b3c}.my-footer{text-align:center;margin:24px 0}
@media(max-width:650px){
 body{background:#f5f7f3;-webkit-tap-highlight-color:transparent}.sidebar{display:none}.main{padding:22px 16px calc(112px + env(safe-area-inset-bottom));min-height:100dvh}.top{margin-bottom:22px;padding-bottom:16px;border-bottom:0;align-items:flex-start}.top .eyebrow{font-size:10px;letter-spacing:1.8px;margin-bottom:8px}.top h1{font-size:27px;letter-spacing:.5px;margin:0}.top .profile{display:none}.bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;bottom:0;left:0;right:0;z-index:20;background:#fffffff5;backdrop-filter:blur(16px);border-top:1px solid #e2e9df;padding:8px 10px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -4px 20px #254d4006}.bottom-nav button{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:transparent;color:#8a998e;font-size:11px;min-height:54px;padding:3px}.bottom-nav .nav-icon{width:38px;height:30px;flex-basis:30px;border-radius:10px}.bottom-nav .nav-icon svg{width:21px;height:21px}.bottom-nav button.active{color:#254d40;font-weight:600}.bottom-nav button.active .nav-icon{background:#e5eddf}.bottom-nav button:focus-visible{outline:2px solid #86a78e}.hero{display:block;border-radius:18px;background:#254d40;color:white;padding:24px;margin-bottom:18px}.hero h2{font-size:21px;font-weight:600;line-height:1.6;max-width:240px}.hero p{color:#c7d8c9;font-size:12px;line-height:1.8}.hero #new{width:100%;margin-top:12px;background:#f1f6e9;color:#254d40;font-weight:600;border:0;min-height:50px;border-radius:12px;font-size:16px}.stats{gap:9px;margin-bottom:22px}.stat{padding:16px 11px;border-radius:14px;font-size:11px}.stat strong{font-size:29px;margin-top:10px}.panel{border-radius:16px;padding:18px;border-color:#e7ece3}.panel .between h2 small{display:none}.panel h2{font-size:17px}.panel .between{gap:12px}.panel .between #new{min-height:44px;padding:10px 14px}.panel #all{font-size:12px;padding:8px;border:0}.receipt-table tr{background:#fff;border-radius:14px;padding:15px;margin:14px 0;border-color:#e5eae1}.receipt-table td.receipt-doc{font-size:16px;font-weight:600;min-height:58px}.receipt-table .thumb{width:52px;height:52px;float:left;margin-right:12px}.receipt-table td small{font-size:11px;font-weight:400}.receipt-table td[data-label]{font-size:13px}.receipt-table td:last-child button{min-height:44px;background:#eef4e8;border-color:#eef4e8;font-weight:500}.filters{display:grid;grid-template-columns:minmax(0,1fr) 70px;margin:20px 0 12px;gap:10px}.filters>*{min-width:0}.filters input[type=search]{width:100%;min-height:44px}.filter-toggle{display:block;min-height:44px;padding:9px}.advanced-filters{display:none;grid-column:1/-1;grid-template-columns:1fr 1fr;gap:10px;padding:14px;background:#f6f8f2;border-radius:12px}.filters.expanded .advanced-filters{display:grid}.advanced-filters .muted{display:none}.advanced-filters input,.advanced-filters select{width:100%;min-width:0;min-height:44px}.filter-actions{display:flex;grid-column:1/-1;gap:10px}.filter-actions button{flex:1;min-height:44px}.form-panel input,.form-panel textarea,.form-panel select,.login-box input{font-size:16px;min-height:48px}.form-panel .grid2{gap:0}.form-panel label{font-size:14px}.draft-notice{padding:13px;margin:14px 0 22px;border-radius:10px}.draft-notice small{line-height:1.6}.drop{padding:20px 14px;border-radius:14px}.upload-choices{gap:10px;margin:18px 0}.upload-choices label{flex:1;min-width:0;padding:16px 8px;font-size:14px}.camera-choice{display:block!important}.gallery-choice{background:#e6eddf!important;color:#254d40!important}.form-submit{position:sticky;bottom:calc(80px + env(safe-area-inset-bottom));background:#fffffff5;padding:12px 0;margin-top:20px;border-top:1px solid var(--line);z-index:12;display:flex;flex-direction:column;align-items:stretch}.form-submit #save{min-height:50px;font-size:16px;border-radius:12px}.form-submit #progress:empty{display:none}.photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.photo img{height:145px;border-radius:12px}.photo button{min-height:42px;overflow-wrap:anywhere}.receipt-detail{display:flex;flex-direction:column}.detail-head{order:0;align-items:flex-start}.detail-head>div{width:100%;gap:8px}.detail-head button{flex:1;min-height:44px;white-space:nowrap;padding:10px 8px}.detail-head #void{flex:0 0 auto;border:0}.receipt-gallery{order:1}.receipt-summary{order:2;margin-top:18px;padding-top:22px;border-top:1px solid var(--line)}.receipt-history{order:3}.receipt-gallery .photos{grid-template-columns:1fr}.receipt-gallery .photo{background:#f5f7f2;border-radius:13px;padding:10px}.receipt-gallery img{height:auto;max-height:330px;object-fit:contain;background:white}.receipt-gallery a{display:inline-block;padding:10px 4px;font-size:12px;color:#426b52}.detail{gap:22px 16px}.detail strong{overflow-wrap:anywhere;line-height:1.7}.receipt-history .log{font-size:12px;line-height:1.8}.draft-card{flex-wrap:wrap;padding:18px 0}.draft-card>div.row{width:100%}.draft-card button{min-height:44px}.my-profile{border:0;background:#e9f0e1;padding:24px 18px}.my-menu{padding:5px 18px}.my-menu button{min-height:78px}.my-logout{min-height:48px}.login{min-height:100dvh;background:#f5f7f3;padding-bottom:env(safe-area-inset-bottom)}.login-story{border-radius:0 0 28px 28px;padding:40px 28px 45px}.login-story .brand{font-size:28px}.login-story .brand small{display:block;color:#c4d5c8;font-size:10px;margin-top:12px}.login-box{padding:32px 25px}.login-box form{background:white;padding:26px 22px;border-radius:20px;max-width:420px;border:1px solid #e8eee3}.login-box h2{font-size:24px;margin-top:0}.login-box .primary{min-height:50px}#toast{bottom:calc(88px + env(safe-area-inset-bottom));max-width:calc(100% - 32px);width:max-content;line-height:1.6}.lightbox{padding:12px}.lightbox button{top:calc(18px + env(safe-area-inset-top));min-height:44px}.shell:has(input:focus,textarea:focus) .bottom-nav{display:none}
}
.mobile-brand{display:none}html{overflow-anchor:none}@media(max-width:650px){.desktop-brand{display:none}.mobile-brand{display:inline;color:#587262;font-size:11px;letter-spacing:1.5px}}
@media(max-width:650px){.account-table{overflow:visible}.account-table table,.account-table tbody,.account-table tr,.account-table td{display:block;white-space:normal;width:100%}.account-table thead{display:none}.account-table tr{border:1px solid var(--line);border-radius:12px;margin:14px 0;padding:12px}.account-table td{border:0;padding:9px 0}.account-table td:first-child{font-weight:600;font-size:16px}.account-table td[data-label]{display:flex;justify-content:space-between;gap:14px}.account-table td[data-label]:before{content:attr(data-label);color:var(--muted)}.account-table td:last-child{display:flex;gap:8px}.account-table td:last-child button{flex:1;min-height:44px}}
.login-box label.remember-login{display:flex;align-items:center;gap:9px;margin:4px 0 8px;cursor:pointer;font-size:14px}.login-box .remember-login input{display:block;flex:0 0 18px;width:18px;height:18px;min-height:18px;margin:0;padding:0;accent-color:#254d40;cursor:pointer}.remember-help{color:var(--muted);font-size:12px;line-height:1.6;margin:0 0 10px}
.range-buttons{margin-bottom:18px}.dashboard-stats{margin-top:22px}.dashboard-stats strong{font-size:25px}.amount-bar{display:grid;grid-template-columns:100px 1fr 110px;align-items:center;gap:12px;margin:14px 0;font-size:12px}.amount-bar>div{background:#edf2e9;height:12px;border-radius:6px;overflow:hidden}.amount-bar i{display:block;background:#507d60;height:100%;border-radius:6px;min-width:2px}.amount-bar strong{text-align:right}.person-total{padding:16px 0;border-bottom:1px solid var(--line)}@media(max-width:650px){.dashboard-stats{grid-template-columns:1fr}.dashboard-stats .stat{padding:18px}.dashboard-stats strong{font-size:30px}.amount-bar{grid-template-columns:80px 1fr 90px;gap:8px}.range-buttons button{flex:1;padding:10px 6px}#dashboard-filter{display:grid;grid-template-columns:1fr 1fr;gap:12px}#dashboard-filter label{margin:0;min-width:0}#dashboard-filter input,#dashboard-filter select{min-width:0;width:100%;font-size:16px}#dashboard-filter button{min-height:46px}}

.receipt-table .thumb[data-preview]{cursor:zoom-in}.receipt-table .thumb[data-preview]:focus-visible{outline:2px solid #254d40;outline-offset:3px}

.product-lines{margin:10px 0 24px}.product-line{display:grid;grid-template-columns:minmax(140px,2fr) minmax(75px,1fr) minmax(100px,1fr) minmax(100px,1fr) auto;gap:12px;align-items:center;padding:18px 14px;border:1px solid var(--line);border-radius:12px;margin-bottom:12px}.product-line label{margin:0}.product-subtotal output{display:block;margin-top:15px;overflow-wrap:anywhere}.product-line [data-remove]{padding:10px}.product-line input{min-width:0}.product-subtotal{color:#42584b}@media(max-width:900px){.product-line{grid-template-columns:1fr 1fr}.product-line label:first-child{grid-column:1/-1}.product-line [data-remove]{justify-self:end}.product-subtotal{align-self:center}}

.bottom-nav{grid-template-columns:repeat(3,1fr)}
/* Compact receipt toolbar, with grouped actions on all screen sizes. */
#content>.panel:has(#filters)>.between{margin-bottom:16px;align-items:center}
#content>.panel:has(#filters)>.between h2{margin:0}
#filters{display:grid;grid-template-columns:minmax(150px,1.4fr) repeat(2,minmax(125px,1fr)) minmax(100px,.8fr) minmax(110px,.9fr) auto;gap:8px;margin:0 0 18px;align-items:center}
#filters:not(:has(#user-filter)){grid-template-columns:minmax(150px,1.4fr) repeat(2,minmax(125px,1fr)) minmax(100px,.8fr) auto}
#filters input,#filters select{width:100%;min-width:0;padding:9px 10px;height:40px}
#filters .advanced-filters{display:contents}
#filters .advanced-filters>.muted{display:none}
#filters .filter-actions{display:flex;gap:6px;flex-wrap:nowrap}
#filters .filter-actions button{padding:9px 12px;white-space:nowrap;height:40px}
@media(min-width:651px) and (max-width:1150px){#filters,#filters:not(:has(#user-filter)){grid-template-columns:repeat(3,minmax(0,1fr))}#filters .filter-actions button{flex:1}}
@media(max-width:650px){#content>.panel:has(#filters)>.between{margin-bottom:12px}#filters,#filters:not(:has(#user-filter)){grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:12px}#filters input,#filters select{height:44px;padding:10px;min-height:44px}#filters .filter-toggle{min-width:64px;padding:10px}#filters .advanced-filters{display:none;grid-column:1/-1;padding:10px;gap:8px}#filters.expanded .advanced-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#filters .filter-actions{grid-column:1/-1;gap:8px}#filters .filter-actions button{flex:1;min-height:44px;height:44px}#filters>*{min-width:0}}
