/* tools.css — /herramientas de Widow Network (hub de herramientas). */

.tools-hero{padding-bottom:6px;}
.tools-hero p{margin-top:12px;font-size:17px;}
.tools-wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px 40px;}
.px{image-rendering:pixelated;}
.hint{margin:10px 0 0;color:var(--muted);font-size:14px;line-height:1.5;}
.hint b{color:var(--ink);font-weight:600;}

/* tiles */
.tool-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 14px;}
.tool-tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 12px 16px;border-radius:16px;cursor:pointer;
  background:linear-gradient(180deg,rgba(24,14,16,.65),rgba(13,8,9,.65));border:1px solid var(--line-soft);color:var(--ink);
  transition:border-color .25s,transform .2s,background .25s;font-family:var(--font-body);}
.tool-tile img,.tool-tile canvas{width:44px;height:44px;image-rendering:pixelated;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.55));transition:transform .25s;}
.tool-tile canvas{width:22px;height:44px;}
.tool-tile b{font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:.03em;text-transform:uppercase;margin-top:4px;}
.tool-tile span{font-size:13px;color:var(--muted);}
.tool-tile:hover{border-color:var(--line);transform:translateY(-3px);}
.tool-tile:hover img,.tool-tile:hover canvas{transform:scale(1.12) rotate(-4deg);}
.tool-tile.on{border-color:var(--red);background:linear-gradient(180deg,rgba(225,29,34,.16),rgba(13,8,9,.7));box-shadow:0 18px 40px -22px var(--red-glow);}
.tool-tile.on span{color:var(--silver);}
@media(max-width:900px){.tool-tiles{grid-template-columns:repeat(3,1fr);}}
@media(max-width:520px){.tool-tiles{grid-template-columns:repeat(2,1fr);gap:8px;}.tool-tile{padding:14px 8px 12px;}}

/* escenario */
.tool-stage-wrap{scroll-margin-top:84px;border:1px solid var(--line-soft);border-radius:20px;overflow:hidden;
  background:linear-gradient(180deg,rgba(20,12,13,.72),rgba(12,7,8,.74));box-shadow:0 34px 70px -44px #000;}
.tool-stage{padding:22px;}
.tools-foot{margin:18px 0 0;text-align:center;color:var(--muted-2);font-size:14px;}
.tools-foot a{color:var(--red-bright);font-weight:600;}

/* controles compartidos */
.lab{font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver-dim);}
.tool-stage input[type=number],.tool-stage input[type=text],.tool-stage select{font-family:var(--font-mono);font-size:16px;font-weight:700;color:var(--ink);
  background:rgba(8,5,6,.7);border:1px solid var(--line-soft);border-radius:10px;padding:11px 12px;outline:none;transition:border-color .2s;min-width:0;}
.tool-stage select{font-family:var(--font-body);font-weight:500;}
.tool-stage input:focus,.tool-stage select:focus{border-color:var(--red);}
.tool-stage input::-webkit-outer-spin-button,.tool-stage input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.tool-stage input[type=number]{-moz-appearance:textfield;appearance:textfield;}
.tool-copy{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);
  background:rgba(255,255,255,.05);border:1px solid var(--line-soft);border-radius:9px;padding:8px 12px;cursor:pointer;transition:border-color .2s,background .2s;}
.tool-copy:hover{border-color:var(--red);background:rgba(225,29,34,.08);}
.done{border-color:rgba(47,217,107,.5)!important;color:#5fd96b!important;}
.kv{display:flex;flex-direction:column;gap:5px;padding:13px 15px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);min-width:0;}
.kv span{font-family:var(--font-display);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;color:var(--silver-dim);}
.kv b{font-family:var(--font-mono);font-size:19px;font-weight:700;color:var(--ink);overflow-wrap:anywhere;}
.kv b i{font-style:normal;}
.kv b small{font-size:12px;color:var(--muted);font-weight:500;}
.kv.hi{border-color:var(--line);background:rgba(225,29,34,.08);}
.kv.hi b{color:var(--red-bright);}
.seg{display:inline-flex;gap:3px;padding:4px;border-radius:11px;background:rgba(8,5,6,.6);border:1px solid var(--line-soft);flex-wrap:wrap;}
.seg button{font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.03em;color:var(--muted);background:none;border:none;border-radius:8px;padding:8px 12px;cursor:pointer;transition:color .2s,background .2s;}
.seg button:hover{color:var(--ink);}
.seg button.on{color:#fff;background:var(--red);}
.btn.on{border-color:var(--red);background:rgba(225,29,34,.12);}
.swatches{display:flex;flex-wrap:wrap;gap:6px;}
.swatch{width:28px;height:28px;border-radius:8px;background:var(--c);border:2px solid rgba(0,0,0,.35);cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:transform .15s,border-color .15s;}
.swatch:hover{transform:scale(1.12);}
.swatch.on{border-color:#fff;transform:scale(1.14);box-shadow:0 0 0 2px var(--red);}
.slot{width:52px;height:52px;display:grid;place-items:center;border-radius:11px;background:rgba(8,5,6,.6);border:1px solid var(--line-soft);cursor:pointer;transition:border-color .2s,transform .15s,background .2s;padding:0;}
.slot img{width:32px;height:32px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));}
.slot:hover{border-color:var(--line);transform:translateY(-2px);}
.slot.on{border-color:var(--red);background:rgba(225,29,34,.14);box-shadow:0 0 0 1px var(--red);}
.slot.big{width:60px;height:60px;}
.slot.big img{width:38px;height:38px;}
.pill{font-family:var(--font-mono);font-weight:700;font-size:12.5px;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line-soft);border-radius:8px;padding:7px 10px;cursor:pointer;transition:border-color .15s,background .15s;}
.pill:hover{border-color:var(--red);background:rgba(225,29,34,.12);}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 7px 5px 10px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink);background:rgba(160,120,230,.14);border:1px solid rgba(160,120,230,.35);}
.chip button{width:18px;height:18px;border-radius:50%;border:none;background:rgba(255,255,255,.1);color:var(--ink);font-size:13px;line-height:1;cursor:pointer;padding:0;}
.chip button:hover{background:var(--red);}
.ly-x{width:30px;height:30px;border-radius:9px;border:1px solid var(--line-soft);background:none;color:var(--muted);font-size:17px;cursor:pointer;flex-shrink:0;transition:border-color .2s,color .2s;}
.ly-x:hover{border-color:var(--red);color:var(--red-bright);}

/* skins 3D */
.sk-wrap{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:24px;align-items:start;}
.sk-view{position:relative;height:420px;border-radius:16px;overflow:hidden;
  background:radial-gradient(80% 60% at 50% 100%,rgba(225,29,34,.18),transparent 70%),linear-gradient(180deg,rgba(8,5,6,.5),rgba(8,5,6,.8));border:1px solid var(--line-soft);}
