/* Small-screen controls keep the diary's typefaces and bitmap icons. */
@media (max-width:760px) {
 body[data-page=write] #write-form.mobile-write-simple > .restore-field {
  margin:12px 0;
 }
 body[data-page=write] #write-form.mobile-write-simple > .restore-field > label {
  margin:0 0 6px;
  color:#465a67;
  font:12px/18px var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple > .restore-field > input,
 body[data-page=write] #write-form.mobile-write-simple > .restore-field > select,
 body[data-page=write] #write-form.mobile-write-simple > .restore-field > div > select {
  box-sizing:border-box;
  min-height:44px;
  min-width:0;
  padding:8px;
  border:1px solid #c4d4de;
  border-radius:8px;
  background:#fff;
  color:#333;
  font:16px/1.4 var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple #entry-title {
  min-height:44px;
  border-color:#c4d4de;
  border-radius:8px;
 }
 body[data-page=write] #write-form.mobile-write-simple #entry-body {
  border-color:#c4d4de;
  border-radius:8px;
 }
 body[data-page=write] #write-form.mobile-write-simple > .mobile-write-date {
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:46px;
  margin:0 0 14px;
  padding:0 8px;
  border:1px solid #d0dfe7;
  border-radius:8px;
  background:#f5fafc;
 }
 body[data-page=write] #write-form.mobile-write-simple > .mobile-write-date > label {
  width:auto;
  margin:0;
  padding:0;
  color:#465a67;
  font:12px/18px var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple > .mobile-write-date > input {
  width:100%;
  min-width:0;
  min-height:44px;
  max-width:100%;
  margin:0;
  padding:6px 0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#333;
  font:16px/1.4 var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options {
  border-color:#cbdce5;
  border-radius:8px;
 }
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options-summary {
  min-height:44px;
  padding:12px 10px;
  border-radius:7px;
  background:#f1f8fb;
  color:#294e63;
  font:12px/18px var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options[open] > .mobile-write-options-summary {
  border-bottom-color:#d8e5eb;
  border-radius:7px 7px 0 0;
 }
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options-value {
  max-width:65%;
  overflow:hidden;
  color:#526875;
  font:11px/18px var(--nuda-small,"돋움",Dotum,sans-serif);
  text-overflow:ellipsis;
 }
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options .restore-field > input,
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options .restore-field > select,
 body[data-page=write] #write-form.mobile-write-simple .mobile-write-options .restore-field > div > select {
  box-sizing:border-box;
  min-width:0;
  min-height:44px;
  padding:8px;
  border:1px solid #c4d4de;
  border-radius:6px;
  background:#fff;
  color:#333;
  font:16px/1.4 var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple #image-drop-area {
  border-color:#d0dfe7;
  border-radius:8px;
  background:#f8fcfd;
 }
 body .community-toolbar,
 body .admin-toolbar {
  gap:6px;
  align-items:center;
 }
 body .community-toolbar > label,
 body .admin-toolbar > label {
  color:#465a67;
  font:12px/18px var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body .community-toolbar > input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
 body .community-toolbar > select,
 body .admin-toolbar > input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
 body .admin-toolbar > select {
  box-sizing:border-box;
  min-width:0;
  min-height:44px;
  max-width:100%;
  padding:8px;
  border:1px solid #c4d4de;
  border-radius:7px;
  background:#fff;
  color:#333;
  font:16px/1.4 var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body .community-toolbar > button,
 body .community-toolbar > a.restore-button,
 body .admin-toolbar > button,
 body .admin-toolbar > a.restore-button,
 body .restore-actions > button,
 body .restore-actions > a.restore-button,
 body .admin-actions > button,
 body .admin-actions > a.restore-button {
  box-sizing:border-box;
  min-height:44px;
  padding:9px 12px;
  border:1px solid #c5d6df;
  border-radius:7px;
  background:#f6fafc;
  color:#294e63;
  font:12px/18px var(--nuda-small,"돋움",Dotum,sans-serif);
 }
 body[data-page=write] #write-form.mobile-write-simple > .restore-actions > button[type=submit] {
  min-height:44px;
  border-color:#a9c9d9;
  border-radius:8px;
  background:#e7f3f9;
  color:#174f6b;
 }
 body[data-page=write] #write-form.mobile-write-simple > .restore-actions > a {
  border-radius:8px;
 }
 body .archive-diary-tabs {
  display:flex;
  float:none;
  flex-wrap:nowrap;
  justify-content:stretch;
  gap:4px;
  margin:0 0 12px;
  padding:4px;
  border:1px solid #d1dfe7;
  border-radius:8px;
  background:#f4f9fc;
 }
 body .archive-diary-tabs .btn {
  display:block;
  float:none;
  flex:1 1 0;
  min-width:0;
  height:auto;
  margin:0;
  padding:0;
  overflow:visible;
  cursor:inherit;
 }
 body .archive-diary-tabs .btn > span { display:none; }
 body .archive-diary-tabs .btn > p {
  display:block;
  float:none;
  height:auto;
  margin:0;
  padding:0;
  background:none;
 }
 body .archive-diary-tabs .btn > p > a {
  display:flex;
  float:none;
  align-items:center;
  justify-content:center;
  gap:4px;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  min-height:44px;
  margin:0;
  padding:10px 6px;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  color:#3d596a;
  text-decoration:none;
  letter-spacing:normal;
  font:12px/20px var(--nuda-small,"돋움",Dotum,sans-serif);
 }
 body .archive-diary-tabs .btn > p > a[aria-current=page] {
  border-color:#bdd6e3;
  background:#fff;
  color:#174f6b;
  font-weight:normal;
  text-decoration:none;
 }
 body .archive-diary-tabs .btn > p > a > img { margin:0; }
 body .archive-account-tabs {
  gap:5px;
  margin-bottom:12px;
  padding-bottom:8px;
  border-bottom-color:#d7e4eb;
 }
 body .archive-account-tabs > a {
  flex:1 1 auto;
  min-height:44px;
  padding:10px 8px;
  border:1px solid #d0dfe7;
  border-radius:7px;
  background:#f6fafc;
  color:#3d596a;
  font:12px/20px var(--nuda-small,"돋움",Dotum,sans-serif);
 }
 body .archive-account-tabs > a[aria-current=page] {
  border-color:#a9c9d9;
  background:#e7f3f9;
  color:#174f6b;
  font-weight:normal;
 }
 /* These wrappers contain literal separator dots. Inline links keep those
    text nodes from becoming stray flex items. */
 body .community-board-nav,
 body .settings-links {
  display:block;
  padding:3px 0 7px;
  font-size:0;
  line-height:0;
 }
 body .community-board-nav > a,
 body .settings-links > a {
  display:inline-flex;
  box-sizing:border-box;
  align-items:center;
  justify-content:center;
  min-height:44px;
  max-width:100%;
  margin:0 5px 6px 0;
  padding:10px 11px;
  border:1px solid #d0dfe7;
  border-radius:7px;
  background:#f6fafc;
  color:#3d596a;
  text-align:center;
  text-decoration:none;
  vertical-align:top;
  overflow-wrap:anywhere;
  font:12px/20px var(--nuda-small,"돋움",Dotum,sans-serif);
 }
 body .community-board-nav > a[aria-current=page],
 body .settings-links > a[aria-current=page] {
  border-color:#a9c9d9;
  background:#e7f3f9;
  color:#174f6b;
  font-weight:normal;
 }
 /* The old shelf ID rules outrank the shared class styles above. Keep its
    separator text out of flex layout and restore the same link padding. */
 body[data-page=mydiary] #diary-shelf {
  display:block;
  min-width:0;
  gap:0;
  font-size:0;
  line-height:0;
 }
 body[data-page=mydiary] #diary-shelf > a {
  padding:10px 11px;
  white-space:normal;
  line-height:20px;
 }
 body .archive-diary-shelf > caption,
 body .archive-subscription-list > caption,
 body .archive-compose-table > caption {
  display:block;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
 }
 body[data-page=index] .archive-memo-input > input,
 body[data-page=index] .archive-memo-input > button {
  box-sizing:border-box;
  height:44px;
  min-height:44px;
 }
 body[data-page=index] .archive-memo-input > input {
  min-width:0;
  font:16px/1.4 var(--nuda-font,"굴림",Gulim,sans-serif);
 }
 body[data-page=messages] .archive-message-list .message-delete { width:56px; }
 body[data-page=messages] .archive-message-list .message-delete > button {
  box-sizing:border-box;
  width:44px;
  min-width:44px;
  min-height:44px;
  padding:2px 4px;
  white-space:nowrap;
 }
 body .admin-tabs {
  flex-wrap:nowrap;
  gap:5px;
  max-width:100%;
  padding:4px 0 9px;
  border-bottom-color:#d7e4eb;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
 }
 body .admin-tabs > a {
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  min-height:44px;
  padding:10px;
  border:1px solid #d0dfe7;
  border-radius:7px;
  background:#f6fafc;
  color:#3d596a;
  white-space:nowrap;
  font:12px/20px var(--nuda-small,"돋움",Dotum,sans-serif);
 }
 body .admin-tabs > a[aria-current=page],
 body .admin-tabs > a.active {
  border-color:#a9c9d9;
  background:#e7f3f9;
  color:#174f6b;
  font-weight:normal;
 }
 body[data-page=write] #write-form.mobile-write-simple :is(input,select,textarea,summary):focus-visible,
 body .community-toolbar > :is(input,select,button,a):focus-visible,
 body .admin-toolbar > :is(input,select,button,a):focus-visible,
 body .restore-actions > :is(button,a):focus-visible,
 body .admin-actions > :is(button,a):focus-visible,
 body .archive-diary-tabs .btn > p > a:focus-visible,
 body .archive-account-tabs > a:focus-visible,
 body .community-board-nav > a:focus-visible,
 body .settings-links > a:focus-visible,
 body .admin-tabs > a:focus-visible {
  outline:2px solid #2d6d8b;
  outline-offset:2px;
 }
 @media (forced-colors:active) {
  body .archive-diary-tabs .btn > p > a[aria-current=page],
  body .archive-account-tabs > a[aria-current=page],
  body .community-board-nav > a[aria-current=page],
  body .settings-links > a[aria-current=page],
  body .admin-tabs > a[aria-current=page],
  body .admin-tabs > a.active {
   border-color:Highlight;
   color:LinkText;
   text-decoration:underline;
  }
 }
}