:root{--color-brand:#0b4f9c;--color-brand-dark:#083a73;--color-on-brand:#fff;--color-bg:#f4f6f9;--color-surface:#fff;--color-text:#111827;--color-text-sub:#4b5563;--color-border:#c9d1dc;--color-ok:#0f7a3d;--color-warn:#a15c00;--color-ng:#b42318;--font-base:18px;--font-large:22px;--button-height:64px;--radius:12px;--gutter:16px}*,:before,:after{box-sizing:border-box}html,body{margin:0}body{background:var(--color-bg);color:var(--color-text);font-family:system-ui,-apple-system,Hiragino Sans,Yu Gothic UI,Meiryo,sans-serif;font-size:var(--font-base);line-height:1.6}.app-header{padding:12px var(--gutter);padding-top:max(12px, env(safe-area-inset-top));background:var(--color-brand);color:var(--color-on-brand);align-items:center;gap:12px;display:flex;position:sticky;top:0}.app-logo{background:var(--color-on-brand);width:40px;height:40px;color:var(--color-brand);border-radius:8px;place-items:center;font-weight:700;display:inline-grid}.app-title{font-size:var(--font-large);font-weight:700}.app-main{gap:var(--gutter);max-width:960px;padding:var(--gutter);margin:0 auto;display:grid}.card{padding:var(--gutter);border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface)}.card h1,.card h2{font-size:var(--font-large);margin:0 0 8px}.card p{color:var(--color-text-sub);margin:0}.card>*+*{margin-top:12px}.error,.card p.error{color:var(--color-ng);font-weight:700}.button{width:100%;min-height:var(--button-height);border:2px solid var(--color-brand);border-radius:var(--radius);background:var(--color-brand);color:var(--color-on-brand);font:inherit;font-size:var(--font-large);cursor:pointer;justify-content:center;align-items:center;padding:0 20px;font-weight:700;text-decoration:none;display:inline-flex}.button:active{background:var(--color-brand-dark)}.button:disabled{opacity:.6;cursor:default}.button-secondary{background:var(--color-surface);color:var(--color-brand)}.button-secondary:active{background:var(--color-bg)}.button-small{width:auto;min-height:48px;font-size:var(--font-base)}.member-list{margin:0;padding:0;list-style:none}.member-row{border-top:1px solid var(--color-border);padding:12px 0}.member-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.member-name{font-weight:700}.card .member-sub,.member-sub{color:var(--color-text-sub);font-size:15px}.issued{gap:8px;margin-top:12px;display:grid}.issued-link{border:1px solid var(--color-border);width:100%;min-height:48px;font:inherit;border-radius:8px;padding:0 12px;font-size:15px}.issued-actions{flex-wrap:wrap;gap:8px;display:flex}.greeting{margin:0;font-weight:700}.flash{padding:12px var(--gutter);border-radius:var(--radius);background:var(--color-ok);color:#fff;margin:0;font-weight:700}.card .punch-date{color:var(--color-text-sub)}.card .punch-status{color:var(--color-text);font-size:var(--font-large);font-weight:700}.card .punch-current{color:var(--color-text);flex-wrap:wrap;align-items:baseline;gap:8px;font-size:26px;font-weight:700;line-height:1.3;display:flex}.punch-since{color:var(--color-text-sub);font-size:var(--font-base);font-weight:400}.segments{margin:0;padding:0;list-style:none}.segments li{border-top:1px solid var(--color-border);gap:12px;padding:8px 0;display:flex}.segment-time{min-width:8.5em;color:var(--color-text-sub);font-variant-numeric:tabular-nums;flex:none}.field{gap:4px;display:grid}.field-label{color:var(--color-text-sub);font-size:15px}.select,.text-input{border:2px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);width:100%;min-height:56px;color:var(--color-text);font:inherit;font-size:var(--font-large);padding:0 12px}.page-narrow{gap:var(--gutter);width:100%;max-width:640px;margin:0 auto;display:grid}.admin-nav{flex-wrap:wrap;gap:8px;display:flex}.admin-tab{border:2px solid var(--color-brand);border-radius:var(--radius);background:var(--color-surface);min-height:48px;color:var(--color-brand);text-align:center;flex:auto;padding:10px 16px;font-weight:700;text-decoration:none}.admin-tab-current{background:var(--color-brand);color:var(--color-on-brand)}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.card .page-head h1,.card .page-head h2{margin:0}.inline-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.inline-row>.select,.inline-row>.text-input{flex:200px;width:auto}.inline-row>.button:not(.button-small){flex:160px}.inline-row>.date-input{flex:0 200px}.badge{background:var(--color-bg);color:var(--color-text-sub);vertical-align:middle;border-radius:999px;margin-left:8px;padding:0 8px;font-size:14px;font-weight:700;display:inline-block}.badge-ng{background:var(--color-ng);color:#fff}.member-row-inactive .member-name{color:var(--color-text-sub)}.form-grid{grid-template-columns:1fr;gap:12px;display:grid}@media (width>=720px){.form-grid{grid-template-columns:1fr 1fr}.field-wide{grid-column:1/-1}}.check{cursor:pointer;align-items:flex-start;gap:10px;display:flex}.check input{flex:none;width:24px;height:24px;margin-top:3px}.punch-range{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}.segment-site{flex:1}.member-head>.inline-row{flex-wrap:nowrap;flex:none}