.sk-view canvas{display:block;width:100%!important;height:420px!important;opacity:0;transition:opacity .4s;}
.sk-view.ready canvas{opacity:1;}
.sk-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--muted);font-size:14px;text-align:center;padding:20px;transition:opacity .3s;}
.sk-empty img{height:180px;image-rendering:pixelated;opacity:.35;filter:grayscale(1);}
.sk-view.ready .sk-empty{opacity:0;pointer-events:none;}
.sk-spin{position:absolute;top:50%;left:50%;width:36px;height:36px;margin:-18px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--red-bright);opacity:0;animation:spin 1s linear infinite;}
.sk-view.loading .sk-spin{opacity:1;}
@keyframes spin{to{transform:rotate(360deg);}}
.sk-side{display:flex;flex-direction:column;gap:14px;}
.sk-form{display:flex;gap:8px;}
.sk-form input{flex:1;font-size:18px;}
.sk-msg{margin:0;min-height:18px;color:#ff6b6b;font-size:14px;}
.sk-who{display:flex;align-items:center;gap:10px;min-height:32px;}
.sk-who img{width:32px;height:32px;border-radius:8px;image-rendering:pixelated;display:none;}
.sk-who img[src]{display:block;}
.sk-who b{font-family:var(--font-display);font-size:17px;}
.sk-actions{display:flex;gap:8px;flex-wrap:wrap;}
@media(max-width:760px){.sk-wrap{grid-template-columns:1fr;}}

/* estandartes */
.bn-presets-head{display:flex;align-items:baseline;gap:12px;margin-bottom:8px;}
.bn-presets-head .hint{margin:0;}
.bn-presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:6px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--line-soft);}
.preset{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 4px 6px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);cursor:pointer;color:var(--muted);font-family:var(--font-body);font-size:11.5px;transition:border-color .15s,transform .15s,color .15s;}
.preset canvas{width:24px;height:48px;image-rendering:pixelated;border-radius:2px;box-shadow:0 6px 12px -6px #000;}
.preset:hover{border-color:var(--red);transform:translateY(-2px);color:var(--ink);}
.preset.on{border-color:var(--red);background:rgba(225,29,34,.14);color:var(--ink);}
.bn-wrap{display:grid;grid-template-columns:300px 1fr;gap:24px;align-items:start;}
.bn-preview{display:grid;place-items:center;padding:22px;border-radius:16px;border:1px solid var(--line-soft);
  background:radial-gradient(70% 60% at 50% 100%,rgba(225,29,34,.16),transparent 70%),rgba(8,5,6,.55);}
.bn-preview canvas{width:160px;height:320px;image-rendering:pixelated;border-radius:3px;box-shadow:0 26px 50px -20px #000,0 0 0 1px rgba(0,0,0,.4);animation:bnSway 5s ease-in-out infinite;transform-origin:50% 0;}
@keyframes bnSway{0%,100%{transform:rotate(-1.2deg);}50%{transform:rotate(1.2deg);}}
.bn-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.bn-head{display:flex;justify-content:space-between;align-items:center;margin:18px 0 8px;}
.bn-head span{font-family:var(--font-display);font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--silver-dim);}
.bn-head b{font-family:var(--font-mono);font-size:13px;color:var(--red-bright);}
.bn-layers{display:flex;flex-direction:column;gap:6px;}
.layer{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.layer canvas{width:18px;height:36px;image-rendering:pixelated;border-radius:2px;}
.ly-name{flex:1;font-size:13.5px;color:var(--silver);}
.ly-recipe{display:flex;gap:4px;align-items:center;}
.px.sm{width:22px;height:22px;image-rendering:pixelated;}
.bn-row{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.bn-row .lab{width:48px;flex-shrink:0;}
.bn-patterns{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:6px;margin-top:6px;}
.pat{display:grid;place-items:center;padding:5px;border-radius:9px;background:rgba(8,5,6,.6);border:1px solid var(--line-soft);cursor:pointer;transition:border-color .15s,transform .15s;}
.pat canvas{width:20px;height:40px;image-rendering:pixelated;border-radius:2px;}
.pat:hover{border-color:var(--red);transform:translateY(-2px);}
@media(max-width:820px){.bn-wrap{grid-template-columns:1fr;}.bn-preview canvas{width:120px;height:240px;}}

/* yunque */
.an-items{display:flex;flex-wrap:wrap;gap:8px;}
.an-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-top:16px;}
.an-card{border:1px solid var(--line-soft);border-radius:14px;padding:12px;background:rgba(8,5,6,.45);display:flex;flex-direction:column;gap:10px;}
.an-card.target{border-color:var(--line);background:rgba(225,29,34,.07);}
.an-top{display:flex;align-items:center;gap:12px;}
.an-meta{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0;}
.an-meta b{font-family:var(--font-display);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.03em;}
.an-work{font-family:var(--font-display);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dim);display:flex;align-items:center;gap:6px;}
.an-work select{padding:4px 6px;font-size:13px;border-radius:7px;}
.slot.tog{position:relative;}
.slot.tog::after{content:"⇄";position:absolute;right:-5px;bottom:-5px;width:18px;height:18px;border-radius:50%;background:var(--red);color:#fff;font-size:11px;display:grid;place-items:center;}
.an-chips{display:flex;flex-wrap:wrap;gap:6px;min-height:8px;}
.an-add{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.an-add select{flex:1;min-width:130px;padding:8px 10px;font-size:14px;}
.an-pills{display:flex;gap:4px;}
.an-bar{display:flex;gap:8px;margin-top:12px;}
.an-verdict{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:18px;padding:14px 18px;border-radius:12px;border:1px solid;}
.an-verdict b{font-family:var(--font-display);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.03em;}
.an-verdict span{color:var(--silver);font-size:14.5px;}
.an-verdict.ok{border-color:rgba(47,217,107,.4);background:rgba(47,217,107,.07);color:#5fd96b;}
.an-verdict.bad{border-color:rgba(255,80,80,.45);background:rgba(255,60,60,.08);color:#ff6b6b;}
.an-chain{display:flex;flex-direction:column;gap:8px;margin-top:10px;}
.an-step{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.an-step i{font-family:var(--font-mono);font-style:normal;font-weight:700;font-size:13px;color:var(--red-bright);width:22px;flex-shrink:0;}
.an-step .op{font-family:var(--font-mono);color:var(--silver-dim);font-size:18px;}
.an-fig{margin:0;display:flex;align-items:center;gap:8px;flex:1;min-width:0;}
.an-fig img{width:30px;height:30px;image-rendering:pixelated;flex-shrink:0;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));}
.an-fig figcaption{font-size:11.5px;line-height:1.35;color:var(--muted);}
.an-step .cost{font-family:var(--font-mono);font-weight:700;font-size:16px;color:#5fd96b;background:rgba(47,217,107,.1);border:1px solid rgba(47,217,107,.35);border-radius:9px;padding:6px 10px;flex-shrink:0;}
.an-step.bad .cost{color:#ff6b6b;background:rgba(255,60,60,.1);border-color:rgba(255,80,80,.45);}
@media(max-width:640px){.an-step{flex-wrap:wrap;}.an-fig{flex-basis:100%;}}

/* nether */
.nc-dims{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:stretch;}
.nc-dim{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.nc-dim.ow{border-color:rgba(95,208,107,.35);background:linear-gradient(180deg,rgba(95,208,107,.09),rgba(8,5,6,.5));}
.nc-dim.ne{border-color:rgba(255,80,60,.4);background:linear-gradient(180deg,rgba(225,29,34,.12),rgba(8,5,6,.5));}
.nc-dim h4{margin:0;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;}
.nc-dim.ow h4{color:#7fe08a;}
.nc-dim.ne h4{color:var(--red-bright);}
.nc-in{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.nc-in label{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-weight:700;color:var(--silver-dim);}
.nc-in input{flex:1;width:100%;font-size:20px;}
.nc-dim .tool-copy{align-self:flex-start;}
.nc-swap{align-self:center;font-size:26px;color:var(--silver-dim);}
.rt{display:grid;grid-template-columns:1fr 150px 1fr;gap:16px;align-items:center;margin-top:18px;padding-top:18px;border-top:1px solid var(--line-soft);}
.rt-points{display:flex;flex-direction:column;gap:10px;}
.rt-pt{display:grid;grid-template-columns:auto 1fr 1fr;gap:8px;align-items:center;}
.rt-pt .lab{width:18px;text-align:center;font-size:14px;color:var(--red-bright);}
.rt-pt small{grid-column:2/-1;font-family:var(--font-mono);font-size:12px;color:var(--muted);}
.rt-pt small b{color:var(--ink);}
.rt-compass{display:flex;flex-direction:column;align-items:center;gap:4px;}
.rt-compass svg{width:130px;height:130px;}
.rt-compass .rim{fill:rgba(8,5,6,.7);stroke:var(--line-soft);stroke-width:1.5;}
.rt-compass .rim.in{fill:none;stroke-dasharray:2 4;}
.rt-compass .pt{fill:var(--silver-dim);font-family:var(--font-mono);font-size:11px;font-weight:700;text-anchor:middle;}
.rt-compass .pt.n{fill:var(--red-bright);}
.rt-compass .nd{fill:var(--red-bright);}
.rt-compass .nd.tail{fill:rgba(255,255,255,.28);}
.rt-compass .hub{fill:#fff;}
#rt-needle{transform-origin:60px 60px;transition:transform .5s cubic-bezier(.17,.89,.32,1.2);}
.rt-compass b{font-family:var(--font-display);font-size:14px;letter-spacing:.06em;text-transform:uppercase;}
.rt-compass small{font-family:var(--font-mono);font-size:11px;color:var(--muted);min-height:14px;}
.rt-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
@media(max-width:820px){.nc-dims{grid-template-columns:1fr;}.nc-swap{transform:rotate(90deg);}.rt{grid-template-columns:1fr;}.rt-compass{order:-1;}}

/* stacks */
.st-top{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;align-items:start;}
.st-in{display:flex;flex-direction:column;gap:8px;}
.st-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.st-row input{width:150px;font-size:24px!important;}
.st-row > b{font-family:var(--font-mono);font-size:20px;color:var(--muted);}
.st-sizes button{display:inline-flex;align-items:center;gap:6px;}
.st-sizes img{width:20px;height:20px;}
.st-sizes small{font-family:var(--font-body);font-size:11px;font-weight:500;color:var(--muted);letter-spacing:0;text-transform:none;}
.st-sizes button.on small{color:rgba(255,255,255,.75);}
.st-presets{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;}
.st-sum{margin:16px 0 10px;font-size:16px;color:var(--silver);}
.st-sum b{font-family:var(--font-mono);font-size:30px;color:var(--ink);margin-right:6px;}
.st-sum small{color:var(--muted);}
.st-eq{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.st-card{display:grid;grid-template-columns:44px 1fr;gap:0 10px;align-items:center;padding:12px 14px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.st-card img{grid-row:1/4;width:40px;height:40px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));}
.st-card b{font-family:var(--font-mono);font-size:24px;color:var(--ink);line-height:1.1;}
.st-card span{font-size:13.5px;color:var(--silver);}
.st-card small{font-size:11.5px;color:var(--muted);}
.st-vis{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:start;margin-top:14px;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.4);}
.st-shulkers{display:flex;flex-wrap:wrap;gap:4px;align-items:center;}
.st-shulkers .sh{width:30px;height:30px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));animation:popIn .3s both;}
.st-shulkers b{font-family:var(--font-mono);color:var(--muted);margin-left:4px;}
.st-shulkers span{flex-basis:100%;font-size:13px;color:var(--muted);margin-top:4px;}
.st-last{display:flex;flex-direction:column;gap:6px;align-items:flex-start;}
.inv{display:grid;grid-template-columns:repeat(9,30px);grid-template-rows:repeat(3,30px);gap:2px;padding:5px;border-radius:8px;background:#c6c6c6;border:2px solid #373737;box-shadow:inset -2px -2px 0 #555,inset 2px 2px 0 #fff;}
.slot-i{position:relative;display:grid;place-items:center;background:#8b8b8b;box-shadow:inset 1px 1px 0 #373737,inset -1px -1px 0 #fff;}
.slot-i img{width:22px;height:22px;image-rendering:pixelated;}
.slot-i b{position:absolute;right:1px;bottom:0;font-family:var(--font-mono);font-size:11px;color:#fff;text-shadow:1px 1px 0 #3f3f3f;}
.st-last small{font-size:12px;color:var(--muted);}
.st-price{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-top:14px;}
.st-pricein{display:flex;flex-direction:column;gap:6px;}
.st-pricein input{width:130px;}
.st-price-out{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
@media(max-width:820px){.st-top{grid-template-columns:1fr;}.st-eq{grid-template-columns:1fr 1fr;}.st-vis{grid-template-columns:1fr;}.st-price{grid-template-columns:1fr;}.st-price-out{grid-template-columns:1fr;}}
.st-presets button{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.03em;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line-soft);border-radius:999px;padding:6px 12px;cursor:pointer;transition:color .2s,border-color .2s;}
.st-presets button:hover{color:var(--ink);border-color:var(--red);}
.st-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;}
.st-visual{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-top:14px;min-height:28px;}
.st-visual .sh{width:28px;height:28px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));animation:popIn .3s both;}
.st-visual b{font-family:var(--font-mono);color:var(--muted);margin-left:6px;}
@keyframes popIn{from{transform:scale(.4);opacity:0;}to{transform:scale(1);opacity:1;}}
@media(max-width:720px){.st-form{grid-template-columns:1fr 1fr;}.st-grid{grid-template-columns:1fr 1fr;}}

/* experiencia */
.xp-top{display:grid;grid-template-columns:1fr auto 1.4fr;gap:14px;align-items:start;}
.xp-in{display:flex;flex-direction:column;gap:8px;}
.xp-arrow{font-family:var(--font-mono);font-size:28px;color:var(--silver-dim);padding-top:34px;}
.stepper{display:inline-flex;align-self:flex-start;align-items:stretch;border:1px solid var(--line-soft);border-radius:12px;overflow:hidden;background:rgba(8,5,6,.7);}
.stepper button{width:44px;font-family:var(--font-mono);font-size:22px;color:var(--ink);background:rgba(255,255,255,.04);border:none;cursor:pointer;transition:background .15s;}
.stepper button:hover{background:rgba(225,29,34,.2);}
.stepper input{width:90px;text-align:center;border:none!important;border-radius:0!important;font-size:26px!important;background:none!important;}
.xp-in .st-presets{margin:0;}
.xp-barwrap{display:flex;align-items:center;gap:10px;margin:18px 0 12px;}
.xp-mark{font-family:var(--font-display);font-weight:700;font-size:22px;color:#7CFC00;text-shadow:2px 2px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;min-width:34px;text-align:center;}
.xp-bar{position:relative;flex:1;height:20px;border-radius:6px;background:rgba(8,5,6,.8);border:2px solid #1b1b1b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);overflow:hidden;}
.xp-fill{height:100%;border-radius:3px;background:linear-gradient(180deg,#b8ff5a,#5fd06b 60%,#3f9d47);box-shadow:0 0 14px rgba(140,255,90,.5);transition:width .4s cubic-bezier(.17,.89,.32,1);}
.xp-need{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:14px 18px;margin-bottom:16px;border-radius:14px;border:1px solid var(--line);background:rgba(225,29,34,.08);}
.xp-need b{font-family:var(--font-mono);font-size:40px;font-weight:700;color:var(--red-bright);line-height:1;}
.xp-need span{font-size:16px;color:var(--ink);}
.xp-need small{flex-basis:100%;color:var(--muted);font-size:13px;}
.xp-eq{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 18px;}
.xp-src{display:grid;grid-template-columns:38px 1fr;gap:2px 10px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.xp-src img{grid-row:1/4;width:34px;height:34px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));}
.xp-src b{font-family:var(--font-mono);font-size:20px;color:var(--ink);line-height:1.1;}
.xp-src span{font-size:12.5px;color:var(--silver);line-height:1.3;}
.xp-src small{font-size:11px;color:var(--muted);}
.xp-ladder{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.rung{display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 10px;border-radius:10px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);min-width:64px;}
.rung span{font-family:var(--font-mono);font-size:11px;color:var(--muted);}
.rung b{font-family:var(--font-mono);font-size:14px;color:var(--ink);}
.rung.on{border-color:rgba(124,252,0,.45);background:rgba(124,252,0,.08);}
.rung.on b{color:#7CFC00;}
@media(max-width:820px){.xp-eq{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.xp-top{grid-template-columns:1fr;}.xp-arrow{display:none;}}

/* paleta de bloques */
.pal-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.pal-grad-top{margin-top:22px;padding-top:18px;border-top:1px solid var(--line-soft);}
.pal-color{display:inline-flex;align-items:center;gap:8px;padding:5px 10px 5px 5px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.6);}
.pal-color input[type=color]{width:38px;height:38px;border:none;padding:0;background:none;border-radius:9px;cursor:pointer;}
.pal-color input[type=color]::-webkit-color-swatch-wrapper{padding:0;}
.pal-color input[type=color]::-webkit-color-swatch{border:none;border-radius:8px;}
.pal-color input[type=text]{width:96px;padding:6px 8px;font-size:15px;border:none;background:none;}
.range{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dim);}
.range input{accent-color:var(--red);width:140px;}
.range b{font-family:var(--font-mono);font-size:14px;color:var(--ink);text-transform:none;letter-spacing:0;}
.range b i{font-style:normal;}
.check{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dim);cursor:pointer;}
.check input{accent-color:var(--red);width:16px;height:16px;}
.blk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;margin-top:14px;}
.blk{display:flex;flex-direction:column;align-items:center;gap:7px;padding:10px 6px 9px;border-radius:12px;border:1px solid var(--line-soft);cursor:pointer;color:var(--silver);
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 22%,rgba(8,5,6,.6)),rgba(8,5,6,.6));transition:border-color .15s,transform .15s;font-family:var(--font-body);}
.blk img{width:44px;height:44px;image-rendering:pixelated;border-radius:6px;box-shadow:0 8px 14px -6px #000;}
.blk span{font-size:11.5px;line-height:1.25;text-align:center;text-transform:capitalize;overflow-wrap:anywhere;}
.blk:hover{border-color:var(--red);transform:translateY(-2px);}
.blk-grid.grad{grid-template-columns:repeat(auto-fit,minmax(84px,1fr));position:relative;padding-top:12px;}
.blk-grid.grad::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;border-radius:3px;background:var(--g);}
.blk-grid.grad .blk img{width:52px;height:52px;}

/* pixel art */
.pa-top{display:grid;grid-template-columns:minmax(220px,1fr) 1.4fr;gap:14px;align-items:stretch;}
.pa-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:18px;border-radius:14px;cursor:pointer;text-align:center;
  border:1.5px dashed rgba(255,255,255,.18);background:rgba(8,5,6,.5);color:var(--muted);font-size:14px;transition:border-color .2s,background .2s;}
.pa-drop img{width:36px;height:36px;}
.pa-drop small{font-family:var(--font-mono);font-size:11px;color:var(--silver-dim);}
.pa-drop:hover,.pa-drop.over{border-color:var(--red);background:rgba(225,29,34,.08);color:var(--ink);}
.pa-opts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.4);}
.pa-size{font-family:var(--font-mono);font-size:13px;color:var(--red-bright);}
.pa-dl{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto;align-items:center;}
.pa-dl .lab{margin-right:4px;}
.pa-dl .btn-red{font-family:var(--font-mono);text-transform:none;letter-spacing:0;}
.pa-body{display:grid;grid-template-columns:1fr 280px;gap:16px;margin-top:14px;align-items:start;}
.pa-preview{border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Crect width='8' height='8' fill='%23000' opacity='.18'/%3E%3Crect x='8' y='8' width='8' height='8' fill='%23000' opacity='.18'/%3E%3C/svg%3E");padding:12px;display:grid;place-items:center;min-height:200px;overflow:auto;}
.pa-preview canvas{max-width:100%;height:auto;image-rendering:pixelated;box-shadow:0 20px 40px -20px #000;}
.pa-mats{display:flex;flex-direction:column;gap:4px;max-height:560px;overflow:auto;padding-right:4px;}
.mat{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:6px 9px;border-radius:10px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);font-size:13px;color:var(--silver);}
.mat img{width:26px;height:26px;image-rendering:pixelated;border-radius:5px;}
.mat span{text-transform:capitalize;overflow-wrap:anywhere;}
.mat b{font-family:var(--font-mono);color:var(--ink);}
.mat small{grid-column:2/-1;font-family:var(--font-mono);font-size:11px;color:var(--muted);}
.mat.total{grid-template-columns:1fr auto;border-color:var(--line);background:rgba(225,29,34,.08);}
.mat.total span{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-bright);}
.mat.total small{grid-column:1/-1;}
@media(max-width:820px){.pa-top{grid-template-columns:1fr;}.pa-body{grid-template-columns:1fr;}.pa-mats{max-height:320px;}}

/* recetas */
.rc-search{margin:0 0 12px;}
.cmd-search{position:relative;display:flex;align-items:center;gap:12px;padding:6px 8px 6px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(8,5,6,.7);transition:border-color .2s;}
.cmd-search:focus-within{border-color:var(--red);}
.cmd-search svg{width:20px;height:20px;color:var(--silver-dim);flex-shrink:0;}
.cmd-search input{flex:1;font-family:var(--font-body);font-size:17px;font-weight:600;color:var(--ink);background:none;border:none;outline:none;padding:10px 0;min-width:0;}
.cmd-search input::placeholder{color:var(--muted-2);font-weight:500;}
.cmd-search input::-webkit-search-cancel-button{-webkit-appearance:none;}
.cmd-search b{font-family:var(--font-mono);font-size:12px;color:var(--red-bright);background:rgba(225,29,34,.12);border:1px solid var(--line);border-radius:9px;padding:7px 10px;}
.rc-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;}
.rc-tile{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);color:var(--silver);font-family:var(--font-body);font-size:13px;text-align:left;cursor:pointer;transition:border-color .15s,transform .15s;}
.rc-tile:hover{border-color:var(--red);transform:translateY(-1px);}
.rc-tile span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rc-ico{width:28px;height:28px;image-rendering:pixelated;flex-shrink:0;object-fit:contain;}
.rc-ico.big{width:44px;height:44px;}
.rc-none{display:inline-grid;place-items:center;border-radius:6px;background:rgba(255,255,255,.08);font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;}
.rc-view{margin-top:16px;}
.rc-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.rc-head h3{margin:0;font-family:var(--font-display);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.02em;flex:1;}
.rc-recipe{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);margin-bottom:8px;position:relative;}
.rc-type{position:absolute;top:8px;right:12px;font-family:var(--font-display);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dim);}
.rc-grid{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,52px);gap:4px;padding:6px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);}
.rc-cell{display:grid;place-items:center;border-radius:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);padding:0;position:relative;}
.rc-cell.has{cursor:pointer;transition:border-color .15s,background .15s;}
.rc-cell.has:hover{border-color:var(--red);background:rgba(225,29,34,.12);}
.rc-cell img,.rc-cell .rc-none{width:34px;height:34px;}
.rc-cell b{position:absolute;right:3px;bottom:1px;font-family:var(--font-mono);font-size:13px;color:#fff;text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;}
.rc-cell.out{width:64px;height:64px;border-color:var(--line);background:rgba(225,29,34,.08);}
.rc-cell.out img,.rc-cell.out .rc-none{width:42px;height:42px;}
.rc-single{display:flex;align-items:center;gap:10px;padding:6px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);}
.rc-single .rc-cell{width:52px;height:52px;}
.rc-single span{font-size:20px;}
.rc-arrow{font-family:var(--font-mono);font-size:26px;color:var(--silver-dim);}
.rc-used{margin-top:14px;}
.rc-used .lab{display:block;margin-bottom:8px;}

