/* Das Monatsbrett — Papyrus-Thema v2.
   Diese Datei wird NUR von play.html geladen und darf daher globale
   Grundfarben der Seite überschreiben. */

html, body{
  background:#f1e6cf !important;
  background-image:
    radial-gradient(1100px 600px at 50% -12%, #fbf5e3, rgba(251,245,227,0) 70%),
    repeating-linear-gradient(90deg, rgba(160,130,70,.035) 0 2px, rgba(0,0,0,0) 2px 26px),
    repeating-linear-gradient(0deg, rgba(160,130,70,.03) 0 2px, rgba(0,0,0,0) 2px 22px) !important;
  color:#2b2317 !important;
}
.board-container{max-width:720px}
.board-loading{opacity:.7;font-style:italic}

/* Kopf/Fuß */
.site-header .brand strong{
  color:#8a6420;letter-spacing:.1em;
  font-family:'Cinzel Decorative', Georgia, serif;font-size:20px}
.site-header .tagline,.site-footer,.site-footer a{color:#6b5c40}
.site-footer a{text-decoration-color:rgba(138,100,32,.5)}

/* Karten */
.board-container .card{
  background:#fffaf0;border:1px solid #dcca9e;border-radius:16px;
  box-shadow:0 2px 12px rgba(90,70,30,.09), inset 0 0 0 3px rgba(220,202,158,.25);
  color:#2b2317;padding:20px;margin-bottom:16px;
}
.card-step{margin:0 0 10px;font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;color:#a9782c;font-weight:700}
.card-step .step-sub{display:block;text-transform:none;letter-spacing:0;
  font-size:15px;color:#5a4c33;margin-top:6px;font-weight:400;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:17px;font-style:italic}

/* Tageslage */
.tageslage-card{position:relative;overflow:hidden}
.hero-wheel{position:absolute;right:-46px;top:-46px;width:190px;height:190px;
  opacity:.16;pointer-events:none;animation:wheelspin 240s linear infinite}
@keyframes wheelspin{to{transform:rotate(360deg)}}
.tageslage-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:8px}
.tageslage-head h2{margin:0;font-size:30px;color:#2b2317;
  font-family:'Cinzel Decorative',Georgia,serif;line-height:1.15}
.tageslage-sub{color:#6b5c40;font-size:14.5px}
.tageslage-field{margin-top:8px;line-height:1.6;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:19px}
.tageslage-field b{color:#8a6420;font-weight:600}

/* „Was bedeutet das?" — Sprunglink in der Tageslage, Karte am Seitenende */
.explain-jump{margin:12px 0 0;border-top:1px dashed #dcca9e;padding-top:10px;font-size:14px}
.explain-jump a{color:#8a6420;font-weight:700;text-decoration-color:rgba(138,100,32,.5)}
#explaincard{scroll-margin-top:16px}
.explain-heading{margin:0 0 6px;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:24px;color:#2b2317}
.explain-intro{margin:0 0 4px;font-size:14.5px;color:#6b5c40;line-height:1.55}
.explain-block{margin:12px 0 0;padding:12px 14px;background:#faf3e0;
  border:1px solid #e6d8b4;border-radius:10px}
.explain-block h3{margin:0 0 6px;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:18px;color:#5a4520}
.explain-block p{margin:0 0 6px;line-height:1.55;font-size:14.5px}
.explain-block b{color:#8a6420}
.explain-bg{color:#6b5c40}
.explain-link{font-size:13.5px;color:#8a6420;text-decoration-color:rgba(138,100,32,.5)}

/* Hilfe */
.board-help summary{cursor:pointer;font-weight:700;color:#8a6420}
.help-actions{margin:14px 0 0;padding-top:10px;border-top:1px dashed #dcca9e}

/* Bereichs-Erklärung bei der Zugwahl */
.stone-help{margin-top:12px;border-top:1px dashed #dcca9e;padding-top:8px}
.stone-help summary{cursor:pointer;font-size:13.5px;color:#8a6420;font-weight:600}
.stone-help p{margin:8px 0 0;font-size:14px;line-height:1.5;color:#4a3d26}
.board-help ol{margin:10px 0 0;padding-left:20px;line-height:1.6}
.board-help li{margin-bottom:8px}
.board-help b{color:#5a4520}

/* ---------------- Brett ---------------- */
.board-card{padding:16px}
#board-wrap svg{width:100%;height:auto;display:block}
.board-path{fill:none;stroke:#c9b077;stroke-width:3;stroke-dasharray:2 9;
  stroke-linecap:round;opacity:.8}
.cell{fill:#fbf4de;stroke:#cdb476;stroke-width:1.2}
.cell-past{fill:#efe2bd;stroke:#c2a869}
.cell-today{fill:#f6dfa4;stroke:#a9782c;stroke-width:2.5;
  animation:todayglow 2.6s ease-in-out infinite}
@keyframes todayglow{
  0%,100%{filter:drop-shadow(0 0 2px rgba(169,120,44,.35))}
  50%{filter:drop-shadow(0 0 9px rgba(169,120,44,.75))}}
.cell-num{fill:#a2915f;font-size:11px}
.cell-glyph{fill:#8a6420;font-size:19px;font-weight:700}
.stone{stroke:rgba(60,40,10,.5);stroke-width:1.2;cursor:default}
.stone-label{fill:#fffaf0;font-size:15px;font-weight:700;pointer-events:none}
.stone-legal{cursor:pointer;animation:stonepulse 1.6s ease-in-out infinite}
@keyframes stonepulse{
  0%,100%{filter:drop-shadow(0 0 2px rgba(169,120,44,.5))}
  50%{filter:drop-shadow(0 0 8px rgba(169,120,44,.95))}}

/* Steindock unter dem Brett */
#stone-dock{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.dock-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dock-title{font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:#a2915f;min-width:110px}
.dock-chip{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;
  color:#4a3d26;background:#f7edd3;border:1px solid #dcca9e;border-radius:999px;
  padding:4px 12px 4px 5px}
.dock-chip .orb{display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;color:#fffaf0;font-size:13px;
  border:1px solid rgba(60,40,10,.35)}
.dock-chip.legal{cursor:pointer;box-shadow:0 0 0 2px rgba(169,120,44,.35)}

/* ---------------- Wurf-Ritual ---------------- */
.throw-intro{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.sticks-row{display:flex;align-items:center;gap:14px;margin:10px 0 4px}
.stick{width:14px;height:64px;border-radius:8px;background:#8a6420;
  border:1px solid #5a4520;box-shadow:inset 0 0 4px rgba(0,0,0,.25)}
.stick.light{background:#f3e2b6;border-color:#c2a869;
  box-shadow:inset 0 0 3px rgba(255,255,255,.6)}
.sticks-row.tossing .stick{animation:sticktoss .95s cubic-bezier(.3,.7,.4,1) both}
.sticks-row .stick:nth-child(1){animation-delay:0s}
.sticks-row .stick:nth-child(2){animation-delay:.08s}
.sticks-row .stick:nth-child(3){animation-delay:.16s}
.sticks-row .stick:nth-child(4){animation-delay:.24s}
@keyframes sticktoss{
  0%{transform:translateY(0) rotate(0)}
  35%{transform:translateY(-26px) rotate(200deg)}
  70%{transform:translateY(2px) rotate(340deg)}
  100%{transform:translateY(0) rotate(360deg)}}
.throw-result{font-family:'Cinzel Decorative',Georgia,serif;font-size:26px;
  color:#8a6420;margin-left:6px;min-width:34px}
.throw-label{font-size:16px;line-height:1.55}
.stone-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.stone-btn{border:2px solid #cdb476;background:#fffdf7;color:#2b2317;
  border-radius:12px;padding:10px 16px;font-size:15px;font-weight:600;cursor:pointer;
  transition:transform .06s ease, box-shadow .12s ease}
.stone-btn:not(:disabled):hover{transform:translateY(-1px);
  box-shadow:0 3px 8px rgba(90,70,30,.18)}
.stone-btn:disabled{opacity:.4;cursor:not-allowed}
.stone-btn .glyph{margin-right:6px}
.stone-btn .target{display:block;font-size:12px;font-weight:400;color:#6b5c40;margin-top:2px}
.btn-primary{background:#a9782c;color:#fffaf0;border:none;border-radius:12px;
  padding:13px 22px;font-size:16px;font-weight:700;cursor:pointer;margin-top:12px;
  box-shadow:0 2px 8px rgba(90,70,30,.25)}
.btn-primary:hover{background:#93671f}
.btn-ghost{background:transparent;border:1px solid #cdb476;color:#5a4c33;
  border-radius:10px;padding:10px 14px;font-size:14px;cursor:pointer}
.action-hint{font-size:13.5px;color:#6b5c40;line-height:1.55;margin-top:10px}

/* Orakelfrage (Vorahnung & Gespür) */
.guess-row{display:flex;gap:10px;flex-wrap:wrap}
.guess-btn{min-width:130px;text-align:center}
.guess-verdict{margin:6px 0 0;font-size:15.5px;line-height:1.5;color:#5a4c33}
.guess-verdict.hit{color:#8a6420;font-weight:600}

/* Ereignistage */
.event-banner{margin:0 0 10px;padding:10px 14px;border-radius:12px;
  background:linear-gradient(100deg,#fdf3d8,#f8e7c0);border:1px solid #d9b86a;
  font-size:15px;line-height:1.5;color:#4a3d26;
  box-shadow:0 1px 6px rgba(169,120,44,.18)}
.event-banner b{color:#8a6420}
.throw-switch{font-weight:600}
.throw-switch.active{border-color:#a9782c;color:#8a6420;background:#f8efd8;
  box-shadow:0 0 0 2px rgba(169,120,44,.25)}

/* Deine Menschen */
.people-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.person-chip{border:1px solid #dcca9e;font-family:inherit;cursor:pointer}
.person-chip.active{box-shadow:0 0 0 2px rgba(169,120,44,.4);background:#f8efd8}
.person-remove{margin-left:4px;color:#a2915f;font-weight:700;padding:0 3px}
.person-remove:hover{color:#8a3020}
.person-heading{margin:14px 0 4px;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:20px;color:#2b2317}
.resonanz-row input[type=text]{padding:11px;border-radius:10px;
  border:1px solid #cdb476;background:#fffdf7;color:#2b2317;font-size:15px;max-width:180px}

/* Partner-Resonanz */
.resonanz-summary{cursor:pointer;font-weight:700;color:#8a6420;font-size:16px}
.resonanz-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:10px}
.resonanz-row input{padding:11px;border-radius:10px;border:1px solid #cdb476;
  background:#fffdf7;color:#2b2317;font-size:16px}
.resonanz-btn{margin-top:0;padding:11px 18px}
.resonanz-out{margin-top:6px}
.resonanz-out .reading-chips{margin-top:10px}
.resonanz-text{margin:10px 0 0;line-height:1.65;font-size:16px}

/* Sternzwillinge */
.startwins-line{margin:12px 0 0;padding-top:10px;border-top:1px dashed #dcca9e;
  font-size:14.5px;line-height:1.55;color:#5a4c33}
.startwins-line b{color:#8a6420;font-weight:600}

/* Feld-Album */
#album{margin-top:14px;border-top:1px dashed #dcca9e;padding-top:10px}
.album summary{cursor:pointer;font-weight:700;color:#8a6420;font-size:14.5px}
.album-hint{margin:10px 0 0;font-size:13.5px;color:#6b5c40;line-height:1.5}
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));
  gap:8px;margin-top:12px}
.album-tile{border:1px solid #e0d2a8;border-radius:10px;background:#f7eed7;
  padding:8px 9px;display:flex;flex-direction:column;gap:3px;min-height:52px;
  opacity:.55}
.album-tile.found{background:#fdf6e0;border-color:#c9a75a;opacity:1;
  box-shadow:inset 0 0 0 1px rgba(201,167,90,.35)}
.album-num{font-size:11.5px;letter-spacing:.05em;color:#a2915f}
.album-tile.found .album-num{color:#a9782c;font-weight:700}
.album-name{font-size:12.5px;line-height:1.3;color:#8b7c5c}
.album-tile.found .album-name{color:#4a3d26;font-weight:600;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:14px}

/* Onboarding */
.onboard-grid{display:grid;gap:12px;grid-template-columns:1fr;margin-top:10px}
.onboard-grid label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:#5a4c33}
.onboard-grid input{padding:11px;border-radius:10px;border:1px solid #cdb476;
  background:#fffdf7;color:#2b2317;font-size:16px}
.onboard-hint{font-size:13.5px;color:#6b5c40;line-height:1.55}
#action h3{font-family:'Cormorant Garamond',Georgia,serif;font-size:22px;margin:4px 0 6px}

/* Kapitel */
.chapters-heading{margin:24px 0 10px;font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;color:#a9782c;font-weight:700}
.chapter{margin-bottom:12px}
.chapter-day{font-size:12.5px;letter-spacing:.06em;color:#a2915f;margin-bottom:5px;
  text-transform:uppercase}
.chapter-title{display:flex;align-items:center;gap:9px;font-weight:700;margin-bottom:6px;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:20px}
.chapter-title .orb{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;color:#fffaf0;font-size:14px;flex:none;
  border:1px solid rgba(60,40,10,.35)}
.chapter-text{line-height:1.65;font-size:16px}
.impuls{margin-top:10px;padding:8px 12px;border-left:3px solid #a9782c;
  background:#faf3e0;border-radius:0 8px 8px 0;font-size:16px;line-height:1.5;
  color:#4a3d26;font-weight:600}
.impuls-hero{margin:14px 0 4px;padding:14px 16px;border-radius:12px;
  background:linear-gradient(100deg,#fdf3d8,#f6e8c4);border:1px solid #d9b86a;
  box-shadow:0 1px 8px rgba(169,120,44,.15)}
.impuls-label{display:block;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:#a9782c;font-weight:700;margin-bottom:5px}
.impuls-hero p{margin:0;font-family:'Cormorant Garamond',Georgia,serif;
  font-size:21px;line-height:1.45;color:#2b2317;font-weight:600}
.chapter .reading-chips{margin-top:9px}
.board-container .reading-chip{background:#f5e9cd;border:1px solid #dcca9e;color:#5a4c33}
.share-row{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}

@media(min-width:560px){
  .onboard-grid{grid-template-columns:1fr 1fr}
  .onboard-grid .full{grid-column:1/-1}
}
@media(max-width:480px){
  .tageslage-head h2{font-size:24px}
  .hero-wheel{width:140px;height:140px;right:-40px;top:-40px}
}