:root{
  --gold:#b88737;--gold2:#d5a552;--cream:#fff4df;--cream2:#f8e8ca;
  --paper:#fffdfa;--ink:#24170f;--muted:#7d7267;--line:#ead6b7;
  --red:#e55a50;--orange:#d99825;--green:#4fa86c;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;color:var(--ink)}
body{background:radial-gradient(circle at 50% -20%,#fffdf8 0,#f8f0e5 56%,#efe5d7 100%)}
.page{width:100%;max-width:440px;margin:0 auto;padding:10px 8px 18px}
.shell{overflow:hidden;border:1px solid rgba(198,167,119,.32);border-radius:32px;background:var(--paper);box-shadow:0 18px 52px rgba(81,56,27,.11)}
.brand-hero{position:relative;overflow:hidden;background:linear-gradient(145deg,#fff9ed 0%,#fff2d8 55%,#f8e5c2 100%);padding:26px 18px 34px;min-height:355px}
.soft-shape{position:absolute;border-radius:50%;background:rgba(255,255,255,.4);pointer-events:none}.shape-a{width:250px;height:250px;left:-110px;top:-100px}.shape-b{width:220px;height:220px;right:-120px;bottom:-90px;background:rgba(255,255,255,.28)}
.hero-inner{position:relative;z-index:2;text-align:center;max-width:360px;margin:0 auto}
.logo-chip{width:84px;height:84px;margin:0 auto 9px;border-radius:22px;background:rgba(255,255,255,.91);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 26px rgba(98,68,34,.07)}
.logo-chip img{width:68px;height:55px;object-fit:contain;mix-blend-mode:multiply}
.brand-name{font-size:34px;line-height:1;font-weight:950;letter-spacing:1px}.store-name{margin-top:6px;font-size:18px;font-weight:900;color:#9a6928;letter-spacing:.5px}
.eyebrow-row{display:flex;align-items:center;justify-content:center;gap:12px;margin:20px auto 12px;color:#9b6d2f}.eyebrow-row span{width:42px;height:1px;background:#c9a66e}.eyebrow-row b{font-size:13px;letter-spacing:5px;white-space:nowrap}
.hero-inner h1{margin:0;font-size:33px;line-height:1.38;font-weight:950;letter-spacing:.3px}.hero-inner p{margin:13px auto 0;font-size:14px;line-height:1.75;color:#766b60}
.feedback-form{position:relative;z-index:5;margin:-18px 12px 0;padding:18px 17px 16px;border:1px solid #ecddc6;border-radius:28px;background:rgba(255,254,251,.985);box-shadow:0 12px 32px rgba(78,54,27,.065)}
.form-section{margin-top:19px}.form-section:first-child{margin-top:0}.section-title{display:flex;align-items:baseline;gap:7px;font-size:17px;font-weight:950;margin:0 0 10px}.section-title em{font-style:normal;color:#d84942}.section-title small{font-size:11px;font-weight:500;color:#9b9186}
.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.type-card{position:relative;min-height:114px;border:1px solid #e6d4b8;border-radius:18px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 4px 14px rgba(70,49,25,.035);transition:.18s ease}.type-card input{position:absolute;opacity:0}.type-icon{font-size:31px;line-height:1}.type-card strong{font-size:20px;line-height:1.1}.type-card small{font-size:11px;color:#9f968c}.complaint:has(input:checked){border-color:#e05d57;background:#fff4f3;box-shadow:0 0 0 3px rgba(224,93,87,.08)}.complaint:has(input:checked) strong,.complaint:has(input:checked) small{color:#d14d47}.suggestion:has(input:checked){border-color:#e2ad45;background:#fffaf0}.praise:has(input:checked){border-color:#66b57e;background:#f6fff7}
.textarea-wrap{position:relative}textarea,input[type=text]{width:100%;border:1px solid #e2cfad;border-radius:17px;background:#fff;outline:none;color:var(--ink);font:inherit}textarea{min-height:164px;padding:16px 16px 32px;font-size:14px;line-height:1.72;resize:vertical}textarea:focus,input[type=text]:focus{border-color:#c89a50;box-shadow:0 0 0 3px rgba(184,135,55,.08)}.counter{position:absolute;right:12px;bottom:9px;font-size:10px;color:#aaa198;background:#fff;padding-left:6px}
.upload-title{gap:10px}.preview-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.file-input{display:none}.upload-box,.preview-item,.upload-placeholder{aspect-ratio:1/1;border-radius:13px;overflow:hidden}.upload-box{border:1.5px dashed #cca96d;background:#fffaf2;color:#9d742d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.upload-box .plus{font-size:29px;line-height:1}.upload-box strong{font-size:11.5px}.upload-box small{font-size:8px;color:#b69a70}.upload-placeholder{border:1px dashed #e0d8cc;background:#fff;display:flex;align-items:center;justify-content:center;color:#d4d0cb;font-size:25px}.preview-item{position:relative;background:#f4efe8;border:1px solid #eadfce}.preview-item img{width:100%;height:100%;object-fit:cover}.preview-remove{position:absolute!important;top:3px!important;right:3px!important;width:22px!important;height:22px!important;border-radius:50%!important;border:0!important;padding:0!important;margin:0!important;background:rgba(39,33,28,.78)!important;color:#fff!important;font-size:14px!important;line-height:22px!important;box-shadow:none!important}.file-names{min-height:7px;margin-top:5px;font-size:10px;color:#a09282}
.contact-wrap{position:relative}.contact-wrap input{height:48px;padding:0 13px 0 42px;font-size:13.5px}.contact-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#ae8748}.anonymous{display:flex;align-items:center;gap:7px;margin:12px 2px 0;font-size:12px;font-weight:800}.anonymous input{width:16px;height:16px;accent-color:var(--gold)}.anonymous small{font-size:10px;font-weight:500;color:#aaa096}
button{width:100%;margin-top:18px;border:0;border-radius:17px;padding:15px 17px;background:linear-gradient(135deg,#ca9842,#ab752c);color:#fff;font-size:17px;font-weight:950;box-shadow:0 10px 22px rgba(157,112,48,.2)}.send-icon{display:inline-block;transform:rotate(-18deg);margin-right:7px}.btn-paw{float:right;font-size:15px;opacity:.84}.footer-note{text-align:center;color:#8f744c;font-size:11px;font-weight:800;padding:11px 10px 17px}.footer-note span{font-size:10px}
.modal{position:fixed;inset:0;background:rgba(34,29,24,.45);display:flex;align-items:center;justify-content:center;padding:18px;z-index:20}.modal[hidden]{display:none}.modal-card{width:min(92vw,400px);background:#fffdf9;border-radius:23px;padding:27px 21px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.22)}.result-icon{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 13px;background:#edf8ef;color:#32975a;font-size:31px;font-weight:900}.modal-card h2{margin:0 0 7px}.modal-card p{color:#6f675f;line-height:1.65}.ticket{background:#f7f0e6;border-radius:14px;padding:13px;margin:15px 0;display:flex;flex-direction:column;gap:4px}.ticket span{font-size:11px;color:#958977}.ticket strong{font-family:Consolas,monospace}.secondary{background:#29251f;box-shadow:none;margin-top:7px}
@media(max-width:390px){
  .page{padding:6px 5px 14px}.shell{border-radius:27px}.brand-hero{min-height:327px;padding:22px 16px 31px}.logo-chip{width:76px;height:76px;border-radius:20px}.logo-chip img{width:62px}.brand-name{font-size:31px}.store-name{font-size:17px}.eyebrow-row{margin-top:17px;gap:10px}.eyebrow-row span{width:34px}.eyebrow-row b{font-size:12px;letter-spacing:4px}.hero-inner h1{font-size:30px}.hero-inner p{font-size:12.5px}.feedback-form{margin:-16px 9px 0;padding:16px 14px 14px;border-radius:25px}.section-title{font-size:16px}.type-grid{gap:8px}.type-card{min-height:101px;border-radius:16px}.type-icon{font-size:27px}.type-card strong{font-size:18px}.type-card small{font-size:10px}textarea{min-height:148px;font-size:13px}.preview-grid{gap:6px}.contact-wrap input{height:45px}button{padding:14px 15px;font-size:16px}
}