/* pociones */
.po-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px;}
.po-tile{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);color:var(--silver);font-family:var(--font-body);font-size:13px;text-align:left;cursor:pointer;transition:border-color .15s,background .15s;}
.po-tile:hover{border-color:var(--red);}
.po-tile.on{border-color:var(--red);background:rgba(225,29,34,.14);color:var(--ink);}
.po-ico{width:28px;height:28px;image-rendering:pixelated;flex-shrink:0;}
.po-ico.big{width:48px;height:48px;}
.po-ing{width:30px;height:30px;image-rendering:pixelated;}
.po-view{margin-top:16px;}
.po-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.po-head h3{margin:0;font-family:var(--font-display);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.02em;}
.po-dur{margin-left:auto;font-family:var(--font-mono);font-size:12.5px;color:var(--red-bright);background:rgba(225,29,34,.1);border:1px solid var(--line);border-radius:9px;padding:6px 10px;}
.po-body{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start;}
.po-right{display:flex;flex-direction:column;gap:12px;min-width:0;}
.brew{display:flex;flex-direction:column;gap:10px;}
.brew-stand{position:relative;height:300px;border-radius:16px;border:1px solid var(--line-soft);overflow:hidden;
  background:radial-gradient(70% 55% at 50% 100%,rgba(255,120,30,.16),transparent 70%),linear-gradient(180deg,rgba(8,5,6,.55),rgba(8,5,6,.85));}
