:root {
  --ink:#232323;
  --muted:#737373;
  --paper:#f5f5f5;
  --line:#e5e5e5;
  --accent:#232323;
  --soft:#f2f2f2;
  --sidebar:264px;
  --radius:14px;
  font-family:system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--ink);
  font-size:14px;
  line-height:1.55;
  color-scheme:light;
}

* {
  box-sizing:border-box;
}

body {
  margin:0;
  background:var(--paper);
}

a {
  color:var(--accent);
  text-decoration:none;
}

a:hover {
  text-decoration:underline;
}

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

button,a,input,select,textarea,summary {
  outline-offset:4px;
}

button,summary {
  cursor:pointer;
}

button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {
  outline:3px solid #939393;
}

h1,h2,h3,p {
  margin-top:0;
}

h1 {
  font-size:30px;
  letter-spacing:-.9px;
  line-height:1.25;
  margin-bottom:10px;
}

h2 {
  font-size:19px;
  line-height:1.35;
}

h3 {
  font-size:18px;
  line-height:1.4;
}

small {
  font-size:12px;
}

button {
  color:inherit;
}

input:not([type=checkbox]):not([type=radio]),select,textarea {
  width:100%;
  min-height:44px;
  border:1px solid #d4d4d4;
  border-radius:8px;
  background:#ffffff;
  color:var(--ink);
  padding:10px 12px;
}

input[type=checkbox] {
  width:17px;
  height:17px;
  accent-color:var(--accent);
  flex-shrink:0;
}

input[type=file] {
  padding:12px!important;
  background:var(--paper)!important;
}

input::file-selector-button {
  border:1px solid var(--line);
  border-radius:5px;
  background:#ffffff;
  padding:8px 12px;
  color:var(--ink);
  margin-right:12px;
  cursor:pointer;
}

select {
  min-width:100px;
}

input:focus,select:focus,textarea:focus {
  border-color:#8e8e8e;
}

label {
  font-weight:600;
}

table {
  width:100%;
  border-collapse:collapse;
  text-align:left;
}

th {
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.7px;
  color:var(--muted);
  background:#fbfbfb;
  padding:17px 20px;
  border-bottom:1px solid var(--line);
}

td {
  padding:20px;
  border-bottom:1px solid var(--line);
  vertical-align:middle;
}

tr:last-child td {
  border-bottom:0;
}

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

.skip-link:focus {
  position:fixed;
  top:10px;
  left:10px;
  z-index:100;
  background:white;
  padding:14px;
}

.app-layout {
  display:flex;
  min-height:100vh;
}

.sidebar {
  width:var(--sidebar);
  flex-shrink:0;
  background:#ffffff;
  border-right:1px solid var(--line);
  height:100dvh;
  position:sticky;
  top:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transition:width .2s;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  padding:32px 28px;
  color:var(--ink);
  font-size:23px;
  font-weight:700;
  letter-spacing:-.6px;
  white-space:nowrap;
}

.brand:hover {
  text-decoration:none;
}

.brand-mark {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:10px;
  background:var(--ink);
  color:#ffffff;
  font-size:28px;
  flex-shrink:0;
}

.brand-sub {
  display:block;
  font-size:9px;
  letter-spacing:2.7px;
  font-weight:400;
  line-height:1.4;
  margin-top:1px;
}

.sidebar-nav {
  padding:26px 16px;
  overflow-y:auto;
  flex:1;
}

.nav-label {
  display:block;
  color:#929292;
  font-size:9px;
  letter-spacing:1.5px;
  margin:0 12px 18px;
}

.nav-home {
  display:flex;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  border-radius:8px;
  font-weight:600;
  color:var(--ink);
  margin-bottom:22px;
}

.nav-home>span {
  font-size:20px;
}

.nav-home.active,.folder-links a.active {
  background:var(--soft);
  color:#484848;
}

.nav-home:hover,.folder-links a:hover {
  background:var(--paper);
  text-decoration:none;
}

