:root {
    --coret-bg: #0A0B0F;
    --coret-bg-2: #0F1017;
    --coret-surface: #14151C;
    --coret-surface-2: #1E2029;
    --coret-surface-3: #252833;
    --coret-border: #2A2D38;
    --coret-border-strong: #3A3D4A;
    --coret-text: #F2F4F8;
    --coret-muted: #9AA0AE;
    --coret-faint: #5C6170;
    --coret-accent: #5B6BFF;
    --coret-accent-strong: #7886FF;
    --coret-accent-pressed: #4A59E6;
    --coret-secondary: #3DD7E5;
    --coret-tertiary: #F5D547;
    --coret-success: #2BE08C;
    --coret-danger: #FF3A5C;
    --coret-warning: #F5D547;
    --coret-focus: rgba(91, 107, 255, 0.35);
    --coret-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), 0 1px 0 rgba(255, 255, 255, 0.03) inset;
    --radius: 10px;
    --radius-panel: 16px;
    --shadow-panel: var(--coret-shadow);
    --font-ui: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    --font-display: var(--font-ui);
    --touch: 44px;
    --coret-compact-target: 36px;
    --coret-feed-max-width: 760px;
    --coret-sidebar-min: 240px;
    --coret-sidebar-max: 300px;
    --coret-right-panel-min: 300px;
    --coret-right-panel-max: 380px;
    --coret-post-media-max-vh: 72vh;
    /* Tokens de cor extra */
    --gold-500: var(--coret-accent);
    --gold-600: var(--coret-accent-pressed);
    --surface-hover: rgba(255, 255, 255, 0.06);
    --surface-active: rgba(91, 107, 255, 0.1);
    --text-200: #9AA0AE;
    --text-300: #6b7a87;
}

* {
    box-sizing: border-box;
    min-width: 0;
}

html {
    color-scheme: dark;
}

body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    color: var(--coret-text);
    background: var(--coret-bg);
    font-family: var(--font-ui);
    font-size: 16px;
    line-height: 1.5;
}

html.coret-modal-open,
html.coret-modal-open body {
    overflow: hidden;
}

body,
button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    cursor: pointer;
}

img,
video,
svg,
canvas {
    max-width: 100%;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--coret-accent);
    outline-offset: 3px;
}

.material-symbols-outlined {
    font-size: 21px;
    line-height: 1;
    vertical-align: middle;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.coret-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
        radial-gradient(circle at 18% 0%, rgba(91, 107, 255, 0.1), transparent 28%),
        radial-gradient(circle at 82% 18%, rgba(70, 92, 110, 0.16), transparent 24%),
        linear-gradient(145deg, #0A0B0F 0%, #0F1017 52%, #030406 100%);
    background-size: 96px 96px, 96px 96px, auto, auto, auto;
}

/* App shell */
.app-shell {
    width: min(100%, 1580px);
    margin-inline: auto;
    display: grid;
    grid-template-columns:
        minmax(var(--coret-sidebar-min), var(--coret-sidebar-max))
        minmax(560px, var(--coret-feed-max-width))
        minmax(var(--coret-right-panel-min), var(--coret-right-panel-max));
    gap: clamp(12px, 2vw, 24px);
    align-items: start;
    justify-content: center;
    padding: 24px clamp(12px, 2vw, 24px) 120px;
}

.content-shell {
    width: min(100%, var(--coret-feed-max-width));
}

.app-shell--wide {
    width: min(100%, 1460px);
    grid-template-columns:
        minmax(var(--coret-sidebar-min), var(--coret-sidebar-max))
        minmax(0, 1fr);
}

.app-shell--wide .content-shell {
    width: 100%;
}

.app-shell--community {
    width: 100%;
    max-width: none;
    grid-template-columns: 72px minmax(0, 1fr);
    justify-content: stretch;
    gap: 12px;
    padding: 12px 12px 96px;
}

.app-shell--community .content-shell {
    width: 100%;
}

.shell-menu-details {
    position: relative;
    display: grid;
    gap: 14px;
}

.shell-menu-summary {
    display: none;
    min-height: var(--touch);
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(16, 22, 29, 0.94);
    list-style: none;
    place-items: center;
}

.shell-menu-summary::-webkit-details-marker {
    display: none;
}

.shell-menu-content {
    display: grid;
    gap: 14px;
}

.app-shell--community .sidebar-shell {
    width: 72px;
    justify-items: stretch;
}

.app-shell--community .brand-shell {
    justify-content: center;
    padding-inline: 0;
}

.app-shell--community .brand-shell span:not(.brand-mark) {
    display: none;
}

.app-shell--community .shell-menu-summary {
    display: grid;
}

.app-shell--community .shell-menu-content {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 50;
    width: min(280px, calc(100vw - 24px));
    padding: 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(9, 14, 20, 0.98);
    box-shadow: var(--shadow-panel);
}

.app-shell--community .shell-menu-details:not([open]) .shell-menu-content {
    display: none;
}

.sidebar-shell,
.right-panel-shell {
    position: sticky;
    top: 24px;
    display: grid;
    gap: 14px;
}

.right-panel-shell {
    align-self: start;
}

.brand-shell,
.shell-card,
.right-panel-card,
.page-card,
.post-card,
.auth-card,
.landing-panel,
.empty-state,
.toast-card,
.inventory-card,
.chat-card,
.profile-card,
.notification-card {
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(16, 22, 29, 0.94);
    box-shadow: 0 10px 34px rgba(0, 0, 0, 0.22);
}

.brand-shell {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 12px;
}

.brand-mark {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 8px;
    color: #ffffff;
    background: var(--coret-accent);
    font-weight: 900;
}

.brand-shell strong,
.page-heading h1,
.auth-card h1,
.landing-copy h1,
.empty-state h1,
.profile-info h1,
.item-body h2,
.chat-card h2 {
    margin: 0;
    font-family: var(--font-display);
    font-weight: 760;
    letter-spacing: 0;
}

.brand-shell small,
.muted,
.shell-card small,
.post-author small,
.panel-list small {
    color: var(--coret-muted);
}

.nav-shell {
    display: grid;
    gap: 8px;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: var(--touch);
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: var(--radius);
    color: var(--coret-muted);
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.nav-item:hover {
    color: var(--coret-text);
    border-color: var(--coret-border);
    background: rgba(91, 107, 255, 0.08);
}

.sidebar-post-button {
    width: 100%;
}

.nav-badge {
    margin-left: auto;
    min-width: 22px;
    padding: 2px 6px;
    border-radius: 999px;
    color: #ffffff;
    background: var(--coret-accent);
    font-size: 0.75rem;
    text-align: center;
}

.shell-card {
    position: relative;
    display: grid;
    gap: 12px;
    padding: 12px;
}

.shell-user-row,
.post-author {
    display: flex;
    align-items: center;
    gap: 10px;
}

.mini-avatar {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border: 1px solid var(--coret-border);
    border-radius: 50%;
    object-fit: cover;
    background: var(--coret-surface-3);
}

.shell-meter {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.shell-meter span {
    display: block;
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: var(--coret-accent);
}

/* Right panel */
.right-panel-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    background: rgba(16, 22, 29, 0.82);
}

.panel-title-row,
.coin-popover-head,
.coin-popover footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.panel-title-row a {
    color: var(--coret-accent);
    font-size: 0.86rem;
    font-weight: 700;
}

.panel-list {
    display: grid;
    gap: 8px;
}

.panel-list a {
    display: grid;
    gap: 2px;
    min-height: var(--touch);
    padding: 9px 10px;
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.04);
}

.panel-list a:hover {
    background: rgba(91, 107, 255, 0.08);
}

/* Page primitives */
.page-stack,
.form-stack,
.feed-list,
.list-stack {
    display: grid;
    gap: 16px;
}

.page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.page-heading h1,
.auth-card h1,
.landing-copy h1 {
    font-size: clamp(2rem, 5vw, 3.35rem);
    line-height: 1.05;
}

.page-heading p,
.landing-copy p,
.empty-state p,
.item-body p {
    max-width: 62ch;
    color: var(--coret-muted);
    line-height: 1.6;
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--coret-accent);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.page-card,
.post-card,
.inventory-card,
.chat-card {
    padding: clamp(12px, 2vw, 18px);
}

/* Buttons and fields */
.button,
.button-muted,
.button-danger,
.icon-button,
.post-action,
.file-tool,
.coin-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: var(--touch);
    max-width: 100%;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    font-weight: 750;
    white-space: nowrap;
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.button,
.coin-trigger {
    padding: 0 16px;
    color: #ffffff;
    background: var(--coret-accent);
    border-color: rgba(91, 107, 255, 0.34);
}

.button-muted,
.icon-button,
.post-action,
.file-tool {
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.045);
}

