:root{--ss-bg:#11110f;--ss-panel:#171714;--ss-hover:#20201c;--ss-text:#deddd5;--ss-muted:#8f8e86;--ss-border:#393832;--ss-strong:#6a685e;--ss-progress:#35342e;--ss-xp:#9a9271}.shell{max-width:none;margin:0;padding:0}.scapesim-page{min-height:100vh;background:var(--ss-bg);color:var(--ss-text);font:14px Georgia,"Times New Roman",serif}.scapesim-shell{position:relative;width:min(1540px,calc(100% - 28px));margin:0 auto;padding:10px 0 32px}.scapesim-header{margin:0 0 10px;text-align:center}.scapesim-title{margin:0;font-size:19px;font-weight:400;letter-spacing:.08em}.scapesim-kicker{margin:2px 0 0;color:var(--ss-muted);font-size:9px;font-weight:400;letter-spacing:.12em;text-transform:lowercase}.scapesim-account{position:fixed;z-index:100;top:10px;right:14px;display:flex;align-items:center;gap:9px;color:var(--ss-muted);font-size:11px}.scapesim-account>button{padding:5px 8px}.scapesim-account-menu{position:absolute;right:0;top:32px;min-width:145px;border:1px solid var(--ss-border);padding:6px;background:#0b0b0a}.scapesim-account-menu a,.scapesim-account-menu button{display:block;width:100%;border:0;padding:7px;background:transparent;color:var(--ss-text);font:inherit;text-align:left;text-decoration:none}.scapesim-account-menu form{display:block}.scapesim-layout{display:grid;grid-template-columns:minmax(300px,1fr) minmax(520px,2.15fr) minmax(230px,.9fr);gap:18px;align-items:start}.scapesim-column{min-width:0}.scapesim-tabs{display:flex;min-width:0;border:1px solid var(--ss-border);border-bottom:0;background:var(--ss-panel)}.scapesim-tab{border:0;border-right:1px solid var(--ss-border);padding:9px 11px;background:transparent;color:var(--ss-muted);font:inherit;cursor:pointer}.scapesim-tab:last-child{border-right:0}.scapesim-tab:hover,.scapesim-tab.is-active{background:var(--ss-hover);color:var(--ss-text)}.scapesim-panel{min-width:0;border:1px solid var(--ss-border);padding:16px;background:var(--ss-panel)}.scapesim-tab-content{border-top:0}.scapesim-main{min-height:330px}.scapesim-panel h2{margin:0 0 15px;font-size:15px;font-weight:400}.scapesim-skills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.scapesim-skill{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 7px;padding:7px;border:1px solid var(--ss-border)}.scapesim-skill:hover,.scapesim-skill:focus{z-index:10;border-color:var(--ss-strong);background:var(--ss-hover);outline:0}.scapesim-skill-name,.scapesim-skill-level{font-size:11px}.scapesim-skill-track{grid-column:1/-1;height:2px;background:#292923}.scapesim-skill-track>span{display:block;height:100%;background:var(--ss-xp)}.scapesim-skill-tooltip{position:absolute;z-index:50;top:calc(100% + 7px);left:50%;width:205px;transform:translate(-50%,-3px);border:1px solid var(--ss-strong);padding:9px;background:#0b0b0a;opacity:0;visibility:hidden;pointer-events:none}.scapesim-skill:hover .scapesim-skill-tooltip,.scapesim-skill:focus .scapesim-skill-tooltip{transform:translate(-50%,0);opacity:1;visibility:visible}.scapesim-skill-tooltip dl{margin:0;font-size:10px}.scapesim-skill-tooltip dl>div,.scapesim-list>div,.scapesim-total-level{display:flex;justify-content:space-between;gap:12px}.scapesim-skill-tooltip dt,.scapesim-skill-tooltip dd,.scapesim-list dt,.scapesim-list dd{margin:0}.scapesim-total-level{margin-top:12px;border-top:1px solid var(--ss-border);padding:11px 2px 1px;color:var(--ss-muted);font-size:12px}.scapesim-total-level strong{color:var(--ss-text);font-weight:400}.scapesim-list{margin:0}.scapesim-list>div{padding:7px 0;border-bottom:1px dotted var(--ss-border)}.scapesim-list dd,.scapesim-muted,.scapesim-feed{color:var(--ss-muted)}.scapesim-store-section,.scapesim-action-section{position:relative;border:1px solid var(--ss-border);padding:13px;background:rgb(255 255 255 / 1.2%)}.scapesim-store-section h3,.scapesim-action-section h3{display:table;position:relative;z-index:2;margin:-22px 0 14px -5px;padding:0 7px;background:var(--ss-panel);color:#c9c5b5;font-size:11px;font-weight:400;letter-spacing:.11em;text-transform:uppercase}.scapesim-buy-group{max-width:260px;border:1px dotted var(--ss-border);padding:9px}.scapesim-buy-group h4{margin:0 0 8px;color:var(--ss-muted);font-size:10px;font-weight:400;letter-spacing:.07em;text-transform:uppercase}.scapesim-item-button{display:flex;min-width:145px;flex-direction:column;border:1px solid var(--ss-strong);padding:8px 10px;background:transparent;color:var(--ss-text);font:inherit;text-align:left;cursor:pointer}.scapesim-item-button small{margin-top:2px;color:var(--ss-muted);font-size:10px}.scapesim-item-button:disabled{border-color:var(--ss-border);color:#55544f;cursor:not-allowed}.scapesim-action-strip{display:flex;gap:7px;overflow-x:auto;padding:1px 1px 8px}.scapesim-action{position:relative;overflow:hidden;flex:0 0 130px;width:130px;min-height:48px;border:1px solid var(--ss-strong);padding:7px 9px;background:transparent;color:var(--ss-text);font:inherit;text-align:left;cursor:pointer}.scapesim-action:hover:not(:disabled){border-color:var(--ss-text);background:var(--ss-hover)}.scapesim-action:disabled:not(.is-running){opacity:.42;cursor:default}.scapesim-action-progress{position:absolute;inset:0;z-index:1;background:var(--ss-progress);transform:scaleX(var(--progress,0));transform-origin:left;will-change:transform}.scapesim-action-content{position:relative;z-index:2;display:flex;align-items:flex-start;flex-direction:column;gap:2px}.scapesim-action small{color:var(--ss-muted);font-size:9px}.scapesim-feed{font-size:13px;line-height:1.65}.scapesim-feed p{margin:0 0 8px}.scapesim-feed-panel{min-height:330px}@media(max-width:1120px){.scapesim-layout{grid-template-columns:minmax(280px,1fr) minmax(500px,1.8fr)}.scapesim-feed-panel{grid-column:1/-1}}@media(max-width:780px){.scapesim-layout{grid-template-columns:1fr}.scapesim-feed-panel{grid-column:auto}.scapesim-account span{display:none}}


/* Layout spacing and connected active tabs */
.scapesim-layout {
    padding-inline: clamp(24px, 5vw, 96px);
}

.scapesim-tab {
    background: var(--ss-hover);
}

.scapesim-tab.is-active {
    position: relative;
    z-index: 2;
    background: var(--ss-panel);
}

.scapesim-tab.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: var(--ss-panel);
}