.nav-folder {
  margin-bottom:12px;
}

.nav-folder summary {
  font-size:13px;
  font-weight:600;
  padding:9px 12px;
  color:#626262;
  overflow-wrap:anywhere;
}

.nav-folder summary>span {
  margin:0 4px;
}

.folder-links {
  margin:2px 0 6px 17px;
  padding-left:12px;
  border-left:1px solid var(--line);
}

.folder-links a {
  display:block;
  padding:9px 11px;
  border-radius:6px;
  font-size:12px;
  color:#757575;
  overflow-wrap:anywhere;
}

.folder-links.unfiled {
  margin-left:8px;
}

.sidebar-bottom {
  padding:24px;
  font-size:10px;
  color:var(--muted);
  border-top:1px solid var(--line);
  white-space:nowrap;
}

.status-dot {
  display:inline-block;
  width:6px;
  height:6px;
  background:#858585;
  border-radius:50%;
  margin-right:7px;
}

.workspace {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}

.topbar {
  height:81px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  padding:0 36px;
  gap:17px;
  background:#ffffffd9;
}

.topbar-title {
  font-size:12px;
  color:var(--muted);
}

.icon-button {
  background:none;
  border:1px solid var(--line);
  height:32px;
  width:32px;
  border-radius:7px;
  font-size:15px;
}

.topbar-right {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:24px;
}

.identity {
  display:flex;
  align-items:center;
  gap:10px;
}

.avatar {
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  border-radius:50%;
  background:#ececec;
  color:#515151;
  font-size:13px;
  font-weight:600;
}

.identity-text {
  display:flex;
  flex-direction:column;
  line-height:1.5;
}

.identity strong {
  font-size:12px;
}

.identity small {
  font-size:10px;
  color:var(--muted);
}

.admin-menu {
  position:relative;
}

.admin-menu>summary {
  list-style:none;
  font-size:12px;
}

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

.admin-menu summary>span {
  margin-left:9px;
}

.admin-menu nav {
  position:absolute;
  right:0;
  top:32px;
  width:220px;
  padding:7px;
  background:white;
  border:1px solid var(--line);
  box-shadow:0 12px 40px #23232318;
  border-radius:10px;
  z-index:20;
}

.admin-menu nav a {
  display:block;
  padding:10px 12px;
  color:var(--ink);
  border-radius:5px;
  font-size:13px;
}

.admin-menu nav a:hover {
  background:var(--paper);
  text-decoration:none;
}

.main {
  padding:38px 40px;
  flex:1;
  width:100%;
  max-width:1700px;
  margin:0 auto;
}

.page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:29px;
}

.page-heading p:not(.eyebrow) {
  color:var(--muted);
  font-size:13px;
  margin:0;
}

.eyebrow {
  color:#808080;
  font-size:9px;
  letter-spacing:2px;
  font-weight:700;
  margin-bottom:12px;
}

.count-badge {
  display:inline-flex;
  vertical-align:middle;
  align-items:center;
  justify-content:center;
  min-width:28px;
  height:25px;
  border:1px solid #dfdfdf;
  border-radius:7px;
  font-size:12px;
  color:var(--muted);
  margin-left:12px;
  letter-spacing:0;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:11px 16px;
  background:#ffffff;
  border:1px solid #dddddd;
  border-radius:8px;
  color:var(--ink);
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  min-height:41px;
  cursor:pointer;
  line-height:1.5;
}

.button:hover {
  background:#f4f4f4;
  text-decoration:none;
}

.button.primary {
  background:var(--ink);
  color:white;
  border-color:var(--ink);
  box-shadow:0 3px 5px #2323230c;
}

.button.primary:hover {
  background:#3e3e3e;
}

.button.danger {
  background:#4e4e4e;
  color:#ffffff;
  border-color:#4e4e4e;
}

.text-button {
  background:none;
  border:0;
  padding:7px 0;
  color:var(--muted);
  font-size:12px;
  cursor:pointer;
}

