/* Layout follows the Mini App window, not the physical display resolution. */
:root {
  --work-height: var(--tg-viewport-stable-height, 100dvh);
  --safe-top: calc(max(env(safe-area-inset-top, 0px), var(--tg-safe-area-inset-top, 0px)) + var(--tg-content-safe-area-inset-top, 0px));
  --safe-left:max(env(safe-area-inset-left,0px),var(--tg-safe-area-inset-left,0px),var(--tg-content-safe-area-inset-left,0px));
  --safe-right:max(env(safe-area-inset-right,0px),var(--tg-safe-area-inset-right,0px),var(--tg-content-safe-area-inset-right,0px));
  --safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--tg-safe-area-inset-bottom, 0px), var(--tg-content-safe-area-inset-bottom, 0px));
}
html {scroll-padding-block: 16px 90px;}
body {padding-top:var(--safe-top); padding-left:max(env(safe-area-inset-left, 0px), var(--tg-content-safe-area-inset-left, 0px)); padding-right:max(env(safe-area-inset-right, 0px), var(--tg-content-safe-area-inset-right, 0px));}
.main,.view-content,.stack,.account {min-width:0;}
.main {max-width:none; margin:0; align-self:start; padding:0 clamp(20px,2vw,38px) 28px;}
.app-shell {grid-template-columns:200px minmax(0,1fr); min-height:calc(var(--work-height) - var(--safe-top));}
.sidebar {height:calc(var(--work-height) - var(--safe-top)); top:var(--safe-top); padding:24px 12px max(20px,var(--safe-bottom)); overflow-y:auto; overscroll-behavior:contain;}
.brand {padding:0 6px 26px; gap:10px;}
.brand strong {font-size:18px;}
.topbar {height:auto; min-height:56px; gap:12px;}
.workshop-label {min-width:0; max-width:65%;}
.account {flex-shrink:0;}
.page-heading {padding:22px 0 20px;}
h1 {font-size:30px;}
.card {padding:22px;}
.workspace-grid {grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr); gap:20px;}
.settings-grid {grid-template-columns:minmax(0,1.25fr) minmax(330px,1fr); gap:20px;}
.workspace-grid>.stack {grid-template-columns:1fr;}
.empty-body {min-height:clamp(210px,calc(var(--work-height) - 310px),480px); padding:24px 12px;}
.price-list {max-height:clamp(180px,calc(var(--work-height) - 440px),640px); overscroll-behavior:contain; scrollbar-gutter:stable; padding-right:6px;}
.price-row>span {min-width:0; overflow-wrap:anywhere;}
.price-row strong {align-self:flex-start;}
.section-top {flex-wrap:wrap; margin-bottom:16px;}
.person {flex-wrap:wrap;}
.person-info {min-width:100px;}
.card h2,.card h3,.quiet p {overflow-wrap:anywhere;}
input,textarea,button {scroll-margin-block:16px 90px;}
.skip-link {position:fixed; left:16px; top:-100px; z-index:30; background:var(--card); padding:12px 18px; border:2px solid var(--blue); border-radius:10px;}
.skip-link:focus {top:calc(var(--safe-top) + 8px);}
.welcome {min-height:calc(var(--work-height) - var(--safe-top));}
/* Wide desktop: give useful width to both columns, rather than enlarging text. */
@media (min-width:1600px) {
  .app-shell {grid-template-columns:220px minmax(0,1fr);}
  .main {padding-inline:36px;}
  .workspace-grid {grid-template-columns:minmax(0,1.8fr) minmax(360px,1fr); gap:28px;}
  .settings-grid {grid-template-columns:minmax(0,1.2fr) minmax(420px,1fr); gap:28px;}
  .card {padding:26px;}
  .price-row {font-size:14px; padding-block:15px;}
}
/* Tablet landscape and narrow desktop windows: compact labelled side rail. */
@media (min-width:641px) and (max-width:1279px) {
  .app-shell {grid-template-columns:96px minmax(0,1fr);}
  .sidebar {padding-inline:7px;}
  .brand {justify-content:center; padding:0 0 22px;}
  .brand>div:last-child,.sidebar-foot {display:none;}
  .navigation {gap:8px;}
  .nav-item {flex-direction:column; text-align:center; gap:7px; padding:10px 2px; font-size:11px; min-height:66px;}
  .main {padding-inline:20px;}
  .workspace-grid,.settings-grid {gap:16px; grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr);}
  .card {padding:18px; border-radius:16px;}
  .settings-grid .form-grid {grid-template-columns:1fr;}
  .segmented {flex-wrap:wrap;}
  .segment {min-width:70px;}
}
@media (min-width:641px) and (max-width:959px) {
  .workspace-grid,.settings-grid {grid-template-columns:minmax(0,1fr);}
  .workspace-grid>aside {grid-template-columns:repeat(2,minmax(0,1fr));}
  .empty-body {min-height:200px;}
}
/* A Telegram header or the on-screen keyboard can leave little height. */
@media (min-width:641px) and (max-height:740px) {
  .topbar {min-height:48px;}
  .page-heading {padding-block:12px;}
  .page-heading .eyebrow {margin-bottom:4px; font-size:11px;}
  h1 {font-size:26px;}
  .sidebar {padding-top:16px;}
  .brand {padding-bottom:18px;}
  .card {padding:18px;}
  .stack {gap:16px;}
  .empty-body {min-height:180px; padding-block:16px; gap:10px;}
  .calendar-symbol,.document-symbol {width:58px;height:58px;font-size:24px;margin-bottom:4px;}
  .fact {padding-block:12px;}
  .field {margin-block:12px;}
  .form-heading {padding-top:16px;}
  .section-top {margin-bottom:12px;}
}
/* Phone / very narrow window: keep the existing bottom navigation. */
@media (max-width:640px) {
  .app-shell {display:block;}
  .sidebar {height:auto;position:fixed;bottom:0;top:auto;left:0;right:0;z-index:10;padding:8px 8px calc(8px + var(--safe-bottom));border:0;border-top:1px solid var(--line);}
  .brand,.sidebar-foot {display:none;}
  .navigation {grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;}
  .nav-item {flex-direction:column;gap:5px;padding:8px 2px;font-size:10px;min-height:55px;border-radius:10px;text-align:center;}
  .nav-symbol {font-size:23px;}
  .main {padding:0 16px calc(100px + var(--safe-bottom));}
  .topbar {min-height:56px;}
  .account {gap:10px;font-size:12px;}
  .page-heading {padding:22px 2px 18px;}
  h1 {font-size:29px;}
  .page-heading>.badge {display:none;}
  .card {padding:20px;border-radius:17px;}
  .workspace-grid,.settings-grid,.stack {grid-template-columns:minmax(0,1fr);gap:16px;}
  .workspace-grid>aside,.form-grid {grid-template-columns:minmax(0,1fr);}
  .empty-body {min-height:240px;padding:20px 0;}
  .field {margin:12px 0;}
  .person .text-button {font-size:12px;}
  .section-top h2 {font-size:18px;}
  .section-top .badge {font-size:10px;white-space:normal;}
  .welcome h1 {font-size:34px;}
  #notice {bottom:calc(90px + var(--safe-bottom));}
}
@media (pointer:coarse) {
  .segment,.text-button {min-height:46px;}
  .price-row {min-height:46px;}
}
@media (hover:hover) {
  .nav-item:hover {background:var(--blue-soft);color:var(--blue);}
  .button:hover {filter:brightness(.95);}
}