.button-danger {
    padding: 0 16px;
    color: #260006;
    background: var(--coret-danger);
    border-color: transparent;
}

.button:hover,
.coin-trigger:hover {
    background: var(--coret-accent-strong);
}

.button-muted:hover,
.icon-button:hover,
.post-action:hover,
.file-tool:hover {
    border-color: var(--coret-border-strong);
    background: rgba(91, 107, 255, 0.1);
}

.button:active,
.button-muted:active,
.button-danger:active,
.icon-button:active,
.post-action:active,
.file-tool:active {
    transform: scale(0.98);
}

.button:disabled,
.button-muted:disabled,
.button-danger:disabled,
.icon-button:disabled,
.post-action:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

.icon-button {
    width: var(--touch);
    min-width: var(--touch);
    flex: 0 0 var(--touch);
    padding: 0;
}

.field,
.textarea,
.select,
.post-report-select {
    width: 100%;
    min-height: var(--touch);
    padding: 10px 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(5, 8, 12, 0.72);
    outline: none;
}

.field:focus,
.textarea:focus,
.select:focus,
.post-report-select:focus {
    border-color: var(--coret-border-strong);
    box-shadow: 0 0 0 4px rgba(91, 107, 255, 0.08);
}

.textarea {
    min-height: 116px;
    resize: vertical;
}

label {
    display: grid;
    gap: 7px;
    color: var(--coret-muted);
    font-size: 0.92rem;
    font-weight: 650;
}

.check-row {
    display: flex;
    min-height: 38px;
    align-items: center;
    gap: 10px;
    color: var(--coret-text);
}

.check-row input {
    width: 18px;
    height: 18px;
    accent-color: var(--coret-accent);
}

.inline-actions,
.pill-row,
.meta-row,
.stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Auth / public */
.public-shell {
    display: grid;
    place-items: center;
    min-height: 100vh;
    width: min(100%, 1180px);
    margin: 0 auto;
    padding: 20px;
}

.auth-card {
    width: min(440px, 100%);
    padding: 26px;
}

.auth-switch a {
    color: var(--coret-accent);
    font-weight: 800;
}

.form-errors {
    padding: 12px;
    border: 1px solid rgba(255, 122, 138, 0.32);
    border-radius: var(--radius);
    color: #ffd9de;
    background: rgba(255, 122, 138, 0.08);
}

.landing-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: min(720px, calc(100dvh - 40px));
    overflow: hidden;
}

.landing-panel {
    position: relative;
    display: grid;
    align-content: end;
    gap: 14px;
    min-height: 420px;
    padding: 18px;
    border: 1px solid rgba(140, 232, 189, 0.2);
    border-radius: 18px;
    background:
        radial-gradient(circle at 62% 22%, rgba(140, 232, 189, 0.18), transparent 32%),
        radial-gradient(circle at 18% 80%, rgba(91, 173, 255, 0.14), transparent 34%),
        linear-gradient(180deg, rgba(15, 21, 30, 0.94), rgba(4, 7, 12, 0.98));
    box-shadow: 0 26px 90px rgba(0, 0, 0, 0.46), inset 0 1px 0 rgba(255,255,255,0.06);
}

.mock-post,
.mock-store {
    border: 1px solid var(--coret-border);
    border-radius: 12px;
    background:
        linear-gradient(90deg, rgba(91, 107, 255, 0.16), transparent 62%),
        rgba(255, 255, 255, 0.045);
}