.danger-text {
  color:#565656!important;
}

.intro-strip {
  padding:24px 27px;
  border:1px solid #e3e3e3;
  background:linear-gradient(100deg,#efefef,#f8f8f8);
  display:flex;
  align-items:center;
  gap:18px;
  border-radius:var(--radius);
  margin-bottom:30px;
}

.intro-symbol {
  width:43px;
  height:45px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:#707070;
  background:#ffffff99;
  font-size:28px;
}

.intro-strip strong {
  font-size:14px;
  font-weight:600;
}

.intro-strip p {
  font-size:12px;
  margin:4px 0 0;
  color:#828282;
}

.intro-label {
  margin-left:auto;
  font-size:8px;
  letter-spacing:1.7px;
  color:#8f8f8f;
}

.filter-bar {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:27px;
}

.search-field {
  position:relative;
  max-width:450px;
  flex:1;
}

.search-field>span {
  position:absolute;
  left:14px;
  top:4px;
  color:#8f8f8f;
  font-size:26px;
}

.search-field input {
  padding-left:42px!important;
  font-size:12px;
}

.filter-bar select {
  width:200px;
  font-size:12px;
}

.section-caption {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}

.section-caption h2 {
  font-size:13px;
  margin:0;
  font-weight:600;
}

.section-caption>span {
  font-size:11px;
  color:#8e8e8e;
}

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

.dashboard-card {
  background:#ffffff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:23px 23px 0;
  display:flex;
  flex-direction:column;
  box-shadow:0 3px 5px #23232302;
  transition:box-shadow .2s,border-color .2s;
}

.dashboard-card:hover {
  border-color:#c8c8c8;
  box-shadow:0 6px 16px #23232308;
}

.card-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:25px;
}

.chart-icon {
  display:flex;
  align-items:flex-end;
  gap:3px;
  background:#f1f1f1;
  border-radius:9px;
  width:40px;
  height:40px;
  padding:12px;
  color:#686868;
}

.chart-icon i {
  background:currentColor;
  width:3px;
  border-radius:1px;
  display:block;
}

.chart-icon i:nth-child(1) {
  height:8px;
}

.chart-icon i:nth-child(2) {
  height:16px;
}

.chart-icon i:nth-child(3) {
  height:11px;
}

.chart-icon i:nth-child(4) {
  height:20px;
}

.pill {
  display:inline-block;
  font-size:10px;
  padding:3px 8px;
  background:#f3f3f3;
  color:#6d6d6d;
  border-radius:5px;
  margin:2px;
  max-width:240px;
  overflow-wrap:anywhere;
}

.muted-pill {
  color:#818181;
  background:#f1f1f1;
}

.card-folder {
  text-transform:uppercase;
  color:#939393;
  letter-spacing:1px;
  font-size:9px;
  margin-bottom:7px;
}

.dashboard-card h3 {
  margin-bottom:8px;
  overflow-wrap:anywhere;
}

.dashboard-card h3 a {
  color:var(--ink);
}

.card-description {
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
  margin-bottom:26px;
  flex:1;
  overflow-wrap:anywhere;
}

.card-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-top:1px solid #f0f0f0;
  padding:16px 0;
}

.card-footer>span {
  font-size:9px;
  color:#949494;
}

.card-footer>a {
  font-size:11px;
  font-weight:600;
}

.card-footer>a>span {
  margin-left:9px;
}

.footer {
  padding:20px 40px;
  color:#959595;
  font-size:10px;
  display:flex;
  justify-content:space-between;
  border-top:1px solid var(--line);
  margin-top:20px;
}

.panel {
  background:#ffffff;
  border:1px solid var(--line);
  border-radius:var(--radius);
}

.empty-state {
  padding:65px 24px;
  text-align:center;
  border-style:dashed;
  min-height:300px;
}

