/* 🏭 ประเมินก่อนเสนอราคา — ใช้โทเคนสีของ site.css (สว่าง/มืดตามเว็บ) · แตะได้ ≥ 44px · ตัวอักษรมือถือ ≥ 16px */
.asw{max-width:760px;margin:0 auto;padding-block:20px 120px;display:grid;gap:16px}
.asw .as-load{color:var(--soft)}
.asw .kick{color:var(--accent);font-weight:600;font-size:.92rem}
.as-hero{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:14px;padding:24px;display:grid;gap:12px;box-shadow:var(--shadow)}
.as-hero h1{font-size:clamp(1.45rem,4vw,2rem);line-height:1.3;margin:0;color:var(--title);text-wrap:balance}
.as-hero p{margin:0;color:var(--soft)}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ticks li::before{content:"✓";color:var(--ok);font-weight:700;margin-right:8px}
.fine{font-size:.86rem;color:var(--faint)}
.as-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.as-top .cnt{font-size:.88rem;color:var(--soft);border:1px solid var(--line);border-radius:8px;padding:2px 10px}
.bar{height:6px;background:var(--band);border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--orange);border-radius:99px;transition:width .2s}
.as-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px;display:grid;gap:12px}
.as-card h2{margin:0;font-size:1.3rem;color:var(--title)}
.as-card h3{margin:8px 0 0;font-size:1.05rem;color:var(--title)}
.as-card .sub,.as-card .hint{margin:0;color:var(--soft)}
.as-card .hint{font-size:.9rem}
.as-card.msg{border-left:3px solid var(--orange)}
.q{border:0;margin:0;padding:0;display:grid;gap:8px}
.q legend{font-weight:600;margin-bottom:6px;color:var(--title)}
.opts{display:grid;gap:8px}
.opt{display:flex;align-items:center;gap:12px;min-height:52px;width:100%;text-align:left;font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;cursor:pointer}
.opt .mk{flex:0 0 22px;height:22px;border-radius:50%;border:2px solid var(--soft)}
.opt[data-m="1"] .mk{border-radius:6px}
.opt.on{border-color:var(--orange);background:var(--accent-soft)}
.opt.on .mk{border-color:var(--orange);background:var(--orange);box-shadow:inset 0 0 0 3px var(--paper)}
.opt:focus-visible,.btn:focus-visible,.lnk:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.opt.sm{min-height:44px;font-size:14px;padding:6px 10px;width:auto}
.num{display:grid;gap:4px;font-weight:500}
.num input,.num textarea{font:inherit;font-size:16px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);color:var(--ink);width:100%}
.flag{display:flex;gap:10px;align-items:flex-start;min-height:44px}
.flag input,.form .c input{width:22px;height:22px;flex:0 0 22px;margin-top:2px}
.as-nav{position:sticky;bottom:0;display:flex;justify-content:space-between;gap:10px;padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(to top,var(--bg) 70%,transparent)}
.as-nav.in{position:static;background:none;padding:4px 0 0}
.as-nav .btn{min-height:48px}
.route{border-left:4px solid var(--orange);background:var(--band);border-radius:10px;padding:14px 16px;display:grid;gap:6px}
.route.wait{border-left-color:var(--soft)}
.route b{font-size:1.05rem;color:var(--title)}
.route p{margin:0;color:var(--soft)}
.route .note{font-size:.93rem}
.pill{justify-self:start;font-size:.82rem;background:var(--hold-bg);color:var(--hold);border-radius:99px;padding:2px 10px;font-weight:600}
.prep{margin:0;padding-left:1.4em;display:grid;gap:8px}
.prep small{display:block;color:var(--soft)}
.drop{border:2px dashed var(--line);border-radius:12px;padding:18px;text-align:center;color:var(--soft)}
.drop.over,.slot.over{border-color:var(--orange);background:var(--accent-soft)}
.slots{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.slot{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:6px}
.slot .sh{display:flex;justify-content:space-between;gap:8px;align-items:center}
.slot .st{font-size:.82rem;border-radius:99px;padding:1px 9px;background:var(--hold-bg);color:var(--hold);white-space:nowrap}
.slot.ok .st{background:var(--ok-bg);color:var(--ok)}
.slot small{color:var(--soft)}
.fl{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.fl li{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.92rem}
.fl .fn{flex:1 1 160px;min-width:0;overflow-wrap:anywhere}
.fl .fz{color:var(--faint);font-size:.85rem}
.mv{display:flex;flex-wrap:wrap;gap:6px;flex-basis:100%}
.up{display:flex;flex-wrap:wrap;gap:8px}
.btn.sm{min-height:44px;padding:8px 14px;font-size:15px}
.lnk{font:inherit;font-size:.92rem;background:none;border:0;color:var(--accent);text-decoration:underline;cursor:pointer;min-height:44px;padding:0 4px}
.lnk.del{color:var(--no)}
.err{color:var(--no);margin:0;min-height:1.2em}
.err.top{background:var(--no-bg);padding:10px 14px;border-radius:10px}
.big{margin:0;color:var(--soft)} .big b{font-size:2rem;color:var(--accent)}
.warn{background:var(--hold-bg);color:var(--hold);border-radius:10px;padding:10px 14px;margin:0}
.okm{background:var(--ok-bg);color:var(--ok);border-radius:10px;padding:10px 14px;margin:0}
.cpy{display:flex;gap:8px;flex-wrap:wrap}
.cpy input{flex:1 1 240px;min-width:0;font:inherit;font-size:15px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);color:var(--ink)}
.as-hero.done{border-top-color:var(--ok)}
@media (max-width:560px){.form .row{grid-template-columns:1fr}.as-card,.as-hero{padding:16px}}
@media (prefers-reduced-motion:reduce){.bar i{transition:none}}
/* ปุ่มแชตลอยทับปุ่ม "ถัดไป" บนมือถือ → ซ่อนในหน้าประเมิน (ปุ่ม LINE มีในหน้าสุดท้ายแล้ว) */
body:has(.asw) .float{display:none}
.as-nav.in{flex-wrap:wrap}
.as-nav.in .btn{flex:1 1 auto;white-space:nowrap;justify-content:center}
.asw>*{min-width:0}
.as-hero p,.as-card p{overflow-wrap:anywhere}
.route .src{font-size:.86rem;color:var(--soft);overflow-wrap:anywhere}
.route .src a{color:var(--accent)}