/* /Components/AssistantDrawer.razor.rz.scp.css */
.assistant[b-i8qwh773kc] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    display: flex;
    flex-direction: column;
    width: min(420px, 100vw);
    background: var(--color-panel);
    border-left: 1px solid var(--color-line);
    box-shadow: -8px 0 24px var(--color-fog);
}

.assistant__head[b-i8qwh773kc] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-line);
}

.assistant__title[b-i8qwh773kc] {
    margin-right: auto;
    font-size: 18px;
}

.assistant__mode[b-i8qwh773kc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-line);
}

.assistant__mode-hint[b-i8qwh773kc] {
    font-size: 12px;
}

.assistant__entries[b-i8qwh773kc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin: 0;
    padding: var(--space-4);
    overflow-y: auto;
    list-style: none;
}

.assistant__empty[b-i8qwh773kc] {
    margin: auto 0;
    text-align: center;
}

.message[b-i8qwh773kc] {
    align-self: flex-start;
    max-width: 92%;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.message--mine[b-i8qwh773kc] {
    align-self: flex-end;
    max-width: 88%;
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.message__text[b-i8qwh773kc] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.assistant__note[b-i8qwh773kc] {
    align-self: center;
    font-size: 13px;
    font-style: italic;
    color: var(--color-muted);
    text-align: center;
}

.assistant__busy[b-i8qwh773kc] {
    animation: assistant-pulse-b-i8qwh773kc 1.4s ease-in-out infinite;
}

@keyframes assistant-pulse-b-i8qwh773kc {
    50% {
        opacity: 0.4;
    }
}

@media (prefers-reduced-motion: reduce) {
    .assistant__busy[b-i8qwh773kc] {
        animation: none;
    }
}

/* A table command the assistant wants to run */
.proposal[b-i8qwh773kc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-accent);
    background: var(--color-panel);
}

.proposal__what[b-i8qwh773kc] {
    font-weight: 700;
}

.proposal__actions[b-i8qwh773kc] {
    display: flex;
    gap: var(--space-2);
}

.proposal__status[b-i8qwh773kc] {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-muted);
}

.proposal__outcome[b-i8qwh773kc] {
    font-size: 13px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: var(--color-muted);
}

.proposal--done[b-i8qwh773kc] {
    border-style: solid;
    border-color: var(--color-good);
    background: var(--color-good-soft);
}

.proposal--done .proposal__status[b-i8qwh773kc] {
    color: var(--color-good);
}

.proposal--failed[b-i8qwh773kc] {
    border-style: solid;
    border-color: var(--color-danger);
    background: var(--color-danger-soft);
}

.proposal--failed .proposal__status[b-i8qwh773kc] {
    color: var(--color-danger);
}

.proposal--declined[b-i8qwh773kc],
.proposal--skipped[b-i8qwh773kc] {
    border-style: solid;
    border-color: var(--color-line);
    opacity: 0.7;
}

.proposal--declined .proposal__what[b-i8qwh773kc],
.proposal--skipped .proposal__what[b-i8qwh773kc] {
    text-decoration: line-through;
}

.assistant__all[b-i8qwh773kc] {
    display: flex;
    justify-content: flex-end;
    padding: var(--space-2) var(--space-4) 0;
}

.assistant__form[b-i8qwh773kc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4) var(--space-4);
    border-top: 1px solid var(--color-line);
}

.assistant__text[b-i8qwh773kc] {
    min-height: 64px;
}

.assistant__error[b-i8qwh773kc] {
    margin: 0;
    color: var(--color-danger);
}

.assistant__send[b-i8qwh773kc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.assistant__hint[b-i8qwh773kc] {
    font-size: 12px;
}
/* /Components/Avatar.razor.rz.scp.css */
.avatar[b-x773o9mj0w] {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-family: var(--font-display);
    font-weight: 700;
}

.avatar__picture[b-x773o9mj0w] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.avatar--small[b-x773o9mj0w] {
    width: 40px;
    height: 40px;
    font-size: 17px;
}

.avatar--medium[b-x773o9mj0w] {
    width: 56px;
    height: 56px;
    font-size: 24px;
}

.avatar--large[b-x773o9mj0w] {
    width: 72px;
    height: 72px;
    font-size: 30px;
}

.avatar--outlined[b-x773o9mj0w] {
    border: 2px solid var(--color-accent);
}
/* /Components/BackgroundEditor.razor.rz.scp.css */
.entry-form[b-pdfgn6cqp3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.entry-form__row[b-pdfgn6cqp3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-3);
}

.choices[b-pdfgn6cqp3] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.choices legend[b-pdfgn6cqp3] {
    width: 100%;
    margin-bottom: var(--space-2);
    padding: 0;
}
/* /Components/ChatDrawer.razor.rz.scp.css */
.chat[b-zfimurqsoc] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    display: flex;
    flex-direction: column;
    width: min(380px, 100vw);
    background: var(--color-panel);
    border-left: 1px solid var(--color-line);
    box-shadow: -8px 0 24px var(--color-fog);
}

.chat__head[b-zfimurqsoc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-line);
}

.chat__title[b-zfimurqsoc] {
    font-size: 18px;
}

.chat__messages[b-zfimurqsoc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin: 0;
    padding: var(--space-4);
    overflow-y: auto;
    list-style: none;
}

.chat__empty[b-zfimurqsoc] {
    margin: auto 0;
    text-align: center;
}

.message[b-zfimurqsoc] {
    align-self: flex-start;
    max-width: 88%;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.message--mine[b-zfimurqsoc] {
    align-self: flex-end;
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.message--whisper[b-zfimurqsoc] {
    border-style: dashed;
    font-style: italic;
}

.message__meta[b-zfimurqsoc] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-1) var(--space-2);
    font-size: 12px;
    color: var(--color-muted);
}

.message__from[b-zfimurqsoc] {
    font-weight: 700;
    color: var(--color-text);
}

.message__to[b-zfimurqsoc] {
    color: var(--color-accent);
}

.message__time[b-zfimurqsoc] {
    margin-left: auto;
}

.message__text[b-zfimurqsoc] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.chat__form[b-zfimurqsoc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4) var(--space-4);
    border-top: 1px solid var(--color-line);
}

.chat__text[b-zfimurqsoc] {
    min-height: 64px;
}

.chat__error[b-zfimurqsoc] {
    margin: 0;
    color: var(--color-danger);
}

.chat__send[b-zfimurqsoc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.chat__hint[b-zfimurqsoc] {
    font-size: 12px;
}
/* /Components/DiceBuilder.razor.rz.scp.css */
.dice-grid[b-qzejf9zczx] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-2);
}

.die[b-qzejf9zczx] {
    position: relative;
    min-height: 56px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
}

.die:hover[b-qzejf9zczx],
.die.has-count[b-qzejf9zczx] {
    border-color: var(--color-accent);
}

.die__count[b-qzejf9zczx] {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 22px;
    height: 22px;
    padding: 0 4px;
    border-radius: 11px;
    background: var(--color-accent);
    color: var(--color-on-accent);
    font-family: var(--font-body);
    font-size: 12px;
    line-height: 22px;
}

.pool[b-qzejf9zczx] {
    padding: var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
    text-align: center;
    font-weight: 600;
}

.row[b-qzejf9zczx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.stepper[b-qzejf9zczx] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.stepper__value[b-qzejf9zczx] {
    min-width: 44px;
    text-align: center;
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
}

.actions[b-qzejf9zczx] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: var(--space-2);
}

.typed[b-qzejf9zczx] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-line);
}

.typed label[b-qzejf9zczx] {
    font-size: 14px;
    color: var(--color-muted);
}

.typed__row[b-qzejf9zczx] {
    display: flex;
    gap: var(--space-2);
}

.typed__row .input[b-qzejf9zczx] {
    flex: 1 1 auto;
    min-width: 0;
}

.typed__error[b-qzejf9zczx] {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-weight: 600;
}
/* /Components/MapSettings.razor.rz.scp.css */
.map-settings[b-zxmswqrxbq] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.map-settings[b-zxmswqrxbq]  .panel {
    gap: var(--space-3);
}

.note[b-zxmswqrxbq] {
    margin: 0;
    font-size: 14px;
}

.row[b-zxmswqrxbq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    font-size: 14px;
}

.row--line[b-zxmswqrxbq] {
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.buttons[b-zxmswqrxbq] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.picture[b-zxmswqrxbq] {
    min-width: 0;
}

.picture__name[b-zxmswqrxbq] {
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.picture__size[b-zxmswqrxbq] {
    font-size: 13px;
}

.upload[b-zxmswqrxbq] {
    position: relative;
}

.upload:focus-within[b-zxmswqrxbq] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.grid-fields[b-zxmswqrxbq] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: var(--space-2);
}

.settings__title[b-zxmswqrxbq] {
    margin: var(--space-2) 0 0;
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
    font-size: 14px;
}

.align[b-zxmswqrxbq] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-2);
}

.align__count[b-zxmswqrxbq] {
    width: 110px;
}

.nudge[b-zxmswqrxbq] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
}

.nudge .btn[b-zxmswqrxbq] {
    min-width: 36px;
}

.fit[b-zxmswqrxbq] {
    align-self: end;
}

.remove[b-zxmswqrxbq] {
    align-self: flex-start;
    min-height: 36px;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-muted);
    font-size: 13px;
}

.remove:hover[b-zxmswqrxbq] {
    color: var(--color-danger);
}
/* /Components/Panel.razor.rz.scp.css */
.panel[b-jec40saaft] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
    padding: var(--space-5);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}
/* /Components/RollLog.razor.rz.scp.css */
.log[b-lgi3q9ypqa] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.log__entry[b-lgi3q9ypqa] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: 10px var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.log__text[b-lgi3q9ypqa] {
    flex: 1 1 auto;
    min-width: 0;
}

.log__label[b-lgi3q9ypqa] {
    font-size: 13px;
    color: var(--color-muted);
    overflow-wrap: anywhere;
}

.log__total[b-lgi3q9ypqa] {
    flex: none;
    min-width: 48px;
    text-align: right;
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 700;
}

.log__tag[b-lgi3q9ypqa] {
    margin-left: 6px;
}

.log__entry--critical .log__total[b-lgi3q9ypqa],
.log__entry--critical .log__tag[b-lgi3q9ypqa] {
    color: var(--color-accent);
}

.log__entry--fumble .log__total[b-lgi3q9ypqa],
.log__entry--fumble .log__tag[b-lgi3q9ypqa] {
    color: var(--color-danger);
}
/* /Components/SegmentedControl.razor.rz.scp.css */
.segmented[b-7do3wnq9mz] {
    display: grid;
    grid-auto-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    gap: var(--space-1);
    padding: var(--space-1);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.segmented__option[b-7do3wnq9mz] {
    min-height: 40px;
    padding: 0 var(--space-3);
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-muted);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.segmented__option.is-selected[b-7do3wnq9mz] {
    background: var(--color-panel);
    color: var(--color-accent);
}
/* /Components/SelectedCreature.razor.rz.scp.css */
.selected[b-wfhjcl17wa] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.selected[b-wfhjcl17wa]  .panel {
    gap: var(--space-3);
}

.selected[b-wfhjcl17wa]  .sheet {
    gap: 18px;
}

h3[b-wfhjcl17wa] {
    margin: 0 0 var(--space-1);
    font-size: 17px;
}

.sheet__head[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-3);
}