.empty-state p {
  max-width:420px;
  margin:0 auto 22px;
  color:var(--muted);
  font-size:13px;
}

.empty-state h2 {
  font-size:19px;
}

.empty-icon {
  font-size:38px;
  color:#9b9b9b;
  margin-bottom:15px;
}

.back-link {
  display:inline-block;
  color:var(--muted);
  font-size:12px;
  margin-bottom:24px;
}

.form-layout {
  display:grid;
  grid-template-columns:minmax(0,730px) minmax(180px,260px);
  gap:36px;
  align-items:start;
}

.edit-form {
  padding:30px;
}

.field {
  margin-bottom:24px;
}

.field>label {
  display:block;
  font-size:12px;
  margin-bottom:7px;
}

.field>label.check-label,.check-label {
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:400;
  font-size:12px;
}

.field .help {
  margin-top:8px;
}

.help {
  color:var(--muted);
  font-size:11px;
  line-height:1.7;
}

.help ul {
  padding-left:16px;
  margin:5px 0;
}

.required {
  color:#949494;
}

.field-error input,.field-error select {
  border-color:#6c6c6c;
}

.error-text {
  font-size:12px;
  color:#4f4f4f;
  margin-top:6px;
}

.errorlist {
  padding-left:20px;
  margin:0;
}

.form-actions {
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:26px;
  padding-top:20px;
  border-top:1px solid var(--line);
}

.field div[id^=id_access_groups],.field div[id^=id_allowed_dashboards],.field div[id^=id_dashboards] {
  max-height:280px;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
}

.field div[id^=id_access_groups] label,.field div[id^=id_allowed_dashboards] label,.field div[id^=id_dashboards] label {
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px;
  font-weight:400;
  font-size:13px;
}

.form-aside {
  padding-top:16px;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}

.form-aside h2 {
  font-size:15px;
  color:#646464;
  margin-top:14px;
}

.aside-icon {
  font-size:30px;
  color:#838383;
}

.notice {
  background:#f2f2f2;
  border:1px solid #e1e1e1;
  border-radius:9px;
  padding:14px 17px;
  margin-bottom:22px;
  color:#545454;
  font-size:12px;
}

.notice.success {
  background:#f4f4f4;
  border-color:#e1e1e1;
  color:#626262;
}

.notice.error {
  background:#f5f5f5;
  border-color:#d8d8d8;
  color:#4d4d4d;
}

.table-wrap {
  overflow:auto;
}

.table-sub {
  display:block;
  color:var(--muted);
  margin-top:5px;
  font-size:11px;
}

.table-actions {
  white-space:nowrap;
}

.table-actions a {
  font-size:12px;
  margin-right:14px;
}

.table-empty {
  text-align:center;
  padding:45px;
  color:var(--muted);
  font-size:13px;
}

.order-input {
  max-width:100px;
}

.section-gap {
  margin-top:24px;
}

.muted {
  color:var(--muted);
}

.confirmation {
  max-width:580px;
  padding:35px;
  margin:25px auto;
}

.confirmation h1 {
  font-size:25px;
}

.danger-symbol {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:50%;
  background:#eeeeee;
  color:#565656;
  font-size:24px;
  margin-bottom:20px;
}

.pagination {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  margin:28px 0;
  font-size:12px;
}

.viewer-main {
  max-width:none;
  padding:24px;
}

.viewer-heading {
  margin-bottom:12px;
}

.viewer-heading h1 {
  font-size:23px;
}

.viewer-meta {
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--muted);
  font-size:10px;
  margin-bottom:12px;
}

.button-group {
  display:flex;
  align-items:center;
  gap:14px;
}

.viewer-shell {
  position:relative;
  width:100%;
  height:calc(100dvh - 265px);
  min-height:420px;
  border:1px solid var(--line);
  border-radius:10px;
  background:white;
  overflow:auto;
}

.viewer-shell iframe {
  display:block;
  border:0;
  width:100%;
  height:100%;
  background:#ffffff;
  transform-origin:top left;
}