.mock-orbit {
    position: absolute;
    top: 30px;
    right: 30px;
    width: 170px;
    aspect-ratio: 1;
    border-radius: 50%;
    background:
        radial-gradient(circle at 38% 34%, #ffffff, #8ce8bd 18%, #5badff 44%, rgba(91, 173, 255, 0.08) 45%, transparent 66%);
    filter: drop-shadow(0 24px 42px rgba(91, 173, 255, 0.28));
}

.mock-post {
    display: grid;
    gap: 10px;
    min-height: 170px;
    padding: 16px;
    border-color: rgba(91, 107, 255, 0.46);
}

.mock-post span,
.mock-post strong {
    width: fit-content;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 0.78rem;
    font-weight: 950;
}

.mock-post span {
    color: #07100c;
    background: #8ce8bd;
}

.mock-post strong {
    color: #dce9ff;
    background: rgba(91, 173, 255, 0.18);
}

.mock-post i {
    align-self: end;
    width: 76%;
    height: 54px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(255,255,255,0.2), rgba(140,232,189,0.08));
}

.mock-post.short {
    min-height: 78px;
}

.mock-store {
    display: grid;
    gap: 5px;
    min-height: 130px;
    padding: 16px;
    align-content: center;
}

.mock-store b {
    color: #f6d365;
    font-size: 2.2rem;
    line-height: 1;
}

.mock-store small {
    color: var(--coret-muted);
    font-weight: 800;
}

/* Composer */
.composer-card {
    padding: 14px;
}

.composer-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.composer-more {
    position: relative;
}

.composer-more summary {
    list-style: none;
}

.composer-more summary::-webkit-details-marker {
    display: none;
}

.composer-more-panel {
    position: absolute;
    left: 0;
    top: calc(100% + 10px);
    z-index: 6400;
    display: grid;
    width: min(380px, calc(100vw - 32px));
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(16, 22, 29, 0.98);
    box-shadow: var(--shadow-panel);
    backdrop-filter: blur(14px);
}

.composer-more:not([open]) .composer-more-panel {
    display: none;
}

.file-tool {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    min-height: var(--touch);
    padding: 0 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-muted);
    background: rgba(255, 255, 255, 0.04);
    font-size: 0.92rem;
    font-weight: 700;
    cursor: pointer;
}

.file-tool:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

.file-tool input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.coret-coins-dialog {
    width: min(380px, calc(100vw - 32px));
    border: 1px solid rgba(140, 232, 189, 0.28);
    border-radius: 14px;
    padding: 22px;
    color: var(--coret-text, #f3f7fb);
    background:
        radial-gradient(circle at 88% 10%, rgba(140, 232, 189, 0.16), transparent 34%),
        linear-gradient(180deg, rgba(14, 20, 29, 0.98), rgba(5, 8, 13, 0.98));
    box-shadow: 0 26px 90px rgba(0, 0, 0, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.coret-coins-dialog::backdrop {
    background: rgba(0, 0, 0, 0.66);
    backdrop-filter: blur(8px);
}

.coret-coins-dialog__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 16px;
    color: #07100c;
    background: linear-gradient(135deg, #8ce8bd, #f6d365);
    box-shadow: 0 16px 36px rgba(140, 232, 189, 0.2);
}

.coret-coins-dialog h2 {
    margin: 14px 0 6px;
    font-size: 1.35rem;
}

.coret-coins-dialog p {
    margin: 0;
    color: var(--coret-muted, #aab6c5);
    line-height: 1.5;
}

.coret-coins-dialog__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 18px;
}

.coret-coins-dialog__actions button,
.coret-coins-dialog__actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 10px;
    padding: 0 14px;
    font: inherit;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}

.coret-coins-dialog__actions button {
    color: var(--coret-text, #f3f7fb);
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.06);
}

.coret-coins-dialog__actions a {
    color: #06110d;
    border: 0;
    background: linear-gradient(135deg, #8ce8bd, #5badff);
}

.composer-link {
    display: grid;
    gap: 5px;
}

.composer-link span {
    color: var(--coret-muted);
    font-size: 0.82rem;
}

.composer-poll-box {
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    padding: 10px;
    background: rgba(255, 255, 255, 0.035);
}

.composer-poll-box summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    cursor: pointer;
    color: var(--coret-muted);
    font-weight: 700;
    list-style: none;
}

.composer-poll-box summary::-webkit-details-marker {
    display: none;
}

.composer-poll-box[open] {
    display: grid;
    gap: 10px;
}

.composer-poll-options {
    display: grid;
    gap: 8px;
}

/* Post card */
.post-card {
    display: grid;
    gap: 12px;
    min-height: unset;
    height: auto;
    overflow: visible;
}

.post-edit-form {
    display: grid;
    gap: 12px;
    margin: 4px 0 10px;
}

.post-edit-form[hidden] {
    display: none;
}

.post-edit-textarea {
    min-height: 130px;
}

.post-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.post-author {
    flex: 1;
    color: var(--coret-text);
}

.post-author strong {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.verified-icon {
    color: var(--coret-accent);
    font-size: 18px;
}

.post-text {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
    line-height: 1.55;
}

.post-edited-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--coret-muted);
}

.link-preview {
    display: block;
    padding: 11px 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-accent);
    background: rgba(91, 107, 255, 0.055);
    overflow-wrap: anywhere;
}

.post-media {
    width: 100%;
    max-height: min(var(--coret-post-media-max-vh), 760px);
    aspect-ratio: 16 / 9;
    border-radius: var(--radius);
    object-fit: contain;
    background: #020304;
}

.post-media.is-vertical {
    aspect-ratio: 9 / 16;
    max-height: min(80vh, 820px);
}

.post-audio-box {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.04);
}

.post-audio-box audio {
    width: 100%;
}

.post-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(44px, auto));
    justify-content: start;
    gap: 8px;
}

.post-actions form {
    margin: 0;
}

.post-action {
    min-width: 44px;
    min-height: 44px;
    padding: 0 11px;
}

