.bs-room { border: 1px solid var(--linje); border-radius: 24px; background: #f0f5f4; padding: clamp(1rem,3vw,2rem); }
.bs-room-page .bs-lasvy > * { min-width: 0; }
.bs-room-page .bs-text { overflow-wrap: anywhere; }
.bs-room h2 { max-width: 30ch; }
.bs-room p { max-width: 80ch; }
.bs-room__limit { border-left: 4px solid #426b62; padding: .7rem 1rem; background: #fff; }
.bs-room__form { margin-top: 1.5rem; }
.bs-room fieldset { min-width: 0; margin: 0 0 1rem; padding: 1rem; border: 1px solid #b8ccc7; border-radius: 14px; background: var(--papper); }
.bs-room legend { font-family: var(--rubrik); font-weight: 800; padding: 0 .4rem; }
.bs-room__fields, .bs-room__candidates, .bs-room__results { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1rem; }
.bs-room label { display: block; font-size: .9rem; font-weight: 600; }
.bs-room__input { display: flex; align-items: center; gap: .5rem; margin-top: .35rem; }
.bs-room input, .bs-room select { min-width: 0; width: 100%; border: 1px solid #849e97; border-radius: 7px; background: #fff; color: #22303a; padding: .7rem; font: inherit; }
.bs-room input[aria-invalid] { border: 2px solid #a12828; }
.bs-room select { margin-top: .35rem; }
.bs-room input:focus-visible, .bs-room select:focus-visible, .bs-room button:focus-visible { outline: 3px solid #255a8b; outline-offset: 3px; }
.bs-room__hint { font-size: .85rem; line-height: 1.6; }
.bs-room__actions { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1rem 0; }
.bs-room button { border: 1px solid #315f54; border-radius: 9px; padding: .7rem 1rem; min-height: 44px; background: #fff; color: #244b42; cursor: pointer; font: inherit; font-weight: 600; }
.bs-room button[type=submit] { background: #315f54; color: #fff; }
.bs-room button:hover { box-shadow: 0 2px 7px #22303a26; }
.bs-room__error { background: #fff1ed; color: #842323; border: 1px solid #842323; padding: .7rem; border-radius: 8px; }
.bs-room__example { font-size: .9rem; background: #fff5d9; padding: .75rem; }
.bs-room__result { min-width: 0; border-radius: 14px; background: #fff; border: 1px solid #bdcec9; padding: 1rem; }
.bs-room__status { font-weight: 700; }
.bs-room__result dl { display: grid; grid-template-columns: 1fr auto; column-gap: 1rem; row-gap: .6rem; font-size: .9rem; }
.bs-room__result dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.bs-room__result svg { width: 100%; height: auto; display: block; }
.bs-room__room { fill: #eef0ee; stroke: #53625d; stroke-width: 2; }
.bs-room__work { fill: #eeddae; fill-opacity: .7; stroke: #856521; stroke-width: 2; stroke-dasharray: 5 4; }
.bs-room__work--over { stroke: #a12828; }
.bs-room__bed { fill: #abd1c6; stroke: #315f54; stroke-width: 2; }
.bs-room__svg-label { font: 13px sans-serif; fill: #22303a; }
.bs-room__legend { display: flex; flex-wrap: wrap; gap: .7rem; font-size: .8rem; }
.bs-room__legend span::before { content: ''; display: inline-block; width: .8rem; height: .8rem; margin-right: .35rem; vertical-align: middle; }
.bs-room__legend-bed::before { background: #abd1c6; border: 1px solid #315f54; }
.bs-room__legend-work::before { background: #eeddae; border: 1px dashed #856521; }
.bs-room [hidden] { display: none !important; }
@media (max-width: 640px) {
  .bs-room__candidates, .bs-room__results { grid-template-columns: minmax(0,1fr); }
  .bs-room__fields { gap: .7rem; }
  .bs-room__result dl { grid-template-columns: minmax(0,1fr) auto; gap: .5rem; }
}
@media print {
  .bs-top, .bs-typer, .bs-fot, .bs-innehall, .bs-sido, .bs-room__actions, .bs-room__hint, .bs-room__example { display: none !important; }
  .bs-room, .bs-room__result { break-inside: avoid; padding: .5rem; }
  .bs-room__candidates, .bs-room__results { grid-template-columns: 1fr 1fr; }
  .bs-room input, .bs-room select { padding: .2rem; }
  .bs-room__result svg { max-height: 180px; }
}