.brew-slot{position:absolute;width:48px;height:48px;border-radius:10px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;box-shadow:inset 0 2px 6px rgba(0,0,0,.6);}
.brew-slot .po-ing{width:32px;height:32px;}
.brew-fuel{left:28px;top:70px;}
.brew-fuel .fuel{position:absolute;left:54px;top:19px;width:60px;height:10px;border-radius:3px;background:rgba(0,0,0,.5);overflow:hidden;}
.brew-fuel .fuel b{display:block;width:78%;height:100%;background:linear-gradient(90deg,#ff6a1a,#ffc857);box-shadow:0 0 10px rgba(255,150,40,.7);}
.brew-ing{left:50%;top:22px;transform:translateX(-50%);}
.brew-ing img{animation:brewDrop .45s cubic-bezier(.2,1.4,.4,1);}
@keyframes brewDrop{from{transform:translateY(-26px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.brew-rod{position:absolute;left:50%;top:70px;width:6px;height:150px;margin-left:-3px;background:linear-gradient(180deg,#f5b73a,#a35d12);border-radius:3px;box-shadow:0 0 14px rgba(255,170,40,.35);}
.brew-prog{position:absolute;right:34px;top:76px;width:12px;height:110px;border-radius:6px;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.08);overflow:hidden;}
.brew-prog i{display:block;width:100%;height:0;background:linear-gradient(180deg,#fff,#c9c9c9);transition:none;}
.brew.on .brew-prog i{height:100%;transition:height 2s linear;}
.brew-bub{position:absolute;left:50%;top:80px;width:60px;height:120px;margin-left:-30px;pointer-events:none;}
.brew-bub i{position:absolute;bottom:0;width:8px;height:8px;border-radius:50%;background:#7fc4ff;opacity:0;box-shadow:0 0 8px rgba(127,196,255,.8);}
.brew-bub i:nth-child(1){left:6px;}.brew-bub i:nth-child(2){left:22px;}.brew-bub i:nth-child(3){left:38px;}.brew-bub i:nth-child(4){left:50px;}
.brew.on .brew-bub i{animation:brewBub 1.1s ease-out infinite;}
.brew.on .brew-bub i:nth-child(2){animation-delay:.3s;}.brew.on .brew-bub i:nth-child(3){animation-delay:.6s;}.brew.on .brew-bub i:nth-child(4){animation-delay:.85s;}
@keyframes brewBub{0%{transform:translateY(0) scale(.5);opacity:0;}20%{opacity:1;}100%{transform:translateY(-110px) scale(1.1);opacity:0;}}
.brew-bottles{position:absolute;left:0;right:0;top:186px;height:70px;}
.brew-bottles .brew-slot{top:0;}
.brew-bottles .b0{left:calc(50% - 86px);top:10px;}
.brew-bottles .b1{left:calc(50% - 24px);top:22px;}
.brew-bottles .b2{left:calc(50% + 38px);top:10px;}
.brew-bottle{width:34px;height:34px;image-rendering:pixelated;}
.brew-bottle.pop{animation:brewPop .5s cubic-bezier(.2,1.6,.4,1);}
@keyframes brewPop{0%{transform:scale(.5);}60%{transform:scale(1.2);}100%{transform:scale(1);}}
.brew-base{position:absolute;left:50%;bottom:0;width:180px;height:26px;margin-left:-90px;border-radius:8px 8px 0 0;background:linear-gradient(180deg,#3a2a24,#1c1310);border:1px solid rgba(255,255,255,.06);border-bottom:none;}
.brew-cap{min-height:20px;text-align:center;font-size:14px;color:var(--muted);}
.brew-cap b{color:var(--red-bright);font-family:var(--font-display);}
.po-needs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.po-needs .lab{margin-right:4px;}
.need{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--silver);background:rgba(8,5,6,.5);border:1px solid var(--line-soft);border-radius:999px;padding:4px 11px 4px 5px;}
.need img{width:22px;height:22px;}
.po-chain{display:flex;flex-direction:column;gap:6px;}
.po-step{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);flex-wrap:wrap;color:inherit;font-family:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s;}
.po-step:hover{border-color:var(--line);}
.po-step.on{border-color:var(--red);background:rgba(225,29,34,.12);}
@media(max-width:820px){.po-body{grid-template-columns:1fr;}}
.po-step i{font-family:var(--font-mono);font-style:normal;font-weight:700;font-size:13px;color:var(--red-bright);width:18px;}
.po-step .op{font-family:var(--font-mono);font-size:18px;color:var(--silver-dim);}
.po-step .po-ico{width:36px;height:36px;}
.po-step small{margin-left:auto;color:var(--muted);font-size:13px;}
.po-opts{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;margin-bottom:12px;}
.po-opts .seg button:disabled{opacity:.3;cursor:not-allowed;}
.po-mods{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;}
.po-mod{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.po-mod img{grid-row:1/3;}
.po-mod b{font-family:var(--font-display);font-size:13px;color:var(--ink);}
.po-mod span{font-size:12px;color:var(--muted);}
.po-mod.off{opacity:.38;}
.po-facts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.po-facts span{font-size:12.5px;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line-soft);border-radius:999px;padding:5px 11px;}
@media(max-width:720px){.po-mods{grid-template-columns:1fr 1fr;}}

/* daño */
.dm-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.dm-side{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.45);}
.dm-side.atk{border-color:rgba(255,80,60,.35);background:linear-gradient(180deg,rgba(225,29,34,.09),rgba(8,5,6,.5));}
.dm-side.def{border-color:rgba(127,196,255,.3);background:linear-gradient(180deg,rgba(127,196,255,.07),rgba(8,5,6,.5));}
.dm-head{display:flex;flex-direction:column;gap:8px;}
.dm-pick{display:flex;align-items:center;gap:12px;}
.dm-pick b{display:block;font-family:var(--font-display);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.02em;}
.dm-pick small{color:var(--muted);font-size:13px;}
.dm-pic{width:56px;height:56px;display:grid;place-items:center;border-radius:12px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.08);}
.dm-pic img{width:40px;height:40px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6));}
.dm-set{display:flex;gap:4px;padding:6px;border-radius:12px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.08);}
.dm-set img{width:32px;height:32px;image-rendering:pixelated;}
.dm-noarmor{font-size:12px;color:var(--muted);padding:9px 6px;}
.dm-sub{font-family:var(--font-display);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--silver-dim);}
.dm-grid{display:flex;flex-wrap:wrap;gap:6px;}
.dm-grid .slot{width:46px;height:46px;}
.dm-grid .slot img{width:30px;height:30px;}
.dm-abar{display:flex;gap:2px;}
.ap{position:relative;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M1 1h7v4H7v1H6v1H5v1H4V8H3V7H2V6H1z' fill='%232a2a2a'/%3E%3C/svg%3E") center/contain no-repeat;}
.ap::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M1 1h7v4H7v1H6v1H5v1H4V8H3V7H2V6H1z' fill='%23d9d9d9'/%3E%3Cpath d='M2 2h5v1H2z' fill='%23ffffff'/%3E%3C/svg%3E") center/contain no-repeat;clip-path:inset(0 calc(100% - var(--f) * 100%) 0 0);}
.dm-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.dm-row .lab{min-width:70px;}
.tool-stage [hidden]{display:none!important;}
.pill.on{border-color:var(--red);background:rgba(225,29,34,.18);}
.dm-result{margin-top:14px;display:grid;grid-template-columns:1.2fr 1fr;gap:14px;align-items:start;}
.dm-steps{display:flex;flex-direction:column;gap:4px;}
.dm-step{display:grid;grid-template-columns:34px 1fr auto 64px;gap:10px;align-items:center;padding:8px 12px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);font-size:14px;color:var(--silver);}
.dm-step img{width:26px;height:26px;image-rendering:pixelated;}
.dm-step em{font-style:normal;font-family:var(--font-mono);font-size:13px;color:var(--muted);}
.dm-step b{font-family:var(--font-mono);font-size:16px;color:var(--ink);text-align:right;}
.dm-step.last{border-color:var(--line);background:rgba(225,29,34,.1);}
.dm-step.last b{color:var(--red-bright);}
.dm-final{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.dm-big{display:flex;align-items:baseline;gap:8px;}
.dm-big b{font-family:var(--font-mono);font-size:44px;font-weight:700;color:var(--red-bright);line-height:1;}
.dm-big span{color:var(--muted);font-size:14px;}
.dm-left{font-size:13.5px;color:var(--muted);}
.dm-final .st-grid{width:100%;margin-top:4px;}
.dm-heartrow{display:flex;gap:3px;justify-content:center;}
.hp{position:relative;width:26px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M1 1h2v1h1v1h1V2h1V1h2v1h1v3H8v1H7v1H6v1H5v1H4V8H3V7H2V6H1V5H0V2h1z' fill='%232a2a2a'/%3E%3C/svg%3E") center/contain no-repeat;}
.hp::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M1 1h2v1h1v1h1V2h1V1h2v1h1v3H8v1H7v1H6v1H5v1H4V8H3V7H2V6H1V5H0V2h1z' fill='%23ff1e1e'/%3E%3Cpath d='M2 2h1v1H2zM6 2h1v1H6z' fill='%23ff7b7b'/%3E%3C/svg%3E") center/contain no-repeat;clip-path:inset(0 calc(100% - var(--f) * 100%) 0 0);}
@media(max-width:820px){.dm-wrap{grid-template-columns:1fr;}.dm-result{grid-template-columns:1fr;}}

/* editor de skins */
.ed-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.ed-top .sk-form{flex:1;min-width:240px;}
.ed-top .sk-form input{font-size:15px;}
.ed-body{display:grid;grid-template-columns:1fr 280px;gap:16px;align-items:start;}
.ed-tools{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px;}
.ed-tool{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.02em;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line-soft);border-radius:9px;padding:7px 10px;cursor:pointer;transition:color .15s,border-color .15s,background .15s;}
.ed-tool svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ed-tool:hover{color:var(--ink);border-color:var(--red);}
.ed-tool.on{color:#fff;background:var(--red);border-color:var(--red);}
.ed-sep{width:1px;height:26px;background:var(--line-soft);margin:0 4px;align-self:center;}
.ed-colorrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.swatch.sm{width:22px;height:22px;border-radius:6px;}
.ed-wrap{position:relative;width:100%;max-width:512px;aspect-ratio:1;border-radius:10px;overflow:hidden;border:1px solid var(--line-soft);
  background:repeating-conic-gradient(#2a2225 0 25%,#1c1618 0 50%) 0 0/16px 16px;touch-action:none;cursor:crosshair;user-select:none;}
.ed-wrap[data-tool="picker"]{cursor:copy;}
.ed-wrap[data-tool="fill"]{cursor:cell;}
.ed-inner{position:absolute;inset:0;transform-origin:0 0;transition:transform .35s cubic-bezier(.2,.9,.3,1);}
.ed-inner canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;}
#ed-guides{pointer-events:none;}
.ed-status{position:absolute;left:8px;bottom:8px;padding:4px 9px;border-radius:7px;background:rgba(0,0,0,.7);font-family:var(--font-mono);font-size:11px;color:var(--silver);pointer-events:none;}
.ed-status:empty{display:none;}
.ed-zoomrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.ed-zoomrow .seg button{padding:6px 9px;font-size:12px;}
.ed-tools .lab{margin-left:4px;}
.ed-view{height:340px;}
.ed-view canvas{height:340px!important;}
.ed-right{display:flex;flex-direction:column;gap:10px;}
@media(max-width:900px){.ed-body{grid-template-columns:1fr;}}

/* fuegos artificiales */
.fw-wrap{display:grid;grid-template-columns:360px 1fr;gap:16px;align-items:start;}
.fw-left{display:flex;flex-direction:column;gap:10px;}
#fw-canvas{width:100%;max-width:360px;aspect-ratio:1;border-radius:14px;border:1px solid var(--line-soft);background:#06040a;box-shadow:0 30px 60px -40px #000;}
.fw-right{display:flex;flex-direction:column;gap:8px;}
.fw-right .lab small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--muted);}
.fw-shapes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px;}
.fw-shape{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 8px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);color:var(--silver);font-family:var(--font-body);font-size:13.5px;cursor:pointer;transition:border-color .15s,background .15s;}
.fw-shape img{width:24px;height:24px;image-rendering:pixelated;}
.fw-shape:hover{border-color:var(--red);}
.fw-shape.on{border-color:var(--red);background:rgba(225,29,34,.14);color:var(--ink);}
.fw-recipes{margin-top:14px;}
@media(max-width:820px){.fw-wrap{grid-template-columns:1fr;}}

/* faro */
.bc-wrap{display:grid;grid-template-columns:minmax(260px,1fr) 1.2fr;gap:16px;align-items:start;}
.bc-left{display:flex;flex-direction:column;gap:10px;align-items:center;}
.bc-pyr{position:relative;display:flex;flex-direction:column;align-items:center;padding:30px 10px 14px;border-radius:16px;border:1px solid var(--line-soft);width:100%;
  background:radial-gradient(70% 60% at 50% 100%,rgba(127,196,255,.12),transparent 70%),linear-gradient(180deg,rgba(8,5,6,.5),rgba(8,5,6,.85));overflow:hidden;}
.bc-beam{position:absolute;left:50%;top:0;width:14px;height:36%;margin-left:-7px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(200,235,255,.75));box-shadow:0 0 22px rgba(160,220,255,.7);border-radius:0 0 3px 3px;animation:bcBeam 2.4s ease-in-out infinite;}
@keyframes bcBeam{0%,100%{opacity:.75;}50%{opacity:1;}}
.bc-row{display:flex;gap:1px;background:none;border:none;padding:0;cursor:pointer;position:relative;z-index:1;}
.bc-row i{width:26px;height:26px;background-size:cover;image-rendering:pixelated;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35);transition:filter .2s,opacity .2s;}
.bc-row:not(.on) i{filter:grayscale(1) brightness(.35);opacity:.6;}
.bc-row:hover i{filter:brightness(1.25);}
.bc-row:not(.on):hover i{filter:grayscale(.6) brightness(.6);}
.bc-beacon{width:26px;height:26px;display:grid;place-items:center;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.1);}
.bc-beacon img{width:22px;height:22px;image-rendering:pixelated;}
.bc-right{display:flex;flex-direction:column;gap:10px;}
.need.off{opacity:.35;}
.bc-effects{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.bc-fx{display:grid;grid-template-columns:30px 1fr;gap:0 8px;align-items:center;padding:8px 10px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);}
.bc-fx img{grid-row:1/3;width:26px;height:26px;image-rendering:pixelated;}
.bc-fx b{font-family:var(--font-display);font-size:13px;color:var(--ink);}
.bc-fx small{font-size:11px;color:var(--muted);}
.bc-fx.off{opacity:.3;}
@media(max-width:820px){.bc-wrap{grid-template-columns:1fr;}.bc-effects{grid-template-columns:1fr 1fr;}}

