.mock{--mock-fg: #fff;--mock-muted: color-mix(in srgb, #fff 60%, #0a0a0a);--mock-line: color-mix(in srgb, #fff 12%, transparent);background:color-mix(in srgb,#fff 4%,#0a0a0a);border:1px solid var(--mock-line);border-radius:14px;overflow:hidden;color:var(--mock-fg);font-family:var(--font-body);font-size:.78rem;line-height:1.35;box-shadow:0 30px 80px -30px #000c}.mock-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--mock-line)}.mock-bar span{width:8px;height:8px;border-radius:50%;background:var(--mock-line)}.mock-bar em{margin-left:8px;font-style:normal;font-family:var(--font-mono);font-size:.68rem;color:var(--mock-muted)}.mock-body{padding:14px;display:grid;gap:10px}.mock-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.mock-title{font-weight:600;font-size:.86rem}.mock-sub{color:var(--mock-muted);font-size:.72rem}.mock-pill{font-family:var(--font-mono);font-size:.64rem;padding:3px 8px;border-radius:999px;border:1px solid var(--mock-line);color:var(--mock-muted);white-space:nowrap}.mock-pill-ok{color:#17e17b;border-color:color-mix(in srgb,#17e17b 40%,transparent);background:color-mix(in srgb,#17e17b 10%,transparent)}.mock-pill-warn{color:#23e1ca;border-color:color-mix(in srgb,#23e1ca 40%,transparent);background:color-mix(in srgb,#23e1ca 10%,transparent)}.mock-progress{height:4px;border-radius:2px;background:var(--mock-line);overflow:hidden}.mock-progress i{display:block;height:100%;background:linear-gradient(90deg,#23e1ca,#17e17b)}.mock-list{display:grid;gap:6px}.mock-list li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:6px 8px;border:1px solid var(--mock-line);border-radius:8px}.mock-list code{font-family:var(--font-mono);font-size:.7rem;color:#23e1ca}.mock-photos{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.mock-photo{aspect-ratio:1;border-radius:6px;background:linear-gradient(135deg,color-mix(in srgb,#23e1ca 30%,#0a0a0a),#0a0a0a);border:1px solid var(--mock-line)}.mock-photo-1{background:linear-gradient(45deg,#0a0a0a,color-mix(in srgb,#fff 18%,#0a0a0a))}.mock-photo-3{background:linear-gradient(225deg,color-mix(in srgb,#17e17b 25%,#0a0a0a),#0a0a0a)}.mock-cta{display:inline-flex;align-items:center;gap:6px;justify-self:start;padding:7px 12px;border-radius:8px;background:#23e1ca;color:#0a0a0a;font-weight:600}.mock-cal{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.mock-cal-day{font-family:var(--font-mono);font-size:.64rem;color:var(--mock-muted);text-align:center}.mock-slot{height:22px;border-radius:5px;border:1px solid var(--mock-line)}.mock-slot-booked{background:color-mix(in srgb,#fff 14%,transparent)}.mock-slot-mine{background:#23e1ca;border-color:#23e1ca}.mock-legend{display:flex;gap:12px;font-size:.66rem;color:var(--mock-muted)}.mock-legend span{display:inline-flex;align-items:center;gap:5px}.mock-legend i{width:10px;height:10px;border-radius:3px;border:1px solid var(--mock-line);display:inline-block}.mock-toast{display:inline-flex;align-items:center;gap:6px;justify-self:start;padding:7px 10px;border-radius:8px;border:1px solid color-mix(in srgb,#23e1ca 40%,transparent);background:color-mix(in srgb,#23e1ca 10%,transparent);color:#fff}.mock-q{font-weight:600;font-size:.86rem}.mock-choice{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.mock-choice span{text-align:center;padding:7px;border-radius:8px;border:1px solid var(--mock-line);color:var(--mock-muted)}.mock-choice-on{background:#23e1ca;border-color:#23e1ca!important;color:#0a0a0a!important;font-weight:600}.mock-stepper{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--mock-line);border-radius:8px;padding:3px 8px}.mock-stepper b{color:var(--mock-muted);font-weight:400}.mock-qr{display:block;width:96px;height:96px;margin:2px auto;padding:6px;background:#fff;border-radius:8px;shape-rendering:crispEdges}.mock-center{text-align:center}