.pk-wrap,
.pk-admin-wrap{
  --pk-primary:#8a6b3d;
  --pk-text:#2f281d;
  --pk-muted:#6e6253;
  --pk-border:#e5dccd;
  --pk-bg:#f7f2e8;
  --pk-wood:#efe1c6;
  --pk-wood-dark:#d7be90;
  color:var(--pk-text);
}
.pk-wrap *,.pk-admin-wrap *{box-sizing:border-box;}
.pk-wrap{
  max-width:1100px;
  margin:0 auto;
  font-family:inherit;
}
.pk-card,
.pk-admin-card{
  background:#fffdf9;
  border:1px solid var(--pk-border);
  border-radius:24px;
  padding:24px;
  box-shadow:0 10px 30px rgba(80,57,22,.06);
  margin-bottom:18px;
}
.pk-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  background:linear-gradient(135deg,#fffdf9 0%,#f7efe2 100%);
}
.pk-eyebrow{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--pk-muted);
  font-weight:700;
  margin-bottom:8px;
}
.pk-hero h2,
.pk-admin-card h2{margin:0 0 10px;}
.pk-hero p,
.pk-admin-card p,
.pk-status{color:var(--pk-muted);line-height:1.6;}
.pk-dice-preview{
  width:92px;
  height:92px;
  border-radius:24px;
  background:linear-gradient(180deg,var(--pk-wood) 0%,#e8d3ae 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:42px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 12px 24px rgba(0,0,0,.08);
}
.pk-label{
  display:block;
  font-weight:700;
  margin:12px 0 8px;
}
.pk-input{
  width:100%;
  padding:13px 14px;
  border:1px solid var(--pk-border);
  border-radius:14px;
  font:inherit;
  background:#fff;
}
.pk-button{
  appearance:none;
  border:0;
  border-radius:14px;
  padding:13px 18px;
  background:var(--pk-primary);
  color:#fff;
  font:inherit;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(138,107,61,.18);
  transition:transform .15s ease, opacity .15s ease;
}
.pk-button:hover{transform:translateY(-1px);}
.pk-button:disabled{opacity:.65;cursor:not-allowed;transform:none;}
.pk-button-secondary{
  background:#f1e7d7;
  color:#6d4c20;
  box-shadow:none;
}
.pk-actions-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.pk-status{
  margin-top:12px;
  font-weight:600;
}
.pk-cards-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
}
.pk-story-card{
  position:relative;
  padding:14px;
  border-radius:22px;
  background:linear-gradient(180deg,#f4e3c2 0%, #e5c995 100%);
  border:1px solid #d8bb84;
  box-shadow:0 10px 20px rgba(95,66,25,.08);
  min-height:255px;
}
.pk-story-card.is-placeholder{
  background:linear-gradient(180deg,#f7f2e8 0%,#eee6d5 100%);
  border-color:#e4d7bf;
}
.pk-story-card__die{
  aspect-ratio:1/1;
  border-radius:18px;
  background:rgba(255,255,255,.45);
  border:1px solid rgba(122,89,39,.15);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-bottom:12px;
}
.pk-story-card__image{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:14px;
  display:block;
}
.pk-story-card__image--placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:40px;
  color:#9c8d73;
}
.pk-story-card__cube{
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#6b5d47;
  font-weight:800;
  margin-bottom:6px;
}
.pk-story-card__title{
  font-size:20px;
  line-height:1.25;
  font-weight:800;
  margin-bottom:8px;
}
.pk-story-card__helper{
  color:#5f5648;
  font-size:14px;
  line-height:1.45;
}
.pk-story-card.is-rolling{
  animation:pkRoll .55s ease;
}
@keyframes pkRoll{
  0%{transform:rotate(0deg) scale(1);}
  25%{transform:rotate(8deg) scale(1.03);}
  50%{transform:rotate(-8deg) scale(1.06);}
  75%{transform:rotate(4deg) scale(1.03);}
  100%{transform:rotate(0deg) scale(1);}
}
.pk-story-prompt{
  margin-top:18px;
  padding:14px 16px;
  border-radius:16px;
  background:#f6efe4;
  color:#5a4d3b;
}
.pk-notes-box{
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid var(--pk-border);
}
.pk-admin-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.pk-admin-grid--forms{
  align-items:start;
}
.pk-face-preview img{
  display:block;
  margin-top:8px;
}
@media (max-width: 980px){
  .pk-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pk-admin-grid{grid-template-columns:1fr;}
}
@media (max-width: 640px){
  .pk-hero{flex-direction:column;align-items:flex-start;}
  .pk-cards-grid{grid-template-columns:1fr;}
}