[data-ui="mandrions"], [data-ui="mandrions"] * { box-sizing: border-box; }
[data-ui="mandrions"] button, [data-ui="mandrions"] input, [data-ui="mandrions"] select, [data-ui="mandrions"] textarea { font-family: inherit; }
[data-ui="mandrions"] button { cursor: pointer; }
[data-ui="mandrions"] button:disabled { cursor: not-allowed; opacity: .46; }
[data-ui="mandrions"] :focus-visible { outline: 3px solid var(--md-focus); outline-offset: 3px; }
[data-ui="mandrions"] a { color: inherit; }
[data-ui="mandrions"] img { display: block; max-width: 100%; }
[data-ui="mandrions"] h1, [data-ui="mandrions"] h2, [data-ui="mandrions"] h3, [data-ui="mandrions"] p { margin-top: 0; }
.md-catalog { min-height: 100vh; }
.md-catalog__layout { width: min(100%, 1750px); margin: auto; display: grid; grid-template-columns: 232px minmax(0, 1fr); }
.md-catalog__sidebar { min-height: 100vh; position: sticky; top: 0; align-self: start; height: 100vh; overflow-y: auto; padding: 24px 14px; background: #fff; border-right: 1px solid var(--md-border); }
.md-catalog__brand { display: flex; align-items: center; gap: 10px; padding: 0 10px 24px; font-weight: 800; font-size: 15px; letter-spacing: -.03em; }
.md-catalog__mark { width: 28px; height: 28px; display: grid; place-items: center; border: 1.5px solid var(--md-ink); border-radius: 50%; font-size: 15px; }
.md-catalog__nav { display: grid; gap: 3px; }
.md-catalog__nav a { display: flex; align-items: center; min-height: 40px; padding: 9px 11px; border-radius: 7px; color: #424242; text-decoration: none; font-size: 13px; }
.md-catalog__nav a:hover, .md-catalog__nav a[aria-current="location"] { background: #f3f3f3; color: #111; font-weight: 700; }
.md-catalog__main { min-width: 0; padding: 0 clamp(18px, 3vw, 48px) 70px; }
.md-catalog__topbar { position: sticky; top: 0; z-index: 30; display: flex; justify-content: space-between; align-items: center; min-height: 64px; gap: 16px; background: rgb(245 245 245 / 94%); backdrop-filter: blur(12px); border-bottom: 1px solid var(--md-border); }
.md-catalog__intro { padding: 42px 0 30px; }
.md-catalog__intro h1 { font-size: clamp(32px, 4vw, 52px); line-height: 1.06; letter-spacing: -.055em; margin: 10px 0 12px; }
.md-catalog__intro p { color: var(--md-muted); max-width: 760px; margin: 0; }
.md-catalog__menu { display: none !important; }
.md-catalog__mobile-nav { display: none; }
.md-muted { color: var(--md-muted); }
.md-eyebrow { color: var(--md-muted); font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.md-small { font-size: 13px; }
.md-stack { display: grid; gap: var(--md-space-4); }
.md-row { display: flex; align-items: center; gap: var(--md-space-3); flex-wrap: wrap; }
.md-between { display: flex; justify-content: space-between; align-items: center; gap: var(--md-space-4); flex-wrap: wrap; }
.md-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--md-space-4); }
.md-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.md-surface { background: var(--md-surface); border: 1px solid var(--md-border); border-radius: var(--md-radius-lg); box-shadow: var(--md-shadow); min-width: 0; }
.md-pad { padding: var(--md-space-6); }
.md-section { scroll-margin-top: 76px; padding: var(--md-space-8); }
.md-section + .md-section { margin-top: var(--md-space-6); }
.md-section__head { display: flex; justify-content: space-between; align-items: start; gap: 16px; border-bottom: 1px solid var(--md-border); padding-bottom: 18px; margin-bottom: 24px; }
.md-section__head h2 { font-size: 23px; line-height: 1.2; margin: 4px 0 0; letter-spacing: -.03em; }
.md-section__head p { max-width: 650px; margin: 8px 0 0; color: var(--md-muted); font-size: 14px; }
.md-demo { border: 1px solid var(--md-border); border-radius: var(--md-radius); background: var(--md-surface-soft); padding: 20px; min-width: 0; }
.md-demo__label { display: block; margin-bottom: 14px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--md-muted); }
.md-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--md-primary); border-radius: 7px; background: var(--md-primary); color: #fff; padding: 9px 16px; font-weight: 600; font-size: 14px; text-decoration: none; line-height: 1.2; white-space: nowrap; }
[data-ui="mandrions"] a.md-button { color: #fff; }
.md-button:hover:not(:disabled) { background: #333; }
.md-button--secondary { color: var(--md-ink); border-color: var(--md-border-strong); background: #fff; }
.md-button--secondary:hover:not(:disabled), .md-button--quiet:hover:not(:disabled) { background: #f3f3f3; }
.md-button--quiet { border-color: transparent; background: transparent; color: var(--md-ink); }
.md-button--danger { background: var(--md-danger); border-color: var(--md-danger); }
.md-button--danger:hover:not(:disabled) { background: #922625; }
.md-button--icon { width: 44px; padding: 0; font-size: 20px; }
.md-link { color: var(--md-info) !important; text-underline-offset: 3px; font-weight: 600; }
.md-badge { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 4px 9px; font-size: 12px; font-weight: 700; background: #f1f1f1; color: #3d3d3d; white-space: nowrap; }
.md-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.md-badge--success { color: var(--md-success); background: var(--md-success-bg); }
.md-badge--warning { color: var(--md-warning); background: var(--md-warning-bg); }
.md-badge--danger { color: var(--md-danger); background: var(--md-danger-bg); }
.md-badge--info { color: var(--md-info); background: var(--md-info-bg); }
.md-field { display: grid; gap: 7px; min-width: 0; }
.md-field label, .md-field__label { font-size: 13px; font-weight: 700; }
.md-field input, .md-field select, .md-field textarea, .md-search { min-height: 44px; width: 100%; border: 1px solid var(--md-border-strong); border-radius: 7px; background: #fff; color: var(--md-ink); padding: 10px 12px; font-size: 16px; }
.md-field textarea { min-height: 98px; resize: vertical; }
.md-field__hint { color: var(--md-muted); font-size: 12px; }
.md-field__error { color: var(--md-danger); font-size: 12px; font-weight: 600; }
.md-field [aria-invalid="true"] { border-color: var(--md-danger); }
.md-select-control { position:relative; }
.md-field .md-select-control select { appearance:none; padding-right:38px; cursor:pointer; }
.md-select-control > .md-icon { position:absolute; top:50%; right:12px; width:15px; height:15px; transform:translateY(-50%) rotate(90deg); pointer-events:none; color:#5a5a5a; }
.md-select-control select:focus-visible { outline:2px solid var(--md-focus); outline-offset:2px; }
.md-field .md-select-control select:disabled { background:var(--md-surface-soft); color:var(--md-muted); cursor:not-allowed; }
.md-select-control select:disabled + .md-icon { color:#9a9a9a; }
.md-upload { display:grid; gap:8px; }
.md-upload .md-upload__input { position:absolute; width:1px; height:1px; min-height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.md-upload__drop { display:flex; align-items:center; justify-content:center; gap:12px; min-height:116px; padding:18px; border:1px dashed #b8bdc3; border-radius:8px; background:#fafafa; color:var(--md-ink); text-align:left; cursor:pointer; transition:border-color 160ms ease,background-color 160ms ease; }
.md-upload__drop > .md-icon { width:24px; height:24px; color:#5a5a5a; }
.md-upload__drop > span { display:grid; gap:5px; }
.md-upload__drop strong { font-size:13px; font-weight:600; }
.md-upload__drop strong u { text-underline-offset:3px; }
.md-upload__drop small { color:var(--md-muted); font-size:12px; }
.md-upload__input:focus-visible + .md-upload__drop { outline:2px solid var(--md-focus); outline-offset:2px; }
.md-upload__drop:hover,.md-upload.is-dragging .md-upload__drop { border-color:#1c1c1c; background:#f3f3f3; }
.md-upload__file { display:flex; align-items:center; gap:10px; min-width:0; min-height:44px; padding:5px 6px 5px 10px; border:1px solid var(--md-border); border-radius:7px; background:#fff; }
.md-upload__file[hidden] { display:none; }
.md-upload__file > .md-icon { color:#5a5a5a; }
.md-upload__name { flex:1; min-width:0; overflow:hidden; color:var(--md-ink); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.md-upload__file .md-button { min-width:36px; min-height:36px; }
.md-choice { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.md-choice input { width: 18px; height: 18px; accent-color: var(--md-primary); }
.md-switch { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; }
.md-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.md-switch__track { width: 42px; height: 25px; border-radius: 20px; background: #b8b8b8; padding: 3px; transition: background .18s; }
.md-switch__track::after { content: ""; display: block; width: 19px; height: 19px; border-radius: 50%; background: #fff; transition: transform .18s; }
.md-switch input:checked + .md-switch__track { background: var(--md-primary); }
.md-switch input:checked + .md-switch__track::after { transform: translateX(17px); }
.md-switch input:focus-visible + .md-switch__track { outline: 3px solid var(--md-focus); outline-offset: 3px; }
.md-stepper { display: inline-flex; align-items: center; border: 1px solid var(--md-border-strong); border-radius: 7px; overflow: hidden; background: #fff; }
.md-stepper button { width: 44px; height: 44px; background: #fff; border: 0; font-size: 20px; }
.md-stepper output { min-width: 35px; text-align: center; font-weight: 700; }
.md-tabs { display: flex; border-bottom: 1px solid var(--md-border); overflow-x: auto; }
.md-tabs button { min-height: 44px; border: 0; border-bottom: 2px solid transparent; padding: 10px 15px; background: none; color: var(--md-muted); white-space: nowrap; font-weight: 600; }
.md-tabs button[aria-selected="true"] { border-color: var(--md-ink); color: var(--md-ink); }
.md-tabpanel { padding-top: 16px; }
.md-kpi { padding: 18px; min-width: 0; }
.md-kpi__value { display: block; margin: 12px 0 2px; font-size: clamp(24px, 2.3vw, 32px); font-weight: 700; letter-spacing: -.05em; }
.md-kpi__trend { color: var(--md-success); font-size: 12px; font-weight: 700; }
.md-avatar { display: inline-grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 50%; background: #e8e8e8; color: #333; font-size: 12px; font-weight: 700; }
.md-table-wrap { overflow-x: auto; }
.md-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.md-table th { color: var(--md-muted); font-size: 11px; font-weight: 700; text-align: left; white-space: nowrap; }
.md-table th, .md-table td { border-bottom: 1px solid var(--md-border); padding: 14px 12px; }
.md-table td { vertical-align: middle; }
.md-table tbody tr:hover { background: #fafafa; }
.md-table .md-sort { min-height: 30px; border: 0; background: none; padding: 0; text-align: left; font-size: 11px; font-weight: 700; color: var(--md-muted); }
.md-list { display: none; gap: 10px; }
.md-list__item { padding: 16px; }
.md-detail { border-left: 1px solid var(--md-border); padding: 18px; background: #fff; }
.md-data-layout { display: grid; grid-template-columns: minmax(0, 1fr) 235px; }
.md-popover { position: relative; display: inline-block; }
.md-popover__panel { position: absolute; z-index: 15; top: calc(100% + 6px); right: 0; width: min(280px, calc(100vw - 50px)); padding: 14px; border: 1px solid var(--md-border); border-radius: var(--md-radius); background: #fff; box-shadow: var(--md-shadow-overlay); }
.md-popover__panel[hidden], .md-tabpanel[hidden], .md-toast[hidden], .md-empty[hidden], .md-list__item[hidden], .md-table tr[hidden] { display: none !important; }
.md-overlay { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 18px; background: rgb(20 20 20 / 48%); }
.md-overlay[hidden] { display: none; }
.md-dialog, .md-sheet { width: min(100%, 460px); max-height: min(88dvh, 720px); overflow: auto; padding: 25px; background: #fff; border-radius: 12px; box-shadow: var(--md-shadow-overlay); }
.md-dialog h3, .md-sheet h3 { margin-bottom: 8px; font-size: 20px; }
.md-sheet { width: min(100%, 420px); margin-left: auto; height: min(100%, 760px); border-radius: 12px 0 0 12px; }
.md-overlay--sheet { place-items: stretch end; padding: 0; }
.md-toast { position: fixed; z-index: 130; bottom: 24px; right: 24px; max-width: min(360px, calc(100vw - 32px)); padding: 14px 16px; background: var(--md-ink); color: #fff; border-radius: 8px; box-shadow: var(--md-shadow-overlay); font-size: 14px; }
.md-banner { padding: 14px 16px; border: 1px solid #c6dbf9; border-radius: 8px; background: var(--md-info-bg); color: #193d7c; font-size: 14px; }
.md-banner--danger { background: var(--md-danger-bg); color: var(--md-danger); border-color: #f2c7c5; }
.md-empty { padding: 28px; text-align: center; border: 1px dashed var(--md-border-strong); border-radius: var(--md-radius); background: #fff; }
.md-empty h3 { margin: 0 0 5px; font-size: 16px; }
.md-skeleton { height: 13px; background: linear-gradient(90deg, #e9e9e9, #f5f5f5, #e9e9e9); background-size: 200% 100%; border-radius: 4px; animation: md-shimmer 1.4s infinite; }
@keyframes md-shimmer { to { background-position-x: -200%; } }
.md-calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.md-day { min-width: 0; padding: 12px; border: 1px solid var(--md-border); border-radius: 8px; background: #fff; }
.md-day strong { display: block; margin-bottom: 12px; font-size: 12px; }
.md-shift { display: block; margin-top: 6px; padding: 8px; border-radius: 6px; background: var(--md-info-bg); color: #214c91; font-size: 11px; line-height: 1.3; }
.md-shift--warning { background: var(--md-warning-bg); color: var(--md-warning); }
.md-slot { min-height: 44px; padding: 8px 14px; border: 1px solid var(--md-border-strong); border-radius: 7px; background: #fff; }
.md-slot[aria-pressed="true"] { background: var(--md-ink); color: #fff; }
.md-slot:disabled { background: #eee; text-decoration: line-through; }
.md-order { padding: 16px; border: 1px solid var(--md-border); border-radius: 8px; background: #fff; }
.md-order__time { font-size: 26px; font-weight: 700; letter-spacing: -.04em; }
.md-table-map { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.md-floor-plan .md-table-map { grid-template-columns:repeat(4,minmax(0,1fr)); }
.md-table-map button { min-height: 66px; border: 1px solid var(--md-border-strong); border-radius: 10px; background: #fff; font-weight: 700; }
.md-table-map button[aria-pressed="true"] { border-color: var(--md-ink); box-shadow: inset 0 0 0 1px var(--md-ink); }
.md-chart-bars { height: 170px; display: flex; align-items: end; gap: 8px; border-bottom: 1px solid var(--md-border); }
.md-chart-bars span { flex: 1; min-width: 0; height: var(--bar); background: #e8e8e8; border-radius: 4px 4px 0 0; position: relative; }
.md-chart-bars span.is-active { background: #333; }
.md-chart-bars span::after { content: attr(data-label); position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%); font-size: 10px; color: var(--md-muted); }
.md-chart-line { width: 100%; height: 90px; }
.md-progress { height: 8px; border-radius: 10px; background: #ededed; overflow: hidden; }
.md-progress span { display: block; width: var(--progress); height: 100%; background: var(--md-success); border-radius: inherit; }
.md-hero { min-height: 330px; display: grid; grid-template-columns: .92fr 1.08fr; overflow: hidden; }
.md-hero__copy { padding: clamp(24px, 4vw, 54px); display: flex; flex-direction: column; align-items: start; justify-content: center; }
.md-hero :is(h1, h2, h3) { font-size: clamp(30px, 4vw, 52px); line-height: 1.05; letter-spacing: -.05em; margin: 10px 0 14px; }
.md-hero img { width: 100%; height: 100%; object-fit: cover; }
.md-hero--overlay { position: relative; display: block; color: #fff; }
.md-hero--overlay img { position: absolute; inset: 0; }
.md-hero--overlay::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(0 0 0 / 77%), rgb(0 0 0 / 12%)); }
.md-hero--overlay .md-hero__copy { position: relative; z-index: 1; min-height: 330px; max-width: 640px; }
.md-photo-card { overflow: hidden; }
.md-photo-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.md-photo-card__body { padding: 16px; }
.md-photo-card__body h3 { margin-bottom: 4px; font-size: 16px; }
.md-photo-card__body p { margin: 0; color: var(--md-muted); font-size: 13px; }
.md-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.md-gallery button { padding: 0; border: 0; border-radius: 8px; overflow: hidden; }
.md-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.md-lightbox { width: min(900px, 100%); padding: 8px; background: #fff; border-radius: 12px; }
.md-lightbox img { width: 100%; max-height: 75dvh; object-fit: contain; background: #eee; }
.md-tooltip { position: relative; display: inline-flex; }
.md-tooltip__text { position: absolute; z-index: 10; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); width: max-content; max-width: 230px; border-radius: 6px; padding: 7px 9px; background: var(--md-ink); color: #fff; font-size: 12px; pointer-events: none; opacity: 0; }
.md-tooltip:hover .md-tooltip__text, .md-tooltip:focus-within .md-tooltip__text { opacity: 1; }

@media (max-width: 1199px) {
  .md-catalog__layout { grid-template-columns: 190px minmax(0, 1fr); }
  .md-calendar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md-calendar .md-day:nth-child(n+4) { display: none; }
  .md-data-layout { grid-template-columns: minmax(0, 1fr) 210px; }
}
@media (max-width: 767px) {
  .md-catalog__layout { display: block; }
  .md-catalog__sidebar { display: none; }
  .md-catalog__main { padding: 0 14px 40px; }
  .md-catalog__menu { display: inline-flex !important; }
  .md-catalog__topbar { min-height: 60px; }
  .md-catalog__topbar > .md-small { display: none; }
  .md-catalog__mobile-nav { display: block; position: fixed; z-index: 90; inset: 0 auto 0 0; width: min(300px, 85vw); overflow-y: auto; padding: 20px; background: #fff; box-shadow: var(--md-shadow-overlay); }
  .md-catalog__mobile-nav[hidden] { display: none; }
  .md-catalog__intro { padding: 28px 4px 24px; }
  .md-section { padding: 18px; }
  .md-grid, .md-grid--three { grid-template-columns: minmax(0, 1fr); }
  .md-section__head { display: block; }
  .md-data-layout { display: block; }
  .md-table-wrap, .md-detail { display: none; }
  .md-list { display: grid; }
  .md-calendar { grid-template-columns: minmax(0, 1fr); }
  .md-calendar .md-day:nth-child(n+2) { display: none; }
  .md-hero { grid-template-columns: 1fr; }
  .md-hero img { max-height: 270px; }
  .md-hero--overlay img { max-height: none; }
  .md-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md-tooltip__text { left: auto; right: 0; transform: none; }
  .md-overlay--sheet { place-items: end stretch; }
  .md-sheet { width: 100%; height: auto; max-height: 88dvh; margin: 0; border-radius: 14px 14px 0 0; padding-bottom: max(25px, env(safe-area-inset-bottom)); }
  .md-toast { bottom: max(16px, env(safe-area-inset-bottom)); right: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .md-skeleton { animation: none; }
  .md-loading-ring { animation:none !important; }
  .md-switch__track, .md-switch__track::after { transition: none; }
  .md-bar-plot rect, .md-week-plot path, .md-sparkline path, #grafici .md-progress span { animation:none !important; }
}

/* Reference compositions, shared by catalogue examples and future consumers. */
.md-icon { width:18px; height:18px; display:inline-block; vertical-align:middle; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.md-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.md-catalog__layout { grid-template-columns:196px minmax(0,1fr); max-width:1800px; }
.md-catalog__main { padding:0 28px 48px; }
.md-catalog__brand { display:block; font-size:21px; letter-spacing:-.06em; }
.md-brand-caption { display:block; margin-top:6px; font-size:11px; font-weight:400; color:var(--md-muted); letter-spacing:0; }
.md-catalog__intro { padding:28px 0; }
.md-catalog__intro h1 { font-size:32px; letter-spacing:-.04em; }
.md-catalog__intro p { font-size:14px; }
.md-catalog__nav a { gap:10px; min-height:44px; }
.md-section { padding:0; scroll-margin-top:84px; }
.md-section + .md-section { margin-top:48px; }
.md-section__head { border:0; padding:0; margin-bottom:18px; }
.md-section__head h2 { font-size:23px; }
.md-section__head p { font-size:13px; }
.md-section__head .md-eyebrow { font-size:10px; font-weight:600; }
.md-demo { background:#fff; }
.md-surface { box-shadow:0 2px 8px rgb(0 0 0 / 2%); }
.md-demo__label { font-size:11px; font-weight:600; }
.md-button { font-size:13px; font-weight:600; border-radius:7px; min-width:44px; }
.md-button--secondary { border-color:var(--md-border); }
[data-ui="mandrions"] a.md-button--secondary { color:var(--md-ink); }
.md-badge { padding:4px 8px; border-radius:5px; font-size:11px; font-weight:600; }
.md-table .md-badge::before, .md-person > .md-badge::before, .md-booking-summary .md-badge::before { display:none; }
.md-example-header { min-height:68px; padding:16px 20px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--md-border); }
.md-example-header h3 { font-size:16px; margin:0; letter-spacing:-.02em; display:flex; align-items:center; gap:8px; }
.md-input-icon { position:relative; }
.md-input-icon > .md-icon { position:absolute; top:50%; left:12px; transform:translateY(-50%); color:var(--md-muted); }
.md-field .md-input-icon input, .md-input-icon input { width:100%; min-height:44px; padding:10px 12px 10px 38px; border:1px solid var(--md-border); border-radius:7px; background:#fff; color:var(--md-ink); font-size:14px; }
.md-search-field { width:min(260px,100%); }
.md-search-field input { background:var(--md-surface-soft); }
.md-field input, .md-field select, .md-field textarea { border-color:var(--md-border); font-size:14px; }
.md-field label, .md-field__label { font-size:12px; font-weight:600; }
.md-field { align-content:start; }
.md-field [aria-invalid="true"] { border-color:var(--md-danger); }
.md-control-actions { display:grid; width:100%; }
.md-control-actions .md-popover__panel { top:100%; right:20px; }
.md-form-examples { display:grid; grid-template-columns:minmax(0,460px) minmax(0,1fr); gap:20px; margin-top:20px; }
.md-select-demo { margin-top:20px; }
.md-select-demo__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.md-select-demo__grid .md-field__hint { min-height:17px; }
@media (max-width:900px) { .md-select-demo__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:767px) { .md-select-demo__grid { grid-template-columns:1fr; gap:16px; } }
.md-form-examples > .md-stack { align-content:start; }
.md-booking-form { margin-top:22px; gap:18px; }
.md-booking-form .md-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.md-form-actions { display:flex; gap:10px; justify-content:end; padding-top:12px; border-top:1px solid var(--md-border); }
.md-form-actions > button { flex:1; }
.md-dialog { padding:24px; max-height:92dvh; }
.md-dialog .md-between h3 { margin:0; font-size:18px; }
.md-dialog .md-between > button { width:44px; padding:0; border:0; }
.md-confirm-icon { width:56px; height:56px; display:grid; place-items:center; border-radius:50%; background:var(--md-danger-bg); color:var(--md-danger); margin:0 auto 20px; }
#delete-dialog .md-dialog { text-align:center; }
#delete-dialog .md-row { justify-content:center; }
.md-kpis { margin-bottom:20px; }
.md-kpi { padding:0; overflow:hidden; }
.md-kpi__label { padding:12px 16px; font-size:12px; font-weight:500; background:#fafafa; border-bottom:1px solid var(--md-border); }
.md-kpi__body { padding:16px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.md-kpi__value { font-size:28px; margin:0 0 6px; }
.md-kpi__trend { font-size:11px; font-weight:500; }
.md-sparkline { width:82px; height:52px; flex-shrink:1; }
.md-toolbar { padding:14px 20px; display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.md-segmented { display:flex; padding:3px; gap:2px; background:#f5f5f5; border-radius:8px; }
.md-segmented .md-button { background:none; border-color:transparent; min-height:44px; padding:8px 10px; font-size:12px; }
.md-segmented .md-button[aria-pressed="true"] { background:#fff; box-shadow:0 1px 4px rgb(0 0 0 / 8%); }
.md-data-layout { grid-template-columns:minmax(0,1fr) 310px; }
.md-data-layout.is-empty { grid-template-columns:1fr; }
.md-bookings__results { min-width:0; }
.md-table-wrap[hidden], .md-detail[hidden], .md-banner[hidden] { display:none !important; }
.md-table { font-size:12px; }
.md-table th { font-size:11px; font-weight:400; height:44px; }
.md-table th, .md-table td { padding:7px 10px; }
.md-table tbody tr.is-selected { background:#f2f7ff; }
.md-table tbody tr:hover { background:#f7f9fc; }
.md-table .md-sort { font-size:11px; font-weight:400; min-height:44px; }
.md-table .md-button--icon { width:44px; min-height:44px; }
.md-person-button { display:flex; align-items:center; gap:8px; background:none; border:0; padding:0; color:var(--md-ink); text-align:left; min-height:44px; font-size:12px; }
.md-person-button span:last-child { white-space:nowrap; }
.md-avatar { width:30px; height:30px; font-size:10px; font-weight:600; background:#f0eeeb; }
.md-note-preview { display:block; max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--md-muted); }
.md-detail { padding:20px; }
.md-detail-heading { font-size:15px; margin-bottom:22px; }
.md-person { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:20px 0; }
.md-person h3 { font-size:16px; margin:0 0 4px; }
.md-person .md-avatar { width:44px; height:44px; font-size:14px; }
.md-person > .md-badge { margin-left:auto; }
.md-tabs button { font-size:12px; font-weight:500; padding:10px 12px; }
.md-detail-fields { border:1px solid var(--md-border); border-radius:8px; padding:0 12px; margin:0; font-size:12px; }
.md-detail-fields > div { display:grid; grid-template-columns:85px 1fr; gap:12px; padding:13px 0; border-bottom:1px solid var(--md-border); }
.md-detail-fields > div:last-child { border:0; }
.md-detail-fields dt { display:flex; align-items:start; gap:8px; color:var(--md-muted); font-weight:500; }
.md-detail-fields dd { margin:0; overflow-wrap:anywhere; }
.md-detail-fields .md-icon { width:15px; height:15px; }
.md-detail-notes { font-size:13px; min-height:260px; }
.md-detail-actions { display:grid; gap:8px; margin-top:22px; }
.md-timeline { list-style:none; margin:16px 0; padding:0 0 0 14px; border-left:1px solid var(--md-border); }
.md-timeline li { position:relative; padding-bottom:28px; font-size:13px; }
.md-timeline li::before { content:''; position:absolute; left:-19px; top:5px; width:8px; height:8px; border-radius:50%; background:var(--md-success); }
.md-timeline small { display:block; margin-top:6px; color:var(--md-muted); }
.md-pagination { border-top:1px solid var(--md-border); padding:12px 20px; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.md-pagination .md-button { width:44px; padding:0; }
.md-pagination .md-row { gap:4px; }
.md-page-number { width:44px; height:44px; border:1px solid var(--md-border); border-radius:6px; background:#fff; }
.md-page-number[aria-current] { background:var(--md-primary); color:#fff; border-color:var(--md-primary); }
.md-empty--search { border:0; padding:70px 24px; min-height:340px; }
.md-empty--search > .md-icon { width:48px; height:48px; margin-bottom:20px; color:#b7b9bd; }
.md-empty--search h3 { font-size:19px; }
.md-empty--search p { color:var(--md-muted); font-size:14px; }
.md-sheet--detail { width:min(100%,460px); height:100%; max-height:100dvh; border-radius:12px 0 0 12px; }
.md-sheet--detail .md-person h3 { font-size:20px; }
.md-sheet--detail .md-detail-fields { font-size:14px; }
.md-sheet--detail .md-detail-fields > div { grid-template-columns:100px 1fr; }
.md-sheet--detail .md-detail-fields dt { align-items:center; }
.md-examples-row { margin-top:20px; }
.md-pad h3 { font-size:16px; }
.md-schedule { display:grid; grid-template-columns:165px repeat(var(--days),minmax(0,1fr)); font-size:12px; }
.md-schedule-head { text-align:center; padding:18px 8px; border-bottom:1px solid var(--md-border); border-right:1px solid var(--md-border); font-weight:600; }
.md-staff { display:flex; align-items:center; gap:9px; padding:16px 12px; border-right:1px solid var(--md-border); border-bottom:1px solid var(--md-border); }
.md-staff strong { font-size:12px; font-weight:600; }
.md-staff small { display:block; margin-top:4px; color:var(--md-muted); }
.md-schedule-cell { padding:8px; border-bottom:1px solid var(--md-border); border-right:1px solid var(--md-border); }
.md-shift { width:100%; display:grid; align-content:center; gap:8px; min-height:74px; margin:0; padding:10px 8px; text-align:left; border:1px solid transparent; border-radius:7px; font-size:11px; }
.md-shift strong { font-weight:600; white-space:nowrap; }
.md-shift span { display:flex; gap:6px; align-items:center; }
.md-shift--kitchen { background:#edfaef; border-color:#dff2e1; color:#237a34; }
.md-shift--floor { background:#edf5ff; border-color:#e0edfe; color:#2863b8; }
.md-shift--evening { background:#f4edff; border-color:#ebe0fb; color:#7944b8; }
.md-shift--empty { background:#fafafa; border:1px solid #f1f1f1; color:#808080; justify-content:center; }
.md-shift--warning { background:var(--md-danger-bg); color:var(--md-danger); }
.md-dot { width:8px; height:8px; display:inline-block; border-radius:50%; background:currentColor; flex:none; }
.md-dot--green { color:#4cb751; }.md-dot--blue { color:#568fea; }.md-dot--violet { color:#a47bdf; }
.md-schedule-legend { display:flex; flex-wrap:wrap; gap:20px; padding:16px 20px; font-size:12px; }
.md-schedule-legend span { display:flex; align-items:center; gap:7px; }
.md-conflict { display:grid; gap:8px; margin:16px 0; font-size:13px; }
.md-conflict .md-shift { min-height:38px; }
.md-operations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:start; }
.md-operational-panel { background:#fafafa; }
.md-operational-panel .md-example-header { padding:16px; }
.md-operational-panel .md-example-header h3 { font-size:14px; }
.md-order { margin:12px; padding:16px; }
.md-order__header { background:#fffbf0; margin:-16px -16px 0; padding:16px; border-radius:8px 8px 0 0; }
.md-order__header--delivery { background:#eff7fd; }
.md-order__header h3 { font-family:var(--md-font); font-size:24px; font-weight:700; letter-spacing:-.04em; margin:0; }
.md-order__header .md-between { gap:8px; margin-bottom:8px; }
.md-order__header p { margin:10px 0 0; }
.md-order-lines > div { display:flex; align-items:start; gap:16px; padding:16px 0; border-bottom:1px solid var(--md-border); font-size:13px; }
.md-order-lines small { display:block; margin-top:5px; color:var(--md-muted); font-size:11px; font-weight:400; }
.md-order-lines > div > span { font-weight:600; }
.md-order > .md-button { width:100%; margin-top:8px; }
.md-order > p { margin:16px 0; }
.md-delivery-steps { display:flex; margin:20px 0; }
.md-delivery-steps span { width:33.333%; border-top:3px solid var(--md-border); padding-top:8px; font-size:10px; font-weight:500; color:var(--md-muted); }
.md-delivery-steps .is-done { border-color:var(--md-success); color:var(--md-success); }
.md-delivery-steps .is-current { border-color:var(--md-info); color:var(--md-info); }
.md-floor-plan { border:4px solid #dedede; margin:16px; background:#fff; padding:12px; }
.md-table-map { grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.md-table-map button.md-seat { display:grid; gap:6px; min-height:90px; padding:10px 3px; border-radius:4px; font-size:13px; }
.md-seat span, .md-seat small { font-size:10px; font-weight:500; }
.md-table-map button.md-seat--free { color:#236942; background:#edf9f1; border-color:#cfe5d6; }
.md-table-map button.md-seat--occupied { color:#a52d31; background:#fff0f1; border-color:#f0ccd0; }
.md-table-map button[aria-pressed="true"] { outline:2px solid currentColor; outline-offset:2px; box-shadow:none; }
.md-payment { margin-top:20px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.md-payment h3 { margin-bottom:5px; }
.md-app-preview { display:grid; grid-template-columns:150px minmax(0,1fr); min-width:0; min-height:300px; border:1px solid var(--md-border); border-radius:10px; background:#fff; overflow:hidden; }
.md-app-preview__rail { display:flex; flex-direction:column; gap:5px; padding:17px 12px; border-right:1px solid var(--md-border); }
.md-app-preview__rail > strong { font-size:16px; letter-spacing:-.04em; }
.md-app-preview__rail > .md-small { margin-bottom:12px; }
.md-app-preview__rail nav { display:grid; gap:4px; }
.md-app-preview__rail nav a, .md-app-preview__top nav a { display:flex; align-items:center; gap:8px; min-height:40px; padding:8px; border-radius:6px; text-decoration:none; font-size:12px; }
.md-app-preview__rail nav a[aria-current="page"], .md-app-preview__top nav a[aria-current="page"] { background:#f2f2f2; color:var(--md-ink); font-weight:700; }
.md-app-preview__main { min-width:0; }
.md-app-preview__top { display:none; align-items:center; justify-content:space-between; gap:14px; min-height:56px; padding:8px 15px; border-bottom:1px solid var(--md-border); }
.md-app-preview__top > strong { flex:none; font-size:16px; }
.md-app-preview__top nav { display:flex; align-items:center; gap:4px; }
.md-app-preview__top nav a { white-space:nowrap; }
.md-app-preview__content { position:relative; min-height:300px; padding:16px; }
.md-app-preview__content h3 { margin:0; font-size:18px; }
.md-app-preview__filters { display:flex; align-items:center; gap:8px; margin-top:14px; }
.md-app-preview__filters .md-input-icon { flex:1 1 190px; min-width:150px; }
.md-app-preview__filters .md-button { flex:none; }
.md-app-preview__chips { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:10px 0; font-size:11px; font-weight:500; }
.md-app-preview__chips > span { display:inline-flex; align-items:center; gap:6px; padding:6px 8px; border:1px solid #c8dcfa; border-radius:6px; background:#eff5ff; color:#174b8a; }
.md-app-preview__chips > span:nth-child(2) { border-color:#bce8cf; background:#eaf8ef; color:#126b36; }
.md-app-preview__chips button { border:0; background:none; color:inherit; padding:0; font-size:15px; }
.md-app-preview__chips .md-icon { width:14px; height:14px; }
.md-filter-status { display:grid; gap:6px; margin:0; padding:0; border:0; }
.md-filter-status legend { margin-bottom:4px; font-size:13px; font-weight:700; }
.md-filter-status .md-choice { min-height:32px; }
.md-filter-form .md-form-actions { flex-wrap:wrap; }
.md-filter-form .md-form-actions .md-button { flex:1 1 auto; }
.md-app-preview__rows { display:grid; border-top:1px solid var(--md-border); }
.md-app-preview__rows > span { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px; align-items:center; padding:11px 5px; border-bottom:1px solid var(--md-border); font-size:12px; }
.md-app-preview__rows > span > span { display:flex; align-items:center; gap:8px; }
.md-app-preview__rows small { grid-column:1; color:var(--md-muted); }
.md-app-preview__rows > span > span:first-child { font-weight:500; }
.md-app-preview__rows > span > small { font-weight:400; }
.md-app-preview__rows b { grid-column:2; grid-row:1 / span 2; color:#126b36; font-size:11px; font-weight:600; }
.md-app-preview__filter-panel { display:none; }
.md-photo-examples { display:grid; gap:20px; }
.md-hero { min-height:340px; grid-template-columns:.95fr 1.05fr; }
.md-hero__copy { padding:32px; }
.md-hero :is(h1, h2, h3) { font-size:clamp(28px,3vw,40px); letter-spacing:-.045em; line-height:1.08; }
.md-hero p { max-width:380px; font-size:14px; line-height:1.6; }
.md-hero .md-eyebrow { font-size:10px; letter-spacing:.12em; font-weight:500; }
.md-hero > img { min-height:340px; height:100%; }
.md-hero-benefits { display:flex; gap:22px; margin-top:28px; }
.md-hero-benefits span { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--md-muted); }
.md-hero-benefits .md-icon { width:21px; height:21px; }
.md-hero--overlay .md-hero__copy { min-height:320px; max-width:620px; }
.md-hero--overlay .md-eyebrow { color:#fff; }
.md-hero--overlay::after { background:linear-gradient(90deg,rgb(0 0 0 / 75%),rgb(0 0 0 / 10%)); }
.md-hero--story :is(h1, h2, h3) { font-size:32px; }
.md-photo-card img { height:auto; aspect-ratio:3 / 2; }
.md-photo-card__body { padding:18px; }
.md-photo-card__body h3 { font-size:16px; margin:10px 0 7px; }
.md-photo-card__body p { min-height:56px; font-size:12px; }
.md-photo-card__body .md-button { margin-top:12px; border:0; padding:0; flex-direction:row-reverse; }
.md-category { padding:3px 6px; border-radius:4px; text-transform:uppercase; font-size:9px; letter-spacing:.03em; }
.md-category--amber { color:#8a570c; background:#fff0d4; }.md-category--blue { color:#285aaa; background:#e5effe; }.md-category--green { color:#276d3b; background:#e5f4e9; }
.md-gallery-viewer { display:grid; grid-template-columns:2.3fr 1fr; gap:10px; }
.md-gallery-stage { position:relative; min-width:0; border-radius:8px; overflow:hidden; }
.md-gallery-zoom { display:block; padding:0; border:0; width:100%; height:100%; background:#eee; }
.md-gallery-main { width:100%; height:100%; aspect-ratio:16 / 9; object-fit:cover; }
.md-gallery-caption { position:absolute; bottom:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; gap:10px; color:#fff; padding:12px 16px; background:rgb(0 0 0 / 55%); font-size:13px; }
.md-gallery-caption .md-button { width:44px; padding:0; border-color:#fff8; color:#fff; background:transparent; }
.md-gallery-thumbs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.md-gallery-thumbs button { border:2px solid transparent; border-radius:7px; padding:2px; background:none; overflow:hidden; }
.md-gallery-thumbs button[aria-pressed="true"] { border-color:var(--md-focus); }
.md-gallery-thumbs img { width:100%; height:100%; object-fit:cover; border-radius:3px; }
.md-rider { display:inline-flex; align-items:center; gap:9px; }
.md-rider .md-avatar { width:34px; height:34px; background:#e5edf7; color:#183e70; }
.md-image-placeholder { width:100%; aspect-ratio:3 / 2; border-radius:8px; background:#f0f1f2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:12px; color:#7b7f86; text-align:center; font-size:12px; overflow:hidden; }
.md-image-placeholder > .md-icon { width:32px; height:32px; }
.md-image-placeholder--error { background:#fff0f0; color:var(--md-danger); }
.md-image-placeholder:has(img) { padding:0; }
.md-image-placeholder img { width:100%; height:100%; object-fit:cover; }
.md-image-states p { margin:10px 0 0; }
.md-loading-ring { width:18px; height:18px; border-radius:50%; border:2px solid #ccc; border-top-color:#444; animation:md-loading-spin 900ms linear infinite; }
@keyframes md-loading-spin { to { transform:rotate(360deg); } }
@media (max-width:1499px) {
  .md-col-notes { display:none; }
  .md-schedule { grid-template-columns:145px repeat(var(--days),minmax(0,1fr)); }
  .md-schedule-cell { padding:5px; }.md-shift { padding:8px 5px; font-size:12px; }
  .md-order { padding:14px; margin:10px; }
  .md-order__header { margin:-14px -14px 0; padding:14px; }
}
@media (min-width:768px) and (max-width:1199px) {
  .md-catalog__layout { display:block; grid-template-columns:none; }
  .md-catalog__main { padding:0 20px 40px; }
  .md-catalog__sidebar { position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:16px; width:100%; min-height:64px; height:64px; overflow:hidden; padding:8px 16px; border-right:0; border-bottom:1px solid var(--md-border); }
  .md-catalog__sidebar > .md-eyebrow, .md-catalog__sidebar > p { display:none; }
  .md-catalog__brand { display:block; flex:none; padding:0; font-size:19px; white-space:nowrap; }
  .md-catalog__brand .md-brand-caption { display:none; }
  .md-catalog__nav { display:flex; flex:1; min-width:0; gap:4px; overflow-x:auto; }
  .md-catalog__nav a { flex:none; min-height:42px; white-space:nowrap; }
  .md-catalog__topbar { top:64px; }
  .md-table { font-size:12px; }
  .md-table th,.md-table td { padding:9px 7px; }
  .md-person-button .md-avatar { display:inline-grid; width:28px; height:28px; font-size:10px; }
  .md-form-examples { grid-template-columns:1fr; }
  .md-hero__copy { padding:24px; }.md-hero h3 { font-size:30px; }
  .md-app-preview { min-height:290px; }
  .md-hero-benefits { gap:10px; flex-wrap:wrap; }
  .md-kpi__body { display:block; }.md-sparkline { width:100%; height:32px; margin-top:12px; }
  .md-example-header { flex-wrap:wrap; }
  .md-operations { grid-template-columns:1fr; }.md-operational-panel:last-child { grid-column:auto; }
  .md-gallery-viewer { grid-template-columns:1fr; }.md-gallery-thumbs { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .md-catalog__layout { display:block; }.md-catalog__main { padding:0 14px 40px; }
  .md-section { padding:0; }.md-section + .md-section { margin-top:36px; }
  .md-catalog__intro h1 { font-size:28px; }
  .md-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .md-kpi__label { padding:10px 8px; font-size:10px; min-height:48px; }
  .md-kpi__body { padding:10px 8px; display:block; }.md-kpi__value { font-size:21px; }.md-kpi__trend { font-size:9px; }
  .md-kpi__trend .md-muted { display:none; }.md-sparkline { width:100%; height:32px; margin-top:10px; }
  .md-example-header { padding:14px; flex-wrap:wrap; gap:12px; }.md-search-field { width:100%; }
  .md-toolbar { padding:12px 14px; gap:10px; }.md-toolbar > .md-row { width:100%; }.md-toolbar > .md-row > .md-button:last-child { flex:1; }
  .md-segmented { width:100%; }.md-segmented > button { flex:1; }
  .md-data-layout { display:block; }.md-detail { display:none; }
  .md-list { display:grid; gap:0; }
  .md-list__item { display:flex; align-items:center; gap:14px; width:100%; text-align:left; padding:18px 14px; border:0; border-top:1px solid var(--md-border); background:#fff; font-size:14px; }
  .md-list__item > .md-icon { margin-left:auto; }
  .md-booking-time { align-self:start; padding-top:2px; font-size:15px; }
  .md-booking-summary { display:grid; gap:5px; }.md-booking-summary small { color:var(--md-muted); font-size:12px; }.md-booking-summary .md-badge { justify-self:start; }
  .md-pagination { padding:12px 14px; }.md-pagination > .md-row { width:100%; justify-content:end; }#page-status { margin-right:auto; }
  .md-form-examples { grid-template-columns:1fr; }.md-form-examples .md-pad { padding:20px; }
  .md-field input,.md-field select,.md-field textarea,.md-field .md-input-icon input,.md-input-icon input { font-size:16px; min-width:0; }
  .md-dialog { padding:20px; max-height:92dvh; }.md-dialog h3 { font-size:17px; }
  .md-form-actions { position:sticky; bottom:-20px; background:#fff; padding:14px 0 6px; }
  .md-sheet--detail { height:100dvh; max-height:100dvh; border-radius:0; padding:20px; }
  .md-sheet--detail .md-detail-fields { border:0; padding:0; }
  .md-sheet--detail .md-person { margin-top:24px; }
  .md-schedule { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .md-schedule-head { font-size:12px; }.md-staff { padding:16px 10px; }.md-staff .md-avatar { display:none; }
  .md-schedule-cell { padding:8px; }.md-shift { min-height:76px; font-size:12px; padding:10px; }
  .md-schedule-legend { gap:16px; font-size:11px; }.md-examples-row { grid-template-columns:1fr; }
  .md-operations { grid-template-columns:1fr; }.md-operational-panel:last-child { grid-column:auto; }
  .md-floor-plan { margin:12px; padding:10px; }.md-table-map { gap:8px; grid-template-columns:repeat(4,minmax(0,1fr)); }
  .md-table-map button.md-seat { min-height:84px; font-size:13px; }.md-seat span,.md-seat small { font-size:9px; }
  .md-photo-examples { gap:16px; }.md-hero { grid-template-columns:1fr; }.md-hero__copy { padding:24px; }.md-hero h3 { font-size:32px; }
  .md-hero > img { min-height:220px; height:240px; max-height:none; grid-row:1; }
  .md-hero--overlay > img { height:100%; }.md-hero--overlay .md-hero__copy { min-height:360px; }
  .md-hero-benefits { gap:16px; }.md-hero-benefits span { font-size:11px; }
  .md-hero--story > img { grid-row:auto; }.md-photo-card__body p { min-height:0; }
  .md-gallery-viewer { grid-template-columns:1fr; }.md-gallery-main { min-height:260px; }
  .md-gallery-thumbs { grid-template-columns:repeat(4,minmax(0,1fr)); }.md-gallery-thumbs img { aspect-ratio:4 / 3; height:auto; }
  .md-gallery-caption { padding:10px; font-size:12px; }.md-gallery-caption .md-row { gap:6px; }
  .md-image-states { grid-template-columns:1fr; }.md-image-placeholder { aspect-ratio:3 / 2; }
}
.md-analytics { display:grid; grid-template-columns:1.5fr 1fr; gap:20px; }
.md-bar-plot,.md-week-plot { width:100%; height:auto; display:block; }
.md-chart-legend { display:flex; align-items:center; justify-content:space-between; font-size:11px; gap:10px; }
.md-chart-legend > span { display:flex; align-items:center; gap:8px; }
.md-chart-data { margin-top:18px; font-size:12px; color:var(--md-muted); }
.md-chart-data summary { cursor:pointer; min-height:44px; display:flex; align-items:center; text-decoration:underline; text-underline-offset:3px; }
.md-chart-data dl { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.md-chart-data dl > div { display:flex; justify-content:space-between; gap:8px; }.md-chart-data dd { margin:0; color:var(--md-ink); }
.md-channel { margin:28px 0; }.md-channel .md-progress { height:5px; margin-top:10px; }.md-channel .md-progress span { background:var(--channel); }
@keyframes md-bar-reveal { from { transform:scaleY(.07); opacity:.55; } to { transform:scaleY(1); opacity:1; } }
@keyframes md-line-reveal { to { stroke-dashoffset:0; } }
@keyframes md-area-reveal { from { opacity:0; } to { opacity:1; } }
@keyframes md-progress-reveal { from { transform:scaleX(.06); } to { transform:scaleX(1); } }
.md-bar-plot.is-visible rect:not(:last-of-type) { transform-box:fill-box; transform-origin:center bottom; animation:md-bar-reveal 1050ms cubic-bezier(.2,.75,.25,1) both; animation-delay:calc(var(--chart-step,0) * 62ms); }
.md-week-plot.is-visible path:first-of-type { animation:md-area-reveal 900ms ease-out both; }
.md-week-plot.is-visible path:last-of-type { stroke-dasharray:700; stroke-dashoffset:700; animation:md-line-reveal 1250ms cubic-bezier(.2,.75,.25,1) 120ms both; }
.md-sparkline.is-visible path { stroke-dasharray:240; stroke-dashoffset:240; animation:md-line-reveal 1050ms cubic-bezier(.2,.75,.25,1) both; }
#grafici .md-progress span { transform-origin:left center; }
#grafici .md-progress span.is-visible { animation:md-progress-reveal 1100ms cubic-bezier(.2,.75,.25,1) both; }
#lightbox [hidden] { display:none; }
/* Tablet orientations follow the device-specific reference boards. */
.md-tablet-agenda { display:none; }
.md-detail[hidden] { display:none !important; }
@media (min-width:900px) and (max-width:1199px) {
  .md-data-layout { display:grid; grid-template-columns:minmax(0,1fr) 248px; }
  .md-detail { display:block; padding:16px; }
  .md-form-examples { grid-template-columns:minmax(0,1fr); }
  #controlli .md-booking-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }
  #controlli .md-booking-form > .md-grid { grid-column:1 / -1; }
  #controlli .md-booking-form > .md-field:nth-child(4) { grid-column:1; }
  #controlli .md-booking-form > .md-field:nth-child(5), #controlli .md-booking-form > .md-form-actions, #controlli .md-booking-form > small { grid-column:1 / -1; }
  .md-detail-fields > div { grid-template-columns:72px minmax(0,1fr); gap:7px; padding:10px 0; }
  .md-person { display:grid; grid-template-columns:36px minmax(0,1fr); align-items:start; gap:8px; margin:12px 0; }
  .md-person > .md-avatar { grid-column:1; grid-row:1; }
  .md-person > div { grid-column:2; min-width:0; }
  .md-person > div h3 { margin:0 0 4px; font-size:15px; }
  .md-person > div small { display:block; font-size:10px; line-height:1.35; }
  .md-person > .md-badge { display:none; }
  .md-operations { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md-operational-panel:last-child { grid-column:1 / -1; }
  .md-payment { display:none; }
  .md-table td { padding-top:11px; padding-bottom:11px; }
  .md-col-notes { display:none; }
  .md-floor-plan .md-seat { min-height:72px; }
  .md-app-preview { grid-template-columns:minmax(0,1fr); }
  .md-app-preview__rail { display:none; }
  .md-app-preview__top { display:flex; }
  .md-app-preview__content { min-height:640px; }
  .md-app-preview__filter-panel { position:absolute; z-index:3; top:76px; right:12px; display:grid; gap:10px; width:222px; padding:12px; border:1px solid var(--md-border); border-radius:8px; background:#fff; box-shadow:var(--md-shadow-overlay); font-size:11px; }
  .md-app-preview__filter-panel .md-between { padding-bottom:5px; border-bottom:1px solid var(--md-border); }
  .md-app-preview__filter-panel .md-grid { grid-template-columns:1fr 1fr; gap:6px; }
  .md-app-preview__filter-panel label { display:grid; gap:5px; color:var(--md-ink); }
  .md-app-preview__filter-panel .md-filter-value, .md-app-preview__filter-panel select { min-height:30px; display:flex; align-items:center; padding:5px 7px; border:1px solid var(--md-border); border-radius:5px; background:#fff; color:var(--md-ink); }
  .md-app-preview__filter-panel fieldset { display:grid; gap:5px; margin:0; padding:0; border:0; }
  .md-app-preview__filter-panel legend { margin-bottom:5px; font-weight:700; }
  .md-app-preview__filter-panel fieldset label { display:flex; align-items:center; gap:6px; }
  .md-app-preview__filter-panel .md-row { gap:5px; flex-wrap:nowrap; }
  .md-app-preview__filter-panel .md-button { min-height:34px; padding:5px 7px; font-size:10px; }
}
@media (min-width:768px) and (max-width:899px) {
  .md-data-layout { display:block; }
  .md-detail { display:none; }
  .md-tablet-agenda { display:block; padding:18px; border-bottom:1px solid var(--md-border); }
  .md-tablet-agenda__head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
  .md-tablet-agenda__head h3 { margin:0 0 4px; font-size:17px; }
  .md-tablet-agenda__head p { margin:0; }
  .md-tablet-agenda__list { display:grid; gap:8px; }
  .md-tablet-agenda__item { display:grid; grid-template-columns:58px minmax(0,1fr) auto 24px; align-items:center; gap:12px; min-height:68px; padding:10px 12px; border:1px solid var(--md-border); border-radius:8px; background:#fff; color:var(--md-ink); text-align:left; }
  .md-tablet-agenda__item[aria-pressed="true"] { border-color:#b8d1f7; background:#f1f6ff; }
  .md-tablet-agenda__time { font-weight:700; font-variant-numeric:tabular-nums; }
  .md-tablet-agenda__guest { display:grid; gap:3px; min-width:0; }
  .md-tablet-agenda__guest small { color:var(--md-muted); }
  .md-tablet-agenda > .md-small { margin:12px 0 0; }
  #calendar-days, .md-schedule-legend { display:none; }
  .md-photo-examples #photo-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md-photo-examples #photo-cards > .md-photo-card:last-child { grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1fr); }
  .md-photo-examples #photo-cards > .md-photo-card:last-child > img { height:100%; min-height:0; aspect-ratio:auto; }
  .md-photo-card__body p { min-height:0; }
  .md-image-states { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md-payment { display:none; }
}
@media (min-width:768px) and (max-width:1199px) {
  .md-photo-examples > .md-hero:first-child { display:block; position:relative; min-height:390px; background:#222; }
  .md-photo-examples > .md-hero:first-child > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .md-photo-examples > .md-hero:first-child .md-hero__copy { position:relative; z-index:1; min-height:390px; justify-content:end; color:#fff; background:linear-gradient(0deg,rgb(0 0 0 / 86%),rgb(0 0 0 / 10%)); }
  .md-photo-examples > .md-hero:first-child .md-muted, .md-photo-examples > .md-hero:first-child .md-eyebrow, .md-photo-examples > .md-hero:first-child .md-hero-benefits span { color:#fff; }
  .md-photo-examples > .md-hero:first-child .md-button:not(.md-button--secondary) { border-color:#fff; background:#0006; }
  .md-photo-examples > .md-hero:first-child .md-hero-benefits { padding-top:18px; border-top:1px solid #fff5; }
  .md-photo-examples > .md-hero--story { grid-template-columns:1.08fr .92fr; }
  .md-photo-examples > .md-hero--story > img { grid-column:1; grid-row:1; }
  .md-photo-examples > .md-hero--story > .md-hero__copy { grid-column:2; grid-row:1; }
}
@media (min-width:1200px) { .md-shift { font-size:12px; } }
@media (max-width:767px) { .md-analytics { grid-template-columns:1fr; }.md-bar-plot { min-height:170px; } }
@media (max-width:767px) {
  .md-photo-examples > .md-hero:first-child { display:block; position:relative; background:#222; }
  .md-photo-examples > .md-hero:first-child > img { position:absolute; inset:0; height:100%; }
  .md-photo-examples > .md-hero:first-child .md-hero__copy { position:relative; z-index:1; min-height:520px; justify-content:end; color:#fff; background:linear-gradient(0deg,rgb(0 0 0 / 88%),rgb(0 0 0 / 10%)); }
  .md-photo-examples > .md-hero:first-child .md-muted, .md-photo-examples > .md-hero:first-child .md-eyebrow, .md-photo-examples > .md-hero:first-child .md-hero-benefits span { color:#fff; }
  .md-photo-examples > .md-hero:first-child .md-button:not(.md-button--secondary) { border-color:#fff; background:#0006; }
  .md-photo-examples > .md-hero:first-child .md-hero-benefits { padding-top:18px; border-top:1px solid #fff5; }
}

/* Table typography and columns follow the compact, clearly aligned PC reference. */
.md-table {
  table-layout:fixed;
  font-family:var(--md-font);
  font-size:12px;
  line-height:1.35;
  font-variant-numeric:tabular-nums;
}
.md-table th, .md-table td { padding:0 10px; text-align:left; vertical-align:middle; }
.md-table th { color:#5a5a5a; font-size:11px; font-weight:500; }
.md-table tbody td { font-weight:500; }
.md-table .md-sort { font:inherit; color:inherit; letter-spacing:inherit; }
.md-table .md-person-button { gap:8px; font:inherit; font-weight:600; letter-spacing:inherit; }
.md-table .md-note-preview { font-weight:400; }
.md-table .md-avatar { width:28px; height:28px; font-family:inherit; font-size:10px; }
.md-table th:last-child, .md-table td:last-child { width:8%; text-align:center; }
.md-table td:last-child .md-button--icon { margin-inline:auto; }
#pianificazione .md-banner--danger { font-weight:600; }
#pianificazione .md-conflict .md-shift { min-height:38px; font-size:13px; font-weight:600; line-height:1.2; }
@media (min-width:1200px) and (max-width:1499px) {
  .md-table th:nth-child(1), .md-table td:nth-child(1) { width:29%; }
  .md-table th:nth-child(2), .md-table td:nth-child(2) { width:10%; }
  .md-table th:nth-child(3), .md-table td:nth-child(3) { width:12%; }
  .md-table th:nth-child(4), .md-table td:nth-child(4) { width:14%; }
  .md-table th:nth-child(5), .md-table td:nth-child(5) { width:27%; }
  .md-table th:first-child { padding-left:48px; }
}
@media (min-width:1500px) {
  .md-table th:nth-child(1), .md-table td:nth-child(1) { width:24%; }
  .md-table th:nth-child(2), .md-table td:nth-child(2) { width:9%; }
  .md-table th:nth-child(3), .md-table td:nth-child(3) { width:10%; }
  .md-table th:nth-child(4), .md-table td:nth-child(4) { width:12%; }
  .md-table th:nth-child(5), .md-table td:nth-child(5) { width:18%; }
  .md-table th:nth-child(6), .md-table td:nth-child(6) { width:19%; }
}
@media (min-width:900px) and (max-width:1199px) {
  .md-table th, .md-table td { padding:0 7px; }
  .md-table th:nth-child(1), .md-table td:nth-child(1) { width:14%; }
  .md-table th:nth-child(2), .md-table td:nth-child(2) { width:38%; }
  .md-table th:nth-child(3), .md-table td:nth-child(3) { width:13%; }
  .md-table th:nth-child(4), .md-table td:nth-child(4) { width:25%; }
  .md-table th:nth-child(5), .md-table td:nth-child(5) { width:10%; }
  .md-table th:nth-child(2) { padding-left:43px; }
}

/* PC/tablet navigation preview calibrated against the supplied Leads sidebar reference. */
@media (min-width:768px) {
  #struttura .md-app-preview { grid-template-columns:minmax(230px,260px) minmax(0,1fr); min-height:640px; border-radius:12px; }
  #struttura .md-app-preview__rail { display:flex; gap:0; overflow-y:auto; padding:16px 10px 12px; background:#f1f1f1; border-right:1px solid #dedede; }
  #struttura .md-app-preview__brand { display:flex; align-items:center; gap:7px; margin:0 4px 14px; min-height:28px; }
  #struttura .md-app-preview__brand > span { width:20px; height:20px; display:grid; place-items:center; flex:none; border-radius:5px; background:#171717; color:#fff; }
  #struttura .md-app-preview__brand .md-icon { width:13px; height:13px; }
  #struttura .md-app-preview__brand strong { font-size:14px; font-weight:700; letter-spacing:-.02em; }
  #struttura .md-app-preview__search { display:flex; align-items:center; gap:7px; min-height:34px; margin:0 0 15px; padding:0 8px; border:1px solid #dedede; border-radius:7px; background:#fff; color:#626262; }
  #struttura .md-app-preview__search .md-icon { width:15px; height:15px; }
  #struttura .md-app-preview__search input { min-width:0; width:100%; height:30px; padding:0; border:0; outline:0; background:transparent; color:#171717; font:400 12px/1.2 var(--md-font); }
  #struttura .md-app-preview__search input::placeholder { color:#666; opacity:1; }
  #struttura .md-app-preview__search kbd { flex:none; padding:2px 4px; border:1px solid #e4e4e4; border-radius:4px; background:#fafafa; color:#333; font:500 10px/1 var(--md-font); }
  #struttura .md-app-preview__group { display:grid; gap:4px; }
  #struttura .md-app-preview__group-title { padding:0 8px 3px; color:#222; font-size:11px; font-weight:600; line-height:1.3; }
  #struttura .md-app-preview__group nav { display:grid; gap:2px; }
  #struttura .md-app-preview__rail nav a { display:flex; align-items:center; gap:9px; min-height:32px; padding:5px 8px; border:1px solid transparent; border-radius:7px; color:#202020; font-size:12px; font-weight:500; line-height:1.2; }
  #struttura .md-app-preview__rail nav a .md-icon { width:14px; height:14px; color:#616161; stroke-width:1.7; }
  #struttura .md-app-preview__rail nav a[aria-current="page"] { border-color:#ededed; background:#fff; color:#111; font-weight:600; box-shadow:0 1px 2px rgb(0 0 0 / 3%); }
  #struttura .md-app-preview__rail nav a[aria-current="page"] .md-icon { color:#171717; }
  #struttura .md-app-preview__group--insights { margin-top:16px; }
  #struttura .md-app-preview__footer-nav { display:grid; gap:2px; margin-top:auto; padding-top:16px; }
  #struttura .md-app-preview__footer-nav a { display:flex; align-items:center; gap:9px; min-height:32px; padding:5px 8px; border-radius:7px; color:#202020; text-decoration:none; font-size:12px; font-weight:500; }
  #struttura .md-app-preview__footer-nav .md-icon { width:14px; height:14px; color:#616161; }
  #struttura .md-app-preview__main { display:grid; grid-template-rows:54px minmax(0,1fr); }
  #struttura .md-app-preview__top { display:flex; min-height:54px; padding:8px 18px; border-bottom:1px solid #e8e8e8; }
  #struttura .md-app-preview__top > strong { font-size:16px; font-weight:600; }
  #struttura .md-app-preview__top nav { display:none; }
  #struttura .md-app-preview__content { min-height:0; padding:18px; }
  #struttura .md-app-preview__content h3 { font-size:15px; font-weight:600; }
  #struttura .md-app-preview__filter-panel { display:none !important; }
}
@media (min-width:768px) {
  #struttura .md-app-preview { width:min(100%,924px); height:656px; min-height:656px; margin-inline:auto; }
  #struttura .md-app-preview__rail { padding:16px 10px 12px; }
  #struttura .md-app-preview__brand, #struttura .md-app-preview__search, #struttura .md-app-preview__group, #struttura .md-app-preview__footer-nav { width:100%; max-width:170px; margin-left:4px; }
  #struttura .md-app-preview__search { max-width:165px; }
  #struttura .md-app-preview__rail nav { margin-left:0; }
  #struttura .md-app-preview__group-title { font-size:12px; }
}@media (min-width:768px) {
  #struttura .md-app-preview__rail nav a { min-height:29px; padding-block:4px; }
  #struttura .md-app-preview__group--insights { margin-top:14px; }
  #struttura .md-app-preview__footer-nav a { min-height:29px; padding-block:4px; }
}@media (min-width:768px) {
  #struttura .md-app-preview__rail { padding-top:22px; }
  #struttura .md-app-preview__brand { margin-bottom:26px; }
  #struttura .md-app-preview__brand > span { width:18px; height:18px; }
  #struttura .md-app-preview__brand strong { font-size:14px; }
  #struttura .md-app-preview__search, #struttura .md-app-preview__group, #struttura .md-app-preview__footer-nav { max-width:none; }
  #struttura .md-app-preview__search { min-height:38px; margin-bottom:29px; }
  #struttura .md-app-preview__search input { font-size:14px; }
  #struttura .md-app-preview__group-title { padding-bottom:12px; font-size:14px; font-weight:500; }
  #struttura .md-app-preview__rail nav a { min-height:36px; font-size:14px; font-weight:500; }
  #struttura .md-app-preview__rail nav a .md-icon, #struttura .md-app-preview__footer-nav .md-icon { width:16px; height:16px; }
  #struttura .md-app-preview__footer-nav a { min-height:36px; font-size:14px; }
}@media (min-width:768px) {
  #struttura .md-app-preview { width:min(100%,923px); height:820px; min-height:820px; }
  #struttura .md-app-preview__rail { padding-right:18px; }
  #struttura .md-app-preview__search { margin-bottom:26px; }
  #struttura .md-app-preview__group-title { padding-bottom:8px; }
  #struttura .md-app-preview__rail nav a { min-height:34px; font-weight:400; }
  #struttura .md-app-preview__rail nav a[aria-current="page"] { font-weight:600; }
  #struttura .md-app-preview__group--insights { margin-top:20px; }
}@media (min-width:768px) {
  #struttura .md-app-preview__group nav { gap:4px; }
  #struttura .md-app-preview__group-title { padding-bottom:6px; }
  #struttura .md-app-preview__rail nav a[aria-current="page"] { min-height:36px; }
}
.md-app-preview__mobile-menu { display:none; }
@media (max-width:767px) {
  #struttura .md-app-preview { display:grid; grid-template-columns:minmax(0,1fr); width:100%; height:auto; min-height:0; margin:0; }
  #struttura .md-app-preview__rail { display:none; }
  #struttura .md-app-preview__main { display:block; min-width:0; }
  #struttura .md-app-preview__top { display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:center; min-height:58px; padding:7px 10px; gap:8px; }
  #struttura .md-app-preview__top > strong { justify-self:start; font-size:15px; }
  #struttura .md-app-preview__top > .md-row { gap:12px; flex-wrap:nowrap; }
  #struttura .md-app-preview__top .md-app-preview__search-icon { display:none; }
  #struttura .md-app-preview__mobile-menu { display:inline-flex; width:40px; min-width:40px; min-height:40px; padding:0; }
  #struttura .md-app-preview__content { min-height:560px; padding:14px; }
  #struttura .md-app-preview__mobile-panel { position:fixed; z-index:140; inset:auto 0 0; width:100vw; max-width:none; max-height:82dvh; overflow:auto; padding:16px; border-radius:14px 14px 0 0; }
  #struttura .md-app-preview__mobile-panel nav { display:grid; gap:3px; }
  #struttura .md-app-preview__mobile-panel nav a { display:flex; align-items:center; min-height:44px; padding:8px 10px; border-radius:7px; color:var(--md-ink); text-decoration:none; font-size:14px; }
  #struttura .md-app-preview__mobile-panel nav a[aria-current="page"] { background:#f2f2f2; font-weight:600; }
}@media (max-width:767px) {
  #struttura .md-app-preview__mobile-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--md-border); }
  #struttura .md-app-preview__mobile-panel-head strong { font-size:16px; }
}

/* Notification center and account menu: isolated catalog examples. */
.md-account-demo { overflow:visible; }
.md-account-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; padding:10px 14px; border:1px solid var(--md-border); border-radius:var(--md-radius); background:#fff; }
.md-account-toolbar > div:first-child { display:grid; gap:3px; }
.md-account-actions { gap:10px; }
.md-account-trigger { min-height:42px; }
.md-account-profile { padding:4px 10px 4px 5px; }
.md-account-profile .md-avatar { width:30px; height:30px; }
.md-account-profile .md-icon { width:14px; height:14px; }
.md-notification-count { position:absolute; top:2px; right:2px; width:9px; height:9px; min-width:0; padding:0; border:2px solid #fff; border-radius:50%; background:#0875e1; color:transparent; font-size:0; }
.md-notification-panel { top:auto; bottom:calc(100% + 6px); width:min(480px,calc(100vw - 40px)); padding:18px 16px 10px; }
.md-notification-panel > .md-between { align-items:center; padding:0 2px 12px; border-bottom:1px solid var(--md-border); }
.md-notification-panel > .md-between > div { display:grid; gap:3px; }
.md-notification-panel > .md-between strong { font-size:18px; font-weight:650; }
.md-link { padding:4px 0; border:0; background:none; color:#006aff; font:500 12px/1.3 var(--md-font); cursor:pointer; }
.md-notification-item { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:start; gap:12px; width:100%; padding:14px 4px; border:0; border-bottom:1px solid #eee; background:#fff; color:var(--md-ink); text-align:left; cursor:pointer; }
.md-notification-item:last-child { border-bottom:0; padding-bottom:8px; }
.md-notification-symbol { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:#f0f1f2; color:#666; }
.md-notification-symbol .md-icon { width:19px; height:19px; }
.md-notification-item--danger .md-notification-symbol { background:#fee7e7; color:#e52424; }
.md-notification-item--warning .md-notification-symbol { background:#fff0d4; color:#e88700; }
.md-notification-item--neutral .md-notification-symbol { background:#eff0f1; color:#73777b; }
.md-notification-copy { display:grid; gap:4px; padding-top:2px; }
.md-notification-item strong { font-size:14px; font-weight:650; }
.md-notification-item small,.md-profile-summary small { color:#45484c; font-size:13px; line-height:1.4; }
.md-notification-meta { display:flex; align-items:center; gap:8px; padding-top:3px; color:var(--md-muted); font-size:12px; white-space:nowrap; }
.md-notification-dot { width:9px; height:9px; border-radius:50%; background:transparent; }
.md-notification-item.is-unread .md-notification-dot { background:#0875e1; }
.md-notification-item.is-unread { background:#fff; }
.md-notification-item--danger.is-unread { background:#fff6f6; }
.md-profile-panel { width:250px; padding:8px; }
.md-profile-summary { display:flex; align-items:center; gap:10px; padding:9px; border-bottom:1px solid var(--md-border); }
.md-profile-summary > span:last-child { display:grid; gap:3px; }
.md-profile-links { display:grid; gap:2px; padding:7px 0; }
.md-profile-links button,.md-profile-signout { width:100%; min-height:40px; padding:8px 9px; border:0; border-radius:6px; background:transparent; color:var(--md-ink); font:500 13px/1.25 var(--md-font); text-align:left; cursor:pointer; }
.md-profile-links button:hover,.md-profile-signout:hover { background:#f5f5f5; }
.md-profile-signout { border-top:1px solid var(--md-border); border-radius:0; color:#a12622; }

/* Shared controls added to the component catalogue 0.8. */
.md-component-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.md-component-grid > * { min-width:0; }
.md-radio-group { display:grid; gap:8px; min-width:0; margin:0; padding:0; border:0; }
.md-radio-group legend { margin-bottom:4px; font-size:14px; font-weight:650; }
.md-radio-option { display:flex; align-items:center; gap:11px; min-height:58px; padding:9px 11px; border:1px solid var(--md-border); border-radius:7px; background:#fff; cursor:pointer; }
.md-radio-option:has(input:checked) { border-color:#777; background:#f8f8f8; }
.md-radio-option input { width:18px; height:18px; margin:0; accent-color:var(--md-primary); flex:0 0 auto; }
.md-radio-option > span { display:grid; gap:2px; }
.md-radio-option strong { font-size:14px; font-weight:600; }
.md-radio-option small { color:var(--md-muted); font-size:12px; }
.md-radio-option:focus-within { outline:2px solid var(--md-focus); outline-offset:2px; }
.md-component-result { margin:0; color:var(--md-muted); font-size:13px; }
.md-autocomplete { position:relative; }
.md-autocomplete__panel { position:absolute; z-index:32; top:calc(100% - 25px); left:0; right:0; max-height:250px; overflow-y:auto; padding:5px; border:1px solid var(--md-border); border-radius:8px; background:#fff; box-shadow:var(--md-shadow-overlay); }
.md-autocomplete__panel[hidden] { display:none !important; }
.md-autocomplete__option { display:flex; align-items:center; gap:10px; min-height:50px; padding:7px 9px; border-radius:6px; cursor:pointer; }
.md-autocomplete__option > span:last-child { display:grid; gap:2px; }
.md-autocomplete__option strong { font-size:14px; font-weight:600; }
.md-autocomplete__option small { color:var(--md-muted); font-size:12px; }
.md-autocomplete__option:hover,.md-autocomplete__option.is-active { background:#f2f2f2; }
.md-autocomplete__option[aria-selected="true"] { background:#f7f7f7; }
.md-autocomplete__empty { margin:0; padding:12px; color:var(--md-muted); font-size:13px; }
.md-context-menu { position:relative; width:max-content; max-width:100%; }
.md-context-menu > [data-md-menu-trigger] { min-width:0; }
.md-context-menu > [data-md-menu-trigger] .md-icon { width:17px; height:17px; }
.md-menu-panel { position:absolute; z-index:35; top:calc(100% + 6px); right:0; width:min(240px,calc(100vw - 48px)); padding:5px; border:1px solid var(--md-border); border-radius:8px; background:#fff; box-shadow:var(--md-shadow-overlay); }
.md-menu-panel[hidden] { display:none !important; }
.md-menu-panel [role="menuitem"] { display:flex; align-items:center; width:100%; min-height:44px; padding:9px 10px; border:0; border-radius:5px; background:#fff; color:var(--md-ink); font:500 14px/1.25 var(--md-font); text-align:left; cursor:pointer; }
.md-menu-panel [role="menuitem"]:hover,.md-menu-panel [role="menuitem"]:focus-visible { background:#f3f3f3; }
.md-menu-panel [role="menuitem"].is-danger { color:var(--md-danger); }
.md-menu-divider { height:1px; margin:4px 5px; background:var(--md-border); }
.md-date-picker { position:relative; }
.md-date-trigger { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:44px; padding:9px 12px; border:1px solid var(--md-border-strong); border-radius:7px; background:#fff; color:var(--md-ink); font:500 14px/1.3 var(--md-font); text-align:left; cursor:pointer; }
.md-date-trigger:hover { background:#fafafa; }
.md-date-trigger .md-icon { width:17px; height:17px; color:var(--md-muted); }
.md-date-panel { position:absolute; z-index:34; top:calc(100% + 4px); left:0; width:min(366px,calc(100vw - 24px)); padding:10px; border:1px solid var(--md-border); border-radius:9px; background:#fff; box-shadow:var(--md-shadow-overlay); }
.md-date-panel[hidden] { display:none !important; }
.md-date-panel.is-above { top:auto; bottom:calc(100% + 4px); }
.md-date-panel.is-edge-right { right:0; left:auto; }
.md-date-panel__head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.md-date-panel__head .md-button { width:44px; min-height:44px; }
.md-date-panel__head strong { font-size:15px; font-weight:650; text-transform:capitalize; }
.md-date-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; text-align:center; }
.md-date-weekdays { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); grid-column:1/-1; }
.md-date-weekdays [role="columnheader"] { display:grid; place-items:center; min-height:30px; color:var(--md-muted); font-size:11px; font-weight:650; }
.md-date-days { display:contents; }
.md-date-cell { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); grid-column:1/-1; gap:3px; }
.md-date-cell button { display:grid; place-items:center; width:100%; min-height:44px; border:1px solid transparent; border-radius:6px; background:#fff; color:var(--md-ink); font:500 13px/1 var(--md-font); cursor:pointer; }
.md-date-cell button:hover,.md-date-cell button:focus-visible { background:#f2f2f2; }
.md-date-cell button[aria-pressed="true"] { background:var(--md-primary); color:#fff; }
.md-date-cell button[data-outside-month="true"] { color:#9a9a9a; }
.md-tooltip { z-index:1; }
.md-tooltip__text { z-index:40; width:max-content; max-width:min(240px,calc(100vw - 40px)); line-height:1.35; text-align:center; visibility:hidden; transition:opacity 140ms ease,visibility 0s linear 140ms; }
.md-tooltip:hover .md-tooltip__text,.md-tooltip:focus-within .md-tooltip__text,.md-tooltip.is-open .md-tooltip__text { visibility:visible; }
.md-tooltip:hover .md-tooltip__text,.md-tooltip:focus-within .md-tooltip__text { transition-delay:280ms,280ms; }
.md-tooltip.is-open .md-tooltip__text { transition-delay:0s,0s; }
.md-tooltip.is-dismissed .md-tooltip__text { visibility:hidden; opacity:0; transition-delay:0s,140ms; }
.md-tooltip--above .md-tooltip__text { top:auto; right:auto; bottom:calc(100% + 7px); left:50%; transform:translateX(-50%); }
.md-tooltip--below .md-tooltip__text { top:calc(100% + 7px); right:auto; bottom:auto; left:50%; transform:translateX(-50%); }
.md-tooltip--right .md-tooltip__text { top:50%; right:auto; bottom:auto; left:calc(100% + 7px); transform:translateY(-50%); }
.md-tooltip [data-tooltip-toggle] { position:relative; z-index:1; }
.md-spinner-row { display:flex; align-items:center; gap:13px; min-height:58px; padding:11px 12px; border:1px solid var(--md-border); border-radius:7px; background:#fff; }
.md-spinner-row > span:last-child { display:grid; gap:3px; }
.md-spinner-row strong { font-size:14px; font-weight:600; }
.md-spinner-row small { font-size:12px; }
.md-spinner { display:inline-block; width:28px; height:28px; flex:0 0 auto; border:3px solid #dedede; border-top-color:var(--md-ink); border-radius:50%; animation:md-spinner-turn .85s linear infinite; }
.md-spinner--small { width:17px; height:17px; border-width:2px; border-color:rgb(23 23 23 / 20%); border-top-color:var(--md-ink); }
.md-spinner[hidden] { display:none !important; }
.md-spinner-action { width:max-content; max-width:100%; }
.md-spinner-action[aria-busy="true"] { gap:10px; }
@keyframes md-spinner-turn { to { transform:rotate(360deg); } }
@media (max-width:767px) {
  .md-component-grid { grid-template-columns:minmax(0,1fr); }
  .md-menu-panel { right:auto; left:0; width:min(240px,calc(100vw - 40px)); }
  .md-tooltip--right .md-tooltip__text { top:auto; right:0; bottom:calc(100% + 7px); left:auto; transform:none; }
  .md-date-panel { left:50%; transform:translateX(-50%); }
}
@media (max-width:380px) {
  .md-date-panel { width:calc(100vw - 16px); padding:8px; }
  .md-date-grid,.md-date-cell { gap:1px; }
}
@media (prefers-reduced-motion:reduce) {
  .md-spinner { animation:none; border-top-color:#777; }
  .md-tooltip__text { transition:none; }
}
@media (max-width:1023px) {
  .md-account-toolbar { align-items:flex-start; flex-direction:column; }
  .md-account-actions { align-self:stretch; justify-content:space-between; }
  .md-account-actions > .md-popover:first-child { position:static; }
  .md-account-actions > .md-popover:first-child .md-notification-panel { position:fixed; z-index:140; inset:auto auto max(12px,env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); width:min(440px,calc(100vw - 24px)); max-width:none; max-height:80dvh; overflow:auto; padding:22px 18px max(14px,env(safe-area-inset-bottom)); border-radius:16px; box-shadow:0 12px 40px rgb(0 0 0 / 18%); }
  .md-account-actions > .md-popover:first-child .md-notification-panel::before { content:""; display:block; position:absolute; top:7px; left:calc(50% - 18px); width:36px; height:4px; border-radius:99px; background:#c9cdd1; }
  .md-account-actions > .md-popover:last-child .md-profile-panel { position:fixed; z-index:140; inset:auto 12px 12px; width:auto; max-width:none; }
}
@media (max-width:520px) {
  .md-account-actions > .md-popover:first-child .md-notification-panel { inset:auto 0 0; left:auto; transform:none; width:auto; max-height:80dvh; padding:24px 16px max(18px,env(safe-area-inset-bottom)); border-radius:16px 16px 0 0; }
  .md-notification-item { grid-template-columns:38px minmax(0,1fr) auto; gap:10px; padding:12px 1px; }
  .md-notification-symbol { width:38px; height:38px; }
  .md-notification-copy small { font-size:12px; }
  .md-notification-meta { gap:5px; font-size:11px; }
}

/* Varianti di navigazione nel catalogo: testo essenziale e voci numerate. */
.md-navigation-variants { margin-top:18px; padding:16px; border:1px solid var(--md-border); border-radius:10px; background:#fff; }
.md-navigation-variants__head { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:14px; }
.md-navigation-variants__head .md-demo__label { display:block; margin-bottom:7px; }
.md-navigation-variants__head h3 { margin:0; font-size:18px; }
.md-navigation-variants__head>p { max-width:330px; margin:0; color:var(--md-muted); font-size:13px; line-height:1.5; }
.md-navigation-variants__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.md-nav-pattern { min-width:0; padding:14px; border:1px solid var(--md-border); border-radius:8px; background:#fafafa; }
.md-nav-pattern h4 { margin:0 0 9px; font-size:13px; font-weight:700; }
.md-nav-sample { display:grid; gap:3px; }
.md-nav-sample a { display:flex; align-items:center; min-height:44px; padding:8px 10px; border-radius:6px; color:var(--md-ink); font-size:14px; text-decoration:none; }
.md-nav-sample a:hover { background:#f0f0f0; }
.md-nav-sample a[aria-current="page"] { background:#ededed; font-weight:700; }
.md-nav-sample--numbered a { gap:12px; }
.md-nav-sample--numbered a span { flex:none; width:24px; color:var(--md-muted); font-size:13px; font-variant-numeric:tabular-nums; font-weight:700; }
.md-nav-sample--numbered a[aria-current="page"] span { color:var(--md-ink); }
@media(max-width:767px) { .md-navigation-variants { padding:12px; } .md-navigation-variants__head { align-items:flex-start; flex-direction:column; gap:6px; } .md-navigation-variants__grid { grid-template-columns:minmax(0,1fr); } }
/* Elenco numerato: gerarchia editoriale, mantenendo i colori neutri del catalogo. */
.md-service-areas { scroll-margin-top:74px; }
@media (min-width:768px) and (max-width:1199px) { .md-service-areas { scroll-margin-top:144px; } }
.md-service-areas__heading { max-width:760px; margin-bottom:22px; }
.md-service-areas__heading .md-demo__label { display:block; margin-bottom:8px; color:var(--md-muted); font-size:11px; font-weight:750; letter-spacing:.15em; text-transform:uppercase; }
.md-service-areas__heading h3 { margin:0; font-size:clamp(24px,3vw,32px); line-height:1.12; letter-spacing:-.035em; font-weight:750; }
.md-service-areas__heading p { max-width:700px; margin:9px 0 0; color:var(--md-muted); font-size:15px; line-height:1.55; }
.md-service-areas__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.md-service-area { display:flex; flex-direction:column; align-items:flex-start; gap:13px; min-width:0; min-height:276px; padding:20px; border:1px solid var(--md-border); border-radius:10px; background:var(--md-surface); transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.md-service-area:hover { border-color:#b7c9e8; background:#fcfdff; box-shadow:0 5px 18px rgb(23 23 23 / 5%); transform:translateY(-2px); }
.md-service-area__top { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; margin-bottom:2px; }
.md-service-area__number { color:#c9cdd2; font-size:52px; font-weight:400; font-variant-numeric:tabular-nums; line-height:.95; letter-spacing:-.07em; }
.md-service-area__icon { display:grid; place-items:center; width:48px; height:48px; flex:none; border:1px solid var(--md-border); border-radius:9px; background:var(--md-surface-soft); color:var(--md-ink); }
.md-service-area__icon svg { width:24px; height:24px; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.md-service-area h4 { margin:0; color:var(--md-ink); font-size:18px; line-height:1.3; font-weight:750; letter-spacing:-.02em; }
.md-service-area p { max-width:38ch; margin:0; color:var(--md-muted); font-size:14px; line-height:1.55; }
.md-service-areas a.md-service-area__link { display:inline-flex; align-items:center; gap:11px; min-height:44px; margin-top:auto; color:var(--md-info); font-size:14px; font-weight:650; text-decoration:none; text-underline-offset:3px; }
.md-service-area__link svg,.md-service-areas__compact-arrow { width:20px; height:20px; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; transition:transform .18s ease; }
.md-service-areas a.md-service-area__link:hover { color:var(--md-info); text-decoration:underline; }
.md-service-areas a.md-service-area__link:hover svg { transform:translateX(3px); }
.md-service-areas a.md-service-area__link:focus-visible { outline:2px solid var(--md-focus); outline-offset:3px; border-radius:3px; }
.md-service-areas__compact-wrap { margin-top:23px; padding-top:18px; border-top:1px solid var(--md-border); }
.md-service-areas__compact-wrap > .md-demo__label { display:block; margin-bottom:11px; color:var(--md-muted); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.md-service-areas__compact { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0; padding:0; list-style:none; border:1px solid var(--md-border); border-radius:9px; background:var(--md-surface); }
.md-service-areas__compact li { display:flex; min-width:0; align-items:center; gap:12px; padding:14px 16px; }
.md-service-areas__compact li + li { border-left:1px solid var(--md-border); }
.md-service-areas__compact .md-service-area__icon { width:42px; height:42px; }
.md-service-areas__compact-number { flex:none; color:var(--md-ink); font-size:23px; line-height:1; font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.md-service-areas__compact-title { min-width:0; color:var(--md-ink); font-size:13px; line-height:1.35; font-weight:600; }
.md-service-areas__compact-arrow { flex:none; margin-left:auto; color:var(--md-muted); }
@media (min-width:768px) and (max-width:1024px) { .md-service-areas__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .md-service-area:last-child { display:grid; grid-column:1/-1; grid-template-columns:120px minmax(0,1fr) auto; grid-template-rows:auto auto; align-items:center; column-gap:18px; row-gap:4px; min-height:150px; } .md-service-area:last-child .md-service-area__top { grid-column:1; grid-row:1/3; flex-direction:row; align-items:center; justify-content:flex-start; gap:9px; margin:0; } .md-service-area:last-child h4 { grid-column:2; grid-row:1; align-self:end; } .md-service-area:last-child p { grid-column:2; grid-row:2; max-width:60ch; align-self:start; } .md-service-area:last-child .md-service-area__link { grid-column:3; grid-row:1/3; align-self:center; margin:0; white-space:nowrap; } .md-service-areas__compact { grid-template-columns:1fr; } .md-service-areas__compact li + li { border-top:1px solid var(--md-border); border-left:0; } }
@media (max-width:767px) { .md-service-areas { padding:16px; } .md-service-areas__heading { margin-bottom:17px; } .md-service-areas__heading h3 { font-size:24px; } .md-service-areas__heading p { font-size:14px; } .md-service-areas__grid { grid-template-columns:minmax(0,1fr); gap:10px; } .md-service-area { min-height:0; gap:10px; padding:16px; } .md-service-area__number { font-size:42px; } .md-service-area__icon { width:42px; height:42px; } .md-service-area h4 { font-size:17px; } .md-service-area__link { margin-top:0; } .md-service-areas__compact { grid-template-columns:1fr; } .md-service-areas__compact li { gap:10px; padding:12px; } .md-service-areas__compact li + li { border-top:1px solid var(--md-border); border-left:0; } .md-service-areas__compact .md-service-area__icon { width:38px; height:38px; } .md-service-areas__compact-title { font-size:13px; } }
@media (prefers-reduced-motion:reduce) { .md-service-area,.md-service-area__link svg,.md-service-areas__compact-arrow { transition:none; } }

/* Galleria immagini: intestazione editoriale, selezione leggibile e miniature etichettate. */
.md-photo-card__body .md-category { display:inline-flex; align-items:center; min-height:28px; padding:4px 9px; border-radius:5px; font-size:12px; line-height:1; font-weight:700; letter-spacing:.025em; }
.md-gallery-component { padding:22px; }
.md-gallery-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
.md-gallery-heading__eyebrow { display:block; margin-bottom:5px; color:var(--md-muted); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.md-gallery-heading h3 { margin:0; font-size:20px; line-height:1.25; }
.md-gallery-heading p { margin:5px 0 0; color:var(--md-muted); font-size:13px; line-height:1.5; }
.md-gallery-total { display:inline-flex; align-items:center; gap:8px; flex:none; min-height:38px; padding:0 11px; border:1px solid var(--md-border); border-radius:7px; color:var(--md-ink); background:#fff; font-size:13px; font-weight:650; }
.md-gallery-total .md-icon { width:16px; height:16px; color:var(--md-muted); }
.md-gallery-viewer { grid-template-columns:minmax(0,2fr) minmax(250px,1fr); gap:12px; }
.md-gallery-stage { border-radius:10px; background:#171717; }
.md-gallery-zoom:focus-visible { outline:3px solid var(--md-focus); outline-offset:-4px; }
.md-gallery-main { display:block; }
.md-gallery-caption { align-items:flex-end; padding:44px 16px 14px; background:linear-gradient(180deg,transparent 0%,rgb(0 0 0 / 78%) 100%); }
.md-gallery-caption__copy { display:grid; gap:4px; min-width:0; }
.md-gallery-caption__category { color:#fff; font-size:11px; line-height:1.2; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.md-gallery-caption__copy strong { color:#fff; font-size:18px; line-height:1.25; font-weight:700; }
.md-gallery-controls { display:flex; align-items:center; gap:7px; flex:none; }
.md-gallery-count { min-width:52px; color:#fff; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; text-align:center; }
.md-gallery-caption .md-gallery-controls .md-button { width:44px; min-width:44px; min-height:44px; padding:0; border:1px solid rgb(255 255 255 / 56%); border-radius:7px; color:#fff; background:rgb(0 0 0 / 20%); font-size:23px; line-height:1; }
.md-gallery-caption .md-gallery-controls .md-button:hover { background:rgb(255 255 255 / 18%); }
.md-gallery-thumbs { align-content:start; gap:10px; }
.md-gallery-thumbs button { position:relative; display:block; width:100%; min-width:0; min-height:0; aspect-ratio:1 / 1; padding:2px; border:2px solid transparent; border-radius:9px; background:#f1f1f1; }
.md-gallery-thumbs button[aria-pressed="true"] { border-color:#171717; }
.md-gallery-thumbs button:focus-visible { outline:3px solid var(--md-focus); outline-offset:2px; }
.md-gallery-thumbs img { display:block; width:100%; height:100%; aspect-ratio:1 / 1; border-radius:5px; }
.md-gallery-thumb__label { position:absolute; right:9px; bottom:9px; left:9px; width:max-content; max-width:calc(100% - 18px); overflow:hidden; padding:5px 8px; border-radius:5px; color:#fff; background:rgb(20 20 20 / 82%); font-size:11px; line-height:1.2; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
@media (min-width:768px) and (max-width:1199px) { .md-gallery-viewer { grid-template-columns:minmax(0,1fr); } .md-gallery-stage { min-height:0; } .md-gallery-thumbs { grid-template-columns:repeat(4,minmax(0,1fr)); } .md-gallery-thumbs button,.md-gallery-thumbs img { aspect-ratio:4 / 3; } }
@media (max-width:767px) { .md-gallery-component { padding:16px; } .md-gallery-heading { align-items:flex-start; gap:12px; } .md-gallery-heading h3 { font-size:19px; } .md-gallery-heading p { max-width:34ch; } .md-gallery-total { min-height:34px; padding:0 8px; font-size:12px; } .md-gallery-viewer { grid-template-columns:minmax(0,1fr); gap:10px; } .md-gallery-stage { min-height:0; } .md-gallery-main { min-height:0; } .md-gallery-caption { gap:6px; padding:34px 10px 10px; } .md-gallery-caption__category { font-size:10px; } .md-gallery-caption__copy strong { font-size:15px; } .md-gallery-controls { gap:4px; } .md-gallery-count { min-width:42px; font-size:11px; } .md-gallery-caption .md-gallery-controls .md-button { width:40px; min-width:40px; min-height:40px; } .md-gallery-thumbs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } .md-gallery-thumb__label { right:7px; bottom:7px; left:7px; max-width:calc(100% - 14px); font-size:11px; } }

/* Esiti di successo: conferma rapida o riepilogo per flussi completati. */
.md-success-feedback { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.md-success-feedback > div { min-width:0; }
.md-success-feedback .md-demo__label { display:block; margin-bottom:5px; }
.md-success-feedback p { max-width:48ch; margin:0; }
.md-toast { display:flex; align-items:center; gap:12px; min-height:58px; }
.md-toast__message { flex:1; min-width:0; }
.md-toast__icon { display:grid; flex:none; place-items:center; width:30px; height:30px; border-radius:50%; }
.md-toast__icon .md-icon { width:17px; height:17px; }
.md-toast__dismiss { display:grid; flex:none; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:6px; color:inherit; background:transparent; }
.md-toast__dismiss:hover { background:rgb(255 255 255 / 12%); }
.md-toast__dismiss .md-icon { width:17px; height:17px; }
.md-toast--success { border:1px solid #c9dfd0; background:#fff; color:#1c1c1c; }
.md-toast--success .md-toast__icon { color:#176b3a; background:#e8f3ec; }
.md-toast--success .md-toast__dismiss:hover { background:#f0f0f0; }
.md-success-dialog { text-align:center; }
.md-success-dialog__icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 15px; border:1px solid #c9dfd0; border-radius:50%; color:#176b3a; background:#e8f3ec; }
.md-success-dialog__icon .md-icon { width:26px; height:26px; stroke-width:2.2; }
.md-success-dialog__eyebrow { display:block; margin-bottom:7px; color:#176b3a; font-size:12px; line-height:1.3; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.md-success-dialog h3 { margin:0 0 8px; font-size:22px; line-height:1.25; }
.md-success-dialog > p { max-width:38ch; margin:0 auto 19px; font-size:14px; line-height:1.5; }
.md-success-summary { margin:0 0 20px; padding:4px 14px; border:1px solid var(--md-border); border-radius:8px; background:#f7f7f7; text-align:left; }
.md-success-summary > div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; }
.md-success-summary > div + div { border-top:1px solid var(--md-border); }
.md-success-summary dt { color:var(--md-muted); font-size:13px; }
.md-success-summary dd { margin:0; color:var(--md-ink); font-size:13px; font-weight:650; text-align:right; }
.md-success-dialog__actions { justify-content:flex-end; }
@media (max-width:767px) {
  .md-success-feedback { align-items:stretch; flex-direction:column; gap:12px; }
  .md-success-feedback .md-button { width:100%; }
  .md-toast { right:12px; left:12px; bottom:max(12px,env(safe-area-inset-bottom)); max-width:none; }
  .md-success-dialog { padding:22px 18px; }
  .md-success-dialog__actions { flex-direction:column-reverse; }
  .md-success-dialog__actions .md-button { width:100%; }
  .md-success-summary > div { align-items:flex-start; }
}

/* Common data patterns: horizontal bars, step progress, KPI links and compact counters. */
.md-step-demo,.md-counter-demo,.md-horizontal-chart-demo { display:grid; gap:18px; }
.md-step-demo__head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.md-step-demo__head h3,.md-data-pattern-demo h3,.md-counter-demo h3 { margin:0 0 5px; font-size:16px; line-height:1.35; }
.md-step-demo__head p,.md-data-pattern-demo p,.md-counter-demo p { margin:0; }
.md-step-demo__head .md-demo__label,.md-data-pattern-demo .md-demo__label,.md-counter-demo .md-demo__label { margin-bottom:8px; }
.md-step-progress { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; padding:8px 0 0; list-style:none; }
.md-step-progress li { position:relative; min-width:0; text-align:center; }
.md-step-progress li::after { content:""; position:absolute; z-index:0; top:17px; left:50%; width:100%; height:2px; background:var(--md-border); }
.md-step-progress li[data-step-state="completed"]::after { background:var(--md-success); }
.md-step-progress li:last-child::after { display:none; }
.md-step-progress button { position:relative; z-index:1; display:grid; justify-items:center; gap:8px; width:100%; min-height:66px; padding:0 5px; border:0; border-radius:7px; background:transparent; color:var(--md-ink); cursor:pointer; }
.md-step-progress button:focus-visible,.md-horizontal-chart__row:focus-visible,.md-kpi-link:focus-visible,.md-compact-counter:focus-visible { outline:3px solid rgb(0 106 255 / 32%); outline-offset:2px; }
.md-step-progress__number { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--md-border-strong); border-radius:50%; background:#fff; color:var(--md-muted); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.md-step-progress__label { max-width:100%; color:var(--md-muted); font-size:12px; font-weight:600; line-height:1.3; overflow-wrap:anywhere; }
.md-step-progress li[data-step-state="completed"] .md-step-progress__number { border-color:var(--md-success); background:var(--md-success-bg); color:var(--md-success); }
.md-step-progress li[data-step-state="current"] .md-step-progress__number { border-color:var(--md-primary); background:var(--md-primary); color:#fff; box-shadow:0 0 0 3px #ededed; }
.md-step-progress li[data-step-state="current"] .md-step-progress__label { color:var(--md-ink); font-weight:700; }
.md-step-progress button:hover .md-step-progress__label { color:var(--md-ink); }
.md-step-progress__detail { display:flex; align-items:baseline; gap:10px; padding:12px 14px; border:1px solid var(--md-border); border-radius:7px; background:#fafafa; font-size:13px; line-height:1.45; }
.md-step-progress__detail strong { flex:none; }
.md-step-progress__detail span { color:var(--md-muted); }
.md-data-pattern-demo { display:grid; grid-template-columns:minmax(0,.8fr) minmax(260px,1fr); align-items:center; gap:22px; margin-top:20px; padding:20px; border:1px solid var(--md-border); border-radius:var(--md-radius); background:#fff; }
.md-kpi-link { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:112px; padding:18px; border:1px solid var(--md-border); border-radius:8px; background:#fff; color:var(--md-ink); text-decoration:none; transition:border-color .16s ease,background-color .16s ease; }
.md-kpi-link:hover { border-color:var(--md-border-strong); background:#fafafa; }
.md-kpi-link__copy { display:grid; gap:4px; min-width:0; }
.md-kpi-link__label { color:var(--md-muted); font-size:13px; font-weight:600; }
.md-kpi-link__value { color:var(--md-ink); font-size:30px; line-height:1.1; font-weight:700; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.md-kpi-link__hint { color:var(--md-info); font-size:12px; font-weight:600; }
.md-kpi-link__arrow { width:20px; height:20px; flex:none; stroke:currentColor; stroke-width:1.7; transition:transform .16s ease; }
.md-kpi-link:hover .md-kpi-link__arrow { transform:translateX(3px); }
.md-compact-counters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--md-border); border-radius:8px; background:#fff; overflow:hidden; }
.md-compact-counter { display:flex; align-items:center; justify-content:center; gap:9px; min-width:0; min-height:52px; padding:8px 12px; border:0; background:#fff; color:var(--md-ink); cursor:pointer; font:inherit; text-align:left; }
.md-compact-counter + .md-compact-counter { border-left:1px solid var(--md-border); }
.md-compact-counter:hover { background:#f7f7f7; }
.md-compact-counter[aria-pressed="true"] { box-shadow:inset 0 -2px 0 var(--md-primary); background:#f7f7f7; }
.md-compact-counter__value { font-size:18px; line-height:1; font-weight:700; font-variant-numeric:tabular-nums; }
.md-compact-counter__label { color:var(--md-muted); font-size:12px; line-height:1.25; font-weight:600; }
.md-compact-counter[aria-pressed="true"] .md-compact-counter__label { color:var(--md-ink); }
.md-component-result { min-height:20px; margin:0; color:var(--md-muted); font-size:12px; line-height:1.5; }
.md-horizontal-chart { display:grid; gap:3px; }
.md-horizontal-chart__scale,.md-horizontal-chart__row { display:grid; grid-template-columns:42px minmax(80px,1fr) 104px; align-items:center; gap:12px; }
.md-horizontal-chart__scale { min-height:22px; color:var(--md-muted); font-size:10px; font-variant-numeric:tabular-nums; }
.md-horizontal-chart__ticks { display:flex; justify-content:space-between; gap:4px; }
.md-horizontal-chart__row { min-height:40px; width:100%; padding:3px 6px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--md-ink); cursor:pointer; font:inherit; text-align:left; }
.md-horizontal-chart__row:hover,.md-horizontal-chart__row[aria-pressed="true"] { border-color:var(--md-border); background:#fafafa; }
.md-horizontal-chart__day { color:var(--md-muted); font-size:12px; font-weight:600; }
.md-horizontal-chart__track { position:relative; display:block; height:12px; overflow:hidden; border-radius:999px; background-color:#f3f3f3; background-image:linear-gradient(to right,transparent calc(100% - 1px),#dedede calc(100% - 1px)); background-size:25% 100%; }
.md-horizontal-chart__bar { display:block; width:var(--bar-size); height:100%; border-radius:inherit; background:#b9bec5; transition:width .2s ease,background-color .2s ease; }
.md-horizontal-chart__row[data-chart-peak="true"] .md-horizontal-chart__bar { background:var(--md-primary); }
.md-horizontal-chart__row[aria-pressed="true"] .md-horizontal-chart__bar { background:var(--md-primary); }
.md-horizontal-chart__value { color:var(--md-ink); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.md-horizontal-chart__peak { margin-left:3px; color:var(--md-muted); font-size:10px; font-weight:600; }
@media (max-width:767px) {
  .md-step-demo__head { align-items:flex-start; flex-direction:column; gap:8px; }
  .md-step-progress { margin:0 -3px; }
  .md-step-progress button { padding:0 2px; }
  .md-step-progress__label { font-size:10px; }
  .md-step-progress__detail { align-items:flex-start; flex-direction:column; gap:3px; }
  .md-data-pattern-demo { grid-template-columns:1fr; gap:16px; padding:16px; }
  .md-compact-counters { grid-template-columns:1fr; }
  .md-compact-counter { justify-content:flex-start; min-height:46px; padding:7px 12px; }
  .md-compact-counter + .md-compact-counter { border-top:1px solid var(--md-border); border-left:0; }
  .md-horizontal-chart__scale,.md-horizontal-chart__row { grid-template-columns:34px minmax(48px,1fr) 86px; gap:7px; }
  .md-horizontal-chart__row { min-height:44px; padding:3px; }
  .md-horizontal-chart__day,.md-horizontal-chart__value { font-size:11px; }
  .md-horizontal-chart__peak { display:none; }
  .md-horizontal-chart__scale { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
  .md-kpi-link,.md-kpi-link__arrow,.md-horizontal-chart__bar { transition:none; }
}

/* Compact image links for category and section navigation. */
.md-section__head--compact { align-items:center; gap:20px; margin-bottom:14px; padding:0; border:0; }
.md-section__head--compact h2 { font-size:21px; }
.md-section__head--compact p { max-width:620px; margin-top:5px; font-size:13px; }
.md-section__action { min-height:44px; display:inline-flex; flex:none; align-items:center; gap:7px; white-space:nowrap; text-decoration:none; font-size:13px; }
.md-section__action .md-icon { width:16px; height:16px; }
.md-image-links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.md-image-link { min-width:0; min-height:90px; display:flex; align-items:center; gap:11px; padding:10px; color:var(--md-ink); text-decoration:none; transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.md-image-link:hover { border-color:var(--md-border-strong); box-shadow:0 4px 14px rgb(0 0 0 / 6%); transform:translateY(-1px); }
.md-image-link:active { transform:translateY(0); }
.md-image-link__image { width:68px; height:68px; flex:none; border-radius:5px; object-fit:cover; }
.md-image-link__copy { min-width:0; flex:1; display:grid; gap:4px; }
.md-image-link__title { overflow:hidden; color:var(--md-ink); font-size:14px; font-weight:700; line-height:1.25; text-overflow:ellipsis; }
.md-image-link__description { color:var(--md-muted); font-size:12px; line-height:1.35; }
.md-image-link__arrow { width:17px; height:17px; flex:none; color:var(--md-muted); transition:transform .16s ease,color .16s ease; }
.md-image-link:hover .md-image-link__arrow { color:var(--md-ink); transform:translateX(2px); }

/* Shared typography roles and catalog references */
.md-type-display { margin:0; font-size:var(--md-type-display); line-height:var(--md-leading-tight); font-weight:var(--md-weight-heavy); letter-spacing:-.055em; }
.md-type-title { margin:0; font-size:var(--md-type-title); line-height:var(--md-leading-tight); font-weight:var(--md-weight-bold); letter-spacing:-.04em; }
.md-type-heading { margin:0; font-size:var(--md-type-heading); line-height:var(--md-leading-heading); font-weight:var(--md-weight-bold); letter-spacing:-.025em; }
.md-type-subheading { margin:0; font-size:var(--md-type-subheading); line-height:var(--md-leading-heading); font-weight:var(--md-weight-medium); }
.md-type-body { margin:0; font-size:var(--md-type-body); line-height:var(--md-leading-body); }
.md-type-body-sm { margin:0; font-size:var(--md-type-body-sm); line-height:var(--md-leading-body); }
.md-type-label { margin:0; font-size:var(--md-type-label); line-height:var(--md-leading-label); font-weight:var(--md-weight-bold); }
.md-type-caption { margin:0; font-size:var(--md-type-caption); line-height:var(--md-leading-label); font-weight:var(--md-weight-medium); }
.md-type-numeric { margin:0; font-size:var(--md-type-numeric); line-height:var(--md-leading-tight); font-weight:var(--md-weight-bold); font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.md-type-numeric span { color:var(--md-muted); font-size:var(--md-type-body-sm); font-weight:var(--md-weight-medium); letter-spacing:0; }
.md-type-scale > .md-between { align-items:flex-start; }
.md-type-scale > .md-between h3,.md-icon-catalog h3,.md-menu-card-demo h3 { margin:0 0 5px; font-size:var(--md-type-subheading); }
.md-type-scale > .md-between p,.md-menu-card-demo > div:first-child p { margin:0; }
.md-type-scale__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 20px; }
.md-type-sample { min-width:0; padding:13px 0; border-top:1px solid var(--md-border); }
.md-type-sample > div { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:9px; color:var(--md-muted); font-size:var(--md-type-caption); }
.md-type-sample > div strong { color:var(--md-ink); font-size:var(--md-type-label); }
.md-type-sample code { overflow-wrap:anywhere; font-size:11px; }
.md-type-scale__meta { display:flex; flex-wrap:wrap; gap:8px 24px; padding-top:12px; border-top:1px solid var(--md-border); color:var(--md-muted); font-size:var(--md-type-caption); }
.md-type-scale__meta strong { color:var(--md-ink); }
.md-icon-catalog { margin-top:16px; }
.md-icon-catalog__search { max-width:520px; }
.md-icon-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; margin:0; padding:0; list-style:none; }
.md-icon-grid li[hidden] { display:none; }
.md-icon-swatch { display:grid; justify-items:center; align-content:center; gap:9px; min-height:86px; padding:10px 5px; border:1px solid var(--md-border); border-radius:7px; background:#fff; color:var(--md-ink); }
.md-icon-swatch .md-icon { width:22px; height:22px; color:var(--md-muted); }
.md-icon-swatch code { color:var(--md-muted); font-size:11px; }

/* Domain patterns for kitchen operations */
.md-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--md-muted); font-size:var(--md-type-label); }
.md-breadcrumb a { color:var(--md-info); text-underline-offset:3px; font-weight:var(--md-weight-medium); }
.md-breadcrumb [aria-current="page"] { color:var(--md-ink); font-weight:var(--md-weight-bold); }
.md-order-context { display:flex; align-items:center; gap:12px; min-width:0; padding:12px 14px; border:1px solid var(--md-border); border-left:3px solid var(--md-primary); border-radius:8px; background:#fff; }
.md-order-context__icon { display:grid; place-items:center; width:36px; height:36px; flex:none; border-radius:7px; background:var(--md-surface-soft); }
.md-order-context__copy { display:grid; gap:2px; min-width:0; flex:1; }
.md-order-context__copy > span { color:var(--md-muted); font-size:var(--md-type-caption); font-weight:var(--md-weight-bold); text-transform:uppercase; letter-spacing:.05em; }
.md-order-context__copy strong { font-size:var(--md-type-body); }
.md-order-context__copy small { color:var(--md-muted); font-size:var(--md-type-caption); }
.md-order-context__action { flex:none; font-size:var(--md-type-label); }
.md-kds-phases { display:none; }
.md-kds-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:12px; }
.md-kds-column { display:grid; align-content:start; gap:10px; min-width:0; padding:10px; border:1px solid var(--md-border); border-radius:8px; background:#f7f7f7; }
.md-kds-column > header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:2px 2px 8px; border-bottom:1px solid var(--md-border); }
.md-kds-column > header h4 { margin:0; font-size:var(--md-type-label); font-weight:var(--md-weight-bold); }
.md-kds-order { display:grid; gap:10px; padding:12px; box-shadow:none; }
.md-kds-order > .md-between { align-items:flex-start; }
.md-kds-order__items { display:grid; gap:7px; margin:0; padding:0; list-style:none; font-size:var(--md-type-label); }
.md-kds-order__items li { display:flex; gap:6px; }
.md-kds-order__items li > span { color:var(--md-muted); font-weight:var(--md-weight-bold); font-variant-numeric:tabular-nums; }
.md-kds-order__note { display:flex; align-items:center; gap:7px; padding:8px 9px; font-size:var(--md-type-caption); }
.md-kds-order__note .md-icon { width:15px; height:15px; flex:none; }
.md-kds-order > .md-button { width:100%; white-space:normal; }
.md-kds-progress { height:6px; overflow:hidden; border-radius:999px; background:#ededed; }
.md-kds-progress span { display:block; width:var(--progress,0%); height:100%; border-radius:inherit; background:var(--md-primary); }
.md-kds-order__ready { display:flex; align-items:center; gap:7px; color:var(--md-success); font-size:var(--md-type-label); font-weight:var(--md-weight-bold); }
.md-kds-support-grid { margin-top:16px; }
.md-kds-item-row { display:grid; grid-template-columns:18px 32px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:62px; padding:9px 10px; border:1px solid var(--md-border); border-radius:7px; background:#fff; cursor:pointer; }
.md-kds-item-row input { width:18px; height:18px; accent-color:var(--md-primary); }
.md-kds-item-row__qty { font-size:var(--md-type-label); font-weight:var(--md-weight-bold); font-variant-numeric:tabular-nums; }
.md-kds-item-row__copy { display:grid; gap:3px; min-width:0; }
.md-kds-item-row__copy strong { font-size:var(--md-type-label); }
.md-kds-item-row__copy small { color:var(--md-muted); font-size:var(--md-type-caption); }
.md-kds-item-row.is-complete .md-kds-item-row__copy strong { color:var(--md-muted); text-decoration:line-through; text-decoration-thickness:1px; }
.md-key-value-list { display:grid; gap:0; margin:0; }
.md-key-value-list > div { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:42px; padding:7px 0; border-bottom:1px solid var(--md-border); }
.md-key-value-list > div:last-child { border-bottom:0; }
.md-key-value-list dt { color:var(--md-muted); font-size:var(--md-type-label); }
.md-key-value-list dd { margin:0; text-align:right; font-size:var(--md-type-label); font-weight:var(--md-weight-medium); }
.md-history-list { align-content:start; }
.md-history-row { display:flex; align-items:center; gap:10px; min-width:0; padding:10px 0; border-top:1px solid var(--md-border); }
.md-history-row time { width:44px; flex:none; color:var(--md-muted); font-size:var(--md-type-caption); font-variant-numeric:tabular-nums; }
.md-history-row__main { display:grid; gap:3px; flex:1; min-width:0; }
.md-history-row__main strong { font-size:var(--md-type-label); }
.md-history-row__main small { color:var(--md-muted); font-size:var(--md-type-caption); }

/* Customer-facing menu item */
.md-menu-card-demo { display:grid; gap:14px; margin-bottom:18px; }
.md-menu-card-demo__header { display:grid; justify-items:start; gap:4px; }
.md-menu-card-demo__header h3 { margin:0; font-size:var(--md-type-subheading); line-height:var(--md-leading-heading); }
.md-menu-card-demo__header p { margin:0; }
.md-menu-card { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(0,1fr); width:min(100%,1060px); min-width:0; overflow:hidden; border:1px solid var(--md-border); border-radius:var(--md-radius); background:#fff; }
.md-menu-card > img { display:block; width:100%; height:270px; object-fit:cover; object-position:center; }
.md-menu-card__body { display:grid; align-content:center; gap:14px; min-width:0; padding:24px; }
.md-menu-card__top { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.md-menu-card__category { color:var(--md-muted); font-size:11px; line-height:1.3; font-weight:var(--md-weight-bold); letter-spacing:.07em; text-transform:uppercase; }
.md-menu-card__availability { display:inline-flex; align-items:center; gap:7px; color:var(--md-success); font-size:var(--md-type-caption); font-weight:var(--md-weight-bold); }
.md-menu-card__availability::before { width:7px; height:7px; border-radius:50%; background:var(--md-success); content:""; }
.md-menu-card__title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.md-menu-card__title-row h4 { margin:0 0 5px; font-size:var(--md-type-heading); line-height:var(--md-leading-heading); font-weight:var(--md-weight-bold); }
.md-menu-card__title-row p { max-width:58ch; margin:0; color:var(--md-muted); font-size:var(--md-type-body-sm); line-height:var(--md-leading-body); }
.md-menu-card__price { flex:none; padding-top:2px; font-size:var(--md-type-subheading); font-weight:var(--md-weight-bold); font-variant-numeric:tabular-nums; }
.md-menu-card__allergens { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:baseline; gap:12px; padding-top:12px; border-top:1px solid var(--md-border); }
.md-menu-card__allergens-label { color:var(--md-muted); font-size:11px; line-height:1.35; font-weight:var(--md-weight-bold); letter-spacing:.05em; text-transform:uppercase; }
.md-menu-card__allergens ul { display:flex; flex-wrap:wrap; gap:4px 0; margin:0; padding:0; list-style:none; }
.md-menu-card__allergens li { color:var(--md-ink); font-size:var(--md-type-body-sm); font-weight:var(--md-weight-medium); }
.md-menu-card__allergens li + li::before { padding:0 8px; color:var(--md-muted); content:"·"; }
.md-menu-card__action { justify-self:start; }

@media (min-width:768px) and (max-width:1199px) {
  .md-type-scale__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md-icon-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .md-kds-support-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md-history-list { grid-column:1/-1; }
}
@media (max-width:767px) {
  .md-type-scale__grid { grid-template-columns:minmax(0,1fr); }
  .md-type-sample { padding:10px 0; }
  .md-type-scale__meta { display:grid; gap:6px; }
  .md-icon-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .md-icon-swatch { min-height:76px; }
  .md-kds-board__intro { align-items:flex-start; }
  .md-kds-board__intro h3 { margin:0 0 4px; font-size:var(--md-type-subheading); }
  .md-kds-board__intro p { margin:0; }
  .md-kds-phases { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .md-kds-phases .md-button { min-width:0; padding:7px 4px; white-space:normal; font-size:var(--md-type-caption); }
  .md-kds-phases .md-button[aria-pressed="true"] { border-color:var(--md-primary); background:var(--md-primary); color:#fff; }
  .md-kds-phases .md-button span { display:block; margin-top:2px; font-size:11px; font-variant-numeric:tabular-nums; }
  .md-kds-columns { grid-template-columns:minmax(0,1fr); }
  .md-kds-column:not([data-kds-active]) { display:none; }
  .md-kds-support-grid { grid-template-columns:minmax(0,1fr); }
  .md-history-list { grid-column:auto; }
  .md-order-context { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:8px 10px; }
  .md-order-context > .md-badge { grid-column:2; justify-self:start; }
  .md-order-context__action { grid-column:3; grid-row:1/3; align-self:center; }
}
@media (max-width:899px) {
  .md-menu-card { grid-template-columns:minmax(0,1fr); }
  .md-menu-card > img { height:210px; }
  .md-menu-card__body { align-content:start; gap:13px; padding:18px; }
}
@media (max-width:767px) {
  .md-menu-card-demo { gap:11px; }
  .md-menu-card > img { height:180px; }
  .md-menu-card__body { gap:12px; padding:15px; }
  .md-menu-card__title-row { gap:10px; }
  .md-menu-card__title-row h4 { font-size:18px; }
  .md-menu-card__price { font-size:16px; }
  .md-menu-card__allergens { grid-template-columns:auto minmax(0,1fr); gap:8px; }
  .md-menu-card__allergens li { font-size:13px; }
}
@media (min-width:768px) and (max-width:1199px) {
  .md-image-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .md-section__head--compact { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; margin-bottom:12px; }
  .md-section__head--compact h2 { font-size:21px; }
  .md-section__head--compact p { margin-top:5px; font-size:13px; }
  .md-section__action { justify-self:start; min-height:40px; }
  .md-image-links { grid-template-columns:minmax(0,1fr); gap:8px; }
  .md-image-link { min-height:84px; padding:8px; }
  .md-image-link__image { width:64px; height:64px; }
}