#viewer-stage {
  width:100%;
  height:100%;
}

.viewer-help {
  margin-top:10px;
}

.viewer-shell:fullscreen {
  height:100dvh;
  border:0;
  border-radius:0;
  min-height:0;
}

.exit-fullscreen {
  display:none;
  position:fixed;
  top:12px;
  right:12px;
  z-index:2;
  box-shadow:0 3px 12px #00000022;
}

.viewer-shell:fullscreen .exit-fullscreen {
  display:block;
}

.sidebar-hidden .sidebar {
  width:0;
  border:0;
}

.auth-body {
  background:white;
}

.auth-layout {
  display:grid;
  grid-template-columns:48% 52%;
  min-height:100dvh;
}

.auth-story {
  padding:0 9%;
  background:#232323;
  color:#ffffff;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
}

.auth-story .brand {
  color:white;
  padding:46px 0;
}

.auth-story .brand-mark {
  background:#ffffff12;
  border:1px solid #ffffff23;
}

.auth-story .brand-sub {
  color:#b4b4b4;
}

.auth-story-main {
  margin:auto 0;
  padding:50px 0 60px;
  position:relative;
  z-index:1;
}

.auth-story .eyebrow {
  color:#acacac;
  font-size:9px;
  letter-spacing:2px;
}

.auth-story h1 {
  font-size:clamp(34px,3.7vw,58px);
  font-weight:400;
  letter-spacing:-2px;
  line-height:1.18;
  margin:25px 0;
}

.auth-story-main>p:not(.eyebrow) {
  max-width:330px;
  font-size:14px;
  line-height:1.9;
  color:#b2b2b2;
}

.auth-story-footer {
  font-size:10px;
  color:#9f9f9f;
  border-top:1px solid #ffffff16;
  padding:25px 0 35px;
}

.abstract-chart {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:15px;
  height:155px;
  max-width:400px;
  margin-top:50px;
  border-bottom:1px solid #ffffff1a;
  position:relative;
  padding:0 12px;
}

