@keyframes snow {0%{background-position:0 0,0 0,0 0}100%{background-position:500px 1000px, 400px 800px, 300px 600px}}
@keyframes bounce {0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(-14px)}60%{transform:translateY(-6px)}}
:root{ --red:#c81d25; --green:#1f8a3b; --gold:#d4a017; --snow:#f7f9fc; --ink:#222; }
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background:var(--snow);color:var(--ink);margin:0}
.snow-bg{background:linear-gradient(180deg,#fff7f7 0%,#ffffff 50%,#f6fbff 100%);
  background-image:
    radial-gradient(#ffffff 1px, transparent 1px),
    radial-gradient(#e3f2fd 1px, transparent 1px),
    radial-gradient(#ffffff 1px, transparent 1px);
  background-size: 6px 6px, 8px 8px, 10px 10px;
  animation: snow 20s linear infinite;
}
.site-header{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px;border-bottom:4px solid var(--green);background:linear-gradient(90deg,var(--green),var(--red));color:#fff}
.site-header .logo{font-size:2.4rem}
.site-header h1{margin:0;font-weight:800;letter-spacing:.5px;text-shadow:0 2px 4px rgba(0,0,0,.15)}
.subtitle{margin:0;opacity:.95}
.container{max-width:820px;margin:24px auto;background:#fff;padding:24px;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.card{border:1px solid #e5e7eb;border-radius:12px;padding:16px;margin:16px 0;background:linear-gradient(180deg,#fff,#fffdf6)}
h1,h2,h3{color:var(--red)}
label{display:block;margin:10px 0;font-weight:600}
input,select,button{padding:10px;font-size:1rem;border-radius:8px;border:1px solid #d1d5db}
input:focus,select:focus{outline:2px solid var(--green);border-color:var(--green)}
.btn{background:var(--red);color:#fff;border:none;cursor:pointer;padding:10px 16px;border-radius:10px}
.btn:hover{background:#a2161b}
.btn-secondary{background:var(--green);color:#fff}
.btn-secondary:hover{background:#176a2d}
.note{color:#555;font-size:.95rem}
.error{color:#b00020}
.footer{padding:16px;text-align:center;color:#333}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid #eee;padding:8px;text-align:left}
.table thead th{background:#f5f5f5}
.result{font-size:1.2rem;background:#fff3cd;border:1px solid #ffeeba;padding:14px;border-radius:10px}
.name{font-size:2rem;color:var(--green)}
.bounce{animation:bounce 2s ease}
.tips ul{margin:0 0 0 18px}