:root{
  --bg:#F3E9D8; --card:#FFFDF7;
  --primary:#C75B39; --primary-dark:#A94A2C; --accent:#D99A3C;
  --text:#473529; --muted:#A38E7B; --line:#E7D9C6;
  --order:#4E8A5B; --order-dark:#3C6E47;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:'Sarabun',sans-serif;color:var(--text);
  background:radial-gradient(circle at 80% -6%, #FAE7CC 0, transparent 42%), var(--bg);
  -webkit-font-smoothing:antialiased;min-height:100vh;padding:26px 16px 56px;
}
.wrap{max-width:460px;margin:0 auto;}
.hidden{display:none !important;}

.head{text-align:center;padding:6px 0 4px;}
.head h1{font-family:'Mitr';font-weight:700;font-size:30px;line-height:1.2;}
.head p{color:var(--muted);font-size:15px;margin-top:6px;}

.filters{display:flex;flex-direction:column;gap:12px;margin:18px 0 4px;}
.flabel{font-family:'Mitr';font-weight:500;font-size:14px;margin-bottom:7px;display:flex;align-items:center;gap:6px;}
.row{display:flex;flex-wrap:wrap;gap:8px;}
.chip{flex:0 0 auto;font-family:'Mitr';font-weight:500;font-size:14px;padding:11px 15px;border-radius:13px;
  border:1.5px solid var(--line);background:#FBF6EC;color:var(--text);cursor:pointer;transition:.15s;
  white-space:nowrap;min-height:44px;display:flex;align-items:center;gap:6px;}
.chip:active{transform:scale(.96);}
.chip.on{background:var(--primary);border-color:var(--primary);color:#fff;}
.chip[data-dim="budget"].on{background:var(--accent);border-color:var(--accent);color:#4a3000;}

.cta{width:100%;font-family:'Mitr';font-weight:600;font-size:21px;color:#fff;border:none;cursor:pointer;
  background:linear-gradient(135deg,#D2643F,#BE4A2B);padding:16px;border-radius:18px;
  box-shadow:0 10px 24px rgba(199,91,57,.34);margin:16px 0 18px;transition:.15s;}
.cta:active{transform:translateY(2px);}

.result{background:var(--card);border-radius:20px;padding:22px 20px;text-align:center;
  box-shadow:0 12px 30px rgba(120,70,40,.13);border:1px solid #EFE3D1;}
.result .emoji{font-size:52px;line-height:1;}
.result .name{font-family:'Mitr';font-weight:700;font-size:27px;margin-top:8px;}
.result .meta{color:var(--muted);font-size:14px;margin-top:5px;}
.orders{display:flex;gap:9px;margin-top:18px;}
.obtn{flex:1;font-family:'Mitr';font-weight:600;font-size:18px;padding:15px 8px;border-radius:14px;
  border:none;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:8px;}
.obtn.order{background:var(--order);color:#fff;box-shadow:0 8px 18px rgba(78,138,91,.30);}
.obtn.order:active{transform:translateY(1px);}
.reroll{display:block;width:100%;text-align:center;background:none;border:none;cursor:pointer;
  font-family:'Mitr';font-weight:500;font-size:15px;color:var(--primary-dark);padding:12px;margin:6px 0 24px;}
.empty{text-align:center;color:var(--muted);font-size:15px;padding:18px 0 26px;}

.disclosure{margin-top:6px;border:1.5px solid var(--line);border-radius:15px;background:var(--card);overflow:hidden;
  box-shadow:0 5px 13px rgba(120,70,40,.06);}
.disclosure summary{list-style:none;cursor:pointer;font-family:'Mitr';font-weight:500;font-size:15px;
  padding:16px 18px;display:flex;align-items:center;justify-content:space-between;color:var(--text);}
.disclosure summary::-webkit-details-marker{display:none;}
.disclosure .chev{transition:.2s;color:var(--muted);}
.disclosure[open] .chev{transform:rotate(180deg);}
.disclosure[open] summary{border-bottom:1px solid var(--line);}
.disclosure .grid{padding:14px;}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.gcard{background:var(--card);border-radius:15px;padding:15px 13px;border:1px solid #EFE3D1;
  box-shadow:0 5px 13px rgba(120,70,40,.07);}
.gcard .ge{font-size:28px;}
.gcard .gn{font-family:'Mitr';font-weight:500;font-size:15px;margin-top:6px;}
.gcard .gm{color:var(--muted);font-size:12.5px;margin-top:2px;}

.adslot{margin-top:26px;border:1.5px dashed #D8C6AE;border-radius:12px;padding:20px;text-align:center;
  color:#B6A488;font-size:12.5px;}
footer{text-align:center;color:var(--muted);font-size:12.5px;margin-top:22px;}