.abstract-chart span {
  width:30px;
  background:linear-gradient(0deg,#6b6b6b30,#9b9b9b7a);
  border:1px solid #a5a5a525;
  border-bottom:0;
  border-radius:4px 4px 0 0;
}

.abstract-chart span:nth-of-type(1) {
  height:30%;
}

.abstract-chart span:nth-of-type(2) {
  height:48%;
}

.abstract-chart span:nth-of-type(3) {
  height:40%;
}

.abstract-chart span:nth-of-type(4) {
  height:65%;
}

.abstract-chart span:nth-of-type(5) {
  height:55%;
}

.abstract-chart span:nth-of-type(6) {
  height:78%;
}

.abstract-chart span:nth-of-type(7) {
  height:95%;
}

.auth-content {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:60px 10%;
  min-height:100dvh;
}

.auth-card {
  width:100%;
  max-width:370px;
  margin:auto 0;
}

.auth-card h2 {
  font-size:29px;
  letter-spacing:-.7px;
  margin:0 0 12px;
}

.auth-card>p {
  font-size:13px;
  line-height:1.8;
}

.auth-form {
  margin-top:30px;
}

.auth-form .field {
  margin-bottom:22px;
}

.auth-form input:not([type=hidden]) {
  min-height:47px;
}

.full-width {
  width:100%;
}

.auth-forgot {
  display:flex;
  justify-content:flex-end;
  font-size:12px;
  margin-top:-5px;
  margin-bottom:26px;
}

.auth-form .button {
  min-height:46px;
  justify-content:space-between;
  padding-left:20px;
  padding-right:20px;
}

.auth-note {
  border-top:1px solid var(--line);
  margin-top:30px;
  padding-top:23px;
  font-size:11px;
  color:#959595;
  text-align:center;
}

.auth-footer {
  color:#a3a3a3;
  font-size:10px;
  margin:40px 0 0;
}

.auth-card .back-link {
  margin-top:25px;
}

.draft-dot {
  padding-left:5px;
}

.chart-line {
  position:absolute;
  inset:50% 0 auto;
  border-top:1px dashed #ffffff0d;
}

@media(min-width:1550px) {
  .dashboard-grid {
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:1180px) {
  :root {
    --sidebar:220px;
  }
  .main {
    padding:30px;
  }
  .dashboard-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .intro-label {
    display:none;
  }
  .topbar {
    padding:0 25px;
  }
  .form-layout {
    grid-template-columns:minmax(0,1fr);
  }
  .form-aside {
    display:none;
  }
  .viewer-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  .viewer-shell {
    height:calc(100dvh - 310px);
  }
}

@media(max-width:800px) {
  .sidebar {
    width:0;
    border:0;
    position:fixed;
    left:0;
    top:65px;
    height:calc(100dvh - 65px);
    z-index:30;
    box-shadow:none;
  }
  .sidebar-open .sidebar {
    width:var(--sidebar);
    border-right:1px solid var(--line);
    box-shadow:12px 0 30px #23232314;
  }
  .sidebar .brand {
    padding:22px;
  }
  .sidebar-nav {
    padding-top:12px;
  }
  .topbar {
    height:65px;
    padding:0 17px;
    gap:10px;
  }
  .topbar-title {
    display:none;
  }
  .topbar-right {
    gap:17px;
  }
  .identity-text {
    display:none;
  }
  .main {
    padding:25px 20px;
  }
  .page-heading {
    align-items:flex-start;
    gap:18px;
  }
  .page-heading h1 {
    font-size:25px;
  }
  .page-heading>.button {
    font-size:11px;
    padding:10px;
  }
  .intro-strip {
    padding:20px;
    gap:14px;
  }
  .intro-strip strong {
    font-size:12px;
  }
  .intro-strip p {
    font-size:11px;
  }
  .filter-bar {
    flex-wrap:wrap;
  }
  .search-field {
    min-width:100%;
    max-width:none;
  }
  .filter-bar select {
    flex:1;
  }
  .footer {
    padding:18px 20px;
  }
  .footer span {
    display:none;
  }
  .auth-layout {
    grid-template-columns:1fr;
  }
  .auth-story {
    padding:0 28px;
    min-height:auto;
  }
  .auth-story .brand {
    padding:23px 0;
  }
  .auth-story-main,.auth-story-footer {
    display:none;
  }
  .auth-content {
    min-height:calc(100dvh - 100px);
    padding:45px 28px;
  }
  .auth-card {
    max-width:400px;
  }
  .viewer-main {
    padding:20px 12px;
  }
  .viewer-heading h1 {
    font-size:22px;
  }
  .button-group {
    gap:8px;
    flex-wrap:wrap;
  }
  .button-group .button {
    font-size:10px;
    padding:9px;
  }
  .viewer-meta {
    align-items:flex-start;
    gap:12px;
  }
  .viewer-meta .check-label {
    font-size:10px;
  }
  .viewer-shell {
    height:calc(100dvh - 290px);
  }
  .form-layout {
    gap:0;
  }
  .edit-form {
    padding:22px;
  }
  .table-wrap td,.table-wrap th {
    padding:14px;
  }
  .table-wrap {
    font-size:12px;
  }
  .section-caption>span {
    font-size:10px;
  }
}

@media(max-width:500px) {
  .dashboard-grid {
    grid-template-columns:1fr;
  }
  .page-heading {
    flex-direction:column;
  }
  .page-heading>.button {
    align-self:flex-start;
  }
  .intro-symbol {
    display:none;
  }
  .auth-card h2 {
    font-size:26px;
  }
  .form-actions {
    flex-wrap:wrap;
  }
  .viewer-shell {
    min-height:360px;
  }
  .confirmation {
    padding:24px;
  }
  .section-caption h2 {
    font-size:12px;
  }
  .count-badge {
    font-size:11px;
  }
  .intro-strip {
    padding:18px;
  }
  .topbar-right {
    gap:14px;
  }
}

@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important;
  }
}