/* Typing never changes a field's width or auto-expands its height. */
.field input {height:46px;}
.field textarea {resize:vertical;overflow-y:auto;}
.field {min-width:0;}
.keyboard-open #notice {top:calc(var(--safe-top) + 8px);bottom:auto;}
@media (max-width:640px) {
  .keyboard-open .sidebar {display:none;}
  .keyboard-open .main {padding-bottom:24px;}
}

.fullscreen-button {display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;min-width:44px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--blue);font-size:13px;white-space:nowrap;}
.fullscreen-button>span:first-child {font-size:23px;line-height:1;}
@media(max-width:959px) {.fullscreen-label {display:none;} .workshop-label {max-width:55%;}}
@media(max-width:420px) {.account>span {display:none;} .account {gap:8px;} .workshop-label {max-width:calc(100% - 110px);}}
/* Settings: ordinary right-aligned submit button; no floating footer. */
.settings-form {display:flex;flex-direction:column;}
.settings-save {align-self:flex-end;margin-top:12px;flex-shrink:0;}
.printing-fields {display:grid;grid-template-columns:minmax(0,1fr);gap:0 16px;}
@media (min-width:960px) {
  .settings-grid .form-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  .printing-fields {grid-template-columns:repeat(2,minmax(0,1fr));}
  .settings-form .field {margin-block:10px;gap:6px;}
  .settings-form .form-heading {margin-top:8px;padding-top:14px;}
  .settings-form textarea {height:96px;min-height:96px;}
}
@media (min-width:960px) and (max-height:850px) {
  .main {padding-bottom:16px;}
  .topbar {min-height:48px;}
  .page-heading {padding-block:12px;}
  .page-heading h1 {font-size:26px;}
  .page-heading .eyebrow {margin-bottom:4px;}
  .settings-grid .card {padding:18px;}
  .settings-grid .stack {gap:16px;}
  .settings-form .field {margin-block:8px;}
  .settings-form .form-heading {padding-top:10px;margin-top:6px;}
  .settings-form textarea {height:88px;min-height:88px;}
  .settings-save {margin-top:8px;}
  .settings-grid .price-list {max-height:clamp(120px,calc(var(--work-height) - 440px),340px);}
}

