:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#172b46;background:#f3f6fb}*{box-sizing:border-box}body{margin:0}main{max-width:1120px;margin:64px auto;padding:0 24px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{color:#4169dc;font-size:13px;font-weight:600}h1{margin:10px 0;font-size:32px}header p{color:#728096;margin:0}section{background:white;border:1px solid #e3e9f2;border-radius:14px;padding:28px;box-shadow:0 8px 28px #263e6110}#login{max-width:420px;margin:0 auto}h2{font-size:21px;margin-top:0}label{display:flex;flex-direction:column;gap:9px;font-size:14px}form{display:grid;gap:22px}input,select{border:1px solid #d9e1ed;border-radius:7px;padding:11px;font:inherit;background:white;color:inherit}button{background:#355ee8;color:white;border:0;border-radius:7px;padding:12px 20px;font:inherit;font-size:14px;cursor:pointer}.secondary{background:#edf1f8;color:#445571}button:disabled{opacity:.5;cursor:default}.toolbar{display:flex;align-items:flex-end;gap:14px;margin-bottom:24px}.toolbar label{min-width:170px}#count{margin-left:auto;color:#728096;padding-bottom:12px;font-size:14px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left;font-size:14px}th{background:#f6f8fc;color:#63728a;font-weight:500}th,td{padding:16px;border-bottom:1px solid #edf0f5}td:nth-child(2){font-family:monospace}#empty{text-align:center;padding:40px;color:#728096}#message{font-size:14px;color:#326546}.error{color:#bd3445!important}[hidden]{display:none!important}input:focus,select:focus,button:focus-visible{outline:2px solid #7897fa;outline-offset:2px}@media(max-width:600px){main{margin:28px auto;padding:0 14px}section{padding:18px}.toolbar{flex-wrap:wrap}#count{margin-left:0}h1{font-size:26px}}
:root{background:#f5f7fb;color:#24334c}body{background:radial-gradient(ellipse at 85% 0%,#e8edff 0%,transparent 45%);min-height:100vh}main{max-width:1280px;margin:48px auto}header{margin-bottom:30px;padding:0 2px}h1{font-size:30px;letter-spacing:-1px}header p{font-size:14px;line-height:1.8}.eyebrow{letter-spacing:2px;font-size:12px}section{padding:0;border-radius:18px;border:1px solid #e4e9f2;box-shadow:0 12px 40px #233a6210;overflow:hidden}#login{padding:32px;margin-top:60px}.panel-heading{padding:26px 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eef1f6}.panel-heading h2{font-size:18px;margin:0 0 8px}.panel-heading p{font-size:13px;color:#8290a5;margin:0}.live{font-size:12px;color:#6f7e94;white-space:nowrap}.live:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#26a880;margin-right:8px}.toolbar{margin:0;padding:24px 28px;background:#fcfdff;gap:12px;flex-wrap:wrap}.toolbar label{min-width:155px;font-size:12px;color:#66768d;font-weight:500}.toolbar input,.toolbar select{height:42px;font-size:14px;color:#24334c;min-width:165px;border-radius:9px}button{height:42px;border-radius:9px;padding:0 18px;font-weight:500;transition:background .15s,box-shadow .15s}button:hover:not(:disabled){background:#254bcd;box-shadow:0 3px 9px #355ee82a}.secondary{background:#f0f3f9;color:#596a83;border:1px solid #e5eaf3}.secondary:hover:not(:disabled){background:#e7edf7;box-shadow:none}.date-actions{display:flex;gap:6px}.date-actions button{padding:0 12px;font-size:12px}#export{margin-left:auto}.list-meta{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;border-top:1px solid #edf0f5}#count{margin:0;padding:0;color:#445571;font-weight:600;font-size:13px}#updated{font-size:12px;color:#929db0}.table-wrap{padding:0 16px 16px}th{font-size:12px;color:#7b89a0;letter-spacing:.3px;background:#f7f9fc;padding:14px 18px}td{padding:18px;font-size:13px;border-color:#f0f3f7}td:first-child{font-weight:500}td:nth-child(2){font-size:13px;letter-spacing:.3px;color:#375384}td:nth-child(3),td:nth-child(4){color:#7c8aa1;font-size:12px}tbody tr:hover{background:#f8faff}.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:6px;font-size:11px;white-space:nowrap}.badge:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.pending{background:#fff5e6;color:#b57a21}.done{background:#eaf7f1;color:#338366}#empty{margin:0;padding:58px 20px;font-size:13px;background:#fcfdff}#message{padding:0 4px;line-height:1.7}@media(max-width:700px){main{margin:24px auto}.panel-heading{padding:20px;gap:12px;align-items:flex-start}.live{font-size:10px}.toolbar{padding:20px;gap:12px}.toolbar label{flex:1;min-width:135px}.toolbar input,.toolbar select{width:100%;min-width:0}#export{margin-left:0}.list-meta{padding:16px 20px}.table-wrap{padding:0 6px 10px}th,td{padding:14px 12px}header p{font-size:12px}h1{font-size:26px}}

.delete-button{height:30px;padding:0 12px;background:#fff0f0;color:#c34c4c;border:1px solid #f5dada;font-size:12px}.delete-button:hover:not(:disabled){background:#ffe3e3;color:#ad3434;box-shadow:none}
.export-result{margin:0 28px 18px;padding:18px;border:1px solid #dce8fb;background:#f4f8ff;border-radius:12px;display:flex;align-items:center;flex-wrap:wrap;gap:14px}.export-result strong{font-size:14px;color:#34547f}.export-result p{font-size:12px;margin:8px 0 0;overflow-wrap:anywhere;color:#74859c}.export-file-actions{display:flex;gap:10px;margin-left:auto}.download-file{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:9px;text-decoration:none;background:#355ee8;color:white;font-size:14px;font-weight:500}.download-hint{flex-basis:100%}
@media(max-width:700px){
  body{min-width:0}main{padding:0 14px;margin:24px auto;padding-bottom:env(safe-area-inset-bottom)}
  header{gap:12px;align-items:flex-start}header p{max-width:245px}#logout{flex-shrink:0;padding:0 12px;font-size:12px}
  #login{margin-top:30px;padding:24px}input,select{font-size:16px!important;min-height:44px;min-width:0}
  .panel-heading{flex-direction:column;gap:10px;padding:20px}.toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:18px;gap:12px 10px;background:#f8faff}.toolbar label{min-width:0;gap:8px;font-size:12px;color:#7b89a0}.toolbar input,.toolbar select{box-sizing:border-box;display:block;width:100%;max-width:100%;height:46px;min-height:46px;max-height:46px;margin:0;padding:0 12px;border:1px solid #dce4f0;border-radius:11px;background-color:white;font-size:16px;line-height:normal;box-shadow:0 2px 4px #213f7010;-webkit-appearance:none;appearance:none}.toolbar select{padding-right:30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%23798ba8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.toolbar input[type=date]{text-align:left;min-inline-size:0}.toolbar input[type=date]::-webkit-date-and-time-value{text-align:left;line-height:44px;margin:0}.toolbar input[type=date]::-webkit-datetime-edit{padding:0}.toolbar input[type=date]::-webkit-calendar-picker-indicator{width:16px;height:16px;margin:0;padding:0;opacity:.6}.date-actions{grid-column:1/-1;gap:8px}.date-actions button{height:36px;min-height:36px;border-radius:9px;font-size:12px;flex:1;background:#eef3fa;border-color:#e2e9f4;color:#60738f}#export{margin:4px 0 0;height:46px;border-radius:11px}#refresh{margin-top:4px;height:46px;border-radius:11px;background:white}
  .table-wrap{overflow:visible;padding:0 14px 14px}table,tbody{display:block;width:100%;white-space:normal}thead{display:none}tr{display:block;margin-bottom:12px;border:1px solid #e5ebf4;border-radius:12px;padding:8px 14px;background:white}tbody tr:hover{background:white}td{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:10px 0!important;border:0;font-size:13px;overflow-wrap:anywhere;text-align:right}td:before{content:attr(data-label);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;font-size:12px;font-weight:400;color:#8b98ac;flex-shrink:0;text-align:left}td:first-child{border-bottom:1px solid #f0f3f7;margin-bottom:4px;padding-bottom:14px!important}td:last-child{border-top:1px solid #f0f3f7;align-items:center}.delete-button{height:40px;min-width:70px}td:nth-child(2){font-size:14px}
  .list-meta{padding:16px 18px}#updated{font-size:11px}#empty{padding:40px 18px;line-height:1.8}.export-result{margin:0 18px 16px;padding:16px;display:block}.export-file-actions{margin-top:14px;display:flex}.export-file-actions>a,.export-file-actions>button{flex:1;min-height:44px;padding:0 12px;white-space:nowrap}.download-hint{line-height:1.7}
}

/* Compact workspace layout and aligned filter controls. */
main{margin:0 auto;padding:20px 24px 32px}header{margin-bottom:22px;gap:20px}header .eyebrow{display:none}h1{margin:0 0 8px;font-size:28px;letter-spacing:-.6px}header p{font-size:13px;color:#7b89a0}#logout{height:40px;background:#fff;border-color:#dfe6f0}section{border-radius:16px;box-shadow:0 8px 30px #233a6208}.panel-heading{padding:20px 24px}.panel-heading h2{margin-bottom:6px}.toolbar{padding:18px 24px;gap:10px;background:#fafbfe}.toolbar input,.toolbar select,.toolbar>button,.date-actions button{height:44px;min-height:44px}.toolbar label{gap:8px}.toolbar input,.toolbar select{border-radius:10px}.export-result{margin:0 24px 16px;padding:14px 16px;gap:10px;border-color:#dce9e5;background:#f3faf7}.export-result strong{color:#27745a}.export-result p{margin-top:5px;font-size:12px}.download-hint{display:none}.export-file-actions{gap:8px}.download-file{min-height:44px}.list-meta{padding:16px 24px}.table-wrap{padding:0 12px 12px}th{padding:13px 16px}td{padding:16px}#empty{padding:44px 20px}
@media(max-width:700px){main{padding:16px 14px max(24px,env(safe-area-inset-bottom));margin:0 auto}header{margin-bottom:18px;gap:12px}h1{font-size:24px;margin-bottom:6px}header p{font-size:12px;line-height:1.6}#logout{height:36px;padding:0 10px;font-size:12px}.panel-heading{padding:18px;flex-direction:row;align-items:center;gap:12px}.panel-heading h2{font-size:16px}.panel-heading p{font-size:11px;line-height:1.6}.live{font-size:10px}.toolbar{padding:16px;gap:12px 10px}.toolbar input,.toolbar select,.toolbar>button{height:46px;min-height:46px;max-height:46px}.date-actions button{height:36px;min-height:36px}.export-result{margin:0 16px 14px;padding:14px}.export-file-actions{margin-top:12px}.download-hint{display:block;line-height:1.7}.list-meta{padding:14px 16px}.table-wrap{padding:0 12px 12px}}
@media(max-width:380px){.panel-heading{flex-direction:column;align-items:flex-start;gap:8px}}

/* Additional filters stay aligned instead of squeezing date/search fields. */
.toolbar label{flex:0 1 165px;min-width:145px}.toolbar input,.toolbar select{width:100%;min-width:0}.toolbar input[type=search]{appearance:none;-webkit-appearance:none}
.live{font-variant-numeric:tabular-nums}#refresh-countdown{display:inline-block;min-width:2ch;font-weight:600;color:#27866a;text-align:center}
@media(min-width:701px) and (max-width:1100px){.toolbar{gap:14px 12px}.toolbar label{flex:1 1 180px}.date-actions{order:1}#export{order:2}#refresh{order:3}}
@media(max-width:700px){.toolbar label{min-width:0}.toolbar label:has(#name-search){grid-column:1/-1}.toolbar input[type=search]{height:46px;min-height:46px}.date-actions{grid-row:2}.live{white-space:nowrap}}

#search{background:#eaf0ff;color:#355ee8;border:1px solid #d6e1ff;min-width:76px}#search:hover:not(:disabled){background:#dde7ff;box-shadow:none}
@media(min-width:701px) and (max-width:1100px){#search{order:2}#export{order:3}#refresh{order:4}}
@media(max-width:700px){#search{grid-column:1/-1;margin-top:0;height:46px;border-radius:11px}}
