/* HoodLust Explore. Powered by private RPC infrastructure. */
:root{--face: #c0c0c0;--light: #ffffff;--hi: #dfdfdf;--shadow: #808080;--dark: #0a0a0a;--desk: #008080;--title1: #000080;--title2: #1084d0;--titleOff1: #808080;--titleOff2: #b5b5b5;--ink: #000;--sel: #000080;--ok: #007a00;--bad: #b00000;--warn: #8a6d00;--font: "Pixelated MS Sans Serif","Microsoft Sans Serif","MS Sans Serif",Tahoma,Geneva,Verdana,sans-serif}
*{box-sizing: border-box}
html,body{margin: 0;height: 100%}
body{background: var(--desk);color: var(--ink);font: 13px/1.35 var(--font);overflow: hidden;-webkit-font-smoothing: none;user-select: none}
input,textarea,select,button{font: inherit;color: var(--ink)}
a{color: #0000ee}
.mono{font-family: "Courier New",Courier,monospace;font-size: 12px;user-select: text}
.muted{color: #444}
.ok{color: var(--ok)}
.bad{color: var(--bad)}
.warn{color: var(--warn)}
.hidden{display: none !important}
.raised{background: var(--face);box-shadow: inset -1px -1px var(--dark),inset 1px 1px var(--light),inset -2px -2px var(--shadow),inset 2px 2px var(--hi)}
.sunken{background: #fff;box-shadow: inset 1px 1px var(--shadow),inset -1px -1px var(--light),inset 2px 2px var(--dark),inset -2px -2px var(--hi)}
.field-frame{box-shadow: inset 1px 1px var(--shadow),inset -1px -1px var(--light);padding: 8px}
button,.btn{background: var(--face);border: 0;padding: 5px 14px;min-height: 28px;min-width: 76px;cursor: pointer;box-shadow: inset -1px -1px var(--dark),inset 1px 1px var(--light),inset -2px -2px var(--shadow),inset 2px 2px var(--hi)}
button:active:not(:disabled),.btn.pressed,button.pressed{box-shadow: inset 1px 1px var(--dark),inset -1px -1px var(--light),inset 2px 2px var(--shadow),inset -2px -2px var(--hi);padding: 6px 13px 4px 15px}
button:focus-visible{outline: 1px dotted #000;outline-offset: -5px}
button:disabled{color: var(--shadow);text-shadow: 1px 1px #fff;cursor: default}
button.primary{font-weight: bold;box-shadow: 0 0 0 1px #000,inset -1px -1px var(--dark),inset 1px 1px var(--light),inset -2px -2px var(--shadow),inset 2px 2px var(--hi)}
input[type=text],input[type=number],textarea,select{background: #fff;border: 0;padding: 5px 6px;min-height: 28px;width: 100%;user-select: text;box-shadow: inset 1px 1px var(--shadow),inset -1px -1px var(--light),inset 2px 2px var(--dark),inset -2px -2px var(--hi)}
input:focus,textarea:focus,select:focus{outline: 1px dotted #000;outline-offset: -4px}
label{display: block;margin: 8px 0 4px}
input[type=checkbox]{width: 15px;height: 15px;vertical-align: -3px;accent-color: #000}
fieldset{border: 0;margin: 10px 0;padding: 14px 10px 10px;box-shadow: inset -1px -1px var(--light),inset 1px 1px var(--shadow),inset -2px -2px var(--shadow),inset 2px 2px var(--light);position: relative}
legend{padding: 0 4px;background: var(--face);position: absolute;top: -8px;left: 8px}
hr{border: 0;border-top: 1px solid var(--shadow);border-bottom: 1px solid var(--light);margin: 10px 0}
.row{display: flex;gap: 8px;align-items: center;flex-wrap: wrap}
.row > *{flex: 0 0 auto}
.grow{flex: 1 1 auto !important;min-width: 0}
.grid2{display: grid;grid-template-columns: 1fr 1fr;gap: 8px}
#desktop{position: fixed;inset: 0 0 36px 0}
.icons{position: absolute;top: 10px;left: 10px;display: grid;grid-template-rows: repeat(auto-fill,86px);grid-auto-flow: column;gap: 6px;height: calc(100% - 20px)}
.icon{width: 84px;text-align: center;color: #fff;cursor: pointer;padding: 4px 2px}
.icon .glyph{font-size: 32px;line-height: 40px;filter: drop-shadow(1px 1px 0 #000)}
.icon span{display: inline-block;padding: 1px 3px;font-size: 12px;text-shadow: 1px 1px 0 #000}
.icon.sel span{background: var(--sel);outline: 1px dotted #fff;text-shadow: none}
.icon .soon{display: block;font-size: 10px;color: #ffe680}
.wallpaper{position: absolute;right: 24px;bottom: 16px;color: rgba(255,255,255,.25);text-align: right;pointer-events: none;font-weight: bold}
.wallpaper b{display: block;font-size: 44px;letter-spacing: 2px}
.win{position: absolute;min-width: 300px;display: flex;flex-direction: column;background: var(--face);padding: 3px;box-shadow: inset -1px -1px var(--dark),inset 1px 1px var(--hi),inset -2px -2px var(--shadow),inset 2px 2px var(--light),2px 2px 0 rgba(0,0,0,.25)}
.titlebar{display: flex;align-items: center;gap: 6px;padding: 3px 3px 3px 6px;color: #fff;font-weight: bold;cursor: move;background: linear-gradient(90deg,var(--title1),var(--title2));touch-action: none}
.win.inactive .titlebar{background: linear-gradient(90deg,var(--titleOff1),var(--titleOff2));color: var(--face)}
.titlebar .t{flex: 1 1 auto;overflow: hidden;white-space: nowrap;text-overflow: ellipsis}
.titlebar button{min-width: 0;width: 20px;height: 18px;min-height: 18px;padding: 0;font: bold 12px/1 var(--font)}
.win-body{padding: 10px;overflow: auto;flex: 1 1 auto;user-select: text}
.statusbar{display: flex;gap: 3px;margin-top: 3px}
.statusbar > div{flex: 1;padding: 2px 6px;box-shadow: inset 1px 1px var(--shadow),inset -1px -1px var(--light);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 12px}
.modal-back{position: fixed;inset: 0;background: rgba(0,0,0,.001);z-index: 9000;display: flex;align-items: center;justify-content: center;padding: 16px}
.msgbox{max-width: 440px;width: 100%;position: relative}
.msgbox .content{display: flex;gap: 12px;align-items: flex-start;padding: 14px 10px;user-select: text}
.msgbox .ico{font-size: 30px;line-height: 1}
.msgbox .btns{display: flex;gap: 8px;justify-content: center;padding: 4px 0 8px;flex-wrap: wrap}
.progress{height: 20px;padding: 3px;overflow: hidden}
.progress .bar{height: 100%;width: 30%;background: repeating-linear-gradient(90deg,var(--sel) 0 10px,transparent 10px 12px);animation: marq 1.2s linear infinite}
@keyframes marq{from{transform: translateX(-100%)}
to{transform: translateX(340%)}
}
#boot{position: fixed;inset: 0;display: flex;align-items: center;justify-content: center;padding: 16px;z-index: 7000}
#boot .win{position: relative;width: min(470px,100%)}
.hero{text-align: center;padding: 6px 4px 12px}
.hero .logo{font-size: 30px;font-weight: bold;letter-spacing: 1px;color: var(--title1);text-shadow: 2px 2px 0 #fff,3px 3px 0 var(--shadow)}
.walletpick{display: grid;gap: 6px;margin-top: 8px}
.walletpick button{display: flex;gap: 10px;align-items: center;text-align: left}
.walletpick img{width: 22px;height: 22px}