/* The workshop form determines desktop column height, not the service count. */
@media (min-width:960px) {
  .settings-grid {align-items:stretch;}
  .settings-side {contain:size;min-height:0;grid-template-rows:minmax(0,1fr);}
  .settings-price {display:flex;flex-direction:column;min-height:0;}
  .settings-price> :not(.price-list) {flex-shrink:0;}
  .settings-grid .settings-price .price-list {flex:1 1 0;min-height:0;max-height:none;overflow-y:auto;}
}

.theme-cycle {display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--blue);font-size:25px;line-height:1;flex-shrink:0;}
@media(max-width:640px) {
  .topbar {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding-block:6px;}
  .topbar .workshop-label {max-width:none;}
  .topbar .account {gap:6px;}
  .topbar .account>span {display:none;}
}

.file-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.file-toolbar .button{font-size:13px;padding:10px 12px}.file-dialog{color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:18px;width:min(880px,calc(100vw - 24px));max-height:calc(100dvh - var(--safe-top) - 24px);padding:0;margin:auto;overflow:auto}.file-dialog::backdrop{background:#0008}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 22px;border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:2}.dialog-content{padding:20px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px;flex-wrap:wrap}.import-changes{max-height:40vh;overflow:auto;margin-top:16px}.logo-preview{min-height:48px;display:flex;align-items:center}.logo-preview img{max-width:220px;max-height:100px;object-fit:contain}.print-preview{display:block;width:100%;height:60vh;background:white;border:1px solid var(--line);margin:14px 0}.file-dialog .printing-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.file-dialog input,.file-dialog textarea{max-width:100%}@media(max-width:640px){.file-dialog .printing-fields{grid-template-columns:1fr}.dialog-content{padding:16px}.dialog-heading{padding:10px 16px}.dialog-actions .button{flex:1}}

.file-dialog{scroll-padding-top:76px;scroll-padding-bottom:24px}.file-dialog [hidden]{display:none}

/* The two workshop actions share one row even in a narrow Mini App. */
.settings-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:10px;margin-top:12px;}
.settings-actions>.file-toolbar {display:flex;margin:0;min-width:0;}
.settings-actions>.file-toolbar>.button {width:100%;height:100%;}
.settings-actions>.settings-save {align-self:stretch;margin:0;min-width:0;}
.settings-actions .button {min-height:46px;white-space:normal;font-size:14px;padding:10px 12px;overflow-wrap:anywhere;}
.file-toolbar [hidden] {display:none;}
@media (min-width:960px) {
  .desktop-ui .settings-grid>.stack:first-child {grid-template-rows:minmax(0,1fr);}
  .desktop-ui .settings-side>.settings-price {height:100%;overflow:hidden;}
}
@media (max-width:959px) {
  .settings-price>.file-toolbar,.file-dialog .file-toolbar {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;}
  .file-toolbar .button,.file-toolbar .text-button {min-width:0;white-space:normal;overflow-wrap:anywhere;text-align:center;justify-content:center;}
  .file-toolbar>.field-hint {grid-column:1/-1;margin:0;}
  .file-dialog .dialog-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
  .file-dialog .dialog-actions>.button {min-width:0;white-space:normal;overflow-wrap:anywhere;padding-inline:10px;}
  .dialog-heading>h2 {min-width:0;font-size:18px;overflow-wrap:anywhere;}
  .dialog-heading>.text-button {flex-shrink:0;}
}

/* Equal text fields only in the desktop/two-column layout. */
@media (min-width:960px) {
  .desktop-ui .printing-fields>.field {grid-template-rows:auto minmax(0,1fr);align-self:stretch;}
  .desktop-ui .printing-fields textarea {height:128px;min-height:128px;resize:none;overflow-y:auto;}
  .desktop-ui .settings-form .printing-fields textarea {height:96px;min-height:96px;}
}
@media (min-width:960px) and (max-height:850px) {
  .desktop-ui .settings-form .printing-fields textarea {height:88px;min-height:88px;}
}