.post-action-mobile {
    display: none;
}

.post-action.is-active {
    color: #ffffff;
    background: var(--coret-accent);
}

/* Progressive menus */
.post-menu,
.post-actions-menu {
    position: relative;
    flex: 0 0 auto;
}

.post-menu summary,
.post-actions-menu summary {
    list-style: none;
}

.post-menu summary::-webkit-details-marker,
.post-actions-menu summary::-webkit-details-marker {
    display: none;
}

.post-menu-list {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 6600;
    display: grid;
    gap: 6px;
    min-width: 190px;
    padding: 8px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(16, 22, 29, 0.98);
    box-shadow: var(--shadow-panel);
}

.post-menu-list-bottom {
    top: auto;
    bottom: calc(100% + 8px);
}

.post-menu-list form {
    display: grid;
    gap: 6px;
    margin: 0;
}

.post-menu-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
    width: 100%;
    min-height: var(--coret-compact-target);
    padding: 0 10px;
    border: 0;
    border-radius: var(--radius);
    color: var(--coret-text);
    background: transparent;
    font-weight: 700;
    text-align: left;
}

.post-menu-item.passive,
.post-menu-item:disabled {
    cursor: default;
    opacity: 0.62;
}

.post-menu-item:hover,
.post-menu-item.is-active {
    color: #ffffff;
    background: var(--coret-accent);
}

.post-menu-item.passive:hover,
.post-menu-item:disabled:hover {
    color: var(--coret-text);
    background: transparent;
}

.post-menu-item.danger:hover {
    color: #260006;
    background: var(--coret-danger);
}

.post-report-form {
    padding-top: 6px;
    border-top: 1px solid var(--coret-border);
}

.post-report-form label {
    gap: 4px;
    font-size: 0.78rem;
}

.post-report-note {
    width: 100%;
    min-height: 64px;
    padding: 8px 10px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(5, 8, 12, 0.72);
    resize: vertical;
}

.back-link {
    width: max-content;
}

.comment-card {
    display: grid;
    gap: 12px;
}

.comment-card p {
    margin: 0;
    line-height: 1.55;
}

.post-poll {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.035);
}

.post-poll-options {
    display: grid;
    gap: 8px;
}

.poll-option {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    overflow: hidden;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.04);
}

.poll-option i {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--poll-percent, 0%);
    background: rgba(91, 107, 255, 0.14);
    pointer-events: none;
}

.poll-option span {
    position: relative;
    z-index: 1;
}

/* Profile */
.profile-card {
    --profile-avatar-size: clamp(104px, 16vw, 148px);
    overflow: hidden;
}

.profile-page-stack {
    width: min(100%, 920px);
    margin-inline: auto;
}

.profile-page-stack .feed-list .coret-post-card {
    max-width: 100%;
    justify-self: stretch;
}

.profile-banner {
    position: relative;
    z-index: 0;
    width: 100%;
    min-height: 0;
    aspect-ratio: 1546 / 423;
    overflow: hidden;
    background-color: var(--coret-surface-3);
}

.profile-banner__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(var(--profile-banner-zoom, 1));
    transform-origin: center;
}

.profile-main {
    position: relative;
    z-index: 1;
    padding: 0 clamp(14px, 2vw, 18px) 18px;
}

.profile-topline {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: calc(var(--profile-avatar-size) * -0.5);
}

.profile-avatar {
    position: relative;
    z-index: 3;
    width: var(--profile-avatar-size);
    height: var(--profile-avatar-size);
    border: 4px solid var(--coret-surface);
    border-radius: 50%;
    object-fit: cover;
    background: var(--coret-surface-3);
}

.profile-info {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.profile-info p {
    margin: 0;
    overflow-wrap: anywhere;
}

.profile-status {
    width: max-content;
    max-width: 100%;
    padding: 6px 10px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-accent);
    background: rgba(91, 107, 255, 0.07);
    font-weight: 750;
}

.pill,
.balance-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding: 0 10px;
    border: 1px solid var(--coret-border);
    border-radius: 999px;
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.045);
    font-size: 0.9rem;
    font-weight: 700;
}

.tabs-row {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 6px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.035);
}

.tabs-row a,
.tabs-row button {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 9px 12px;
    border: 0;
    border-radius: var(--radius);
    color: var(--coret-muted);
    background: transparent;
    font-weight: 700;
    font: inherit;
    cursor: pointer;
}

.tabs-row a.is-active,
.tabs-row a:hover,
.tabs-row button.is-active,
.tabs-row button:hover {
    color: #ffffff;
    background: var(--coret-accent);
}

/* Store / inventory */
.settings-grid,
.store-grid,
.inventory-grid,
.chat-grid,
.profile-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.settings-section summary {
    min-height: var(--touch);
    cursor: pointer;
    color: var(--coret-text);
    font-size: 1.05rem;
    font-weight: 800;
    list-style: none;
}

.settings-section summary::-webkit-details-marker {
    display: none;
}

.settings-section:not([open]) {
    align-content: start;
}

.settings-section[open] summary {
    padding-bottom: 10px;
    border-bottom: 1px solid var(--coret-border);
}

.store-grid {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}

.store-product-card {
    --card-bg: rgba(16, 22, 29, 0.96);
    --card-accent: var(--coret-accent);
    --card-text: var(--coret-text);
    position: relative;
    overflow: hidden;
    min-height: 254px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: var(--card-bg);
    transition: transform 220ms ease, border-color 220ms ease;
}

.store-product-card:hover {
    transform: translateY(-6px);
    border-color: var(--coret-border-strong);
}

.store-card__shine,
.store-card__glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
}

.store-card__shine {
    background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,.32) 50%, transparent 60%);
    background-size: 220% 100%;
}

.store-product-card:hover .store-card__shine {
    opacity: 1;
    animation: shine 2.8s linear infinite;
}

.store-card__glow {
    inset: -10px;
    background: radial-gradient(circle at 50% 0%, rgba(91, 107, 255, 0.2), transparent 70%);
}

.store-product-card:hover .store-card__glow {
    opacity: 1;
}