.sheet__title[b-wfhjcl17wa] {
    min-width: 0;
}

.sheet__name-line[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.sheet__name[b-wfhjcl17wa] {
    font-size: 24px;
}

.stats[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.stat[b-wfhjcl17wa] {
    min-width: 60px;
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    background: var(--color-raised);
    text-align: center;
}

.stat__label[b-wfhjcl17wa] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--color-muted);
}

.stat__value[b-wfhjcl17wa] {
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
    white-space: nowrap;
}

.block[b-wfhjcl17wa] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.block__title[b-wfhjcl17wa] {
    font-weight: 700;
}

.hp-line[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-1) var(--space-3);
    font-size: 14px;
}

.hp-value[b-wfhjcl17wa] {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
    color: var(--hp-color);
}

.hp-value__max[b-wfhjcl17wa] {
    font-size: 15px;
    color: var(--color-muted);
}

.hp-bar--large[b-wfhjcl17wa] {
    height: 8px;
    border-radius: 4px;
}

.hp-form[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.hp-form__label[b-wfhjcl17wa] {
    font-size: 13px;
    color: var(--color-muted);
}

.hp-form__amount[b-wfhjcl17wa] {
    width: 80px;
}

.chips[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chip[b-wfhjcl17wa] {
    min-height: 36px;
    padding: 0 var(--space-3);
    border-radius: 18px;
    border: 1px solid var(--color-line);
    background: transparent;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.chip:hover[b-wfhjcl17wa] {
    border-color: var(--color-accent);
}

.chip.is-on[b-wfhjcl17wa] {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-on-accent);
}

.remove[b-wfhjcl17wa] {
    align-self: flex-start;
    min-height: 36px;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-muted);
    font-size: 13px;
}

.remove:hover[b-wfhjcl17wa] {
    color: var(--color-danger);
}

/* Actions and their targets */

.outcome[b-wfhjcl17wa] {
    margin: 0;
    padding: 10px var(--space-3);
    border-left: 3px solid var(--color-line);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
    font-weight: 600;
}

.outcome--hit[b-wfhjcl17wa] {
    border-left-color: var(--color-good);
}

.outcome--miss[b-wfhjcl17wa] {
    color: var(--color-muted);
}

.outcome--critical[b-wfhjcl17wa] {
    border-left-color: var(--color-accent);
    background: var(--color-accent-soft);
    color: var(--color-accent);
}

.outcome--damage[b-wfhjcl17wa] {
    border-left-color: var(--color-danger);
    background: var(--color-danger-soft);
}

.outcome--healing[b-wfhjcl17wa] {
    border-left-color: var(--color-good);
    color: var(--color-good);
}

.pending[b-wfhjcl17wa] {
    align-self: flex-start;
}

.action[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: 10px var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.action.is-aimed[b-wfhjcl17wa] {
    box-shadow: inset 0 0 0 2px var(--color-accent);
}

.action__text[b-wfhjcl17wa] {
    min-width: 0;
}

.action__name[b-wfhjcl17wa] {
    font-weight: 700;
}

.action__note[b-wfhjcl17wa] {
    font-size: 13px;
    color: var(--color-muted);
}

.action__buttons[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.action__buttons .btn:not(.btn--good):not([aria-pressed="true"])[b-wfhjcl17wa] {
    background: var(--color-panel);
}

.targets[b-wfhjcl17wa] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: 0 0 var(--space-2) var(--space-3);
    border-left: 2px solid var(--color-accent);
}

.targets__title[b-wfhjcl17wa] {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.targets__note[b-wfhjcl17wa] {
    margin: 0;
    font-size: 13px;
}

.target[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) 10px;
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.target__text[b-wfhjcl17wa] {
    min-width: 0;
}

.target__line[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.target__name[b-wfhjcl17wa] {
    font-weight: 700;
}

.target__note[b-wfhjcl17wa] {
    font-size: 13px;
    color: var(--color-muted);
}

.status[b-wfhjcl17wa] {
    padding: 1px var(--space-2);
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
}

.status--good[b-wfhjcl17wa] {
    background: var(--color-good-soft);
    color: var(--color-good);
}

.status--warn[b-wfhjcl17wa] {
    background: var(--color-accent-soft);
    color: var(--color-accent);
}

.status--bad[b-wfhjcl17wa] {
    background: var(--color-danger-soft);
    color: var(--color-danger);
}

.status--quiet[b-wfhjcl17wa] {
    background: var(--color-panel);
    color: var(--color-muted);
}

/* Rules reminders */

.reminders__title[b-wfhjcl17wa] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.reminders__title svg[b-wfhjcl17wa] {
    color: var(--color-accent);
}

.reminder[b-wfhjcl17wa] {
    padding: 10px var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.reminder__title[b-wfhjcl17wa] {
    font-weight: 700;
    color: var(--color-accent);
}

.reminder--condition[b-wfhjcl17wa] {
    background: var(--color-danger-soft);
}

.reminder--condition .reminder__title[b-wfhjcl17wa] {
    color: var(--color-danger);
}

.not-yours[b-wfhjcl17wa] {
    margin: 0;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-sm);
    border: 1px dashed var(--color-line);
}

.visibility-note[b-wfhjcl17wa] {
    margin: 0;
    font-size: 13px;
}

.forget[b-wfhjcl17wa] {
    align-self: flex-start;
}

/* The turn: Action, Bonus Action, Reaction */

.economy[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.economy .status[b-wfhjcl17wa] {
    padding: 3px var(--space-2);
}

.warnings[b-wfhjcl17wa] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.warning[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-size: 13px;
    font-weight: 600;
}

.warning__text[b-wfhjcl17wa] {
    flex: 1 1 200px;
}

.warning__buttons[b-wfhjcl17wa] {
    display: flex;
    gap: var(--space-1);
}

.take-action[b-wfhjcl17wa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.take-action__select[b-wfhjcl17wa] {
    width: auto;
    min-width: 0;
}

.take-action__note[b-wfhjcl17wa] {
    margin: 0;
    font-size: 13px;
}

/* The DM's choice of a monster's or NPC's token picture */
.picture-line[b-wfhjcl17wa] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.picture-line__text[b-wfhjcl17wa] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}
/* /Components/SpeciesEditor.razor.rz.scp.css */
.entry-form[b-tl72jypoc9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.entry-form__row[b-tl72jypoc9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-3);
}

.entry-form__head[b-tl72jypoc9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.entry-form__head h3[b-tl72jypoc9] {
    font-size: 15px;
}

.traits[b-tl72jypoc9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.trait[b-tl72jypoc9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
}

.trait__row[b-tl72jypoc9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 88px auto;
    align-items: end;
    gap: var(--space-2);
}

.trait__remove[b-tl72jypoc9] {
    color: var(--color-muted);
}
/* /Components/StatTile.razor.rz.scp.css */
.stat-tile[b-6bg5n1u6fa] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 10px var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.stat-tile--button[b-6bg5n1u6fa] {
    border: 1px solid var(--color-line);
    color: var(--color-text);
    text-align: left;
    cursor: pointer;
}

.stat-tile--button:hover[b-6bg5n1u6fa] {
    border-color: var(--color-accent);
}

.stat-tile__label[b-6bg5n1u6fa] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.stat-tile__value[b-6bg5n1u6fa] {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 700;
    white-space: nowrap;
}

.stat-tile__value--accent[b-6bg5n1u6fa] {
    color: var(--color-accent);
}

.stat-tile__value.hp--high[b-6bg5n1u6fa] {
    color: var(--color-good);
}

.stat-tile__value.hp--mid[b-6bg5n1u6fa] {
    color: var(--color-accent);
}

.stat-tile__value.hp--low[b-6bg5n1u6fa] {
    color: var(--color-danger);
}

.stat-tile__note[b-6bg5n1u6fa] {
    font-size: 12px;
    color: var(--color-muted);
}
/* /Components/TableMap.razor.rz.scp.css */
.map-viewport[b-o1vhs6e2i5] {
    width: fit-content;
    max-width: 100%;
    max-height: 72vh;
    overflow: auto;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-fog);
}

/* The grid is the map; a picture that reaches past it is cut off at its edge. */
.map-surface[b-o1vhs6e2i5] {
    position: relative;
    margin: 0;
    overflow: hidden;
    touch-action: none;
    user-select: none;
}

.map-image[b-o1vhs6e2i5] {
    position: absolute;
    display: block;
    max-width: none;
    pointer-events: none;
}

.map-missing[b-o1vhs6e2i5] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: var(--space-6);
    color: var(--color-muted);
    text-align: center;
}

.map-overlay[b-o1vhs6e2i5] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.grid-line[b-o1vhs6e2i5] {
    fill: none;
    stroke: var(--color-text);
    stroke-opacity: 0.22;
    stroke-width: 1;
}

.tint--reach[b-o1vhs6e2i5] {
    fill: var(--color-good);
    fill-opacity: 0.42;
}

.tint--range[b-o1vhs6e2i5] {
    fill: var(--color-accent);
    fill-opacity: 0.3;
    stroke: var(--color-accent);
    stroke-width: 2;
}

.tint--long[b-o1vhs6e2i5] {
    fill: var(--color-accent);
    fill-opacity: 0.12;
    stroke: var(--color-accent);
    stroke-dasharray: 6 6;
    stroke-width: 2;
}

.fog[b-o1vhs6e2i5] {
    fill: var(--color-fog);
}

.fog--hidden[b-o1vhs6e2i5] {
    fill-opacity: 0.55;
}

.fog--explored[b-o1vhs6e2i5] {
    fill-opacity: 0.3;
}

.is-players .fog--hidden[b-o1vhs6e2i5] {
    fill-opacity: 1;
}

.is-players .fog--explored[b-o1vhs6e2i5] {
    fill-opacity: 0.65;
}

.wall[b-o1vhs6e2i5] {
    stroke: var(--color-accent);
    stroke-opacity: 0.5;
    stroke-width: 4;
    stroke-linecap: round;
}

.is-walls .wall[b-o1vhs6e2i5] {
    stroke-opacity: 1;
}

.wall-start[b-o1vhs6e2i5] {
    fill: var(--color-accent);
    stroke: var(--color-bg);
    stroke-width: 2;
}

.ruler[b-o1vhs6e2i5] {
    stroke: var(--color-text);
    stroke-width: 3;
    stroke-dasharray: 8 6;
}

.ruler-end[b-o1vhs6e2i5] {
    fill: none;
    stroke: var(--color-text);
    stroke-width: 3;
}

.ruler-label[b-o1vhs6e2i5] {
    position: absolute;
    padding: var(--space-1) 10px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    font-weight: 700;
    white-space: nowrap;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.token[b-o1vhs6e2i5] {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 50%;
    border: 3px solid var(--color-line);
    background: var(--color-raised);
    color: var(--color-text);
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.token--pc[b-o1vhs6e2i5] {
    border-color: var(--color-accent);
}

.token--foe[b-o1vhs6e2i5] {
    border-color: var(--color-danger);
}

.token.is-selected[b-o1vhs6e2i5] {
    box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--color-muted);
}

.token.is-active[b-o1vhs6e2i5] {
    box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 6px var(--color-text);
}

.token.is-unseen[b-o1vhs6e2i5] {
    border-style: dashed;
    opacity: 0.7;
}

.token.is-down[b-o1vhs6e2i5] {
    opacity: 0.45;
}

.token.is-dragging[b-o1vhs6e2i5] {
    opacity: 0.3;
}

/* The copy that follows the pointer while a token is dragged (wwwroot/js/lanternlight.js, mapSurface) */
.token.swap-ghost[b-o1vhs6e2i5] {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

/* Our own art, round with a transparent edge; the border around it still tells friend from foe. */
.token__picture[b-o1vhs6e2i5] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    pointer-events: none;
    user-select: none;
}

.token.is-down .token__picture[b-o1vhs6e2i5] {
    filter: grayscale(1);
}

.token__hp[b-o1vhs6e2i5] {
    position: absolute;
    right: 15%;
    bottom: -7px;
    left: 15%;
    height: 4px;
    overflow: hidden;
    border-radius: 2px;
    background: var(--color-track);
}

.token__condition[b-o1vhs6e2i5] {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    border: 2px solid var(--color-bg);
    background: var(--color-danger);
}
/* /Components/TokenPicker.razor.rz.scp.css */
.tokens[b-ewzyjffwt5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.tokens__head[b-ewzyjffwt5] {
    display: flex;
    align-self: stretch;
    align-items: center;
    justify-content: space-between;
}

.tokens__title[b-ewzyjffwt5] {
    font-weight: 700;
}

/* A long list (all characters, all monsters) scrolls inside the picker, not the page. */
.tokens__grid[b-ewzyjffwt5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
    align-self: stretch;
    gap: var(--space-2);
    max-height: 420px;
    overflow-y: auto;
}

.tokens__option[b-ewzyjffwt5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2);
    border: 2px solid transparent;
    border-radius: var(--radius-md);
    background: none;
    color: var(--color-text);
    cursor: pointer;
}

.tokens__option:hover[b-ewzyjffwt5] {
    border-color: var(--color-line);
}

.tokens__option.is-chosen[b-ewzyjffwt5] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.tokens__picture[b-ewzyjffwt5] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
}

.tokens__name[b-ewzyjffwt5] {
    font-size: 12px;
    line-height: 1.25;
    text-align: center;
    color: var(--color-muted);
}
/* /Components/VoicePanel.razor.rz.scp.css */
.voice[b-1kz8s7pwrj] {
    position: fixed;
    top: 72px;
    right: var(--space-4);
    z-index: 45;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: min(360px, calc(100vw - 2 * var(--space-4)));
    max-height: calc(100vh - 96px);
    overflow-y: auto;
    padding: var(--space-3) var(--space-4) var(--space-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    box-shadow: 0 12px 32px var(--color-fog);
}

.voice__head[b-1kz8s7pwrj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.voice__title[b-1kz8s7pwrj] {
    font-size: 18px;
}

.voice__intro[b-1kz8s7pwrj],
.voice__present[b-1kz8s7pwrj],
.voice__alone[b-1kz8s7pwrj] {
    margin: 0;
}

.voice__whispering[b-1kz8s7pwrj] {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px dashed var(--color-accent);
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-style: italic;
}

.voice__people[b-1kz8s7pwrj] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.person[b-1kz8s7pwrj] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 2px var(--space-3);
}

.person[b-1kz8s7pwrj]  .avatar {
    grid-row: span 2;
    transition: box-shadow 120ms ease-out;
}

.person--speaking[b-1kz8s7pwrj]  .avatar {
    box-shadow: 0 0 0 3px var(--color-accent-soft);
}

.person__name[b-1kz8s7pwrj] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-weight: 600;
}

.person__dm[b-1kz8s7pwrj] {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.person__state[b-1kz8s7pwrj] {
    grid-column: 2;
    min-height: 1.2em;
    font-size: 13px;
    color: var(--color-muted);
}

.person--speaking .person__state[b-1kz8s7pwrj] {
    color: var(--color-accent);
}

.person__whisper[b-1kz8s7pwrj] {
    color: var(--color-accent);
    font-style: italic;
}

.person__volume[b-1kz8s7pwrj] {
    grid-column: 3;
    grid-row: 1 / span 2;
    width: 88px;
    accent-color: var(--color-accent);
}

.voice__controls[b-1kz8s7pwrj] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-2);
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.voice__to[b-1kz8s7pwrj] {
    flex: 1 1 140px;
}

.voice__problem[b-1kz8s7pwrj] {
    margin: 0;
    color: var(--color-danger);
}

@media (max-width: 600px) {
    .voice[b-1kz8s7pwrj] {
        top: auto;
        bottom: var(--space-4);
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
.topbar[b-pys3lguask] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3) var(--space-6);
    padding: var(--space-3) var(--space-6);
    background: var(--color-panel);
    border-bottom: 1px solid var(--color-line);
}

.brand[b-pys3lguask] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--color-text);
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.brand svg[b-pys3lguask] {
    color: var(--color-accent);
}

.nav[b-pys3lguask] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
}

.nav[b-pys3lguask]  .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    border-radius: var(--radius-sm);
    color: var(--color-muted);
    font-weight: 600;
    text-decoration: none;
}

.nav[b-pys3lguask]  a.nav-link:hover {
    color: var(--color-text);
}

.nav[b-pys3lguask]  a.nav-link.active {
    background: var(--color-accent-soft);
    color: var(--color-accent);
}

.tools[b-pys3lguask] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.saved[b-pys3lguask] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--color-muted);
}

