.klinik-public {
	--k-accent: var(--ks-primary, #0f5c4d);
	--k-ink: var(--ks-ink, #17211e);
	--k-muted: var(--ks-muted, #5c6a65);
	--k-line: var(--ks-line, #d9dfdb);
	--k-surface: var(--ks-surface, #fff);
	--k-danger: #b3261e;
	color: var(--k-ink);
	max-width: 760px;
	margin: 0 auto;
	font-size: 1rem;
	line-height: 1.5;
}
.klinik-public *, .klinik-public *::before { box-sizing: border-box; }
.klinik-public h2 { font-size: 1.35rem; margin: 0 0 .75rem; }
.klinik-public fieldset { border: 0; padding: 0; margin: 0 0 1.75rem; min-width: 0; }
.klinik-public legend { font-weight: 700; padding: 0 0 .25rem; margin-bottom: .75rem; border-bottom: 1px solid var(--k-line); width: 100%; }
.klinik-public [hidden] { display: none !important; }
.klinik-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.klinik-field { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.klinik-field.is-full { grid-column: 1 / -1; }
.klinik-field > label { font-weight: 600; font-size: .925rem; }
.klinik-field small, .klinik-lead { color: var(--k-muted); font-size: .875rem; }
.klinik-lead { margin: 0 0 1.25rem; }
.klinik-req { color: var(--k-danger); }
.klinik-public input:not([type=radio]):not([type=checkbox]), .klinik-public select, .klinik-public textarea {
	width: 100%; min-height: 46px; padding: .6rem .75rem; font: inherit; color: inherit;
	background: var(--k-surface); border: 1px solid #9aa8a2; border-radius: 8px;
}
.klinik-public :is(input, select, textarea):focus-visible { outline: 3px solid color-mix(in srgb, var(--k-accent) 35%, transparent); border-color: var(--k-accent); outline-offset: 1px; }
.klinik-field.has-error :is(input, select, textarea) { border-color: var(--k-danger); }
.klinik-error { color: var(--k-danger); font-size: .875rem; margin: 0; }
.klinik-banner { background: #fdecea; border: 1px solid #f2b8b5; color: #7a1a14; border-radius: 8px; padding: .75rem 1rem; margin-bottom: 1.25rem; }
.klinik-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }

.klinik-steps { list-style: none; display: flex; gap: .5rem; margin: 0 0 1.75rem; padding: 0; counter-reset: k; }
.klinik-steps li { counter-increment: k; flex: 1; font-size: .8125rem; color: var(--k-muted); border-top: 3px solid var(--k-line); padding-top: .4rem; }
.klinik-steps li.is-active { color: var(--k-ink); font-weight: 700; border-color: var(--k-accent); }
.klinik-steps li.is-done { border-color: var(--k-accent); }

.klinik-at { margin: 0 0 1.25rem; padding: .6rem .9rem; background: var(--k-surface); border: 1px solid var(--k-line); border-radius: 8px; display: flex; flex-wrap: wrap; gap: .4rem; align-items: baseline; }
.klinik-at a { margin-left: auto; }
.klinik-picker { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.klinik-picker a { display: block; padding: 1rem 1.15rem; border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-surface); color: inherit; text-decoration: none; }
.klinik-picker a:hover { border-color: var(--k-accent); }
.klinik-picker strong, .klinik-picker span { display: block; }
.klinik-picker span { color: var(--k-muted); white-space: pre-line; }
.klinik-ticket-clinic { font-weight: 700; margin: 0 0 .25rem; }
.klinik-step { margin-bottom: 1.5rem; }
.klinik-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.klinik-choice label { position: relative; cursor: pointer; }
.klinik-choice input { position: absolute; opacity: 0; }
.klinik-choice span { display: block; height: 100%; padding: 1rem; border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-surface); }
.klinik-choice strong, .klinik-choice small { display: block; }
.klinik-choice small { color: var(--k-muted); }
.klinik-choice input:checked + span { border-color: var(--k-accent); box-shadow: inset 0 0 0 1px var(--k-accent); }
.klinik-choice input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--k-accent) 35%, transparent); }
.klinik-consent { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400 !important; }
.klinik-consent input { margin-top: .3rem; width: 18px; height: 18px; flex: none; }

.klinik-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: .6rem 1.4rem; border: 1px solid var(--k-accent); border-radius: 8px; background: var(--k-accent); color: #fff; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.klinik-btn:hover { filter: brightness(1.1); }
.klinik-btn-ghost { background: transparent; color: var(--k-accent); }
.klinik-nav { display: flex; justify-content: space-between; gap: .75rem; }
.klinik-nav [data-next] { margin-left: auto; }
.klinik-actions { margin-top: 1rem; }

.klinik-ticket { border: 1px solid var(--k-line); border-radius: 12px; padding: 1.25rem; background: var(--k-surface); margin-top: 1rem; }
.klinik-ticket-intro { margin: 0 0 1rem; }
.klinik-ticket-no { display: flex; justify-content: space-between; align-items: center; padding: .75rem 1rem; border-radius: 8px; background: var(--k-accent); color: #fff; }
.klinik-ticket-no strong { font-size: 2.25rem; line-height: 1; }
.klinik-ticket dl { margin: 1rem 0 0; }
.klinik-ticket dl div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--k-line); }
.klinik-ticket dl div:last-child { border-bottom: 0; }
.klinik-ticket dt { color: var(--k-muted); }
.klinik-ticket dd { margin: 0; font-weight: 600; text-align: right; }
.klinik-code { font-family: ui-monospace, Menlo, monospace; letter-spacing: .08em; }
.klinik-status-form { display: flex; gap: .75rem; align-items: flex-end; }
.klinik-status-form .klinik-field { flex: 1; }

@media (max-width: 600px) {
	.klinik-grid, .klinik-choice { grid-template-columns: minmax(0, 1fr); }
	.klinik-status-form { flex-direction: column; align-items: stretch; }
	.klinik-steps li { font-size: .75rem; }
}