@media (max-width: 780px) {
    .scapesim-layout {
        padding-inline: 12px;
    }
}

.scapesim-tooltip-progress{height:5px;margin:0 0 9px;background:#292923}.scapesim-tooltip-progress>span{display:block;height:100%;background:var(--ss-xp)}.scapesim-store-section+.scapesim-store-section{margin-top:16px}.scapesim-sell-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:7px 0;border-bottom:1px dotted var(--ss-border)}.scapesim-sell-value{color:var(--ss-muted);font-size:10px}.scapesim-sell-actions{display:flex;gap:3px}.scapesim-sell-actions button{min-width:30px;border:1px solid var(--ss-border);padding:4px 6px;background:transparent;color:var(--ss-muted);font:inherit;cursor:pointer}.scapesim-sell-actions button:hover{border-color:var(--ss-strong);color:var(--ss-text)}.scapesim-store-empty{font-style:italic}.scapesim-level-up{position:fixed;z-index:500;left:50%;top:18%;min-width:260px;transform:translateX(-50%);border:1px solid #8b8055;padding:14px 20px;background:rgb(10 10 8 / 96%);box-shadow:0 0 24px rgb(224 187 82 / 16%);color:#eee6c5;text-align:center;pointer-events:none}.scapesim-level-up p{margin:0 0 4px;color:#d7c374}.scapesim-level-up strong{font-size:12px;font-weight:400}.scapesim-level-up.is-visible{animation:scapesim-level-card 2400ms ease both}@keyframes scapesim-level-card{0%{opacity:0;transform:translate(-50%,5px) scale(.98)}10%,78%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-5px) scale(.99)}}

[hidden]{display:none!important}

.scapesim-buy-group+.scapesim-buy-group{margin-top:10px}

.scapesim-action-section-spaced {
    margin-top: 18px;
}

/* Give selected skills and Sawmill actions room for longer names. */
.scapesim-action:is(
    [data-action^="agility:"],
    [data-action^="construction:"],
    [data-action^="farming:"],
    [data-action^="firemaking:"],
    [data-action^="fletching:"],
    [data-action^="herblore:"],
    [data-action^="hunter:"],
    [data-action^="thieving:"],
    [data-action^="activity:make_"]
) {
    flex: 0 0 auto;
    width: fit-content;
    min-width: 130px;
    max-width: 220px;
}

.scapesim-action:is(
    [data-action^="agility:"],
    [data-action^="construction:"],
    [data-action^="farming:"],
    [data-action^="firemaking:"],
    [data-action^="fletching:"],
    [data-action^="herblore:"],
    [data-action^="hunter:"],
    [data-action^="thieving:"],
    [data-action^="activity:make_"]
) .scapesim-action-content > span:first-child {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Store tools size to their contents instead of sharing one fixed width. */
.scapesim-item-button {
    width: fit-content;
    min-width: 110px;
    max-width: 220px;
}

.scapesim-item-button > span:first-child {
    white-space: nowrap;
}


/* Coins are kept visually distinct without breaking the muted interface. */
.scapesim-list [data-inventory-row="coins"] {
    border-bottom-color: rgb(193 168 92 / 45%);
    color: #cdbb7a;
    text-shadow: 0 0 8px rgb(205 187 122 / 12%);
}

.scapesim-list [data-inventory-row="coins"] dt,
.scapesim-list [data-inventory-row="coins"] dd {
    color: inherit;
}


/* Keep the activity column within the viewport and scroll only its messages. */
.scapesim-feed-panel {
    display: flex;
    max-height: calc(100vh - 88px);
    flex-direction: column;
    overflow: hidden;
}

.scapesim-feed {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: var(--ss-strong) transparent;
    scrollbar-width: thin;
}

.scapesim-feed::-webkit-scrollbar {
    width: 6px;
}

.scapesim-feed::-webkit-scrollbar-thumb {
    background: var(--ss-strong);
}

.scapesim-feed::-webkit-scrollbar-track {
    background: transparent;
}

@media (max-width: 1120px) {
    .scapesim-feed-panel {
        max-height: 360px;
    }
}

/* Tireless Hands pin controls */
.scapesim-action {
    padding-right: 34px;
}

.scapesim-action-pin {
    position: absolute;
    z-index: 4;
    right: 8px;
    bottom: 8px;
    width: 10px;
    height: 10px;
    border: 1px solid var(--ss-strong);
    border-radius: 50%;
    background: var(--ss-panel);
    box-shadow: 0 0 0 3px rgb(17 17 15 / 45%);
    cursor: pointer;
}

.scapesim-action-pin:hover,
.scapesim-action-pin:focus-visible {
    border-color: var(--ss-text);
    outline: none;
}

.scapesim-action-pin.is-pinned {
    border-color: var(--ss-xp);
    background: var(--ss-xp);
    box-shadow:
        0 0 0 3px rgb(17 17 15 / 55%),
        0 0 9px rgb(154 146 113 / 35%);
}

.scapesim-action[aria-disabled="true"] {
    opacity: .42;
    cursor: default;
}

.scapesim-action[aria-disabled="true"]:hover {
    border-color: var(--ss-strong);
    background: transparent;
}

.scapesim-action.is-running[aria-disabled="true"] {
    opacity: 1;
}

.scapesim-action[aria-disabled="true"] .scapesim-action-pin {
    pointer-events: auto;
    cursor: pointer;
}

.scapesim-action.has-failed {
    animation: scapesim-action-failed 700ms ease-out;
}

.scapesim-action.is-stunned {
    border-color: #9b5c4e;
    opacity: 1;
}

.scapesim-action.is-stunned .scapesim-action-progress {
    background: rgb(128 43 35 / 55%);
    transition: none;
}

.scapesim-action.is-stunned.is-stun-counting .scapesim-action-progress {
    transition: transform var(--stun-duration) linear;
}

@keyframes scapesim-action-failed {
    0%, 100% {
        border-color: var(--ss-strong);
        box-shadow: none;
    }

    18% {
        border-color: #9b5c4e;
        box-shadow: inset 0 0 0 999px rgb(120 45 35 / 12%);
        transform: translateX(-2px);
    }

    36% {
        transform: translateX(2px);
    }

    54% {
        transform: translateX(0);
    }
}

/* Abilities tab */
.scapesim-ability-card {
    border: 1px solid var(--ss-border);
    padding: 13px;
    background: rgb(255 255 255 / 1.2%);
}

.scapesim-ability-heading {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}

.scapesim-ability-copy {
    min-width: 0;
}

.scapesim-ability-copy h2 {
    margin: 0 0 4px;
    color: var(--ss-text);
    font-size: 14px;
    font-weight: 400;
}

.scapesim-ability-copy p {
    margin: 0;
    color: var(--ss-muted);
    font-size: 11px;
    line-height: 1.45;
}

.scapesim-ability-pin-status {
    margin-top: 8px !important;
}

.scapesim-ability-pin-status strong {
    color: var(--ss-text);
    font-weight: 400;
}

.scapesim-ability-action {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-end;
    flex-direction: column;
    gap: 5px;
}

.scapesim-ability-action button {
    border: 1px solid var(--ss-strong);
    padding: 6px 9px;
    background: transparent;
    color: var(--ss-text);
    font: inherit;
    cursor: pointer;
}

.scapesim-ability-action button:hover:not(:disabled) {
    border-color: var(--ss-text);
    background: var(--ss-hover);
}

.scapesim-ability-action button:disabled {
    border-color: var(--ss-border);
    color: #55544f;
    cursor: default;
}

.scapesim-ability-action small {
    color: var(--ss-muted);
    font-size: 9px;
}

.scapesim-ability-progression {
    margin-top: 14px;
}

.scapesim-ability-progress-track {
    height: 4px;
    overflow: hidden;
    background: #292923;
}

.scapesim-ability-progress-track > span {
    display: block;
    height: 100%;
    background: var(--ss-xp);
}

.scapesim-ability-progress-labels {
    display: grid;
    grid-template-columns: repeat(var(--ability-stage-count), minmax(0, 1fr));
    gap: 6px;
    margin-top: 6px;
    color: var(--ss-muted);
    font-size: 9px;
}

.scapesim-ability-progress-labels span {
    text-align: center;
}

.scapesim-ability-progress-labels span:first-child {
    text-align: left;
}

.scapesim-ability-progress-labels span:last-child {
    text-align: right;
}

.scapesim-ability-progress-labels .is-reached {
    color: var(--ss-text);
}

@media (max-width: 460px) {
    .scapesim-ability-heading {
        flex-direction: column;
    }

    .scapesim-ability-action {
        align-items: flex-start;
    }
}

/* Shared requirement tooltip for unavailable skilling actions. */
.scapesim-requirement-tooltip {
    position: fixed;
    z-index: 1000;
    max-width: 240px;
    border: 1px solid var(--ss-strong);
    padding: 7px 9px;
    background: #0b0b0a;
    color: var(--ss-text);
    font-size: 10px;
    line-height: 1.4;
    pointer-events: none;
    box-shadow: 0 5px 18px rgb(0 0 0 / 35%);
}

.scapesim-requirement-tooltip-title {
    margin-bottom: 4px;
    color: var(--ss-text);
}

.scapesim-requirement-tooltip-list {
    margin: 0;
    padding-left: 16px;
    color: var(--ss-muted);
}

.scapesim-requirement-tooltip-list li + li {
    margin-top: 2px;
}

/* Subtle horizontal scrollbar for action strips. */
.scapesim-action-strip {
    scrollbar-color: rgb(106 104 94 / 50%) transparent;
    scrollbar-width: thin;
}

.scapesim-action-strip::-webkit-scrollbar {
    height: 4px;
}

.scapesim-action-strip::-webkit-scrollbar-track {
    background: transparent;
}

.scapesim-action-strip::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgb(106 104 94 / 42%);
}

.scapesim-action-strip:hover::-webkit-scrollbar-thumb {
    background: rgb(106 104 94 / 68%);
}