.store-card__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    height: 100%;
    padding: 1.25em;
}

.store-card__badge {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 0.25em 0.5em;
    border-radius: 999px;
    color: #ffffff;
    background: var(--coret-accent);
    font-size: 0.7em;
    font-weight: 800;
    text-transform: uppercase;
}

.store-card__image {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100px;
    overflow: hidden;
    border-radius: var(--radius);
    background: linear-gradient(45deg, #101820, #203026);
}

.store-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.store-card__image .material-symbols-outlined {
    color: var(--coret-accent);
    font-size: 46px;
}

.store-card__text {
    display: grid;
    gap: 0.25em;
}

.store-card__title,
.store-card__description,
.store-card__price {
    margin: 0;
    color: var(--card-text);
}

.store-card__title {
    font-size: 1.05rem;
    font-weight: 800;
}

.store-card__description {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--coret-muted);
    font-size: 0.78rem;
}

.store-card__footer,
.item-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
}

.store-card__footer form {
    margin: 0;
}

.store-card__gift {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-left: auto;
}

.store-card__gift input {
    width: min(112px, 28vw);
    height: 32px;
    min-width: 0;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    padding: 0 8px;
    color: var(--coret-text);
    background: var(--coret-surface);
    font-size: 0.78rem;
}

.store-card__button {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    color: #ffffff;
    background: var(--coret-accent);
}

.inventory-card {
    position: relative;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.inventory-card.is-equipped {
    border-color: rgba(142, 232, 189, 0.52);
    box-shadow: 0 18px 48px rgba(142, 232, 189, 0.08);
}

.inventory-equipped-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 26px;
    padding: 0 8px;
    border-radius: 999px;
    color: #06110d;
    background: var(--coret-accent);
    font-size: 0.72rem;
    font-weight: 850;
}

.inventory-equipped-badge .material-symbols-outlined {
    font-size: 16px;
}

.item-preview {
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.04);
    cursor: pointer;
}

button.item-preview {
    width: 100%;
    padding: 0;
    color: inherit;
}

.item-preview .material-symbols-outlined {
    color: var(--coret-accent);
    font-size: 44px;
}

.item-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.item-body {
    display: grid;
    gap: 12px;
    align-content: start;
}

.inventory-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.item-body p {
    margin: 0;
}

.inventory-detail-button,
.inventory-detail-modal__close button {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--coret-border);
    border-radius: 50%;
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.04);
    cursor: pointer;
}

.inventory-avatar-preview,
.inventory-profile-preview {
    position: relative;
    display: grid;
    place-items: center;
    width: 78%;
    aspect-ratio: 1;
}

.inventory-avatar-preview__face {
    width: 70%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--coret-accent), #2b3542);
    box-shadow: inset 0 0 0 3px rgba(255,255,255,0.12);
}

.inventory-avatar-preview__frame {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    border-radius: 0 !important;
}

.inventory-profile-preview {
    width: 86%;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: var(--radius);
    background: rgba(5, 8, 12, 0.8);
}

.inventory-profile-preview img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.inventory-profile-preview span,
.inventory-profile-preview b {
    position: relative;
    z-index: 1;
    display: block;
    width: 70%;
    height: 10px;
    border-radius: 999px;
    background: rgba(16, 22, 29, 0.66);
}

.inventory-profile-preview b {
    width: 44%;
    margin-top: 8px;
}

.inventory-detail-modal {
    width: min(92vw, 460px);
    padding: 0;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: transparent;
}

.inventory-detail-modal::backdrop {
    background: rgba(2, 4, 8, 0.72);
    backdrop-filter: blur(10px);
}

.inventory-detail-modal__panel {
    position: relative;
    display: grid;
    gap: 16px;
    padding: 16px;
    background: rgba(16, 22, 29, 0.98);
}

.inventory-detail-modal__close {
    position: absolute;
    top: 10px;
    right: 10px;
    margin: 0;
}

.inventory-detail-modal__preview {
    display: grid;
    place-items: center;
    min-height: 190px;
    overflow: hidden;
    border-radius: var(--radius);
    background: rgba(255,255,255,0.04);
}

.inventory-detail-modal__preview img {
    width: 100%;
    height: 100%;
    max-height: 260px;
    object-fit: cover;
}

.inventory-detail-modal__preview .material-symbols-outlined {
    color: var(--coret-accent);
    font-size: 58px;
}

.inventory-detail-modal__body {
    display: grid;
    gap: 12px;
}

.inventory-detail-modal__body h2,
.inventory-detail-modal__body p {
    margin: 0;
}

/* Coin page */
.coin-warning {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border-color: rgba(242, 207, 122, 0.32);
    background: rgba(242, 207, 122, 0.07);
}

.coin-warning p {
    margin: 0;
    line-height: 1.55;
}

.coin-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.coin-dashboard-card,
.coin-chart-card {
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(16, 22, 29, 0.94);
    box-shadow: 0 10px 34px rgba(0, 0, 0, 0.22);
}

.coin-dashboard-card {
    display: grid;
    gap: 6px;
    padding: 14px;
}

.coin-dashboard-card small,
.coin-dashboard-card span {
    color: var(--coret-muted);
}

.coin-dashboard-card strong {
    font-size: 1.3rem;
}

.coin-page-chart {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 10px;
    min-height: 180px;
    padding-top: 14px;
}

.coin-page-chart span {
    display: grid;
    align-items: end;
    justify-items: center;
    gap: 8px;
    width: 100%;
    height: 150px;
    color: var(--coret-muted);
}

.coin-page-chart i {
    display: block;
    width: 100%;
    max-width: 30px;
    height: var(--h);
    border-radius: var(--radius) var(--radius) 3px 3px;
    background: linear-gradient(180deg, #a895ff, var(--coret-accent));
}

.coin-log-list {
    display: grid;
    gap: 8px;
    max-height: 520px;
    overflow: auto;
}

.coin-log-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 12px;
    padding: 10px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.035);
}

.coin-log-row span {
    overflow-wrap: anywhere;
}

