*{box-sizing:border-box}body{margin:0;background:#f4f7f5;color:#19382f;font:16px/1.5 system-ui,sans-serif}main{max-width:1300px;margin:auto;padding:clamp(1rem,3vw,2.5rem)}header,.status{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}h1{font-size:clamp(1.6rem,4vw,2.7rem)}h2{font-size:1.15rem;margin-top:0}section,details{background:#fff;border:1px solid #d7e2dc;border-radius:.8rem;padding:1rem;margin-bottom:1rem}.options{background:#fff0ef;border-left:.5rem solid #ad2828;color:#821e24}.board{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:1rem}article{border-top:1px solid #d7e2dc;padding:.8rem 0;overflow-wrap:anywhere}article p{margin:.3rem 0;font-size:.9rem}.fields{display:grid;gap:.75rem;max-width:36rem;margin:.8rem 0}label{display:grid;gap:.25rem}input,textarea,select,button{font:inherit;padding:.5rem;border-radius:.4rem;border:1px solid #7d9389;max-width:100%}button{background:#21574a;color:white;cursor:pointer}a{color:inherit;font-weight:650}summary{font-weight:700;cursor:pointer}:focus-visible{outline:3px solid #92642d;outline-offset:3px}

body { background: #f3e9d9; color: #233d35; }
header { background: #dde9da; border-radius: 1rem; padding: .5rem 1.25rem; margin-bottom: 1.25rem; }
section, details { background: #fff7e9; border-color: #d8cbb7; }
.options { background: #fce0dc; border-color: #e8aaa4; border-left-color: #ad2828; }
.column-0 { background: #fff0cf; }
.column-1 { background: #e0eee5; }
.column-2 { background: #f7e5d5; }
.column-3, .column-4 { background: #e5ecdd; }
.column-5 { background: #ece5dd; }
article { border-color: #cabfaa; scroll-margin-top: 1rem; }
article:target { background: #fff9e6; outline: 2px solid #286453; border-radius: .4rem; padding-inline: .6rem; }
.print-help { display: flex; flex-wrap: wrap; gap: .35rem 1rem; }
@page { margin: 15mm; }
@media print {
  body, header, section, article:target { background: white; color: black; }
  main, header { padding: 0; }
  .screen-only, .status { display: none !important; }
  .board, header { display: block; }
  section { border: 0; padding: 0; }
  .options { border-left: 2px solid #8a2222; padding-left: .7rem; }
  article { break-inside: avoid; padding: .35rem 0; }
  article:target { outline: 0; }
  h2 { break-after: avoid; }
  a { text-decoration: none; }
}

@media screen {
  body { background: #f1e6d5; }
  body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: url("bilder/cafe.jpeg") center 47% / cover no-repeat;
    opacity: .1;
    pointer-events: none;
  }
  main { position: relative; }
  header {
    background: linear-gradient(115deg, #fff6e8, #dce9db);
    border: 1px solid #cfbeaa;
    padding: clamp(.8rem, 3vw, 1.5rem);
    box-shadow: 0 8px 25px #38260e12;
  }
  .board > section, .options { box-shadow: 0 4px 14px #38260e10; }
}
.brand { display: flex; align-items: center; gap: clamp(.65rem, 2vw, 1.4rem); }
.brand img { width: clamp(3.8rem, 10vw, 6rem); height: auto; }
.brand p { margin: 0; color: #445a4c; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.brand h1 { margin: .12rem 0 0; line-height: 1.1; font-family: Georgia, serif; }
@media print { .brand img { width: 2.5rem; } }

@media screen {
  body { background: #eee6d9; }
  body::before { content: none; }
  header { background: #f9f4ea; border-bottom: 3px solid #286453; box-shadow: none; }
  .board > section { background: #f5efe4; box-shadow: none; }
  .board h2 { border-bottom: 2px solid #b7c9b5; padding-bottom: .55rem; }
  .board article { background: #fffbf3; border: 1px solid #ded4c4; border-radius: .6rem; margin-top: .6rem; padding: .75rem; }
  .board article:target { background: #eef4e9; }
  .options { box-shadow: none; }
  .print-help { align-items: center; justify-content: space-between; }
  .print-help p { margin: .15rem 0 0; }
}

@media screen {
  body { background: #19352e; }
  body::before { content: none; }
}

.back-to-board {
  display: inline-block;
  padding: .65rem 1rem;
  border-radius: .5rem;
  background: #fff7e9;
  color: #19352e;
  text-decoration: none;
}
.back-to-board:hover { background: #e4eddb; text-decoration: underline; }

.board-filters { display: flex; flex-wrap: wrap; align-items: end; gap: .85rem; }
.mine-check { display: flex; align-items: center; gap: .4rem; padding: .5rem 0; }
.compact-list { overflow-x: auto; }
.compact-list table { width: 100%; border-collapse: collapse; }
.compact-list th, .compact-list td { text-align: left; padding: .5rem; border-bottom: 1px solid #d8cbb7; }
.compact-list tr:target { background: #e4eddb; }
.compact-list td:last-child { min-width: 17rem; }
.print-status { display: none; }
@media print {
  .print-status { display: inline; }
  .compact-list td:last-child { min-width: 0; }
  .compact-list tr { break-inside: avoid; }
}