.price-edit {width:100%;background:transparent;color:var(--text);border:0;border-bottom:1px solid var(--line);border-radius:0;text-align:left;}
.price-edit:hover,.price-edit:focus-visible {background:var(--blue-soft);}

/* Smaller mobile captions preserve the full button names. */
@media (max-width:640px) {
  .button {font-size:13px;}
  .settings-actions .button,.file-toolbar .button,.file-toolbar .text-button,.file-dialog .dialog-actions>.button {font-size:12px;line-height:1.4;padding-inline:8px;overflow-wrap:normal;word-break:normal;hyphens:none;}
}

/* Team management belongs to Settings; each section can be collapsed. */
.settings-page {display:grid;gap:18px;}
.settings-fold {min-width:0;}
.settings-fold-heading {display:flex;align-items:center;gap:10px;min-height:46px;cursor:pointer;font-size:17px;font-weight:650;list-style:none;}
.settings-fold-heading::-webkit-details-marker {display:none;}
.settings-fold-heading::before {content:'›';font-size:24px;font-weight:400;color:var(--muted);line-height:1;transform:rotate(0);}
.settings-fold[open]>.settings-fold-heading::before {transform:rotate(90deg);}
.settings-fold-heading>.badge {margin-left:auto;}
.settings-fold-heading:focus-visible {outline:3px solid var(--blue);outline-offset:3px;border-radius:8px;}
.settings-form>.settings-fold+ .settings-fold {border-top:1px solid var(--line);margin-top:8px;padding-top:8px;}
.settings-form>.settings-fold>.muted,.settings-fold>div>.muted {margin-top:8px;}
.settings-team {padding-block:10px;}
.settings-team-content {padding-top:12px;}
.price-content {min-width:0;}
.price-content>input[type=search] {margin-top:16px;}
@media (min-width:960px) {
  .settings-grid:has(.price-fold[open]) {min-height:360px;}
  .price-fold {height:100%;min-height:0;}
  .price-fold[open]>.price-content {height:calc(100% - 46px);display:flex;flex-direction:column;min-height:0;}
  .price-content> :not(.price-list) {flex-shrink:0;}
  .settings-price:has(.price-fold:not([open])) {height:auto;align-self:start;}
  .settings-price .price-content .price-list {flex:1 1 0;min-height:0;overflow-y:auto;}
}
@media (max-width:959px) {
  .price-content>.file-toolbar {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;}
}
@media (max-width:640px) {
  /* Equal columns for however many sections the enabled modules leave. */
  .navigation {grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);}
  .settings-fold-heading {font-size:16px;}
  .settings-team-content>.workspace-grid {gap:12px;}
}

/* Keep the scroll area inside the card independently of native details layout. */
@media (min-width:960px) {
  .settings-price {position:relative;--price-inset:22px;}
  .price-fold[open]>.price-content {position:absolute;inset:calc(var(--price-inset) + 46px) var(--price-inset) var(--price-inset);height:auto;display:flex;flex-direction:column;min-height:0;}
}
@media (min-width:1600px) {.settings-price {--price-inset:26px;}}
@media (min-width:960px) and (max-height:850px) {.settings-price {--price-inset:18px;}}

/* Every settings action belongs to the fold that owns its fields. */
.section-save {display:flex;justify-content:flex-end;margin-top:12px;}
.section-save>.settings-save {margin:0;}
.printing-settings-form>.muted {margin-top:8px;}

/* Desktop text areas can be resized vertically at every window width. */
.desktop-ui .printing-fields textarea {resize:vertical;}
.settings-grid>.settings-team {grid-column:1;align-self:start;}

.settings-team-content>.workspace-grid {grid-template-columns:minmax(0,1fr);}

