:root{--brass:#B8892D;--deep:#8F6A1F;--soft:#F4E9CF;--ink:#15181D;--ink2:#4B515A;--ink3:#8B9199;--line:#E2E4DE;--bg:#F4F5F1;--star:#F4B400}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);font-family:-apple-system,Inter,system-ui,sans-serif;color:var(--ink);display:flex;flex-direction:column;align-items:center;padding:18px 14px 40px}
.card{width:min(520px,100%);background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 22px;box-shadow:0 10px 30px rgba(21,24,29,.06)}
.mark{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:22px;margin:0 auto 12px;background:linear-gradient(135deg,#DCBA60,var(--brass) 48%,var(--deep))}
h1{font-size:22px;margin:0 0 4px;text-align:center;letter-spacing:-.01em}.sub{text-align:center;color:var(--ink2);font-size:15px;margin:0 0 18px}
.stars{display:flex;justify-content:center;gap:8px;margin:6px 0 4px}.stars button{background:none;border:0;font-size:44px;line-height:1;color:#DADCE0;cursor:pointer;padding:2px;transition:transform .1s}.stars button.on{color:var(--star)}.stars button:active{transform:scale(.9)}
.hint{text-align:center;color:var(--ink3);font-size:13px;min-height:18px;margin:0 0 6px}
.sugs{display:grid;gap:10px;margin-top:14px}.sug{border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;font-size:15px;line-height:1.45;cursor:pointer;background:#fff}.sug.on{border-color:var(--brass);background:var(--soft)}
textarea{width:100%;min-height:120px;border:1.5px solid var(--line);border-radius:14px;padding:12px;font:inherit;font-size:15px;line-height:1.45;resize:vertical;margin-top:12px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:0;border-radius:12px;padding:15px;font-weight:700;font-size:16px;color:#fff;background:var(--ink);cursor:pointer;margin-top:12px;text-decoration:none}
.btn.brass{background:linear-gradient(135deg,#C79A3B,var(--deep))}.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.fine{font-size:12px;color:var(--ink3);text-align:center;margin-top:12px}.foot{color:var(--ink3);font-size:11px;margin-top:16px}
.spin{display:inline-block;width:16px;height:16px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;animation:r .7s linear infinite}@keyframes r{to{transform:rotate(360deg)}}