.apr{--g9:#14532d;--g7:#15803d;--g5:#22c55e;--g2:#bbf7d0;--g1:#dcfce7;--g0:#f0fdf4;max-width:680px;margin:2rem auto;background:#fff;border:1px solid var(--g2);border-radius:20px;box-shadow:0 10px 30px rgba(21,128,61,.12);overflow:hidden;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1f2937}
.apr *{box-sizing:border-box}
.apr-head{background:linear-gradient(135deg,var(--g7),var(--g9));color:#fff;padding:22px 26px}
.apr-head h3{margin:0 0 14px;color:#fff;font-size:1.3rem}
.apr-steps{display:flex;gap:8px}
.apr-steps span{flex:1;text-align:center;font-size:.78rem;padding:6px 4px;border-radius:99px;background:rgba(255,255,255,.18)}
.apr-steps span.on{background:#fff;color:var(--g9);font-weight:600}
.apr-steps span.ok{background:var(--g5);color:#fff}
.apr-body{padding:26px}
.apr label{display:block;font-size:.85rem;font-weight:600;color:var(--g9);margin:14px 0 6px}
.apr select,.apr input[type=text],.apr input[type=email],.apr input[type=tel],.apr input[type=date]{width:100%;padding:12px 14px;border:1.5px solid var(--g2);border-radius:12px;font-size:1rem;background:var(--g0);transition:.15s}
.apr select:focus,.apr input:focus{outline:none;border-color:var(--g7);box-shadow:0 0 0 3px var(--g1);background:#fff}
.apr-card{margin-top:18px;background:var(--g0);border:1px solid var(--g2);border-radius:14px;padding:14px;display:flex;gap:14px;align-items:flex-start;animation:apr-in .25s}
.apr-card img{width:110px;height:110px;object-fit:cover;border-radius:10px;flex:none}
.apr-card p{margin:0;line-height:1.5;font-size:.93rem}
.apr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:12px}
.apr-slot{padding:10px 4px;border:1.5px solid var(--g2);background:#fff;border-radius:10px;cursor:pointer;font-size:.9rem;color:var(--g9)}
.apr-slot:hover{background:var(--g1)}
.apr-slot.sel{background:var(--g7);color:#fff;border-color:var(--g7)}
.apr-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.apr-sum{background:var(--g0);border:1px dashed var(--g5);border-radius:12px;padding:12px 14px;font-size:.9rem;line-height:1.6}
.apr-nav{display:flex;justify-content:space-between;gap:10px;margin-top:24px}
.apr-btn{border:0;border-radius:12px;padding:12px 24px;font-size:1rem;font-weight:600;cursor:pointer;background:var(--g7);color:#fff}
.apr-btn:hover:not(:disabled){background:var(--g9)}
.apr-btn:disabled{opacity:.45;cursor:not-allowed}
.apr-btn.ghost{background:#fff;color:var(--g7);border:1.5px solid var(--g2)}
.apr-msg{margin-top:12px;font-size:.88rem;color:#b91c1c}
.apr-hint{margin-top:12px;font-size:.88rem;color:#6b7280}
.apr-hp{position:absolute;left:-9999px;opacity:0}
.apr-ok{text-align:center;padding:10px 0}
.apr-ok .tick{width:78px;height:78px;border-radius:50%;background:var(--g1);color:var(--g7);display:flex;align-items:center;justify-content:center;font-size:2.4rem;margin:0 auto 14px;animation:apr-pop .4s}
.apr-ok h3{color:var(--g9);margin:.2rem 0 .6rem}
.apr-ok .apr-sum{text-align:left;margin:16px 0}
.apr-ok a.apr-btn{display:inline-block;text-decoration:none;margin:4px;font-size:.92rem}
@keyframes apr-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes apr-pop{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:520px){.apr-row{grid-template-columns:1fr}.apr-card{flex-direction:column}.apr-card img{width:100%;height:150px}.apr-body{padding:18px}}