/* Pagina Ferramentas (explorador) e pagina de ferramenta */
.fx-hero{position:relative;padding:clamp(130px,16vw,190px) 0 clamp(36px,5vw,64px);overflow:hidden;isolation:isolate;text-align:center}
.fx-copy{position:relative;z-index:2;display:grid;justify-items:center;gap:22px}
.fx-copy h1{font-size:clamp(40px,7.4vw,92px);max-width:15ch;line-height:1.02}
.fx-search{display:flex;align-items:center;gap:10px;width:min(760px,100%);padding:8px 8px 8px 22px;border-radius:var(--r-pill);box-shadow:var(--sh)}
.fx-search>.i{color:var(--accent-strong);width:22px;height:22px}
.fx-input{flex:1;min-width:0;border:0;background:none;color:var(--ink);font:400 17px/1.3 var(--f-body);padding:14px 4px}
.fx-input:focus{outline:0}.fx-input::placeholder{color:var(--text-mute)}
.fx-search:focus-within{box-shadow:var(--sh),0 0 0 3px var(--accent-glow)}
@media(max-width:560px){.fx-search .btn span{display:none}.fx-search .btn{padding:13px 16px}.fx-input{font-size:15px}}
.fx-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:860px}
.fx-answer{min-height:28px;color:var(--text-soft);font-size:15.5px;max-width:700px}
.fx-answer b{color:var(--ink)}.fx-answer a{font-weight:600}
.fx-body{position:relative;z-index:2;padding-bottom:96px}
.fx-cats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:30px}
.rain{z-index:0;-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 62%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 62%,transparent)}
.rain-col{width:42px;align-items:center}
.rain-col .ti{--s:30px}
.mosaic{min-height:560px;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:18px;padding:8px 8px 36px}
@media(max-width:520px){.mosaic{grid-template-columns:repeat(3,1fr);gap:12px}}
.tile .bob{position:absolute;inset:0;display:grid;place-items:center;animation:bob var(--bd,6s) ease-in-out infinite;animation-delay:var(--bl,0s)}
.tile{border-radius:24px}
.tile.dim .bob{animation-play-state:paused}
.tool-hero{position:relative;padding:clamp(120px,14vw,160px) 0 40px;overflow:hidden;isolation:isolate}
.tool-top{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;position:relative;z-index:2}
@media(max-width:720px){.tool-top{grid-template-columns:auto 1fr}.tool-top .btn{grid-column:1/-1}}
.tool-badge{width:92px;height:92px;border-radius:28px;display:grid;place-items:center;background:var(--glass);border:1px solid var(--glass-line);box-shadow:var(--sh);}
.tool-badge .ti{--s:48px}
.tool-top h1{font-size:clamp(34px,5.4vw,60px)}
.crumbs{font:500 13px var(--f-ui);color:var(--text-mute);margin-bottom:18px;position:relative;z-index:2}
.tool-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:start;position:relative;z-index:2}
@media(max-width:900px){.tool-grid{grid-template-columns:1fr}}
.ep{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--line)}
.ep:last-child{border:0}.ep code{font:500 12.5px var(--f-mono);color:var(--ink);word-break:break-all}.ep small{display:block;color:var(--text-soft);font-size:13.5px;margin-top:2px}
.m-get,.m-post{font:600 11px var(--f-mono);padding:4px 8px;border-radius:7px}
.m-get{background:var(--info-soft);color:var(--info)}.m-post{background:var(--good-soft);color:var(--good)}
.ep .pr{font:600 14px var(--f-mono);color:var(--accent-strong);white-space:nowrap}
.try-box{position:sticky;top:96px}
.try-box .term-body{min-height:220px;font-size:12.5px}

/* ===== Ferramentas: palco de fisica (icones caem, colidem, empilham) ===== */
.fx-hero{min-height:max(640px,100svh);display:block;padding-bottom:clamp(230px,34vh,330px)}
.fx-stage{position:absolute;inset:0;z-index:1;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.fx-copy{pointer-events:none;z-index:2;padding-bottom:40px}
.fx-copy .fx-search,.fx-copy .fx-chips,.fx-copy .fx-cats,.fx-copy .fx-answer a,.fx-copy .chip,.fx-copy button,.fx-copy input{pointer-events:auto}
.fx-hint{font-size:12.5px;color:var(--text-mute);margin:0}
.fx-cats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:900px;margin:0}
.pb{position:absolute;left:0;top:0;display:grid;place-items:center;border-radius:22%;background:linear-gradient(160deg,var(--glass-2),var(--paper));border:1px solid var(--glass-line);box-shadow:0 1px 0 var(--glass-line) inset,0 12px 20px -10px rgba(60,38,0,.4),0 2px 5px rgba(60,38,0,.12);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;transition:opacity .35s,filter .35s,box-shadow .2s}
:root[data-theme="dark"] .pb{box-shadow:0 1px 0 var(--glass-line) inset,0 14px 22px -10px rgba(0,0,0,.85)}
.pb.rd{border-radius:50%}
.pb:hover{z-index:4;box-shadow:0 0 0 2px var(--accent),0 14px 26px -8px var(--accent-glow)}
.pb.dragging{cursor:grabbing;z-index:6;box-shadow:0 0 0 2px var(--accent),0 24px 36px -10px rgba(60,38,0,.5)}
.pb.dim{opacity:.16;filter:grayscale(.7)}
.pb.hit{box-shadow:0 0 0 2px var(--accent),0 0 30px -4px var(--accent-glow)}
.pb::after{content:attr(data-n);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;font:600 12px var(--f-ui);padding:6px 10px;border-radius:8px;background:var(--night);color:var(--on-night);opacity:0;pointer-events:none;transition:opacity .15s}
.pb:hover::after{opacity:1}.pb.dragging::after{opacity:0}
.fx-static .fx-stage,.fx-static .fx-hint{display:none}
.fx-static .fx-hero{min-height:0;padding-bottom:30px}
.fx-feat{padding-top:clamp(48px,6vw,88px)}
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:960px){.feat-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.feat-grid{grid-template-columns:1fr}}
.feat{display:grid;gap:14px;padding:20px;color:inherit;align-content:start}
.feat:hover{text-decoration:none}
.feat-ico{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;background:var(--paper);border:1px solid var(--line)}
.feat-ico .ti{--s:28px}
.feat h3{font-size:17px;margin-bottom:4px}.feat p{margin:0;font-size:13.5px;color:var(--text-soft)}
.fx-list{margin-top:8px}
.fx-list>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;font:600 14px var(--f-ui);color:var(--ink);padding:12px 20px;border-radius:var(--r-pill);background:var(--glass);border:1px solid var(--glass-edge)}
.fx-list>summary::-webkit-details-marker{display:none}
.fx-list>summary::after{content:"+";font-size:18px;line-height:1;color:var(--accent-strong)}
.fx-list[open]>summary::after{content:"\2212"}
.fx-body{padding-top:0}
@media(max-width:640px){.fx-hero{min-height:0;padding-bottom:230px}}
