/*
 * MyBB Forge: Blood & Ink revamp.
 * Intentionally image-free: the atmosphere is generated with CSS so every
 * forum cell shares one continuous horror surface.
 */
:root {
--hf-ink: #050609;
--hf-void: #0b0b10;
--hf-panel: #111118;
--hf-panel-2: #19151d;
--hf-line: #3b222b;
--hf-purple: #76263c;
--hf-purple-bright: #e3a0aa;
--hf-orange: #d9362f;
--hf-orange-soft: #ff8170;
--hf-blood: #a90f25;
--hf-blood-bright: #ef3044;
--hf-bone: #f4ddd3;
--hf-muted: #a49aa6;
}

html, body {
background: var(--hf-ink) !important;
color: var(--hf-bone) !important;
}
body {
background-image:
radial-gradient(ellipse at 50% -20%, rgba(137, 24, 49, .34), transparent 48%),
radial-gradient(ellipse at 12% 90%, rgba(102, 22, 88, .24), transparent 34%),
radial-gradient(ellipse at 90% 42%, rgba(190, 20, 35, .12), transparent 30%),
repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 5px) !important;
background-attachment: fixed !important;
font-family: "Trebuchet MS", "Segoe UI", sans-serif !important;
}
body:before {
inset: 0 !important;
opacity: .38 !important;
background:
radial-gradient(circle at 15% 15%, transparent 0 7%, rgba(218, 34, 54, .14) 7.2%, transparent 15%),
radial-gradient(circle at 82% 62%, transparent 0 9%, rgba(145, 31, 116, .14) 9.2%, transparent 20%),
linear-gradient(104deg, transparent 0 48%, rgba(245, 48, 60, .08) 48.2% 48.45%, transparent 48.7% 100%) !important;
filter: blur(1px) !important;
animation: hf-ink-breathe 12s ease-in-out infinite alternate !important;
}
body:after {
opacity: .18 !important;
background-image:
radial-gradient(circle, rgba(255, 112, 102, .7) 0 1px, transparent 1.5px),
radial-gradient(circle, rgba(215, 155, 234, .4) 0 1px, transparent 1.5px) !important;
background-position: 0 0, 31px 47px !important;
background-size: 83px 97px, 113px 137px !important;
animation: hf-ash-drift 28s linear infinite !important;
}

