.wish-flow{
  position:relative;
  margin-top:24px;
  color:var(--ink);
}

.wish-intro,
.wish-compose,
.wish-personal,
.wish-family{
  position:relative;
  padding:22px 20px;
  overflow:hidden;
  border:2px solid var(--pixel-shadow);
  border-top-color:#d7b978;
  border-left-color:#d7b978;
  background:
    linear-gradient(155deg,rgba(255,248,223,.98),rgba(239,215,158,.96)),
    var(--surface);
  box-shadow:var(--shadow),inset 1px 1px 0 var(--pixel-hi);
}

.wish-intro::after,
.wish-personal::after{
  position:absolute;
  right:-42px;
  bottom:-48px;
  width:150px;
  height:150px;
  content:"";
  opacity:.1;
  background:url('/chuseok/pixel-full-moon.png?v=260729b') center/contain no-repeat;
  pointer-events:none;
}

.wish-kicker{
  margin:0 0 7px;
  color:#963b2f;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.wish-intro h2,
.wish-compose h3,
.wish-personal h3,
.wish-family h3{
  position:relative;
  z-index:1;
  margin:0;
  letter-spacing:-.04em;
}

.wish-intro h2{
  max-width:300px;
  font-size:27px;
  line-height:1.22;
}

.wish-intro>p:not(.wish-kicker){
  position:relative;
  z-index:1;
  max-width:330px;
  margin:13px 0 18px;
  color:var(--muted);
  font-size:13px;
  line-height:1.68;
}

.wish-primary,
.wish-secondary,
.wish-room-share button{
  position:relative;
  z-index:1;
  width:100%;
  min-height:50px;
  padding:0 16px;
  border:2px outset #eedca9;
  border-radius:0;
  font:inherit;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
  box-shadow:2px 2px 0 rgba(74,42,27,.25);
}

.wish-primary{
  color:#fff6dc;
  background:var(--pixel-red);
  border-color:#c56d52 #57241c #57241c #c56d52;
  text-shadow:1px 1px 0 #57241c;
}

.wish-secondary{
  margin-top:9px;
  color:#4d3324;
  background:#ead39a;
}

.wish-secondary span{
  display:inline-block;
  margin-left:6px;
  padding:2px 6px;
  color:#74552d;
  background:#f9edca;
  border:1px solid #b89a61;
  font-size:10px;
}

.wish-primary:active,
.wish-secondary:active,
.wish-room-share button:active{
  transform:translate(1px,1px);
  border-style:inset;
  box-shadow:none;
}

.wish-compose-head,
.wish-board-title,
.wish-family-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}

.wish-compose h3,
.wish-personal h3,
.wish-family h3{
  font-size:20px;
  line-height:1.3;
}

.wish-text-button{
  flex:0 0 auto;
  min-height:34px;
  padding:0 4px;
  border:0;
  border-bottom:1px solid #8a6b4d;
  color:var(--muted);
  background:transparent;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.wish-compose fieldset{
  margin:0 0 17px;
  padding:0;
  border:0;
}

.wish-compose legend,
.wish-label{
  display:block;
  margin-bottom:9px;
  color:#60432f;
  font-size:12px;
  font-weight:850;
}

.wish-categories{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.wish-categories button{
  min-height:40px;
  padding:0 5px;
  border:1px solid #b99b62;
  color:#745f4a;
  background:#fff4d5;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.wish-categories button.is-selected{
  color:#fff7df;
  background:#73513c;
  border-color:#4b2a1e;
}

#wishText{
  display:block;
  width:100%;
  min-height:112px;
  resize:vertical;
  padding:13px 14px;
  border:2px inset #d8bd80;
  border-radius:0;
  outline:0;
  color:var(--ink);
  background:#fff7df;
  font:inherit;
  font-size:14px;
  line-height:1.65;
}

#wishText:focus{
  outline:2px solid #963b2f;
  outline-offset:0;
}

.wish-count{
  margin:5px 1px 10px;
  text-align:right;
  color:var(--muted);
  font-size:10px;
}

.wish-error,
.wish-status{
  min-height:18px;
  margin:0 0 8px;
  color:#963b2f;
  font-size:11px;
  font-weight:750;
  line-height:1.5;
}

.wish-status{
  margin:8px 2px 0;
  text-align:center;
}

.wish-privacy,
.wish-family-copy,
.wish-save-state{
  color:var(--muted);
  font-size:10.5px;
  line-height:1.58;
}

.wish-privacy{
  margin:11px 0 0;
  text-align:center;
}

.wish-invite-strip{
  margin:-4px 0 17px;
  padding:10px 11px;
  border-left:4px solid #963b2f;
  color:#654633;
  background:#f7e7ba;
  font-size:11px;
  font-weight:750;
  line-height:1.5;
}

.wish-moon-stage{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height:146px;
  margin:-22px -20px 19px;
  padding:15px 20px 17px;
  background-color:#efe0b9;
  background-image:radial-gradient(rgba(107,67,46,.18) .65px,transparent .8px);
  background-size:5px 5px;
}

.wish-moon-stage img{
  width:104px;
  height:104px;
  object-fit:contain;
  filter:drop-shadow(0 9px 14px rgba(111,72,28,.22));
}

.wish-moon-stage span{
  margin-top:-6px;
  padding:4px 9px;
  color:#fff4d0;
  background:#6a4430;
  border:1px solid #44271b;
  font-size:10px;
  font-weight:850;
}

.wish-note{
  position:relative;
  z-index:1;
  margin:0 0 12px;
  padding:17px 16px 15px;
  border:1px solid #bda06a;
  color:#453022;
  background:#fff6dc;
  box-shadow:3px 3px 0 rgba(92,54,34,.14);
}

.wish-note::before{
  position:absolute;
  top:0;
  right:14px;
  width:30px;
  height:7px;
  content:"";
  background:#d2aa51;
}

.wish-note-category{
  color:#963b2f;
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
}

.wish-note p{
  margin:8px 0 12px;
  font-size:14px;
  font-weight:750;
  line-height:1.62;
  word-break:keep-all;
}

.wish-note small{
  color:var(--muted);
  font-size:10px;
}

.wish-save-state{
  margin:0 0 14px;
}

.wish-family-copy{
  margin:-5px 0 16px;
}

.wish-family-actions{
  display:grid;
  gap:0;
}

.wish-room-share{
  display:grid;
  grid-template-columns:minmax(0,1fr) 128px;
  gap:9px;
  margin-bottom:16px;
}

.wish-room-share>div{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:52px;
  padding:7px 11px;
  border:1px solid #b99b62;
  background:#fff4d5;
}

.wish-room-share span{
  color:var(--muted);
  font-size:9px;
  font-weight:750;
}

.wish-room-share strong{
  margin-top:2px;
  color:#5d3b28;
  font-size:17px;
  letter-spacing:.1em;
}

.wish-room-share button{
  min-height:52px;
  padding:0 8px;
  color:#fff6dc;
  background:#73513c;
  border-color:#9c6c4d #42251a #42251a #9c6c4d;
  font-size:11px;
}

.wish-room-board{
  display:grid;
  gap:10px;
}

.wish-room-board .wish-note{
  margin:0;
}

@media (max-width:360px){
  .wish-intro,
  .wish-compose,
  .wish-personal,
  .wish-family{padding:19px 16px}
  .wish-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wish-room-share{grid-template-columns:1fr}
  .wish-room-share button{min-height:46px}
}

@media (prefers-reduced-motion:reduce){
  .wish-flow *{scroll-behavior:auto!important}
}