.coin-log-row small {
    grid-column: 1 / -1;
    color: var(--coret-muted);
}

/* Notifications / chat */
.chat-card {
    display: grid;
    align-content: start;
    gap: 14px;
}

.list-item,
.notification-card {
    display: flex;
    align-items: center;
    gap: 12px;
}

.notification-card {
    justify-content: space-between;
    padding: 14px;
}

.notification-card > span:nth-child(2) {
    flex: 1;
    display: grid;
    gap: 4px;
}

.notification-card.is-unread {
    border-color: var(--coret-border-strong);
}

/* Empty/loading/toast */
.empty-state {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 34px 22px;
    text-align: center;
}

.empty-state .material-symbols-outlined {
    color: var(--coret-accent);
    font-size: 42px;
}

.empty-state.compact {
    padding: 22px 14px;
}

.toast-stack {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 6200;
    display: grid;
    gap: 10px;
    width: min(360px, calc(100vw - 24px));
}

.toast-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
}

.toast-card p {
    flex: 1;
    margin: 0;
    overflow-wrap: anywhere;
}

.feed-sentinel {
    min-height: 1px;
}

.feed-skeleton-card {
    min-height: 104px;
    padding: 14px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: #14191f;
}

.card_load {
    float: left;
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

.card_load_extreme_title,
.card_load_extreme_descripion {
    float: right;
    width: calc(100% - 92px);
    border-radius: 5px;
}

.card_load_extreme_title {
    height: 12px;
}

.card_load_extreme_descripion {
    height: 48px;
    margin-top: 10px;
}

.card_load,
.card_load_extreme_title,
.card_load_extreme_descripion,
.skeleton {
    background: linear-gradient(120deg, #202832 30%, #2c3844 38%, #2c3844 40%, #202832 48%);
    background-size: 200% 100%;
    background-position: 100% 0;
    animation: shimmer 1.6s infinite;
}

@keyframes shimmer {
    to { background-position: -100% 0; }
}

@keyframes shine {
    to { background-position: 220% 0; }
}

/* Popovers */
.coin-popover {
    position: absolute;
    right: -342px;
    bottom: 0;
    z-index: 6400;
    width: 320px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius-panel);
    background: #020617;
    box-shadow: var(--shadow-panel);
}

.coin-popover[hidden] {
    display: none;
}

.coin-popover-inner {
    display: grid;
    gap: 14px;
    padding: 14px;
}

.coin-icon {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius);
    background: linear-gradient(135deg, #334155, #0f172a);
}

.live-dot {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px;
    border-radius: 999px;
    color: #34d399;
    background: rgba(52, 211, 153, 0.1);
    font-size: 0.76rem;
    font-weight: 800;
}

.live-dot i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.coin-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.coin-metrics span {
    display: grid;
    gap: 2px;
    padding: 10px;
    border-radius: var(--radius);
    background: rgba(15, 23, 42, 0.74);
}

.coin-metrics small,
.coin-popover footer small {
    color: #94a3b8;
}

.coin-chart {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 5px;
    height: 96px;
    padding: 12px;
    border-radius: var(--radius);
    background: rgba(15, 23, 42, 0.74);
}

.coin-chart i {
    display: flex;
    align-items: end;
    width: 12px;
    height: var(--h);
    border-radius: 4px;
    background: rgba(99, 102, 241, 0.28);
}

.coin-chart b {
    display: block;
    width: 100%;
    height: var(--h);
    border-radius: inherit;
    background: #6366f1;
}

.mini-profile-popover {
    position: fixed;
    z-index: 6500;
    width: min(320px, calc(100vw - 20px));
}

.mini-profile-popover[hidden] {
    display: none;
}

.mini-profile-card {
    position: relative;
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(16, 22, 29, 0.98);
    box-shadow: var(--shadow-panel);
}

.mini-profile-card .profile-main {
    padding-bottom: 0;
}

.mini-profile-card .profile-topline {
    margin-top: -34px;
}

.mini-profile-card .profile-avatar {
    width: 76px;
    height: 76px;
    border-width: 3px;
}

.mini-profile-card .profile-info {
    gap: 7px;
    margin-top: 8px;
}

.mini-profile-card .profile-info h1 {
    font-size: 1.12rem;
}

.mini-profile-card .profile-info p {
    font-size: 0.86rem;
}

.mini-profile-card .profile-info p:last-child {
    display: -webkit-box;
    min-height: 38px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.mini-profile-card__wrapper {
    display: flex;
    gap: 10px;
    padding: 14px 18px 18px;
}

.mini-profile-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.04);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.mini-profile-card__btn-solid,
.mini-profile-card__btn:hover {
    color: #ffffff;
    background: var(--coret-accent);
}

/* Cookie notice */
.cookie-card {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 6200;
    max-width: 320px;
    padding: 1rem;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(16, 22, 29, 0.96);
    box-shadow: var(--shadow-panel);
    backdrop-filter: blur(16px);
}

.cookie-card[hidden] {
    display: none;
}

.cookie-title {
    font-weight: 700;
}

.cookie-description {
    margin: 1rem 0 0;
    color: var(--coret-muted);
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.cookie-description a {
    color: var(--coret-accent);
}

.cookie-description a:hover {
    text-decoration: underline;
}

.cookie-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
}

.cookie-pref,
.cookie-accept {
    border: 0;
    font-size: 0.75rem;
}

.cookie-pref {
    color: var(--coret-muted);
    background: transparent;
    text-decoration: underline;
}

.cookie-accept {
    padding: 0.625rem 1rem;
    border-radius: 0.5rem;
    color: #ffffff;
    background: var(--coret-accent);
    font-weight: 600;
}

.cookie-pref:hover,
.cookie-accept:hover {
    filter: brightness(1.06);
}

/* Modals and media editor */
.modal-overlay,
.media-editor-modal,
.page-loader-overlay {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(5, 7, 10, 0.78);
    backdrop-filter: blur(14px);
}

.modal-overlay {
    z-index: 7000;
}

.media-editor-modal {
    z-index: 7200;
}

.page-loader-overlay {
    z-index: 9000;
    opacity: 0;
    transition: opacity 140ms ease;
}

.modal-overlay[hidden],
.media-editor-modal[hidden],
.page-loader-overlay[hidden] {
    display: none;
}

.page-loader-overlay.is-visible {
    opacity: 1;
}

.modal-panel,
.media-editor-panel {
    width: min(920px, 100%);
    max-height: calc(100vh - 24px);
    overflow: hidden;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(16, 22, 29, 0.98);
    box-shadow: var(--shadow-panel);
}

.modal-header,
.modal-footer,
.media-editor-header,
.media-editor-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--coret-border);
}