.saved svg[b-pys3lguask] {
    color: var(--color-good);
}

.saved--campaign[b-pys3lguask] {
    gap: var(--space-2);
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    color: var(--color-text);
    text-decoration: none;
}

.saved--campaign:hover[b-pys3lguask] {
    border-color: var(--color-accent);
}

.saved__name[b-pys3lguask] {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.saved__role[b-pys3lguask] {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.dot[b-pys3lguask] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-muted);
}

.dot--online[b-pys3lguask] {
    background: var(--color-good);
}

.dot--connecting[b-pys3lguask] {
    background: var(--color-accent);
}

.dot--offline[b-pys3lguask] {
    background: var(--color-danger);
}

.unread[b-pys3lguask] {
    min-width: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: var(--color-accent);
    color: var(--color-on-accent);
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
}

.in-voice[b-pys3lguask] {
    min-width: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: var(--color-raised);
    color: var(--color-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
}

.voice-button--on[b-pys3lguask] {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.voice-button--on .in-voice[b-pys3lguask] {
    background: var(--color-accent-soft);
    color: var(--color-accent);
}

.assistant-button--waiting[b-pys3lguask] {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.voice-button--speaking[b-pys3lguask] {
    box-shadow: 0 0 0 3px var(--color-accent-soft);
}

.banner[b-pys3lguask] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    padding: var(--space-3) var(--space-6);
    background: var(--color-danger-soft);
    color: var(--color-danger);
}

.content[b-pys3lguask] {
    max-width: 1440px;
    margin: 0 auto;
    padding: var(--space-6);
}

/* On a wide screen the page moves aside for the chat or the assistant, so the table stays in view. */
@media (min-width: 1100px) {
    .content--beside-chat[b-pys3lguask] {
        margin-right: 380px;
    }

    .content--beside-assistant[b-pys3lguask] {
        margin-right: 420px;
    }
}

@media (max-width: 600px) {
    .topbar[b-pys3lguask],
    .content[b-pys3lguask] {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }
}
/* /Pages/Adventures.razor.rz.scp.css */
.page-head[b-wb5kjq2fua] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

h1[b-wb5kjq2fua] {
    margin-top: 2px;
}

.intro[b-wb5kjq2fua] {
    max-width: 680px;
    margin: var(--space-2) 0 0;
}

.small[b-wb5kjq2fua] {
    margin: 0;
    font-size: 13px;
}

.warn[b-wb5kjq2fua] {
    color: var(--color-danger);
    font-weight: 600;
}

.danger[b-wb5kjq2fua] {
    color: var(--color-danger);
}

.buttons[b-wb5kjq2fua] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.adventures-layout[b-wb5kjq2fua] {
    display: grid;
    grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-5);
}

.side[b-wb5kjq2fua],
.main[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

/* The list of adventures */

.list[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.list__item[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    min-height: var(--control-height);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    color: var(--color-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.list__item.is-on[b-wb5kjq2fua] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.list__name[b-wb5kjq2fua] {
    font-weight: 700;
    overflow-wrap: anywhere;
}

.list__meta[b-wb5kjq2fua] {
    font-size: 13px;
}

.sample[b-wb5kjq2fua] {
    justify-content: flex-start;
    text-align: left;
}

[b-wb5kjq2fua] .file {
    width: 100%;
    padding: var(--space-1);
}

[b-wb5kjq2fua] .file::file-selector-button {
    min-height: 34px;
    margin-right: var(--space-3);
    padding: 0 var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    color: var(--color-text);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.paste[b-wb5kjq2fua] {
    font-family: ui-monospace, Consolas, monospace;
    font-size: 13px;
}

/* One adventure */

.adventure__head[b-wb5kjq2fua] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
}

.adventure__name[b-wb5kjq2fua] {
    margin: 0;
}

.adventure__summary[b-wb5kjq2fua] {
    max-width: 640px;
    margin: var(--space-1) 0 0;
}

.start-options[b-wb5kjq2fua] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-5);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-line);
}

.scenes[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.scene[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.scene.is-playing[b-wb5kjq2fua] {
    border-color: var(--color-accent);
}

.scene__head[b-wb5kjq2fua] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.scene__number[b-wb5kjq2fua] {
    display: grid;
    place-items: center;
    flex: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-family: var(--font-display);
    font-weight: 700;
}

.scene__text[b-wb5kjq2fua] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.scene__name[b-wb5kjq2fua] {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.scene__meta[b-wb5kjq2fua] {
    font-size: 13px;
    overflow-wrap: anywhere;
}

.scene__read[b-wb5kjq2fua] {
    margin: 0;
    padding-left: var(--space-3);
    border-left: 3px solid var(--color-line);
    color: var(--color-muted);
    font-style: italic;
}

/* The scene editor */

.editor[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.editor h3[b-wb5kjq2fua] {
    margin: 0;
    font-size: 17px;
}

.editor__section[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.editor__section h4[b-wb5kjq2fua] {
    margin: 0;
    font-size: 15px;
}

.map-row[b-wb5kjq2fua] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
}

.map-row p[b-wb5kjq2fua] {
    margin: 0;
}

.map-row__name[b-wb5kjq2fua] {
    font-weight: 700;
    overflow-wrap: anywhere;
}

.map-thumb[b-wb5kjq2fua] {
    width: 160px;
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
}

.upload[b-wb5kjq2fua] {
    cursor: pointer;
}

.creatures[b-wb5kjq2fua] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.creature[b-wb5kjq2fua] {
    display: grid;
    grid-template-columns: minmax(110px, 1.2fr) minmax(110px, 1.2fr) 80px minmax(130px, 1fr) 76px auto;
    align-items: center;
    gap: var(--space-2);
}

.creature--head[b-wb5kjq2fua] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.creature__monster[b-wb5kjq2fua] {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.creature__friendly[b-wb5kjq2fua] {
    justify-content: center;
}

.add-creature[b-wb5kjq2fua] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 76px auto;
    gap: var(--space-2);
}

@media (max-width: 960px) {
    .adventures-layout[b-wb5kjq2fua] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 700px) {
    .creature[b-wb5kjq2fua] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        padding-bottom: var(--space-2);
        border-bottom: 1px solid var(--color-line);
    }

    .creature--head[b-wb5kjq2fua] {
        display: none;
    }

    .creature__friendly[b-wb5kjq2fua] {
        justify-content: flex-start;
    }
}
/* /Pages/Bestiary.razor.rz.scp.css */
/* Monster list, stat block and the encounter builder; they stack on narrow screens */

.bestiary-layout[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

/* Monster list */

.list[b-n54y4xzbun] {
    display: flex;
    flex: 1 1 280px;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.filters[b-n54y4xzbun] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.filters__wide[b-n54y4xzbun] {
    grid-column: 1 / -1;
}

.monsters[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    max-height: min(640px, 70vh);
    overflow-y: auto;
    margin: 0 calc(-1 * var(--space-1));
    padding: 0 var(--space-1);
}

.monster[b-n54y4xzbun] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 52px;
    padding: 6px 10px;
    border-radius: var(--radius-md);
    color: var(--color-text);
    text-decoration: none;
}

.monster:hover[b-n54y4xzbun],
.monster.is-on[b-n54y4xzbun] {
    background: var(--color-raised);
}

.monster.is-on[b-n54y4xzbun] {
    box-shadow: inset 3px 0 0 var(--color-accent);
}

.monster__text[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.monster__name[b-n54y4xzbun] {
    font-weight: 700;
}

.monster__kind[b-n54y4xzbun] {
    font-size: 13px;
    color: var(--color-muted);
}

.cr[b-n54y4xzbun] {
    flex: none;
    padding: 2px var(--space-2);
    border-radius: 10px;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-size: 12px;
    font-weight: 700;
}

.create[b-n54y4xzbun] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--control-height);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-line);
    font-weight: 700;
    text-decoration: none;
}

.create:hover[b-n54y4xzbun] {
    border-color: var(--color-accent);
}

.note[b-n54y4xzbun] {
    margin: 0;
    font-size: 12px;
    color: var(--color-muted);
}

/* Stat block */

.statblock[b-n54y4xzbun],
.bestiary-layout[b-n54y4xzbun]  .statblock {
    display: flex;
    flex: 999 1 520px;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    padding: var(--space-6);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.statblock__head[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-3);
}

.statblock h1[b-n54y4xzbun] {
    color: var(--color-accent);
}

.meta[b-n54y4xzbun] {
    font-style: italic;
    color: var(--color-muted);
}

.source[b-n54y4xzbun] {
    margin-top: 2px;
    font-size: 13px;
    color: var(--color-accent);
}

.statblock__tools[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    align-self: flex-start;
    gap: var(--space-2);
}

.rule[b-n54y4xzbun] {
    height: 2px;
    background: var(--color-accent);
    opacity: 0.6;
}

.core[b-n54y4xzbun] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: var(--space-2);
}

.label[b-n54y4xzbun] {
    font-weight: 700;
    color: var(--color-accent);
}

.link-roll[b-n54y4xzbun] {
    padding: 0;
    border: 0;
    border-bottom: 1px dashed var(--color-line);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.link-roll:hover[b-n54y4xzbun] {
    border-bottom-color: var(--color-accent);
}

.abilities[b-n54y4xzbun] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
}

.ability[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--space-2) var(--space-1);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
    text-align: center;
}

.ability__key[b-n54y4xzbun] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--color-muted);
}

