.header-status .inbox-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--muted); font-size: 13px; }
.header-status .inbox-button .icon { width: 18px; height: 18px; }
.header-status .inbox-button:hover { color: var(--accent); border-color: var(--line-hover); background: var(--surface-2); }
.header-status .inbox-button.has-unread { color: var(--accent); }
.inbox-count { display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; background: var(--accent); color: white; border-radius: 5px; font-size: 13px; line-height: 1; }
.inbox-dialog { width: min(520px, calc(100% - 28px)); }
.inbox-dialog > .text-button { float: right; margin-top: -35px; }
.inbox-list { display: grid; gap: 9px; margin: 22px 0; max-height: 48dvh; overflow: auto; }
.inbox-item { display: grid; gap: 6px; text-align: left; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.inbox-item.unread { border-left: 3px solid var(--accent); }
.inbox-item strong { font-size: 14px; }
.inbox-item small { font-size: 13px; color: var(--muted); }
.inbox-dialog > .field-help { margin-top: 16px; }
.activity-banner, .transfer-card {
  position: fixed; z-index: 90; bottom: 22px; right: 22px;
  width: min(430px, calc(100vw - 32px)); background: #fff;
  border: 1px solid var(--line-strong); border-radius: 10px;
  box-shadow: 0 8px 35px #14274025; padding: 18px;
}
.activity-banner { display: flex; gap: 12px; align-items: center; }
.activity-banner > span { flex: 1; font-size: 14px; }
.activity-banner .text-button { min-height: 44px; }
.transfer-card { z-index: 120; }
.transfer-card strong { display: block; font-size: 15px; margin-bottom: 8px; }
.transfer-card > span { display: block; font-size: 13px; line-height: 1.7; color: var(--muted); }
.transfer-card progress { display: block; width: 100%; height: 8px; margin: 15px 0; accent-color: var(--accent); }
.transfer-card button { min-height: 44px; margin-right: 20px; }
.work-card { content-visibility: auto; contain-intrinsic-size: 250px 250px; }
@media (max-width: 550px) {
  .sidebar { height: calc(var(--studio-mobile-nav-height) + env(safe-area-inset-bottom)); padding-bottom: calc(8px + env(safe-area-inset-bottom)); box-shadow: 0 -2px 12px #10182808; }
  .app-shell { padding-bottom: calc(var(--studio-mobile-nav-height) + 16px + env(safe-area-inset-bottom)); }
  .topbar { position: sticky; top: 0; z-index: 10; padding-top: env(safe-area-inset-top); height: calc(57px + env(safe-area-inset-top)); }
  .feature-tabs { top: calc(57px + env(safe-area-inset-top)); }
  input, textarea, select { font-size: 16px !important; }
  button, .download-actions a { min-height: 44px; touch-action: manipulation; }
  .source-actions { flex-direction: row; align-items: center; flex-wrap: wrap; }
  #source-file { scroll-margin-top: 120px; }
  .dialog { width: calc(100% - 16px); max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius: 14px; }
  .task-dialog video { max-height: 53dvh !important; object-fit: contain; }
  .header-status { gap: 5px; }
  #active-task { padding: 7px; font-size: 13px; }
  .connection-dot { display: none; }
  .inbox-button { padding: 7px 9px; white-space: nowrap; }
  .activity-banner, .transfer-card { bottom: calc(var(--studio-mobile-nav-height) + 12px + env(safe-area-inset-bottom)); right: 12px; width: calc(100vw - 24px); }
  .download-actions a { flex-grow: 1; text-align: center; }
  .download-actions a:first-child { flex-basis: 100%; }
  .filter-tabs { max-width: calc(100vw - 90px); overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
  .section-heading { gap: 8px; }
}
.account-card #invite-form { margin-top: 24px; display: grid; gap: 10px; }
.account-card input { width: 100%; min-height: 46px; border: 1px solid var(--line-strong); border-radius: 6px; padding: 10px 12px; background: var(--surface); }
#page-settings > .creation-card { padding-bottom: 22px; margin-bottom: 18px; }
#page-settings h2 { font-size: 17px; font-weight: 600; }
#invite-form .primary-button { justify-self: start; }
#quota-information { padding: 14px; background: var(--accent-soft); border-radius: 7px; line-height: 1.8; margin: 18px 0 10px; }
.settings-list { display: grid; gap: 10px; margin-top: 16px; }
.settings-list .inbox-item strong { overflow-wrap: anywhere; }
#storage-progress { width: 100%; height: 8px; margin: 15px 0; accent-color: var(--accent); }
#storage-information { line-height: 1.8; }
.template-actions { display: flex; justify-content: space-between; gap: 4px; padding: 0 12px 12px; }
.template-actions button { font-size: 13px; min-height: 44px; padding: 4px; }
.template-demo-dialog { width: min(440px, calc(100% - 20px)); }
.template-demo-dialog video { display: block; margin: 16px auto; max-width: 100%; height: min(60dvh, 580px); background: #182127; }
.template-demo-dialog .field-help { margin: 16px 0; }
.template-demo-dialog > .text-button { float: right; }
.caption-editor { display: grid; gap: 15px; max-height: 38dvh; overflow: auto; padding-right: 5px; }
.caption-editor label { display: grid; gap: 7px; }
.caption-editor label > span { font-size: 13px; color: var(--muted); }
.caption-editor textarea { width: 100%; font-size: 16px; }

@media(max-width:550px) { .header-status .inbox-button { min-height: 44px; } }