/* Desktop document: reserve the taskbar and centre capitals between rules. */
@media(min-width:1024px){
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text{font-size:var(--monitor-folder-font)!important;--document-avatar-gap:24px}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-avatar{font-size:12rem;margin:0 var(--document-avatar-gap) var(--document-avatar-gap) 0!important;outline:12px solid var(--color-white-100)!important;background-color:var(--color-white-100);position:relative;z-index:1}
  .container[page-name=index] section.monitor .monitor__window--profile > .parts-window{inset:16px 0 auto;margin:0 auto;height:min(var(--document-content-height,var(--document-max-height)),var(--document-max-height))!important;max-height:var(--document-max-height)!important}
  .container[page-name=index] section.monitor .monitor__window--profile .parts-window__container{flex:1 1 auto}
  .container[page-name=index] section.monitor .monitor__window--profile .parts-window__header{align-items:center;padding:12px!important}
  .container[page-name=index] section.monitor .monitor__window--profile .parts-window__header__close{display:flex;align-items:center;justify-content:center;flex:none;width:17px;height:17px;min-width:0;min-height:0;padding:0!important;margin:0!important;transform:none!important}
  .container[page-name=index] section.monitor .monitor__window--profile .parts-window__header__close svg{display:block;width:17px;height:17px}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text{--lh:var(--document-line-height,40px);--document-ink-gap:12px;line-height:var(--lh)!important;font-weight:400!important;background-image:linear-gradient(to bottom,transparent calc(var(--document-rule-y,28px) - .5px),var(--monitor-ink) calc(var(--document-rule-y,28px) - .5px),var(--monitor-ink) calc(var(--document-rule-y,28px) + .5px),transparent calc(var(--document-rule-y,28px) + .5px))!important;background-position:0 0!important;background-size:100% var(--lh)!important;border-top:0}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text p{margin:0!important;padding:0!important;font-size:inherit!important;font-family:inherit!important;line-height:var(--lh)!important;font-weight:400!important}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text{position:relative;isolation:isolate;background-image:none!important;--document-avatar-rule-gap:12px}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(to bottom,transparent calc(var(--document-rule-y,28px) - .5px),var(--monitor-ink) calc(var(--document-rule-y,28px) - .5px),var(--monitor-ink) calc(var(--document-rule-y,28px) + .5px),transparent calc(var(--document-rule-y,28px) + .5px));background-size:100% var(--lh);clip-path:polygon(0 var(--document-avatar-rule-bottom,0px),var(--document-avatar-rule-right,0px) var(--document-avatar-rule-bottom,0px),var(--document-avatar-rule-right,0px) 0,100% 0,100% 100%,0 100%)}
  .container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-avatar{outline:none!important;background-color:transparent}
}
/* Document grows with its content, bounded by the interactive monitor. */
.container[page-name=index] section.monitor .monitor__window--profile > .parts-window {
  width: min(var(--document-columns, 40ch), var(--document-max-width, 90%));
  height: min(var(--document-content-height, auto), var(--document-max-height, 80%));
  max-height: var(--document-max-height, 80%);
  display: flex;
  flex-direction: column;
}
.container[page-name=index] section.monitor .monitor__window--profile .parts-window__header {
  flex: none;
  height: auto;
}
.container[page-name=index] section.monitor .monitor__window--profile .parts-window__container {
  flex: 0 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.container[page-name=index] section.monitor .monitor__window--profile .monitor__profile {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box;
  overflow: visible;
  padding:var(--document-gap)!important;
}
.container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text {
  display: flow-root;
  overflow-wrap: anywhere;
  border-top: 0;
  background-position: 0 -5rem;
  font-size: 12rem;
}
.container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-text figure {
  max-width: 100%;
  margin: 0;
}
.container[page-name=index] section.monitor .monitor__window--profile .monitor__profile-avatar {
  width: auto !important;
  height: 9em !important;
  max-width: 40%;
  object-fit: contain;
  float: left;
  outline: 8rem solid var(--color-white-100);
  margin: 0 var(--document-gap) var(--document-gap) 0;
}
/* Document shares the folder centre axis and artwork header spacing. */
.container[page-name=index] section.monitor .monitor__folder[data-button-type="file"] > svg {
  display:block; width:32rem !important; height:50rem !important; margin:0 !important; align-self:center; transform:none !important;
}
.container[page-name=index] section.monitor .monitor__window--profile .parts-window__header {
  padding:var(--document-gap)!important; min-height:0; gap:var(--document-gap);
}
.container[page-name=index] section.monitor .monitor__window--profile .parts-window__header__title {
  margin:0 !important; padding:0!important; font-size:12px !important; line-height:1.5 !important;
  box-sizing:border-box; flex:1; min-width:0; white-space:normal; overflow-wrap:anywhere;
}
.monitor__window--profile .parts-window__container,.monitor__profile,.monitor__profile-text {
  scrollbar-width:none; -ms-overflow-style:none;
}
.monitor__window--profile .parts-window__container::-webkit-scrollbar,.monitor__profile::-webkit-scrollbar,.monitor__profile-text::-webkit-scrollbar {display:none;}
:root {
  --document-gap:12px;
  --monitor-ink: #373737;
  --shutdown-optical-gap: 8rem;
  --work-title-padding: 8px;
  --work-optical-padding: 12px;
  --work-arrow-color: var(--monitor-ink);
  --work-gallery-gap: 16px;
  --monitor-folder-font: 8rem;
  --monitor-shutdown-font: 10rem;
  --monitor-panel-font: 11rem;
  --monitor-panel-height: 40rem;
  --monitor-artwork-width: 240rem;
  --monitor-ui-gap: 8rem;
}
.container[page-name=index] section.monitor .monitor__folder-list {
  display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important;
  align-items: center !important; justify-content: flex-start !important;
  width: fit-content !important; height: auto !important; max-height: calc(100% - var(--monitor-panel-height));
  padding: 20rem 16rem !important; gap: 16rem !important; box-sizing: border-box;
  overflow-y: auto; overflow-x: visible;
}
.container[page-name=index] section.monitor .monitor__folder {
  display:flex !important; flex-direction:column !important; align-items:center !important; transform:none !important; text-align:center;
  margin:0 !important; padding:0 !important; align-self:stretch; width:100% !important;
}
.container[page-name=index] section.monitor .monitor__folder__text {
  --fs: var(--monitor-folder-font); font-size: var(--monitor-folder-font) !important; font-weight: 400 !important;
  max-width:none !important; height:auto !important; line-height:1.5; text-align:center !important; width:100%; margin-inline:0 !important;
}
.container[page-name=index] section.monitor .monitor__folder__text span {
  display: block; position: static !important; transform: none !important; font-weight: 400 !important;
}
.container[page-name=index] section.monitor nav.monitor__bottom {
  transform: none !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  width: 100% !important; max-width: 100% !important; margin: 0 !important; box-sizing: border-box;
  padding: 4rem 8rem !important; height: var(--monitor-panel-height) !important;
  gap: var(--monitor-ui-gap); display: flex !important; justify-content: flex-start;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown {
  font-size: var(--monitor-shutdown-font) !important; width: auto !important; min-width: 88rem;
  padding-inline: 8rem; gap: 4rem; flex: none; white-space: nowrap;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown span {display: block !important;}
.container[page-name=index] section.monitor .monitor__bottom__sns-list {
  margin: 0 !important; margin-left: calc(2 * var(--monitor-ui-gap)) !important; gap: var(--monitor-ui-gap); min-width: 0; align-items: center; flex-wrap: wrap;
}
.container[page-name=index] section.monitor .monitor__bottom__sns-item {
  font-size: var(--monitor-panel-font) !important; min-width: 0 !important; padding: 4rem 8rem !important;
  border: 1px solid var(--color-black-100); border-radius: 4rem; color: var(--color-black-100);
  text-decoration: none; cursor: pointer; white-space: nowrap; background: var(--color-white-100);
}
.container[page-name=index] section.monitor .monitor__bottom__sns-item:after {display: none;}
.container[page-name=index] section.monitor .monitor__bottom__sns-item span {display: block !important; transform: none;}
.container[page-name=index] section.monitor .monitor__bottom__sns-item svg {width: 16rem; height: 16rem; flex: none;}
.container[page-name=index] section.monitor .monitor__bottom__date-time {
  display: block !important; flex: none; margin-left: auto !important; font-size: var(--monitor-panel-font) !important;
  line-height: 1.5; white-space: pre-line; text-align: right;
}
.container[page-name=index] section.monitor .monitor__window--folder .monitor__window__img {
  width: var(--monitor-artwork-width) !important; max-width: 100%; height: auto !important; object-fit: contain;
}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window {width:100%;max-width:none;min-width:0;box-sizing:border-box;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__container {min-width:0;}
.container[page-name=index] section.monitor .parts-window__header__title {max-width: 32ch; overflow-wrap: anywhere; line-height: 1.5;}
.container[page-name=index] section.monitor .parts-window__header {height: auto; min-height: 30rem; padding-block: 4rem;}
.monitor button:focus-visible,.monitor a:focus-visible {outline: 2rem solid var(--color-black-100); outline-offset: 2rem;}
.monitor-config-notice {position: absolute; bottom: calc(var(--monitor-panel-height) + 8rem); left: 8rem; right: 8rem; z-index: 2001; padding: 8rem; background: var(--color-white-100); color: var(--color-black-100); border: 1px solid currentColor; font: 12rem/1.5 var(--font-dot-gothic-16);}
@media (max-width: 750px) {
  .container[page-name=index] section.monitor nav.monitor__bottom {height: auto !important; min-height: var(--monitor-panel-height); flex-wrap: wrap;}
  .container[page-name=index] section.monitor .monitor__folder-list {padding: 12rem !important; gap: 8rem !important;}
}
@media (hover:hover) {.monitor__bottom__sns-item:hover {background: var(--color-black-100) !important; color: var(--color-white-100) !important;}}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header {box-sizing:border-box;padding:var(--work-title-padding) !important;gap:8px;align-items:center;min-height:40px;height:auto !important;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__title {margin:0 !important;padding:0 !important;flex:1;min-width:0;white-space:normal;line-height:1.5 !important;overflow-wrap:anywhere;font-size:12px !important;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__close {width:28px;height:28px;flex:none;z-index:2;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header-drag {width:calc(100% - 44px);}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__container {display:flex;flex-direction:column;align-items:stretch;}
.work-cover-button {display:block;border:0;padding:0;width:100%;background:transparent;cursor:pointer;}
.work-cover-button img {display:block;margin-inline:auto;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__title {overflow-wrap:normal;word-break:normal;}
.work-gallery-hint {display:flex;justify-content:space-between;align-items:center;padding:4px 8px;color:var(--work-arrow-color);font-size:12px;}
.work-gallery-hint svg,.work-viewer button svg {width:20px;height:20px;flex:none;}
.work-viewer {position:absolute;inset:0;z-index:9000;display:grid;grid-template-rows:auto minmax(0,1fr);background:var(--color-white-100);color:var(--color-black-100);font-family:var(--font-dot-gothic-16);}
.work-viewer-header {display:flex;align-items:center;gap:8px;padding:8px;border-bottom:1px solid currentColor;}
.work-viewer-title {flex:1;min-width:0;margin:0;overflow-wrap:anywhere;font-size:14px;line-height:1.5;}
.work-viewer button {display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;cursor:pointer;border:1px solid currentColor;background:transparent;color:inherit;}
.work-viewer-rail {display:flex;gap:var(--work-gallery-gap);overflow-x:auto;overflow-y:hidden;min-height:0;padding:8px;overscroll-behavior:contain;touch-action:pan-x;}
.work-viewer-frame {display:flex;flex:0 0 auto;margin:0;min-width:0;align-items:center;}
.work-viewer-frame img {display:block;max-height:100%;width:auto;height:auto;object-fit:contain;}
.work-viewer-error {font-size:16px;padding:16px;max-width:40ch;}
.work-viewer :focus-visible,.work-cover-button:focus-visible {outline:2px solid currentColor;outline-offset:-2px;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header-drag {width:calc(100% - 88px);}
.work-expand-button {display:flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;padding:4px;border:0;background:transparent;color:var(--work-arrow-color);cursor:default !important;position:relative;z-index:2;}
.work-expand-button svg {display:block;width:20px;height:20px;overflow:visible;}
.work-viewer-header .work-expand-button {color:var(--work-arrow-color);}
.work-expand-button:focus-visible {outline:2px solid var(--work-arrow-color);outline-offset:2px;}
.work-viewer-body {display:grid;grid-template-columns:minmax(0,1fr) clamp(64px,18%,160px);gap:var(--work-gallery-gap);min-height:0;padding:16px;box-sizing:border-box;}
.work-main-frame {display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;margin:0;}
.work-main-image {display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.work-viewer-thumbnails {display:flex;flex-direction:column;gap:8px;overflow-y:auto;overflow-x:hidden;min-height:0;padding:4px;overscroll-behavior:contain;touch-action:pan-y;}
.work-viewer .work-thumbnail {display:block;box-sizing:border-box;width:100%;height:auto;min-height:44px;padding:4px;border:2px solid transparent;color:var(--work-arrow-color);}
.work-viewer .work-thumbnail[aria-pressed=true] {border-color:var(--work-arrow-color);}
.work-thumbnail img {display:block;width:100%;height:auto;}
.work-main-image[hidden],.work-viewer-error[hidden] {display:none !important;}
@keyframes work-arrow-upper {0%,100% {transform:translate(1px,1px);}50% {transform:translate(-1px,-1px);}}
@keyframes work-arrow-lower {0%,100% {transform:translate(-1px,-1px);}50% {transform:translate(1px,1px);}}
@media (hover:hover) {
  .work-viewer .work-thumbnail:hover {background:#eeeeee;}
}
.work-window-controls .work-expand-button .work-arrow-0 {animation:work-arrow-upper var(--work-arrow-cycle, 1600ms) ease-in-out infinite;}
.work-window-controls .work-expand-button .work-arrow-1 {animation:work-arrow-lower var(--work-arrow-cycle, 1600ms) ease-in-out infinite;}
@media (max-width:768px) {.work-viewer-body {gap:8px;padding:8px;grid-template-columns:minmax(0,1fr) clamp(48px,18%,96px);}}
.container[page-name=index] section.monitor .parts-window__header .work-window-controls {display:flex;align-items:center;gap:4px;flex:0 0 auto;margin-left:auto;position:relative;z-index:3;}
.container[page-name=index] section.monitor .parts-window__header .work-window-controls button {display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:28px;height:28px;padding:0;flex:none;}
.container[page-name=index] section.monitor .parts-window__header .work-window-controls button svg {width:28px !important;height:28px !important;}
.container[page-name=index] section.monitor .parts-window__header .work-window-controls .work-expand-button[hidden] {display:none !important;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header-drag {width:calc(100% - 44px);}
.container[page-name=index] section.monitor .monitor__window--folder .work-has-gallery .parts-window__header-drag {width:calc(100% - 76px);}
.container[page-name=index] section.monitor .work-viewer {position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;margin:0;transform:none;box-sizing:border-box;overflow:hidden;}
.work-viewer-header {box-sizing:border-box;min-width:0;justify-content:flex-end;gap:calc(var(--work-title-padding) + 2px);padding:0 var(--work-title-padding) 0 0;}
.work-viewer-title {box-sizing:border-box;padding:var(--work-optical-padding);}
.work-viewer-header button {box-sizing:border-box;width:28px;height:28px;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;color:var(--work-arrow-color);}
.work-viewer-header button svg {width:28px;height:28px;}
.work-viewer-body {width:100%;height:100%;min-width:0;overflow:hidden;}
.work-main-frame {width:100%;height:100%;overflow:hidden;}
.work-main-image {flex:0 1 auto;min-width:0;min-height:0;max-width:100%;max-height:100%;}
.work-viewer-thumbnails {position:relative;box-sizing:border-box;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header {padding:0 var(--work-title-padding) 0 0 !important;min-height:0;gap:4px;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__title {padding:var(--work-title-padding) !important;box-sizing:border-box;}
.work-viewer-header .work-expand-button {color:var(--work-arrow-color);}
.work-expand-button svg {overflow:visible;}
.container[page-name=index] section.monitor .parts-window__header .work-window-controls {gap:calc(var(--work-title-padding) + 2px);}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header {column-gap:0;}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__title {padding:var(--work-optical-padding);padding-right:calc(2 * var(--work-optical-padding)) !important;max-width:none !important;}
.work-viewer-title {max-width:none;overflow-wrap:normal;word-break:normal;padding-right:calc(2 * var(--work-optical-padding) - var(--work-title-padding) - 2px);}

/* One foreground ink for monitor text, icons and existing UI rules. */
.container[page-name=index] section.monitor {
  --color-black-100: var(--monitor-ink);
  color: var(--monitor-ink);
}
.container[page-name=index] section.monitor :where(button,a,span,p,h1,h2,h3,div,nav,header,svg) {
  color: var(--monitor-ink) !important;
}
.container[page-name=index] section.monitor svg [fill]:not([fill="none"]) {
  fill: currentColor !important;
  fill-opacity: 1 !important;
}
.container[page-name=index] section.monitor svg [stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
  stroke-opacity: 1 !important;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown {
  display: flex; align-items: center; line-height: 1;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown svg {
  display: block; width: var(--shutdown-icon-size, 1em) !important; height: var(--shutdown-icon-size, 1em) !important;
  flex: none; opacity: 1 !important;
}
.container[page-name=index] section.monitor .monitor__folder svg [fill]:not([fill="none"]) {
  fill: none !important;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown {
  gap: var(--shutdown-optical-gap); min-width: 0;
  padding: var(--shutdown-optical-gap) !important;
}
.container[page-name=index] section.monitor .monitor__bottom__button-shutdown span {
  line-height: 1; transform: none !important;
}
.container[page-name=index] section.monitor :where(.parts-window,.parts-window__header,.monitor__bottom,.monitor__bottom__button-shutdown,.monitor__bottom__sns-item,.work-viewer-header) {
  border-color: var(--monitor-ink) !important;
}
@media (hover:hover) {
  .container[page-name=index] section.monitor .monitor__bottom__sns-item:hover {
    background: #eeeeee !important; color: var(--monitor-ink) !important;
  }
}

/* A shared bounded order takes precedence over legacy drag z-index counters. */
.container[page-name=index] section.monitor .monitor__window--folder .parts-window,
.container[page-name=index] section.monitor .od-mobile-window {
  z-index:var(--work-layer,1) !important;
}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header,
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header__title,
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header-drag,
.container[page-name=index] section.monitor .od-adaptive-work > header,
.container[page-name=index] section.monitor .od-adaptive-work > header h3,
.container[page-name=index] section.monitor .work-viewer-title {
  cursor:default !important;
}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header {
  touch-action:none;user-select:none;
}
.container[page-name=index] section.monitor .monitor__window--folder .parts-window__header-drag {
  pointer-events:none !important;
}
.container[page-name=index] section.monitor .work-cover-button,
.container[page-name=index] section.monitor .work-cover-button img,
.container[page-name=index] section.monitor .od-adaptive-work .od-adaptive-media,
.container[page-name=index] section.monitor .od-adaptive-work .od-adaptive-media img {
  cursor:pointer !important;
}

/* The taskbar uses Arimo's natural metrics, independent of artwork scaling. */
@media (min-width:1024px) {
  .container[page-name=index] section.monitor {--monitor-panel-height:56px;}
  .container[page-name=index] section.monitor nav.monitor__bottom {
    height:var(--monitor-panel-height) !important;min-height:var(--monitor-panel-height);
    padding:10px 12px !important;gap:12px;align-items:center;flex-wrap:nowrap;
    font-family:"Arimo",Arial,sans-serif;
  }
  .container[page-name=index] section.monitor .monitor__bottom__button-shutdown,
  .container[page-name=index] section.monitor .monitor__bottom__sns-item {
    display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
    box-sizing:border-box;height:36px;min-height:36px;
    padding:7px 12px !important;gap:8px;border-radius:4px;
    font-family:"Arimo",Arial,sans-serif !important;
    font-size:14px !important;font-weight:400;line-height:20px !important;
    white-space:nowrap;
  }
  .container[page-name=index] section.monitor .monitor__bottom__button-shutdown span,
  .container[page-name=index] section.monitor .monitor__bottom__sns-item span {
    font:inherit !important;line-height:20px !important;
  }
  .container[page-name=index] section.monitor .monitor__bottom__button-shutdown svg,
  .container[page-name=index] section.monitor .monitor__bottom__sns-item svg {
    display:block;width:16px !important;height:16px !important;flex:none;transform:none;
  }
  .container[page-name=index] section.monitor .monitor__bottom__sns-list {
    display:flex;margin:0 !important;gap:8px;align-items:center;flex-wrap:nowrap;
  }
  .container[page-name=index] section.monitor .monitor__bottom__date-time {
    align-self:center;min-width:88px;margin-left:auto !important;
    font-family:"Arimo",Arial,sans-serif !important;font-size:12px !important;
    font-weight:400;line-height:18px !important;font-variant-numeric:tabular-nums;
    white-space:pre-line;text-align:right;
  }
}

/* Keep the monitor's grain behind its contents so artwork stays unaltered. */
.container[page-name=index] section.monitor {isolation:isolate;}
.container[page-name=index] section.monitor .monitor__overlay {z-index:-1!important;}