/* THE OUTPOST — JORNADA V2.0.1 */
.top-journey,
.top-journey-tools,
.top-comment-reactions,
.top-journey-toast,
.top-journey * ,
.top-journey-tools * ,
.top-comment-reactions * {
    box-sizing: border-box;
}

.top-journey {
    --tj-orange: var(--tm-accent, #ff7900);
    --tj-gold: #ffb300;
    scroll-margin-top: 110px;
    overflow: hidden;
}

.top-journey-level {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr) minmax(210px, .42fr);
    gap: 18px;
    margin-top: 22px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 12px;
    background:
        radial-gradient(circle at 10% 0, rgba(255,121,0,.16), transparent 34%),
        linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
}

.top-journey-level__number {
    display: flex;
    min-height: 138px;
    padding: 18px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: 1px solid rgba(255,174,0,.23);
    border-radius: 10px;
    background: rgba(0,0,0,.4);
    text-align: center;
}

.top-journey-level__number small,
.top-journey-level__number span,
.top-journey-next small,
.top-journey-next span,
.top-journey-level__progress small {
    color: rgba(255,255,255,.53);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.top-journey-level__number strong {
    display: block;
    margin: 2px 0 5px;
    color: #fff;
    font-size: 58px;
    line-height: 1;
    letter-spacing: -.055em;
}

.top-journey-level__number span {
    color: var(--tj-gold);
}

.top-journey-level__progress {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.top-journey-level__progress > div:first-child {
    display: flex;
    margin-bottom: 12px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
}

.top-journey-level__progress strong {
    color: #fff;
    font-size: 18px;
}

.top-journey-level__progress span {
    color: rgba(255,255,255,.58);
    font-size: 12px;
}

.top-journey-bar {
    position: relative;
    display: block;
    width: 100%;
    height: 14px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(0,0,0,.72));
    box-shadow: inset 0 1px 3px rgba(0,0,0,.85);
}

.top-journey-bar i {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 2px;
    display: block;
    min-width: 0;
    max-width: calc(100% - 4px);
    border-radius: 999px;
    background: linear-gradient(90deg, #f25c00 0%, #ff7900 45%, var(--tj-gold, #ffb300) 100%);
    box-shadow: 0 0 16px rgba(255,121,0,.48), inset 0 1px 0 rgba(255,255,255,.28);
    transition: width .55s ease;
}

.top-journey-bar i:after {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: repeating-linear-gradient(135deg, rgba(255,255,255,.16) 0 8px, rgba(255,255,255,0) 8px 16px);
    content: "";
}

.top-journey-level__progress > small {
    display: block;
    margin-top: 9px;
}

.top-journey-next {
    display: flex;
    min-height: 138px;
    padding: 18px;
    justify-content: center;
    flex-direction: column;
    border-left: 1px solid rgba(255,255,255,.09);
}

.top-journey-next strong {
    display: block;
    margin: 7px 0 8px;
    color: #fff;
    font-size: 17px;
    line-height: 1.25;
}

.top-journey-next span {
    line-height: 1.55;
    text-transform: none;
}

.top-journey-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
    gap: 18px;
    margin-top: 18px;
}

.top-journey-columns > section,
.top-journey-collection,
.top-journey-history {
    padding: 20px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 11px;
    background: rgba(255,255,255,.018);
    scroll-margin-top: 110px;
}

.top-journey-columns > section > header,
.top-journey-collection > header,
.top-journey-history > header {
    display: flex;
    margin-bottom: 15px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.top-journey-columns header small,
.top-journey-collection header small,
.top-journey-history header small {
    display: block;
    margin-bottom: 5px;
    color: var(--tj-orange);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.top-journey-columns h3,
.top-journey-collection h3,
.top-journey-history h3 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 20px !important;
    line-height: 1.15 !important;
}

.top-journey-columns header button {
    padding: 8px 11px;
    color: rgba(255,255,255,.68);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 7px;
    background: rgba(255,255,255,.03);
    cursor: pointer;
    font-size: 10px;
    font-weight: 800;
}

.top-journey-missions {
    display: grid;
    gap: 9px;
}

.top-journey-missions article {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 15px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 9px;
    background: rgba(0,0,0,.25);
}

.top-journey-missions article.is-complete {
    opacity: .68;
}

.top-journey-missions article.is-complete:after {
    position: absolute;
    width: 5px;
    inset: 0 auto 0 0;
    background: #33bb71;
    content: "";
}

.top-journey-missions article > div:first-child small {
    color: var(--tj-orange);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.top-journey-missions h4 {
    margin: 4px 0 4px !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
}

.top-journey-missions p {
    margin: 0 !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
}

.top-mission-progress {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.top-mission-progress > span {
    position: relative;
    display: block;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.top-mission-progress i {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #ff6500, #ffb300);
}

.top-mission-progress small {
    margin-top: 7px;
    color: rgba(255,255,255,.52);
    font-size: 9px;
    font-weight: 800;
    text-align: right;
}

.top-journey-missions article > b {
    position: absolute;
    right: 10px;
    top: 8px;
    padding: 3px 6px;
    color: #68db99;
    border: 1px solid rgba(72,205,130,.24);
    border-radius: 999px;
    background: rgba(32,148,84,.1);
    font-size: 7px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.top-journey-notifications {
    display: grid;
    max-height: 430px;
    overflow: auto;
    gap: 7px;
    padding-right: 3px;
}

.top-journey-notifications a {
    position: relative;
    display: grid;
    grid-template-columns: 7px minmax(0,1fr);
    gap: 10px;
    padding: 12px;
    color: inherit !important;
    border: 1px solid rgba(255,255,255,.065);
    border-radius: 8px;
    background: rgba(0,0,0,.22);
    text-decoration: none !important;
}

.top-journey-notifications a.is-unread {
    border-color: rgba(255,121,0,.25);
    background: rgba(255,121,0,.055);
}

.top-journey-notifications a > i {
    width: 6px;
    height: 6px;
    margin-top: 5px;
    border-radius: 50%;
    background: rgba(255,255,255,.17);
}

.top-journey-notifications a.is-unread > i {
    background: var(--tj-orange);
    box-shadow: 0 0 12px rgba(255,121,0,.5);
}

.top-journey-notifications strong {
    display: block;
    color: #fff;
    font-size: 12px;
}

.top-journey-notifications p {
    margin: 3px 0 !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
}

.top-journey-notifications small {
    color: rgba(255,255,255,.34);
    font-size: 8px;
}

.top-journey-collection,
.top-journey-history {
    margin-top: 18px;
}

.top-journey-collection > header > strong {
    color: var(--tj-gold);
    font-size: 12px;
}

.top-journey-collection__grid {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
}

.top-journey-collection__grid article {
    min-height: 82px;
    padding: 13px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 8px;
    background: rgba(0,0,0,.27);
}

.top-journey-collection__grid strong {
    display: block;
    margin-bottom: 5px;
    color: #fff;
    font-size: 24px;
}

.top-journey-collection__grid span {
    color: rgba(255,255,255,.46);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.35;
    text-transform: uppercase;
}

.top-journey-collection > p {
    margin: 11px 0 0 !important;
    color: rgba(255,255,255,.42) !important;
    font-size: 10px !important;
}

.top-journey-history > div {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 8px;
}

.top-journey-history article {
    display: grid;
    min-height: 85px;
    padding: 12px;
    align-content: center;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 8px;
    background: rgba(0,0,0,.22);
}

.top-journey-history article > span {
    margin-bottom: 5px;
    color: #59d88f;
    font-size: 17px;
    font-weight: 900;
}

.top-journey-history article > span.is-negative {
    color: #ff6363;
}

.top-journey-history article strong {
    color: #fff;
    font-size: 11px;
}

.top-journey-history article small {
    margin-top: 4px;
    color: rgba(255,255,255,.35);
    font-size: 8px;
}

.top-journey-tools {
    display: grid;
    grid-template-columns: minmax(150px,.45fr) minmax(0,1fr);
    gap: 16px;
    margin: 30px 0;
    padding: 17px;
    align-items: center;
    color: #eee;
    border: 1px solid rgba(255,121,0,.18);
    border-radius: 10px;
    background: linear-gradient(135deg,rgba(255,121,0,.065),rgba(255,255,255,.018));
}

.top-journey-tools > div:first-child small {
    display: block;
    margin-bottom: 3px;
    color: #ff7900;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.top-journey-tools > div:first-child strong {
    color: #fff;
    font-size: 15px;
}

.top-journey-tools__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.top-journey-tools button,
.top-journey-tools select {
    min-height: 39px;
    padding: 0 12px;
    color: #eaeaea;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 7px;
    background: #0b0b0b;
    cursor: pointer;
    font-size: 10px;
    font-weight: 800;
}

.top-journey-tools button:hover,
.top-journey-tools button.is-active,
.top-journey-tools select:focus {
    color: #fff;
    border-color: rgba(255,121,0,.46);
    outline: none;
}

.top-journey-tools label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,.5);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.top-journey-tools > span {
    grid-column: 1/-1;
    color: rgba(255,255,255,.48);
    font-size: 9px;
}

.top-comment-reactions {
    display: flex;
    margin-top: 13px;
    flex-wrap: wrap;
    gap: 6px;
}

.top-comment-reactions button {
    display: inline-flex;
    min-height: 29px;
    padding: 0 9px;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,.58);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 999px;
    background: rgba(255,255,255,.025);
    cursor: pointer;
    font-size: 9px;
    font-weight: 800;
}

.top-comment-reactions button:hover,
.top-comment-reactions button.is-active {
    color: #fff;
    border-color: rgba(255,121,0,.38);
    background: rgba(255,121,0,.08);
}

.top-comment-reactions button b {
    color: #ff9a38;
    font-size: 9px;
}

.top-journey-toast {
    position: fixed;
    z-index: 999999;
    right: 22px;
    bottom: 22px;
    max-width: min(360px,calc(100vw - 32px));
    padding: 13px 16px;
    color: #fff;
    border: 1px solid rgba(255,121,0,.32);
    border-radius: 9px;
    background: rgba(8,8,8,.96);
    box-shadow: 0 12px 42px rgba(0,0,0,.45);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .22s ease,transform .22s ease;
    font: 800 11px/1.45 Arial,sans-serif;
}

.top-journey-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.top-journey-toast.is-success {
    border-color: rgba(67,207,128,.4);
}

.top-journey-toast.is-error {
    border-color: rgba(255,89,89,.45);
}

@media (max-width: 980px) {
    .top-journey-level { grid-template-columns: 130px minmax(0,1fr); }
    .top-journey-next { grid-column: 1/-1; min-height: auto; border-top: 1px solid rgba(255,255,255,.08); border-left: 0; }
    .top-journey-columns { grid-template-columns: 1fr; }
    .top-journey-collection__grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .top-journey-history > div { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 640px) {
    .top-journey-level { grid-template-columns: 1fr; padding: 14px; }
    .top-journey-level__number { min-height: 112px; }
    .top-journey-level__progress > div:first-child { align-items: flex-start; flex-direction: column; }
    .top-journey-next { grid-column: auto; }
    .top-journey-columns > section,.top-journey-collection,.top-journey-history { padding: 14px; }
    .top-journey-missions article { grid-template-columns: 1fr; }
    .top-mission-progress small { text-align: left; }
    .top-journey-collection__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .top-journey-history > div { grid-template-columns: 1fr 1fr; }
    .top-journey-tools { grid-template-columns: 1fr; }
    .top-journey-tools__actions { align-items: stretch; justify-content: flex-start; flex-direction: column; }
    .top-journey-tools label { align-items: stretch; flex-direction: column; }
    .top-journey-tools > span { grid-column: auto; }
}

/* Jornada no perfil público */
.top-public-profile .tpp-stats {
    grid-template-columns: repeat(5,minmax(0,1fr));
}

.tpp-actions .tpp-follow-author {
    display: inline-flex;
    min-height: 42px;
    padding: 0 15px;
    align-items: center;
    color: rgba(255,255,255,.72);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 7px;
    background: #090909;
    cursor: pointer;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}

.tpp-actions .tpp-follow-author:hover,
.tpp-actions .tpp-follow-author.is-active {
    color: #fff;
    border-color: rgba(255,121,0,.45);
}

.top-public-journey {
    --tj-gold: #ffb300;
    --tj-orange: #ff7900;
    display: grid;
    grid-template-columns: minmax(220px,.42fr) minmax(0,1fr);
    margin-top: 12px;
    align-items: center;
    gap: 24px;
    background: radial-gradient(circle at 8% 20%,rgba(255,121,0,.11),transparent 38%),#070707;
}

.top-public-journey small {
    display: block;
    margin-bottom: 7px;
    color: var(--tpp-accent,#ff7900);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.top-public-journey h2 {
    margin: 0 !important;
    color: #fff !important;
    font: 900 23px/1.1 Arial,sans-serif !important;
    text-transform: uppercase;
}

.top-public-journey p {
    margin: 7px 0 0 !important;
    color: rgba(255,255,255,.45) !important;
    font-size: 11px !important;
}

@media(max-width:980px) {
    .top-public-profile .tpp-stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media(max-width:760px) {
    .top-public-profile .tpp-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .top-public-journey { grid-template-columns: 1fr; }
}

@media(max-width:520px) {
    .top-public-profile .tpp-stats { grid-template-columns: 1fr; }
}

.top-member .tm-stats { grid-template-columns: repeat(5,minmax(0,1fr)); }
@media(max-width:980px){.top-member .tm-stats{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:800px){.top-member .tm-stats{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:560px){.top-member .tm-stats{grid-template-columns:1fr;}}

/* THE OUTPOST — PROGRESSO DO LEITOR V2.3.0 */
.top-journey{
    --tj-orange:var(--tm-accent,#ff7900);
    --tj-gold:#e9b33a;
}
.top-journey-level{
    grid-template-columns:120px minmax(0,1fr) minmax(210px,.38fr);
    gap:16px;
    padding:18px;
    border-color:rgba(255,255,255,.08);
    border-radius:10px;
    background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
}
.top-journey-level__number{
    min-height:118px;
    padding:15px;
    border-color:rgba(255,255,255,.09);
    border-radius:9px;
    background:#050505;
}
.top-journey-level__number strong{font-size:48px;letter-spacing:-.04em}
.top-journey-level__number span{color:#e8b449;font-size:9px;letter-spacing:.04em}
.top-journey-level__progress strong{font-size:16px}
.top-journey-level__progress span{font-size:10px}
.top-journey-bar{height:10px;border-color:rgba(255,255,255,.09);background:#111}
.top-journey-bar i{background:linear-gradient(90deg,#ff7900,#e9b33a);box-shadow:none}
.top-journey-next{min-height:118px;padding:16px;border-left-color:rgba(255,255,255,.07)}
.top-journey-next strong{font-size:15px}
.top-journey-columns{gap:14px;margin-top:14px}
.top-journey-columns>section,
.top-journey-collection,
.top-journey-history{
    padding:18px;
    border-color:rgba(255,255,255,.075);
    border-radius:10px;
    background:#060606;
}
.top-journey-columns>section>header{align-items:flex-start}
.top-journey-columns>section>header p{
    max-width:520px;
    margin:6px 0 0!important;
    color:rgba(255,255,255,.42)!important;
    font-size:10px!important;
    line-height:1.5!important;
}
.top-journey-missions{gap:8px}
.top-journey-missions article{
    min-height:0;
    padding:13px;
    grid-template-columns:minmax(0,1fr) 150px;
    gap:14px;
    border-color:rgba(255,255,255,.07);
    border-radius:8px;
    background:#040404;
}
.top-journey-missions article:hover{border-color:rgba(255,121,0,.22);transform:none}
.top-journey-missions article.is-complete{opacity:.72;background:#050505}
.top-journey-missions article.is-complete:after{display:none}
.top-journey-missions h4{font-size:13px;line-height:1.3}
.top-journey-missions p{font-size:9px;line-height:1.45}
.top-mission-progress>span{height:5px;background:rgba(255,255,255,.07)}
.top-mission-progress i{background:linear-gradient(90deg,#ff7900,#e9b33a)}
.top-mission-progress small{font-size:8px}
.top-journey-missions article>b{
    padding:4px 7px;
    color:#d7b56b;
    border:1px solid rgba(215,181,107,.22);
    border-radius:5px;
    background:rgba(215,181,107,.04);
    font-size:6px;
}
.top-journey-notifications a{
    min-height:70px;
    padding:12px;
    border-color:rgba(255,255,255,.065);
    border-radius:8px;
    background:#040404;
}
.top-journey-notifications a:hover{border-color:rgba(255,121,0,.22);transform:none}
.top-journey-notifications a.is-unread{background:linear-gradient(90deg,rgba(255,121,0,.055),#040404 34%)}
.top-journey-notifications a>i{width:7px;height:7px;background:rgba(255,255,255,.18)}
.top-journey-notifications a.is-unread>i{background:#ff7900;box-shadow:none}
.top-journey-notifications strong{font-size:11px}
.top-journey-notifications p{font-size:9px;line-height:1.45}
.top-journey-collection__grid article{border-color:rgba(255,255,255,.065);background:#040404}
.top-journey-history article{border-color:rgba(255,255,255,.065);background:#040404}
.top-journey-tools{
    border-color:rgba(255,255,255,.08);
    border-radius:9px;
    background:#060606;
}
.top-journey-tools>div:first-child small{color:#ff7900}
.top-journey button:focus-visible,
.top-journey a:focus-visible,
.top-journey select:focus-visible{
    outline:2px solid #ff7900;
    outline-offset:2px;
}
@media(max-width:980px){
    .top-journey-level{grid-template-columns:110px minmax(0,1fr)}
    .top-journey-next{min-height:auto}
}
@media(max-width:640px){
    .top-journey-level{grid-template-columns:1fr}
    .top-journey-level__number{min-height:96px}
    .top-journey-missions article{grid-template-columns:1fr}
}