#logo {
min-height: 168px !important;
background-color: #08070c !important;
background-image:
linear-gradient(115deg, rgba(5, 6, 9, .98) 0%, rgba(46, 8, 23, .88) 48%, rgba(7, 7, 12, .97) 100%),
repeating-linear-gradient(168deg, transparent 0 31px, rgba(255, 75, 78, .08) 32px, transparent 34px 74px) !important;
background-blend-mode: normal !important;
border-bottom: 1px solid #7d2635 !important;
box-shadow: inset 0 -40px 80px rgba(0, 0, 0, .86), 0 8px 30px rgba(120, 12, 34, .25) !important;
}
#logo:before {
inset: auto 6% 0 auto !important;
width: 360px !important;
height: 150px !important;
opacity: .8 !important;
background:
linear-gradient(112deg, transparent 0 43%, rgba(236, 42, 61, .65) 43.4% 44%, transparent 44.4%),
linear-gradient(77deg, transparent 0 58%, rgba(236, 42, 61, .5) 58.4% 59%, transparent 59.4%),
radial-gradient(ellipse at 52% 100%, rgba(164, 14, 35, .4), transparent 63%) !important;
filter: blur(.2px) drop-shadow(0 0 8px rgba(210, 25, 42, .5)) !important;
animation: hf-blood-veins 7s ease-in-out infinite alternate !important;
}
#logo:after {
top: 25px !important;
right: 16% !important;
width: 54px !important;
height: 54px !important;
background: radial-gradient(circle at 38% 34%, #ff8170 0 5%, #b20e29 7% 56%, #250913 60% 100%) !important;
border: 2px solid rgba(255, 129, 112, .7) !important;
box-shadow: 0 0 0 7px rgba(169, 15, 37, .12), 0 0 28px rgba(239, 48, 68, .32) !important;
}
.hf-brand, #logo a.hf-brand { color: var(--hf-bone) !important; }
.hf-brand__name { text-shadow: 0 0 15px rgba(239, 48, 68, .35) !important; }
.hf-brand__name span { color: var(--hf-blood-bright) !important; }
.hf-brand__sigil { color: var(--hf-blood-bright) !important; filter: drop-shadow(0 0 8px rgba(239, 48, 68, .75)) !important; }
.hf-brand__tagline { color: #c99daa !important; }
.hf-console-pill { border-color: rgba(239, 48, 68, .35) !important; background: rgba(24, 7, 14, .7) !important; }
.hf-console-dot { background: var(--hf-blood-bright) !important; box-shadow: 0 0 10px var(--hf-blood-bright) !important; }
.hf-console-pill strong, .hf-console-pill em { color: var(--hf-orange-soft) !important; }
.hf-ritual-toggle { border-color: rgba(239, 48, 68, .6) !important; background: rgba(169, 15, 37, .16) !important; color: #ffd2c9 !important; }
#header ul.menu.top_links li a,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab {
border-color: rgba(215, 155, 234, .3) !important;
background: linear-gradient(180deg, rgba(38, 17, 34, .95), rgba(10, 7, 12, .97)) !important;
color: #f7e9f4 !important;
box-shadow: inset 0 1px 0 rgba(255, 129, 112, .12), 0 5px 13px rgba(0, 0, 0, .35) !important;
}
#header ul.menu.top_links li a:hover { border-color: var(--hf-blood-bright) !important; background: rgba(169, 15, 37, .26) !important; }

#panel {
background: #0a080e !important;
border-bottom-color: #4b1c2a !important;
}
#panel .upper {
background-color: #100b12 !important;
background-image:
linear-gradient(90deg, rgba(7, 6, 10, .96), rgba(53, 11, 28, .73), rgba(7, 6, 10, .96)),
repeating-linear-gradient(90deg, transparent 0 38px, rgba(255, 129, 112, .035) 39px 40px) !important;
border-top-color: #5c2433 !important;
border-bottom-color: #1f0c14 !important;
}
#panel .hf-welcome strong, #panel .hf-welcome { color: var(--hf-bone) !important; }
#panel .hf-avatar { border-color: var(--hf-blood-bright) !important; background: #170912 !important; box-shadow: 0 0 0 3px rgba(169, 15, 37, .2), 0 0 18px rgba(239, 48, 68, .35) !important; }
#panel .hf-user-nav .panel_links a, #panel .hf-welcome-cp a { border-color: rgba(239, 48, 68, .3) !important; background: rgba(15, 7, 12, .72) !important; color: #ffb9a7 !important; }
.hf-notification-label { color: var(--hf-orange-soft) !important; }
.hf-bell-button { border-color: rgba(255, 129, 112, .7) !important; background: linear-gradient(135deg, rgba(114, 16, 33, .94), rgba(25, 8, 18, .98)) !important; color: #ffe2d8 !important; box-shadow: 0 0 0 3px rgba(169, 15, 37, .1), 0 0 13px rgba(239, 48, 68, .16) !important; }
.hf-bell-button:hover, .hf-bell-button[aria-expanded="true"] { border-color: #ffb2a3 !important; box-shadow: 0 0 18px rgba(239, 48, 68, .38) !important; }
.hf-bell-ping { background: var(--hf-blood-bright) !important; box-shadow: 0 0 9px var(--hf-blood-bright) !important; }
.hf-alert-rail { background-color: #0d080e !important; background-image: linear-gradient(90deg, rgba(169, 15, 37, .13), transparent 45%, rgba(142, 53, 189, .1)) !important; }
.hf-alert-rail > * { border-color: #762b39 !important; border-left-color: var(--hf-blood-bright) !important; background: linear-gradient(90deg, rgba(169, 15, 37, .2), rgba(55, 15, 42, .18)) !important; }

#content {
background:
radial-gradient(ellipse at 50% 0%, rgba(119, 20, 43, .22), transparent 48%),
radial-gradient(ellipse at 10% 80%, rgba(101, 22, 86, .15), transparent 35%),
repeating-linear-gradient(145deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 13px) !important;
}
#content table.tborder.hf-category,
#content .hf-category,
#content table.tborder.hf-category > tbody,
#content table.tborder.hf-category > tbody > tr.hf-forum-row,
#content table.tborder.hf-category > tbody > tr.hf-forum-row > td {
background-color: transparent !important;
background-image: none !important;
}
#content table.tborder.hf-category {
border: 1px solid rgba(169, 15, 37, .45) !important;
border-radius: 10px !important;
overflow: hidden !important;
box-shadow: 0 17px 45px rgba(0, 0, 0, .45), 0 0 0 1px rgba(215, 155, 234, .06) !important;
}
.hf-category > thead > tr > td.thead {
background:
linear-gradient(90deg, rgba(41, 9, 21, .98), rgba(51, 18, 42, .94) 52%, rgba(22, 8, 16, .98)),
repeating-linear-gradient(165deg, transparent 0 15px, rgba(255, 129, 112, .08) 16px, transparent 17px 34px) !important;
border-bottom-color: #9e3041 !important;
}
.hf-category > thead > tr > td.thead:after {
position: absolute;
left: 10%;
bottom: -1px;
width: 90px;
height: 13px;
border-radius: 0 0 50% 50%;
background: linear-gradient(#9e1028, #4c0818 72%, transparent) !important;
box-shadow: 175px 0 0 -3px #861024, 390px 0 0 -6px #a8172d, 610px 0 0 -2px #6d0a1d;
content: "";
opacity: .82;
animation: hf-blood-drip 5s ease-in-out infinite alternate;
pointer-events: none;
}
.hf-category-copy:before { color: var(--hf-blood-bright) !important; text-shadow: 0 0 8px rgba(239, 48, 68, .7) !important; }
.hf-category-copy strong a { color: #fff0ed !important; text-shadow: 0 0 9px rgba(239, 48, 68, .2) !important; }
.hf-category-copy .smalltext { color: #d4a9b2 !important; }
.hf-collapse-control { border-color: rgba(255, 129, 112, .58) !important; background: rgba(19, 5, 11, .78) !important; color: #ffb4a8 !important; }
.hf-collapse-control:after { color: #dc7fe9 !important; }
.hf-category > tbody { clip-path: inset(0 0 0 0); }
.hf-category > tbody.hf-is-collapsing { filter: blur(4px) saturate(1.5) !important; }
.hf-forum-row .hf-forum-cell {
background:
linear-gradient(90deg, rgba(9, 8, 13, .78), rgba(45, 9, 22, .48), rgba(9, 8, 13, .78)),
repeating-linear-gradient(165deg, transparent 0 27px, rgba(239, 48, 68, .035) 28px, transparent 30px 61px) !important;
}
.hf-forum-row .hf-forum-cell:before {
position: absolute;
top: 0;
right: 12%;
width: 1px;
height: 100%;
background: linear-gradient(transparent, rgba(239, 48, 68, .3), transparent);
content: "";
transform: rotate(12deg);
opacity: .6;
}
.hf-forum-row .hf-forum-cell:after { background: linear-gradient(90deg, transparent, rgba(239, 48, 68, .25), transparent) !important; }
.hf-forum-icon { color: #ff8170 !important; text-shadow: 0 0 8px rgba(239, 48, 68, .85), 0 0 16px rgba(142, 53, 189, .35) !important; }
.hf-forum-row:hover .hf-forum-icon { color: #fff0ed !important; filter: drop-shadow(0 0 7px #ef3044) !important; }
.hf-forum-description { color: #c4aeb7 !important; }
.hf-subforums { border-left-color: #9c283b !important; background: rgba(23, 7, 14, .35) !important; }
.hf-subforums__label { color: #ff8170 !important; }
.hf-subforum-status { color: #e26d7a !important; }
.hf-category .hf-forum-row > td:nth-child(3),
.hf-category .hf-forum-row > td:nth-child(4),
.hf-category .hf-forum-row > td:nth-child(5) {
background: transparent !important;
background-image: none !important;
}
.hf-category .hf-forum-row:hover > td:nth-child(3),
.hf-category .hf-forum-row:hover > td:nth-child(4),
.hf-category .hf-forum-row:hover > td:nth-child(5) { background: transparent !important; }

.hf-bell-menu {
background: linear-gradient(145deg, rgba(28, 7, 17, .995), rgba(8, 7, 11, .995)) !important;
border-color: #a03a4d !important;
box-shadow: 0 20px 55px rgba(0, 0, 0, .9), 0 0 24px rgba(239, 48, 68, .28) !important;
}
.hf-bell-menu:before { border-color: #a03a4d !important; background: #280b18 !important; }
.hf-bell-title, .hf-live-heading { color: #ff8170 !important; }
.hf-live-item a, .hf-bell-links li a { border-color: rgba(239, 48, 68, .26) !important; background: rgba(95, 12, 31, .2) !important; }
.hf-live-item a:hover, .hf-bell-links li a:hover { border-color: #ff8170 !important; background: rgba(169, 15, 37, .32) !important; }
.hf-live-item__glyph, .hf-bell-item__icon { color: #ff8170 !important; }
.hf-bell-divider { border-top-color: rgba(239, 48, 68, .28) !important; }

.hf-chat-launch {
border-color: #ff8170 !important;
background: radial-gradient(circle at 35% 25%, #a52b60, #240914 68%) !important;
box-shadow: 0 0 0 5px rgba(169, 15, 37, .12), 0 0 30px rgba(239, 48, 68, .5) !important;
}
.hf-chat-launch:after { background: #ef3044 !important; box-shadow: 0 0 10px #ef3044 !important; }
.hf-chat-widget { border-color: #a03a4d !important; background: #0e070d !important; box-shadow: 0 20px 60px rgba(0, 0, 0, .9), 0 0 28px rgba(239, 48, 68, .24) !important; }
.hf-chat-head { background: linear-gradient(90deg, rgba(79, 10, 28, .95), rgba(22, 7, 17, .98)) !important; border-bottom-color: #7b2a3a !important; }
.hf-chat-title small { color: #ff8170 !important; }
.hf-chat-log { background: rgba(5, 5, 8, .84) !important; }
.hf-chat-msg { border-color: rgba(215, 155, 234, .25) !important; background: rgba(48, 16, 41, .78) !important; }
.hf-chat-msg.is-user { border-color: rgba(255, 129, 112, .35) !important; background: rgba(91, 17, 30, .75) !important; }
.hf-chat-result { border-left-color: #ff8170 !important; border-color: rgba(239, 48, 68, .25) !important; background: rgba(36, 7, 16, .72) !important; }
.hf-chat-result:hover { background: rgba(169, 15, 37, .28) !important; }
.hf-chat-search-state { color: #ffb4a8 !important; }
.hf-pm-toast { border-color: #a03a4d !important; border-left-color: #ff8170 !important; background: linear-gradient(135deg, rgba(77, 10, 24, .99), rgba(18, 6, 14, .99)) !important; box-shadow: 0 18px 50px rgba(0, 0, 0, .9), 0 0 25px rgba(239, 48, 68, .32) !important; }
.hf-pm-toast__glyph { color: #ff8170 !important; }
.hf-guest-cta a { border-color: rgba(255, 129, 112, .5) !important; background: rgba(169, 15, 37, .18) !important; color: #ffd2c9 !important; }

#footer { background: #07060a !important; border-top-color: #5d1e31 !important; }
#footer .upper { background: linear-gradient(120deg, #0b070d, #260b18 48%, #09070c) !important; border-bottom-color: #3b1726 !important; }
#footer .lower { background: #040407 !important; }
.hf-footer-brand span, .hf-footer-heading { color: #ff8170 !important; }
.hf-footer-kicker, #copyright { color: #9f7f89 !important; }
.hf-footer-list a, #footer .bottom_links a { color: #d6b3bd !important; }

:root {
--hf-purple: #76263c;
--hf-purple-bright: #e3a0aa;
--hf-orange: #b31f38;
--hf-orange-soft: #f18a93;
}
a:link, a:visited { color: #e3a0aa !important; }
a:hover, a:active { color: #ffd2c9 !important; text-shadow: 0 0 10px rgba(239, 48, 68, .42) !important; }
.thead, #content td.thead {
background: linear-gradient(90deg, #4a0d1c, #2b0b16 52%, #190910) !important;
color: #fff0ed !important;
border-bottom-color: #8f263b !important;
}
.tcat, #content td.tcat {
background: linear-gradient(90deg, #291018, #3c1722) !important;
color: #f8dfe2 !important;
border-color: #57202e !important;
}
.trow1, tr.trow1 td { background-color: #120c12 !important; }
.trow2, tr.trow2 td { background-color: #1a1018 !important; }
.trow1:hover, .trow2:hover, tr.trow1:hover td, tr.trow2:hover td { background-color: #26121b !important; }
input.button, input[type="submit"], input[type="button"], button:not(.hf-chat-close):not(.hf-bell-button):not(.hf-ritual-toggle), .button {
border-color: #f18a93 !important;
background: linear-gradient(#d43b54, #84142b) !important;
color: #fff0ed !important;
box-shadow: 0 3px 0 #4b0c1c, 0 0 10px rgba(239, 48, 68, .14) !important;
}
input.button:hover, input[type="submit"]:hover, input[type="button"]:hover, button:not(.hf-chat-close):not(.hf-bell-button):not(.hf-ritual-toggle):hover, .button:hover {
background: linear-gradient(#ef5d70, #a91d38) !important;
}
input.textbox, textarea, select {
background: #0b080d !important;
border-color: #642336 !important;
color: #f3dfe2 !important;
}
input.textbox:focus, textarea:focus, select:focus {
outline-color: rgba(239, 48, 68, .28) !important;
border-color: #d43b54 !important;
}
#content .sceditor-container {
border-color: #642336 !important;
background: #0b080d !important;
box-shadow: 0 0 0 1px rgba(239, 48, 68, .08), 0 8px 20px rgba(0, 0, 0, .25);
}
#content .sceditor-toolbar {
border-bottom-color: #642336 !important;
background: linear-gradient(90deg, #3b101d, #1b0a12) !important;
}
#content .sceditor-group {
border-color: #642336 !important;
background: #291018 !important;
}
#content .sceditor-button { border-color: transparent !important; filter: saturate(.72) sepia(.16); }
#content .sceditor-button:hover, #content .sceditor-button.active {
border-color: #a91d38 !important;
background: #65152a !important;
}
#content .sceditor-container iframe, #content .sceditor-container textarea {
background: #0d090f !important;
color: #f3dfe2 !important;
}
#content .codebuttons, #content .messageEditor {
border-color: #642336 !important;
background: #140b12 !important;
color: #e9cbd0 !important;
}
#content .postbit, #content fieldset {
border-color: #4a1b2a !important;
}
#header ul.menu.top_links li a,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab {
border-color: rgba(241, 138, 147, .4) !important;
background: linear-gradient(180deg, #3b101d, #10070d) !important;
color: #ffe8ea !important;
}
#header ul.menu.top_links li a:hover { border-color: #ffb4a8 !important; background: #65152a !important; }
#panel .hf-user-nav .panel_links a {
border-color: rgba(241, 138, 147, .35) !important;
background: rgba(86, 13, 31, .38) !important;
color: #f6d9dd !important;
}
#panel .hf-user-nav .panel_links a:hover { border-color: #ffb4a8 !important; background: rgba(169, 15, 37, .4) !important; }
#panel .hf-user-nav .panel_links a:before { color: #ff8170 !important; }
#panel .hf-notification-label, .hf-bell-title, .hf-live-heading { color: #ff8170 !important; }
.hf-alert-rail {
background-image: linear-gradient(90deg, rgba(169, 15, 37, .18), transparent 50%, rgba(169, 15, 37, .08)) !important;
}
.hf-alert-rail > * {
border-color: #642336 !important;
border-left-color: #ef3044 !important;
background: linear-gradient(90deg, rgba(169, 15, 37, .22), rgba(45, 8, 17, .25)) !important;
}

#header { position: relative !important; z-index: 10 !important; }
#content { position: relative !important; z-index: 1 !important; }
#panel, #panel .upper, #panel .upper .wrapper, .hf-user-nav, .hf-notification-dock, .hf-bell-wrap { overflow: visible !important; }
#header .hf-bell-menu { z-index: 100000 !important; }

#panel .hf-user-nav {
align-items: center !important;
}
#panel .hf-user-nav > .panel_links {
display: flex !important;
align-items: center !important;
flex: 1 1 auto;
flex-wrap: wrap !important;
gap: 6px !important;
}
#panel .hf-user-nav > .panel_links li { display: block; }
#panel .hf-notification-dock { flex: 0 0 auto; }

#logo {
min-height: 188px !important;
background:
linear-gradient(115deg, rgba(6, 5, 10, .97), rgba(50, 8, 27, .82) 48%, rgba(9, 6, 14, .98)),
repeating-linear-gradient(165deg, transparent 0 24px, rgba(239, 48, 68, .07) 25px, transparent 26px 51px) !important;
border-bottom: 1px solid #7c263d !important;
box-shadow: inset 0 -48px 74px rgba(0, 0, 0, .7), 0 9px 28px rgba(0, 0, 0, .5) !important;
}
#logo .wrapper { min-height: 188px !important; }
#logo:before {
width: 430px !important;
height: 310px !important;
opacity: .32 !important;
background:
linear-gradient(24deg, transparent 49.5%, #ef3044 50%, transparent 50.7%),
linear-gradient(67deg, transparent 49.5%, #f18a93 50%, transparent 50.7%),
linear-gradient(112deg, transparent 49.5%, #ef3044 50%, transparent 50.7%),
radial-gradient(ellipse at 100% 0, transparent 28%, #ef3044 28.4%, transparent 29%, transparent 40%, #f18a93 40.4%, transparent 41%, transparent 52%, #ef3044 52.4%, transparent 53%) !important;
}
.hf-brand { padding-top: 38px !important; }
.hf-brand__eyebrow { color: #ff8170 !important; text-shadow: 0 0 10px rgba(239, 48, 68, .5); }
.hf-brand__name {
font-size: clamp(36px, 5vw, 54px) !important;
letter-spacing: -.085em !important;
text-shadow: 0 0 20px rgba(239, 48, 68, .2), 0 4px 18px #000 !important;
}
.hf-brand__name span { color: #ef3044 !important; }
.hf-brand__tagline {
color: #d4a9b2 !important;
letter-spacing: .2em !important;
}
.hf-header-console { top: 35px !important; }
#logo:after {
background: #ef3044 !important;
box-shadow: 0 0 28px 8px rgba(239, 48, 68, .28), 0 0 90px 28px rgba(169, 15, 37, .14) !important;
}
.hf-tab-bolt, .hf-console-pill strong, .hf-console-pill em, #panel .hf-notification-dock .user_links a:before {
color: #ff8170 !important;
}

.hf-forum-icon {
position: relative !important;
width: 38px !important;
height: 38px !important;
flex: 0 0 38px !important;
border: 1px solid rgba(255, 129, 112, .7);
border-radius: 9px;
background: linear-gradient(145deg, rgba(169, 15, 37, .5), rgba(28, 7, 17, .86)) !important;
box-shadow: inset 0 0 0 3px rgba(239, 48, 68, .08), 0 0 12px rgba(239, 48, 68, .2);
transform: rotate(45deg) !important;
}
.hf-forum-icon:before {
position: absolute;
inset: 5px;
border: 1px dashed rgba(255, 129, 112, .58);
border-radius: 5px;
content: "";
}
.hf-forum-icon:after {
position: absolute;
right: -3px;
bottom: -3px;
width: 7px;
height: 7px;
border-radius: 50%;
background: #ef3044;
box-shadow: 0 0 9px #ef3044;
content: "";
}
.hf-forum-icon__core {
position: relative;
z-index: 1;
color: #ffd2c9 !important;
font-size: 17px !important;
text-shadow: 0 0 8px #ef3044 !important;
transform: rotate(-45deg) !important;
}
.hf-forum-row:hover .hf-forum-icon {
border-color: #ffb4a8 !important;
box-shadow: inset 0 0 0 3px rgba(239, 48, 68, .16), 0 0 19px rgba(239, 48, 68, .5) !important;
transform: rotate(45deg) scale(1.1) !important;
}
.hf-collapse-control:after, .hf-chat-close { color: #ffb4a8 !important; }

.hf-boardstats {
margin-top: 18px !important;
border: 1px solid #5d1e31 !important;
border-radius: 8px;
background: #0e070d !important;
box-shadow: 0 10px 28px rgba(0, 0, 0, .35), 0 0 18px rgba(239, 48, 68, .08);
overflow: hidden;
}
.hf-boardstats > tbody > tr > td { border-color: rgba(239, 48, 68, .18) !important; }
.hf-boardstats .thead {
padding: 12px 15px !important;
background:
linear-gradient(90deg, rgba(79, 10, 28, .98), rgba(36, 8, 28, .9)),
repeating-linear-gradient(165deg, transparent 0 18px, rgba(255, 129, 112, .08) 19px, transparent 20px 38px) !important;
}
.hf-stats-heading {
display: flex;
align-items: center;
gap: 11px;
}
.hf-stats-heading__sigil {
display: inline-flex;
width: 34px;
height: 34px;
align-items: center;
justify-content: center;
border: 1px solid #ff8170;
border-radius: 8px;
background: rgba(239, 48, 68, .18);
color: #ffd2c9;
font-size: 18px;
transform: rotate(45deg);
}
.hf-stats-heading__sigil > span { transform: rotate(-45deg); }
.hf-stats-heading > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.hf-stats-heading strong { color: #fff0ed; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.hf-stats-heading small { color: #d4a9b2; font-size: 10px; font-weight: normal; }
.hf-stat-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 8px;
}
.hf-stat-card {
display: flex;
min-height: 54px;
align-items: center;
gap: 8px;
padding: 9px 10px;
border: 1px solid rgba(239, 48, 68, .2);
border-radius: 6px;
background: linear-gradient(145deg, rgba(95, 12, 31, .22), rgba(21, 6, 15, .75));
color: #d9c0c8;
font-size: 10px;
line-height: 1.35;
}
.hf-stat-card:hover { border-color: rgba(255, 129, 112, .65); background: rgba(169, 15, 37, .23); }
.hf-stat-card__icon {
display: inline-flex;
width: 25px;
height: 25px;
flex: 0 0 25px;
align-items: center;
justify-content: center;
border: 1px solid rgba(255, 129, 112, .48);
border-radius: 50%;
color: #ff8170;
font-size: 13px;
box-shadow: 0 0 8px rgba(239, 48, 68, .16);
}

#container .wrapper, .wrapper {
width: calc(100% - 40px) !important;
max-width: 1400px !important;
}
#content {
font-size: 16px !important;
}
#content table {
font-size: 16px !important;
}
#content .smalltext {
font-size: 13px !important;
}
#content input, #content textarea, #content select, #content button {
font-size: 14px !important;
}
#content .trow1, #content .trow2, #content .trow_shaded {
padding-top: 11px !important;
padding-bottom: 11px !important;
}
input.button, input[type="submit"], input[type="button"], button:not(.hf-chat-close), .button {
min-height: 40px !important;
padding: 10px 18px !important;
border-radius: 8px !important;
font-size: 15px !important;
line-height: 1.15 !important;
}
#header ul.menu.top_links li a,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab {
min-height: 40px !important;
padding: 10px 16px !important;
font-size: 13px !important;
}
#panel .hf-user-nav .panel_links a {
min-height: 38px !important;
padding: 9px 14px !important;
font-size: 13px !important;
}
.hf-bell-button {
min-height: 40px !important;
padding: 9px 17px !important;
font-size: 13px !important;
}
.hf-collapse-control {
min-height: 38px !important;
padding: 9px 16px !important;
font-size: 13px !important;
}
.hf-chat-launch {
width: 72px !important;
height: 72px !important;
font-size: 30px !important;
}
.hf-chat-send {
min-height: 38px !important;
padding: 9px 15px !important;
}
.hf-category .hf-forum-row:hover > td,
.hf-category .hf-forum-row:hover > td:nth-child(1),
.hf-category .hf-forum-row:hover > td:nth-child(2),
.hf-category .hf-forum-row:hover > td:nth-child(3),
.hf-category .hf-forum-row:hover > td:nth-child(4),
.hf-category .hf-forum-row:hover > td:nth-child(5) {
background:
linear-gradient(90deg, rgba(104, 13, 33, .78), rgba(57, 10, 25, .88) 58%, rgba(32, 8, 17, .94)) !important;
background-image:
linear-gradient(90deg, rgba(104, 13, 33, .78), rgba(57, 10, 25, .88) 58%, rgba(32, 8, 17, .94)),
repeating-linear-gradient(165deg, transparent 0 27px, rgba(255, 129, 112, .055) 28px, transparent 30px 61px) !important;
}
.hf-category .hf-forum-row:hover > td:first-child {
box-shadow: inset 3px 0 0 #ef3044 !important;
}
.hf-subforums {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.hf-subforum {
border: 0 !important;
}
#logo {
background-image:
linear-gradient(115deg, rgba(7, 4, 12, .78), rgba(47, 8, 34, .32) 48%, rgba(5, 5, 11, .8)),
url(../../../images/forge-holographic-header.png),
repeating-linear-gradient(0deg, transparent 0 5px, rgba(255, 129, 212, .055) 6px, transparent 7px) !important;
background-position: center, center, center !important;
background-size: cover, cover, 100% 7px !important;
background-blend-mode: normal, screen, overlay !important;
animation: none !important;
}
#logo:before {
inset: 0 !important;
width: auto !important;
height: auto !important;
opacity: .42 !important;
background:
linear-gradient(110deg, transparent 0 34%, rgba(255, 129, 212, .18) 49%, transparent 64%),
linear-gradient(90deg, transparent, rgba(111, 246, 255, .08), transparent) !important;
transform: none !important;
animation: none !important;
}
#logo:after,
#logo .hf-sky {
display: none !important;
}
#logo .hf-brand,
#logo .hf-brand__sigil,
#logo .hf-header-console,
#logo .hf-console-dot,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab:before,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab:after {
animation: none !important;
}
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab:after {
opacity: .08 !important;
transform: none !important;
}
.hf-tab-bolt {
animation: none !important;
opacity: 0 !important;
}
.hf-collapse-control {
width: 34px !important;
height: 34px !important;
justify-content: center !important;
padding: 0 !important;
font-size: 0 !important;
letter-spacing: 0 !important;
}
.hf-collapse-control > span:first-child {
position: absolute !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
white-space: nowrap !important;
}
.hf-collapse-control:after {
content: "⌄" !important;
font-size: 22px !important;
line-height: 1 !important;
}
.hf-collapse-control[aria-expanded="false"]:after {
content: "⌃" !important;
}
#footer {
background:
linear-gradient(120deg, rgba(5, 4, 9, .9), rgba(43, 9, 31, .48), rgba(3, 4, 8, .92)),
url(../../../images/forge-holographic-footer.png) center / cover no-repeat !important;
}
#footer:before {
animation: none !important;
background: linear-gradient(90deg, transparent, rgba(255, 129, 212, .16), transparent);
color: rgba(255, 129, 212, .58) !important;
}
#footer .upper {
background:
linear-gradient(120deg, rgba(7, 4, 12, .86), rgba(45, 9, 32, .5), rgba(5, 4, 10, .9)),
url(../../../images/forge-holographic-footer.png) center 42% / cover no-repeat !important;
background-blend-mode: normal, screen !important;
animation: none !important;
}
#footer .lower {
background:
linear-gradient(90deg, rgba(4, 4, 8, .94), rgba(32, 7, 24, .76), rgba(4, 4, 8, .94)),
url(../../../images/forge-holographic-footer.png) center 78% / cover no-repeat !important;
}
.hf-category-tools {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 8px !important;
min-width: 0 !important;
}
.hf-category-copy {
flex: 1 1 auto !important;
}
.hf-social-share {
display: flex !important;
align-items: center !important;
gap: 4px !important;
min-width: 0 !important;
}
.hf-social-share__label {
margin-right: 2px !important;
color: #d7aeb7 !important;
font-size: 9px !important;
font-weight: bold !important;
letter-spacing: .12em !important;
text-transform: uppercase !important;
}
.hf-social-share__link,
.hf-social-share__copy {
display: inline-flex !important;
width: 25px !important;
height: 25px !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
border: 1px solid rgba(255, 129, 112, .42) !important;
border-radius: 5px !important;
background: rgba(10, 6, 10, .72) !important;
color: #ffd2c9 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-decoration: none !important;
text-shadow: 0 0 8px rgba(239, 48, 68, .35) !important;
}
.hf-social-share__link:hover,
.hf-social-share__copy:hover {
border-color: #ffb4a8 !important;
background: #5b1428 !important;
color: #fff0ed !important;
}
.hf-collapse-control:after {
content: "" !important;
display: block !important;
width: 23px !important;
height: 23px !important;
background: url(../../../images/forge-collapse-icon.svg) center / contain no-repeat !important;
font-size: 0 !important;
transform: none !important;
}
.hf-collapse-control[aria-expanded="false"]:after {
transform: rotate(180deg) !important;
}
#content table.tborder.hf-category,
#content table.tborder.hf-category > tbody,
#content table.tborder.hf-category > tbody > tr.hf-forum-row,
#content table.tborder.hf-category > tbody > tr.hf-forum-row > td {
background-color: #160b13 !important;
background-image: none !important;
}
#content .hf-category > thead > tr > td.thead {
background: #3a101f !important;
background-image: none !important;
border-bottom-color: #702238 !important;
}
#content .hf-category > thead > tr > td.thead:after {
display: none !important;
}
#content .hf-category > tbody > tr:first-child > td.tcat {
background: #2b0f1a !important;
background-image: none !important;
border-color: #4d1b2a !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td {
background: #160b13 !important;
background-image: none !important;
border-bottom-color: #2d1520 !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td.hf-forum-cell {
background: #160b13 !important;
background-image: none !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(3),
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(4),
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(5) {
background: rgba(0, 0, 0, .42) !important;
background-image: none !important;
box-shadow: inset 1px 0 0 rgba(255, 129, 112, .07) !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(3),
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(4) {
color: #ffe4e3 !important;
font-weight: 800 !important;
letter-spacing: .04em !important;
text-shadow: 0 0 8px rgba(239, 48, 68, .22) !important;
}
#content .hf-category > tbody > tr.hf-forum-row:hover > td,
#content .hf-category > tbody > tr.hf-forum-row:hover > td.hf-forum-cell,
#content .hf-category > tbody > tr.hf-forum-row:hover > td:nth-child(3),
#content .hf-category > tbody > tr.hf-forum-row:hover > td:nth-child(4),
#content .hf-category > tbody > tr.hf-forum-row:hover > td:nth-child(5) {
background: #28101c !important;
background-image: none !important;
}
.hf-forum-row .hf-forum-cell:after {
display: none !important;
}
.hf-forum-heading > .hf-forum-icon {
order: 0 !important;
}
.hf-forum-heading > strong {
order: 1 !important;
}

@keyframes hf-ink-breathe { 0% { transform: scale(1); opacity: .25; } 100% { transform: scale(1.04); opacity: .48; } }
@keyframes hf-ash-drift { 0% { transform: translate3d(0, -2%, 0); } 100% { transform: translate3d(1%, 5%, 0); } }
@keyframes hf-blood-veins { 0%, 100% { transform: translateX(0) scaleX(1); } 50% { transform: translateX(-12px) scaleX(1.06); } }
@keyframes hf-blood-drip { 0%, 100% { transform: scaleY(.86); opacity: .66; } 50% { transform: scaleY(1.25); opacity: .95; } }
@media (max-width: 700px) {
#logo { min-height: 215px !important; }
#logo .wrapper { min-height: 215px !important; }
.hf-user-nav { align-items: flex-start !important; }
#panel .hf-user-nav > .panel_links { flex-basis: 100%; }
.hf-notification-dock { flex-basis: 100% !important; }
.hf-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hf-bell-menu { position: fixed !important; top: 104px !important; right: 12px !important; left: 12px !important; width: auto !important; max-height: calc(100vh - 124px) !important; }
.hf-bell-scroll { max-height: 36vh !important; }
.hf-pm-toast { right: 14px; bottom: 14px; }
#logo {
min-height: 0 !important;
padding-bottom: 10px !important;
}
#logo .wrapper {
min-height: 0 !important;
}
#logo:after {
right: 6% !important;
top: 12px !important;
width: 34px !important;
height: 34px !important;
}
.hf-brand {
padding: 15px 0 8px 30px !important;
}
.hf-brand__name {
font-size: 25px !important;
}
.hf-brand__tagline {
font-size: 7px !important;
letter-spacing: .1em !important;
}
.hf-brand__sigil {
left: 0 !important;
top: 15px !important;
font-size: 23px !important;
}
.hf-header-console {
position: relative !important;
top: auto !important;
right: auto !important;
justify-content: flex-start !important;
gap: 4px !important;
padding: 0 0 5px 30px !important;
max-width: 100% !important;
font-size: 7px !important;
letter-spacing: .06em !important;
}
.hf-console-pill,
.hf-ritual-toggle {
padding: 4px 5px !important;
}
#header ul.menu.top_links {
position: relative !important;
right: auto !important;
bottom: auto !important;
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 4px !important;
width: 100% !important;
margin-top: 3px !important;
}
#header ul.menu.top_links li,
#header ul.menu.top_links li a {
min-width: 0 !important;
width: 100% !important;
}
#header ul.menu.top_links li a,
#header ul.menu.top_links.hf-top-tabs li a.hf-storm-tab {
min-height: 32px !important;
padding: 7px 3px !important;
font-size: 9px !important;
letter-spacing: .01em !important;
}
#header ul.menu.top_links .hf-tab-label {
white-space: nowrap !important;
}
#panel .upper .wrapper {
width: calc(100% - 16px) !important;
padding-top: 7px !important;
padding-bottom: 7px !important;
}
#panel .hf-welcome-line {
align-items: center !important;
gap: 6px !important;
}
#panel .hf-welcome-copy {
min-width: 0 !important;
overflow: hidden !important;
}
#panel .hf-welcome,
#panel .hf-visit-note {
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
#panel .hf-user-nav {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 6px !important;
padding-bottom: 4px !important;
}
#panel .hf-user-nav > .panel_links {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 4px !important;
width: 100% !important;
}
#panel .hf-user-nav > .panel_links li,
#panel .hf-user-nav > .panel_links a {
min-width: 0 !important;
width: 100% !important;
}
#panel .hf-user-nav .panel_links a {
justify-content: center !important;
min-height: 34px !important;
padding: 7px 3px !important;
font-size: 10px !important;
white-space: nowrap !important;
}
#panel .hf-notification-dock {
display: grid !important;
grid-template-columns: auto minmax(0, 1fr) !important;
gap: 5px !important;
width: 100% !important;
}
#panel .hf-notification-label {
font-size: 8px !important;
white-space: nowrap !important;
}
#panel .hf-bell-wrap,
#panel .hf-bell-button {
min-width: 0 !important;
width: 100% !important;
}
.hf-bell-button {
justify-content: center !important;
min-height: 34px !important;
padding: 7px 6px !important;
font-size: 10px !important;
}
#content > .wrapper {
width: calc(100% - 16px) !important;
padding-top: 10px !important;
}
#content .hf-forum-description {
display: none !important;
}
#content .hf-subforums {
margin-top: 5px !important;
padding: 3px 0 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
#content .hf-subforums__label {
margin-bottom: 3px !important;
font-size: 9px !important;
}
#content .hf-subforum {
padding: 2px 0 !important;
border: 0 !important;
}
#content .hf-category > thead > tr > td.thead {
padding: 8px 8px !important;
}
#content .hf-category-bar {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto !important;
gap: 5px !important;
align-items: center !important;
}
#content .hf-category-copy {
min-width: 0 !important;
gap: 5px !important;
}
#content .hf-category-copy:before {
font-size: 15px !important;
}
#content .hf-category-copy strong {
font-size: 12px !important;
}
#content .hf-category-copy .smalltext {
display: none !important;
}
#content .hf-collapse-control {
min-height: 30px !important;
padding: 6px 7px !important;
font-size: 8px !important;
letter-spacing: .04em !important;
white-space: nowrap !important;
}
#content .hf-category > tbody > tr.hf-forum-row {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(3),
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(4),
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(5) {
min-width: 0 !important;
padding: 6px 3px !important;
font-size: 11px !important;
line-height: 1.25 !important;
overflow: hidden !important;
white-space: normal !important;
overflow-wrap: anywhere !important;
word-break: break-word !important;
}
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(3):before,
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(4):before,
#content .hf-category > tbody > tr.hf-forum-row > td:nth-child(5):before {
display: block !important;
font-size: 8px !important;
line-height: 1.1 !important;
}
.hf-chat-launch {
right: 8px !important;
bottom: 8px !important;
width: 52px !important;
height: 52px !important;
font-size: 22px !important;
}
.hf-chat-widget {
right: 8px !important;
bottom: 68px !important;
left: 8px !important;
width: auto !important;
max-width: none !important;
}
#content .hf-category-bar {
grid-template-columns: 1fr !important;
}
#content .hf-category-tools {
align-items: stretch !important;
gap: 5px !important;
width: 100% !important;
}
#content .hf-social-share {
justify-content: flex-end !important;
width: 100% !important;
}
#content .hf-social-share__label {
display: none !important;
}
#content .hf-social-share__link,
#content .hf-social-share__copy {
width: 22px !important;
height: 22px !important;
font-size: 10px !important;
}
#content .hf-collapse-control {
align-self: flex-end !important;
}
}

