:root {
  --bg: #07120b;
  --bg-soft: #111111;
  --panel: #0d1a12;
  --panel-light: #1c1c1c;
  --line: rgba(148, 163, 184, .14);
  --line-strong: rgba(148, 163, 184, .24);
  --text: #edf5ff;
  --muted: #8290a6;
  --muted-light: #aebbd0;
  --cyan: #22c55e;
  --cyan-strong: #ff5a1f;
  --purple: #ff3045;
  --green: #59f08b;
  --red: #fb7185;
  --radius: 14px;
  --shadow: 0 22px 70px rgba(0, 0, 0, .28);
}

* { box-sizing: border-box; }
img { max-width: 100%; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font-family: "Space Grotesk", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }

.app-shell { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; padding: 29px 18px 20px; background: #0d0d0d; border-right: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 13px 37px; }
.brand-image { display: block; width: 33px !important; height: 33px !important; max-width: 33px !important; max-height: 33px !important; flex: none; object-fit: cover; border: 1px solid rgba(255, 138, 31, .7); border-radius: 10px 4px 10px 4px; background: #fff; box-shadow: 0 0 22px rgba(255, 138, 31, .18); }
.brand-mark { display: grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--cyan); border-radius: 10px 4px 10px 4px; color: var(--cyan); font-size: 19px; font-weight: 800; box-shadow: 0 0 21px rgba(255, 138, 31, .17); }
.brand-copy { display: flex; flex-direction: column; line-height: 1; letter-spacing: -.04em; }
.brand-copy strong { font-size: 18px; font-weight: 760; }
.brand-copy strong span { color: var(--cyan); }
.brand-copy small { margin-top: 5px; color: #6d7c92; font-size: 8px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.side-nav { display: grid; gap: 6px; }
.nav-item { display: flex; align-items: center; gap: 13px; width: 100%; padding: 12px 13px; border: 1px solid transparent; border-radius: 9px; color: var(--muted); background: transparent; text-align: left; font-size: 12px; font-weight: 600; transition: .2s ease; }
.nav-item:hover { color: var(--text); background: rgba(255,255,255,.035); }
.nav-item.active { color: var(--cyan); background: rgba(255, 138, 31, .08); border-color: rgba(255, 138, 31, .13); }
.nav-icon { width: 17px; text-align: center; color: currentColor; font-size: 18px; line-height: 1; }
.sidebar-note { display: flex; gap: 10px; align-items: flex-start; margin: auto 9px 24px; padding: 14px 12px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.018); }
.sidebar-note strong { display: block; margin-bottom: 5px; color: #bdc8d9; font-size: 10px; font-weight: 650; }
.sidebar-note p { margin: 0; color: #637087; font-size: 9px; }
.status-dot { display: inline-block; flex: none; width: 7px; height: 7px; margin-top: 3px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(89, 240, 139, .8); }
.sidebar-footer { padding: 0 13px; color: #536177; font-size: 8px; font-weight: 800; letter-spacing: .16em; }
.sidebar-footer span { float: right; color: #313e52; font-weight: 600; letter-spacing: 0; }

.main-content { width: min(100%, 1450px); margin: 0 auto; padding: 0 48px 28px; overflow: hidden; }
.topbar { display: flex; align-items: center; justify-content: space-between; height: 73px; border-bottom: 1px solid var(--line); }
.breadcrumb { color: #647289; font-size: 11px; }
.breadcrumb b { padding: 0 9px; color: #344157; font-weight: 400; }
.breadcrumb strong { color: #b8c4d5; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 17px; }
.local-pill { display: inline-flex; align-items: center; gap: 7px; color: #78879d; font-size: 10px; }
.icon-button { display: grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--line-strong); border-radius: 8px; color: var(--muted-light); background: transparent; font-size: 17px; transition: .2s; }
.icon-button:hover { border-color: var(--cyan); color: var(--cyan); }

.hero { position: relative; display: flex; justify-content: space-between; min-height: 286px; padding: 55px 4px 36px; overflow: hidden; }
.hero-copy { position: relative; z-index: 1; max-width: 560px; }
.eyebrow, .panel-kicker { margin: 0 0 13px; color: var(--cyan); font-size: 9px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 9px; }
.eyebrow-line { display: inline-block; width: 18px; height: 1px; background: var(--cyan); }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 17px; font-size: clamp(36px, 4.6vw, 64px); font-weight: 650; line-height: .98; letter-spacing: -.065em; }
h1 em { color: var(--cyan); font-style: normal; }
.hero-text { max-width: 520px; margin-bottom: 24px; color: #8493aa; font-size: 13px; line-height: 1.7; }
.hero-actions, .form-actions, .backup-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 39px; padding: 0 15px; border: 1px solid transparent; border-radius: 8px; font-size: 11px; font-weight: 750; transition: transform .2s, border .2s, background .2s, color .2s, box-shadow .2s; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: #04151b; background: var(--cyan); box-shadow: 0 6px 20px rgba(255, 138, 31, .14); }
.button-primary:hover { background: #67e8f9; box-shadow: 0 8px 25px rgba(255, 138, 31, .25); }
.button-ghost, .button-outline { border-color: var(--line-strong); color: #a8b7ca; background: transparent; }
.button-ghost:hover, .button-outline:hover { border-color: rgba(255, 138, 31, .5); color: var(--cyan); background: rgba(255, 138, 31, .05); }
.button-text { padding: 0 8px; color: #75839a; background: transparent; }
.button-text:hover { color: var(--text); }
.button-danger { color: #fff; background: #bd314b; }
.button-danger:hover { background: #dc4964; }
.button-small { min-height: 34px; font-size: 10px; color: var(--cyan); background: rgba(255, 138, 31, .08); border-color: rgba(255, 138, 31, .2); }

.hero-orbit { position: absolute; top: 5px; right: 7%; width: 300px; height: 270px; opacity: .93; }
.orbit { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(255, 138, 31, .18); border-radius: 50%; transform: translate(-50%, -50%) rotate(-20deg); }
.orbit-one { width: 215px; height: 215px; border-left-color: rgba(255, 138, 31, .75); border-right-color: rgba(255, 48, 69, .45); }
.orbit-two { width: 158px; height: 244px; border-top-color: rgba(255, 138, 31, .7); border-bottom-color: rgba(255, 48, 69, .5); transform: translate(-50%, -50%) rotate(62deg); }
.orbit-core { position: absolute; left: 50%; top: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 87px; height: 87px; border: 1px solid rgba(255, 138, 31, .65); border-radius: 50%; background: radial-gradient(circle, rgba(255, 138, 31, .17), rgba(13, 20, 35, .9) 67%); box-shadow: 0 0 45px rgba(255, 138, 31, .16); transform: translate(-50%, -50%); }
.orbit-core span { color: var(--text); font-size: 25px; font-weight: 800; letter-spacing: -.1em; }
.orbit-core small { margin-top: 2px; color: var(--cyan); font-size: 7px; letter-spacing: .25em; }
.orbit-label { position: absolute; padding: 5px 8px; border: 1px solid var(--line-strong); border-radius: 4px; background: rgba(8, 13, 24, .7); color: #718098; font-size: 7px; letter-spacing: .14em; }
.label-one { top: 25px; right: 8px; }
.label-two { bottom: 28px; left: 11px; color: #9787db; }

.stats-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 12px; margin-bottom: 13px; }
.stat-card { position: relative; min-height: 120px; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.stat-card-main { background: linear-gradient(110deg, rgba(255, 138, 31, .09), var(--panel) 65%); border-color: rgba(255, 138, 31, .18); }
.stat-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 13px; color: #8b99ae; font-size: 10px; }
.stat-icon { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 6px; font-size: 13px; }
.stat-icon.cyan { color: var(--cyan); background: rgba(255, 138, 31, .12); }
.stat-icon.purple { color: var(--purple); background: rgba(255, 48, 69, .12); }
.stat-icon.green { color: var(--green); background: rgba(89, 240, 139, .12); }
.stat-value { display: block; margin-bottom: 4px; font-size: 25px; line-height: 1; font-weight: 700; letter-spacing: -.05em; }
.stat-online { color: var(--green); font-size: 20px; letter-spacing: -.03em; }
.stat-caption { color: #67758b; font-size: 9px; }
.stat-sparkline { position: absolute; right: 20px; bottom: 20px; display: flex; align-items: end; gap: 3px; height: 28px; }
.stat-sparkline i { display: block; width: 4px; border-radius: 4px; background: var(--cyan); opacity: .65; }
.stat-sparkline i:nth-child(1) { height: 9px; opacity: .15; }.stat-sparkline i:nth-child(2) { height: 15px; opacity: .25; }.stat-sparkline i:nth-child(3) { height: 12px; opacity: .3; }.stat-sparkline i:nth-child(4) { height: 22px; opacity: .45; }.stat-sparkline i:nth-child(5) { height: 17px; opacity: .52; }.stat-sparkline i:nth-child(6) { height: 25px; opacity: .68; }.stat-sparkline i:nth-child(7) { height: 21px; opacity: .78; }.stat-sparkline i:nth-child(8) { height: 28px; }

.workspace-grid { display: grid; grid-template-columns: minmax(330px, .88fr) minmax(500px, 1.5fr); align-items: start; gap: 13px; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.form-panel, .records-panel { min-height: 600px; padding: 25px 26px; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 8px; }
.panel-kicker { margin-bottom: 7px; color: #65748a; font-size: 8px; }
h2 { margin-bottom: 0; color: #e8f0fb; font-size: 19px; font-weight: 650; letter-spacing: -.045em; }
.heading-mark { color: var(--cyan); font-size: 17px; }
.panel-description { margin: 0 0 25px; color: #77869d; font-size: 11px; line-height: 1.5; }
.field { display: block; margin-bottom: 16px; }
.field-row { display: grid; grid-template-columns: 1fr 110px; gap: 12px; }
.field-row .field-wide { min-width: 0; }
.field > span { display: block; margin-bottom: 7px; color: #9aa8bc; font-size: 10px; font-weight: 650; }
.field > span b { color: var(--cyan); font-weight: 700; }
.field > span small { color: #5e6d83; font-size: 9px; font-weight: 500; }
input, textarea { width: 100%; border: 1px solid rgba(148, 163, 184, .17); border-radius: 7px; outline: none; color: var(--text); background: #101010; font-size: 11px; transition: border .2s, box-shadow .2s, background .2s; }
input { height: 39px; padding: 0 11px; }
textarea { min-height: 74px; padding: 11px; resize: vertical; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: #4d5b70; }
input:focus, textarea:focus { border-color: rgba(255, 138, 31, .65); background: #0b1625; box-shadow: 0 0 0 3px rgba(255, 138, 31, .07); }
.field > small { display: block; margin-top: 6px; color: #58677d; font-size: 9px; }
.input-with-icon, .input-with-action, .readonly-input { position: relative; display: flex; align-items: center; }
.input-with-icon > span, .readonly-input > span { position: absolute; left: 11px; z-index: 1; color: var(--cyan); font-size: 15px; }
.input-with-icon input, .readonly-input input { padding-left: 31px; }
.input-with-action input { padding-right: 37px; }
.input-with-action button { position: absolute; right: 3px; display: grid; place-items: center; width: 31px; height: 31px; border: 0; border-radius: 5px; color: var(--cyan); background: rgba(255, 138, 31, .08); font-size: 17px; }
.input-with-action button:hover { background: rgba(255, 138, 31, .17); }
.readonly-input input { color: #8290a6; background: #0d0d0d; }
.generated-box { margin: 20px 0 21px; padding: 13px 14px 14px; border: 1px solid rgba(255, 138, 31, .18); border-radius: 8px; background: rgba(255, 138, 31, .045); }
.generated-header { display: flex; align-items: center; gap: 7px; padding-bottom: 11px; border-bottom: 1px solid rgba(255, 138, 31, .12); color: #b4c3d8; font-size: 10px; }
.spark { color: var(--cyan); }
.generated-tag { margin-left: auto; color: #46bfdb; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.generated-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding-top: 12px; }
.generated-grid span { display: block; margin-bottom: 5px; color: #627289; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.generated-grid strong { color: var(--cyan); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 12px; letter-spacing: .04em; }
.generated-link-row { grid-column: 1 / -1; padding-top: 11px; border-top: 1px solid rgba(255, 138, 31, .12); }
.generated-link-value { display: flex; align-items: center; gap: 8px; min-width: 0; }
.generated-link-value strong { display: block; overflow: hidden; flex: 1; color: #8fa4bc; font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.generated-link-value button { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border: 1px solid rgba(255, 138, 31, .2); border-radius: 5px; color: var(--cyan); background: rgba(255, 138, 31, .07); }
.generated-link-value button:hover { background: rgba(255, 138, 31, .16); }
.button-submit { min-width: 160px; }

.records-panel { min-width: 0; }
.records-heading { margin-bottom: 21px; }
.owner-filter { min-height: 31px; padding: 0 8px; border: 1px solid var(--line-strong); border-radius: 6px; color: #aebbd0; background: #101010; font-size: 9px; outline: none; }
.credential-owner { display: block; margin-top: 4px; color: #22c55e; font-size: 8px; }
.count-badge { display: inline-grid; place-items: center; min-width: 21px; height: 21px; margin-left: 5px; padding: 0 5px; border-radius: 6px; color: var(--cyan); background: rgba(255, 138, 31, .1); font-size: 10px; vertical-align: 2px; }
.more-button { width: 29px; height: 27px; border: 1px solid var(--line); border-radius: 6px; color: #718097; background: transparent; letter-spacing: 2px; }
.more-button:hover { color: var(--cyan); border-color: rgba(255, 138, 31, .4); }
.search-box { position: relative; display: flex; align-items: center; margin-bottom: 18px; }
.search-box > span { position: absolute; left: 12px; color: var(--cyan); font-size: 18px; }
.search-box input { height: 39px; padding: 0 45px 0 34px; background: #101010; }
.search-box kbd { position: absolute; right: 10px; padding: 3px 6px; border: 1px solid var(--line-strong); border-radius: 4px; color: #68778e; font-family: inherit; font-size: 9px; }
.list-head { display: grid; grid-template-columns: minmax(150px, 1.4fr) minmax(160px, 1fr) 70px; gap: 10px; padding: 0 12px 9px; border-bottom: 1px solid var(--line); color: #5f6e83; font-size: 8px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.list-head span:last-child { text-align: right; }
.app-list { display: grid; }
.app-item { display: grid; grid-template-columns: minmax(150px, 1.4fr) minmax(160px, 1fr) 70px; gap: 10px; align-items: center; min-height: 78px; padding: 11px 12px; border-bottom: 1px solid rgba(148, 163, 184, .09); transition: background .2s; }
.app-item:hover { background: rgba(255,255,255,.018); }
.app-identity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.app-avatar { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border: 1px solid rgba(255, 138, 31, .3); border-radius: 9px 4px 9px 4px; color: var(--cyan); background: rgba(255, 138, 31, .09); font-size: 12px; font-weight: 800; }
.app-identity-copy { min-width: 0; }
.app-identity-copy strong { display: block; overflow: hidden; color: #dce7f5; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.app-identity-copy span { display: block; margin-top: 4px; overflow: hidden; color: #627188; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.install-cell { min-width: 0; }
.code-chip { display: inline-flex; align-items: center; padding: 5px 7px; border: 1px solid rgba(255, 48, 69, .2); border-radius: 4px; color: #b8a8ee; background: rgba(255, 48, 69, .08); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 9px; letter-spacing: .06em; }
.app-version { display: block; margin-top: 5px; color: #5d6c82; font-size: 8px; }
.app-actions { display: flex; justify-content: flex-end; gap: 4px; }
.action-button { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid transparent; border-radius: 6px; color: #6c7b91; background: transparent; font-size: 14px; }
.action-button:hover { border-color: var(--line-strong); color: var(--cyan); background: rgba(255,255,255,.03); }
.action-button.delete:hover { color: var(--red); border-color: rgba(251, 113, 133, .3); }
.empty-state { display: none; flex-direction: column; align-items: center; justify-content: center; min-height: 370px; padding: 45px 20px; text-align: center; }
.empty-state.visible { display: flex; }
.empty-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 14px; border: 1px dashed rgba(255, 138, 31, .35); border-radius: 15px; color: var(--cyan); background: rgba(255, 138, 31, .06); font-size: 27px; }
.empty-state h3 { margin-bottom: 7px; font-size: 14px; }
.empty-state p { margin-bottom: 17px; color: #65748a; font-size: 10px; }

.backup-panel { display: flex; align-items: center; gap: 17px; margin-top: 13px; padding: 19px 23px; }
.backup-icon { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 10px; color: var(--cyan); background: rgba(255, 138, 31, .1); font-size: 22px; }
.backup-copy { flex: 1; min-width: 180px; }
.backup-copy .panel-kicker { margin-bottom: 5px; }
.backup-copy h2 { margin-bottom: 5px; font-size: 14px; }
.backup-copy p:last-child { margin: 0; color: #65748a; font-size: 10px; }
.backup-actions { justify-content: flex-end; }
.file-button { position: relative; overflow: hidden; }
.file-button input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.main-footer { display: flex; justify-content: space-between; gap: 20px; padding: 25px 3px 0; color: #49586d; font-size: 8px; letter-spacing: .12em; }
.main-footer span:last-child { color: #39475c; letter-spacing: 0; }

.confirm-dialog { width: min(360px, calc(100vw - 32px)); padding: 27px; border: 1px solid rgba(255, 138, 31, .25); border-radius: 15px; outline: none; color: var(--text); background: #0d1a12; box-shadow: var(--shadow); }
.confirm-dialog::backdrop { background: rgba(2, 5, 12, .72); backdrop-filter: blur(4px); }
.dialog-symbol { display: grid; place-items: center; width: 31px; height: 31px; margin-bottom: 15px; border-radius: 9px; color: var(--red); background: rgba(251, 113, 133, .12); font-weight: 800; }
.confirm-dialog h2 { margin-bottom: 8px; font-size: 18px; }
.confirm-dialog p { margin-bottom: 24px; color: #8391a7; font-size: 11px; line-height: 1.55; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 20; max-width: min(350px, calc(100vw - 44px)); padding: 12px 15px; border: 1px solid rgba(89, 240, 139, .3); border-radius: 8px; color: #c4f8d1; background: #10241b; box-shadow: var(--shadow); font-size: 11px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: .25s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 1100px) { .main-content { padding-right: 30px; padding-left: 30px; } .hero-orbit { right: -2%; opacity: .55; } .workspace-grid { grid-template-columns: 1fr; } .form-panel, .records-panel { min-height: auto; } }
@media (max-width: 760px) { .app-shell { display: block; } .sidebar { position: static; display: block; height: auto; padding: 16px 18px; border-right: 0; border-bottom: 1px solid var(--line); } .brand { padding: 0; } .side-nav { display: flex; gap: 4px; margin: 17px -5px 0; overflow-x: auto; } .nav-item { flex: none; padding: 9px 10px; font-size: 10px; } .nav-item .nav-icon { font-size: 15px; } .sidebar-note, .sidebar-footer { display: none; } .main-content { padding: 0 17px 22px; } .topbar { height: 59px; } .local-pill { display: none; } .hero { min-height: 310px; padding: 43px 1px 30px; } .hero-orbit { top: 88px; right: -76px; opacity: .38; transform: scale(.78); } .hero-copy { max-width: 90%; } .hero-text { max-width: 360px; font-size: 12px; } h1 { font-size: 43px; } .stats-grid { grid-template-columns: 1fr 1fr; } .stat-card-main { grid-column: span 2; } .stat-card { min-height: 112px; padding: 15px; } .stat-sparkline { right: 15px; bottom: 15px; } .workspace-grid { gap: 11px; } .form-panel, .records-panel { padding: 21px 17px; } .field-row { grid-template-columns: 1fr 1fr; } .list-head { display: none; } .app-item { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 14px 4px; } .app-item .install-cell { grid-column: 1 / 2; margin-left: 42px; margin-top: -8px; } .app-item .app-actions { grid-column: 2; grid-row: 1 / span 2; } .backup-panel { align-items: flex-start; flex-wrap: wrap; padding: 18px; } .backup-actions { width: 100%; justify-content: flex-start; } .main-footer { flex-direction: column; gap: 8px; } }
@media (max-width: 430px) { .hero-actions .button { width: 100%; } .field-row { grid-template-columns: 1fr; gap: 0; } .generated-tag { display: none; } .generated-grid { gap: 8px; } .backup-actions .button { flex: 1; padding: 0 8px; } }

/* Correção final do menu móvel */
@media (max-width: 760px) {
  .app-shell { display: block !important; min-height: 100vh; }
  .sidebar { position: fixed !important; inset: 0 auto 0 0; width: min(282px, 86vw); height: 100vh !important; padding: 22px 18px !important; transform: translateX(-105%); transition: transform .22s ease; z-index: 30; overflow-y: auto; border-right: 1px solid var(--line) !important; border-bottom: 0 !important; box-shadow: 18px 0 45px rgba(0,0,0,.45); }
  .app-shell.menu-open .sidebar { transform: translateX(0); }
  .sidebar .side-nav { display: grid !important; gap: 6px; margin: 24px 0 0 !important; overflow: visible !important; }
  .sidebar .nav-item { display: flex; flex: none; width: 100%; padding: 12px 13px; font-size: 12px; }
  .sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.68); z-index: 20; }
  .app-shell.menu-open .sidebar-backdrop { display: block; }
  .main-content { width: 100%; min-width: 0; padding: 0 12px 22px !important; }
  .topbar { min-height: 58px; height: auto !important; padding: 10px 0; gap: 8px; }
  .mobile-menu-button { display: grid !important; place-items: center; width: 34px; height: 34px; flex: none; border: 1px solid var(--line); border-radius: 8px; background: #141414; color: #ffad5a; font-size: 19px; cursor: pointer; }
  .breadcrumb { min-width: 0; overflow: hidden; white-space: nowrap; font-size: 10px; }
  .breadcrumb span, .breadcrumb b { display: none; }
  .breadcrumb strong { overflow: hidden; text-overflow: ellipsis; }
  .topbar-actions { gap: 6px; margin-left: auto; }
  .top-limits { gap: 4px; }
  .top-limits span { padding: 3px 5px; }
  .top-limits b { font-size: 9px; }
  .top-limits small { font-size: 7px; }
  .user-chip { padding: 4px 6px; }
  .logout-button { padding: 7px 8px; font-size: 9px; }
  .topbar-actions .user-chip span:not(.user-avatar) { display: none; }
  .panel-view { padding: 12px 0; }
  .hero { min-height: 0; padding: 24px 18px; }
  .hero-orbit { display: none; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .stat-card { min-height: 0; padding: 12px; }
  .quick-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .quick-card { padding: 12px; }
  .referral-link-box { align-items: stretch; flex-wrap: wrap; }
  .referral-link-box input { flex-basis: 100%; height: 28px; }
  .referral-link-box button { flex: 1; }
  .apk-form { grid-template-columns: 1fr; }
  .apk-form .apk-description { grid-column: auto; }
  .settings-grid { grid-template-columns: 1fr; }
  .reseller-form { grid-template-columns: 1fr 1fr; }
  .reseller-form .button { grid-column: 1 / -1; }
  .reseller-edit-grid { grid-template-columns: 1fr 1fr; }
  .reseller-card-actions { display: flex; flex-wrap: wrap; gap: 7px; }
  .reseller-card-actions .button { flex: 1; margin: 0; }
}

/* Ajuste de espaçamento e fechamento do menu no celular */
@media (max-width: 760px) {
  .topbar { padding: 12px 4px !important; gap: 12px !important; }
  .mobile-menu-button { margin-right: 4px; width: 40px; height: 40px; border-radius: 10px; }
  .breadcrumb { margin-left: 2px; }
  .topbar-actions { gap: 9px; }
  .top-limits { gap: 6px; }
  .top-limits span { padding: 5px 7px; }
  .sidebar { padding: 28px 20px !important; }
  .sidebar .side-nav { gap: 10px !important; margin-top: 30px !important; }
  .sidebar .nav-item { min-height: 48px; padding: 14px 15px !important; border-radius: 10px; font-size: 13px !important; }
  .sidebar .nav-icon { width: 21px; font-size: 19px !important; }
}

/* O botão permanece acessível por cima do drawer aberto. */
@media (max-width: 760px) {
  .topbar { position: relative; z-index: 45; }
  .mobile-menu-button { position: relative; z-index: 50; }
  .app-shell.menu-open .mobile-menu-button { color: #ffd2a4; border-color: rgba(255,138,31,.65); background: #24170d; }
}

/* O cabeçalho não cobre o drawer; apenas o botão fica acessível para fechar. */
@media (max-width: 760px) {
  .topbar { position: relative; z-index: auto; }
  .mobile-menu-button { position: relative; z-index: 50; }
  .app-shell.menu-open .mobile-menu-button { position: fixed; top: 14px; left: calc(min(282px, 86vw) - 52px); z-index: 50; }
}

.reseller-row{display:grid;grid-template-columns:minmax(150px,1.5fr) 115px 125px 85px 95px auto auto;gap:7px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.reseller-row-person{min-width:0}.reseller-row-person strong{display:block;overflow:hidden;color:#e6edf8;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.reseller-row-person small{display:block;margin-top:4px;overflow:hidden;color:#718198;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.reseller-row input,.reseller-row select{width:100%;min-width:0;height:31px;padding:0 7px;border:1px solid var(--line);border-radius:6px;color:#d8e1ee;background:#101010;font-size:9px}.reseller-row .permission-toggle{justify-self:stretch}.reseller-row .button{min-height:31px;padding:0 9px;white-space:nowrap}.reseller-row .reseller-delete{margin:0}@media(max-width:900px){.reseller-row{grid-template-columns:1.4fr 1fr 1fr;gap:8px}.reseller-row-person{grid-column:1/-1}.reseller-row .permission-toggle{justify-self:start}.reseller-row .button{justify-self:stretch}}

/* Lista reta de revendedores em largura total. */
.reseller-list { display: block !important; width: 100%; }
.reseller-row { width: 100%; }

.reseller-actions{position:relative;justify-self:end}.reseller-actions .more-button{width:34px;height:31px;padding:0;color:#aab7c8;border-color:var(--line);font-size:18px;line-height:1}.reseller-actions-menu{position:absolute;right:0;top:37px;z-index:8;display:none;min-width:108px;padding:5px;border:1px solid var(--line-strong);border-radius:8px;background:#171717;box-shadow:0 12px 30px rgba(0,0,0,.38)}.reseller-actions.open .reseller-actions-menu{display:grid;gap:3px}.reseller-actions-menu button{width:100%;padding:8px 9px;border:0;border-radius:5px;color:#b7c4d5;background:transparent;text-align:left;font-size:10px;cursor:pointer}.reseller-actions-menu button:hover{color:#fff;background:rgba(255,138,31,.12)}.reseller-actions-menu .reseller-delete{margin:0;color:#ff9aaa!important}.reseller-actions-menu button:disabled{opacity:.4;cursor:not-allowed}

.reseller-form input:disabled,.reseller-row input:disabled,.reseller-row select:disabled{opacity:.45;cursor:not-allowed}

.single-use-note{display:grid;grid-template-columns:auto 1fr;column-gap:8px;max-width:430px;margin-top:18px;padding:10px 12px;border:1px solid rgba(89,240,139,.2);border-radius:8px;background:rgba(89,240,139,.045)}.single-use-note span{grid-row:span 2;color:var(--green);font-size:13px}.single-use-note strong{color:#c8f7d5;font-size:10px}.single-use-note small{margin-top:3px;color:#79958a;font-size:9px;line-height:1.4}

/* Os campos bloqueados não exibem cursor de proibido sobre os controles. */
.reseller-form input:disabled,
.reseller-row input:disabled,
.reseller-row select:disabled { cursor: default !important; pointer-events: none; }
.permission-toggle label { cursor: pointer; }
.permission-toggle span { cursor: pointer; }

/* Esconde as caixas nativas: ficam visíveis somente os botões Ilimitado e Ultra. */
.permission-toggle input,
.permission-toggle input:disabled { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; opacity: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; pointer-events: none !important; }

.settings-form{max-width:760px;display:grid;gap:14px}.settings-form .field{margin:0}.settings-form input[type=text],.settings-form input[type=file]{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:10px;border:1px solid var(--line);border-radius:7px;color:#d8e1ee;background:#101010;font-size:10px}.settings-form input[type=color]{display:block;width:100%;height:42px;margin-top:7px;padding:3px;border:1px solid var(--line);border-radius:7px;background:#101010}.settings-color-grid,.settings-logo-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.settings-form small{display:block;margin-top:6px;color:#7d8ca1;font-size:9px}@media(max-width:760px){.settings-color-grid,.settings-logo-grid{grid-template-columns:1fr}}

.reseller-login-field{display:flex;flex-direction:column;gap:5px;color:#8998ad;font-size:9px}.reseller-login-field input{width:100%;box-sizing:border-box;height:31px;padding:0 7px;border:1px solid var(--line);border-radius:5px;color:#d8e1ee;background:#101010;font-size:9px}.reseller-login-field input:disabled{opacity:.62}.reseller-login-field span{font-size:9px}

.payment-settings{margin-top:20px;padding:16px;border:1px solid rgba(34,197,94,.22);border-radius:10px;background:rgba(34,197,94,.04)}.payment-settings h3{margin:0 0 6px;font-size:13px}.payment-settings p{margin:0 0 12px;color:#8998ad;font-size:10px}.payment-settings code{color:#bbf7d0}

.subscription-card{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:10px 0 18px;padding:18px;border:1px solid rgba(34,197,94,.25);border-radius:12px;background:rgba(34,197,94,.05)}.subscription-card>div{padding:10px;border-right:1px solid var(--line)}.subscription-card>div:last-child{border-right:0}.subscription-label{display:block;color:#7d8ca1;font-size:9px;text-transform:uppercase}.subscription-card strong{display:block;margin-top:7px;color:#bbf7d0;font-size:12px}@media(max-width:760px){.subscription-card{grid-template-columns:1fr 1fr}.subscription-card>div{border-right:0}}

.payment-settings .field small{display:block;margin-top:6px;color:#7d8ca1;font-size:9px}

.customer-subscription{margin-bottom:18px}.subscription-status-box{padding:18px;border:1px solid rgba(34,197,94,.3);border-radius:12px;background:linear-gradient(145deg,rgba(34,197,94,.12),rgba(13,26,18,.8))}.subscription-status-box h3{margin:6px 0;font-size:18px}.subscription-status-box p:not(.panel-kicker){max-width:650px;color:#a4bca8;font-size:11px;line-height:1.6}.subscription-status-box .button{display:inline-block;width:auto;margin-top:8px;text-decoration:none}.subscription-status-box small{display:block;margin-top:10px;color:#86a78e;font-size:9px}

.admin-subscription-info{display:none}.admin-subscription-info.is-visible{display:block}.subscription-card.admin-subscription-info.is-visible{display:grid}

.subscription-panel{max-width:920px}.subscription-status-box{max-width:760px}.apk-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}.apk-library-grid .apk-preview{min-height:82px}.apk-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:10px;background:rgba(34,197,94,.14);color:#86efac;font-weight:800;font-size:11px}.apk-library{margin-top:12px}

.disabled-checkout{opacity:.55;cursor:not-allowed;filter:grayscale(.4)}

.field-wide{grid-column:1/-1}.apk-screenshot{width:48px;height:64px;object-fit:cover;border-radius:7px;border:1px solid rgba(34,197,94,.25)}.apk-preview{display:flex;gap:10px;align-items:center}

.subscription-admin-edit{display:none;margin:14px 0;padding:14px;border:1px solid rgba(34,197,94,.24);border-radius:10px;background:rgba(34,197,94,.04)}.subscription-admin-edit.is-visible{display:block}.subscription-admin-edit textarea{width:100%;box-sizing:border-box;margin-top:7px;padding:10px;border:1px solid var(--line);border-radius:7px;color:#d8e1ee;background:#101010;font-size:10px}