/* Navegação e biblioteca em preto, branco e cinza. */
.ui-icon {
  display:inline-block;
  flex-shrink:0;
  vertical-align:middle;
}
.sidebar {
  background:#232323;
  color:#d4d4d4;
  border-right:0;
}
.sidebar .brand {
  padding:28px 24px 30px;
  color:#fff;
  font-size:21px;
  gap:12px;
}
.brand>.ui-icon {
  width:30px;
  height:30px;
}
.brand-sub {
  color:#a3a3a3;
  font-size:9px;
  letter-spacing:2px;
  margin-top:3px;
}
.sidebar-nav {
  padding:8px 12px 24px;
}
.nav-home,.sidebar-link {
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  padding:12px 10px;
  border:0;
  border-radius:6px;
  color:#d4d4d4;
  background:transparent;
  font-size:13px;
  font-weight:500;
  text-align:left;
  line-height:1.5;
}
.sidebar-link>span {
  overflow-wrap:anywhere;
  min-width:0;
}
.sidebar .ui-icon {
  color:#a3a3a3;
}
.nav-home {
  margin-bottom:24px;
}
.nav-label {
  margin:0 10px 10px;
  color:#a3a3a3;
  font-size:10px;
  font-weight:600;
  letter-spacing:1px;
}
.sidebar-link:hover,.sidebar-link.active,.nav-home.active,.nav-home:hover {
  color:#fff;
  background:#333;
  text-decoration:none;
}
.add-dashboard {
  margin-top:8px;
}
.sidebar-bottom {
  padding:12px;
  border-top:1px solid #3b3b3b;
  white-space:normal;
  overflow:visible;
}
.sidebar-bottom .admin-menu>summary {
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 10px;
  border-radius:6px;
  color:#d4d4d4;
  font-size:13px;
}
.sidebar-bottom .admin-menu>summary:hover,.sidebar-bottom .admin-menu[open]>summary {
  background:#333;
  color:#fff;
}
.sidebar-bottom .admin-menu summary>span {
  margin:0;
}
.sidebar-bottom .admin-menu nav {
  top:auto;
  bottom:calc(100% + 8px);
  right:0;
  width:100%;
  box-shadow:0 8px 24px #0003;
}
.logout-button {
  cursor:pointer;
}
.topbar {
  height:54px;
  padding:0 28px;
  background:var(--paper);
}
.icon-button {
  display:grid;
  place-items:center;
  background:#fff;
  width:34px;
  height:34px;
}
.icon-button .ui-icon {
  width:16px;
  height:16px;
}
.avatar {
  background:#e8e8e8;
  color:#333;
}
.main {
  padding:28px;
}
.home-heading {
  margin-bottom:28px;
}
.home-heading h1 {
  font-family:inherit;
  font-size:32px;
  font-weight:400;
  letter-spacing:-1px;
  margin-bottom:6px;
}
.section-caption h2 {
  text-transform:uppercase;
  letter-spacing:.8px;
  font-size:11px;
  color:#626262;
}
.dashboard-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.dashboard-card {
  position:relative;
  padding:24px;
  border:1px solid #ededed;
  box-shadow:0 3px 4px #00000006,0 10px 22px #00000004;
  min-height:156px;
}
.dashboard-card:hover {
  border-color:#c8c8c8;
  box-shadow:0 5px 18px #0000000c;
}
.card-heading {
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:16px;
}
.card-heading h3 {
  margin:0;
  font-size:19px;
  letter-spacing:-.4px;
  flex:1;
  min-width:0;
}
.card-heading h3 a::after {
  content:'';
  position:absolute;
  inset:0;
  border-radius:var(--radius);
}
.dashboard-card:focus-within {
  outline:2px solid #555;
  outline-offset:3px;
}
.dashboard-symbol {
  display:grid;
  place-items:center;
  flex-shrink:0;
  width:44px;
  height:44px;
  background:#f2f2f2;
  border-radius:50%;
}
.dashboard-symbol .ui-icon {
  width:23px;
  height:23px;
}
.card-description {
  margin:0;
  font-size:13px;
  line-height:1.7;
}
.card-folder {
  margin:16px 0 0;
}
.empty-state {
  border-style:solid;
  min-height:260px;
}
.auth-story {
  background:#232323;
}
.auth-story h1 {
  font-family:inherit;
}
.auth-story-main>p:not(.eyebrow) {
  color:#b5b5b5;
}
.auth-story .brand {
  font-size:22px;
}
.auth-form .button {
  justify-content:center;
}
.sidebar-backdrop {
  display:none;
}
@media(min-width:1700px) {
  .dashboard-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:800px) {
  .topbar { height:65px; padding:0 20px; }
  .main { padding:26px 20px; }
  .sidebar-open .sidebar-backdrop {
    display:block;
    position:fixed;
    inset:65px 0 0;
    z-index:25;
    border:0;
    background:#0005;
    cursor:pointer;
  }
  .sidebar-open .sidebar { border-right:0; }
  .home-heading h1 { font-size:29px; }
  .dashboard-grid { grid-template-columns:1fr; }
  .dashboard-card { padding:22px; }
  .card-heading h3 { font-size:18px; }
  .auth-story .brand { padding:23px 0; }
}