.modal-header h2,
.media-editor-header h2 {
    margin: 0;
    font-size: 1.1rem;
}

.modal-footer,
.media-editor-footer {
    justify-content: flex-end;
    border-top: 1px solid var(--coret-border);
    border-bottom: 0;
}

.modal-body,
.media-editor-body {
    max-height: calc(100vh - 130px);
    overflow: auto;
    padding: 16px;
}

.media-editor-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 16px;
}

.profile-preview,
.media-editor-stage-wrap {
    display: grid;
    place-items: center;
    border: 1px dashed rgba(216, 226, 236, 0.18);
    border-radius: var(--radius);
    background: rgba(5, 8, 12, 0.62);
}

.profile-preview {
    align-content: start;
    gap: 0;
    padding: 0;
    text-align: left;
}

.profile-preview .profile-main {
    width: 100%;
}

.media-editor-stage-wrap {
    min-height: 420px;
    background-image:
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 28px 28px;
}

.media-editor-stage {
    position: relative;
    width: min(100%, 640px);
    max-height: 70vh;
    overflow: hidden;
    border: 1px solid var(--coret-border-strong);
    border-radius: var(--radius);
    background: #0A0B0F;
    touch-action: none;
    cursor: grab;
}

.media-editor-stage.is-round {
    width: min(100%, 440px);
    border-radius: 50%;
}

.media-editor-stage img {
    position: absolute;
    top: 0;
    left: 0;
    max-width: none;
    user-select: none;
    pointer-events: none;
}

.media-editor-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent 33%, rgba(255,255,255,.22) 33%, rgba(255,255,255,.22) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgba(255,255,255,.22) 66%, rgba(255,255,255,.22) calc(66% + 1px), transparent calc(66% + 1px)),
        linear-gradient(transparent 33%, rgba(255,255,255,.22) 33%, rgba(255,255,255,.22) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgba(255,255,255,.22) 66%, rgba(255,255,255,.22) calc(66% + 1px), transparent calc(66% + 1px));
}

.media-editor-controls,
.media-editor-options {
    display: grid;
    align-content: start;
    gap: 12px;
}

.media-ratio-option {
    min-height: 40px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    color: var(--coret-text);
    background: rgba(255, 255, 255, 0.045);
    font-weight: 700;
}

.media-ratio-option.is-active,
.media-ratio-option:hover {
    color: #ffffff;
    border-color: transparent;
    background: var(--coret-accent);
}

[data-media-editor-zoom] {
    width: 100%;
    accent-color: var(--coret-accent);
}

/* Loader graphic */
.coret-particle-loader {
    display: grid;
    justify-items: center;
    gap: 14px;
    width: min(720px, 92vw);
}

.coret-particle-loader canvas {
    width: min(680px, 92vw);
    height: auto;
    aspect-ratio: 2 / 1;
    border: 1px solid rgba(216, 226, 236, 0.12);
    border-radius: 14px;
    background: #000000;
    box-shadow: 0 28px 90px rgba(0, 0, 0, .45);
}

.coret-particle-loader__copy {
    display: grid;
    justify-items: center;
    gap: 3px;
    color: #ffffff;
    text-align: center;
}

.coret-particle-loader__copy strong {
    font-size: clamp(1.45rem, 5vw, 2.6rem);
    letter-spacing: .08em;
}

.coret-particle-loader__copy span {
    color: var(--coret-muted);
    font-size: .84rem;
    font-weight: 800;
}

/* Bottom navigation */
.bottom-nav {
    position: fixed;
    right: 10px;
    bottom: 10px;
    left: 10px;
    z-index: 8000;
    display: none;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--coret-border);
    border-radius: var(--radius);
    background: rgba(12, 18, 24, 0.94);
    backdrop-filter: blur(12px);
}

.bottom-nav a {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 56px;
    padding: 6px 4px 4px;
    border-radius: var(--radius);
    color: var(--coret-muted);
    font-size: 0.68rem;
}

.bottom-nav a:hover {
    color: var(--coret-text);
    background: rgba(91, 107, 255, 0.08);
}

.fab-post {
    position: fixed;
    right: 18px;
    bottom: 92px;
    z-index: 3100;
    display: none;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(91, 107, 255, 0.4);
    border-radius: 50%;
    color: #ffffff;
    background: var(--coret-accent);
    box-shadow: var(--shadow-panel);
}

/* Official breakpoints */
@media (max-width: 359px) {
    .app-shell {
        width: 100%;
        grid-template-columns: minmax(0, 1fr);
        padding: 10px 10px 96px;
    }

    .sidebar-shell,
    .right-panel-shell {
        display: none;
    }

    .content-shell,
    .store-grid,
    .settings-grid,
    .inventory-grid,
    .coin-dashboard-grid,
    .chat-grid,
    .profile-edit-grid {
        width: 100%;
        grid-template-columns: 1fr;
    }

    .bottom-nav {
        display: grid;
    }

    .fab-post {
        display: inline-flex;
    }

    .composer-tools,
    .media-editor-body {
        flex-direction: column;
        align-items: stretch;
        grid-template-columns: 1fr;
    }

    .composer-more-panel {
        position: static;
        width: 100%;
        margin-top: 10px;
    }

    .post-actions {
        grid-template-columns: repeat(3, minmax(44px, auto));
    }

    .post-action-desktop {
        display: none;
    }

    .post-action-mobile {
        display: grid;
    }
}

