:root{
  --k-sun:#E3BC28;
  --k-ink:#161616;
  --k-paper:#ffffff;
  --k-mute:#f0eee8;
  --k-soft:#6a675c;
}
html,body{height:100%;margin:0;padding:0}
*,*::before,*::after{box-sizing:border-box}
body[data-view="k"]{
  font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  min-height:100%;
  -webkit-text-size-adjust:100%;
}
.k-wash{
  position:fixed;
  top:0;right:0;bottom:0;left:0;
  background:var(--k-sun);
}
.k-hold{
  position:fixed;
  top:0;right:0;bottom:0;left:0;
  z-index:3;
  display:flex;
  place-content:center;
  place-items:center;
  padding:1.75rem 1.1rem;
}
.k-tile{
  width:min(100%,22.5rem);
  background:var(--k-paper);
  color:var(--k-ink);
  border-radius:1.35rem;
  padding:2rem 1.35rem 1.15rem;
  box-shadow:0 18px 44px rgba(40,30,0,.18);
  text-align:center;
}
.k-seal{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:4.1rem;
  height:4.1rem;
  margin:0 0 1rem;
  border-radius:50%;
  background:var(--k-sun);
  color:var(--k-ink);
  font-weight:800;
  font-size:1.15rem;
  letter-spacing:-.04em;
  box-shadow:inset 0 0 0 4px #fff, 0 0 0 2px var(--k-sun);
}
.k-q{
  margin:0;
  font-size:1.42rem;
  line-height:1.22;
  font-weight:800;
  letter-spacing:-.035em;
}
.k-hint{
  margin:.7rem 0 0;
  font-size:.92rem;
  line-height:1.4;
  font-weight:600;
  color:var(--k-soft);
}
.k-btns{
  display:grid;
  grid-template-columns:1fr 1.28fr;
  gap:.7rem;
  margin-top:1.55rem;
}
.k-dim,.k-go{
  outline:0;
  border:0;
  border-radius:999px;
  padding:.95rem .7rem;
  min-height:3.15rem;
  font:inherit;
  font-weight:800;
  font-size:.92rem;
  cursor:pointer;
  color:var(--k-ink);
  -webkit-text-fill-color:var(--k-ink);
}
.k-dim{background:var(--k-mute)}
.k-go{background:var(--k-sun)}
.k-go:disabled{opacity:.68;cursor:wait}
.k-dim:active,.k-go:active{transform:scale(.97)}
.k-msg{
  margin:.75rem 0 0;
  font-size:.78rem;
  font-weight:700;
  color:#b42318;
}
@media (max-width:360px){
  .k-btns{grid-template-columns:1fr}
  .k-q{font-size:1.28rem}
}
