@charset "utf-8";
/* Гадание на кофейной гуще и на воске (assets/gushcha.js): выбор фигур и строки с их положением */
.gu-app{margin-top:14px}
.slab form.gu-form{margin-top:0}
.gu-pick,.gu-chosen{flex:0 0 100%;width:100%;min-width:0}
.slab .gu-hint{flex:0 0 100%;margin:0}
#gu-q{width:100%;box-sizing:border-box;font:400 16px/1.2 var(--body);padding:11px 13px;border-radius:8px;
  border:1px solid #FFFFFF;background:#FFFFFF;color:#17161D;color-scheme:light}
#gu-q::placeholder{color:#8A8694;opacity:1}
#gu-q:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(216,184,106,.45)}
.gu-cats{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.gu-cats .mini{padding:8px 12px}
.gu-cats .mini.on{border-color:var(--gold);color:var(--gold);background:rgba(216,184,106,.1)}
.gu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:6px;max-height:312px;overflow:auto;
  padding:2px 4px 2px 0;overscroll-behavior:contain}
.gu-t{display:flex;flex-direction:column;gap:3px;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;
  border:1px solid rgba(216,184,106,.28);background:rgba(255,255,255,.04);color:var(--slab-ink);font:inherit}
.gu-t:hover{border-color:var(--gold)}
.gu-t.on{border-color:var(--gold);background:rgba(216,184,106,.14)}
.gu-t b{font:500 14px/1.25 var(--body)}
.gu-t span{font-size:11.5px;line-height:1.3;color:var(--slab-muted)}
.gu-grid .fhint{grid-column:1/-1}
.gu-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.gu-row b{font-family:var(--display);font-weight:600;font-size:16px;min-width:110px;flex:1 1 110px}
.gu-ctl{display:flex;flex-wrap:wrap;gap:6px}
.gu-ctl select{font:400 14px/1.2 var(--body);padding:7px 9px;border-radius:7px;border:1px solid #FFFFFF;
  background:#FFFFFF;color:#17161D;color-scheme:light;max-width:100%}
.gu-ctl select option{color:#14171A}
.gu-star,.gu-x{width:34px;height:34px;flex:none;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:transparent;
  color:var(--slab-muted);font-size:17px;line-height:1;cursor:pointer}
.gu-star[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}
.gu-star:hover,.gu-x:hover{border-color:var(--gold);color:var(--gold)}
.gu-chosen>.fhint{margin:0}
@media (max-width:600px){
  .gu-grid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));max-height:280px}
  .gu-row b{flex-basis:calc(100% - 92px)}
  .gu-ctl{order:3;flex:0 0 100%}
  .gu-ctl select{flex:1 1 120px}
}