.ability__score[b-n54y4xzbun] {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
}

.ability__mod[b-n54y4xzbun] {
    font-size: 13px;
}

.ability__save[b-n54y4xzbun] {
    min-height: 32px;
    margin-top: 2px;
    padding: 0 var(--space-2);
    border-radius: 16px;
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    color: var(--color-muted);
    font-size: 13px;
    white-space: nowrap;
    cursor: pointer;
}

.ability__save:hover[b-n54y4xzbun] {
    border-color: var(--color-accent);
}

.ability__save.is-proficient[b-n54y4xzbun] {
    border-color: var(--color-accent);
    color: var(--color-accent);
    font-weight: 600;
}

.lines[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.section[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.section h2[b-n54y4xzbun] {
    font-size: 18px;
    color: var(--color-accent);
}

.entry[b-n54y4xzbun] {
    margin: 0;
}

.entry__intro[b-n54y4xzbun] {
    margin: 0;
    color: var(--color-muted);
}

.entry--roll[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.entry__text[b-n54y4xzbun] {
    flex: 1 1 300px;
    margin: 0;
}

.entry__name[b-n54y4xzbun] {
    font-weight: 700;
    font-style: italic;
}

.entry__buttons[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.btn--small[b-n54y4xzbun] {
    min-height: 40px;
    padding: 0 14px;
}

.damage[b-n54y4xzbun] {
    background: var(--color-panel);
}

.damage.is-critical[b-n54y4xzbun] {
    border-color: var(--color-accent);
    color: var(--color-accent);
    font-weight: 700;
}

.dc[b-n54y4xzbun] {
    padding: 2px var(--space-2);
    border-radius: 10px;
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-size: 13px;
    font-weight: 700;
}

/* Rolls and the encounter builder */

.side[b-n54y4xzbun] {
    display: flex;
    flex: 1 1 300px;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.side[b-n54y4xzbun]  .panel {
    gap: var(--space-3);
    padding: var(--space-4);
}

.last-roll[b-n54y4xzbun] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: 14px var(--space-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-accent);
    background: var(--color-accent-soft);
}

.last-roll__text[b-n54y4xzbun] {
    min-width: 0;
}

.last-roll__label[b-n54y4xzbun] {
    font-size: 13px;
    color: var(--color-muted);
}

.last-roll__detail[b-n54y4xzbun] {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.last-roll__total[b-n54y4xzbun] {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 700;
}

.last-roll__total--critical[b-n54y4xzbun] {
    color: var(--color-accent);
}

.last-roll__total--fumble[b-n54y4xzbun] {
    color: var(--color-danger);
}

.side[b-n54y4xzbun]  .segmented {
    align-self: flex-start;
}

.add[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.add__button[b-n54y4xzbun] {
    flex: 1 1 auto;
}

.stepper[b-n54y4xzbun] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.stepper__value[b-n54y4xzbun] {
    min-width: 32px;
    text-align: center;
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
}

.stepper--small .btn--icon[b-n54y4xzbun] {
    width: 36px;
    min-height: 36px;
    font-size: 16px;
}

.stepper--small .stepper__value[b-n54y4xzbun] {
    min-width: 24px;
    font-size: 17px;
}

.eyebrow[b-n54y4xzbun] {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.party__summary[b-n54y4xzbun] {
    font-size: 13px;
}

.party[b-n54y4xzbun] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.party__item[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.party__label[b-n54y4xzbun] {
    font-size: 12px;
    color: var(--color-muted);
}

.planned[b-n54y4xzbun] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) 10px;
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.planned__xp[b-n54y4xzbun] {
    font-size: 13px;
}

.planned__remove[b-n54y4xzbun] {
    width: 36px;
    min-height: 36px;
    border-color: transparent;
    color: var(--color-muted);
}

.difficulty[b-n54y4xzbun] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.difficulty__head[b-n54y4xzbun] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-2);
}

.difficulty__title[b-n54y4xzbun],
.difficulty__value[b-n54y4xzbun] {
    font-weight: 700;
}

.bar[b-n54y4xzbun] {
    height: 10px;
    border-radius: 5px;
    overflow: hidden;
    background: var(--color-track);
}

.bar__fill[b-n54y4xzbun] {
    height: 100%;
    background: currentColor;
}

.difficulty--belowlow[b-n54y4xzbun] {
    color: var(--color-muted);
}

.difficulty--low[b-n54y4xzbun] {
    color: var(--color-good);
}

.difficulty--moderate[b-n54y4xzbun] {
    color: var(--color-accent);
}

.difficulty--high[b-n54y4xzbun],
.difficulty--beyondhigh[b-n54y4xzbun] {
    color: var(--color-danger);
}

.thresholds[b-n54y4xzbun] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-1);
    font-size: 12px;
    color: var(--color-muted);
}

.thresholds span:nth-child(2)[b-n54y4xzbun] {
    text-align: center;
}

.thresholds span:nth-child(3)[b-n54y4xzbun] {
    text-align: right;
}

.error[b-n54y4xzbun] {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-weight: 600;
}

/* Stacked: a picked monster comes first, the list after it */
@media (max-width: 860px) {
    .has-pick .statblock[b-n54y4xzbun] {
        order: -1;
    }
}

@media (max-width: 600px) {
    .statblock[b-n54y4xzbun],
    .bestiary-layout[b-n54y4xzbun]  .statblock {
        padding: var(--space-4);
    }

    .abilities[b-n54y4xzbun] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .monsters[b-n54y4xzbun] {
        max-height: 320px;
    }
}
/* /Pages/CampaignPage.razor.rz.scp.css */
.campaign-head[b-pn04u64eqn] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

h1[b-pn04u64eqn] {
    margin-top: 2px;
}

.notice[b-pn04u64eqn] {
    margin: 0 0 var(--space-4);
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-weight: 600;
}

.notice--error[b-pn04u64eqn] {
    background: var(--color-danger-soft);
    color: var(--color-danger);
}

.campaign-grid[b-pn04u64eqn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    align-items: start;
    gap: var(--space-5);
}

.stack[b-pn04u64eqn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.campaign-grid > .stack[b-pn04u64eqn] {
    gap: var(--space-5);
}

.row[b-pn04u64eqn] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.grow[b-pn04u64eqn] {
    flex: 1;
    min-width: 0;
}

.hint[b-pn04u64eqn] {
    font-size: 13px;
}

.list[b-pn04u64eqn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin: 0 0 var(--space-3);
    padding: 0;
    list-style: none;
}

.list__row[b-pn04u64eqn] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: var(--control-height);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.member__name[b-pn04u64eqn] {
    display: block;
    font-weight: 600;
}

.member__plays[b-pn04u64eqn] {
    display: block;
    font-size: 13px;
}

.presence[b-pn04u64eqn] {
    flex: none;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid var(--color-muted);
}

.presence--on[b-pn04u64eqn] {
    border-color: var(--color-good);
    background: var(--color-good);
}

.invitations[b-pn04u64eqn] {
    margin-top: var(--space-3);
}

.invitation[b-pn04u64eqn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.invitation__line[b-pn04u64eqn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.link[b-pn04u64eqn] {
    width: 100%;
    font-size: 13px;
    color: var(--color-muted);
}

.picks[b-pn04u64eqn] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.rule[b-pn04u64eqn] {
    margin: var(--space-4) 0;
    border: 0;
    border-top: 1px solid var(--color-line);
}

.subhead[b-pn04u64eqn] {
    margin-top: var(--space-4);
    font-size: 15px;
}

.setup[b-pn04u64eqn] {
    width: 100%;
    min-height: 180px;
    font-family: monospace;
    font-size: 12px;
    color: var(--color-muted);
    resize: vertical;
}

.command[b-pn04u64eqn] {
    padding: var(--space-3);
    overflow-x: auto;
    border-radius: var(--radius-sm);
    background: var(--color-raised);
    color: var(--color-accent);
}
/* /Pages/CharacterBuilder.razor.rz.scp.css */
.builder-head[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.back[b-ahw6ar1w9t] {
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.back:hover[b-ahw6ar1w9t] {
    text-decoration: underline;
}

h1[b-ahw6ar1w9t] {
    margin-top: var(--space-1);
}

.builder-head__side[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    font-size: 14px;
}

.start-over[b-ahw6ar1w9t] {
    min-height: 36px;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-muted);
    font-size: 13px;
}

.small[b-ahw6ar1w9t] {
    font-size: 12px;
}

.is-good[b-ahw6ar1w9t] {
    color: var(--color-good);
}

.is-bad[b-ahw6ar1w9t] {
    color: var(--color-danger);
}

.is-accent[b-ahw6ar1w9t] {
    color: var(--color-accent);
}

/* Steps */

.steps[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--space-2);
    margin-bottom: var(--space-5);
}

.step[b-ahw6ar1w9t] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 52px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    text-align: left;
    cursor: pointer;
}

.step:hover[b-ahw6ar1w9t],
.step.is-current[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.step.is-current[b-ahw6ar1w9t] {
    background: var(--color-accent-soft);
}

.step__mark[b-ahw6ar1w9t] {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 14px;
    background: var(--color-raised);
    color: var(--color-muted);
    font-size: 14px;
    font-weight: 700;
}

.step.is-done .step__mark[b-ahw6ar1w9t] {
    background: var(--color-good);
    color: var(--color-on-accent);
}

.step.is-current .step__mark[b-ahw6ar1w9t] {
    background: var(--color-accent);
    color: var(--color-on-accent);
}

.step__text[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.step__label[b-ahw6ar1w9t] {
    font-weight: 700;
}

.step__value[b-ahw6ar1w9t] {
    overflow: hidden;
    font-size: 12px;
    color: var(--color-muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The current step and the summary beside it */

.builder-layout[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

.step-panel[b-ahw6ar1w9t] {
    display: flex;
    flex: 999 1 640px;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding: var(--space-6);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.step-panel h2[b-ahw6ar1w9t] {
    font-size: 22px;
}

.help[b-ahw6ar1w9t] {
    display: flex;
    gap: var(--space-3);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.help svg[b-ahw6ar1w9t] {
    flex: none;
    margin-top: 2px;
    color: var(--color-accent);
}

.help__title[b-ahw6ar1w9t] {
    font-weight: 700;
}

.help__text[b-ahw6ar1w9t] {
    font-size: 14px;
    color: var(--color-muted);
}

.section-head[b-ahw6ar1w9t],
.choice__head[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.cards[b-ahw6ar1w9t] {
    display: grid;
    gap: 10px;
}

.cards--class[b-ahw6ar1w9t] {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}

.cards--background[b-ahw6ar1w9t] {
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}

.cards--species[b-ahw6ar1w9t] {
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
}

.cards--rolls[b-ahw6ar1w9t] {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--space-2);
}

.pick[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: 14px;
    border-radius: var(--radius-md);
    border: 2px solid var(--color-line);
    background: var(--color-raised);
    text-align: left;
    cursor: pointer;
}

.pick:hover[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.pick.is-on[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.pick--small[b-ahw6ar1w9t] {
    gap: 2px;
    padding: 10px var(--space-3);
}

.pick__name[b-ahw6ar1w9t] {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 700;
}

.pick__tag[b-ahw6ar1w9t] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--color-accent);
}

/* Content from one of the group’s own packs, not the SRD */
.pick__pack[b-ahw6ar1w9t] {
    align-self: flex-start;
    padding: 1px var(--space-2);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    font-size: 12px;
    font-weight: 600;
    color: var(--color-muted);
}

.pick__text[b-ahw6ar1w9t] {
    font-size: 14px;
    color: var(--color-muted);
}

.pick__line[b-ahw6ar1w9t] {
    font-size: 14px;
}

.pick__label[b-ahw6ar1w9t] {
    font-weight: 700;
}

.pick__note[b-ahw6ar1w9t] {
    font-size: 12px;
    color: var(--color-muted);
}

.facts[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
    padding: 14px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.facts__label[b-ahw6ar1w9t],
.checklist__title[b-ahw6ar1w9t] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.choice[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: 14px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.choice__title[b-ahw6ar1w9t] {
    font-weight: 700;
}

.choice__note[b-ahw6ar1w9t] {
    font-size: 14px;
    color: var(--color-muted);
}

.choice[b-ahw6ar1w9t]  .segmented {
    background: var(--color-panel);
}

.choice[b-ahw6ar1w9t]  .segmented__option.is-selected {
    background: var(--color-raised);
}

.chips[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chip[b-ahw6ar1w9t] {
    min-height: 40px;
    padding: 0 14px;
    border-radius: 20px;
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.chip:hover:not(:disabled)[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.chip.is-on[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-on-accent);
}

.chip:disabled[b-ahw6ar1w9t] {
    opacity: 0.45;
    cursor: not-allowed;
}

.increase[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.increase__label[b-ahw6ar1w9t] {
    width: 64px;
    font-weight: 700;
    color: var(--color-accent);
}

.increase__option[b-ahw6ar1w9t] {
    min-width: 72px;
    min-height: 40px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    font-weight: 700;
    cursor: pointer;
}

.increase__option:hover[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.increase__option.is-on[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-on-accent);
}

/* Ability scores */

.budget[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.budget__left[b-ahw6ar1w9t] {
    font-weight: 700;
}

.budget__note[b-ahw6ar1w9t] {
    font-size: 13px;
    color: var(--color-muted);
}

.budget__bar[b-ahw6ar1w9t] {
    flex: 0 1 260px;
    height: 10px;
    overflow: hidden;
    border-radius: 5px;
    background: var(--color-track);
}

.budget__fill[b-ahw6ar1w9t] {
    height: 100%;
    background: var(--color-accent);
}

.arrange[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.arrange__hint[b-ahw6ar1w9t] {
    flex: 1 1 260px;
    font-size: 14px;
    color: var(--color-muted);
}

.arrange .btn[b-ahw6ar1w9t] {
    min-height: 40px;
}

.btn--outline[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: transparent;
    color: var(--color-accent);
    font-weight: 700;
}

.rolled[b-ahw6ar1w9t] {
    font-size: 13px;
    color: var(--color-muted);
}

.score-table[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.score-row[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-2);
    align-items: center;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.score-row--head[b-ahw6ar1w9t] {
    padding-top: 0;
    padding-bottom: 0;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.score-row__name[b-ahw6ar1w9t] {
    font-weight: 700;
}

.narrow[b-ahw6ar1w9t] {
    display: none;
}

.primary[b-ahw6ar1w9t] {
    margin-left: 6px;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
}

.tile[b-ahw6ar1w9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    width: 104px;
    max-width: 100%;
    min-height: 48px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-md);
    border: 2px solid var(--color-line);
    background: var(--color-panel);
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.tile:hover:not(:disabled)[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.tile:disabled[b-ahw6ar1w9t] {
    cursor: default;
}

.tile.is-picked[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-on-accent);
}

.tile.is-dragging[b-ahw6ar1w9t] {
    opacity: 0.4;
}

.tile.is-drop-target[b-ahw6ar1w9t] {
    border-style: dashed;
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.tile__grip[b-ahw6ar1w9t] {
    flex: none;
    opacity: 0.6;
}

.tile__value[b-ahw6ar1w9t],
.number[b-ahw6ar1w9t],
.stepper__value[b-ahw6ar1w9t] {
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
}

.tile__value[b-ahw6ar1w9t] {
    font-size: 22px;
}

.number--accent[b-ahw6ar1w9t] {
    color: var(--color-accent);
}

.bonus[b-ahw6ar1w9t] {
    font-weight: 700;
    color: var(--color-muted);
}

.bonus.is-on[b-ahw6ar1w9t] {
    color: var(--color-good);
}

.stepper[b-ahw6ar1w9t] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.stepper__button[b-ahw6ar1w9t] {
    flex: none;
    width: 36px;
    height: 40px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    font-size: 18px;
    cursor: pointer;
}

.stepper__button:disabled[b-ahw6ar1w9t] {
    opacity: 0.4;
    cursor: not-allowed;
}

.stepper__value[b-ahw6ar1w9t] {
    min-width: 28px;
    text-align: center;
}

/* Skills */

.count[b-ahw6ar1w9t] {
    font-weight: 700;
    color: var(--color-accent);
}

.count.is-good[b-ahw6ar1w9t] {
    color: var(--color-good);
}

.skill-options[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-2);
}

.skill-option[b-ahw6ar1w9t] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    text-align: left;
    cursor: pointer;
}

.skill-option:hover:not(:disabled)[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
}

.skill-option.is-on[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.skill-option:disabled[b-ahw6ar1w9t] {
    cursor: not-allowed;
}

.skill-option:disabled:not(.is-on)[b-ahw6ar1w9t] {
    opacity: 0.45;
}

.box[b-ahw6ar1w9t] {
    flex: none;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 2px solid var(--color-muted);
}

.skill-option.is-on .box[b-ahw6ar1w9t] {
    border-color: var(--color-accent);
    background: var(--color-accent);
}

.skill-option__name[b-ahw6ar1w9t] {
    flex: 1 1 auto;
}

.skill-option__note[b-ahw6ar1w9t] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-accent);
}

/* Finish */

.name-field[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 420px;
}

.name-field label[b-ahw6ar1w9t] {
    font-weight: 700;
}

.review-stats[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
}

.review[b-ahw6ar1w9t] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.review__box[b-ahw6ar1w9t] {
    flex: 1 1 240px;
    padding: 14px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.review__box h3[b-ahw6ar1w9t] {
    margin-bottom: 6px;
    font-family: var(--font-body);
    font-size: 15px;
}

.review__line[b-ahw6ar1w9t] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-2);
    padding: 2px 0;
}

.review__text[b-ahw6ar1w9t] {
    font-size: 14px;
}

.missing[b-ahw6ar1w9t] {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-accent-soft);
    font-weight: 600;
}

.step-nav[b-ahw6ar1w9t] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-line);
}

.btn--large[b-ahw6ar1w9t] {
    min-height: 48px;
    padding: 0 var(--space-6);
    border-radius: var(--radius-md);
    font-weight: 700;
}

/* Summary */

.summary[b-ahw6ar1w9t] {
    display: flex;
    flex: 1 1 300px;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    padding: var(--space-5);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.summary__head[b-ahw6ar1w9t] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.summary__title[b-ahw6ar1w9t] {
    min-width: 0;
}

.summary__name[b-ahw6ar1w9t] {
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
}

.summary__scores[b-ahw6ar1w9t] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.mini[b-ahw6ar1w9t] {
    padding: var(--space-2) var(--space-1);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
    text-align: center;
}

.mini__label[b-ahw6ar1w9t] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.mini__value[b-ahw6ar1w9t] {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
}

.mini__note[b-ahw6ar1w9t] {
    min-height: 1.2em;
    font-size: 13px;
    color: var(--color-accent);
}

.checklist[b-ahw6ar1w9t] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.checklist__line[b-ahw6ar1w9t] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-2);
    font-size: 14px;
}

@media (max-width: 600px) {
    .step-panel[b-ahw6ar1w9t] {
        padding: var(--space-4);
    }

    .wide[b-ahw6ar1w9t] {
        display: none;
    }

    .narrow[b-ahw6ar1w9t] {
        display: inline;
    }

    .score-row[b-ahw6ar1w9t] {
        grid-template-columns: minmax(0, 0.9fr) minmax(100px, 1.4fr) repeat(3, minmax(0, 0.7fr));
        gap: 6px;
        padding: var(--space-2);
    }

    .primary[b-ahw6ar1w9t] {
        display: block;
        margin-left: 0;
        font-size: 10px;
    }

    .tile[b-ahw6ar1w9t] {
        width: 100%;
        padding: 0 var(--space-2);
    }

    .stepper[b-ahw6ar1w9t] {
        gap: 2px;
    }

    .stepper__button[b-ahw6ar1w9t] {
        width: 30px;
    }
}
/* /Pages/Characters.razor.rz.scp.css */
.page-head[b-fqijqkuh0l] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.eyebrow[b-fqijqkuh0l] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

h1[b-fqijqkuh0l] {
    margin-top: 2px;
}

.empty[b-fqijqkuh0l] {
    max-width: 640px;
}

.empty p[b-fqijqkuh0l] {
    margin: 0;
}

.empty__actions[b-fqijqkuh0l] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.roster[b-fqijqkuh0l] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

.card[b-fqijqkuh0l] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    height: 100%;
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    color: var(--color-text);
    text-decoration: none;
}

.card:hover[b-fqijqkuh0l] {
    border-color: var(--color-accent);
}

.card__head[b-fqijqkuh0l] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
}

.card__title[b-fqijqkuh0l] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.card__name[b-fqijqkuh0l] {
    font-family: var(--font-display);
    font-size: 19px;
    font-weight: 700;
}

.card__sub[b-fqijqkuh0l] {
    font-size: 14px;
    color: var(--color-muted);
}

.card__player[b-fqijqkuh0l] {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent);
}

.card__stats[b-fqijqkuh0l] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1) var(--space-4);
    font-size: 14px;
}

.card__stats strong[b-fqijqkuh0l] {
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.card--new[b-fqijqkuh0l] {
    align-items: center;
    justify-content: center;
    min-height: 140px;
    border-style: dashed;
    background: transparent;
    color: var(--color-accent);
    font-weight: 700;
}

.hp-bar[b-fqijqkuh0l] {
    display: block;
    height: 6px;
    overflow: hidden;
    border-radius: 3px;
    background: var(--color-track);
}

.hp-bar__fill[b-fqijqkuh0l] {
    display: block;
    height: 100%;
}

.hp-bar__fill.hp--high[b-fqijqkuh0l] {
    background: var(--color-good);
}

.hp-bar__fill.hp--mid[b-fqijqkuh0l] {
    background: var(--color-accent);
}

.hp-bar__fill.hp--low[b-fqijqkuh0l] {
    background: var(--color-danger);
}
/* /Pages/CharacterSheet.razor.rz.scp.css */
/* Party list on the left, the sheet on the right; they stack on narrow screens */

.sheet-layout[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

.party[b-fj1h8n6ovk] {
    display: flex;
    flex: 1 1 240px;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.party__title[b-fj1h8n6ovk] {
    margin-bottom: 6px;
}

.party__member[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: 10px;
    border-radius: var(--radius-md);
    color: var(--color-text);
    text-decoration: none;
}

.party__member:hover[b-fj1h8n6ovk],
.party__member.is-current[b-fj1h8n6ovk] {
    background: var(--color-raised);
}

.party__text[b-fj1h8n6ovk] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.party__name[b-fj1h8n6ovk] {
    font-weight: 700;
}

.party__sub[b-fj1h8n6ovk] {
    font-size: 13px;
    color: var(--color-muted);
}

.party__new[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--control-height);
    margin-top: var(--space-2);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-line);
    color: var(--color-accent);
    font-weight: 700;
    text-decoration: none;
}

.party__new:hover[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
}

.sheet[b-fj1h8n6ovk] {
    display: flex;
    flex: 999 1 640px;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

/* Overview */

.sheet-layout[b-fj1h8n6ovk]  .overview {
    gap: 18px;
}

.overview__head[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.identity[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    min-width: 0;
}

.played-by[b-fj1h8n6ovk] {
    margin-top: 2px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent);
}

.overview__actions[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.level[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    margin-right: var(--space-2);
}

.level .btn--icon[b-fj1h8n6ovk] {
    width: 36px;
    min-height: 36px;
}

.level__value[b-fj1h8n6ovk] {
    min-width: 64px;
    text-align: center;
    font-weight: 700;
}

.missing[b-fj1h8n6ovk] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-accent);
    background: var(--color-accent-soft);
}

.missing p[b-fj1h8n6ovk] {
    margin: 0;
}

.missing a[b-fj1h8n6ovk] {
    font-weight: 600;
}

.rest[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.rest__title[b-fj1h8n6ovk] {
    font-weight: 700;
}

/* The character's picture opens the token pictures */
.token-button[b-fj1h8n6ovk] {
    flex: none;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: none;
    cursor: pointer;
}

.token-button:hover[b-fj1h8n6ovk],
.token-button[aria-expanded="true"][b-fj1h8n6ovk] {
    box-shadow: 0 0 0 3px var(--color-accent-soft);
}

.rest__note[b-fj1h8n6ovk] {
    font-size: 14px;
    color: var(--color-muted);
}

.rest__controls[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.stepper[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.stepper__value[b-fj1h8n6ovk] {
    min-width: 32px;
    text-align: center;
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 700;
}

.stat-grid[b-fj1h8n6ovk] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}

.of[b-fj1h8n6ovk] {
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 400;
    color: var(--color-muted);
}

.hp-form[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.hp-form__label[b-fj1h8n6ovk] {
    font-weight: 700;
}

.hp-form__amount[b-fj1h8n6ovk] {
    width: 88px;
}

.btn--danger[b-fj1h8n6ovk] {
    border-color: var(--color-danger);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-weight: 700;
}

.btn--good[b-fj1h8n6ovk] {
    border-color: var(--color-good);
    background: transparent;
    color: var(--color-good);
    font-weight: 700;
}

.btn--danger:hover:not(:disabled)[b-fj1h8n6ovk] {
    border-color: var(--color-danger);
}

.btn--good:hover:not(:disabled)[b-fj1h8n6ovk] {
    border-color: var(--color-good);
}

.error[b-fj1h8n6ovk] {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-weight: 600;
}

.last-roll[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) 14px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-accent);
    background: var(--color-accent-soft);
}

.last-roll__text[b-fj1h8n6ovk] {
    min-width: 0;
}

.last-roll__label[b-fj1h8n6ovk] {
    font-size: 13px;
    color: var(--color-muted);
}

.last-roll__detail[b-fj1h8n6ovk] {
    font-weight: 600;
}

.last-roll__side[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.last-roll__side[b-fj1h8n6ovk]  .segmented {
    background: var(--color-panel);
}

.last-roll__side[b-fj1h8n6ovk]  .segmented__option {
    min-height: 36px;
    padding: 0 10px;
    font-size: 13px;
}

.last-roll__side[b-fj1h8n6ovk]  .segmented__option.is-selected {
    background: var(--color-raised);
}

.last-roll__total[b-fj1h8n6ovk] {
    min-width: 48px;
    text-align: right;
    font-family: var(--font-display);
    font-size: 30px;
    font-weight: 700;
}

.last-roll__total--critical[b-fj1h8n6ovk] {
    color: var(--color-accent);
}

.last-roll__total--fumble[b-fj1h8n6ovk] {
    color: var(--color-danger);
}

/* Abilities */

.abilities[b-fj1h8n6ovk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
}

.ability[b-fj1h8n6ovk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: var(--space-3);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.ability__name[b-fj1h8n6ovk] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--color-muted);
}

.ability__check[b-fj1h8n6ovk] {
    width: 72px;
    height: 56px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    font-family: var(--font-display);
    font-size: 26px;
    font-weight: 700;
    cursor: pointer;
}

.ability__check:hover[b-fj1h8n6ovk],
.ability__save:hover[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
}

.ability__score[b-fj1h8n6ovk] {
    font-size: 13px;
    color: var(--color-muted);
}

.ability__save[b-fj1h8n6ovk] {
    min-height: 36px;
    padding: 0 10px;
    border-radius: 18px;
    border: 1px solid var(--color-line);
    background: transparent;
    color: var(--color-muted);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.ability__save.is-proficient[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

/* Skills and the right column */

.columns[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    align-items: flex-start;
}

.columns[b-fj1h8n6ovk]  .skills {
    flex: 1 1 300px;
    gap: var(--space-2);
    padding: var(--space-4);
}

.column[b-fj1h8n6ovk] {
    display: flex;
    flex: 2 1 380px;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.column[b-fj1h8n6ovk]  .panel {
    gap: var(--space-2);
    padding: var(--space-4);
}

.skill-list[b-fj1h8n6ovk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.skill[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 36px;
    padding: 0 var(--space-2);
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.skill:hover[b-fj1h8n6ovk] {
    background: var(--color-raised);
}

.skill__dot[b-fj1h8n6ovk] {
    flex: none;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1.5px solid var(--color-line);
}

.skill--proficient .skill__dot[b-fj1h8n6ovk],
.skill__dot--proficient[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.skill--expertise .skill__dot[b-fj1h8n6ovk],
.skill__dot--expertise[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
    background: var(--color-accent);
}

.skill__name[b-fj1h8n6ovk] {
    flex: 1 1 auto;
}

.skill__ability[b-fj1h8n6ovk] {
    font-size: 12px;
    color: var(--color-muted);
}

.skill__mod[b-fj1h8n6ovk] {
    font-weight: 700;
}

.skill--proficient .skill__mod[b-fj1h8n6ovk],
.skill--expertise .skill__mod[b-fj1h8n6ovk] {
    color: var(--color-accent);
}

.legend[b-fj1h8n6ovk] {
    display: flex;
    gap: 14px;
    margin-top: var(--space-2);
    font-size: 12px;
    color: var(--color-muted);
}

.legend > span[b-fj1h8n6ovk] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.attack[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.attack__text[b-fj1h8n6ovk] {
    min-width: 0;
}

.attack__name[b-fj1h8n6ovk] {
    font-weight: 700;
}

.attack__note[b-fj1h8n6ovk] {
    font-size: 13px;
    color: var(--color-muted);
}

.attack__buttons[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.btn--small[b-fj1h8n6ovk] {
    min-height: 40px;
    padding: 0 14px;
}

.damage[b-fj1h8n6ovk] {
    background: var(--color-panel);
}

.damage.is-critical[b-fj1h8n6ovk] {
    border-color: var(--color-accent);
    color: var(--color-accent);
    font-weight: 700;
}

.panel-head[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-2);
}

.panel-head .muted[b-fj1h8n6ovk] {
    font-size: 13px;
}

.resource[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
}

.resource__name[b-fj1h8n6ovk] {
    font-weight: 600;
}

.resource__note[b-fj1h8n6ovk] {
    font-size: 13px;
    color: var(--color-muted);
}

.pips[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pip[b-fj1h8n6ovk] {
    width: 32px;
    height: 32px;
    border-radius: 16px;
    border: 2px solid var(--color-accent);
    background: transparent;
    cursor: pointer;
}

.pip.is-available[b-fj1h8n6ovk] {
    background: var(--color-accent);
}

.feature[b-fj1h8n6ovk] {
    padding: 10px var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.feature__head[b-fj1h8n6ovk] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-2);
}

.feature__name[b-fj1h8n6ovk] {
    font-weight: 700;
}

.feature__source[b-fj1h8n6ovk] {
    flex: none;
    font-size: 12px;
    color: var(--color-muted);
}

.feature__text[b-fj1h8n6ovk] {
    font-size: 14px;
}

.equipment[b-fj1h8n6ovk] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.equipment li[b-fj1h8n6ovk] {
    padding: 6px var(--space-3);
    border-radius: 16px;
    background: var(--color-raised);
    font-size: 14px;
    font-weight: 600;
}

/* On phones the party becomes a strip of avatars so the sheet starts near the top */

@media (max-width: 700px) {
    .party[b-fj1h8n6ovk] {
        flex-direction: row;
        align-items: center;
        gap: var(--space-1);
        overflow-x: auto;
        padding: var(--space-2);
    }

    .party__title[b-fj1h8n6ovk],
    .party__sub[b-fj1h8n6ovk] {
        display: none;
    }

    .party__member[b-fj1h8n6ovk] {
        flex: none;
        gap: var(--space-2);
        padding: 6px 10px 6px 6px;
    }

    .party__name[b-fj1h8n6ovk] {
        white-space: nowrap;
    }

    .party__new[b-fj1h8n6ovk] {
        flex: none;
        margin-top: 0;
        padding: 0 var(--space-3);
        white-space: nowrap;
    }
}

.delete[b-fj1h8n6ovk] {
    align-self: flex-start;
    min-height: 36px;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-danger);
    font-size: 13px;
}
/* /Pages/ContentPacks.razor.rz.scp.css */
.page-head[b-xg1doejhhy] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.eyebrow[b-xg1doejhhy] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

h1[b-xg1doejhhy] {
    margin-top: 2px;
}

.intro[b-xg1doejhhy] {
    max-width: 640px;
    margin: var(--space-2) 0 0;
}

.content-layout[b-xg1doejhhy] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-5);
}

.packs[b-xg1doejhhy] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.pack[b-xg1doejhhy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
}

.pack__text[b-xg1doejhhy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pack__name[b-xg1doejhhy] {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 700;
}

.pack__source[b-xg1doejhhy] {
    font-size: 13px;
    overflow-wrap: anywhere;
}

.pack__counts[b-xg1doejhhy] {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-accent);
}

.pack__broken[b-xg1doejhhy] {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-danger);
}

.pack__actions[b-xg1doejhhy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.pack__remove[b-xg1doejhhy] {
    color: var(--color-danger);
}

[b-xg1doejhhy] .file {
    width: 100%;
    padding: var(--space-1);
}

[b-xg1doejhhy] .file::file-selector-button {
    min-height: 34px;
    margin-right: var(--space-3);
    padding: 0 var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    color: var(--color-text);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.paste[b-xg1doejhhy] {
    font-family: ui-monospace, Consolas, monospace;
    font-size: 13px;
}

.format summary[b-xg1doejhhy] {
    cursor: pointer;
    font-weight: 600;
    color: var(--color-accent);
}

.format p[b-xg1doejhhy] {
    margin: var(--space-2) 0;
}

.format pre[b-xg1doejhhy] {
    margin: 0;
    padding: var(--space-3);
    overflow-x: auto;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    font-size: 12px;
}

/* Editor */

.editor__head[b-xg1doejhhy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.editor__row[b-xg1doejhhy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-3);
}

.editor__body[b-xg1doejhhy] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    align-items: start;
    gap: var(--space-5);
}

.entries[b-xg1doejhhy] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.entries__group[b-xg1doejhhy] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.entries__group h3[b-xg1doejhhy] {
    font-size: 15px;
}

.entries__item[b-xg1doejhhy] {
    display: flex;
    align-items: center;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
}

.entries__item.is-on[b-xg1doejhhy] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.entries__pick[b-xg1doejhhy] {
    flex: 1;
    min-width: 0;
    min-height: var(--control-height);
    padding: 0 var(--space-3);
    border: 0;
    background: none;
    text-align: left;
    font-weight: 600;
    cursor: pointer;
    overflow-wrap: anywhere;
}

.editor__form[b-xg1doejhhy] {
    min-width: 0;
}

.editor__actions[b-xg1doejhhy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

@media (max-width: 860px) {
    .content-layout[b-xg1doejhhy],
    .editor__body[b-xg1doejhhy] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Pages/Dice.razor.rz.scp.css */
h1[b-d7i3wm29gu] {
    margin-bottom: var(--space-5);
}

.dice-layout[b-d7i3wm29gu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

.dice-layout[b-d7i3wm29gu]  .dice-builder {
    flex: 1 1 340px;
    max-width: 520px;
}

.dice-layout[b-d7i3wm29gu]  .dice-log {
    flex: 999 1 340px;
}
/* /Pages/Join.razor.rz.scp.css */
.join[b-ckkw1ez42u] {
    max-width: 520px;
    margin: var(--space-6) auto;
}

.join__title[b-ckkw1ez42u] {
    margin: 2px 0 var(--space-5);
}

.stack[b-ckkw1ez42u] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.bring[b-ckkw1ez42u] {
    margin: 0;
    padding: 0;
    border: 0;
}

.picks[b-ckkw1ez42u] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-2);
}

.notice[b-ckkw1ez42u] {
    margin: 0;
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    font-weight: 600;
}

.notice--warning[b-ckkw1ez42u] {
    background: var(--color-accent-soft);
    color: var(--color-text);
    font-weight: 400;
}

.notice--error[b-ckkw1ez42u] {
    background: var(--color-danger-soft);
    color: var(--color-danger);
}
/* /Pages/MonsterBuilder.razor.rz.scp.css */
/* Head: back link, title and the save buttons */

.builder-head[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.back[b-3adk435c0n] {
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.builder-head h1[b-3adk435c0n] {
    margin-top: var(--space-1);
}

.builder-head__actions[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.builder-head__actions .btn:not(.btn--primary)[b-3adk435c0n] {
    background: var(--color-panel);
    font-weight: 700;
}

.error[b-3adk435c0n] {
    margin: 0 0 var(--space-4);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-danger-soft);
    color: var(--color-danger);
    font-weight: 600;
}

/* Start from, the editor and the balance column; they stack on narrow screens */

.builder-layout[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

.start[b-3adk435c0n],
.balance[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.start[b-3adk435c0n] {
    flex: 1 1 260px;
}

.balance[b-3adk435c0n] {
    flex: 1 1 300px;
}

.start[b-3adk435c0n]  .panel,
.balance[b-3adk435c0n]  .panel {
    gap: var(--space-3);
    padding: var(--space-4);
}

.templates[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.template[b-3adk435c0n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--control-height);
    padding: 0 10px;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.template:hover[b-3adk435c0n],
.template.is-on[b-3adk435c0n] {
    background: var(--color-raised);
}

.template.is-on[b-3adk435c0n] {
    box-shadow: inset 3px 0 0 var(--color-accent);
}

.template__name[b-3adk435c0n] {
    font-weight: 600;
}

.template__cr[b-3adk435c0n] {
    font-size: 12px;
    font-weight: 700;
    color: var(--color-accent);
}

.note[b-3adk435c0n] {
    margin: 0;
    font-size: 12px;
    color: var(--color-muted);
}

.roles[b-3adk435c0n] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.role[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--space-2) 10px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    text-align: left;
    cursor: pointer;
}

.role:hover[b-3adk435c0n] {
    border-color: var(--color-accent);
}

.role.is-on[b-3adk435c0n] {
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
}

.role__label[b-3adk435c0n] {
    font-weight: 700;
}

.role__note[b-3adk435c0n] {
    font-size: 12px;
    color: var(--color-muted);
}

.chips[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chip[b-3adk435c0n] {
    min-height: 36px;
    padding: 0 10px;
    border-radius: 18px;
    border: 1px solid var(--color-line);
    background: transparent;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.chip:hover[b-3adk435c0n] {
    border-color: var(--color-accent);
}

.chip.is-on[b-3adk435c0n] {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-on-accent);
}

.chip--small[b-3adk435c0n] {
    padding: 0 var(--space-3);
}

.btn--tall[b-3adk435c0n] {
    min-height: 48px;
    border-radius: var(--radius-md);
}

/* Editor */

.editor[b-3adk435c0n] {
    display: flex;
    flex: 999 1 560px;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
    padding: var(--space-6);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.name[b-3adk435c0n] {
    min-height: 48px;
    color: var(--color-accent);
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 700;
}

.meta[b-3adk435c0n] {
    font-style: italic;
    color: var(--color-muted);
}

.origin[b-3adk435c0n] {
    font-size: 13px;
    color: var(--color-accent);
}

.row[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.row__label[b-3adk435c0n] {
    width: 48px;
    font-size: 13px;
    color: var(--color-muted);
}

.identity[b-3adk435c0n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-2) var(--space-3);
}

.rule[b-3adk435c0n] {
    height: 2px;
    background: var(--color-accent);
    opacity: 0.6;
}

.core[b-3adk435c0n] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 10px;
}

.tile[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.tile__label[b-3adk435c0n] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.tile__row[b-3adk435c0n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.tile__row .btn--icon[b-3adk435c0n] {
    width: 36px;
    min-height: 36px;
    background: var(--color-panel);
}

.tile__value[b-3adk435c0n] {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.tile__note[b-3adk435c0n] {
    font-size: 12px;
    text-align: center;
    color: var(--color-muted);
}

.tile__big[b-3adk435c0n] {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 700;
}

.tile__big.is-good[b-3adk435c0n] {
    color: var(--color-good);
}

.tile__big.is-off[b-3adk435c0n] {
    color: var(--color-accent);
}

.abilities[b-3adk435c0n] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
}

.ability[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-1);
    border-radius: var(--radius-sm);
    background: var(--color-raised);
}

.ability__key[b-3adk435c0n] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--color-muted);
}

.ability__score[b-3adk435c0n] {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
}

.ability__mod[b-3adk435c0n] {
    font-size: 13px;
    color: var(--color-accent);
}

.ability__buttons[b-3adk435c0n] {
    display: flex;
    gap: var(--space-1);
}

.ability__buttons button[b-3adk435c0n] {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    cursor: pointer;
}

.ability__buttons button:hover:not(:disabled)[b-3adk435c0n] {
    border-color: var(--color-accent);
}

.ability__buttons button:disabled[b-3adk435c0n] {
    opacity: 0.45;
    cursor: not-allowed;
}

.section[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.section h2[b-3adk435c0n] {
    font-size: 18px;
    color: var(--color-accent);
}

.entry[b-3adk435c0n] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-2);
}

.entry p[b-3adk435c0n],
.attack p[b-3adk435c0n],
.multi[b-3adk435c0n] {
    margin: 0;
}

.entry__name[b-3adk435c0n] {
    font-weight: 700;
    font-style: italic;
}

.entry__remove[b-3adk435c0n] {
    flex: none;
    width: 36px;
    min-height: 36px;
    border-color: transparent;
    color: var(--color-muted);
}

.multi[b-3adk435c0n] {
    font-size: 14px;
    color: var(--color-muted);
}

.new-trait[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.new-trait__name[b-3adk435c0n] {
    flex: 1 1 140px;
    min-width: 0;
}

.new-trait__text[b-3adk435c0n] {
    flex: 3 1 240px;
    min-width: 0;
}

.attack[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.attack__names[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.attack__names .input[b-3adk435c0n] {
    flex: 1 1 160px;
    min-width: 0;
    min-height: 36px;
    background: var(--color-panel);
}

.attack__controls[b-3adk435c0n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3) var(--space-4);
}

.control[b-3adk435c0n] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.control__label[b-3adk435c0n],
.control__note[b-3adk435c0n] {
    font-size: 12px;
    color: var(--color-muted);
}

.control__value[b-3adk435c0n] {
    min-width: 22px;
    text-align: center;
    font-weight: 700;
}

.btn--toggle[b-3adk435c0n],
.btn--step[b-3adk435c0n],
.btn--die[b-3adk435c0n] {
    min-height: 36px;
    padding: 0 var(--space-2);
    background: var(--color-panel);
    font-weight: 700;
}

.btn--toggle[b-3adk435c0n] {
    min-width: 52px;
}

.btn--step[b-3adk435c0n] {
    width: 32px;
    padding: 0;
}

.btn--die[b-3adk435c0n] {
    min-width: 52px;
    border-color: var(--color-accent);
    background: var(--color-accent-soft);
    color: var(--color-accent);
}

.attack__remove[b-3adk435c0n] {
    min-height: 36px;
    margin-left: auto;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-muted);
    font-size: 13px;
}

/* Balance */

.cr-tiles[b-3adk435c0n] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.cr-tiles .tile[b-3adk435c0n] {
    gap: 2px;
}

.cr-tiles .tile__note[b-3adk435c0n] {
    text-align: left;
}

.check-row[b-3adk435c0n] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.check-row__head[b-3adk435c0n] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-2);
}

.check-row__label[b-3adk435c0n] {
    font-weight: 600;
}

.meter[b-3adk435c0n] {
    position: relative;
    height: 8px;
    border-radius: 4px;
    background: var(--color-track);
}

.meter__fill[b-3adk435c0n] {
    height: 100%;
    border-radius: 4px;
    background: currentColor;
}

.meter__mark[b-3adk435c0n] {
    position: absolute;
    top: -3px;
    left: 50%;
    width: 2px;
    height: 14px;
    background: var(--color-text);
    opacity: 0.6;
}

.check-row__status[b-3adk435c0n] {
    font-size: 12px;
    font-weight: 700;
}

.status--low[b-3adk435c0n] {
    color: var(--color-danger);
}

.status--ontarget[b-3adk435c0n] {
    color: var(--color-good);
}

.status--high[b-3adk435c0n] {
    color: var(--color-accent);
}

@media (max-width: 600px) {
    .editor[b-3adk435c0n] {
        padding: var(--space-4);
    }

    .abilities[b-3adk435c0n] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
/* /Pages/Table.razor.rz.scp.css */
/* Header: the scene's name, the view, the map button and the turn order */

.table-head[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

h1[b-3ekzh9yz56] {
    margin-top: 2px;
}

.head-controls[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.head-controls[b-3ekzh9yz56]  .segmented {
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.head-controls[b-3ekzh9yz56]  .segmented__option.is-selected {
    background: var(--color-accent-soft);
}

.head-controls .btn:not(.btn--primary)[b-3ekzh9yz56] {
    background: var(--color-panel);
}

.head-controls .btn--primary[b-3ekzh9yz56] {
    padding: 0 var(--space-5);
}

.playing-as[b-3ekzh9yz56] {
    color: var(--color-muted);
    font-weight: 600;
}

.round[b-3ekzh9yz56] {
    padding: 10px var(--space-4);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-panel);
    font-weight: 600;
}

.notice[b-3ekzh9yz56] {
    margin: 0 0 var(--space-4);
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    background: var(--color-accent-soft);
    color: var(--color-accent);
    font-weight: 600;
}

.halt[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) var(--space-3);
    margin: 0 0 var(--space-4);
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-accent);
    background: var(--color-accent-soft);
    color: var(--color-text);
}

.halt__icon[b-3ekzh9yz56] {
    flex: none;
    color: var(--color-accent);
}

.halt__text[b-3ekzh9yz56] {
    flex: 1 1 280px;
    margin: 0;
}

.halt__buttons[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.notice--error[b-3ekzh9yz56] {
    background: var(--color-danger-soft);
    color: var(--color-danger);
}

/* The scene of an adventure, for the DM */

[b-3ekzh9yz56] .scene-panel {
    margin-bottom: var(--space-4);
}

.scene-panel__head[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-3);
}

.scene-panel__name[b-3ekzh9yz56] {
    margin: 2px 0 0;
}

.scene-panel__buttons[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.scene-panel__read[b-3ekzh9yz56] {
    margin: 0;
    padding: var(--space-2) var(--space-4);
    border-left: 3px solid var(--color-accent);
    color: var(--color-text);
    font-size: 17px;
    line-height: 1.55;
    white-space: pre-line;
}

.scene-panel__notes summary[b-3ekzh9yz56] {
    cursor: pointer;
    font-weight: 600;
    color: var(--color-accent);
}

.scene-panel__notes p[b-3ekzh9yz56] {
    margin: var(--space-2) 0 0;
    color: var(--color-muted);
    white-space: pre-line;
}

[b-3ekzh9yz56] .add-map {
    margin-bottom: var(--space-5);
}

[b-3ekzh9yz56] .add-map p {
    margin: 0;
}

.add-map__buttons[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.upload:focus-within[b-3ekzh9yz56] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

/* Layout: with a map the turn order runs across the top, without one it is a column on the left */

.table-layout[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
    align-items: flex-start;
}

.table-layout[b-3ekzh9yz56]  .rail {
    flex: 1 1 260px;
    gap: 10px;
    padding: var(--space-4);
}

.table-layout[b-3ekzh9yz56]  .rail--wide {
    flex-basis: 100%;
}

.table-layout[b-3ekzh9yz56]  .map-panel {
    flex: 999 1 640px;
    gap: var(--space-3);
    padding: var(--space-4);
}

.side[b-3ekzh9yz56] {
    display: flex;
    flex: 999 1 640px;
    flex-wrap: wrap;
    gap: var(--space-4);
    align-items: flex-start;
    min-width: 0;
}

.side--narrow[b-3ekzh9yz56] {
    flex: 1 1 340px;
}

.side[b-3ekzh9yz56] >  .segmented {
    flex: 1 1 100%;
    border: 1px solid var(--color-line);
    background: var(--color-panel);
}

.side[b-3ekzh9yz56] >  .segmented .segmented__option.is-selected {
    background: var(--color-accent-soft);
}

.side[b-3ekzh9yz56] >  .selected {
    flex: 999 1 440px;
}

.side[b-3ekzh9yz56] >  .dice {
    flex: 1 1 300px;
    gap: 14px;
    padding: var(--space-4);
}

.side[b-3ekzh9yz56] >  .map-settings {
    flex: 1 1 100%;
}

/* The turn order, or everyone on the table */

.rail__note[b-3ekzh9yz56] {
    margin: 0;
    font-size: 14px;
}

.rows[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.row[b-3ekzh9yz56] {
    display: flex;
    flex: 1 1 190px;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: var(--space-2) 10px;
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text);
    text-align: left;
    cursor: pointer;
}

.row:hover:not(:disabled)[b-3ekzh9yz56],
.row.is-selected[b-3ekzh9yz56] {
    background: var(--color-raised);
}

.row.is-active[b-3ekzh9yz56] {
    box-shadow: inset 0 0 0 2px var(--color-accent);
}

.row.is-down[b-3ekzh9yz56] {
    opacity: 0.55;
}

.row:disabled[b-3ekzh9yz56] {
    cursor: default;
}

.row__init[b-3ekzh9yz56] {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-line);
    background: var(--color-raised);
    font-family: var(--font-display);
    font-weight: 700;
}

.row__body[b-3ekzh9yz56] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
}

.row__title[b-3ekzh9yz56] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.row__name[b-3ekzh9yz56] {
    overflow: hidden;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.picks[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.pick[b-3ekzh9yz56] {
    flex: 1 1 220px;
    min-height: var(--control-height);
}

.pick__name[b-3ekzh9yz56] {
    font-weight: 600;
}

.pick__note[b-3ekzh9yz56] {
    font-size: 13px;
}

.rail__buttons[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.others[b-3ekzh9yz56] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 10px;
    border-top: 1px solid var(--color-line);
}

.others__title[b-3ekzh9yz56] {
    margin: 0;
    font-family: var(--font-body);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.other[b-3ekzh9yz56] {
    display: flex;
    flex: 1 1 190px;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: 6px 6px 6px 10px;
    border-radius: var(--radius-md);
    background: var(--color-raised);
}

.other__name[b-3ekzh9yz56] {
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.other .btn[b-3ekzh9yz56] {
    background: var(--color-panel);
}

.rail__footer[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.add-character[b-3ekzh9yz56] {
    display: flex;
    flex: 1 1 260px;
    flex-direction: column;
    gap: 6px;
    /* In a narrow rail the long character names must not push the Add button out of it. */
    min-width: 0;
}

.add-character__label[b-3ekzh9yz56] {
    font-size: 13px;
    color: var(--color-muted);
}

.add-character__row[b-3ekzh9yz56] {
    display: flex;
    gap: var(--space-2);
}

.add-character__select[b-3ekzh9yz56] {
    flex: 1 1 auto;
    min-width: 0;
}

.add-monsters[b-3ekzh9yz56] {
    display: flex;
    flex: 1 1 220px;
    align-items: center;
    justify-content: center;
    min-height: var(--control-height);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-line);
    font-weight: 700;
    text-decoration: none;
}

.add-monsters:hover[b-3ekzh9yz56] {
    border-color: var(--color-accent);
}

.quiet[b-3ekzh9yz56] {
    min-height: 36px;
    padding: 0 var(--space-3);
    border-color: transparent;
    color: var(--color-muted);
    font-size: 13px;
}

/* The map */

.tools[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.hint[b-3ekzh9yz56] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    min-height: 24px;
}

.hint p[b-3ekzh9yz56] {
    margin: 0;
    font-size: 14px;
}

/* The table log: everything that happened, newest first */

.table-log__lines[b-3ekzh9yz56] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    max-height: 480px;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    list-style: none;
    font-size: 14px;
}

.table-log__line[b-3ekzh9yz56] {
    padding: var(--space-1) 0;
    border-bottom: 1px solid var(--color-line);
    overflow-wrap: anywhere;
}

.table-log__line--turn[b-3ekzh9yz56] {
    font-weight: 700;
    color: var(--color-accent);
}

.table-log__line--rules[b-3ekzh9yz56] {
    font-weight: 600;
    color: var(--color-danger);
}

/* Roll log under the dice tray */

.roll-log[b-3ekzh9yz56] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-line);
}

.roll-log__title[b-3ekzh9yz56] {
    font-family: var(--font-body);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-muted);
}

.row[data-place][b-3ekzh9yz56] {
    cursor: grab;
}

.row.is-dragging[b-3ekzh9yz56] {
    opacity: 0.4;
}