/* Forge commerce navigation and storefront */
.hf-forge-nav {
display: flex;
align-items: stretch;
gap: 6px;
margin: 0 0 18px;
padding: 6px;
border: 1px solid rgba(239, 48, 68, .34);
border-radius: 15px;
background: linear-gradient(135deg, rgba(25, 12, 20, .98), rgba(12, 10, 15, .98));
box-shadow: 0 10px 24px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 129, 112, .08);
}
.hf-forge-nav__tab {
display: inline-flex;
flex: 1 1 0;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 42px;
padding: 8px 15px;
border: 1px solid rgba(255, 129, 112, .18);
border-radius: 10px;
background: rgba(9, 8, 12, .74);
color: #f4ddd3 !important;
font-size: 11px;
font-weight: 800;
letter-spacing: .12em;
text-decoration: none !important;
text-transform: uppercase;
transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.hf-forge-nav__tab:hover,
.hf-forge-nav__tab:focus-visible {
border-color: #ff8170;
background: linear-gradient(180deg, rgba(117, 20, 39, .84), rgba(38, 12, 23, .95));
box-shadow: 0 0 18px rgba(239, 48, 68, .2);
color: #fff !important;
transform: translateY(-1px);
outline: none;
}
.hf-forge-nav__tab:first-child {
border-radius: 11px 7px 7px 11px;
}
.hf-forge-nav__tab:last-child {
border-radius: 7px 11px 11px 7px;
}
.hf-forge-nav__icon {
color: #ff8170;
font-size: 16px;
line-height: 1;
text-shadow: 0 0 8px rgba(239, 48, 68, .55);
}
.hf-store-shell {
margin: 0 0 28px;
}
.hf-store-hero,
.hf-store-card,
.hf-store-thread,
.hf-store-checkout {
border: 1px solid rgba(239, 48, 68, .25);
border-radius: 14px;
background: linear-gradient(145deg, rgba(31, 14, 23, .98), rgba(12, 10, 15, .98));
box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}
.hf-store-hero {
margin-bottom: 14px;
padding: 22px 24px;
}
.hf-store-kicker {
margin: 0 0 7px;
color: #ff8170;
font-size: 10px;
font-weight: 800;
letter-spacing: .2em;
text-transform: uppercase;
}
.hf-store-title {
margin: 0;
color: #f4ddd3;
font-size: 29px;
line-height: 1.12;
}
.hf-store-intro {
max-width: 680px;
margin: 9px 0 0;
color: #b8a9b0;
}
.hf-store-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
gap: 14px;
}
.hf-store-card {
display: flex;
flex-direction: column;
min-width: 0;
padding: 18px;
}
.hf-store-card__top {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
}
.hf-store-card h2,
.hf-store-checkout h1 {
margin: 0;
color: #f4ddd3;
font-size: 20px;
line-height: 1.2;
}
.hf-store-price {
flex: 0 0 auto;
padding: 5px 9px;
border: 1px solid rgba(255, 129, 112, .4);
border-radius: 999px;
color: #ffb3a4;
font-size: 15px;
font-weight: 800;
}
.hf-store-card__description {
margin: 13px 0;
color: #b8a9b0;
white-space: pre-line;
}
.hf-store-thread {
margin-top: auto;
padding: 12px;
background: rgba(9, 8, 12, .64);
}
.hf-store-thread__label {
display: block;
margin-bottom: 5px;
color: #ff8170;
font-size: 9px;
font-weight: 800;
letter-spacing: .15em;
text-transform: uppercase;
}
.hf-store-thread__excerpt {
margin: 7px 0 0;
color: #9f919a;
font-size: 12px;
}
.hf-store-actions {
display: flex;
align-items: center;
gap: 9px;
margin-top: 15px;
}
.hf-store-button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 38px;
padding: 8px 14px;
border: 1px solid #ef3044;
border-radius: 9px;
background: linear-gradient(180deg, #a90f25, #5e0d1d);
color: #fff4ef !important;
font-size: 11px;
font-weight: 800;
letter-spacing: .08em;
text-decoration: none !important;
text-transform: uppercase;
cursor: pointer;
}
.hf-store-button:hover,
.hf-store-button:focus-visible {
border-color: #ff8170;
background: linear-gradient(180deg, #d9362f, #7d1424);
color: #fff !important;
box-shadow: 0 0 17px rgba(239, 48, 68, .28);
outline: none;
}
.hf-store-button--quiet {
border-color: rgba(255, 129, 112, .26);
background: rgba(9, 8, 12, .6);
color: #d7c6cc !important;
}
.hf-store-note {
margin: 10px 0 0;
color: #8f8089;
font-size: 11px;
}
.hf-store-checkout {
max-width: 760px;
margin: 0 auto 28px;
padding: 24px;
}
.hf-store-checkout__meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin: 14px 0;
padding: 12px 0;
border-top: 1px solid rgba(255, 129, 112, .16);
border-bottom: 1px solid rgba(255, 129, 112, .16);
}
.hf-store-checkout__attachment {
color: #b8a9b0;
font-size: 12px;
}
.hf-store-empty,
.hf-store-alert {
padding: 17px;
border-radius: 10px;
background: rgba(9, 8, 12, .72);
color: #b8a9b0;
}
.hf-store-alert {
border: 1px solid rgba(255, 129, 112, .42);
color: #ffb3a4;
}
@media (max-width: 560px) {
.hf-forge-nav {
gap: 4px;
padding: 4px;
}
.hf-forge-nav__tab {
gap: 4px;
padding: 8px 4px;
font-size: 9px;
letter-spacing: .04em;
}
.hf-forge-nav__icon {
font-size: 14px;
}
.hf-store-hero,
.hf-store-checkout {
padding: 18px 15px;
}
.hf-store-title {
font-size: 24px;
}
.hf-store-checkout__meta {
align-items: flex-start;
flex-direction: column;
}
}