body{font-family:Arial, sans-serif;background:#f8fafb;color:#111;margin:0;}
.container{max-width:920px;margin:20px auto;padding:20px;background:#fff;border-radius:10px;box-shadow:0 6px 18px rgba(12,20,30,0.06);}
h1{margin:0 0 14px;font-size:20px;text-align:center;}
.row{display:flex;gap:12px;}
label{display:block;font-size:13px;margin-bottom:8px;color:#444;flex:1;}
input{width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;}
.table-area{margin-top:12px;overflow:auto;}
table{width:100%;border-collapse:collapse;}
th,td{padding:8px;border:1px solid #eaeaea;text-align:left;font-size:13px;vertical-align:middle;}
th{background:#fafafa;font-weight:700;}
.muted{background:transparent;border:1px dashed #aaa;padding:6px;border-radius:6px;margin-top:8px;cursor:pointer;}
#sig-wrapper{border:1px solid #ccc;border-radius:6px;height:160px;touch-action:none;overflow:hidden;}
canvas{width:100%;height:160px;display:block;}
.actions{display:flex;gap:8px;margin-top:16px;}
button{background:#0b6efd;color:white;border:0;padding:10px 14px;border-radius:8px;cursor:pointer;}
button.muted{background:#fff;color:#555;border:1px solid #ccc;}
.beginning-label{text-align:left;font-weight:600;padding-left:12px;}
.beginning-input input{text-align:right;}
.t-bal{text-align:left;font-weight:600;}
@media(max-width:720px){.row{flex-direction:column;}}