*{box-sizing:border-box}
:root{font-family:Inter,Arial,Helvetica,sans-serif;color:#17202a;background:#f6f7f9}
body{margin:0;min-height:100vh;background:linear-gradient(135deg,#f7f8fa,#eef1f5)}
.page{min-height:100vh;display:flex;justify-content:center;padding:42px 16px}
.card{width:min(650px,100%);background:#fff;border-radius:18px;box-shadow:0 12px 45px rgba(20,30,45,.10);padding:28px 30px 32px}
.hero-image{height:150px;border-radius:14px;background:linear-gradient(135deg,#eceff3,#d8dde4);display:flex;align-items:center;justify-content:center;gap:16px;overflow:hidden;position:relative}
.hero-image:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.32);right:-70px;top:-100px}
.rating-badge{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:32px;color:#f2b400;box-shadow:0 5px 18px rgba(0,0,0,.10);z-index:1}
.hero-title{font-size:24px;font-weight:800;line-height:1.05;letter-spacing:.3px;z-index:1}
h1{font-size:28px;text-align:center;margin:26px 0 10px;line-height:1.2}
.notice{text-align:center;font-size:13px;color:#777;margin:0 auto 10px;line-height:1.5}
.intro{text-align:center;font-size:15px;font-weight:600;margin:0 0 25px}
form{display:flex;flex-direction:column;gap:9px}
label{font-size:14px;font-weight:650;margin-top:7px;color:#252c34}
label span{color:#e53935}
input,textarea,select{width:100%;border:1px solid #d8dde3;border-radius:9px;padding:13px 14px;font:inherit;background:#fff;outline:none;transition:.2s}
input:focus,textarea:focus,select:focus{border-color:#6f7782;box-shadow:0 0 0 3px rgba(100,110,125,.10)}
textarea{min-height:95px;resize:vertical}
.upload-box{border:1.5px dashed #b9c0c9;border-radius:10px;min-height:145px;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;overflow:hidden;cursor:pointer;background:#fafbfc}
.upload-box:hover{background:#f5f7f9}
.upload-box input{position:absolute;inset:0;opacity:0;cursor:pointer}
.upload-icon{font-size:27px;color:#697381;margin-bottom:5px}
.upload-text{font-size:14px;font-weight:600;color:#4c5561}
.upload-help{font-size:12px;color:#8a929c;margin-top:4px}
#preview{display:none;max-width:100%;max-height:180px;margin-top:10px;border-radius:8px}
.choice-row{display:flex;gap:24px;padding:5px 0 8px}
.choice{display:flex;align-items:center;gap:7px;font-weight:500;cursor:pointer}
.choice input{width:auto;accent-color:#111}
.choice span{color:inherit}
.submit-btn{border:0;border-radius:10px;padding:14px 18px;background:#111827;color:white;font-weight:750;font-size:15px;cursor:pointer;margin-top:8px;transition:.2s}
.submit-btn:hover{transform:translateY(-1px);background:#000}
.message{text-align:center;min-height:20px;font-size:14px;margin-top:5px}
.message.success{color:#18864b}.message.error{color:#d63031}
.dev-trigger{position:fixed;left:0;top:0;width:38px;height:38px;border:0;background:transparent;color:#555;font-size:24px;z-index:20;cursor:pointer}
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.48);padding:20px;align-items:center;justify-content:center;z-index:30}
.modal.open{display:flex}
.modal-card{position:relative;background:#fff;width:min(560px,100%);max-height:92vh;overflow:auto;border-radius:16px;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.22)}
.modal-card h2{margin:0 0 18px;font-size:24px}
.close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:28px;cursor:pointer;color:#555}
@media(max-width:520px){.card{padding:20px 17px}.page{padding:20px 10px}h1{font-size:23px}.hero-image{height:125px}}
