.raRules { container-type:inline-size; max-width:1050px; margin:auto; padding:clamp(12px,3vw,32px); color:#392c1c; background:#fffaf0; font:16px/1.6 system-ui,sans-serif; overflow-wrap:anywhere; }
.raRules header {
  position:relative;
  padding:clamp(18px,3vw,28px);
  border-radius:8px;
  background-color:#d6be95;
  background-image:
    radial-gradient(ellipse at 50% 35%, rgba(255,248,230,0.5) 0%, rgba(55,28,8,0.2) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='500' height='250'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.008 0.14' numOctaves='4' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0.35 0 0 0 0.42  0.22 0 0 0 0.28  0.10 0 0 0 0.14  0 0 0 0.35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E"),
    linear-gradient(180deg, #ecd8b5 0%, #dbbf94 50%, #c1a073 100%);
  border:3px solid #754a23;
  outline:1px solid #3d220a;
  box-shadow:
    inset 0 1px 0 rgba(255,248,230,0.7),
    inset 0 0 25px rgba(50,24,6,0.18),
    0 4px 12px rgba(45,25,10,0.22);
}
.raRules header::after {
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid rgba(80,42,14,0.45);
  border-bottom-color:rgba(255,245,225,0.5);
  border-right-color:rgba(255,245,225,0.5);
  border-radius:4px;
  pointer-events:none;
}
.raRules header .raEyebrow {
  letter-spacing:.16em;
  font-size:12px;
  font-weight:700;
  color:#633814;
  text-transform:uppercase;
  text-shadow:0 1px 0 rgba(255,245,230,0.6);
  margin:0 0 6px;
}
.raRules header h1 {
  color:#1e0e03;
  font-family:"Palatino Linotype","Book Antiqua",Georgia,"Times New Roman",serif;
  font-weight:700;
  font-size:clamp(26px,5vw,42px);
  line-height:1.15;
  margin:6px 0 14px;
  letter-spacing:0.5px;
  text-shadow:
    0 1px 0 rgba(255,245,225,0.75),
    0 0 1px rgba(35,14,2,0.85),
    0 0 4px rgba(70,30,8,0.35);
}
.raRules header p:last-child {
  color:#3b220d;
  font-size:15px;
  line-height:1.5;
  margin:0;
  text-shadow:0 1px 0 rgba(255,245,230,0.55);
}
.raRules h2 {
  color:#5c3514;
  font:700 24px/1.2 "Palatino Linotype","Book Antiqua",Georgia,serif;
  margin:0 0 16px;
  padding-bottom:4px;
  border-bottom:2px solid #e1cfb8;
  text-shadow:0 1px 0 rgba(255,248,235,0.7);
}
.raRules h3 { font-size:18px; margin:0 0 8px; color:#5a462a; }
.raRules nav { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.raRules nav a {
  color:#4a280c;
  background:#ecddc5;
  border:1px solid #c9b08f;
  padding:6px 14px;
  border-radius:16px;
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  box-shadow:0 1px 2px rgba(60,30,10,0.1);
  transition:background 0.15s,color 0.15s,border-color 0.15s;
}
.raRules nav a:hover {
  background:#dfc8a7;
  color:#241103;
  border-color:#a88358;
}
.raRules section { margin:30px 0; scroll-margin-top:16px; }
.raRules .raRuleSteps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.raRules article { min-width:0; padding:17px; background:#f2ead7; border:1px solid #e1d4b4; border-radius:9px; }
.raRules p { margin:0 0 12px; text-align:start; }
.raRules article p:last-child { margin:0; }
.raRules .raPrice { color:#725a2e; font-weight:600; }
.raRules table { border-collapse:collapse; width:100%; table-layout:fixed; font-size:14px; }
.raRules th,.raRules td { padding:9px; border-bottom:1px solid #d9cba9; text-align:left; vertical-align:top; }
.raRules th { background:#e5ddc6; }
.raRules tr:nth-child(even) { background:#f5efdf; }
.raRules .raRuleDice { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.raRules .raRuleDice>div { display:flex; align-items:center; gap:10px; }
.raRules img { max-width:100%; height:auto; }
.raRules .raRuleDice img { width:42px; flex:none; }
.raRules .raRuleBoard { margin:20px 0; text-align:center; }
.raRules .raRuleBoard img { width:100%; max-width:850px; display:block; margin:0 auto; border-radius:8px; box-shadow:0 3px 12px rgba(50,35,15,0.18); border:1px solid #d9cba9; }
.raRules .raRuleBoard figcaption { margin-top:8px; text-align:center; font-size:14px; color:#5a462a; font-style:italic; }
@container (max-width:600px) { .raRules .raRuleSteps,.raRules .raRuleDice { grid-template-columns:1fr; } .raRules th,.raRules td { padding:5px; font-size:12px; } .raRules header { padding:16px; } .raRules .raRuleBoard { margin:14px 0; } .raRules .raRuleBoard figcaption { font-size:12px; } }
