:root{font-family:Arial,Helvetica,sans-serif;color:#202124;background:#f4f4f4}*{box-sizing:border-box}body{margin:0}header{background:#171717;color:#fff;padding:18px max(16px,calc((100% - 1100px)/2));border-bottom:5px solid #b5121b;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-size:clamp(24px,4vw,34px);font-weight:900;font-style:italic;color:#fff;text-shadow:2px 2px #b5121b}.subtitle{font-size:11px;letter-spacing:1.3px;color:#ddd}main{max-width:1100px;margin:24px auto;padding:0 16px}.welcome h1{font-size:25px;margin:0 0 6px}.muted{color:#666;margin:0}.notice{background:#fff4e5;border-left:4px solid #d18a16;padding:12px 14px;border-radius:8px;margin:18px 0;color:#594019;font-size:14px}.nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;margin:20px 0}.nav button{background:white;border:1px solid #ddd;border-radius:10px;padding:15px 12px;font-size:16px;font-weight:700;text-align:left;cursor:pointer}.nav button.active{background:#b5121b;color:white;border-color:#b5121b}.page{background:white;border:1px solid #ddd;border-radius:12px;padding:22px;min-height:220px}.page h1{margin:0 0 8px;font-size:25px}.eyebrow{color:#b5121b;font-weight:bold;font-size:11px;letter-spacing:1.4px;margin:0 0 7px}.empty-state{margin-top:28px;padding:24px;background:#f8f8f8;border-radius:10px}.empty-state h2{margin:0 0 8px}.empty-state p{color:#666;margin:0;line-height:1.5}footer{max-width:1100px;margin:24px auto;padding:0 16px 25px;color:#777;font-size:12px}@media(max-width:520px){main{margin-top:16px}.nav{grid-template-columns:repeat(2,minmax(0,1fr))}.nav button{padding:14px 10px;font-size:15px}.page{padding:17px}}
.data-form{background:#f8f8f8;border:1px solid #e5e5e5;border-radius:12px;padding:18px;margin-top:20px}.data-form h2,.list-title{font-size:19px;margin:0 0 15px}.data-form label{display:block;font-size:14px;font-weight:700;margin:0 0 13px}.data-form input,.data-form select{display:block;width:100%;margin-top:6px;border:1px solid #ccc;border-radius:8px;padding:12px;font-size:16px;background:white;min-height:44px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.primary{background:#b5121b;color:white;border:0;border-radius:8px;padding:13px 20px;font-size:16px;font-weight:700;cursor:pointer}.primary:disabled{opacity:.45}.list-title{margin-top:24px}.record{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid #e2e2e2;border-radius:9px;padding:13px 15px;margin:9px 0}.record small{display:block;color:#666;margin-top:4px;overflow-wrap:anywhere}.delete{border:1px solid #ddd;background:white;border-radius:7px;padding:8px 11px;color:#a00;cursor:pointer}.status{font-size:12px;background:#eee;border-radius:20px;padding:5px 9px;white-space:nowrap}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}.stats>div{background:#f8f8f8;border:1px solid #e5e5e5;border-radius:10px;padding:18px}.stats b{display:block;font-size:28px}.stats span{color:#666;font-size:13px}@media(max-width:520px){.form-row{grid-template-columns:1fr}.data-form{padding:14px}.record{align-items:flex-start}}
.nav{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}.nav button{min-height:116px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;padding:18px 20px;border:1px solid #e3e3e3;box-shadow:0 3px 10px #0000000a;transition:transform .15s,box-shadow .15s}.nav button:hover{transform:translateY(-2px);box-shadow:0 7px 18px #00000012}.nav-icon{font-size:30px;line-height:1}.nav button span:last-child{font-size:17px}.nav button.active{background:#171717;border-color:#b5121b;color:white;box-shadow:inset 0 -4px #b5121b}.page{box-shadow:0 3px 14px #00000008}.page-heading{padding-bottom:14px;border-bottom:1px solid #eee}.eyebrow{margin-top:0}@media(max-width:520px){.nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.nav button{min-height:105px;padding:14px}.nav-icon{font-size:27px}.nav button span:last-child{font-size:15px}}