/* netherita */
.nt-top{display:flex;flex-direction:column;gap:10px;}
.nt-top .lab small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--muted);}
.nt-stats{margin:14px 0 16px;grid-template-columns:repeat(3,1fr);}
.nt-chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 12px;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.45);}
.nt-step{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 10px;border-radius:11px;border:1px solid transparent;transition:border-color .25s,background .25s,transform .25s;}
.nt-step.on{border-color:var(--red);background:rgba(225,29,34,.14);transform:translateY(-3px);}
.nt-ico{position:relative;display:grid;place-items:center;width:40px;height:40px;}
.nt-ico img{width:32px;height:32px;image-rendering:pixelated;}
.nt-ico b{position:absolute;right:-2px;bottom:-2px;font-family:var(--font-mono);font-size:12px;color:#fff;text-shadow:1px 1px 0 #000,-1px -1px 0 #000;}
.nt-step small{font-size:11px;color:var(--muted);white-space:nowrap;}
.nt-step.on small{color:var(--ink);}
.nt-arrow{font-family:var(--font-mono);color:var(--silver-dim);}
@media(max-width:720px){.nt-stats{grid-template-columns:1fr 1fr;}}

/* comida */
.fd-top{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;padding:14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.45);}
.fd-bars{display:flex;flex-direction:column;gap:8px;}
.fd-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.fd-row .lab{min-width:84px;}
.fd-row b{font-family:var(--font-mono);font-size:14px;color:var(--ink);}
.fd-bar{display:flex;gap:2px;}
.hg{position:relative;width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M5 1h2v1h1v2H7v1H6v1H5v1H4v1H3v1H1V7h1V6h1V5h1V4h1V3h1V2H5z' fill='%232a2a2a'/%3E%3C/svg%3E") center/contain no-repeat;}
.hg::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'%3E%3Cpath d='M5 1h2v1h1v2H7v1H6v1H5v1H4v1H3v1H1V7h1V6h1V5h1V4h1V3h1V2H5z' fill='%23c8863c'/%3E%3Cpath d='M6 2h1v1H6zM2 7h1v1H2z' fill='%23ffd9a0'/%3E%3C/svg%3E") center/contain no-repeat;clip-path:inset(0 calc(100% - var(--f) * 100%) 0 0);transition:clip-path .35s;}
.fd-sat{flex:1;max-width:238px;height:12px;border-radius:6px;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.08);overflow:hidden;}
.fd-sat i{display:block;height:100%;background:linear-gradient(90deg,#ffc857,#ff9a3c);box-shadow:0 0 10px rgba(255,200,87,.6);transition:width .4s;}
.fd-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin-top:8px;}
.fd-item{position:relative;display:grid;grid-template-columns:34px 1fr;gap:0 8px;align-items:center;padding:8px 10px 12px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);color:var(--silver);font-family:var(--font-body);text-align:left;cursor:pointer;overflow:hidden;transition:border-color .15s,transform .15s;}
.fd-item img{grid-row:1/3;width:30px;height:30px;image-rendering:pixelated;}
.fd-item span{font-size:13px;color:var(--ink);}
.fd-item small{font-size:11px;color:var(--muted);}
.fd-item small b{color:var(--silver);}
.fd-mini{position:absolute;left:0;bottom:0;height:3px;width:var(--w);background:#c8863c;}
.fd-item:hover{border-color:var(--red);transform:translateY(-2px);}
.fd-item.eat{animation:eatPop .45s cubic-bezier(.2,1.6,.4,1);}
@keyframes eatPop{0%{transform:scale(1);}40%{transform:scale(.9) rotate(-4deg);}100%{transform:scale(1);}}

/* caída */
.fl-wrap{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start;}
.fl-stage{position:relative;height:420px;border-radius:16px;border:1px solid var(--line-soft);overflow:hidden;
  background:radial-gradient(90% 40% at 50% 100%,rgba(225,29,34,.14),transparent 70%),linear-gradient(180deg,#0b0f1c,#150d0f 75%);}
.fl-stage.hit{animation:flHit .35s;}
@keyframes flHit{0%{box-shadow:inset 0 0 0 0 rgba(255,60,60,0);}30%{box-shadow:inset 0 0 60px 10px rgba(255,60,60,.45);}100%{box-shadow:inset 0 0 0 0 rgba(255,60,60,0);}}
.fl-rule{position:absolute;left:18px;bottom:40px;width:1px;background:rgba(255,255,255,.18);}
.fl-rule i{position:absolute;left:-4px;width:9px;height:1px;background:rgba(255,255,255,.35);}
.fl-rule i::after{content:attr(data-n);position:absolute;left:14px;top:-7px;font-family:var(--font-mono);font-size:10px;color:var(--silver-dim);}
.fl-col{position:absolute;left:50%;bottom:40px;width:4px;margin-left:-2px;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.05));border-radius:2px;}
.fl-plat{position:absolute;left:50%;width:70px;height:12px;margin-left:-35px;border-radius:4px;background:linear-gradient(180deg,#5a4a44,#2c221f);box-shadow:0 8px 18px -6px #000,inset 0 1px 0 rgba(255,255,255,.18);}
.fl-fig{position:absolute;left:50%;top:0;height:60px;image-rendering:pixelated;filter:drop-shadow(0 10px 10px rgba(0,0,0,.7));transform:translate(-50%,0);}
.fl-fig{transform-origin:50% 100%;}
.fl-fig.splat{animation:splat .45s cubic-bezier(.2,1.4,.4,1);}
@keyframes splat{0%{transform:translate(-50%,var(--y)) scaleY(1);}35%{transform:translate(-50%,var(--y)) scaleY(.72) scaleX(1.15);}100%{transform:translate(-50%,var(--y)) scaleY(1);}}
.fl-ground{position:absolute;left:0;right:0;bottom:0;height:40px;background:linear-gradient(180deg,#2a2124,#17110f);border-top:2px solid rgba(255,255,255,.12);}
.fl-ground::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:var(--gt,linear-gradient(180deg,rgba(255,255,255,.06),transparent));}
.fl-ground.water{background:linear-gradient(180deg,#1e4f9a,#0f2b57);border-top-color:rgba(160,210,255,.6);}
.fl-ground.hay{background:linear-gradient(180deg,#b7952f,#6d571a);}
.fl-ground.honey{background:linear-gradient(180deg,#f0a53a,#8c5a12);}
.fl-ground.slime{background:linear-gradient(180deg,#7fd46a,#3f7a34);}
.fl-ground.snow{background:linear-gradient(180deg,#f2f6ff,#b9c6d9);}
.fl-dust{position:absolute;left:50%;bottom:38px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:rgba(220,200,180,.55);opacity:0;}
.fl-dust.go{animation:dust .5s ease-out;}
@keyframes dust{0%{opacity:.9;transform:scale(1);}100%{opacity:0;transform:scale(10,3);}}
.fl-label{position:absolute;top:12px;right:14px;font-family:var(--font-mono);font-size:13px;color:var(--muted);text-align:right;}
.fl-label b{font-size:22px;color:var(--ink);}
.fl-landlab{position:absolute;bottom:12px;left:14px;font-family:var(--font-display);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);}
.fl-side{display:flex;flex-direction:column;gap:10px;}
.fl-range input{width:100%;flex:1;}
.fl-range{display:flex;}
.fl-verdict{padding:10px 14px;border-radius:12px;border:1px solid;font-family:var(--font-display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.03em;}
.fl-verdict.ok{color:#5fd96b;border-color:rgba(47,217,107,.4);background:rgba(47,217,107,.07);}
.fl-verdict.warn{color:#ffc857;border-color:rgba(255,200,87,.4);background:rgba(255,200,87,.07);}
.fl-verdict.bad{color:#ff6b6b;border-color:rgba(255,80,80,.45);background:rgba(255,60,60,.08);}
@media(max-width:720px){.fl-wrap{grid-template-columns:1fr;}.fl-stage{height:320px;}}

/* minado */
.mn-wrap{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start;}
.mn-stage{display:flex;flex-direction:column;align-items:center;gap:12px;padding:28px 18px 18px;border-radius:16px;border:1px solid var(--line-soft);
  background:radial-gradient(70% 55% at 50% 100%,rgba(255,200,87,.1),transparent 70%),linear-gradient(180deg,rgba(8,5,6,.5),rgba(8,5,6,.85));}
.mn-block{position:relative;width:160px;height:160px;border-radius:6px;overflow:visible;box-shadow:0 30px 50px -20px #000;}
.mn-block img{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;border-radius:6px;}
.mn-crack{opacity:0;mix-blend-mode:multiply;}
.mn-block.break .mn-tex,.mn-block.break .mn-crack{animation:mnBreak .5s forwards;}
@keyframes mnBreak{0%{transform:scale(1);opacity:1;}100%{transform:scale(.2);opacity:0;}}
.mn-block i{position:absolute;top:50%;left:50%;width:12px;height:12px;background:var(--pc,#888);opacity:0;image-rendering:pixelated;}
.mn-block.break i{animation:mnShard .7s ease-out forwards;}
.mn-block i:nth-child(3){--dx:-70px;--dy:-60px;}.mn-block i:nth-child(4){--dx:70px;--dy:-50px;}.mn-block i:nth-child(5){--dx:-60px;--dy:40px;}
.mn-block i:nth-child(6){--dx:60px;--dy:50px;}.mn-block i:nth-child(7){--dx:0;--dy:-80px;}.mn-block i:nth-child(8){--dx:10px;--dy:70px;}
@keyframes mnShard{0%{opacity:1;transform:translate(-50%,-50%);}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(200deg);}}
.mn-name{font-family:var(--font-display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.03em;}
.mn-prog{width:100%;height:8px;border-radius:4px;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.08);overflow:hidden;}
.mn-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffc857,#ff7a3c);}
.mn-timer{font-family:var(--font-mono);font-size:22px;font-weight:700;color:var(--ink);}
.mn-side{display:flex;flex-direction:column;gap:10px;}
.mn-hand{font-size:22px;}
@media(max-width:820px){.mn-wrap{grid-template-columns:1fr;}}

/* hora */
.hr-wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;align-items:start;}
.hr-scene{position:relative;height:340px;border-radius:16px;border:1px solid var(--line-soft);overflow:hidden;transition:background .3s;}
.hr-stars{position:absolute;inset:0;transition:opacity .4s;}
.hr-stars i{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:twinkle 3s ease-in-out infinite;}
@keyframes twinkle{0%,100%{opacity:.3;}50%{opacity:1;}}
.hr-sun,.hr-moon{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;image-rendering:pixelated;transition:left .25s,top .25s;}
.hr-sun{background:#ffe27a;box-shadow:0 0 30px 8px rgba(255,220,120,.6);}
.hr-moon{background:#e8ecf5;box-shadow:0 0 18px 4px rgba(220,230,255,.35);}
.hr-ground{position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(180deg,#5b9a3a 0 10px,#6d4a2f 10px 30px,#4a4a4a 30px);transition:filter .3s;}
.hr-ground::before{content:"";position:absolute;left:12%;bottom:70px;width:70px;height:60px;background:#3d2a1e;clip-path:polygon(0 100%,20% 40%,35% 55%,55% 10%,75% 50%,100% 100%);opacity:.8;}
.hr-hud{position:absolute;left:14px;top:14px;display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:rgba(0,0,0,.55);color:#fff;}
.hr-hud img{width:32px;height:32px;}
.hr-hud b{font-family:var(--font-mono);font-size:24px;}
.hr-hud span{font-size:13px;color:rgba(255,255,255,.75);}
.hr-side{display:flex;flex-direction:column;gap:10px;}
.hr-cmd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.hr-cmd code{font-family:var(--font-mono);font-weight:700;font-size:15px;color:var(--red-bright);background:rgba(225,29,34,.1);border:1px solid var(--line);border-radius:9px;padding:8px 12px;}
.st-presets button.on{color:#fff;background:var(--red);border-color:var(--red);}
@media(max-width:820px){.hr-wrap{grid-template-columns:1fr;}.hr-scene{height:260px;}}

/* encantamientos */
.en-top{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.en-head{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;border:1px solid var(--line-soft);background:rgba(8,5,6,.45);}
.en-head > div{flex:1;min-width:0;}
.en-head b{display:block;font-family:var(--font-display);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px;}
.en-pic{position:relative;width:64px;height:64px;flex-shrink:0;display:grid;place-items:center;border-radius:14px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.08);overflow:hidden;}
.en-pic img{width:44px;height:44px;image-rendering:pixelated;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6));}
.en-pic.glint::after{content:"";position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 40%,rgba(200,120,255,.55) 50%,transparent 60%);animation:glint 2.2s linear infinite;mix-blend-mode:screen;}
@keyframes glint{from{transform:translateX(-60%);}to{transform:translateX(60%);}}
.en-summary{display:flex;flex-wrap:wrap;gap:6px;}
.en-note{min-height:16px;color:#ffc857;}
.en-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px;}
.en-row{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;padding:9px 12px;border-radius:11px;border:1px solid var(--line-soft);background:rgba(8,5,6,.5);transition:border-color .2s,background .2s;}
.en-row b{font-family:var(--font-display);font-size:13.5px;color:var(--ink);}
.en-row small{grid-column:1;font-size:11px;color:var(--muted);}
.en-row .an-pills{grid-row:1/3;grid-column:2;}
.en-row.on{border-color:rgba(160,120,230,.55);background:rgba(160,120,230,.1);}
.en-row.clash{opacity:.55;}
.en-row.clash small{color:#ff9b9b;}

/* escena de cabecera: brújulas buscando el rumbo */
.amb-compasswrap{position:absolute;left:0;top:50%;transform:translate(-50%,-50%);width:78px;height:78px;display:grid;place-items:center;}
.amb-compasswrap::before{content:"";position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(255,255,255,.14);animation:ambSpin 30s linear infinite;}
.amb-compass{width:52px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.6));}
.amb-compassdot{position:absolute;top:-4px;left:50%;width:8px;height:8px;border-radius:50%;background:var(--red-bright);box-shadow:0 0 10px var(--red-glow);transform:translateX(-50%);animation:pulse 2.2s infinite;}
@media(prefers-reduced-motion:reduce){.bn-preview canvas,.st-visual .sh{animation:none;}}