:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#0b0d0b;background:#f9f7f3;color-scheme:light;--canvas:#f9f7f3;--surface:#fffefa;--ink:#0b0d0b;--muted:#61635c;--line:rgba(20,22,18,.13);--lime:#9ccc14;--lime-soft:rgba(156,204,20,.14);--orange:#f56e1f;--green:#197d5b}*{box-sizing:border-box}body{margin:0;background:var(--canvas)}main{max-width:1180px;margin:auto;padding:24px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 0 24px;border-bottom:1px solid var(--line)}.topbar strong{font-size:27px;letter-spacing:-.05em}.topbar span{display:block;margin-top:3px;font-size:13px;color:var(--muted)}h1,h2,p{margin-top:0}h1{font-size:30px;letter-spacing:-.05em;margin-bottom:8px}h2{font-size:18px;margin-bottom:4px}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:8px}.login-layout{min-height:calc(100vh - 126px);display:grid;place-items:center;padding:54px 24px 72px}.login-shell{width:min(100%,384px)}.login-brand{padding-top:34px;margin-bottom:64px;text-align:center}.fine-mark{width:72px;height:72px;fill:var(--ink);margin-bottom:22px}.login-brand h1{font-size:20px;font-weight:700;letter-spacing:-.035em;margin-bottom:5px}.login-brand p{font-size:13px;color:var(--muted);margin:0}.login-form{display:grid;gap:14px}.login-form h2{font-size:20px;letter-spacing:-.035em;margin:0}.login-form>p{color:var(--muted);font-size:13px;margin:0 0 8px}form label{display:block;font-size:13px;font-weight:650}input,select{display:block;width:100%;margin-top:7px;padding:15px;border:1px solid var(--line);border-radius:0;background:var(--canvas);font:inherit;color:var(--ink)}input::placeholder{color:#90928b}input:focus,select:focus,button:focus-visible{outline:3px solid var(--lime-soft);outline-offset:2px;border-color:var(--ink)}.login-form button{margin-top:6px;min-height:56px;border-radius:12px;background:var(--ink);color:white}.login-footer{text-align:center;color:var(--muted);font-size:11px;margin:42px 0 0}button{appearance:none;border:0;border-radius:12px;background:var(--ink);color:white;padding:11px 16px;min-height:42px;font:inherit;font-weight:700;cursor:pointer}button:hover{opacity:.84}button:disabled{opacity:.45;cursor:not-allowed}.quiet{background:transparent;color:var(--ink);border:1px solid var(--line)}.danger{background:var(--orange)}.good{background:var(--green)}nav{display:flex;gap:5px;overflow:auto;padding:18px 0 4px;border-bottom:1px solid var(--line)}nav button,.segmented button{background:transparent;color:var(--muted);padding:9px 12px;min-height:36px;white-space:nowrap}.selected{color:var(--ink)!important;background:var(--lime-soft)!important}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;margin:34px 0 20px}.page-heading p,.muted{color:var(--muted);line-height:1.55}.overview-grid{display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:14px}.activity-card,.metric-card,.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px}.activity-card{display:flex;align-items:center;gap:22px;padding:20px}.ring{--progress:0deg;width:132px;height:132px;flex:none;border-radius:50%;background:conic-gradient(var(--lime) var(--progress),rgba(12,13,11,.08) 0);display:grid;place-items:center;position:relative;transition:background .45s ease}.ring:before{content:"";position:absolute;inset:11px;background:var(--surface);border-radius:50%}.ring div{position:relative;text-align:center}.ring strong{font-size:30px;display:block;letter-spacing:-.06em}.ring span{font-size:12px;color:var(--muted)}.activity-card p{font-size:14px;color:var(--muted);line-height:1.5}.metric-card{padding:21px;display:flex;flex-direction:column;justify-content:space-between;min-height:170px}.metric-card span,.metric-card small{color:var(--muted);font-size:13px}.metric-card strong{font-size:34px;letter-spacing:-.05em}.panel{padding:22px;margin-top:16px}.section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.section-title p{color:var(--muted);font-size:13px;margin-bottom:0}.segmented{background:var(--canvas);border-radius:12px;padding:3px}.chart{height:190px;display:flex;align-items:end;gap:5px;margin-top:24px;border-bottom:1px solid var(--line);padding-top:16px}.bar{background:var(--lime);border-radius:5px 5px 0 0;min-width:5px;flex:1;position:relative}.bar:hover:after{content:attr(data-label);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--ink);color:white;border-radius:6px;padding:5px 7px;font-size:11px}.entry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}.entry-grid button{background:var(--surface);border:1px solid var(--line);color:var(--ink);text-align:left;padding:18px}.entry-grid span{display:block;font-weight:500;font-size:13px;color:var(--muted);margin-top:6px}.toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:16px}.toolbar label{min-width:180px;flex:1;margin:0}.table-wrap{overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:16px}table{border-collapse:collapse;width:100%;min-width:800px;text-align:left}th,td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top;font-size:13px}th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}tr:last-child td{border-bottom:0}.status{display:inline-flex;padding:5px 8px;border-radius:99px;background:var(--lime-soft);font-size:12px}.status.disabled,.status.pending{background:rgba(245,110,31,.12);color:#9d3d05}.actions{display:flex;flex-wrap:wrap;gap:6px}.actions button{min-height:33px;padding:7px 10px;font-size:12px}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.summary-grid div{border:1px solid var(--line);padding:13px;border-radius:12px}.summary-grid span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}.record{padding:14px 0;border-top:1px solid var(--line)}.event-list{display:grid;gap:10px}.event{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}.event h2{font-size:16px}.event p{color:var(--muted);font-size:13px;margin-bottom:0}#status{min-height:24px;color:var(--muted);font-size:13px;margin:12px 0}@media(max-width:850px){.overview-grid{grid-template-columns:1fr 1fr}.activity-card{grid-column:span 2}.entry-grid{grid-template-columns:1fr 1fr}}@media(max-width:540px){main{padding:16px}.topbar{align-items:flex-start}.login-layout{min-height:calc(100vh - 106px);padding:34px 4px 48px}.login-brand{padding-top:22px;margin-bottom:52px}.overview-grid,.entry-grid,.summary-grid{grid-template-columns:1fr}.activity-card{grid-column:auto}.page-heading{margin-top:24px}.toolbar{align-items:stretch}.toolbar label{min-width:100%}}
.pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:14px;font-size:13px;color:var(--muted)}.pagination button{min-height:36px;padding:7px 12px}
[hidden]{display:none!important}
.membership-detail{min-width:220px;white-space:pre-line;line-height:1.6}
.status{margin:4px 4px 0 0}.record h3{font-size:14px;margin:16px 0 8px}.record p{font-size:13px;line-height:1.7;margin:4px 0;color:var(--muted)}
dialog{width:min(440px,calc(100% - 32px));border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--surface);color:var(--ink)}dialog::backdrop{background:rgba(11,13,11,.3)}
#app-status:empty{display:none}#app-status,#membership-error{color:#9d3d05;font-size:13px;line-height:1.6}
/* Match the current Fine AccountLoginView, with spacing adapted to desktop. */
:root{--canvas:#f9f7f4;--surface:#fffefa;--ink:#0b0d0b;--muted:#61635c}
.login-layout{min-height:calc(100svh - 126px);padding:36px 24px;align-items:center}
.login-shell{width:min(100%,384px)}
.login-brand{padding-top:0;margin-bottom:36px}
.login-brand h1{font-size:20px;margin-bottom:8px}
.login-form h2{text-align:center;font-size:20px}
.login-form>p{text-align:center;margin-bottom:4px}
.login-form label{font-weight:500}
.login-form input{height:50px;border-radius:0}
.login-footer{margin:12px 0 0;line-height:1.6}
#status:empty{display:none}
@media(max-width:540px){.login-layout{min-height:calc(100svh - 106px);padding:32px 8px}.login-brand{padding-top:0;margin-bottom:32px}}
@media(max-height:700px) and (min-width:541px){.login-layout{padding:24px}.login-brand{margin-bottom:24px}}
/* Keep compact labels horizontal; action cells must retain native table layout. */
.chart-range{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;font-size:12px;color:var(--muted)}
.dashboard-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:12px}
.dashboard-charts>.panel{margin-top:0;padding:18px 20px;min-width:0}
.dashboard-charts .section-title{min-height:48px}
.chart{height:110px;justify-content:space-between;gap:6px;margin-top:34px;margin-bottom:22px;padding-top:0;position:relative}
.chart:before{content:"0–" attr(data-maximum) " 人";position:absolute;right:0;top:-25px;font-size:11px;color:var(--muted)}
.bar{flex:0 1 18px;width:18px;min-width:3px;border-radius:3px 3px 0 0}
.bar:before{content:attr(data-count);position:absolute;top:-19px;left:50%;transform:translateX(-50%);font-size:11px;line-height:16px;color:var(--muted)}
.bar-date{position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted);white-space:nowrap}
.revenue-summary{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.revenue-summary span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}
.revenue-summary strong{font-size:18px}
.revenue-chart{display:block;margin-left:14px;margin-right:14px}
.revenue-chart:before{content:attr(data-scale)}
.revenue-chart svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.revenue-line{fill:none;stroke:var(--green);stroke-width:2;vector-effect:non-scaling-stroke}
.revenue-point{position:absolute;width:0;height:0}
.revenue-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--green);transform:translate(-50%,-50%)}
.revenue-value{position:absolute;bottom:10px;left:0;transform:translateX(-50%);font-size:10px;color:var(--muted);white-space:nowrap}
.revenue-date{position:absolute;top:calc(100% + 7px);transform:translateX(-50%);font-size:10px;color:var(--muted);white-space:nowrap}
.revenue-empty{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;color:var(--muted)}
@media(max-width:850px){.dashboard-charts{grid-template-columns:1fr}}
main{max-width:1540px;padding:24px 32px}
#app-view button,#logout{background:#fff;color:var(--ink);border:1px solid var(--line);font-weight:600;white-space:nowrap}
#app-view button:hover,#logout:hover{background:#f3f3ee;opacity:1}
#app-view button:disabled{opacity:.4}
#app-view nav{gap:8px;padding:18px 0 16px}
#app-view nav button{border-color:transparent;background:transparent}
#app-view .actions .danger{background:#fff;color:#9d3d05;border-color:#d6ad98}
#app-view .actions .danger:hover{background:#fff8f4}
.toolbar{gap:12px;align-items:flex-end}
.toolbar label{flex:0 1 320px;min-width:200px}
.toolbar input,.toolbar select{min-height:44px;padding:11px 13px;border-radius:10px;background:#fff}
.toolbar button{min-height:44px;padding:11px 22px}
table{min-width:1000px}
#users-page table{min-width:1320px}
th,td{padding:16px;vertical-align:middle;white-space:nowrap;line-height:1.6}
th{background:#f5f5f0;font-size:12px;font-weight:600;letter-spacing:0}
tbody tr:hover{background:rgba(20,22,18,.018)}
td:first-child{min-width:150px;max-width:220px;white-space:normal;overflow-wrap:anywhere}
.status{white-space:nowrap;align-items:center;min-height:28px;margin:4px 4px 4px 0;background:#f0f1eb;color:#4c5148}
.actions{display:table-cell;width:224px;min-width:224px;white-space:normal}
.actions button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;width:88px;margin:4px 6px 4px 0;padding:8px 6px;border-radius:9px;vertical-align:middle;line-height:1.4}
#admins-page .actions{width:250px;min-width:250px}
#admins-page .actions button{width:100px}
.membership-detail{font-size:12px}
.summary-grid div{min-width:0;line-height:1.6}
.summary-grid b{white-space:pre-line;overflow-wrap:anywhere;font-size:13px}
.event a{color:var(--ink);text-decoration:none;line-height:1.6}
.event a:hover{text-decoration:underline}
.event p{line-height:1.8;overflow-wrap:anywhere}
.record-group{border:1px solid var(--line);border-radius:12px;margin-top:12px;background:#fff}
.record-group>summary{padding:18px;font-size:15px;font-weight:650}
.record-group summary{cursor:pointer;line-height:1.6}
.record-group summary:focus-visible{outline:3px solid var(--lime);outline-offset:2px;border-radius:8px}
.record-group>div{padding:0 18px 16px}
.record-day{border-top:1px solid var(--line);padding:12px 0}
.record-day>summary{font-size:13px;font-weight:600;color:var(--muted)}
.record-day h3{font-size:14px;margin:16px 0 8px}
.record-day p{font-size:13px;line-height:1.8;margin:4px 0;color:var(--muted)}
@media(max-width:540px){main{padding:16px}.toolbar label{flex-basis:100%;min-width:0}.toolbar>button{width:100%}.pagination{justify-content:space-between;gap:8px}.section-title{flex-wrap:wrap}.segmented{display:flex}.actions button{min-height:44px}.panel{padding:16px}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Equal button boxes; native popovers float above the scrolling table. */
#users-page .actions{width:216px;min-width:216px;white-space:nowrap}
#users-page .actions button{width:92px;height:38px;min-height:38px;margin:0;vertical-align:middle}
.account-actions{display:inline-block;vertical-align:middle;margin-left:8px}
.account-actions [popover]{position:fixed;inset:auto;margin:0;width:168px;max-height:calc(100dvh - 16px);overflow:auto;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 8px 28px rgba(11,13,11,.14)}
.account-actions [popover]:popover-open{display:grid;gap:4px}
#users-page .account-actions [popover] button{width:100%;height:40px;min-height:40px;justify-content:flex-start;padding:8px 12px;border-color:transparent;border-radius:7px}
#users-page .account-actions [popover] .danger{color:#9d3d05}
@media(max-width:540px){#users-page .actions button{height:44px;min-height:44px}}
.user-tools{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:end;margin-bottom:20px}
.user-tools .toolbar{margin:0;flex-wrap:nowrap}
.user-tools .toolbar label{flex:1;min-width:0}
.user-tools .toolbar>button{flex:none;width:104px}
#information-request-result:empty{display:none}
#users-page td:first-child .status{margin-left:6px}
@media(max-width:850px){.user-tools{grid-template-columns:1fr;gap:16px}}