/* Desktop settings are a single accordion with identical section widths. */
.settings-desktop {grid-template-columns:minmax(0,1fr);max-width:1100px;gap:12px;}
.settings-desktop>.settings-fold {display:block;width:100%;height:auto;padding:10px 22px;align-self:start;}
.settings-desktop>.settings-fold>.settings-fold-heading {width:100%;}
.settings-desktop>.settings-fold[open]>form,.settings-desktop .settings-team-content {padding-block:10px;}
.settings-desktop .price-fold[open]>.price-content {position:static;inset:auto;height:auto;display:flex;flex-direction:column;padding-top:10px;}
.settings-desktop .settings-price .price-content .price-list {flex:none;max-height:clamp(180px,calc(var(--work-height) - 380px),500px);overflow-y:auto;}
.settings-desktop .button {width:240px;max-width:100%;}
.settings-desktop .settings-actions {grid-template-columns:minmax(0,1fr);width:240px;max-width:100%;margin-left:auto;}
.settings-desktop .file-toolbar {display:grid;grid-template-columns:minmax(0,240px);align-items:stretch;gap:10px;}
.settings-desktop .settings-actions>.file-toolbar {display:block;}
.settings-desktop .file-toolbar>.field-hint {margin:0;}
.settings-desktop .section-save>.button {margin:0;}

/* Paint the mobile rail through Telegram's top inset without moving its controls. */
@media (min-width:641px) {
  :root:not(.desktop-ui) .sidebar {--mobile-rail-width:200px;}
  :root:not(.desktop-ui) .sidebar::before {content:'';position:fixed;top:0;left:0;width:var(--mobile-rail-width);height:var(--safe-top);background:var(--card);border-right:1px solid var(--line);pointer-events:none;}
}
@media (min-width:641px) and (max-width:1279px) {:root:not(.desktop-ui) .sidebar {--mobile-rail-width:96px;}}
@media (min-width:1600px) {:root:not(.desktop-ui) .sidebar {--mobile-rail-width:220px;}}

/* Shared brand mark keeps its reserved box while the cached image loads. */
.brand-logo {display:block;width:64px;height:64px;object-fit:contain;flex:none;margin-bottom:20px;}
.brand-logo.small {width:34px;height:34px;margin-bottom:0;}

/* Every settings section has the same closed footprint on every device. */
.settings-uniform {grid-template-columns:minmax(0,1fr);gap:12px;max-width:1100px;}
.settings-uniform>.settings-fold {display:block;width:100%;height:auto;padding:10px 18px;align-self:start;}
.settings-uniform>.settings-fold>.settings-fold-heading {height:46px;min-height:46px;margin:0;font-size:16px;}
.settings-uniform>.settings-fold:not([open]) {height:68px;}
.settings-uniform .price-fold[open]>.price-content {position:static;inset:auto;height:auto;display:flex;flex-direction:column;padding-top:10px;}
.settings-uniform .settings-price .price-content .price-list {flex:none;max-height:clamp(180px,calc(var(--work-height) - 380px),500px);overflow-y:auto;}

/* Compact landscape windows keep touch targets while reducing empty vertical space. */
@media (min-width:641px) and (orientation:landscape) and (max-height:740px) {
  .main {padding-bottom:calc(8px + var(--safe-bottom));}
  .page-heading {padding-block:8px;}
  .card {padding-block:12px;}
  .section-top {margin-bottom:8px;}
  .settings-uniform {gap:8px;}
  .settings-uniform>.settings-fold {padding-block:6px;}
  .settings-uniform>.settings-fold:not([open]) {height:60px;}
  .settings-desktop>.settings-fold[open]>form {padding-block:6px;}
}
/* Only the desktop fullscreen workspace drops the decorative heading badge. */
.desktop-ui.fullscreen-ui .main:has(.planner,.orders-view) .page-heading>.badge {display:none;}

/* Desktop layout follows the actual window even while Telegram refreshes its cached height. */
:root.desktop-ui {--work-height:100dvh;}
/* The logo splash can be switched off in the settings. */
.no-splash .boot {visibility:hidden;}
/* Test environment: a line on the splash and a faint mark in the corner of every screen. */
.test-note {font-size:13px;letter-spacing:.08em;text-transform:uppercase;opacity:.55;}
.test-mark {position:fixed;top:calc(var(--safe-top,0px) + 1px);right:10px;z-index:50;font-size:10px;line-height:1;letter-spacing:.06em;text-transform:uppercase;opacity:.4;pointer-events:none;user-select:none;}
.terms {max-width:680px;text-align:left;}
.terms h1 {text-align:left;}
.terms-text {max-height:46vh;overflow:auto;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-size:14px;line-height:1.5;}
.terms-text p {margin:0 0 10px;}
.terms-text p:last-child {margin-bottom:0;}

.settings-links {display:flex;flex-wrap:wrap;gap:10px;}
.muted+.settings-links {margin-top:18px;}
.round-link {display:grid;justify-items:center;gap:6px;width:76px;color:var(--muted);font-size:12px;line-height:1.3;text-align:center;text-decoration:none;}
.round-icon {display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--blue-soft);color:var(--blue);}