/* Potion discovery bench. Scoped to .hth-craft; FG3 owns page geometry. */
.hth-craft{--felt:#1f4331;--brass:#b08a45;--brass-hi:#e2c47e;--cream:#ffedc4;--paper:#f4e8c9;container-type:inline-size;min-width:0;color:var(--ink,#382817);font:13px/1.25 var(--f-body,Georgia,serif)}
.hth-craft *,.hth-craft *::before,.hth-craft *::after{box-sizing:border-box}
.hth-craft button{font:inherit;cursor:pointer;touch-action:manipulation}
.hth-craft button:disabled,.hth-craft button[aria-disabled=true]{cursor:default;opacity:.5}
.hth-craft button:focus-visible{outline:2px solid #a67631;outline-offset:2px}
.hth-craft img{display:block;object-fit:contain;image-rendering:pixelated;pointer-events:none}
.hth-craft__head{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--paper-line,#b99661);padding:0 0 6px;margin-bottom:7px}
.hth-craft__head h3{margin:0;font:700 20px/1 var(--f-head,Georgia,serif)}
.hth-craft__status{margin-left:auto;color:var(--ink-soft,#725534);font:12px var(--f-pixel,monospace);text-align:right}
.hth-craft__refresh{border:0;background:none;color:var(--ink-soft,#725534);font-size:22px!important;padding:2px 4px}
.hth-craft__label{display:flex;align-items:baseline;justify-content:space-between;margin:10px 0 5px;font:13px/1 var(--f-pixel,monospace);font-weight:400;color:var(--ink-soft,#725534)}
.hth-craft__label span{font-size:12px}

/* Felt tray with brass rim */
.hth-craft__bench{display:grid;grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 14px minmax(0,1fr);align-items:center;gap:4px;margin:4px 0 6px;padding:10px 8px;border:2px solid var(--brass);border-radius:6px;color:var(--cream);background:radial-gradient(circle at 30% 15%,#ffffff12,transparent 60%),repeating-linear-gradient(45deg,#ffffff05 0 2px,transparent 2px 4px),linear-gradient(160deg,#24503a,#143023);box-shadow:inset 0 0 0 1px #0006,inset 0 3px 8px #0008,0 1px 0 var(--brass-hi),0 2px 3px #0003}
.hth-craft__bench.is-drop{outline:2px solid var(--brass-hi);outline-offset:2px}
.hth-craft__slot{display:grid;justify-items:center;align-content:center;gap:3px;min-width:0;min-height:72px;padding:4px;border:1px solid #d5b37399;border-radius:6px;background:#0f261b99;color:inherit;text-align:center;overflow-wrap:anywhere;box-shadow:inset 0 2px 4px #0007}
.hth-craft__slot img{width:36px;height:36px}
.hth-craft__slot small{font-size:12px;line-height:1.1}
.hth-craft__slot.is-empty{border-style:dashed;background:#0f261b55}
.hth-craft__slot.is-armed{border-style:solid;border-color:var(--brass-hi);box-shadow:inset 0 0 0 1px #e2c47e66,inset 0 2px 4px #0007}
.hth-craft__socket{width:30px;height:30px;border:2px solid #d5b37333;border-radius:50%;background:radial-gradient(#00000040,transparent 70%)}
.hth-craft__slot.is-filled{border-color:var(--brass)}
.hth-craft__slot.is-new img{animation:hth-craft-drop .26s ease-out}
.hth-craft__plus,.hth-craft__arrow{text-align:center;color:var(--brass-hi);font:14px var(--f-pixel,monospace)}
.hth-craft__out{display:grid;place-items:center;min-height:72px;border-radius:50%;background:radial-gradient(closest-side,#e2c47e22,transparent)}
.hth-craft__out img{width:40px;height:40px}
.hth-craft__flask{display:grid;place-items:center;width:30px;height:36px;border:2px solid #d5b37355;border-radius:8px 8px 14px 14px;color:#d5b37399;font:14px var(--f-pixel,monospace)}
.hth-craft__mark{display:grid;place-items:center;min-width:24px;font-size:22px}
.hth-craft__mark.is-stir{animation:hth-craft-pulse 1.2s ease-in-out infinite}
.hth-craft__bottle.is-pop img{animation:hth-craft-bottle .9s ease-out;animation-delay:var(--pop-delay,0ms)}
.hth-craft__bench.is-pending .hth-craft__slot{border-style:solid;border-color:#e0ba6499}

.hth-craft__hint{margin:0 0 4px;color:var(--ink-soft,#725534);font:12px/1.25 var(--f-pixel,monospace);overflow-wrap:anywhere}
.hth-craft__hint b{color:var(--ink,#382817);font-weight:400}
.hth-craft__actions{display:flex;align-items:center;gap:8px}
.hth-craft__actions button{border:0;background:none;padding:7px 3px;color:var(--ink-soft,#725534);font:13px var(--f-pixel,monospace)}
.hth-craft__actions .hth-craft__brew{margin-left:auto;min-width:88px;border:1px solid #84602c;border-bottom-width:3px;border-radius:3px;padding:7px 12px;background:linear-gradient(#866336,#563a1d);box-shadow:inset 0 1px #e4c38077;color:var(--cream);font-size:17px}
.hth-craft__brew:hover:not(:disabled){filter:brightness(1.1)}
.hth-craft__note{margin:5px 0;font:12px/1.25 var(--f-pixel,monospace);color:var(--ink-soft,#725534)}
.hth-craft__note.is-error{color:#823722}.hth-craft__note.is-warn{color:#85551a}
.hth-craft__result{display:grid;gap:2px;margin:6px 0;padding:5px 8px;border:1px solid #78916a;border-radius:3px;background:#3c663515}
.hth-craft__result b{font-size:14px}
.hth-craft__result small{color:var(--ink-soft,#725534);font-size:13px}
.hth-craft__result .hth-craft__found{color:#2f5a3c;font:12px var(--f-pixel,monospace)}
.hth-craft__result.is-new{border-color:var(--brass);animation:hth-craft-glow 1.2s ease-out}

/* Ingredients on the page */
.hth-craft__stock{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:3px 7px}
.hth-craft__item{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:5px;min-width:0;min-height:40px;padding:4px 3px;border:0;border-bottom:1px solid var(--paper-line,#b99661);border-left:3px solid transparent;background:none;color:var(--ink,#382817);text-align:left}
.hth-craft__item img{width:28px;height:28px}
.hth-craft__item span{font-size:14px;line-height:1.15;overflow-wrap:anywhere}
.hth-craft__item b{font:14px var(--f-pixel,monospace)}
.hth-craft__item.is-ready:hover{background:#a8863f20}
.hth-craft__item.is-staged{border-left-color:var(--brass)}
.hth-craft__item.is-out{opacity:.45}

/* Recipe book: learned formulas, then count-only silhouettes */
.hth-craft__book{display:grid;gap:4px;padding:6px;border:1px solid var(--paper-line,#b99661);border-radius:2px;background:var(--paper);box-shadow:inset 0 0 0 3px #fff7,1px 2px 0 #0000001a}
.hth-craft__recipe{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;min-width:0;padding:4px;border:0;border-bottom:1px dotted var(--paper-line,#b99661);background:none;color:var(--ink,#382817);text-align:left}
.hth-craft__recipe:hover:not(:disabled){background:#b9883518}
.hth-craft__recipe.is-short .hth-craft__formula{opacity:.55}
.hth-craft__formula{display:flex;align-items:center;gap:2px}
.hth-craft__formula img,.hth-craft__formula .hth-craft__mark{width:22px;height:22px;min-width:22px;font-size:14px}
.hth-craft__formula i{font:normal 11px var(--f-pixel,monospace);color:var(--ink-soft,#725534)}
.hth-craft__name b{display:block;font-size:14px;font-weight:600;line-height:1.15;overflow-wrap:anywhere}
.hth-craft__name small{display:block;font-size:12px;line-height:1.15;color:var(--ink-soft,#725534)}
.hth-craft__unknown{display:flex;flex-wrap:wrap;gap:6px;padding:4px}
.hth-craft__silhouette{width:16px;height:22px;border-radius:5px 5px 8px 8px;background:#3828172b;box-shadow:inset 0 3px 0 -1px #38281722}
.hth-craft__state{margin:7px 0;color:var(--ink-soft,#725534);font:13px/1.2 var(--f-pixel,monospace)}
.hth-craft__reread{border:0;background:none;padding:3px;color:inherit;text-decoration:underline}
.hth-craft-ghost{position:fixed;left:0;top:0;width:36px;height:36px;object-fit:contain;image-rendering:pixelated;pointer-events:none;z-index:10000;filter:drop-shadow(0 3px 2px #0005)}
.hth-craft-motion{display:block;pointer-events:none;filter:drop-shadow(0 4px 3px #0008)}
.hth-craft-motion.is-spent::after{content:'';position:absolute;left:8%;top:88%;width:125%;height:4px;background:#e8c06b;box-shadow:0 0 0 1px #3a251a;transform:rotate(-52deg);transform-origin:left center;animation:hth-craft-slash .18s ease-out both}
.hth-craft-motion.is-failed::after{background:#f49b77}
.hth-craft__failed{color:#f2ba91!important}
@keyframes hth-craft-slash{from{transform:rotate(-52deg) scaleX(0)}to{transform:rotate(-52deg) scaleX(1)}}

/* Card bench (infusion_v2). Fills the host's bounded height; only the drawer scrolls. */
.hth-craft.is-cards{display:flex;flex-direction:column;gap:4px;height:100%;max-height:100%;min-height:0;overflow:hidden}
.hth-craft.is-cards>*{flex:0 0 auto;margin-top:0;margin-bottom:0}
.hth-craft.is-cards>.hth-craft__drawer{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 3px 4px}
.hth-craft__drawer>.hth-craft__label:first-child{margin-top:2px}
.hth-craft__felt{display:grid;grid-template-columns:repeat(var(--slots,3),minmax(0,1fr));justify-items:center;gap:8px;padding:10px 10px 8px;border:2px solid var(--brass);border-radius:6px;background:repeating-linear-gradient(45deg,#ffffff06 0 2px,transparent 2px 4px) var(--felt);box-shadow:inset 0 0 0 1px #0006,inset 0 3px 8px #0008}
.hth-craft__felt.is-drop{outline:2px solid var(--brass-hi);outline-offset:2px}
.hth-craft.is-cards .hth-craft__slot{position:relative;display:block;width:min(100%,84px);min-height:0;aspect-ratio:.78;padding:0;border:1px dashed #d5b37399;border-radius:5px;background:#0f261b66;box-shadow:inset 0 2px 4px #0007;color:var(--cream);overflow:visible}
.hth-craft.is-cards .hth-craft__slot.is-empty{display:grid;place-items:center}
.hth-craft.is-cards .hth-craft__slot.is-armed{border-style:solid;border-color:var(--brass-hi);background:#0f261b99}
.hth-craft.is-cards .hth-craft__slot.is-filled{border:0;background:none;box-shadow:none}
.hth-craft__order{position:absolute;top:-5px;left:-5px;z-index:4;min-width:18px;height:18px;padding:0 4px;border:1px solid var(--brass);border-radius:9px;background:#2a1d10;color:var(--cream);font:11px/16px var(--f-pixel,monospace);text-align:center;pointer-events:none}
.hth-craft__slot.is-empty .hth-craft__order{position:static;min-width:0;height:auto;padding:0;border:0;background:none;color:#d5b37399;font-size:24px;line-height:1}
.hth-craft.is-cards .hth-craft__slot.is-armed .hth-craft__order{color:var(--brass-hi)}

/* Portrait card: art, name, purpose. Frames reuse FG3 pixel frame variables; a flat edge shows if they are absent. */
:is(#view-field-guide, .clinic-prep) .hth-brew-card{--brew-frame:var(--frame-bronze,none);--brew-slice:10;--brew-rim:10px;--brew-edge:#9a6b3a;position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto auto;align-items:center;justify-items:center;gap:2px;width:100%;aspect-ratio:.78;padding:calc(var(--brew-rim) - 1px) calc(var(--brew-rim) - 3px);border-radius:4px;overflow:hidden;isolation:isolate;background:#1d3a2b;color:#f4e6c6;text-align:center;font:600 10px/1.1 var(--f-body,Georgia,serif);box-shadow:0 2px 3px #241b1638}
:is(#view-field-guide, .clinic-prep) .hth-brew-card--base{background:#3a2f22}
:is(#view-field-guide, .clinic-prep) .hth-brew-card--potion{background:#26323f}
:is(#view-field-guide, .clinic-prep) .hth-brew-card.t-locked{--brew-frame:var(--frame-locked,none);--brew-slice:9;--brew-edge:#5d5a52}
:is(#view-field-guide, .clinic-prep) .hth-brew-card.t-silver{--brew-frame:var(--frame-silver,none);--brew-slice:11;--brew-edge:#a9b1b6}
:is(#view-field-guide, .clinic-prep) .hth-brew-card.t-gold{--brew-frame:var(--frame-gold,none);--brew-slice:12;--brew-rim:11px;--brew-edge:#d3a63a}
:is(#view-field-guide, .clinic-prep) .hth-brew-card.t-diamond{--brew-frame:var(--frame-diamond,none);--brew-slice:13;--brew-rim:11px;--brew-edge:#86cfdc}
:is(#view-field-guide, .clinic-prep) .hth-brew-card.t-sentinel{--brew-frame:var(--frame-sentinel,none);--brew-slice:13;--brew-rim:12px;--brew-edge:#c0643f}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__frame{position:absolute;inset:0;z-index:3;pointer-events:none;border:2px solid var(--brew-edge);border-radius:4px;border-image-source:var(--brew-frame);border-image-slice:var(--brew-slice);border-image-width:var(--brew-rim);border-image-repeat:stretch;image-rendering:pixelated}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__art{position:relative;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;width:100%;height:100%;min-height:0}
/* The same recessed well follows a card from shelf to slot to packed kit.
   Decorative layers never change the icon box, name rows or rarity rim. */
:is(#view-field-guide, .clinic-prep) .hth-brew-card__art{isolation:isolate;box-shadow:inset 0 1px #ead7a432,inset 0 -2px #0c140d88}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__art::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('/wagon/sprites/ui/card-rule.png') center bottom / 32px 16px no-repeat,repeating-conic-gradient(#f5e4ba05 0% 25%,transparent 0% 50%) 0 0 / 6px 6px,linear-gradient(135deg,#426247,#213e2b);image-rendering:pixelated}
:is(#view-field-guide, .clinic-prep) .hth-brew-card--base .hth-brew-card__art::before{background-color:#58432e;background-image:url('/wagon/sprites/ui/card-rule.png'),repeating-conic-gradient(#f5e4ba05 0% 25%,transparent 0% 50%),linear-gradient(135deg,#695239,#3b3023)}
:is(#view-field-guide, .clinic-prep) .hth-brew-card--potion .hth-brew-card__art::before{background-color:#344b57;background-image:url('/wagon/sprites/ui/card-rule.png'),repeating-conic-gradient(#f5e4ba05 0% 25%,transparent 0% 50%),linear-gradient(135deg,#4c6770,#293e48)}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__name{width:100%;text-shadow:0 1px #0c140b}
:is(#view-field-guide, .clinic-prep) .hth-brew-card .hth-brew-card__icon{width:100%;height:100%;min-height:0;max-height:100%;max-width:48px;object-fit:contain;filter:drop-shadow(0 2px 1px #0008)}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__blank{width:55%;aspect-ratio:1;border:1px dashed #d5b37355;border-radius:3px}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__qty{position:absolute;right:-2px;bottom:0;padding:1px 3px;border-radius:2px;background:#17291fe6;color:var(--cream);font:10px/1 var(--f-pixel,monospace)}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;max-width:100%;max-height:3.3em;overflow:hidden;overflow-wrap:break-word}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:3px;min-width:0;max-width:100%;color:#ddc99b;font:9px/1 var(--f-pixel,monospace);white-space:normal}
:is(#view-field-guide, .clinic-prep) .hth-brew-card .hth-brew-card__tool{width:14px;height:14px;flex:0 0 14px}
:is(#view-field-guide, .clinic-prep) .hth-brew-card__toolname{overflow:hidden;text-overflow:ellipsis}
#view-field-guide .wagon-loadout__card--brew .hth-brew-card{font-size:15px;gap:5px}
#view-field-guide .wagon-loadout__card--brew .hth-brew-card__icon{max-width:64px}
#view-field-guide .wagon-loadout__card--brew .hth-brew-card__foot{font-size:12px}
.hth-craft__mini .hth-brew-card,.hth-craft__pick.is-base .hth-brew-card{--brew-rim:8px;padding:7px 5px 6px;font-size:9px}

/* Keep the base and confirmed result visible while the supply drawer scrolls. */
.hth-craft__yield{display:grid;grid-template-columns:60px 14px 60px minmax(0,1fr);align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--paper-line,#b99661);border-radius:3px;background:#3c663512}
.hth-craft__yield.is-new{border-color:var(--brass)}
.hth-craft__yield .hth-craft__arrow{color:var(--ink-soft,#725534)}
.hth-craft__mini{display:block;width:60px}
.hth-craft__mini.is-empty,.hth-craft__await{display:grid;place-items:center;aspect-ratio:.78;border:1px dashed #a6844f99;border-radius:5px;color:var(--ink-soft,#725534);font:11px var(--f-pixel,monospace)}
.hth-craft__await,.hth-craft__potion{display:block;width:60px}
.hth-craft__potion.is-pop .hth-brew-card{animation:hth-craft-bottle .9s ease-out;animation-delay:var(--pop-delay,0ms)}
.hth-craft__yield-info{display:grid;gap:2px;min-width:0;overflow-wrap:anywhere}
.hth-craft__yield-info b{font-size:14px;line-height:1.15}
.hth-craft__yield-info small{color:var(--ink-soft,#725534);font-size:12px}
.hth-craft__yield-info .hth-craft__found{color:#2f5a3c;font:12px var(--f-pixel,monospace)}

/* Drawer: base and ingredient cards */
.hth-craft__bases{display:flex;flex-wrap:wrap;gap:8px;padding:3px}
.hth-craft__base-group{display:grid;justify-items:center;align-content:start;gap:5px;width:94px;max-width:100%}
.hth-craft__keep{width:100%;min-height:36px;padding:4px;border:1px solid #a6844f99;border-radius:4px;background:transparent;color:inherit;font:11px var(--f-pixel,monospace);line-height:1.3;white-space:normal}
.hth-craft__keep[aria-pressed="true"]{background:#2f5a3c22;border-color:#6c8d66}
.hth-craft__keep:focus-visible{outline:2px solid #b38c43;outline-offset:2px}
.hth-craft__cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));justify-items:center;gap:8px;padding:3px}
.hth-craft__pick{position:relative;display:block;width:100%;max-width:92px;padding:0;border:0;border-radius:5px;background:none;color:inherit}
.hth-craft__pick.is-base{width:60px}
.hth-craft__pick.is-on{box-shadow:0 0 0 2px var(--paper),0 0 0 4px #2f5a3c}
.hth-craft__pick .hth-brew-card{transition:transform .12s ease-out}
.hth-craft__pick.is-ready:hover .hth-brew-card{transform:translateY(-1px)}
.hth-craft__pick.is-staged .hth-brew-card{filter:saturate(.55) brightness(.8)}
.hth-craft__pick.is-out{opacity:.45}
.hth-craft__pick .hth-craft__order{top:-4px;left:-4px}
.hth-craft.is-cards .hth-craft__formula{flex-wrap:wrap;gap:2px 3px}
.hth-craft__formula .hth-craft__blank{width:22px;height:22px;border:1px dashed #a6844f99;border-radius:3px}
.hth-craft__formula .hth-craft__tool{width:16px;height:16px;min-width:16px;margin-left:2px}

/* Only the ingredient drawer scrolls inside the native half-page viewport. */
.hth-craft__sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}

@keyframes hth-craft-drop{0%{transform:translateY(-8px) scale(.85)}70%{transform:translateY(1px) scale(1.04)}100%{transform:none}}
@keyframes hth-craft-bottle{0%{opacity:0;transform:translateY(7px) scale(.8)}35%{opacity:1;transform:translateY(-3px) scale(1.08)}65%,100%{opacity:1;transform:none}}
@keyframes hth-craft-pulse{50%{opacity:.4}}
@keyframes hth-craft-glow{0%{box-shadow:0 0 0 0 #e2c47e99}100%{box-shadow:0 0 0 6px #e2c47e00}}
@media(prefers-reduced-motion:reduce){
  .hth-craft-motion{display:none}
  .hth-craft__slot.is-new img,.hth-craft__bottle.is-pop img,.hth-craft__mark.is-stir,.hth-craft__result.is-new,.hth-craft__potion.is-pop .hth-brew-card{animation:none}
  .hth-craft__pick .hth-brew-card{transition:none}
  .hth-craft__pick.is-ready:hover .hth-brew-card{transform:none}
}
@container (max-width:330px){
  .hth-craft__bench{grid-template-columns:minmax(0,1fr) 9px minmax(0,1fr) 11px minmax(0,1fr);gap:3px;padding:7px 5px}
  .hth-craft__slot,.hth-craft__out{min-height:62px}
  .hth-craft__slot img{width:30px;height:30px}
  .hth-craft__out img{width:34px;height:34px}
  .hth-craft__stock{grid-template-columns:1fr 1fr}
  .hth-craft__item{grid-template-columns:22px 1fr auto;gap:3px}
  .hth-craft__item img{width:22px;height:22px}
  .hth-craft__item span{font-size:13px}
  .hth-craft__felt{gap:5px;padding:8px 6px 6px}
  .hth-craft__yield{grid-template-columns:60px 10px 60px minmax(0,1fr);gap:4px;padding:5px}
  .hth-craft__mini,.hth-craft__pick.is-base{width:60px}
  .hth-craft__await,.hth-craft__potion{width:60px}
  .hth-craft__cards{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
  .hth-craft.is-cards .hth-craft__recipe{grid-template-columns:minmax(0,1fr)}
}