@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap");

/* exchange menu */
.nav-group{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.24rem;
}
.nav-parent,
.nav-submenu button{
  appearance:none;
  border:0;
  background:transparent;
  color:#263b8d;
  font-family:var(--mono);
  cursor:pointer;
  padding:0;
  text-align:left;
}
.nav-parent{font-size:.66rem}
.nav-submenu{
  display:flex;
  flex-direction:column;
  gap:.18rem;
  padding-left:.72rem;
}
.nav-submenu button{
  font-size:.50rem;
  opacity:.62;
}
.nav-parent:hover,
.nav-submenu button:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}
.lang-switch{
  display:flex;
  gap:.4rem;
  margin-top:.3rem;
  font-size:.48rem;
}
.lang-switch a{
  opacity:.55;
}
.lang-switch a[aria-current="page"]{
  opacity:1;
  text-decoration:underline;
  text-underline-offset:3px;
}
.archive-callout{
  clear:both;
  margin:2rem 0!important;
  font-family:var(--mono)!important;
  font-size:.5rem!important;
}
.archive-callout a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:4px;
}

/* 30 s invitation */
.postcard-invite,
.postcard-panel{
  position:fixed;
  z-index:90;
  color:#263b8d;
  background:#f8fbff;
  border:1px solid rgba(38,59,141,.32);
  box-shadow:0 18px 50px rgba(8,32,73,.18);
  font-family:var(--mono);
}
.postcard-invite{
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(420px,calc(100vw - 36px));
  padding:22px;
}
.postcard-invite[hidden],
.postcard-panel[hidden]{display:none}
.postcard-invite-title{
  font-family:var(--display-serif);
  font-size:24px;
  margin:0 0 14px;
}
.postcard-invite p{
  font-size:10px;
  line-height:1.55;
  margin:0 0 16px;
}
.postcard-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.postcard-actions button{
  border:1px solid #263b8d;
  background:transparent;
  color:#263b8d;
  font:inherit;
  font-size:9px;
  padding:8px 10px;
  cursor:pointer;
}
.postcard-actions .primary{
  background:#263b8d;
  color:#f8fbff;
}

.postcard-panel{
  right:24px;
  bottom:24px;
  width:min(480px,calc(100vw - 48px));
  max-height:min(680px,calc(100vh - 48px));
  overflow:auto;
}
.postcard-panel-head{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 14px;
  background:#f8fbff;
  border-bottom:1px solid rgba(38,59,141,.18);
}
.postcard-panel-title{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.postcard-close{
  border:0;
  background:transparent;
  color:#263b8d;
  cursor:pointer;
  font-size:16px;
}
.postcard-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-bottom:1px solid rgba(38,59,141,.15);
}
.postcard-tabs button{
  padding:10px;
  border:0;
  background:transparent;
  color:#263b8d;
  font:inherit;
  font-size:9px;
  cursor:pointer;
}
.postcard-tabs button.active{
  background:rgba(38,59,141,.06);
  text-decoration:underline;
  text-underline-offset:3px;
}
.postcard-view{
  padding:16px;
}
.postcard-view textarea{
  width:100%;
  min-height:130px;
  resize:vertical;
  border:1px solid rgba(38,59,141,.28);
  background:#fff;
  color:#263b8d;
  font:inherit;
  font-size:11px;
  line-height:1.45;
  padding:10px;
}
.postcard-compose-foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:8px;
}
.postcard-count{
  font-size:8px;
  opacity:.52;
}
.postcard-send{
  border:1px solid #263b8d;
  background:#263b8d;
  color:#f8fbff;
  font:inherit;
  font-size:9px;
  padding:8px 11px;
  cursor:pointer;
}
.postcard-note,
.postcard-error{
  font-size:9px;
  line-height:1.5;
  margin-bottom:12px;
}
.postcard-error{color:#8a2439}
.thread{
  border-top:1px solid rgba(38,59,141,.16);
  padding:13px 0 16px;
}
.thread:first-child{border-top:0;padding-top:0}
.thread-meta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:8px;
  opacity:.62;
  margin-bottom:9px;
}
.thread-message{
  margin:7px 0;
  padding:8px 9px;
  border:1px solid rgba(38,59,141,.13);
  background:rgba(38,59,141,.025);
  font-size:10px;
  line-height:1.45;
}
.thread-message.mine{
  margin-left:10%;
}
.thread-message.incoming{
  margin-right:10%;
}
.thread-transit{
  font-size:9px;
  line-height:1.45;
  font-style:italic;
  opacity:.75;
}
.thread-reply{
  display:grid;
  grid-template-columns:1fr auto;
  gap:6px;
  margin-top:9px;
}
.thread-reply textarea{
  min-height:54px;
}
.thread-reply button,
.thread-delete{
  border:1px solid rgba(38,59,141,.5);
  background:transparent;
  color:#263b8d;
  font:inherit;
  font-size:8px;
  cursor:pointer;
  padding:6px 8px;
}
.thread-delete{
  margin-top:8px;
  opacity:.7;
}
.postcard-privacy{
  margin-top:12px;
  font-size:8px;
  line-height:1.45;
  opacity:.62;
}
.postcard-privacy a{color:inherit}
@media(max-width:600px){
  .postcard-panel{right:10px;bottom:10px;width:calc(100vw - 20px);max-height:calc(100vh - 20px)}
}

@font-face{
  font-family:"YDMyungjo 520 Pro";
  src:url("YDMyungjo 520 Pro.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}


/* V23 monochrome correspondence */
:root{--ink:#000!important;--paper:#fff!important}
.postcard-invite,.postcard-panel{background:#fff!important;color:#000!important;border-color:#000!important;box-shadow:0 18px 50px rgba(0,0,0,.18)!important}
.postcard-panel-head{background:#fff!important;border-color:#000!important}
.postcard-close,.postcard-tabs button,.postcard-actions button,.postcard-panel a,.thread-reply button,.thread-delete{color:#000!important;border-color:#000!important}
.postcard-tabs{border-color:#000!important}
.postcard-tabs button.active{background:#000!important;color:#fff!important}
.postcard-actions .primary,.postcard-send{background:#000!important;color:#fff!important;border-color:#000!important}
.postcard-view textarea,.thread-message{background:#fff!important;color:#000!important;border-color:#000!important}
.thread,.thread-message{border-color:rgba(0,0,0,.25)!important}
.postcard-error{color:#000!important;text-decoration:underline}


/* V25 Noto Serif KR */
html,body,button,input,select,textarea,main,.archive-shell,.postcard-invite,.postcard-panel{font-family:"Noto Serif KR",serif!important;background-color:#fff;color:#111}

/* V27 explicit tools section in the left navigation */
.nav-parent-link,
.nav-submenu a{
  color:inherit;
  font:inherit;
  text-decoration:none;
}
.nav-submenu a{
  font-size:.72em;
  opacity:.58;
}
.nav-parent-link:hover,
.nav-submenu a:hover,
.nav-parent-link[aria-current="page"]{
  text-decoration:underline;
  text-underline-offset:3px;
}

/* V27 visible development notice */
.postcard-wip{
  margin:0 0 14px;
  padding:7px 9px;
  border:1px dashed currentColor;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:8px;
  line-height:1.35;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.postcard-panel-wip{
  margin:0;
  border-width:0 0 1px;
  border-style:dashed;
  padding:8px 14px;
}