@media (min-width: 360px) and (max-width: 767px) {
    .app-shell {
        width: 100%;
        grid-template-columns: minmax(0, 1fr);
        padding: 10px clamp(10px, 3vw, 16px) 96px;
    }

    .sidebar-shell,
    .right-panel-shell {
        display: none;
    }

    .content-shell {
        width: 100%;
    }

    .bottom-nav {
        display: grid;
    }

    .fab-post {
        display: inline-flex;
    }

    .page-heading,
    .profile-topline {
        display: grid;
        align-items: start;
    }

    .composer-tools,
    .settings-grid,
    .store-grid,
    .inventory-grid,
    .coin-dashboard-grid,
    .chat-grid,
    .profile-edit-grid,
    .media-editor-body {
        grid-template-columns: 1fr;
    }

    .composer-tools {
        flex-direction: column;
        align-items: stretch;
    }

    .composer-more-panel {
        position: static;
        width: 100%;
        margin-top: 10px;
    }

    .post-actions {
        grid-template-columns: repeat(3, minmax(44px, auto));
    }

    .post-action-desktop {
        display: none;
    }

    .post-action-mobile {
        display: grid;
    }

    .inventory-card {
        grid-template-columns: 86px minmax(0, 1fr);
    }

    .post-menu-list {
        position: fixed;
        right: 10px;
        left: 10px;
        top: auto;
        bottom: 84px;
        width: auto;
    }

    .cookie-card {
        right: 10px;
        bottom: 104px;
        left: 10px;
        max-width: none;
    }

    .mini-profile-popover {
        left: 10px !important;
        right: 10px;
        width: auto;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .app-shell {
        width: 100%;
        grid-template-columns: 76px minmax(0, min(720px, calc(100vw - 112px)));
        justify-content: center;
        padding: 16px 16px 96px;
    }

    .sidebar-shell {
        display: grid;
        top: 16px;
        gap: 10px;
    }

    .right-panel-shell,
    .bottom-nav {
        display: none;
    }

    .brand-shell,
    .shell-user-card,
    .nav-item {
        justify-content: center;
        padding-inline: 0;
    }

    .brand-shell span:not(.brand-mark),
    .nav-item span:not(.material-symbols-outlined),
    .shell-user-card > *:not(.shell-user-row),
    .shell-user-row span {
        display: none;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    .app-shell {
        grid-template-columns: minmax(var(--coret-sidebar-min), var(--coret-sidebar-max)) minmax(560px, var(--coret-feed-max-width));
    }

    .app-shell--wide {
        grid-template-columns: minmax(var(--coret-sidebar-min), var(--coret-sidebar-max)) minmax(0, 1fr);
    }

    .right-panel-shell,
    .bottom-nav {
        display: none;
    }
}

@media (min-width: 1280px) and (max-width: 1535px) {
    .app-shell--wide {
        grid-template-columns: minmax(var(--coret-sidebar-min), var(--coret-sidebar-max)) minmax(0, 1fr);
    }

    .right-panel-shell {
        display: grid;
    }

    .bottom-nav {
        display: none;
    }
}

@media (min-width: 1536px) {
    .app-shell--wide {
        grid-template-columns: minmax(var(--coret-sidebar-min), var(--coret-sidebar-max)) minmax(0, 1fr);
    }

    .right-panel-shell {
        display: grid;
    }

    .bottom-nav {
        display: none;
    }
}

.app-shell--community ~ .fab-post,
.app-shell--community ~ .bottom-nav {
    display: none;
}

@media (max-width: 767px) {
    .app-shell--community {
        display: grid;
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 8px;
        padding: 8px;
    }

    .app-shell--community .sidebar-shell {
        position: sticky;
        top: 8px;
        display: grid;
        gap: 8px;
    }

    .app-shell--community .brand-shell {
        min-height: 52px;
    }

    .app-shell--community .brand-mark {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .app-shell--community .content-shell {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}

/* 
=============================================
FASE 8 - POLIMENTO ABSOLUTO E GLASSMORPHISM
============================================= 
*/

.coret-button,
.coret-button--primary,
.coret-button--full {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: var(--touch);
    padding: 0 18px;
    border: 1px solid transparent;
    border-radius: var(--radius);
    color: #ffffff;
    background: var(--coret-accent);
    font-weight: 750;
    white-space: nowrap;
    cursor: pointer;
    transition: background 200ms cubic-bezier(0.4, 0, 0.2, 1),
                transform 150ms cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.coret-button:hover {
    background: var(--coret-accent-strong);
    box-shadow: 0 4px 18px rgba(91, 107, 255, 0.28);
}

.coret-button:active {
    transform: scale(0.96);
    box-shadow: none;
}

.coret-button--full {
    width: 100%;
}

.nav-item {
    transition: background 200ms cubic-bezier(0.4, 0, 0.2, 1),
                color 200ms cubic-bezier(0.4, 0, 0.2, 1),
                border-color 200ms cubic-bezier(0.4, 0, 0.2, 1),
                transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.nav-item:hover {
    transform: translateX(3px);
    background: rgba(91, 107, 255, 0.08);
}

.post-card {
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.post-card:hover {
    box-shadow: 0 8px 32px rgba(0,0,0,0.44);
    border-color: rgba(91, 107, 255, 0.24);
}

/* Glassmorphism em elementos flutuantes */
.bottom-nav,
.app-webview-topbar,
.cookie-card,
.mini-profile-popover,
.modal-panel {
    background: rgba(10, 15, 20, 0.82) !important;
    backdrop-filter: blur(20px) saturate(200%);
    -webkit-backdrop-filter: blur(20px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
}

.page-card {
    background: rgba(16, 22, 29, 0.62) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Ad badge — shimmer dourado */
.ad-badge {
    display: inline-block;
    background: linear-gradient(110deg, var(--gold-500) 0%, #3DD7E5 50%, var(--gold-500) 100%);
    background-size: 200% auto;
    color: #1a0e00;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    animation: ad-shimmer 2.4s linear infinite;
    vertical-align: middle;
}

@keyframes ad-shimmer {
    to { background-position: 200% center; }
}
