*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#f4f6f8;color:#1c2630;font:18px/1.7 "Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif}
.top,main,.foot{max-width:760px;margin:0 auto;padding:0 14px}
h1{font-size:1.35rem;line-height:1.35;margin:14px 0 8px}
h2{font-size:1.25rem;margin:0 0 8px}
h3{font-size:1.05rem;margin:20px 0 6px}
.notice{background:#fff4d6;border:2px solid #e0a800;border-radius:10px;padding:10px 12px;margin:0 0 10px;font-size:1rem;line-height:1.55}
.jump{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.jump a{flex:1 1 40%;text-align:center;background:#fff;border:1px solid #b9c4cf;border-radius:8px;padding:8px 6px;color:#124a7a;text-decoration:none;font-size:.95rem}
.card{background:#fff;border:1px solid #d5dce3;border-radius:12px;padding:16px 14px;margin:0 0 16px}
.lead{margin:0 0 12px}
.small{font-size:.85rem;color:#4b5966;margin:6px 0;line-height:1.55}
.hint{font-size:.9rem;color:#4b5966;margin:4px 0 8px;line-height:1.5}
.label{margin:10px 0 6px;font-weight:bold}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0}
input[type=text],select,textarea{font:inherit;font-size:1.05rem;padding:9px 10px;border:1px solid #8b98a5;border-radius:8px;background:#fff;max-width:100%}
input[type=text]{width:11em}
#recNums{width:100%;max-width:20em}
textarea{width:100%}
.grid{display:grid;grid-template-columns:repeat(9,1fr);gap:5px}
.grid button{font:inherit;font-size:1rem;min-height:40px;padding:0;border:1px solid #8b98a5;background:#fff;border-radius:8px;color:#1c2630}
.grid button[aria-pressed=true]{background:#124a7a;color:#fff;border-color:#124a7a;font-weight:bold}
.grid button.hi{border-color:#c9a227}
.sel{min-height:1.7em;margin:8px 0;font-weight:bold}
.msg{min-height:1.2em;margin:6px 0;font-size:.95rem;color:#8a2a00}
.msg.ok{color:#17653a}
.btn{font:inherit;font-size:1rem;display:inline-block;border:1px solid #124a7a;background:#fff;color:#124a7a;border-radius:10px;padding:10px 14px;margin:4px 6px 4px 0;min-height:44px;cursor:pointer}
.btn.primary{background:#124a7a;color:#fff}
.btn.danger{border-color:#a33;color:#a33}
.filebtn input{display:none}
.tools{margin-top:12px}
.ball{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#e8edf2;border:2px solid #b9c4cf;font-size:.98rem;font-weight:bold;margin:2px 2px 2px 0;color:#1c2630}
.ball.hit{background:#f08a00;border-color:#b86400;color:#fff}
.ball.bhit{background:#fff;border:3px solid #f08a00;color:#b86400}
.ball.mk{background:#124a7a;border-color:#124a7a;color:#fff}
.ball.bonus{background:#fff;border-style:dashed;border-color:#6a7a8a}
.bonuslabel{font-size:.8rem;color:#4b5966;margin:0 2px}
.rec{border:1px solid #d5dce3;border-radius:10px;padding:10px;margin:0 0 10px}
.rec .head{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}
.badge{display:inline-block;border-radius:999px;padding:2px 12px;font-weight:bold;font-size:1rem;background:#e8edf2}
.badge.win{background:#f08a00;color:#fff}
.rec .detail{font-size:.9rem;color:#4b5966;margin:4px 0}
.rec .del{font-size:.9rem;min-height:40px;padding:6px 10px}
.user-tag{display:inline-block;font-size:.75rem;background:#e0f0e6;color:#17653a;border-radius:6px;padding:0 6px;margin-left:4px;vertical-align:middle}
.pastlist .d{display:grid;grid-template-columns:64px 1fr;gap:6px;align-items:center;border-bottom:1px solid #e3e8ed;padding:6px 0}
.pastlist .d.mark{background:#eaf3fb}
.pastlist .d .nm{font-size:.95rem;line-height:1.3}
.pastlist .d .nm small{display:block;color:#4b5966;font-size:.75rem}
.pastlist .ball{width:30px;height:30px;font-size:.88rem}
.userlist .u{display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid #e3e8ed;padding:6px 0;flex-wrap:wrap}
.check{display:block;margin:8px 0}
.mix{margin:12px 0}
.foot{padding:8px 14px 40px;color:#4b5966;font-size:.85rem;line-height:1.6}
.foot a{color:#124a7a}
@media (max-width:420px){body{font-size:17px}.grid{gap:4px}}