/* Mesma organização do shell de referência, com identidade neutra própria. */
.nav-home>span { font-size:inherit; }
.nav-home { font-size:13px; font-weight:500; padding:10px; margin-bottom:22px; }
.home-heading h1 { display:flex; align-items:center; gap:10px; font-size:28px; font-weight:600; letter-spacing:-.8px; }
.home-heading h1 .ui-icon { width:27px; height:27px; }
.home-heading { margin-bottom:24px; }
.page-heading p:not(.eyebrow) { font-size:14px; }
.dashboard-card { border:0; min-height:130px; }
.card-heading h3 { font-family:inherit; font-size:19px; font-weight:650; }
.card-description { font-size:13px; }
.settings-heading h1 { display:flex; align-items:center; gap:10px; font-size:24px; margin:0; }
.settings-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:24px; align-items:start; }
.settings-nav { display:flex; flex-direction:column; gap:4px; padding:8px; }
.settings-nav a { display:block; color:#626262; border-radius:8px; padding:10px 12px; font-size:13px; }
.settings-nav a:hover,.settings-nav a.active { background:#f0f0f0; color:#232323; text-decoration:none; }
.settings-content { min-width:0; }
.settings-content .page-heading h2 { font-size:21px; margin:0 0 6px; }
.settings-content .page-heading { margin-bottom:20px; }
@media(min-width:1200px) {
  .dashboard-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(min-width:801px) {
  .sidebar-hidden .sidebar { width:84px; }
  .sidebar-hidden .sidebar .brand { justify-content:center; padding:30px 0; }
  .sidebar-hidden .sidebar .brand>span,.sidebar-hidden .sidebar-link>span,.sidebar-hidden .nav-home>span,.sidebar-hidden .nav-label { display:none; }
  .sidebar-hidden .sidebar-link,.sidebar-hidden .nav-home { justify-content:center; }
}
@media(max-width:1100px) {
  .settings-layout { grid-template-columns:minmax(0,1fr); gap:20px; }
  .settings-nav { flex-direction:row; flex-wrap:wrap; }
}
@media(max-width:800px) {
  .home-heading h1 { font-size:25px; }
  .settings-heading h1 { font-size:22px; }
  .settings-nav a { font-size:12px; padding:9px; }
}

.empty-icon .ui-icon { width:38px; height:38px; }
@media(max-width:800px) {
  .table-wrap table { min-width:640px; }
}