/* * Staff Dashboard v2 (re-skin) — PC Management tiles. * Design language from reference/new design (Claude mockup): refined-gold * accent, dark elevated cards, status pill, big mono timer. * * ISOLATED: every rule is scoped to #pc-grid-sections so it cannot touch * any .pc-card elsewhere or any other part of the page. The --nx-* palette * variables are prefixed + scoped to #pc-grid-sections so they can never * collide with the page/_Layout's --color-* design system. * * The wrapper .pc-card + data-pcid + click + .pc-badges are produced by * Dashboard2.cshtml's renderPcCard; pcCardInner() (pcmgmt-tiles-v2.js) * fills the inside. The timer element keeps class .pc-time (+ .pc-time--idle * when idle) — the 1s ticker / live-update query those. */ #pc-grid-sections { --nx-elev: #111316; --nx-surface: #15181c; --nx-border: #23272e; --nx-border-2: #2e3340; --nx-text: #e7e9ee; --nx-text2: #a5acba; --nx-text3: #6c7385; --nx-text4: #4a505d; --nx-accent: #d4a83f; } #pc-grid-sections .pc-card { /* !important neutralises the per-status inline background/border the live-update path writes — the status PILL is the single state cue. */ background: linear-gradient(180deg, #15181d 0%, #0e1013 100%) !important; border: 1px solid var(--nx-border) !important; border-radius: 12px !important; box-sizing: border-box !important; /* Depth: a tight contact shadow + a soft ambient lift + a lit top edge (inset highlight) so the dark card reads as raised off the page, not flat. The subtle top-to-bottom gradient adds lit-from-above. */ box-shadow: 0 1px 2px rgba(0,0,0,.55), 0 6px 16px -5px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.055) !important; padding: 10px 11px 9px !important; min-height: 112px; font-size: 0.95em; /* default tile sized down ~5% (em-based content scales with it) */ display: flex; flex-direction: column; text-align: left; position: relative; overflow: visible; /* corner .pc-badges sit outside the frame */ transition: border-color .15s ease, box-shadow .15s ease, transform .12s ease; /* 2026-06-02 — container queries: lets inner text (prefix, timer, balance) scale with TILE WIDTH using cqi units. 1cqi = 1% of tile inline-size. Previously em-units made text stay big when tiles shrank, overflowing past the boundary. */ container-type: inline-size; } #pc-grid-sections .pc-card:hover { border-color: var(--nx-border-2) !important; background: linear-gradient(180deg, #1a1e25 0%, #111317 100%) !important; box-shadow: 0 2px 4px rgba(0,0,0,.55), 0 16px 32px -8px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08) !important; transform: translateY(-2px); } /* ---- state paint: a solid left accent bar in the state colour, so staff can read the floor by colour at a glance. ---- */ #pc-grid-sections .pc-edge { position: absolute; left: 0; top: 0; bottom: 0; width: 3px; border-radius: 12px 0 0 12px; pointer-events: none; z-index: 1; } #pc-grid-sections .pc-edge--available { background:#4ade80; } #pc-grid-sections .pc-edge--in-use { background:#f59e0b; } #pc-grid-sections .pc-edge--reserved { background:#60a5fa; } #pc-grid-sections .pc-edge--screen-locked { background:#d4a83f; } #pc-grid-sections .pc-edge--guest-times-up{ background:#ef4444; } #pc-grid-sections .pc-edge--cleaning { background:#22d3ee; } #pc-grid-sections .pc-edge--issue { background:#c084fc; } #pc-grid-sections .pc-edge--offline { background:#3a4150; } /* Phase BPC (2026-06-13) — broken = staff-flagged out-of-order. Amber-on- gray accent so it reads "needs attention" without alarming-red noise. */ #pc-grid-sections .pc-edge--broken { background:#f59e0b; } /* Subtle "lighter card + sheen" — a faint white top-light overlay that makes live tiles pop. pcCardInner emits it only on non-offline tiles, so offline stays flat dark. Sits above the card bg, below the edge bar + content. */ #pc-grid-sections .pc-sheen { position: absolute; inset: 0; border-radius: 12px; pointer-events: none; z-index: 0; background: linear-gradient(180deg, rgba(255,255,255,.075) 0%, rgba(255,255,255,.022) 45%, rgba(255,255,255,.008) 100%); } /* ---- head: name + clean mark + status pill ---- */ #pc-grid-sections .pc-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; position: relative; z-index: 2; } #pc-grid-sections .pc-name { /* 2026-06-02 — scales with tile width via cqi. clamp keeps it readable (>=8px) on tiny tiles and prevents it from ballooning (>14px) on wide tiles. Operator can adjust the clamp values to taste later. */ font-size: clamp(8px, 11cqi, 14px); font-weight: 600; letter-spacing: 0.02em; color: var(--nx-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; } #pc-grid-sections .pc-head-r { display: flex; align-items: center; gap: 4px; flex-shrink: 0; } #pc-grid-sections .pc-clean { font-size: 0.7em; line-height: 1; } /* ---- status pill (dot-only, 2026-06-02) ---- Text removed (was "OFFLINE" / "IN USE" etc.) to give the prefix room on narrow tiles. State is communicated by: • Dot color inside the pill • Left edge bar (.pc-edge) — same color • title="..." attribute on hover (set in pcCardInner) The pill is now ~17px square so it never crowds the prefix. */ #pc-grid-sections .pc-pill { display: inline-flex; align-items: center; justify-content: center; padding: 4px; border-radius: 999px; border: 1px solid var(--nx-border-2); background: var(--nx-surface); box-shadow: 0 1px 2px rgba(0,0,0,.4); flex-shrink: 0; } #pc-grid-sections .pc-pill-dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; flex-shrink: 0; display: block; } #pc-grid-sections .pc-pill--available { color:#4ade80; border-color:rgba(74,222,128,.30); background:rgba(74,222,128,.10); } #pc-grid-sections .pc-pill--in-use { color:#f59e0b; border-color:rgba(245,158,11,.30); background:rgba(245,158,11,.10); } #pc-grid-sections .pc-pill--reserved { color:#60a5fa; border-color:rgba(96,165,250,.30); background:rgba(96,165,250,.10); } #pc-grid-sections .pc-pill--screen-locked { color:#d4a83f; border-color:rgba(212,168,63,.32); background:rgba(212,168,63,.10); } #pc-grid-sections .pc-pill--guest-times-up{ color:#ef4444; border-color:rgba(239,68,68,.34); background:rgba(239,68,68,.12); } #pc-grid-sections .pc-pill--cleaning { color:#22d3ee; border-color:rgba(34,211,238,.30); background:rgba(34,211,238,.10); } #pc-grid-sections .pc-pill--issue { color:#c084fc; border-color:rgba(192,132,252,.32); background:rgba(192,132,252,.10); } #pc-grid-sections .pc-pill--offline { color:var(--nx-text3); } #pc-grid-sections .pc-pill--broken { color:#f59e0b; border-color:rgba(245,158,11,.34); background:rgba(245,158,11,.12); } /* Phase BPC — broken tile gets a desaturated, dimmed look so a glance at the floor instantly distinguishes "out of order" from a busy "in-use" amber. The wrench badge in the corner is added by pcCardInner via a pc-broken-badge span. */ #pc-grid-sections .pc-card[data-state="broken"] { filter: grayscale(0.65) opacity(0.72); } #pc-grid-sections .pc-card[data-state="broken"]::after { content: '\1F527'; /* wrench */ position: absolute; top: 4px; left: 8px; font-size: clamp(10px, 14cqi, 20px); z-index: 3; pointer-events: none; filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)); } #pc-grid-sections .pc-pill--guest-times-up .pc-pill-dot { animation: nx-pulse 1.5s ease-in-out infinite; } @keyframes nx-pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } } /* ---- centre: the big timer ---- */ #pc-grid-sections .pc-mid { flex: 1 1 auto; display: flex; align-items: center; min-height: 0; margin: 9px 0 3px; position: relative; z-index: 2; } #pc-grid-sections .pc-timer { font-family: Consolas, "Cascadia Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; /* 2026-06-02 — clamp + cqi so the timer auto-scales to the tile width. At ~80px tile: 11px font. At ~150px tile: 21px font. Caps at 24px on wide tiles. Adjust the middle cqi value to tune scaling rate. */ font-size: clamp(11px, 14cqi, 24px); font-weight: 600; letter-spacing: -0.01em; color: var(--nx-text); white-space: nowrap; overflow: hidden; text-overflow: clip; max-width: 100%; } #pc-grid-sections .pc-timer--muted { color: var(--nx-text4); font-size: clamp(8px, 10cqi, 14px); font-weight: 500; letter-spacing: 1px; } #pc-grid-sections .pc-timer--danger { color: #ef4444; } /* ---- foot: user + balance ---- */ #pc-grid-sections .pc-foot { flex: 0 0 auto; padding-top: 8px; border-top: 1px dashed var(--nx-border); display: flex; align-items: center; justify-content: space-between; gap: 6px; /* 2026-06-02 — cqi-based so user name + balance shrink with tile. */ font-size: clamp(7px, 8cqi, 11px); position: relative; z-index: 2; min-width: 0; } #pc-grid-sections .pc-foot--quiet { border-top: none; padding-top: 2px; color: var(--nx-text4); } #pc-grid-sections .pc-user { display: flex; align-items: center; gap: 5px; min-width: 0; color: var(--nx-text2); } #pc-grid-sections .pc-ava { width: 15px; height: 15px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 0.78em; font-weight: 700; color: #fff; background: linear-gradient(135deg, #6b7280, #374151); } #pc-grid-sections .pc-uname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #pc-grid-sections .pc-bal { color: var(--nx-text2); font-family: Consolas, monospace; font-weight: 600; flex-shrink: 0; } /* ========== 2026-06-02 — Density presets ========== * * Operator-selected. Stored in PosContent[pc_tile_density]. Applied as a * class on #pc-grid-sections itself. Each preset tunes: * • --pc-tile-min: minimum tile width (drives how many fit per row) * • .pc-card padding + min-height (vertical density) * • Hides foot section on TINY (no room) for max squeeze * * Scroll fallback: even at TINY a 200-PC operator might overflow. The * grid container gets overflow:auto so it scrolls horizontally + vertically * inside its own box (sidebars stay locked). */ #pc-grid-sections { /* Scroll fallback: when content overflows the available area, the grid scrolls inside its own box. Sidebars (shift status, chat) stay locked in their columns. Caps the height to viewport-minus-header so vertical scroll triggers before the page itself scrolls. */ overflow: auto; max-height: calc(100vh - 200px); } /* TINY — maximum squeeze. Tiny tiles, no foot text. Fits ~120+ PCs on 1080p. */ #pc-grid-sections.pc-density--tiny .pc-card { min-height: 64px !important; padding: 4px 5px 3px !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-foot, #pc-grid-sections.pc-density--tiny .pc-card .pc-clean { display: none !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-mid { margin: 2px 0 0 !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-timer { font-size: clamp(9px, 16cqi, 16px) !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-name { font-size: clamp(7px, 14cqi, 11px) !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-pill { padding: 2px !important; } #pc-grid-sections.pc-density--tiny .pc-card .pc-pill-dot { width: 6px !important; height: 6px !important; } /* COMPACT — smaller than NORMAL but keeps foot text. Fits ~80 PCs on 1080p. */ #pc-grid-sections.pc-density--compact .pc-card { min-height: 82px !important; padding: 6px 7px 5px !important; } #pc-grid-sections.pc-density--compact .pc-card .pc-mid { margin: 4px 0 2px !important; } #pc-grid-sections.pc-density--compact .pc-card .pc-foot { padding-top: 4px !important; } #pc-grid-sections.pc-density--compact .pc-card .pc-timer { font-size: clamp(10px, 13cqi, 19px) !important; } #pc-grid-sections.pc-density--compact .pc-card .pc-pill-dot { width: 7px !important; height: 7px !important; } /* NORMAL — current default. Defined here for completeness; no overrides. */ /* #pc-grid-sections.pc-density--normal — uses the base .pc-card sizes. */ /* LARGE — bigger tiles for small cafes (< 30 PCs) who want readability. */ #pc-grid-sections.pc-density--large .pc-card { min-height: 140px !important; padding: 13px 14px 12px !important; } #pc-grid-sections.pc-density--large .pc-card .pc-timer { font-size: clamp(16px, 16cqi, 32px) !important; } #pc-grid-sections.pc-density--large .pc-card .pc-name { font-size: clamp(11px, 12cqi, 17px) !important; } #pc-grid-sections.pc-density--large .pc-card .pc-pill-dot { width: 11px !important; height: 11px !important; } /* ============================================================ * Phase 2 (2026-06-12) — Floor-plan layout + fixed tile widths. * * 1. Fixed tile widths per density (set via --pc-tile-w). The * inner grid uses this variable instead of 1fr so: * • cols=1 no longer blows tiles into a viewport-wide banner * • sections auto-size to their content, not the column track * • Floor-plan canvas can position sections by (x,y) cleanly * Operator-set Cols still controls how many tracks per row. * * 2. Floor-plan mode (.pc-floor-mode on container): sections * position absolutely at (x,y) on a relative canvas. The outer * sections-per-row grid is bypassed entirely. * * 3. Edit overlay (.pc-floor-edit): dashed outline + grabbable * section header, so operator sees what's draggable. * ============================================================ */ #pc-grid-sections { --pc-tile-w: 150px; } #pc-grid-sections.pc-density--tiny { --pc-tile-w: 88px; } #pc-grid-sections.pc-density--compact { --pc-tile-w: 118px; } #pc-grid-sections.pc-density--normal { --pc-tile-w: 150px; } #pc-grid-sections.pc-density--large { --pc-tile-w: 200px; } #pc-grid-sections.pc-floor-mode { position: relative; display: block !important; grid-template-columns: none !important; overflow: auto; min-height: 600px; } #pc-grid-sections.pc-floor-mode .pc-section { position: absolute; margin: 0 !important; } #pc-grid-sections.pc-floor-mode.pc-floor-edit .nx-floor-head { cursor: move; user-select: none; } /* 2026-08-24 — floor mode: keep the section header WITHIN its own width so narrow (1-2 col) sections placed side by side don't overlap each other's headers. Compact text + hide the "· N stations" meta + clip overflow. */ #pc-grid-sections.pc-floor-mode .nx-floor-head { overflow: hidden; gap: 4px; } #pc-grid-sections.pc-floor-mode .nx-floor-l { flex-wrap: nowrap; min-width: 0; overflow: hidden; } #pc-grid-sections.pc-floor-mode .nx-floor-name { font-size: 0.92em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #pc-grid-sections.pc-floor-mode .nx-floor-meta { white-space: nowrap; } #pc-grid-sections.pc-floor-mode.pc-floor-edit .pc-section { outline: 1px dashed rgba(212,168,63,.30); outline-offset: 4px; border-radius: 4px; } #pc-grid-sections.pc-floor-mode.pc-floor-edit .pc-section.pc-section--dragging { opacity: 0.88; outline: 2px solid #d4a83f; z-index: 100; } /* ============================================================ * Phase 2.16 (2026-06-12) — Empty-cell sizing parity. * Operator-reported: empty cells were ~50px tall while filled * tiles were 112-140px, creating uneven row heights inside a * section grid. Empty cells now match the .pc-card min-height * for the same density so the grid reads as one even sheet. * Idle (view-mode) empty cells are invisible but still occupy * the same space. Edit-mode empty cells keep their dashed * outline + plus icon centered. * ============================================================ */ #pc-grid-sections .pc-empty-cell { min-height: 112px; /* matches .pc-card default min-height */ box-sizing: border-box; } #pc-grid-sections.pc-density--tiny .pc-empty-cell { min-height: 64px; } #pc-grid-sections.pc-density--compact .pc-empty-cell { min-height: 82px; } #pc-grid-sections.pc-density--normal .pc-empty-cell { min-height: 112px; } #pc-grid-sections.pc-density--large .pc-empty-cell { min-height: 140px; } /* Idle (non-edit) empty cells: no border, no cursor, no plus icon — pure spacer so rows stay even. */ #pc-grid-sections .pc-empty-cell--idle { border: none !important; cursor: default !important; background: transparent; } /* ============================================================ * Phase 2.10 (2026-06-12) — Magnifier auto-fit viewport. * * The viewport clips overflow; JS applies transform: scale(N) on * the inner #pc-grid-sections so the entire floor plan fits * inside the viewport without scrollbars. Scale is shrink-only * (Math.min(1, fit)) — never grows past 1.0. * * Only active when the inner is in floor-plan mode. Stack mode * preserves the existing scrollable behavior (no clip, no scale). * ============================================================ */ #pc-grid-viewport { /* In stack mode this is a transparent pass-through wrapper — no constraints, no clip. Inner #pc-grid-sections keeps its own overflow:auto + max-height (legacy behavior). */ } #pc-grid-viewport.pc-zoom-on { overflow: hidden; max-height: calc(100vh - 240px); position: relative; } #pc-grid-viewport.pc-zoom-on #pc-grid-sections { /* Override the legacy scroll container — magnifier handles fit. */ overflow: visible !important; max-height: none !important; transform-origin: top left; transform: scale(var(--pc-zoom, 1)); } /* ============================================================ * 2026-06-14 — MONITOR TILE RESKIN * * • Bottom-only chin (no top/side bezels) * • Status LED moved from top-right pill to a horizontal bar * centered in the chin (no glow, just flat color line) * • Depth: layered shadows + top-edge highlight + side highlights * + recessed-screen ambient, so the tile reads as a physical * monitor housing instead of a flat rectangle * • POWERED DOWN: power icon ⏻ + caption replaces the "—" idle * when state="offline" * * Scope: monitor tiles only (data-device="monitor" — set by * pcCardInner). Rental shapes (table / ps) are untouched. * * Backward compat: the pc-pill markup keeps emitting; CSS just * hides it on monitor tiles so a partial deploy (CSS without JS * update) shows the pill harmlessly. * ============================================================ */ #pc-grid-sections .pc-card[data-device="monitor"] { /* top-down housing gradient (lighter top, darker bottom) — reads like real plastic catching ambient light */ background: linear-gradient(180deg, #1a1e25 0%, #0e1116 100%) !important; /* layered shadow: inner top highlight + inner bottom shade + close ambient + soft cast */ box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 -1px 0 rgba(0,0,0,.45), 0 2px 4px rgba(0,0,0,.35), 0 12px 22px -10px rgba(0,0,0,.65) !important; /* reserve bottom for the chin */ padding-bottom: clamp(14px, 14%, 26px) !important; /* MUST stay overflow: visible — the corner .pc-badges (orders / claims / issue / dispatch) are positioned top:-4px right:-4px OUTSIDE the tile frame; clipping them was the 2026-06-14 bug. */ overflow: visible !important; } #pc-grid-sections .pc-card[data-device="monitor"]:hover { /* preserve the lift on hover but with the new depth shadow */ box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 -1px 0 rgba(0,0,0,.45), 0 2px 4px rgba(0,0,0,.45), 0 18px 28px -10px rgba(0,0,0,.7) !important; } /* side highlights — 1px white on left, 1px shadow on right. Subtle. Adds the "physical frame catching light" feel. */ #pc-grid-sections .pc-card[data-device="monitor"]::before { content: ""; position: absolute; inset: 0; border-radius: 12px; pointer-events: none; box-shadow: inset 1px 0 0 rgba(255,255,255,.025), inset -1px 0 0 rgba(0,0,0,.35); z-index: 1; } /* hide the top-right status pill on monitor tiles — chin LED replaces it. */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-pill { display: none !important; } /* Hide the left-edge color bar (.pc-edge) on monitor tiles — the chin LED is now the single status indicator. Edge stays for rental shapes (table / ps) where it's still useful as a side accent. */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-edge { display: none !important; } /* per-state vars: LED color (chin bar) + ambient color (top-of-screen halo) */ #pc-grid-sections .pc-card[data-device="monitor"][data-state="available"] { --led: #4ade80; --ambient: rgba(74,222,128,.18); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="in-use"] { --led: #f59e0b; --ambient: rgba(245,158,11,.18); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="screen-locked"] { --led: #d4a83f; --ambient: rgba(212,168,63,.16); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="guest-times-up"] { --led: #ef4444; --ambient: rgba(239,68,68,.24); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="reserved"] { --led: #60a5fa; --ambient: rgba(96,165,250,.16); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="cleaning"] { --led: #22d3ee; --ambient: rgba(34,211,238,.16); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="issue"] { --led: #c084fc; --ambient: rgba(192,132,252,.16); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="broken"] { --led: #f59e0b; --ambient: rgba(245,158,11,.12); } #pc-grid-sections .pc-card[data-device="monitor"][data-state="offline"] { --led: #2a2f38; --ambient: transparent; } /* ambient halo at top of screen — extremely subtle status-color glow */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-ambient { position: absolute; left: 12%; right: 12%; top: 0; height: 30%; background: radial-gradient(ellipse at top, var(--ambient, transparent), transparent 70%); opacity: .35; pointer-events: none; z-index: 0; } /* CHIN — physical strip at the bottom carrying the LED bar */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-chin { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(14px, 14%, 26px); background: linear-gradient(180deg, #14171c 0%, #0a0c0f 60%, #060708 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.04), inset 0 -2px 3px rgba(0,0,0,.55); display: flex; align-items: center; justify-content: center; z-index: 2; border-radius: 0 0 12px 12px; pointer-events: none; } /* STATUS LED BAR — flat color line, no glow. Pulses on times-up. */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-chin::after { content: ""; display: block; width: 36%; height: 3px; border-radius: 2px; background: var(--led, #2a2f38); opacity: .9; } #pc-grid-sections .pc-card[data-device="monitor"][data-state="offline"] .pc-chin::after { opacity: .55; } #pc-grid-sections .pc-card[data-device="monitor"][data-state="guest-times-up"] .pc-chin::after { animation: nx-pulse 1.2s ease-in-out infinite; } /* POWERED DOWN — replaces the center "—" idle text when offline */ #pc-grid-sections .pc-card[data-device="monitor"] .pc-off { display: flex; flex-direction: column; align-items: center; gap: 5px; color: var(--nx-text4); margin: auto; } #pc-grid-sections .pc-card[data-device="monitor"] .pc-off svg { width: clamp(20px, 32cqi, 42px); height: auto; } #pc-grid-sections .pc-card[data-device="monitor"] .pc-off-cap { font-size: clamp(7px, 8cqi, 11px); letter-spacing: .12em; font-weight: 700; } /* Broken-state badge override — the wrench drawn by the global rule (line ~148) sits on the housing now; keep it but shift inside the screen area so it doesn't clip the chin. */ #pc-grid-sections .pc-card[data-device="monitor"][data-state="broken"]::after { top: 6px; left: 8px; }