/* NUNO STUDIO boot guard
 * Prevent state-managed UI from flashing before the JS visibility controller
 * has completed its first synchronization. After ready,
JS owns visibility.
 */
html:not(.nstudio-ui-control-ready) .nstudio-page .mode-panel,
html:not(.nstudio-ui-control-ready) .nstudio-page .canvas-loading-overlay,
html:not(.nstudio-ui-control-ready) .nstudio-page .spec-guide-popup,
html:not(.nstudio-ui-control-ready) .nstudio-page .nstudio-piece-inputs,
html:not(.nstudio-ui-control-ready) .nstudio-page .nstudio-background-option-section,
html:not(.nstudio-ui-control-ready) .nstudio-page .nstudio-insert-dialog,
html:not(.nstudio-ui-control-ready) .nstudio-page .nstudio-context-adjust-panel,
html:not(.nstudio-ui-control-ready) .nstudio-page .nstudio-selected-adjust-wrap,
html:not(.nstudio-ui-control-ready) .nstudio-page [data-nstudio-design-main-panel],
html:not(.nstudio-ui-control-ready) .nstudio-page .is-nstudio-module-hidden,
html:not(.nstudio-ui-control-ready) .nstudio-page .is-nstudio-tab-switch-hidden{
  display: none !important;
}

:root{
  --bg: #ffffff;
  --paper: #ffffff;
  --ink: #222;
  --sub: #666;
  --line: #ddd6c8;
  --accent: #1f4f46;
  --accent-light: #e8f0ed;
  --gold: #b79b5b;
}

.nstudio-page,
.nstudio-page *{
  box-sizing: border-box;
}

.nstudio-page{
  margin: 0;

  
  display: block;
  width: 100%;
  min-height: 0;
  height: auto;
  
  overflow-y: visible;
}


/*
 * Semantic UIはアイコンフォントだけ利用する。
 * icon.cssが持つ汎用的な余白・幅・行高をNUNO STUDIO内では基準化し、
 * ボタンごとの配置は下にあるNUNO STUDIO固有ルールへ任せる。
 */
.nstudio-page i.icon{
  position: static;
  display: inline-block;
  width: 1em;
  height: 1em;
  margin: 0;
  padding: 0;
  line-height: 1;
  vertical-align: middle;
  text-align: center;
  flex: 0 0 auto;
}

.nstudio-page i.icon::before{
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  line-height: 1;
}


.nstudio-page main{
  display: block;
  min-height: 0;
  height: auto;
}

/* 固定ページ内への干渉を避けるため、このブロック内だけに効かせる */
.nstudio-page a{
  color: inherit;
}

.nstudio-page .wrap{
  
  
  margin: 0 auto;
  padding: 0 20px;
}

.nstudio-page .hero{
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 42px 0;
  position: relative;
  overflow: hidden;
  background: #fff;
  color: var(--ink);
  border-top: 1px solid rgba(31,79,70,.14);
  border-bottom: 1px solid rgba(31,79,70,.24);
  box-shadow: none;
}

.nstudio-page .hero-inner{
  position: relative;
  max-width: 980px;
  display: block;
}

.nstudio-page .hero-image{
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1672 / 941;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(31,79,70,.18);
  background: #f8f8f5;
  box-shadow: 0 18px 42px rgba(0,0,0,.08);
}

.nstudio-page .hero-image::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48%;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(22,28,25,.18) 45%, rgba(22,28,25,.38) 100%);
  pointer-events: none;
}

.nstudio-page .hero-image img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nstudio-page .hero-copy{
  
  left: 0;
  right: 0;
  bottom: 0;
  
  min-width: 0;
  margin: 0;

}

.nstudio-page .hero-desc{
  margin-top: 18px;
  padding: 0 4px;
}

.nstudio-page .label{
  display: none;
}

.nstudio-page .hero h1{
  margin: 0;
  color: #fff;
  font-size: clamp(26px, 3.6vw, 42px);
  line-height: 1.15;
  letter-spacing: .04em;
  text-shadow: 0 2px 10px rgba(0,0,0,.28);
}

.nstudio-page .hero h1::after{
  content: "";
  display: block;
  width: 76px;
  height: 3px;
  margin-top: 16px;
  background: rgba(255,255,255,.96);
  border-radius: 0;
}


.nstudio-page .hero p{
  max-width: none;
  margin: 0;
  color: var(--sub);
  font-size: 15px;
  line-height: 1.8;
}

@media (max-width: 1024px) {
  
  .nstudio-page .hero-inner{
    max-width: 100%;
  }

  .nstudio-page .hero-image{
    width: 100%;
    max-width: 100%;
    margin: 0;
    
  }

  .nstudio-page .hero-copy{
    left: 0;
    right: 0;
    bottom: 0;
    
    
  }

  .nstudio-page .hero-desc{
    
    padding: 0;
  }

  .nstudio-page .hero h1{
    font-size: clamp(22px, 6.4vw, 32px);
  }

  .nstudio-page .hero-copy-sub{
    font-size: clamp(17px, 4.8vw, 24px);
  }

  .nstudio-page .hero p{
    font-size: 14px;
    line-height: 1.7;
  }
}

.section{
  padding: 46px 0;
}

.section-title{
  text-align: center;
  margin-bottom: 26px;
}

.section-title h2{
  position: relative;
  display: inline-block;
  margin: 0 0 12px;
  padding: 0 18px 10px;
  font-size: clamp(24px, 3vw, 36px);
  letter-spacing: .04em;
}

.section-title h2::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 72px;
  height: 2px;
  transform: translateX(-50%);
  background: rgba(31,79,70,.32);
  border-radius: 999px;
}

.section-title p{
  margin: 0;
  color: var(--sub);
}

.notice-box{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 28px;
  box-shadow: 0 12px 36px rgba(0,0,0,.05);
}

.notice-box strong{
  color: var(--accent);
}

.grid-3{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.card{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 8px 26px rgba(0,0,0,.04);
}

.card h3{
  margin: 0 0 10px;
  font-size: 20px;
}

.card p{
  margin: 0;
  color: var(--sub);
  font-size: 14px;
}

.order-layout{
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 28px;
  align-items: start;
}

.panel{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 12px 36px rgba(0,0,0,.05);
}

.form-block{
  margin-bottom: 24px;
}

.form-block h3{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 3px 10px 4px;
  border-radius: 999px;
  background: rgba(31,79,70,.07);
  color: var(--accent);
  font-size: 15px;
  line-height: 1.5;
}

.option-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.option{
  position: relative;
}

.option input{
  display: none;
}

.option span{
  display: block;
  padding: 12px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
  transition: .2s;
}

.option input:checked + span{
  border-color: var(--accent);
  background: var(--accent-light);
  color: var(--accent);
  font-weight: 700;
}

select,
input[type="text"],
input[type="email"],
input[type="tel"],
textarea{
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  font: inherit;
  background: #fff;
}

textarea{
  min-height: 120px;
  resize: vertical;
}

.size-custom{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}


.preview-panel{
  position: relative;
  top: auto;
}

.preview-head{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  
}

.preview-head h3{
  margin: 0;
  font-size: 20px;
}

.preview-size{
  font-size: 13px;
  color: var(--sub);
}

.canvas-area{
  
  
  justify-content: center;
  align-items: center;
  
  background-size: 22px 22px;
  background-position: 0 0, 0 11px, 11px -11px, -11px 0;

  
}

.nobori-canvas{

  justify-content: center;
  align-items: center;
}

.preview-toolbar{
  
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-top: 18px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f7f7f5;
}

.tool-group{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.tool-upload,
.tool-btn{
  appearance: none;
  border: 1px solid #cfc7b8;
  background: #fff;
  color: #222;
  border-radius: 10px;
  padding: 9px 12px;
  font: inherit;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset;
}

.tool-btn.is-active,
.tool-upload:hover,
.tool-btn:hover{
  border-color: #1f4f46;
  background: #eef4f2;
  color: #1f4f46;
}

.tool-upload input[type="file"]{
  display: none;
}

.zoom-indicator{
  display: inline-flex;
  align-items: center;
  
  justify-content: center;
  padding: 8px 10px;
  border: 1px solid #cfc7b8;
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
  
}

.summary{
  margin-top: 18px;
  padding: 18px;
  border-radius: 16px;
  background: #faf8f3;
  border: 1px solid var(--line);
  font-size: 14px;
}

.summary dl{
  margin: 0;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 6px 12px;
}

.summary dt{
  color: var(--sub);
}

.summary dd{
  margin: 0;
  font-weight: 700;
}

.submit-area{
  margin-top: 32px;
  text-align: center;
}

.btn{
  display: inline-block;
  width: 100%;
  padding: 16px 24px;
  border: none;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .04em;
  cursor: pointer;
}

.note{
  margin-top: 10px;
  color: var(--sub);
  font-size: 13px;
}

.flow{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.flow-item{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 22px;
}

.flow-num{
  color: var(--gold);
  font-size: 13px;
  letter-spacing: .12em;
  font-weight: 700;
}

.flow-item h3{
  margin: 8px 0;
  font-size: 18px;
}

.flow-item p{
  margin: 0;
  color: var(--sub);
  font-size: 14px;
}

.footer-note{
  background: #222;
  color: #fff;
  padding: 36px 0;
  font-size: 13px;
  margin: 0;
}

.nstudio-page > *:last-child{
  margin-bottom: 0 !important;
}

.footer-note p{
  margin: 0;
  color: rgba(255,255,255,.72);
}

@media (max-width: 1024px) {
  .grid-3,
.flow{
    grid-template-columns: 1fr;
  }

  .canvas-area{
    min-height: 420px;
    justify-content: flex-start;
  }
}


/* ===== simple artboard editor v3 ===== */
.preview-panel{
  min-height: 0;
}

.preview-head{
  margin-bottom: 12px;
}

.editor-mode-switch{
  display: inline-flex;
  gap: 8px;
  margin: 0 0 12px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f7f7f5;
}

.mode-btn{
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  color: #555;
  border-radius: 999px;
  padding: 8px 14px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.mode-btn i.icon{
  margin-right: 6px !important;
}

.mode-btn.is-active{
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.mode-panel{
  display: block;
}

.design-shell{
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 12px;
  height: min(72vh, 760px);
  min-height: 560px;
}

.side-toolbar{
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-self: stretch;
  padding: 8px 6px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f7f7f5;
}

.icon-tool{
  appearance: none;
  width: 44px;
  min-height: 48px;
  padding: 6px 4px;
  border: 1px solid #d7d1c5;
  border-radius: 12px;
  background: #fff;
  color: #333;
  font: inherit;
  font-size:12px;
  line-height: 1.1;
  cursor: pointer;
  text-align: center;
}

.icon-tool i.icon{
  display: block;
  width: auto;
  height: auto;
  margin: 0 auto 3px !important;
  font-size: 16px;
}

.icon-tool span{
  display: block;
  transform: scale(.94);
  transform-origin: center;
  white-space: nowrap;
}

.icon-tool:hover,
.icon-tool.is-active{
  border-color: var(--accent);
  background: var(--accent-light);
  color: var(--accent);
}

.icon-tool.danger:hover{
  border-color: #9b2c2c;
  background: #fff1f1;
  color: #9b2c2c;
}

.canvas-area{
  position: relative;
  min-height: 0;
  height: 100%;
  display: block;
  background: repeating-linear-gradient(135deg, #ebebeb 0, #ebebeb 12px, #e4e4e4 12px, #e4e4e4 24px);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 0;
  overflow: hidden;
}

.nobori-canvas{
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 0;
  display: block;
}

.nobori-canvas canvas{
  display: block;
}

.canvas-container{
  margin: 0 !important;
}

.upload-placeholder{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  pointer-events: none;
  color: #777;
  text-align: center;
  font-size: 13px;
  line-height: 1.7;
  padding: 16px 18px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  box-shadow: 0 8px 26px rgba(0,0,0,.08);
}

.upload-placeholder i.icon{
  margin: 0 0 4px !important;
  font-size: 22px;
  color: #999;
}

.preview-toolbar{
  display: none;
}

.preview-actions{
  display: flex;
  flex-wrap: wrap;
  
  align-items: center;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f7f7f5;
}

.main-upload,
.action-btn,
.zoom-indicator{
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 38px;
  border: 1px solid #cfc7b8;
  border-radius: 10px;
  background: #fff;
  color: #222;
  padding: 8px 11px;
  font: inherit;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
}

.main-upload{
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  font-weight: 700;
}

.main-upload input[type="file"]{
  display: none;
}

.action-btn:hover{
  border-color: var(--accent);
  background: var(--accent-light);
  color: var(--accent);
}

.action-btn.danger:hover{
  border-color: #9b2c2c;
  background: #fff1f1;
  color: #9b2c2c;
}

.zoom-indicator{
  margin-left: auto;
  min-width: 68px;
  cursor: default;
  color: #444;
}

.image-size-panel{
  display: flex;
  flex-wrap: wrap;
  
  
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fcfbf8;
}

.image-size-field{
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.image-size-field label,
.image-size-lock{
  color: #555;
  font-size: 12px;
}

.image-size-label-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.fit-cloth-btn{
  appearance: none;
  border: 1px solid #cfc7b8;
  border-radius: 999px;
  background: #fff;
  color: #1f4f46;
  padding: 2px 7px;
  font: inherit;
  font-size:12px;
  line-height: 1.35;
  cursor: pointer;
  white-space: nowrap;
}

.fit-cloth-btn:hover{
  border-color: #1f4f46;
  background: #eef4f2;
}

.image-size-input-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  padding:0;
  border:0;
  background:transparent;
}


.image-size-unit{
  color: #777;
  font-size: 12px;
}

.image-size-lock{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 2px;
}

.image-size-note{
  color: #888;
  font-size: 12px;
}

.preview-display-shell{
  display: flex;
  flex-direction: column;
  height: min(64vh, 680px);
  min-height: 500px;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(180deg, #f8f8f8 0%, #efefef 100%);
}

.preview-display-stage{
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  padding: 18px 18px 16px;
  background: linear-gradient(180deg, #fafafa 0%, #f0f0f0 100%);
  overflow: hidden;
}

.preview-rig{
  position: relative;
  width: min(350px, 88%);
  height: 100%;
  min-height: 0;
  margin: 0 auto;
}

.preview-completed-vector{
  position:absolute;
  inset:18px;
  display:none;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.preview-completed-vector > svg{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
}

.preview-pole-vertical,
.preview-pole-horizontal{
  position: absolute;
  background: rgba(255,255,255,.98);
  box-shadow: none;
}

.preview-pole-vertical{
  width: 7px;
  border-radius: 999px;
  background: linear-gradient(180deg, #8a5a34, #6b4325);
  z-index: 2;
}

.preview-pole-horizontal{
  height: 3px;
  border-radius: 0;
  z-index: 1;
}

.preview-cloth-wrap{
  position: absolute;
  z-index: 3;
}

.preview-top-ties,
.preview-left-ties{
  position: absolute;
  pointer-events: none;
  z-index: 6;
}

.preview-top-ties{
  left: 0;
  top: 0;
  width: 100%;
  height: 0;
}

.preview-left-ties{
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
}

.preview-tie{
  position: absolute;
  background: rgba(255,255,255,.98);
  box-shadow: 0 0 0 1px rgba(0,0,0,.04);
}

.preview-tie.top{
  transform-origin: top center;
}

.preview-tie.left{
  transform-origin: center left;
}

.preview-cloth{
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 45 / 180;
  background: transparent;
  border: 0;
  box-shadow: 0 14px 30px rgba(0,0,0,.10);
  overflow: hidden;
  z-index: 2;
}

.preview-cloth-image,
.preview-cloth-vector,
.preview-cloth.is-piece-shape{ background: transparent; border-color: transparent; box-shadow: none; }

.preview-cloth-empty{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.preview-cloth-vector,
.preview-cloth-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.preview-cloth-vector{
  display:none;
  overflow:hidden;
}

.preview-cloth-vector .preview-cloth-vector-svg{
  display:block;
  width:100%;
  height:100%;
}

.preview-cloth-image{
  object-fit: fill;
  display: none;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
}

.preview-cloth-empty{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 18px;
  color: #888;
  font-size: 13px;
  line-height: 1.7;
  background: linear-gradient(180deg, rgba(255,255,255,.75), rgba(248,248,248,.92));
}

.preview-display-note{
  margin: 0;
  padding: 14px 16px;
  border-top: 1px solid var(--line);
  color: var(--sub);
  font-size: 13px;
  background: #fcfbf8;
}

@media (max-width: 1024px) {
  .preview-panel{
    min-height: auto;
  }
  .design-shell{
    grid-template-columns: 50px minmax(0, 1fr);
    min-height: 440px;
    height: 62vh;
  }
  .side-toolbar{
    padding: 6px 4px;
  }
  .icon-tool{
    width: 40px;
    min-height: 44px;
  }
  .preview-display-shell{
    min-height: 440px;
    height: 62vh;
  }
  .preview-display-stage{
    min-height: 0;
  }
  .preview-rig{
    width: min(280px, 90%);
    min-height: 0;
  }
}

.canvas-loading-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.76);
  z-index: 12;
  backdrop-filter: blur(1px);
}
.canvas-loading-box{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px 18px;
  border-radius: 14px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(31,79,70,.18);
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
  color: #355a53;
  font-size: 13px;
  font-weight: 700;
}
.canvas-loading-spinner{
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 3px solid rgba(31,79,70,.16);
  border-top-color: var(--accent);
  animation: nstudioSpin .8s linear infinite;
}
@keyframes nstudioSpin { to{ transform: rotate(360deg); } }













.crop-toggle-active{
  border-color: #1f4f46 !important;
  background: #eef4f2 !important;
  color: #1f4f46 !important;
  font-weight: 700;
}






.preview-actions.is-hidden,
.image-size-panel.is-hidden{
  display: none !important;
}

/* ===== compact simulator operation UI v20260609j ===== */


.preview-actions::before{ content: "基本操作"; }
.image-size-panel::before{ content: "選択画像の調整"; }

.preview-actions{
  justify-content: flex-start;
  gap: 8px;
}
.preview-actions .main-upload{
  flex: 1 1 160px;
  max-width: 220px;
}
.action-btn,
.main-upload{
  transition: background .15s, border-color .15s, color .15s, transform .12s;
}
.action-btn:hover,
.main-upload:hover{
  transform: none;
}
.image-size-panel{
  align-items: flex-end;
  gap: 10px;
}
.image-size-panel .action-btn{
  min-height: 38px;
}





@media (max-width: 1024px) {
  .preview-actions .main-upload,
.preview-actions .action-btn{
    flex: 1 1 100%;
    max-width: none;
  }
}




#resetImage,
#clearImages{
  display: none !important;
}
.image-size-panel .crop-row{
  flex: 1 0 100%;
}


.nstudio-page .preview-size{
  max-width: 58%;
  text-align: right;
  line-height: 1.45;
}

/* ===== section title top accent v20260609s ===== */
.section-title h2{
  padding-top: 12px !important;
  padding-bottom: 0 !important;
}
.section-title h2::after{
  display: none !important;
}
.section-title h2::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 72px;
  height: 2px;
  transform: translateX(-50%);
  background: rgba(31,79,70,.32);
  border-radius: 999px;
}
.preview-head .preview-size{
  white-space: pre-line;
  text-align: right;
}
.editor-file-actions{
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.editor-file-actions details{
  position: relative;
}
.editor-file-actions summary.action-btn{
  list-style: none;
  min-height: 34px;
  padding: 7px 10px;
  font-size: 12px;
}
.editor-file-actions summary.action-btn::-webkit-details-marker{
  display: none;
}
.editor-file-actions summary.action-btn::after{
  content: "▼";
  margin-left: 5px;
  font-size:12px;
  opacity: .65;
}
.editor-file-menu{
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  z-index: 30;
  min-width: 150px;
  padding: 6px;
  border: 1px solid #d8d1c5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
}
.editor-file-menu .action-btn{
  width: 100%;
  justify-content: flex-start;
  min-height: 32px;
  padding: 7px 9px;
  font-size: 12px;
  box-shadow: none;
}
.editor-file-menu .action-btn + .action-btn,
.editor-file-menu label.action-btn + .action-btn,
.editor-file-menu .action-btn + label.action-btn{
  margin-top: 4px;
}
.editor-file-actions input[type="file"]{
  display: none;
}

.nstudio-page .type-only-maku,
.nstudio-page .type-only-nobori,
.nstudio-page .type-only-noren{
  display: none;
}

.nstudio-page.is-type-nobori .type-only-nobori{
  display: block;
}

.nstudio-page.is-type-maku .type-only-maku{
  display: block;
}

.nstudio-page.is-type-noren .type-only-noren{
  display: block;
}


.nstudio-page .preview-rig{
  width: 100% !important;
  max-width: 100% !important;
}

.nstudio-page .preview-cloth-wrap{
  z-index: 3;
}

.nstudio-page .preview-cloth{
  box-shadow: 0 14px 34px rgba(0,0,0,.12);
}

.nstudio-page .product-type-top{
  margin: -12px auto 28px;

  text-align: center;
}

.nstudio-page .product-type-top h3{
  margin: 0 0 12px;
  color: var(--accent);
  font-size: 15px;
  letter-spacing: .06em;
}

.nstudio-page .product-type-top .option-grid{
  max-width: 650px;
  margin: 0 auto;
  
}

.nstudio-page .product-type-top .option span{
  padding: 15px 12px;
  border-width: 2px;
  
  
}

.nstudio-page .zoom-indicator{
  display: none !important;
}

/* プレビュー表示：のぼりは器具あり、幕はアートボードのみ、のれんは上部棒のみ */
.nstudio-page.is-type-nobori .preview-pole-vertical,
.nstudio-page.is-type-nobori .preview-pole-horizontal,
.nstudio-page.is-type-nobori .preview-top-ties,
.nstudio-page.is-type-nobori .preview-left-ties{
  display: block !important;
}

.nstudio-page.is-type-maku .preview-pole-vertical,
.nstudio-page.is-type-maku .preview-pole-horizontal,
.nstudio-page.is-type-maku .preview-top-ties,
.nstudio-page.is-type-maku .preview-left-ties,
.nstudio-page.is-type-tapestry .preview-pole-vertical,
.nstudio-page.is-type-tapestry .preview-pole-horizontal,
.nstudio-page.is-type-tapestry .preview-top-ties,
.nstudio-page.is-type-tapestry .preview-left-ties{
  display: none !important;
}

.nstudio-page.is-type-noren .preview-pole-horizontal,
.nstudio-page.is-type-noren .preview-top-ties{
  display: block !important;
}

.nstudio-page.is-type-noren .preview-pole-vertical,
.nstudio-page.is-type-noren .preview-left-ties{
  display: none !important;
}

.nstudio-page .preview-noren-splits,
.nstudio-page .preview-panel-splits{
  position: absolute;
  inset: 0;
  
  pointer-events: none;
}

.nstudio-page .preview-noren-split-line,
.nstudio-page .preview-panel-split-line{
  position: absolute;

}

/* ボタン色調整：通常ボタンは元の白系、ファイル選択とAI生成だけ強調 */
.nstudio-page .action-btn,
.nstudio-page .icon-tool,
.nstudio-page .asset-menu-btn,
.nstudio-page .fit-cloth-btn{
  background: #fff;
  border-color: #cfc7b8;
  color: #222;
}

.nstudio-page .action-btn:hover,
.nstudio-page .icon-tool:hover,
.nstudio-page .icon-tool.is-active,
.nstudio-page .asset-menu-btn:hover,
.nstudio-page .fit-cloth-btn:hover{
  border-color: var(--accent);
  background: var(--accent-light);
  color: var(--accent);
}

/* 固定ページ側 #content h1 対策 */




/* 前版の濃いグレー指定を最終上書き */
.nstudio-page .preview-actions .action-btn,
.nstudio-page .side-toolbar .icon-tool,
.nstudio-page .asset-menu-btn,
.nstudio-page .fit-cloth-btn{
  background: #fff !important;
  color: #222 !important;
  border-color: #cfc7b8 !important;
}

/* ===== mobile/ui polish v20260609m ===== */
.nstudio-page select{
  
  
  cursor: pointer;
  
  background-image:
    linear-gradient(45deg, transparent 50%, #444 50%),
    linear-gradient(135deg, #444 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  
}
.nstudio-page .form-block.type-only-nobori,
.nstudio-page .form-block.type-only-maku{
  position: relative;
}
.nstudio-page .size-ratio-icon{
  position: absolute;
  left: 14px;
  bottom: 14px;
  width: 22px;
  height: 32px;
  border: 2px solid #555;
  border-radius: 3px;
  background: rgba(255,255,255,.92);
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7);
}


.nstudio-page .icon-tool.is-active{
  background: #333 !important;
  border-color: #333 !important;
  color: #fff !important;
}


.nstudio-page .order-layout > .panel,
.nstudio-page .product-type-top,
.nstudio-page .preview-actions,
.nstudio-page .image-size-panel,
.nstudio-page .side-toolbar,
.nstudio-page .canvas-area{
  box-shadow: none !important;
  border-color: #e8e2d8 !important;
}
.nstudio-page .panel{
  box-shadow: none;
}
.nstudio-page .form-block h3{
  background: transparent;
  padding-left: 0;
  padding-right: 0;
}
.nstudio-page .option span{
  border-color: #e5ded4;
}
.nstudio-page .canvas-area,
.nstudio-page .nobori-canvas,
.nstudio-page .canvas-container,
.nstudio-page canvas{
  touch-action: none;
}
@media (max-width: 1024px) {
    .nstudio-page .section{
    padding: 34px 0;
  }
  .nstudio-page .section-title{
    margin-bottom: 18px;
  }
  .nstudio-page .hero{
    padding: 18px 0 26px;
  }
  .nstudio-page .hero-image{
    border-radius: 14px;
    
  }
  .nstudio-page .hero-image::after{
    display: none;
  }
  .nstudio-page .hero-copy{
    position: static;
    width: 100%;
    
    background: transparent;
  }
  .nstudio-page .hero h1,
.nstudio-page .hero-copy-sub{
    color: var(--ink);
    text-shadow: none;
  }
  .nstudio-page .hero h1::after{
    background: var(--accent);
    margin-top: 12px;
  }
  .nstudio-page .hero-desc{
    margin-top: 12px;
  }
  .nstudio-page .panel{
    padding: 14px;
    border-radius: 18px;
  }
    .nstudio-page .product-type-top{
    margin-bottom: 18px;
    padding: 12px;
  }
    .nstudio-page .canvas-area{
    min-width: 0;
  }
  }

/* mobile hero text separated from photo */
@media (max-width: 1024px){
  .nstudio-page .hero-image{
    aspect-ratio: auto;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .nstudio-page .hero-image img{
    height: auto;
    aspect-ratio: 1672 / 941;
    border-radius: 14px;
    border: 1px solid rgba(31,79,70,.18);
    box-shadow: 0 12px 28px rgba(0,0,0,.08);
  }
  .nstudio-page .hero-copy{
    display: block;
  }
}

/* final polish v20260609: hero / buttons / template spacing */
.nstudio-page .hero-copy{

  z-index: auto !important;
}

#content .nstudio-page .hero h1,
.nstudio-page .hero h1{
  
  visibility: visible !important;
  opacity: 1 !important;

}

.nstudio-page .hero-kicker{
  display: block !important;

}

.nstudio-page .hero-copy-sub{
  display: block !important;

}

/* ボタンは基本元の白系へ戻す */
.nstudio-page .action-btn:not(.nstudio-preview-save-trigger),
.nstudio-page .icon-tool,
.nstudio-page .fit-cloth-btn,
.nstudio-page .editor-file-menu .action-btn,
.nstudio-page .asset-menu-btn{
  background: #fff !important;
  border-color: #cfc7b8 !important;
  color: #222 !important;
}

/* ファイル選択とAI生成だけ目立たせる */

/* サイズ選択の長方形アイコンは不要 */

/* テンプレートボタン群を上から少し離す */

@media (max-width: 1024px){
  
  
  .nstudio-page .hero-copy{
    padding: 14px 2px 0 !important;
  }
}


/* final polish v20260609-u2 */

/* 種類選択・テンプレート部の外枠を消す */
.nstudio-page .product-type-top{

  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 操作系は囲み枠でなく、上1本線で区切る */


/* 既存の疑似ラベルを消して、基本操作はHTML側ラベルを使う */


.nstudio-page .preview-actions-title{

  justify-content: space-between;
  gap: 12px;

}

.nstudio-page .preview-actions-title .editor-file-actions{
  margin-left: auto;
}

/* サイズ選択の左空白を詰める・長方形アイコンは完全不要 */

/* ボタンはグレー背景・グレーホバーをやめて白系に戻す */

/* activeだけは選択状態が分かるよう薄色 */
.nstudio-page .icon-tool.is-active{
  background: var(--accent-light) !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

/* ファイル選択とAI生成だけ目立つ色 */

/* final polish v20260609-v3 */
.nstudio-page .hero-copy{
  position: static !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100%;
  padding: 18px 4px 0 !important;
  background: transparent !important;
  color: var(--ink) !important;
}

#content .nstudio-page .hero h1,
.nstudio-page .hero h1{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ink) !important;
  
  
  letter-spacing: .04em;
  text-shadow: none !important;
}

#content .nstudio-page .hero h1::before,
#content .nstudio-page .hero h1::after,
.nstudio-page .hero h1::before,
.nstudio-page .hero h1::after{
  display: none !important;
  content: none !important;
}

.nstudio-page .hero-kicker{
  margin: 0 0 8px !important;
  color: var(--sub) !important;
  font-size: clamp(15px, 1.5vw, 18px) !important;
  font-weight: 700;
  letter-spacing: .08em;
}

.nstudio-page .hero-copy-sub{
  margin-top: 10px !important;
  color: #8a6330 !important;
  font-size: clamp(16px, 1.8vw, 22px) !important;
  line-height: 1.4 !important;
  font-weight: 700;
  letter-spacing: .04em;
  text-shadow: none !important;
}

.nstudio-page .hero-image::after{
  display: none !important;
}

/* 開く/保存メニューを見やすく */

/* 画像調整タイトル */

/* 生成画像一覧を品質選択の右に寄せる */

/* 前回指定継続：通常ボタンは白系、ファイル選択とAI生成のみ強調 */
.nstudio-page .action-btn:not(.nstudio-preview-save-trigger),
.nstudio-page .icon-tool,
.nstudio-page .fit-cloth-btn,
.nstudio-page .editor-file-menu .action-btn,
.nstudio-page .asset-menu-btn{
  background: #fff !important;
  border-color: #cfc7b8 !important;
  color: #222 !important;
}

.nstudio-page .action-btn:not(.nstudio-preview-save-trigger):hover,
.nstudio-page .icon-tool:hover,
.nstudio-page .fit-cloth-btn:hover,
.nstudio-page .editor-file-menu .action-btn:hover,
.nstudio-page .asset-menu-btn:hover{
  background: #fff !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

/* テンプレート周り余白は維持 */

/* サイズ比率アイコンは不要 */
.nstudio-page .size-ratio-icon,
.nstudio-page .size-select-icon,
.nstudio-page .select-ratio-icon{
  display: none !important;
}


/* final polish v20260609-w5 */
.nstudio-page .custom-size-panel{
  grid-template-columns: 1fr 1fr !important;
  gap: 10px 12px !important;
  margin-top: 10px !important;
}


.nstudio-page .image-size-title{
  flex: 1 0 100%;
  
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  margin: 0 0 2px;
}

/* 開く/保存メニュー：右切れ防止、線を少なめ */
.nstudio-page .preview-actions-title{
  position: relative;
}

.nstudio-page .editor-file-actions details{
  position: relative;
}

.nstudio-page .editor-file-menu{

  padding: 6px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.16) !important;
}

.nstudio-page .editor-file-menu .action-btn{
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  justify-content: flex-start;
}

.nstudio-page .editor-file-menu .action-btn:hover{
  background: var(--accent-light) !important;
  color: var(--accent) !important;
}

.nstudio-page .image-size-panel{
  order: 1;
}
.nstudio-page .preview-actions{
  order: 2;
}


/* フォーム見出しの改行を自然に */
.nstudio-page .section-title p br{
  display: block;
}



/* ファイル選択・AI生成・開く保存は太字にしない */


.nstudio-page .custom-size-range-label{
  color: #777;
  font-size:12px;
  font-weight: 400;
}

.nstudio-page .custom-size-panel input::placeholder{
  color: transparent !important;
}

/* spec guide popup v20260610g */
.spec-guide-link{
  appearance: none;
  margin-left: 8px;
  padding: 2px 8px;
  border: 1px solid rgba(31,79,70,.22);
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font: inherit;
  font-size:12px;
  line-height: 1.4;
  cursor: pointer;
  vertical-align: middle;
}
.spec-guide-link:hover{ background: var(--accent-light); }
.spec-guide-popup{
  position: fixed; inset: 0; display: flex; align-items: center; justify-content: center;
  padding: 18px; background: rgba(0,0,0,.42); z-index: 100000;
}
.spec-guide-box{
    overflow: auto;
  background: #fff; border-radius: 20px; box-shadow: 0 20px 56px rgba(0,0,0,.24); padding: 20px;
}
.spec-guide-head{ display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.spec-guide-head h3{ margin: 0; padding: 0; font-size: 20px; color: var(--ink); }
.spec-guide-close{
  appearance: none; border: 1px solid #cfc7b8; border-radius: 999px; background: #fff;
  color: #222; padding: 7px 13px; font: inherit; font-size: 13px; cursor: pointer;
}
.spec-guide-tabs{  justify-content: center; gap: 10px; margin: 0 0 18px; }
.spec-guide-tab{
  appearance: none; min-width: 110px; border: 1px solid rgba(31,79,70,.2); border-radius: 999px;
  background: #f8f6f0; color: #333; padding: 9px 18px; font: inherit; font-size: 14px; cursor: pointer;
}
.spec-guide-tab.is-active{ background: var(--accent); border-color: var(--accent); color: #fff; }
.spec-guide-list{ display: grid; gap: 14px; }
.spec-guide-card{
  display: grid; grid-template-columns: minmax(160px, 240px) 1fr; gap: 16px; align-items: start;
  padding: 14px; border-top: 1px solid rgba(31,79,70,.14);
}
.spec-guide-card:first-child{ border-top: 0; }
.spec-guide-image{ border-radius: 14px; overflow: hidden; background: #f6f4ef; aspect-ratio: 4 / 3; }
.spec-guide-image img{ display: block; width: 100%; height: 100%; object-fit: contain; }
.spec-guide-text h4{ margin: 0 0 8px; color: var(--accent); font-size: 17px; }
.spec-guide-text p{ margin: 0; color: #444; font-size: 14px; line-height: 1.85; }
@media (max-width: 700px) {
  .spec-guide-box{ padding: 16px; }
  .spec-guide-card{ grid-template-columns: 1fr; }
  .spec-guide-tabs{ justify-content: stretch; }
  .spec-guide-tab{ flex: 1 1 0; min-width: 0; }
}

.spec-guide-tabs{
  display: none !important;
}


.nstudio-page .preview-actions{
  align-items: center !important;
}

.nstudio-page #resetAllEditor,
.nstudio-page .editor-file-actions summary.action-btn{
  min-height: 34px !important;
  padding: 7px 10px !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

.nstudio-page #resetAllEditor i.icon,
.nstudio-page .editor-file-actions summary.action-btn i.icon{
  font-size: 12px !important;
}

.nstudio-page .editor-file-actions{
  
  margin-left: 0 !important;
}


/* final UI polish v20260611k */
.nstudio-page .preview-actions-title{
  display: flex !important;
  flex: 1 0 100%;
  align-items: center;
  margin: 0 0 4px !important;
  color: #6f4b18 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .04em;
}

.nstudio-page .image-size-panel{
  border-top-color: #7aa197 !important;
  
}

.nstudio-page .preview-actions{
  border-top-color: #b98b45 !important;
  background: #fbf7ef !important;
}

.nstudio-page .image-size-title{
  color: #2f6f62 !important;
}

.nstudio-page .editor-file-actions{
  order: 20;
}

.nstudio-page #resetAllEditor{
  order: 19;
}

/* final fixes v20260611l */

/* final fixes v20260612o */
.nstudio-page #toggleCropFit.crop-toggle-active,
.nstudio-page .crop-toggle-active{
  border-color: #1f4f46 !important;
  background: #1f4f46 !important;
  color: #fff !important;
  
  box-shadow: 0 0 0 2px rgba(31,79,70,.16) !important;
}

.nstudio-page #toggleCropFit:not(.crop-toggle-active){
  background: #fff !important;
  border-color: #cfc7b8 !important;
  color: #333 !important;
}



/* final wording/layout fixes v20260612p */


.nstudio-page #toggleCropFit.crop-toggle-active,
.nstudio-page .crop-toggle-active{
  font-weight: 400 !important;
}

.nstudio-page #toggleCropFit.crop-toggle-active span,
.nstudio-page #toggleCropFit span{
  font-weight: 400 !important;
}


/* final sidebar / pole color UI v20260612q */

.nstudio-page .order-layout > aside.panel{
  
  border-color: #e3ded4 !important;
  
  
}

.nstudio-page .sidebar-spec-title{
  
  border-bottom-color: #e5e0d8 !important;
  
  
}

.nstudio-page .order-layout > aside.panel .form-block{
  margin: 0 0 18px !important;
  
  
}

.nstudio-page .order-layout > aside.panel .form-block:last-of-type{
  border-bottom: 0 !important;
}

.nstudio-page .order-layout > aside.panel .option span{

  border-color: #d8d2c8 !important;
  
}


.nstudio-page .order-layout > aside.panel .option small{
  color: #777 !important;
}

.nstudio-page .order-layout > aside.panel .summary{
  
  border-color: #e5e0d8 !important;
  
}

.nstudio-page .spec-guide-link{
  color: #555 !important;
  border-color: #ddd6c8 !important;
  background: #fff !important;
}

.nstudio-page .preview-pole-horizontal{
  background: linear-gradient(180deg, #8a5a34, #6b4325);
}


/* final revert sidebar design v20260612r */
.nstudio-page .order-layout > aside.panel{
  
  
  border-radius: 20px !important;
  
  padding: 24px !important;
}

.nstudio-page .sidebar-spec-title{
  
  border-bottom: 1px solid rgba(31,79,70,.16) !important;

  margin: 0 0 14px !important;
  
}

.nstudio-page .order-layout > aside.panel .form-block{
  
  padding: 0 !important;
  border-bottom: 0 !important;
}

.nstudio-page .order-layout > aside.panel .form-block h3{
  position: relative;
  margin: 0 0 10px !important;
  padding-left: 10px !important;
  color: #222 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .03em !important;
}

.nstudio-page .order-layout > aside.panel .form-block h3::before{
  content: "";
  position: absolute;
  left: 0;
  top: .35em;
  width: 3px;
  height: 1.15em;
  background: var(--accent);
  border-radius: 999px;
}

.nstudio-page .order-layout > aside.panel .form-block h3 *:not(.spec-guide-link){
  color: #222 !important;
}

.nstudio-page .order-layout > aside.panel .option-grid{
  gap: 8px !important;
}

.nstudio-page .order-layout > aside.panel .option span{
  border-radius: 12px !important;
  padding: 12px 10px !important;
  background: #fff !important;
  border: 1px solid var(--line) !important;
  color: #333 !important;
  box-shadow: none !important;
}

.nstudio-page .order-layout > aside.panel .option input:checked + span{
  background: var(--accent-light) !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  box-shadow: none !important;
}

.nstudio-page .order-layout > aside.panel .summary{
  background: #f7f6f2 !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
}

.nstudio-page .order-layout > aside.panel .summary dt{
  color: var(--sub) !important;
}

.nstudio-page .order-layout > aside.panel .summary dd{
  color: var(--ink) !important;
}


.nstudio-page .preview-pole-horizontal,
.nstudio-page .preview-tie{
  background: rgba(255,255,255,.98) !important;
}


/* updates v20260613a */
.nstudio-page .hero-desc-links{
  
  font-size: 14px;
  color: #555;
}
.nstudio-page .hero-desc-links a{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.nstudio-page .editor-file-sep{
  height: 1px;
  margin: 6px 0;
  background: #e5dfd4;
}

.nstudio-page .spec-guide-apply{
  margin-top: 10px;
  appearance: none;
  border: 1px solid var(--accent);
  background: #fff;
  color: var(--accent);
  border-radius: 999px;
  padding: 8px 14px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.nstudio-page .spec-guide-apply:hover{
  background: var(--accent-light);
}

.nstudio-page .luminous-trigger{ cursor: zoom-in; }

/* final fixes v20260613b */
.nstudio-page .upload-placeholder{

  line-height: 1.7 !important;
}


.nstudio-page .editor-file-menu .action-btn,
.nstudio-page .editor-file-menu label.action-btn{
  white-space: nowrap !important;
  word-break: keep-all !important;
}






/* final fixes v20260613c */
.nstudio-page .crop-fit-toggle{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 7px 11px !important;
  border-radius: 8px !important;
  background: #fff !important;
  border: 1px solid #cfc7b8 !important;
  color: #333 !important;
  font-weight: 400 !important;
}

.nstudio-page .crop-fit-toggle .crop-fit-box{
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  border: 1px solid #bdb6aa;
  border-radius: 3px;
  background: #fff;
  position: relative;
}

.nstudio-page .crop-fit-toggle.crop-toggle-active{
  background: #fff !important;
  border-color: #cfc7b8 !important;
  color: #333 !important;
  box-shadow: none !important;
  font-weight: 400 !important;
}

.nstudio-page .crop-fit-toggle.crop-toggle-active .crop-fit-box{
  background: var(--accent);
  border-color: var(--accent);
}

.nstudio-page .crop-fit-toggle.crop-toggle-active .crop-fit-box::after{
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.nstudio-page select{
  -webkit-appearance: menulist !important;
  appearance: menulist !important;
  background-color: #fff !important;
  padding-right: 32px !important;
}


.lum-lightbox,
.lum-lightbox-inner,
.lum-lightbox-loader,
.lum-lightbox-image-wrapper,
.lum-lightbox-position-helper{
  z-index: 500000 !important;
}


/* final fixes v20260613d */

/* final fixes v20260613e */


.nstudio-page #noboriSizeSelect,
.nstudio-page #makuSizeSelect{
  padding-left: 14px !important;
}

.nstudio-page [data-spec-field][style*="display: none"]{
  display: none !important;
}

.nstudio-page .finish-hidden-block{
  display: none !important;
}


/* final fixes v20260613h */
.nstudio-page .order-layout > aside.panel .form-block{
  margin-bottom: 22px !important;
  padding-bottom: 2px !important;
}

.nstudio-page .order-layout > aside.panel .form-block h3{
  margin-bottom: 10px !important;
}

.nstudio-page .custom-size-note{
  grid-column: 1 / -1;
  margin: 3px 0 0 !important;
  color: #888 !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
}


/* final fixes v20260613i */
.nstudio-page .custom-size-panel{
  margin-bottom: 20px !important;
}

.nstudio-page .preview-download-actions{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  background: #fff;
}

.nstudio-page .preview-download-actions .action-btn{
  min-height: 34px !important;
  font-size: 12.5px !important;
}


/* final tweaks v20260613k */
.nstudio-page .crop-row{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.nstudio-page .crop-bleed-check{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  color: #555 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.nstudio-page .crop-bleed-check input[type="checkbox"]{
  margin: 0 !important;
}

/* final tweaks v20260613o */
.nstudio-page #cropBleedCheckWrap{
  display: none;
  margin-left: 0 !important;
}

.nstudio-page .crop-row .crop-fit-toggle{
  order: 1;
}

.nstudio-page .crop-row .crop-bleed-check{
  order: 2;
}


/* responsive width relax v20260613p */
@media (max-width: 1100px){
  .nstudio-page .wrap{
    max-width: none !important;
    width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (max-width: 1024px) {
  .nstudio-page .wrap{
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .nstudio-page .panel,
.nstudio-page .order-layout > aside.panel{
    padding: 12px !important;
    border-radius: 14px !important;
  }

  .nstudio-page .product-type-top{
    padding: 10px !important;
    margin-bottom: 14px !important;
  }

  .nstudio-page .design-shell{
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    min-height: 460px !important;
    height: 68vh !important;
  }

  .nstudio-page .side-toolbar{
    padding: 5px 3px !important;
    gap: 5px !important;
    border-radius: 10px !important;
  }

  .nstudio-page .icon-tool{
    width: 36px !important;
    min-height: 42px !important;
    padding: 5px 2px !important;
    border-radius: 9px !important;
    font-size:12px !important;
  }

  .nstudio-page .canvas-area{
    border-radius: 12px !important;
  }

  .nstudio-page .preview-actions,
.nstudio-page .image-size-panel{
    padding: 10px 8px !important;
    margin-top: 12px !important;
  }
}

@media (max-width: 1024px) {
  .nstudio-page .wrap{
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  .nstudio-page .section{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .nstudio-page .panel,
.nstudio-page .order-layout > aside.panel,
.nstudio-page .preview-panel,
.nstudio-page .product-type-top,
.nstudio-page .preview-actions,
.nstudio-page .image-size-panel,
.nstudio-page .canvas-area{
    border-left: 0 !important;
    border-right: 0 !important;
    box-shadow: none !important;
  }

  .nstudio-page .panel,
.nstudio-page .order-layout > aside.panel{
    padding: 10px 6px !important;
    border-radius: 10px !important;
  }

  .nstudio-page .design-shell{
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    min-height: 450px !important;
    height: 70svh !important;
  }

  .nstudio-page .side-toolbar{
    padding: 5px 3px !important;
    background: #f7f7f5 !important;
    border-radius: 10px !important;
  }

  .nstudio-page .canvas-area{
    border-radius: 8px !important;
  }

  .nstudio-page .preview-actions,
.nstudio-page .image-size-panel{
    border-radius: 8px !important;
    padding: 9px 6px !important;
  }
}


/* final fixes v20260614b */
#content .nstudio-page .hero h1,
.nstudio-page .hero h1{
  font-size: clamp(25px, 3.2vw, 42px) !important;
  line-height: 1.16 !important;
}

.nstudio-page .product-type-top .option span{
  
  
  line-break: strict !important;
}

@media (max-width: 1024px) {
  #content .nstudio-page .hero h1,
.nstudio-page .hero h1{
    font-size: clamp(23px, 6vw, 32px) !important;
  }

  .nstudio-page .product-type-top .option span{
    
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}


/* final fixes v20260614c */
.nstudio-page .hero-desc-links{
  margin-top: 20px !important;
  padding-top: 4px !important;
}


/* AI template tabs/categories v20260614f */

.nstudio-page .ai-template-main{
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #222 !important;
}

.nstudio-page .ai-template-desc{
  font-size: 12px !important;
  color: #555 !important;
  line-height: 1.45 !important;
}

.nstudio-page .ai-template-insert{
  
  margin-top: 2px !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  background: #f2eee6 !important;
  color: #6d4b1f !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* final AI template display tweaks v20260614g */


.nstudio-page .ai-template-insert{
  display: none !important;
}


/* final tweaks v20260614h */









@media (max-width: 1024px) {
  
}










/* final titles tune v20260614n */
.nstudio-page .preview-actions-title,
.nstudio-page .image-size-title{
  font-size: 18px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  letter-spacing: .03em !important;
}



/* final crop/grommet polish v20260615b */
.nstudio-page .image-size-panel{
  gap: 16px 12px !important;
}

.nstudio-page .image-size-panel .crop-row{
  flex: 1 0 100%;
  margin: 0 0 12px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid #e5dfd5 !important;
}

.nstudio-page .image-size-panel .image-size-field{
  margin-top: 4px !important;
}

.nstudio-page #toggleCropFit{
  position: relative !important;
  min-height: 44px !important;
  padding: 9px 48px 9px 14px !important;
  border-width: 2px !important;
  border-style: solid !important;
  border-color: #b9b9b9 !important;
  background: #fff !important;
  color: #555 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7) !important;
}

.nstudio-page #toggleCropFit::after{
  content: "OFF";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  min-width: 32px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #e6e6e6;
  color: #555;
  font-size:12px;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
}


.nstudio-page .preview-grommets{
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
}

.nstudio-page .preview-grommet{
  position: absolute;
  display: block;
  border-radius: 50%;
  background: radial-gradient(circle at center, #ffffff 0 35%, #f3f3f3 36% 58%, #8f877d 59% 72%, rgba(255,255,255,.94) 73% 100%);
  border: 1px solid rgba(60,52,45,.35);
  box-shadow: 0 1px 2px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.7);
}


/* final natural crop active + inset grommets v20260615c */
.nstudio-page #toggleCropFit.crop-toggle-active{
  border-color: #b79b5b !important;
  background: #fbf6ea !important;
  color: #4c3a20 !important;
  box-shadow: 0 0 0 3px rgba(183,155,91,.16), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.nstudio-page #toggleCropFit.crop-toggle-active::after{
  content: "ON" !important;
  background: #8a6d35 !important;
  color: #fff !important;
}

.nstudio-page #toggleCropFit.crop-toggle-active i.icon,
.nstudio-page #toggleCropFit.crop-toggle-active span{
  color: #4c3a20 !important;
}


/* inline preview from existing preview DOM v20260615e */
.nstudio-page #previewModePanel.is-capture-active{
  display: block !important;
  position: fixed !important;
  left: -10000px !important;
  top: 0 !important;
  width: 640px !important;
  max-width: 640px !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.nstudio-page .inline-mockup-preview{
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid rgba(31,79,70,.16);
}

.nstudio-page .inline-mockup-preview-head{
  display: flex;
  align-items: center;
  
  gap: 12px;
  margin: 0 0 10px;
  color: #333;
  font-size: 13px;
  font-weight: 700;
}

.nstudio-page .inline-mockup-preview-head span{
  color: #8a867c;
  font-size:12px;
  font-weight: 600;
}

.nstudio-page .inline-mockup-preview-body{
  width: 100%;
  max-width: 240px;
  
  border-radius: 14px;
  
  padding: 8px;
}

.nstudio-page .inline-mockup-preview-body img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
}


/* final preview/bg/button/lightbox tweaks v20260615f */

.nstudio-page .preview-display-stage{
  background: #dedede !important;
}

.nstudio-page #previewModePanel.is-capture-active .preview-display-shell,
.nstudio-page #previewModePanel.is-capture-active .preview-display-stage{
  background: #dedede !important;
}


.nstudio-page .inline-mockup-preview-head span{
  display: none !important;
}

.nstudio-page .inline-mockup-preview-body{
  display: block;
  border: 1px solid #d0c8bb !important;
  cursor: zoom-in;
  text-align: left;
  text-decoration: none;
}

.nstudio-page .inline-mockup-preview-body:hover{
  border-color: #9f9586 !important;
  background: #eee9df !important;
}

.nstudio-page .inline-mockup-preview-option-note{
  max-width: 240px;
  margin-top: 6px;
  color: #777;
  font-size:12px;
  line-height: 1.45;
  
}

/* final luminous + button colors v20260615g */
.nstudio-page .main-upload{
  background: #6f4b18 !important;
  border-color: #6f4b18 !important;
  color: #fff !important;
}

.nstudio-page .main-upload:hover{
  background: #5f3f14 !important;
  border-color: #5f3f14 !important;
  color: #fff !important;
}

.nstudio-page .inline-mockup-preview-body{
  background: #f6f4ee;
}

.nstudio-page .inline-mockup-preview-body img{
  pointer-events: none;
}


/* final mini preview layout v20260615h */
.nstudio-page .inline-mockup-preview{
  text-align: center !important;
}

.nstudio-page .inline-mockup-preview-head{
  justify-content: center !important;
  text-align: center !important;
}

.nstudio-page .inline-mockup-preview-body{
  margin-left: auto !important;
  margin-right: auto !important;
}

.nstudio-page .inline-mockup-preview-option-note{
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

@media (max-width: 1024px) {
  .nstudio-page .inline-mockup-preview{
    display: none !important;
  }
}

/* editor toolbar layout v20260615m */
.nstudio-page .editor-mode-row{
  display: flex;
  align-items: center;
  
  
  flex-wrap: wrap;
  margin: 0 0 12px;
}

.nstudio-page .editor-mode-row .editor-mode-switch{
  margin: 0 !important;
}

.nstudio-page .editor-mode-actions{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  margin-left: auto;
}

.nstudio-page .upload-main-row{
  display: flex;
  justify-content: center;
  align-items: center;
  
}

.nstudio-page .main-upload-prominent{
  width: min(100%, 380px);
  
  border-radius: 14px !important;
  font-size: 15px !important;
  
  
}

.nstudio-page .preview-actions{
  display: none !important;
}

@media (max-width: 1024px) {
  .nstudio-page .editor-mode-row{
    align-items: stretch;
  }
  .nstudio-page .editor-mode-row .editor-mode-switch,
.nstudio-page .editor-mode-actions{
    width: 100%;
    justify-content: center;
    margin-left: 0;
  }
  .nstudio-page .editor-mode-actions .action-btn,
.nstudio-page .editor-mode-actions .editor-file-actions,
.nstudio-page .editor-mode-actions .editor-file-actions details{
    flex: 1 1 auto;
  }
  .nstudio-page .editor-mode-actions summary.action-btn{
    width: 100%;
  }
}


/* upload button lower + normal weight v20260615n */
.nstudio-page .upload-main-row{
  margin: 14px 0 14px !important;
}

.nstudio-page .main-upload-prominent{
  font-weight: 400 !important;
  box-shadow: 0 5px 14px rgba(111,75,24,.12) !important;
}

.nstudio-page .upload-main-row{
  flex-direction: column;
  
}

.nstudio-page .upload-main-row #resetView{
  order: -1;
}

.nstudio-page .preview-sewing-guides{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
}

.nstudio-page .preview-sewing-guide-line{
  position: absolute;
  left: 0;
  width: 100%;
  
}

/* noren admin fixes v20260615b */
.nstudio-page .product-type-top .option-grid{
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)) !important;
}
.nstudio-page .product-type-top .option span{
  
  align-items: center !important;
  justify-content: center !important;
  min-height: 54px !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  font-size: 14.5px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}
.nstudio-page.is-type-noren .preview-pole-horizontal{
  background: linear-gradient(180deg, #8a5a34, #5b351d) !important;
}
@media (max-width: 1024px) {
  .nstudio-page .product-type-top .option-grid{
    grid-template-columns: 1fr !important;
  }
  .nstudio-page .product-type-top .option span{
    min-height: 46px !important;
    font-size: 14px !important;
  }
}


/* noren fixes v20260615d */
.nstudio-page .preview-noren-splits,
.nstudio-page .preview-panel-splits{
  display: block !important;
  z-index: 12 !important;
}

.nstudio-page .preview-noren-split-line,
.nstudio-page .preview-panel-split-line{
  display: block !important;

}

.nstudio-page select,
.nstudio-page .order-layout > aside.panel select,
.nstudio-page #noboriSizeSelect,
.nstudio-page #makuSizeSelect,
.nstudio-page #norenSizeSelect{
  -webkit-appearance: none !important;
  appearance: none !important;
  background-color: #fff !important;
  background-image:
    linear-gradient(45deg, transparent 50%, #444 50%),
    linear-gradient(135deg, #444 50%, transparent 50%) !important;
  background-position:
    calc(100% - 24px) 50%,
    calc(100% - 18px) 50% !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: no-repeat !important;
  padding-right: 44px !important;
}

.nstudio-page #noboriSizeSelect,
.nstudio-page #makuSizeSelect,
.nstudio-page #norenSizeSelect{
  padding-left: 14px !important;
}



.spec-guide-box{
  width: 100%;
  max-width: 860px;
  max-height: 86vh;
}

/* 古いSafariで display:none の file input を label クリックしても反応しない場合の回避 */
.tool-upload input[type="file"],
.main-upload input[type="file"],
.editor-file-actions input[type="file"]{
  display: block !important;
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  overflow: hidden !important;
}

/* final refinements v20260616b */
.nstudio-page .editor-file-menu{
  right: 0 !important;
  left: auto !important;
  min-width: 210px !important;
  max-width: calc(100vw - 32px) !important;
}

@media (max-width: 1024px) {
  .nstudio-page .editor-file-actions details{
    position: static !important;
  }
  }


.nstudio-page .upload-main-row #resetView{
  margin-bottom: 8px !important;
}

.nstudio-page .preview-sewing-guide-line{
  border-top: 1px dashed rgba(145,145,145,.34) !important;
}
.nstudio-page .preview-sewing-guide-line.is-vertical{
  width:0 !important;
  border-top:0 !important;
  border-left:1px dashed rgba(145,145,145,.34) !important;
}

.nstudio-page .preview-noren-split-line,
.nstudio-page .preview-panel-split-line{
  width: var(--nstudio-piece-line-width, 2px) !important;
  transform: translateX(var(--nstudio-piece-line-shift, -1px));
  background: var(--nstudio-piece-line-color, #dedede) !important;
  box-shadow: none !important;
}


/* preview seam fix v20260616g */
.nstudio-page .preview-cloth-image{
  left: -1px !important;
  top: -1px !important;
  width: calc(100% + 2px) !important;
  height: calc(100% + 2px) !important;
  max-width: none !important;
  max-height: none !important;
}


/* mobile spacing refinements v20260616i */
.nstudio-page .upload-main-row{
  margin-top: 24px !important;
  margin-bottom: 26px !important;
  gap: 14px !important;
}

.nstudio-page .main-upload-prominent{
  min-height: 58px !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

@media (max-width: 1024px) {
  .nstudio-page .order-layout{
    gap: 38px !important;
  }

  .nstudio-page .preview-panel{
    margin-top: 12px !important;
    padding-top: 16px !important;
    padding-bottom: 18px !important;
  }

  .nstudio-page .preview-head{
    margin-top: 4px !important;
    margin-bottom: 18px !important;
  }

  .nstudio-page .editor-mode-row{
    margin-top: 12px !important;
    margin-bottom: 18px !important;
    row-gap: 12px !important;
  }

  .nstudio-page .design-shell{
    margin-top: 14px !important;
    margin-bottom: 18px !important;
  }

  .nstudio-page .upload-main-row{
    margin-top: 26px !important;
    margin-bottom: 28px !important;
    gap: 14px !important;
  }

  .nstudio-page .main-upload-prominent{
    min-height: 60px !important;
    padding-top: 17px !important;
    padding-bottom: 17px !important;
  }

  .nstudio-page .image-size-panel,
.nstudio-page .inline-mockup-preview{
    margin-top: 18px !important;
    margin-bottom: 18px !important;
  }

  .nstudio-page .preview-download-actions{
    margin-top: 14px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}


/* final mobile file dropdown + ai history visibility v20260616k */
@media (max-width: 1024px){
  .nstudio-page .editor-file-actions,
.nstudio-page .editor-file-actions details{
    position: relative !important;
    overflow: visible !important;
  }
  .nstudio-page .editor-file-menu{
    position: absolute !important;
    left: auto !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    bottom: auto !important;
    z-index: 9999 !important;
    width: min(82vw, 260px) !important;
    min-width: 220px !important;
    max-width: calc(100vw - 24px) !important;
    margin-top: 0 !important;
  }
}


/* canvas touch upload / bleed note / nobori pole fix v20260616n */
.nstudio-page .canvas-bleed-note{
  margin: 10px auto 0;
  max-width: 520px;
  text-align: center;
  color: #777;
  font-size: 12px;
  line-height: 1.6;
}

.nstudio-page.is-type-nobori .preview-pole-horizontal{
  height: 3px !important;
  border-radius: 0 !important;
}

@media (max-width: 1024px) {
  .nstudio-page .canvas-bleed-note{
    margin-top: 12px;
    margin-bottom: 4px;
    font-size: 12px;
  }
}


.nstudio-page .nstudio-image-adjust-section{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #d7e3e8;
}
.nstudio-page .nstudio-image-adjust-section.is-hidden{ display: none; }
.nstudio-page .nstudio-image-adjust-heading{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #39515b;
}
.nstudio-page .nstudio-image-adjust-note{
  margin: 0 0 8px;
  font-size:12px;
  line-height: 1.55;
  color: #5e7077;
}
.nstudio-page .nstudio-image-adjust-note.is-error{ color: #9c3b3b; }


.nstudio-page .nstudio-svg-color-input{

  min-width: 0;
}

.nstudio-page .nstudio-svg-color-input code{
  display: inline-block;
  
  overflow: hidden;
  text-overflow: ellipsis;
  
  color: #4f626a;
}
.nstudio-page .nstudio-bgremove-toggle{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 700;
  color: #415961;
}
.nstudio-page .nstudio-bgremove-fields{
  display: grid;
  gap: 10px;
  
}
.nstudio-page .nstudio-bgremove-fields.is-hidden{ display: none; }
.nstudio-page .nstudio-bgremove-row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.nstudio-page .nstudio-bgremove-field{
  display: grid;
  gap: 5px;
}
.nstudio-page .nstudio-bgremove-field label,
.nstudio-page .nstudio-bgremove-subactions label{
  font-size:12px;
  font-weight: 700;
  color: #4f626a;
}

.nstudio-page .nstudio-bgremove-field input[type="color"]{
  width: 54px;
  height: 34px;
  padding: 0;
  border: 1px solid #cfdce2;
  border-radius: 7px;
  background: #fff;
}
.nstudio-page .nstudio-bgremove-subactions{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.nstudio-page .nstudio-bgremove-subactions .action-btn{
  padding: 8px 10px;
}
.nstudio-page .nstudio-adjust-status{
  margin-top: 8px;
  font-size:12px;
  line-height: 1.55;
  color: #5e7077;
}
.nstudio-page .nstudio-adjust-status.is-error{ color: #9c3b3b; }


.nstudio-page .nstudio-image-adjust-subpanel{ margin-top: 10px; }
.nstudio-page .nstudio-image-adjust-subpanel.is-hidden{ display: none !important; }
.nstudio-page .nstudio-adjust-kind{
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #cbd9df;
  border-radius: 999px;
  background: #fff;
  color: #52666f;
  font-size:12px;
  font-weight: 700;
  white-space: nowrap;
}


/* ---- original style block boundary ---- */






.nstudio-summary .inline-mockup-preview{margin:14px 0 0!important;padding:14px 0 0!important;border-top:1px solid #e6e1d8!important}
.nstudio-summary .inline-mockup-preview-head{justify-content:flex-start!important;margin-bottom:8px!important;font-size:12px!important}
.nstudio-summary .inline-mockup-preview-body{max-width:none!important;width:100%!important;margin:0!important;padding:6px!important;border-radius:9px!important}
.nstudio-summary .inline-mockup-preview-body img{width:100%!important;max-height:260px!important;object-fit:contain!important;border-radius:6px!important}
.nstudio-summary .inline-mockup-preview-option-note{max-width:none!important;margin:5px 0 0!important;text-align:left!important;font-size:12px!important}
@media(max-width:1024px){.nstudio-page .nstudio-summary .inline-mockup-preview{display:block!important}}

.nstudio-project-status{display:flex;align-items:center;gap:5px;color:#777;font-size:12px}
.nstudio-project-status i{font-size:12px;color:#6f857d;margin:0!important}
.nstudio-project-status.is-saving i{animation:nstudioSpin 1s linear infinite}

.nstudio-cloud-saved-link{display:none;width:100%;padding:7px 9px;border-radius:7px;background:#f7f7f5;font-size:12px;color:#5f6663;word-break:break-all}
.nstudio-cloud-saved-link.is-visible{display:block}

.nstudio-editor-history-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.nstudio-editor-history-actions .action-btn[disabled]{opacity:.38;cursor:default;pointer-events:none}
@keyframes nstudioSpin{to{transform:rotate(360deg)}}
@media(max-width:700px){

  .nstudio-editor-history-actions{width:100%;justify-content:flex-end}
}

/* ---- original style block boundary ---- */

/* ===== NUNO STUDIO UI v20: consolidated column / sidebar styling ===== */
.nstudio-page{
  --ns-spec:#356b5f;
  --ns-editor:#3f6688;
  --ns-design:#765f82;
  --ns-dimension:#4d6f91;
  --ns-dimension-bg:#f1f5f9;
  --ns-construction:#90652f;
  --ns-construction-bg:#fbf5ea;
  --ns-visual:#477469;
  --ns-visual-bg:#eff6f3;
  --ns-asset:#557797;
  --ns-asset-bg:#f0f5f8;
  
  
}

/* 3カラムのトップ見出し：背景・外枠・左線を使わず文字だけで統一 */
.nstudio-page .nstudio-column-heading{
  display:flex!important;
  align-items:flex-start!important;
  min-height:0!important;
  margin:0 0 18px!important;
  padding:2px 1px 9px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  text-align:left!important;
}
.nstudio-page .nstudio-column-heading-copy{min-width:0}
.nstudio-page .nstudio-column-heading strong,
.nstudio-page .nstudio-column-heading h3{

  margin:0!important;
  padding:0!important;
  font-size:22px!important;
  line-height:1.3!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
}
.nstudio-page .nstudio-column-heading strong .icon,
.nstudio-page .nstudio-column-heading h3 .icon{margin:0!important;opacity:.88}
.nstudio-page .nstudio-column-heading small{
  display:block!important;
  margin-top:4px!important;
  color:#69756f!important;
  font-size:13px!important;
  line-height:1.5!important;
  font-weight:500!important;
}
.nstudio-page .nstudio-column-heading-spec strong{color:var(--ns-spec)!important}
.nstudio-page .nstudio-column-heading-editor h3{color:var(--ns-editor)!important}
.nstudio-page .nstudio-column-heading-design strong{color:var(--ns-design)!important}
.nstudio-page .sidebar-spec-title{letter-spacing:normal!important;}
.nstudio-page .nstudio-design-sidebar-head{border:0!important;background:transparent!important}

/* 上部：タイトル・商品・現在仕様・テンプレート・保存を1つのまとまりに */
.nstudio-page .nstudio-top-control-section{
  margin:0 0 18px!important;
  padding:16px 18px!important;
  border:0!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 5px 22px rgba(38,55,50,.055)!important;
}
.nstudio-page .nstudio-top-control-section .product-type-top{
  margin:0!important;padding:0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
}

.nstudio-page .nstudio-project-status{font-size:12px!important}

/* NUNO STUDIO タイトル */
.nstudio-page .nstudio-mode-heading{gap:12px!important;}
.nstudio-page .nstudio-mode-title{letter-spacing:.045em!important;}

/* WordPress管理バー実測オフセットはドロワーだけに適用 */
.nstudio-page .nstudio-side-drawer{
  top:var(--nstudio-fixed-top-offset,0px)!important;
  height:calc(100dvh - var(--nstudio-fixed-top-offset,0px))!important;
  max-height:calc(100vh - var(--nstudio-fixed-top-offset,0px))!important;
  border-left:0!important;
}
.nstudio-page .nstudio-drawer-backdrop{
  top:var(--nstudio-fixed-top-offset,0px)!important;
  height:calc(100dvh - var(--nstudio-fixed-top-offset,0px))!important;
}

/* サイズは幅／高さとも同じ canonical number field を使う。 */
.nstudio-page .spec-field-size .custom-size-panel{grid-template-columns:minmax(0,1fr)!important;gap:9px!important}
.nstudio-page .spec-field-size .custom-size-panel>.image-size-field{
  min-width:0!important;width:100%!important;display:grid!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  align-items:center!important;column-gap:10px!important;row-gap:6px!important;
}
.nstudio-page .spec-field-size .custom-size-panel>.image-size-field>.image-size-label-row{min-width:0!important;margin:0!important}
.nstudio-page .spec-field-size .custom-size-panel>.image-size-field>.image-size-input-wrap{min-width:0!important;width:auto!important;max-width:100%!important}
.nstudio-page .spec-field-size .custom-size-panel>.image-size-field>.nstudio-piece-inputs{grid-column:1 / -1!important}
.nstudio-page .spec-field-size .custom-size-note{grid-column:1!important}

/* 業務画面っぽい輪郭を弱め、選択状態だけ分かるようにする */
.nstudio-page .order-layout>aside.panel,
.nstudio-page .preview-panel,
.nstudio-page .nstudio-design-sidebar{border-color:rgba(57,81,73,.07)!important;box-shadow:0 7px 26px rgba(31,52,45,.035)!important}
.nstudio-page .order-layout>aside.panel,
.nstudio-page .nstudio-design-sidebar{background:#fff!important}
.nstudio-page .option span,
.nstudio-page .nstudio-type-grid .option span{border-color:transparent!important;background:#f6f8f7!important;box-shadow:inset 0 0 0 1px rgba(65,88,81,.045)!important}
.nstudio-page .option input:checked+span,
.nstudio-page .nstudio-type-grid .option input:checked+span{border-color:transparent!important;background:#edf5f2!important;box-shadow:inset 0 0 0 1px rgba(71,117,104,.24)!important}
.nstudio-page .action-btn:not(.primary):not(.nstudio-preview-save-trigger),
.nstudio-page .icon-tool,
.nstudio-page .nstudio-drawer-close{border-color:transparent!important;background:#f5f7f6!important;box-shadow:inset 0 0 0 1px rgba(65,88,81,.045)!important}
.nstudio-page .action-btn:not(.primary):not(.nstudio-preview-save-trigger):hover,
.nstudio-page .icon-tool:hover,
.nstudio-page .nstudio-drawer-close:hover{background:#eef3f1!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-dropzone{border-color:rgba(150,129,101,.25)!important;}
.nstudio-page .nstudio-background-feature-card:not([data-nstudio-background-theme]){border-color:transparent!important;}
.nstudio-page .nstudio-side-drawer-head{border-bottom-color:rgba(63,82,76,.07)!important;background:#fbfcfb!important}


/* 左：仕様。外枠線ではなく背景面と見出し色で区切る */
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"]{background:var(--ns-dimension-bg)!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"] .spec-block-title{background:transparent!important;}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.edgeFinish"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.type"],
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-pocket-spec,
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-tie-spec{background:var(--ns-construction-bg)!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.edgeFinish"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.type"] .spec-block-title{background:#f1e4d0!important;}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="designEnabled"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="baseColor.color"]{background:var(--ns-visual-bg)!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="designEnabled"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="baseColor.color"] .spec-block-title{background:#deeee8!important;}
.nstudio-page .order-layout>aside.panel:first-of-type .spec-block-title{
  min-height:38px!important;margin:0 0 11px!important;padding:8px 10px!important;
  border:0!important;border-radius:7px!important;font-size:14px!important;line-height:1.4!important;font-weight:850!important;
}
.nstudio-page .order-layout>aside.panel:first-of-type label,
.nstudio-page .order-layout>aside.panel:first-of-type .image-size-label-row,
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-auto-split-toggle,
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-tie-check{font-size:13px!important;line-height:1.5!important}
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-field-note,
.nstudio-page .order-layout>aside.panel:first-of-type .custom-size-note{margin-top:8px!important;color:#687570!important;font-size:12px!important;line-height:1.65!important}
.nstudio-page .order-layout>aside.panel:first-of-type .option span{min-height:42px!important;padding:9px 10px!important;font-size:13px!important;line-height:1.4!important}
.nstudio-page .order-layout>aside.panel:first-of-type input,
.nstudio-page .order-layout>aside.panel:first-of-type select,
.nstudio-page .order-layout>aside.panel:first-of-type button{font-size:13px!important}

/* 右：デザイン。同種機能は同系色、左アクセント線は使わない */
.nstudio-page .nstudio-design-sidebar>.nstudio-design-quick-card,
.nstudio-page .nstudio-design-sidebar>.nstudio-selected-adjust-wrap{margin-bottom:15px!important}
.nstudio-page .nstudio-design-quick-card{
  padding:13px!important;border:0!important;border-radius:11px!important;box-shadow:none!important;
}
.nstudio-page .nstudio-design-quick-color{background:var(--ns-visual-bg)!important}
.nstudio-page .nstudio-design-quick-upload{background:var(--ns-asset-bg)!important}

.nstudio-page .nstudio-design-quick-heading{margin-bottom:10px!important;gap:9px!important}
.nstudio-page .nstudio-design-quick-heading strong{font-size:14px!important;line-height:1.4!important;font-weight:850!important}
.nstudio-page .nstudio-design-quick-heading small{margin-top:2px!important;color:#687570!important;font-size:12px!important;line-height:1.5!important}


.nstudio-page .nstudio-design-sidebar .image-size-panel,
.nstudio-page .nstudio-design-sidebar .image-size-field,
.nstudio-page .nstudio-design-sidebar label{font-size:12px!important;line-height:1.55!important}
.nstudio-page .nstudio-design-sidebar .action-btn,
.nstudio-page .nstudio-design-sidebar button{min-height:38px;font-size:12px!important}

/* 選択中調整：表示可否は nstudio-ui-control.js。CSSは配置と見た目だけ。 */
.nstudio-page .nstudio-selected-adjust-wrap.is-active{
  order:-10!important;margin:0 0 15px!important;padding:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}

.nstudio-page .nstudio-image-size-grid,
.nstudio-page .nstudio-image-position-grid{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:9px!important;align-items:start!important}
.nstudio-page #nstudioRightAdjustMount .image-size-input-wrap{max-width:100%!important}
.nstudio-page #nstudioRightAdjustMount .image-size-label-row{gap:5px!important}
.nstudio-page #nstudioRightAdjustMount .fit-cloth-btn{padding:3px 6px!important;min-height:26px!important;font-size:12px!important}

/* SVG配色UI：変更色だけを横並び */
.nstudio-page .nstudio-svg-color-grid{display:flex!important;flex-wrap:wrap!important;gap:7px!important}
.nstudio-page .nstudio-svg-color-compact{display:block!important;min-width:0!important}
.nstudio-page .nstudio-svg-color-input{display:inline-flex!important;align-items:center!important;gap:5px!important;border:0!important;border-radius:7px!important;background:#f4f6f5!important;}
.nstudio-page .nstudio-svg-color-input input[type="color"]{width:64px!important;min-width:64px!important;height:36px!important;padding:0!important;border:1px solid #cfdce2!important;border-radius:7px!important;background:#fff!important;cursor:pointer!important}
.nstudio-page .nstudio-svg-color-input code{min-width:0!important;font-size:12px!important}



.nstudio-page .nstudio-side-drawer-head small{font-size:12px!important;line-height:1.45!important}
.nstudio-page .nstudio-side-drawer:not(.is-open){box-shadow:none!important}
.nstudio-page .nstudio-side-drawer.is-open{box-shadow:-16px 0 40px rgba(23,38,33,.11)!important}
.nstudio-page.is-nstudio-embed{overflow-x:clip!important}
.nstudio-page.is-nstudio-embed .order-layout>.nstudio-design-sidebar,
.nstudio-page.is-nstudio-embed .preview-panel{box-shadow:none!important}



.nstudio-page .nstudio-background-inline-heading{display:flex;align-items:center;gap:7px;margin:0 0 9px;color:#43564f;font-size:12px}
.nstudio-page .nstudio-background-inline-heading i{margin:0!important;color:#64776f}
.nstudio-page .nstudio-background-inline-mount{display:block!important;width:100%!important;min-width:0!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-design-panel{display:grid!important;width:100%!important;min-width:0!important;}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-feature-card{margin:0!important;border-radius:9px!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-feature-head{min-height:44px!important;padding:8px 9px!important;gap:7px!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-feature-icon{width:24px!important;height:24px!important;flex-basis:24px!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-feature-copy strong{font-size:12px!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-feature-copy small{display:none!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-settings-heading{display:none!important}
































/* 素材選択drawerの共通レイアウト */













.nstudio-page .nstudio-svg-color-input{cursor:pointer!important;padding:5px 7px!important}
.nstudio-page .nstudio-svg-color-input input[type=color]{display:block!important;width:64px!important;min-width:64px!important;height:36px!important;padding:0!important;border:1px solid #cfdce2!important;border-radius:7px!important;background:#fff!important;cursor:pointer!important}


















.nstudio-page .order-layout>.nstudio-spec-sidebar{padding:14px!important;box-sizing:border-box!important}
@media (min-width:1025px){
  .nstudio-page .order-layout>#nstudioDesignSidebar{padding:14px!important;box-sizing:border-box!important}
}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-design-panel{gap:12px!important}
.nstudio-page .nstudio-background-inline-mount .nstudio-background-option-section{padding:12px 10px 14px!important;background:#fff!important}

















/* ---- original style block boundary ---- */

        /* 完成イメージは確認専用。編集系アクションは隠す */
        .nstudio-page.is-preview-mode .nstudio-editor-history-actions{ display:none !important; }
        

/* ---- original style block boundary ---- */

.preview-background-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 14px;
}
.preview-background-modes{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.preview-background-modes .action-btn.is-active{
  background:#222;
  color:#fff;
  border-color:#222;
}
.preview-solid-bg-picker{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#555;
}
.preview-solid-bg-picker input[type=color]{
  width:42px;
  height:32px;
  border:1px solid #ccc;
  border-radius:6px;
  padding:2px;
  background:#fff;
  cursor:pointer;
}

.preview-submode-bar{
  margin:0 0 14px;
  padding:11px 12px 12px;
  border:1px solid #bdd5e4;
  border-radius:10px;
  background:#eef7fc;
  box-shadow:0 1px 4px rgba(47,91,118,.08);
}
.preview-submode-title{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:9px;
  color:#315f7a;
  font-size:13px;
  font-weight:800;
}
.preview-submode-bar .preview-background-toolbar{
  margin:0;
}
.nstudio-page .preview-submode-bar .preview-background-modes .action-btn{
  border-color:#9ebfd2 !important;
  background:#fff !important;
  color:#315f7a !important;
  font-weight:700 !important;
}
.nstudio-page .preview-submode-bar .preview-background-modes .action-btn:hover{
  background:#e2f0f8 !important;
}
.nstudio-page .preview-submode-bar .preview-background-modes .action-btn.is-active{
  border-color:#3f7898 !important;
  background:#4d87a8 !important;
  color:#fff !important;
}
.nstudio-editor-history-actions .nstudio-export-dropdown{
  position:relative;
  overflow:visible;
}
.nstudio-editor-history-actions .nstudio-export-dropdown > summary.action-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  list-style:none;
  cursor:pointer;
}
.nstudio-editor-history-actions .nstudio-export-dropdown > summary.action-btn::-webkit-details-marker{ display:none; }
.nstudio-editor-history-actions .nstudio-export-dropdown > summary.action-btn::after{
  content:"▼";
  margin-left:3px;
  font-size:12px;
  opacity:.65;
}
.nstudio-editor-history-actions .nstudio-export-dropdown > .editor-file-menu{
  position:absolute;
  left:0;
  right:auto;
  top:calc(100% + 6px);
  bottom:auto;
  z-index:10000;
  min-width:210px;
}
@media (max-width:700px) {
  .preview-submode-bar .preview-background-toolbar{ align-items:flex-start; }
  .preview-submode-bar .preview-solid-bg-picker{ width:100%; }
  .nstudio-editor-history-actions .nstudio-export-dropdown > .editor-file-menu{ left:auto; right:0; }
}

/* 位置固定 & ドラッグしやすい見た目 */
#ctrls-box{

top: 0;
left: 0;
background: #eee;
padding: 8px;
padding-bottom:20px;
border-radius: 6px;
box-shadow: 0 2px 6px rgba(0,0,0,0.2);
cursor: move;

display:none;
opacity:0.95;
min-width:180px;
}

#ctrls-box button{
margin: 3px;
font-size: 14px;
}
#ctrls-box button:hover{
background: #ccc;
opacity: 0.8;
}

.smbtnbox button{
cursor: pointer;
}

#bgstagebox{
max-width:none;
width:100%;
margin:0 auto 30px;
display:none;
}
#bgstage{
width:100%;
max-width:100%;
position:relative;
overflow:hidden;
}
#bgstage canvas{
display:block;
max-width:100%;
box-sizing:border-box;
}
#previewBgShell{
height:auto;
min-height:0;
overflow:visible;
border:0;
background:transparent !important;
}

/* Background simulator actions must remain one row even when the simulator's
 * legacy/external presentation tries to make each label a block. */
#previewBgShell .bgbtnbox{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:stretch!important;
  gap:8px!important;
  width:100%!important;
  margin-top:15px;
  margin-bottom:20px;
}

#previewBgShell .bgbtnbox label{
  display:flex!important;
  flex:1 1 0!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding:16px 8px!important;
  box-sizing:border-box!important;
  font-size:12pt;
  white-space:nowrap!important;
}

.bgbtnbox label:hover{
cursor: pointer;
}
.bgdesc{
color: #666;
  font-size:14px;
  margin-bottom:20px;
}

#maguchiHost{
max-width:800px;
margin: 0 auto;
margin-bottom:50px;
}


#ctrls-box{
position: absolute;
z-index: 9999;
touch-action: none;
-webkit-user-select: none;
user-select: none;
}
#ctrls-box button{
touch-action: none;
}

.bg-upload,
.bgpopup{
display: block;
padding: 12px;
  margin-bottom: 10px;
background: #666;
color: #fff;
  text-align: center;
  border-radius: 6px;
  font-size: 14px;
}
.bg-upload input{
display: none;
}

.mode-switch{
display: flex;
gap: 6px;
margin: 0;
  margin-bottom:15px;
}

#ctrls-box .mode-btn{
flex: 1;
padding: 10px 10px;
font-size: 16px;
border-radius: 0px;
border: 0px solid #666;
background: none;
color: #333;
font-weight: normal;
touch-action: manipulation;
border-bottom: 2px solid #ccc;
}


#ctrls-box .mode-btn.active{
color: #000;
border-color: #cc6633;
font-weight: bold;
}

#ctrls-box .mode-btn:disabled{
opacity: 1;
cursor: default;
}

#ctrls-box button:hover,
#ctrls-box label:hover{
cursor:pointer;
}

#ctrls-box.collapsed #noren-controls,
#ctrls-box.collapsed #bg-controls,
#ctrls-box.collapsed .bgimgbox,
#ctrls-box.collapsed .mode-switch{
display: none !important;
}


#ctrls-box.collapsed{
padding-bottom: 0px;
}

#noren-controls,
#bg-controls{
line-height:1;
text-align:center;
}

#ctrls-box .icon{
pointer-events: none;
}

.bgimgbox{
  margin-top:20px;
}

@media screen and (max-width: 770px) {
#ctrls-box{
padding:0;
}
#ctrls-handle{
margin:0;
}
.bg-upload,
.bgpopup{
margin:5px;
}
#ctrls-box.collapsed #ctrls-handle{
border: 1px solid #000;
}
}

#ctrls-handle{
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 10px;
margin-bottom: 0px;
background: linear-gradient(#f7f7f7, #ededed);
border-bottom: 1px solid #ccc;
font-size: 14px;
font-weight: 600;
color: #333;
cursor: grab;
user-select: none;
}

#ctrls-handle:active{
cursor: grabbing;
}

#ctrls-toggle.panel-toggle{
display: flex;
align-items: center;
gap: 4px;
padding: 6px 12px;
background: #fff;
border: 1px solid #bbb;
border-radius: 6px;
font-size: 12px;
font-weight: 500;
color: #333;
cursor: pointer;
}

#ctrls-toggle.panel-toggle:active{
background: #e6e6e6;
}

#ctrls-toggle .icon{
pointer-events: none;
}


        

/* ---- original style block boundary ---- */

/* ===== NStudio UI overrides ===== */

.nstudio-page{ background: #fff;  padding-bottom: 36px; }

.nstudio-mode-heading{ margin: 0 0 14px; text-align: center; }
.nstudio-mode-title{ color: #49382b; font-size: clamp(22px, 2.8vw, 32px); font-weight: 900; line-height: 1.1; letter-spacing: .055em; }
.nstudio-mode-tagline{ margin-top: 5px; color: #76685d; font-size: 14px; font-weight: 600; }

.nstudio-page #nstudio-editor{ padding-top: 24px; }
.nstudio-page .product-type-top{ max-width: none !important;      box-shadow: 0 4px 16px rgba(33,52,48,.04) !important; }
.nstudio-page .nstudio-type-grid{ max-width: none !important; grid-template-columns: repeat(3, 1fr) !important; }
.nstudio-page .product-type-top .option span{ display: flex !important; align-items: center; justify-content: center; gap: 6px; min-height: 48px; border-color: #d7dfdd !important; border-radius: 10px !important; background: #fff !important; font-weight: 700; }
.nstudio-page .product-type-top .option input:checked + span{ border-color: #4f7b71 !important; background: #edf4f2 !important; color: #285148 !important; box-shadow: inset 0 0 0 1px #4f7b71; }


.nstudio-page .nstudio-product-name{ color: #263633; font-size: 15px; white-space: normal; word-break: break-word; }

.nstudio-page .order-layout > aside.panel{ border: 1px solid #dbe4e1 !important; background: #fff !important; box-shadow: 0 5px 18px rgba(30,50,45,.04) !important; }
.nstudio-page .preview-panel{ border: 1px solid #dbe3e9 !important; background: #fff !important; box-shadow: 0 5px 18px rgba(38,55,70,.045) !important; }

/* 左仕様欄は既存 h3 スタイルから完全に切り離す */
.nstudio-page .form-block .spec-block-title{        font-size: 14px;  line-height: 1.5; }
.nstudio-page .spec-field-size .spec-block-title{ color: #344943; }
.nstudio-page .spec-field-sewing .spec-block-title{ color: #665333; }
.nstudio-page .spec-field-split .spec-block-title{ color: #344943; }
.nstudio-page .nstudio-size-block .spec-block-title i,
.nstudio-page .preview-head h3 i{ margin-right: 4px !important; }

.nstudio-page .custom-size-panel{ display: grid !important; gap: 10px; padding: 12px; border: 1px solid #dfe8e5; border-radius: 12px; background: #f8fbfa; }
.nstudio-page .custom-size-note,
.nstudio-page .nstudio-field-note{ grid-column: 1 / -1; margin: 5px 0 0; color: #7b8582; font-size:12px; line-height: 1.5; }
.nstudio-page #norenSplitSelect{ min-width: 0; padding: 10px 8px !important; background-image: none !important; text-align: center !important; appearance: auto !important; -webkit-appearance: auto !important; }

.nstudio-page .image-size-label-row,
.nstudio-page .nstudio-spec-title-with-toggle{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.nstudio-page .nstudio-piece-split-toggle{
  display: none;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  font-size: 12px;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  white-space: nowrap;
}
.nstudio-page .nstudio-piece-split-toggle.is-available{ display: inline-flex; }
.nstudio-page .nstudio-piece-split-toggle input{ margin: 0; }
.nstudio-page .nstudio-piece-inputs{
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  margin-top: 8px;
}
.nstudio-page .nstudio-piece-input-row{
  display: grid;
  grid-template-columns: minmax(48px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.nstudio-page .nstudio-piece-input-row > span:first-child{
  font-size: 12px;
  color: #666;
  white-space: nowrap;
}
.nstudio-page .nstudio-piece-input-row .image-size-input-wrap{ width: 100%; }




.nstudio-page .nstudio-summary{ border-color: #e0e6e4 !important;  }
.nstudio-page .nstudio-summary-title{ margin-bottom: 8px;  font-size: 13px;  }
.nstudio-page .summary dt,
.nstudio-page .summary dd{ font-size: 12px !important; }

.nstudio-page .preview-head{ padding-bottom: 10px; }
.nstudio-page .editor-mode-switch{ border-color: #dae4ea !important;  }
.nstudio-page .editor-mode-switch .mode-btn.is-active{   box-shadow: 0 1px 4px rgba(42,69,86,.12) !important; }
.nstudio-page .main-upload-prominent{ border-color: #557d96 !important; background: #557d96 !important; }
.nstudio-page .main-upload-prominent:hover{ border-color: #496f87 !important; background: #496f87 !important; }

/* 機能ごとの淡い色分け。上線アクセントは使わない */
.nstudio-page .image-size-panel{ padding: 14px !important; border: 1px solid #dce7ec !important; border-radius: 10px !important; background: #f8fbfc !important; }

.nstudio-page .preview-display-shell{ background: #f8fafb !important; }
.nstudio-page .action-btn,
.nstudio-page .icon-tool{ border-radius: 8px !important; }

.nstudio-page.is-nstudio-embed{ padding: 0; background: #fff; }
.nstudio-page.is-nstudio-embed #nstudio-editor > .wrap{ max-width: none !important; padding: 0 !important; }
.nstudio-page.is-nstudio-embed .product-type-top{ margin: 0 0 12px !important; border-radius: 10px !important; }
.nstudio-page.is-nstudio-embed .order-layout{ gap: 14px !important; }

@media (max-width: 1024px) {
  .nstudio-page .nstudio-type-grid{ grid-template-columns: 1fr !important; }
  
}

/* ---- original style block boundary ---- */

/* ===== NUNO STUDIO: visual hierarchy only. Canvas/editor geometry is intentionally untouched. ===== */
.nstudio-page .nstudio-internal-spec{display:none!important}

/* studio heading */
.nstudio-page .product-type-top{
  border:1px solid #e4d7c5!important;
  
  background:#fffdf9!important;
  
}
.nstudio-page .nstudio-mode-heading{
  margin:0 0 14px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  text-align:center!important;
}
.nstudio-page .nstudio-mode-mascot{display:block;height:auto;object-fit:contain;margin:0 auto 5px;}
.nstudio-page .nstudio-mode-title{color:#493a2f!important;}
.nstudio-page .nstudio-mode-tagline{color:#756456!important}


/* save/share is a separate strip under templates */

/* specification heading: green identity */
.nstudio-page .sidebar-spec-title{
  margin-bottom:14px!important;
  padding:11px 13px!important;
  border:0!important;
  border-radius:9px!important;
  background:#e7f1ed!important;
  color:#31584f!important;
  text-align:left!important;
  font-size:16px!important;
  font-weight:900!important;
}
.nstudio-page .order-layout>aside.panel .form-block{border-top:0!important}
.nstudio-page .form-block .spec-block-title{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;
  margin:0 0 8px!important;padding:7px 9px!important;
  border:0!important;border-radius:7px!important;
  background:#f5f0e7!important;color:#443d35!important;
  text-align:left!important;font-weight:800!important;
}
.nstudio-page .spec-block-title .spec-guide-link{margin-left:auto!important}


/* summary has its own block */
.nstudio-page .nstudio-summary{border:1px solid #cdded7!important;border-radius:10px!important;background:#fbfdfc!important;padding:0 11px 11px!important;overflow:hidden}
.nstudio-page .nstudio-summary-title{margin:0 -11px 10px!important;padding:8px 10px!important;background:#edf4f1!important;color:#34594f!important;font-weight:900!important}
.nstudio-page .nstudio-summary .inline-mockup-preview{border-top:0!important;margin-top:10px!important;padding-top:6px!important}
.nstudio-page .nstudio-summary .inline-mockup-preview-head{background:#f5f0e7!important;border-radius:6px!important;padding:6px 8px!important;text-align:left!important;justify-content:flex-start!important}

/* editor/preview heading: blue identity. Do not modify preview-panel/canvas geometry. */
.nstudio-page .preview-head{
  padding:11px 13px!important;
  border:0!important;border-radius:9px!important;
  background:#e8f0f6!important;
}
.nstudio-page .preview-head h3{margin:0!important;color:#31546d!important;font-weight:900!important;}


/* PCに保存・開く: popup immediately under its own button */


@media(max-width:1024px){
  .nstudio-page .product-type-top{padding-left:12px!important;padding-right:12px!important}
  .nstudio-page .nstudio-mode-heading{margin-left:0!important;margin-right:0!important}
  .nstudio-page .nstudio-mode-mascot{width:68px;max-height:78px}
  
}

/* ===== 埋め込みモード: 外枠だけを正規化。列構成は末尾の data-nstudio-layout だけで決める ===== */
.nstudio-page.is-nstudio-embed .product-type-top{display:none!important}
.nstudio-page.is-nstudio-embed #nstudio-editor{margin:0!important;padding:0!important}
.nstudio-page.is-nstudio-embed #nstudio-editor>.wrap{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
.nstudio-page.is-nstudio-embed main{margin:0!important;padding:0!important}









.nstudio-page .nstudio-asset-upload-panel{
  display: grid;
  gap: 12px;
}
.nstudio-page .nstudio-asset-upload-dropzone{
  border: 2px dashed #b9cad3;
  border-radius: 12px;
  background: #fff;
  padding: 20px 18px;
  text-align: center;
  cursor: pointer;
  transition: .18s ease;
}
.nstudio-page .nstudio-asset-upload-dropzone:hover,
.nstudio-page .nstudio-asset-upload-dropzone.is-dragover{
  border-color: #557d96;
  background: #f6fafc;
}
.nstudio-page .nstudio-asset-upload-icon{
  font-size: 28px;
  line-height: 1;
  color: #557d96;
  margin-bottom: 10px;
}
.nstudio-page .nstudio-asset-upload-title{
  font-size: 16px;
  font-weight: 800;
  color: #355267;
  margin-bottom: 4px;
}
.nstudio-page .nstudio-asset-upload-copy,
.nstudio-page .nstudio-asset-upload-note{
  font-size: 12px;
  color: #5e707b;
}
.nstudio-page .nstudio-asset-upload-dropzone .main-upload{
  margin: 14px auto 10px;
}
.nstudio-page .nstudio-asset-upload-actions{
  margin-top: 0;
}




































.nstudio-page .nstudio-svg-color-input{user-select:none;-webkit-user-select:none}.nstudio-page .nstudio-svg-color-input input[type="color"]{appearance:auto;-webkit-appearance:auto}
/* compact surface color */






































.nstudio-page .nstudio-insert-dialog{
  position: fixed;
  inset: 0;
  z-index: 10000050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(20, 28, 32, .42);
}
.nstudio-page .nstudio-insert-dialog-box{
  width: min(440px, calc(100% - 36px));
  max-width:440px;
  padding: 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 14px 42px rgba(0,0,0,.18);
  overscroll-behavior:contain;
  box-sizing:border-box;
}
.nstudio-page .nstudio-insert-dialog-title{
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 700;
}
.nstudio-page .nstudio-insert-dialog-message{
  color: #59666d;
  font-size: 13px;
  line-height: 1.7;
}
.nstudio-page .nstudio-insert-dialog-actions{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-top: 16px;
}
.nstudio-page .nstudio-insert-dialog-actions .action-btn{
  background: #fff !important;
  color: #333 !important;
}



















/* ---- original style block boundary ---- */

.nstudio-page .nstudio-data-check{margin:16px 0 18px}
.nstudio-page .nstudio-data-check-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:7px 10px 7px 9px;border:1px solid #d8e4e0;border-radius:10px;background:#f7faf9;color:#304a43;font:inherit;cursor:pointer;text-align:left;transition:background .15s,border-color .15s,border-radius .15s}
.nstudio-page .nstudio-data-check-toggle:hover{background:#f1f7f5;border-color:#c5d8d2}
.nstudio-page .nstudio-data-check:not(.is-collapsed) .nstudio-data-check-toggle{border-radius:10px 10px 0 0;background:#f3f8f6;border-color:#cbdcd7}
.nstudio-page .nstudio-data-check-tab-main,
.nstudio-page .nstudio-data-check-tab-side{display:flex;align-items:center;gap:8px;min-width:0}
.nstudio-page .nstudio-data-check-tab-label{font-size:12px;font-weight:700;white-space:nowrap}
.nstudio-page .nstudio-data-check-icon{display:flex;align-items:center;justify-content:center;width:27px;height:27px;border-radius:7px;background:#e8f2ef;color:#47786b;font-size:13px;flex:0 0 auto}
.nstudio-page .nstudio-data-check-summary{display:inline-flex;align-items:center;min-height:23px;padding:3px 8px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.nstudio-page .nstudio-data-check-summary.is-ok{background:#eaf5ef;color:#367157}
.nstudio-page .nstudio-data-check-summary.is-warn{background:#fff1df;color:#9a5d14}
.nstudio-page .nstudio-data-check-summary.is-info{background:#edf3f8;color:#4a687c}
.nstudio-page .nstudio-data-check-chevron{margin:0!important;color:#7a8883;transition:transform .15s}
.nstudio-page .nstudio-data-check:not(.is-collapsed) .nstudio-data-check-chevron{transform:rotate(180deg)}
.nstudio-page .nstudio-data-check-body{padding:14px 14px 12px;border:1px solid #cbdcd7;border-top:0;border-radius:0 0 10px 10px;background:#fbfcfc}
.nstudio-page .nstudio-data-check-body[hidden]{display:none!important}
.nstudio-page .nstudio-data-check-body-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px;color:#75827e;font-size:12px}
.nstudio-page .nstudio-data-check-refresh{display:inline-flex;align-items:center;gap:4px;min-height:27px;padding:4px 8px;border:1px solid #d8e1de;border-radius:7px;background:#fff;color:#64716d;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}
.nstudio-page .nstudio-data-check-list{display:grid;gap:7px}
.nstudio-page .nstudio-data-check-item{display:grid;grid-template-columns:22px minmax(100px,145px) minmax(0,1fr);align-items:start;gap:8px;padding:9px 10px;border-radius:9px;background:#fff}
.nstudio-page .nstudio-data-check-status{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:12px}
.nstudio-page .nstudio-data-check-item.is-ok .nstudio-data-check-status{background:#eaf5ef;color:#367157}
.nstudio-page .nstudio-data-check-item.is-warn .nstudio-data-check-status{background:#fff0dc;color:#a46316}
.nstudio-page .nstudio-data-check-item.is-info .nstudio-data-check-status{background:#edf3f8;color:#536f80}
.nstudio-page .nstudio-data-check-label{padding-top:3px;font-size:12px;font-weight:700;color:#42514d}
.nstudio-page .nstudio-data-check-message{padding-top:3px;font-size:12px;line-height:1.55;color:#697570;word-break:break-word}
.nstudio-page .nstudio-data-check-note{margin:10px 2px 0;font-size:12px;line-height:1.55;color:#929b98}
@media(max-width:620px){.nstudio-page .nstudio-data-check-body-head{align-items:flex-start}.nstudio-page .nstudio-data-check-item{grid-template-columns:22px minmax(0,1fr)}.nstudio-page .nstudio-data-check-message{grid-column:2}}

/* ---- original style block boundary ---- */














.nstudio-page.is-logo-design-disabled .image-size-panel{display:none!important}
.nstudio-page.is-logo-design-disabled .upload-placeholder{display:none!important}
@media(max-width:560px){.nstudio-page .nstudio-spec-title-with-toggle{align-items:flex-start}}

/* ---- original style block boundary ---- */

.nstudio-page .nstudio-design-presence-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.nstudio-page.is-logo-design-disabled [data-nstudio-design-mode-tab="logo"]{display:none!important}
.nstudio-page.is-logo-design-disabled .image-size-panel,
.nstudio-page.is-logo-design-disabled .nstudio-multi-align-panel{display:none!important}

.nstudio-page .nstudio-editor-utility-tab{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:7px 11px;border:1px solid #d9dfdc;border-radius:8px;background:#fff;color:#52605c;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.nstudio-page .nstudio-editor-utility-tab.is-active{border-color:#6f958a;background:#edf5f2;color:#315d53}.nstudio-page .nstudio-editor-utility-tab #nstudioDataCheckTabSummary{font-size:12px;font-weight:600;color:#8a9490}
.nstudio-page .nstudio-editor-utility-panel[hidden]{display:none!important}.nstudio-page .nstudio-settings-panel{padding:13px;border:1px solid #dde4e1;border-radius:10px;background:#f8faf9;}.nstudio-page .nstudio-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;row-gap:12px}.nstudio-page .nstudio-setting-field{display:flex;flex-direction:column;gap:7px;min-width:0;font-size:13px;color:#3f4b47}.nstudio-page .nstudio-setting-title{font-size:13px;font-weight:600;color:#34413d}.nstudio-page .nstudio-setting-inline{display:flex;align-items:center;gap:8px}.nstudio-page .nstudio-setting-inline em{font-size:13px;font-style:normal;font-weight:400;color:#4f5b57}.nstudio-page .nstudio-setting-description{display:block;font-size:13px;line-height:1.55;font-weight:400;color:#46534f}.nstudio-page .nstudio-setting-toggles{display:flex;gap:9px 18px;flex-wrap:wrap;margin:0 0 14px;padding:0 0 11px;border-bottom:1px solid #d9e0dd;font-weight:400}.nstudio-page .nstudio-setting-toggles label{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:400;color:#3f4b47;cursor:pointer}.nstudio-page .nstudio-setting-toggles input{margin:0}.nstudio-page .nstudio-setting-note{margin:9px 0 0;font-size:13px;line-height:1.6;color:#4f5b57}
.nstudio-page .nstudio-preview-settings-toggle{min-height:38px;padding:8px 14px}.nstudio-page .nstudio-preview-settings-toggle.is-active{background:#526b63 !important;border-color:#526b63 !important;color:#fff !important;box-shadow:0 0 0 2px rgba(82,107,99,.16),inset 0 -2px 0 rgba(0,0,0,.10)}.nstudio-page .nstudio-preview-settings-toggle::after{content:'▾';display:inline-block;margin-left:7px;font-size:11px;line-height:1;transition:transform .16s ease}.nstudio-page .nstudio-preview-settings-toggle.is-active::after{transform:rotate(180deg)}.nstudio-page .nstudio-preview-settings-panel{flex:0 0 100%;width:100%;margin-top:2px;padding:12px 13px;border:1px solid #dde4e1;border-radius:10px;background:#fff}.nstudio-page .nstudio-preview-settings-panel[hidden]{display:none}.nstudio-page .nstudio-preview-settings-grid{display:flex;align-items:center;gap:16px;flex-wrap:nowrap;overflow-x:auto}.nstudio-page .nstudio-preview-setting-field{display:inline-flex;flex-direction:row;align-items:center;gap:8px;flex:0 0 auto;font-size:12px;font-weight:700;color:#53605d;white-space:nowrap}.nstudio-page .nstudio-preview-setting-field span{display:inline-block}.nstudio-page .nstudio-preview-setting-check input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:#526b63;cursor:pointer}.nstudio-page .nstudio-preview-setting-field input[type=color]{width:42px;height:32px;padding:2px;border:1px solid #d4ddda;border-radius:7px;background:#fff;cursor:pointer}.nstudio-page .nstudio-preview-settings-dynamic{display:contents}.nstudio-page .nstudio-preview-settings-note{flex:0 0 auto;margin:0;font-size:12px;line-height:1.5;color:#8b9491;white-space:nowrap}
.nstudio-page #nstudioDataCheckPanel{margin-top:0}.nstudio-page #nstudioDataCheckPanel>.nstudio-data-check-toggle{display:none!important}.nstudio-page #nstudioDataCheckPanel>.nstudio-data-check-body{display:block!important}
.nstudio-page .nstudio-multi-align-panel{margin:10px 0 14px;padding:12px 13px;border:1px solid #b9d1c9;border-radius:10px;}.nstudio-page .nstudio-multi-align-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;font-size:12px;color:#315d53}.nstudio-page .nstudio-multi-align-head strong{display:flex;align-items:center;gap:5px}.nstudio-page .nstudio-multi-align-head span{font-size:12px;color:#63877c}.nstudio-page .nstudio-multi-align-actions{display:flex;flex-direction:column;gap:9px}.nstudio-page .nstudio-multi-align-group{padding:8px;border:1px solid #d3e2dd;border-radius:8px;}.nstudio-page .nstudio-multi-align-group-label{display:block;margin:0 0 6px;font-size:12px;font-weight:800;color:#68857c}.nstudio-page .nstudio-multi-align-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.nstudio-page .nstudio-multi-align-actions button{min-height:50px;padding:6px 5px;border:1px solid #bfd4cd;border-radius:7px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;line-height:1.25}.nstudio-page .nstudio-multi-align-actions button .icon{font-size:14px;margin:0!important}.nstudio-page .nstudio-image-position-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:2px}.nstudio-page .nstudio-image-position-grid .image-size-field{margin:0}.nstudio-page .nstudio-auto-split-toggle{display:inline-flex!important;align-items:center;gap:6px;margin-top:8px;padding:7px 9px;border:1px solid #d4ddd9;border-radius:7px;background:#f7faf9;font-size:12px;color:#45534f;cursor:pointer}.nstudio-page .nstudio-auto-split-toggle input{margin:0}.nstudio-page .nstudio-auto-split-toggle:has(input:checked){border-color:#6f9d8e;background:#eaf5f1;color:#315d53;font-weight:700}.nstudio-page .nstudio-pocket-spec{margin-top:8px}.nstudio-page .nstudio-pocket-size-row{padding:10px 11px;border:1px solid #e0e5e3;border-radius:8px;background:#fafbfa}.nstudio-page .nstudio-pocket-size-row>label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:#59645f}.nstudio-page .nstudio-pocket-number{display:flex;align-items:center;gap:5px}.nstudio-page .nstudio-pocket-number em{font-size:12px;font-style:normal;color:#7b8581}
@media(max-width:560px){.nstudio-page .nstudio-multi-align-row{grid-template-columns:repeat(3,minmax(0,1fr))}.nstudio-page .nstudio-multi-align-actions button{min-height:48px;padding:5px 3px}.nstudio-page .nstudio-image-position-grid{grid-template-columns:1fr 1fr}}

/* ---- original style block boundary ---- */

.nstudio-page .nstudio-tie-spec{margin-top:-2px;padding-top:2px}.nstudio-page .nstudio-tie-spec-grid{display:flex;flex-direction:column;gap:10px}.nstudio-page .nstudio-tie-check{display:flex;align-items:center;gap:7px;font-size:12px;color:#46534f;cursor:pointer}.nstudio-page .nstudio-tie-check input{margin:0}.nstudio-page .nstudio-tie-subfield,
.nstudio-page .nstudio-tie-size-row{margin-left:24px;padding:10px 11px;border:1px solid #e0e5e3;border-radius:8px;background:#fafbfa}.nstudio-page .nstudio-tie-subfield{display:flex;align-items:center;gap:9px;font-size:12px;color:#59645f}.nstudio-page .nstudio-tie-subfield input[type=color]{width:42px;height:32px;padding:2px;border:1px solid #ccd5d1;border-radius:6px;background:#fff}.nstudio-page .nstudio-tie-subfield code{font-size:12px;color:#6a7470;background:none}.nstudio-page .nstudio-tie-size-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.nstudio-page .nstudio-tie-size-row>label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:#59645f}.nstudio-page .nstudio-tie-number{display:flex;align-items:center;gap:5px}.nstudio-page .nstudio-tie-number em{font-size:12px;font-style:normal;color:#7b8581}.nstudio-page .nstudio-tie-subfield.is-disabled,
.nstudio-page .nstudio-tie-size-row.is-disabled{opacity:.45}.nstudio-page .nstudio-tie-subfield.is-disabled input,
.nstudio-page .nstudio-tie-size-row.is-disabled input{pointer-events:none}.nstudio-page .preview-tie{box-shadow:0 0 0 1px rgba(0,0,0,.04)}
.nstudio-page .nstudio-sewing-settings-toggle{
  display:flex;align-items:center;gap:7px;margin:10px 0 0;padding:0;color:#46534f;font-size:12px;font-weight:700;line-height:1.45;cursor:pointer;
}
.nstudio-page .nstudio-sewing-settings-toggle input{margin:0;flex:0 0 auto;}
.nstudio-page .nstudio-sewing-settings-toggle:has(input:checked){color:#315d53;}
@media(max-width:560px){.nstudio-page .nstudio-tie-size-row{grid-template-columns:1fr}.nstudio-page .nstudio-tie-subfield,
.nstudio-page .nstudio-tie-size-row{margin-left:0}}

/* ---- original style block boundary ---- */

/* ===== NUNO STUDIO wide 3-column / responsive drawer UI v7 ===== */
.nstudio-page .wrap{max-width:1680px!important;width:calc(100% - 28px)!important}
.nstudio-page .order-layout{display:grid!important;align-items:start!important;}
.nstudio-page .order-layout>.panel{min-width:0!important}
.nstudio-page .preview-panel{padding:18px!important;border-radius:14px!important}
.nstudio-page .nstudio-design-sidebar{padding:14px!important;border-radius:14px!important;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;scrollbar-width:thin}
.nstudio-page .nstudio-design-sidebar-head{display:flex;align-items:center;justify-content:space-between;margin:-2px 0 10px;padding:0 2px 10px;border-bottom:1px solid #e5ebe8}
.nstudio-page .nstudio-design-sidebar-head strong{display:block;font-size:16px;color:#263b35}
.nstudio-page .nstudio-design-sidebar-head small{display:block;margin-top:2px;font-size:12px;font-weight:500;color:#8a9490}
.nstudio-page .nstudio-design-quick-card{margin:0 0 10px;padding:11px;border:1px solid #dfe7e4;border-radius:11px;background:#fff}
.nstudio-page .nstudio-design-quick-color{background:#f2f8f5;border-color:#ccddd7}
.nstudio-page .nstudio-design-quick-upload{background:#fffaf3;border-color:#e7dccd}
.nstudio-page .nstudio-design-quick-heading{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.nstudio-page .nstudio-design-quick-heading>.nstudio-design-quick-icon{display:flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:30px;border-radius:8px;background:#fff;color:#426e62}
.nstudio-page .nstudio-design-quick-upload .nstudio-design-quick-icon{color:#86623d}
.nstudio-page .nstudio-design-quick-heading strong{display:block;font-size:13px;color:#334943}
.nstudio-page .nstudio-design-quick-heading small{display:block;margin-top:1px;font-size:12px;font-weight:400;color:#83908b;line-height:1.35}











.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-panel{padding:0!important;margin:0!important;border:0!important;background:transparent!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-dropzone{min-height:112px!important;padding:12px 9px!important;border-radius:9px!important;border:1px dashed #ccbda9!important;background:rgba(255,255,255,.72)!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-icon{font-size:22px!important;margin-bottom:2px!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-title{font-size:12px!important;font-weight:800!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-copy{font-size:12px!important;margin:3px 0 7px!important}
.nstudio-page #nstudioQuickUploadMount .main-upload-prominent{min-height:40px!important;padding:9px 11px!important;margin:0!important;font-size:12px!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-note{margin-top:6px!important;font-size:12px!important;line-height:1.4!important}
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-actions{display:none!important}

.nstudio-page .nstudio-selected-adjust-wrap{margin-top:12px;padding-top:11px;border-top:1px solid #e4e9e7}

.nstudio-page #nstudioRightAdjustMount .image-size-panel{display:block;width:100%;margin:0!important;padding:12px!important;border:0!important;border-radius:10px!important;background:var(--ns-adjust-bg)!important;box-shadow:none!important}
.nstudio-page #nstudioRightAdjustMount .image-size-panel.is-hidden{display:none!important}
.nstudio-page #nstudioRightAdjustMount .image-size-title{font-size:12px!important;margin-bottom:8px!important}
.nstudio-page #nstudioRightAdjustMount .image-size-field{margin-bottom:8px!important}
.nstudio-page #nstudioRightAdjustMount .crop-row{gap:6px!important;flex-wrap:wrap!important}
.nstudio-page #nstudioRightAdjustMount .crop-row .action-btn{min-height:34px!important;padding:6px 8px!important;font-size:12px!important}

/* background drawer cards */
.nstudio-page .nstudio-background-design-panel{display:grid!important;gap:10px!important}





/* drawers */
.nstudio-page .nstudio-drawer-backdrop{position:fixed;inset:0;z-index:99890;background:rgba(26,35,32,.34);opacity:0;transition:opacity .18s ease}
.nstudio-page .nstudio-drawer-backdrop.is-open{opacity:1}
.nstudio-page .nstudio-side-drawer{position:fixed;z-index:99900;top:0;right:0;width:min(540px,calc(100vw - 28px));height:100dvh;max-height:100vh;background:#fff;border-left:1px solid #dce4e1;box-shadow:-12px 0 34px rgba(23,38,33,.14);transform:translateX(102%);transition:transform .2s ease;display:flex;flex-direction:column;overflow:hidden}
.nstudio-page .nstudio-side-drawer.is-open{transform:translateX(0)}
.nstudio-page .nstudio-side-drawer-head{flex:0 0 auto;min-height:64px;padding:12px 15px;border-bottom:1px solid #e3e8e6;background:#f9fbfa;display:flex;align-items:center;justify-content:space-between;gap:12px}
.nstudio-page .nstudio-side-drawer-head strong{display:block;}
.nstudio-page .nstudio-side-drawer-head small{display:block;margin-top:2px;color:#7d8985;font-size:12px;font-weight:400}
.nstudio-page .nstudio-drawer-close{display:flex;align-items:center;gap:4px;min-height:34px;padding:6px 9px;border:1px solid #d5ddda;border-radius:8px;background:#fff;font:inherit;font-weight:700;cursor:pointer;}
.nstudio-page .nstudio-side-drawer-body{flex:1 1 auto;min-height:0;padding:14px;overflow:auto;overscroll-behavior:contain}








.nstudio-page .nstudio-side-drawer .nstudio-background-feature-card{margin-bottom:10px!important}


/* export menu */
.nstudio-page .nstudio-export-menu{min-width:250px!important;padding:8px!important}
.nstudio-page .nstudio-export-menu-title{padding:4px 6px 7px;font-weight:800;letter-spacing:.04em;}
.nstudio-page .nstudio-export-item{width:100%!important;display:grid!important;grid-template-columns:26px minmax(0,1fr)!important;align-items:center!important;justify-content:stretch!important;gap:8px!important;min-height:48px!important;padding:7px 9px!important;text-align:left!important}
.nstudio-page .nstudio-export-item>i{font-size:17px!important;margin:0!important;text-align:center}
.nstudio-page .nstudio-export-item span{display:block!important;min-width:0}
.nstudio-page .nstudio-export-item strong{display:block;font-size:12px;line-height:1.2}
.nstudio-page .nstudio-export-item small{display:block;margin-top:2px;font-weight:400;}
.nstudio-page .nstudio-export-item.is-recommended:after{content:"おすすめ";justify-self:end;grid-column:2;color:#cfe8de;margin-top:-14px;}

/* mode wording / compact */
.nstudio-page .editor-mode-switch{max-width:560px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important;padding:4px!important;border:1px solid #dae2df!important;border-radius:10px!important;background:#f7f9f8!important}
.nstudio-page .editor-mode-switch .mode-btn{min-height:42px!important;border-radius:8px!important;}
.nstudio-page .editor-mode-switch .mode-btn.is-active{background:#315d53!important;color:#fff!important;border-color:#315d53!important}
.nstudio-page .preview-head{margin-bottom:10px!important}.nstudio-page .preview-head h3{font-size:16px!important}
.nstudio-page .editor-mode-row{gap:9px!important;margin-bottom:12px!important}

.nstudio-page .product-type-top{padding:12px 14px!important;margin-bottom:12px!important;border-radius:12px!important}

/* tablet */


/* mobile / narrow tablet */


.nstudio-page .nstudio-tie-spacing-row{grid-template-columns:minmax(0,1fr);--nstudio-tie-label-width:64px;}
/* ===== NUNO STUDIO responsive fit / simple mobile UI v7 ===== */
.nstudio-page{max-width:100%!important;overflow-x:clip!important;}
.nstudio-page #nstudio-editor>.wrap{min-width:0!important;}
.nstudio-page .order-layout{max-width:100%!important;min-width:0!important;}
.nstudio-page .order-layout>*{min-width:0!important;max-width:100%!important}
.nstudio-page .preview-panel,
.nstudio-page .design-shell,
.nstudio-page .editor-stage,
.nstudio-page .canvas-container{min-width:0!important;max-width:100%!important}
.nstudio-page .nstudio-design-sidebar{width:100%!important;min-width:0!important}


/* 3カラムを保てる幅だけ3カラム。中途半端な幅で横にはみ出させない。 */


/* Embedded workspace columns are defined only in the authoritative responsive block below. */
html.nstudio-drawer-open,
html.nstudio-drawer-open body{overflow:hidden!important}

/* ---- original style block boundary ---- */

/* Project toolbar: start/open/save/export are grouped by user intent. */
.nstudio-page .nstudio-save-hub{
  display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:nowrap;
  margin:0;padding:0;border:0;background:transparent;
}
.nstudio-page .nstudio-save-hub .nstudio-project-status{order:-1;margin-left:0;margin-right:3px;font-size:12px;color:#5f6e68;white-space:nowrap}
.nstudio-page .nstudio-save-hub .nstudio-project-status[hidden]{display:none!important}
.nstudio-page .nstudio-restore-quick{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:38px!important;padding:8px 13px!important;
  border:1px solid #d8ddef!important;border-radius:9px!important;background:#f3f5fb!important;color:#56627f!important;font-weight:850!important;box-shadow:none!important;white-space:nowrap!important;
}
.nstudio-page .nstudio-restore-quick>.icon{color:inherit!important}
.nstudio-page .nstudio-restore-quick:hover{background:#e9edf8!important;border-color:#c7d0e8!important;color:#465572!important}
.nstudio-page .nstudio-restore-quick[hidden]{display:none!important}
.nstudio-page .nstudio-project-menu{position:relative!important;overflow:visible!important}
.nstudio-page .nstudio-project-menu-trigger{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-height:38px!important;
  padding:8px 13px!important;border:1px solid #d8e1dd!important;border-radius:9px!important;background:#f4f7f5!important;
  color:#344c45!important;font-weight:850!important;cursor:pointer!important;list-style:none!important;white-space:nowrap!important;box-shadow:none!important;
}
.nstudio-page .nstudio-project-menu-trigger::-webkit-details-marker{display:none!important}
.nstudio-page .nstudio-project-menu-trigger .angle.icon{margin-left:2px!important;font-size:12px!important}
.nstudio-page .nstudio-project-menu[open]>.nstudio-project-menu-trigger,
.nstudio-page .nstudio-project-menu-trigger:hover{background:#e8efec!important;border-color:#cbd9d4!important}
.nstudio-page .nstudio-project-menu-panel{
  position:absolute!important;right:0!important;left:auto!important;top:calc(100% + 7px)!important;bottom:auto!important;
  z-index:10020!important;max-height:min(72vh,620px)!important;overflow:auto!important;
  padding:9px!important;border:1px solid #dfe6e2!important;border-radius:12px!important;background:#fff!important;
  box-shadow:0 14px 36px rgba(31,48,42,.14)!important;
}
.nstudio-page .nstudio-project-menu-panel:not(.nstudio-compact-menu-panel){width:min(330px,calc(100vw - 24px))!important;}
.nstudio-page .nstudio-project-menu-item,
.nstudio-page .nstudio-recent-project-item{
  width:100%!important;min-height:46px!important;margin:2px 0!important;padding:8px 10px!important;
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;
  border:0!important;border-radius:8px!important;background:#f7f9f8!important;color:#34433e!important;text-align:left!important;font-size:12px!important;cursor:pointer!important;
}
.nstudio-page .nstudio-project-menu-item:hover,
.nstudio-page .nstudio-recent-project-item:hover{background:#edf3f0!important}
.nstudio-page .nstudio-project-menu-item>.icon{flex:0 0 auto!important;margin:0!important;color:#526b63!important}
.nstudio-page .nstudio-project-menu-item>span{display:flex!important;min-width:0!important;flex-direction:column!important;gap:1px!important}
.nstudio-page .nstudio-project-menu-item strong{font-size:12px!important;line-height:1.4!important;color:#2f3d38!important}
.nstudio-page .nstudio-project-menu-item small{font-size:12px!important;line-height:1.35!important;color:#69766f!important;font-weight:500!important}
.nstudio-page .nstudio-project-menu-item input[type="file"]{display:none!important}
.nstudio-page .nstudio-recent-projects{margin:7px 0!important;padding:8px 0!important;border-top:1px solid #e6ebe8!important;border-bottom:1px solid #e6ebe8!important}
.nstudio-page .nstudio-recent-projects[hidden]{display:none!important}
.nstudio-page .nstudio-project-menu-title{display:block;margin:0 5px 6px;color:#52615b;font-size:12px;font-weight:850}
.nstudio-page .nstudio-recent-project-list{display:grid;gap:7px;max-height:330px;overflow:auto;padding-right:2px}
.nstudio-page .nstudio-recent-project-item{min-height:42px!important;flex-direction:column!important;align-items:flex-start!important;gap:1px!important}
.nstudio-page .nstudio-recent-project-name{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800;color:#31423c}
.nstudio-page .nstudio-recent-project-item small{font-size:12px!important;color:#75817c!important}

.nstudio-page .nstudio-recent-project-empty{padding:10px 7px;color:#7b8782;font-size:12px;text-align:center}
.nstudio-page .nstudio-saved-project-card{position:relative;display:flex;align-items:stretch;min-width:0;border:1px solid #e3e9e6;border-radius:9px;background:#f8faf9;overflow:hidden}
.nstudio-page .nstudio-saved-project-card:hover{border-color:#cfdad5;background:#f2f6f4}
.nstudio-page .nstudio-saved-project-open{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:9px;min-width:0;flex:1;padding:7px 34px 7px 7px;border:0;background:transparent;color:#31423c;text-align:left;cursor:pointer}
.nstudio-page .nstudio-saved-project-thumb{position:relative;display:flex;align-items:center;justify-content:center;width:72px;height:54px;border-radius:6px;background:#eef2f0;overflow:hidden}
.nstudio-page .nstudio-saved-project-thumb img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}
.nstudio-page .nstudio-saved-project-thumb-placeholder{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);margin:0;color:#9ba6a1}
.nstudio-page .nstudio-saved-project-thumb:not(.is-missing) .nstudio-saved-project-thumb-placeholder{display:none}
.nstudio-page .nstudio-saved-project-copy{display:flex;min-width:0;flex-direction:column;gap:3px}
.nstudio-page .nstudio-saved-project-copy .nstudio-recent-project-name{display:-webkit-box;max-width:100%;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal;line-height:1.35;font-size:12px;font-weight:800;color:#31423c}
.nstudio-page .nstudio-saved-project-copy small{font-size:11px;color:#78847f}
.nstudio-page .nstudio-saved-project-delete{position:absolute;top:5px;right:5px;display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:0;border-radius:6px;background:transparent;color:#7d8984;font-size:20px;line-height:1;cursor:pointer}
.nstudio-page .nstudio-saved-project-delete:hover{background:#f4e8e8;color:#9b4545}
.nstudio-page .nstudio-saved-project-delete:focus-visible,.nstudio-page .nstudio-saved-project-open:focus-visible{outline:2px solid #5f8176;outline-offset:-2px}
.nstudio-page .nstudio-save-menu-meta{margin-top:7px;padding:7px 9px;border-radius:7px;background:#fafbfa;color:#7a8580;font-size:12px;word-break:break-all}
.nstudio-page .nstudio-save-menu-meta code{font-size:12px;color:#53615b;background:none}
.nstudio-page .nstudio-project-menu-panel .nstudio-cloud-saved-link{margin-top:7px;font-size:12px}
.nstudio-page .nstudio-top-export-panel .nstudio-export-menu-title{padding:5px 7px 7px!important}
.nstudio-page .nstudio-top-export-panel .nstudio-export-item{width:100%!important;margin:3px 0!important}

/* v23: final column headings and confirmation layout */
.nstudio-page .order-layout > aside.panel:first-of-type,
.nstudio-page .order-layout > .preview-panel,
.nstudio-page .order-layout > .nstudio-design-sidebar{
  border:0!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-column-heading,
.nstudio-page .sidebar-spec-title,
.nstudio-page .preview-head,
.nstudio-page .nstudio-design-sidebar-head{
  min-height:36px!important;
  margin:0 0 14px!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-start!important;
  border:0!important;
  border-bottom:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-column-heading-copy{display:block!important;margin:0!important;padding:0!important}
.nstudio-page .nstudio-column-heading strong,
.nstudio-page .nstudio-column-heading h3,
.nstudio-page .sidebar-spec-title strong,
.nstudio-page .preview-head h3,
.nstudio-page .nstudio-design-sidebar-head strong{
  margin:0!important;
  padding:0!important;
  font-family:inherit!important;
  font-size:23px!important;
  line-height:1.35!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
}
.nstudio-page .nstudio-column-heading small,
.nstudio-page .nstudio-design-sidebar-head small{display:none!important}
.nstudio-page .nstudio-editor-product-name{
  min-height:22px;

  gap:4px;
  color:#74807c;
  
  font-size:12px;
  line-height:1.35;
}

.nstudio-page .nstudio-editor-product-name .nstudio-product-name{font-weight:700!important;}
.nstudio-page .nstudio-editor-summary{
  margin-top:18px!important;
  
  display:grid!important;
  
  
  align-items:start!important;
  border:0!important;
  border-radius:12px!important;
  background:#f7f9f8!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.nstudio-page .nstudio-editor-summary.is-hidden{display:none!important}
.nstudio-page .nstudio-editor-summary-spec{min-width:0}
.nstudio-page .nstudio-editor-summary .nstudio-summary-title,
.nstudio-page .nstudio-editor-summary .inline-mockup-preview-head{
  margin:0 0 12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#344a43!important;
  font-size:17px!important;
  line-height:1.4!important;
  font-weight:800!important;
}
.nstudio-page .nstudio-editor-summary dl{
  display:grid!important;
  grid-template-columns:minmax(90px,.7fr) minmax(0,1.3fr)!important;
  gap:9px 16px!important;
  margin:0!important;
}
.nstudio-page .nstudio-editor-summary dt,
.nstudio-page .nstudio-editor-summary dd{margin:0!important;font-size:14px!important;line-height:1.55!important}
.nstudio-page .nstudio-editor-summary dt{color:#79847f!important;font-weight:600!important}
.nstudio-page .nstudio-editor-summary dd{color:#35443f!important;font-weight:700!important}
.nstudio-page .nstudio-editor-summary .inline-mockup-preview{
  display:block!important;
  min-width:0!important;

}
.nstudio-page .nstudio-editor-summary .inline-mockup-preview-body{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:8px!important;
  border:0!important;
  border-radius:10px!important;
  background:#fff!important;
}
.nstudio-page .nstudio-editor-summary .inline-mockup-preview-body img{
  display:block!important;
  width:100%!important;
  max-height:310px!important;
  object-fit:contain!important;
}
.nstudio-page .nstudio-design-quick-color .nstudio-design-quick-heading{justify-content:flex-start!important}


.nstudio-page .upload-placeholder{pointer-events:auto!important;cursor:pointer!important;white-space:normal!important;min-width:min(330px,calc(100% - 42px))!important;max-width:min(410px,calc(100% - 42px))!important;padding:18px 22px!important;border:1px dashed #9db2aa!important;}
.nstudio-page .upload-placeholder:hover{border-color:#5e887c!important;}
.nstudio-page .upload-placeholder strong{font-size:14px;color:#3d5b52;}
.nstudio-page .upload-placeholder span{font-size:12px;color:#788681;}

/* v24: title emphasis,
cleaner design column,
tighter/wider 3-column layout */
.nstudio-page .nstudio-mode-mascot{
  
  
  margin-bottom:6px!important;
}

/* right design column: no residual grey frame */
.nstudio-page .order-layout > .nstudio-design-sidebar,
.nstudio-page .order-layout > aside.panel.nstudio-design-sidebar,
.nstudio-page .nstudio-design-sidebar{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-design-sidebar::before,
.nstudio-page .nstudio-design-sidebar::after{
  border:0!important;
  box-shadow:none!important;
}

/* embedded editor does not need the lower spec/image confirmation block */
.nstudio-page.is-nstudio-embed .nstudio-editor-summary{
  display:none!important;
}

/* ---- original style block boundary ---- */

/* v32: right inspector/tools,
full-width final data check,
canvas upload click zone */
.nstudio-page .nstudio-mode-heading{margin-bottom:0!important;}
.nstudio-page .nstudio-mode-title{font-size:36px!important;line-height:1.08!important;font-weight:900!important;}
.nstudio-page .nstudio-mode-tagline{margin-top:5px!important;font-size:19px!important;line-height:1.3!important;font-weight:800!important;}
.nstudio-page .nstudio-mode-mascot{width:98px!important;max-height:112px!important;}
.nstudio-page .product-type-top>.nstudio-save-hub{
  display:flex!important;justify-content:center!important;align-items:center!important;gap:8px!important;
  width:100%!important;margin:17px auto 18px!important;padding:0!important;border:0!important;background:transparent!important;
}
.nstudio-page .product-type-top>.nstudio-save-hub .nstudio-project-status{position:absolute;transform:translateY(34px);}

.nstudio-page .order-layout>.nstudio-design-sidebar,
.nstudio-page.is-nstudio-embed .order-layout>.nstudio-design-sidebar{
  position:static!important;top:auto!important;max-height:none!important;height:auto!important;scrollbar-width:auto!important;
}
/* Lazy Object List launcher shell.
   Only the pre-load launcher shell lives in base CSS; expanded panel/UI remains Module-owned. */
.nstudio-page #nstudioObjectListSlot{
  min-width:0;
  margin:0 0 16px;
  padding:0;
  border:0;
}
.nstudio-page #nstudioObjectListLauncher.nstudio-object-list-launcher-placeholder{
  width:100%;
  min-height:34px;
  padding:6px 9px;
  border:1px solid #b9ccd6;
  border-radius:8px;
  background:#e8f1f6;
  color:#31586a;
  box-shadow:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  text-align:left;
}
.nstudio-page #nstudioObjectListLauncher.nstudio-object-list-launcher-placeholder:hover{border-color:#97b5c4;background:#dfeef5;color:#24495a;}
.nstudio-page #nstudioObjectListLauncher .nstudio-object-list-launcher-copy{display:flex;min-width:0;align-items:center;gap:5px;overflow:hidden;white-space:nowrap;}
.nstudio-page #nstudioObjectListLauncher .nstudio-object-list-launcher-copy>.icon{flex:0 0 auto;margin:0;color:#547d90;}
.nstudio-page #nstudioObjectListLauncher .nstudio-object-list-count{flex:0 0 auto;padding:1px 5px;border-radius:999px;background:#fff;color:#326779;font-size:11px;font-weight:850;line-height:1.35;}
.nstudio-page #nstudioObjectListLauncher>[data-nstudio-object-list-chevron]{margin:0;color:#547d90;}


.nstudio-page .nstudio-canvas-status-row{display:flex;align-items:center;justify-content:center;gap:9px;margin:10px 0 8px;flex-wrap:wrap;}
.nstudio-page .nstudio-canvas-status-row .canvas-bleed-note{margin:0!important;padding:0!important;text-align:center!important;}
.nstudio-page .nstudio-settings-inline-btn{flex:0 0 auto!important;min-height:32px!important;padding:5px 9px!important;}

.nstudio-page .nstudio-settings-panel{margin:8px 0 10px!important;}

.nstudio-page .nstudio-editor-summary{
  width:min(100%,1040px)!important;max-width:1040px!important;margin:28px auto 8px!important;padding:20px!important;
  grid-template-columns:minmax(0,.9fr) minmax(340px,1.1fr)!important;gap:22px 28px!important;
}
.nstudio-page .nstudio-final-image-column{min-width:0;}
.nstudio-page .nstudio-final-image-mount{min-width:0;}
.nstudio-page .nstudio-final-data-check-row{grid-column:1/-1;min-width:0;padding-top:2px;}


.nstudio-page .nstudio-final-data-check-row .nstudio-data-check{width:100%!important;margin:0!important;}
.nstudio-page .nstudio-final-data-check-row .nstudio-data-check-body{padding:14px!important;}
.nstudio-page .nstudio-editor-summary .inline-mockup-preview{margin:0!important;padding:0!important;border:0!important;}


.nstudio-page .nstudio-design-primary-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:0 0 12px;}
.nstudio-page .nstudio-design-primary-tool{
  min-width:0;min-height:46px;padding:8px 5px;border:0;border-radius:9px;background:#f1f4f3;color:#465650;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(65,88,81,.06);
}
.nstudio-page .nstudio-design-primary-tool i{margin:0!important;font-size:15px;}
.nstudio-page .nstudio-design-primary-tool:hover{background:#e8efec;}
.nstudio-page .nstudio-design-primary-tool.is-active{background:#3f6f64;color:#fff;box-shadow:none;}
.nstudio-page .nstudio-design-inline-tool{margin:0 0 14px;padding:13px;border:0;border-radius:11px;background:#f5f1f7;}
.nstudio-page .nstudio-design-inline-tool[hidden]{display:none!important;}
.nstudio-page .nstudio-inline-tool-close{width:30px;height:30px;}
.nstudio-page .nstudio-inline-tool-close i{margin:0!important;}



.nstudio-page #nstudioSelectedInspectorMount:empty{display:none!important;}
.nstudio-page #nstudioSelectedInspectorMount:not(:empty){margin-bottom:10px;}

/* ---- original style block boundary ---- */

/* v33: NUNO STUDIO を1つのワークスペースとして見せる */
.nstudio-page .nstudio-app-shell{
  width:100%;
  margin:0 auto 24px;
  padding:20px;

}

/* アプリ上部は独立カードにせず、同じシェルのヘッダーとして扱う */
.nstudio-page .nstudio-app-shell>.nstudio-top-control-section{

  border-radius:0!important;
  
  
}
.nstudio-page .nstudio-app-shell>.nstudio-top-control-section::after{
  content:"";
  
  width:100%;
  height:1px;
  margin-top:2px;
  background:linear-gradient(90deg,transparent,rgba(65,83,77,.14) 9%,rgba(65,83,77,.14) 91%,transparent);
}

/* 3カラムは同じ制作面の中に置く */
.nstudio-page .nstudio-app-shell>.order-layout{
  width:100%;
  margin:0!important;
  padding:20px 0 24px;
}
.nstudio-page .nstudio-app-shell>.order-layout>.panel,
.nstudio-page .nstudio-app-shell>.order-layout>.preview-panel,
.nstudio-page .nstudio-app-shell>.order-layout>.nstudio-design-sidebar{
  align-self:stretch;
}

/* 最終確認：3カラムと同じ左右幅を使う下段 */
.nstudio-page .nstudio-final-review{
  width:100%;
  margin:0;
  padding:22px 0 4px;
  
}
.nstudio-page .nstudio-final-review-heading{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 18px;
  color:#344b44;
  font-size:20px;
  line-height:1.35;
  font-weight:900;
  letter-spacing:.03em;
}
.nstudio-page .nstudio-final-review-heading::before,
.nstudio-page .nstudio-final-review-heading::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:rgba(65,83,77,.10);
}
.nstudio-page .nstudio-final-review-heading::before{margin-right:16px;}
.nstudio-page .nstudio-final-review-heading::after{margin-left:16px;}

.nstudio-page .nstudio-final-review .nstudio-editor-summary{
  display:grid!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;

  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-final-review .nstudio-editor-summary-spec,
.nstudio-page .nstudio-final-review .nstudio-final-image-column,
.nstudio-page .nstudio-final-review .nstudio-final-data-check-row{
  min-width:0;
  height:100%;
  padding:16px!important;
  border:0!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(66,86,79,.045)!important;
}
.nstudio-page .nstudio-final-review .nstudio-final-data-check-row{
  
  padding-top:16px!important;
}


.nstudio-page .nstudio-final-review .nstudio-data-check{
  width:100%!important;
}
.nstudio-page .nstudio-final-review .nstudio-data-check-body{
  padding:12px 0 0!important;
}

/* embed は制作面だけを使う */
.nstudio-page.is-nstudio-embed .nstudio-app-shell{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nstudio-page.is-nstudio-embed .nstudio-final-review{display:none!important;}

/* ---- original style block boundary ---- */

/* v34: headings */
.nstudio-page .nstudio-column-heading strong,
.nstudio-page .nstudio-column-heading h3{display:flex!important;align-items:center!important;gap:9px!important}
.nstudio-page .nstudio-column-heading strong>.icon,
.nstudio-page .nstudio-column-heading h3>.icon{margin:0!important;font-size:.9em!important;opacity:.92!important}
.nstudio-page .nstudio-column-heading-spec strong>.icon{color:#4f796e!important}
.nstudio-page .nstudio-column-heading-editor h3>.icon{color:#4e7289!important}
.nstudio-page .nstudio-column-heading-design strong>.icon{color:#6b5e78!important}

/* 左仕様: カードの二重枠をやめ、1枚の仕様面＋区切り線にする */
.nstudio-page .order-layout>aside.panel:first-of-type .form-block{
  
  border-bottom:1px solid rgba(66,86,79,.09)!important;
  
}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block:last-child{border-bottom:0!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.edgeFinish"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.type"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="designEnabled"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="baseColor.color"],
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-tie-spec{background:transparent!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"]{padding-top:4px!important;padding-bottom:9px!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"]{padding-top:8px!important}
.nstudio-page .order-layout>aside.panel:first-of-type .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field] .spec-block-title{
  min-height:0!important;margin:0 0 8px!important;padding:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;
  font-size:14px!important;line-height:1.45!important;
}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"] .spec-block-title{color:#344943!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.edgeFinish"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.type"] .spec-block-title{color:#756044!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="designEnabled"] .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="baseColor.color"] .spec-block-title{color:#497166!important}
.nstudio-page .nstudio-design-presence-note{margin:8px 1px 0!important;font-size:12px!important;line-height:1.7!important;color:#6f7975!important}
.nstudio-page .nstudio-design-presence-note strong{color:#465651!important}
.nstudio-page .nstudio-split-limit-note{margin:6px 0 0!important;color:#9b5d18!important;font-size:12px!important;font-weight:700!important}
.nstudio-page .nstudio-split-limit-note[hidden]{display:none!important}

/* 縫製設定は選択肢と同じブロック内 */
.nstudio-page .spec-field-sewing>.nstudio-pocket-spec{
  margin:10px 0 0!important;padding:10px 0 0!important;
  border:0!important;border-top:1px dashed rgba(117,96,68,.20)!important;
  background:transparent!important;border-radius:0!important;
}
.nstudio-page .spec-field-sewing>.nstudio-pocket-spec .spec-block-title{margin-bottom:7px!important;font-size:12px!important;color:#76654e!important}
.nstudio-page .spec-field-sewing>.nstudio-pocket-spec .nstudio-pocket-size-row{padding:0!important;border:0!important;background:transparent!important}

/* 画像調整: 必要な操作だけ */
.nstudio-page #imageSizePanel>.crop-row{display:none!important}
.nstudio-page #nstudioRightAdjustMount input[type="text"]{background:#fff!important}
.nstudio-page #nstudioAdvancedImageAdjustPanel{margin-top:10px!important;padding-top:10px!important;border-top:1px solid rgba(81,101,94,.10)!important}
.nstudio-page .nstudio-bgremove-main-toggle{display:flex!important;align-items:center!important;gap:7px!important;margin:0!important;font-size:12px!important;font-weight:800!important;color:#44534f!important}
.nstudio-page .nstudio-bgremove-fields{margin-top:10px!important}

/* 最終確認: 上段2列＋データチェック全幅。3カード共通デザイン */
.nstudio-page .nstudio-final-review .nstudio-final-card{
  min-width:0!important;padding:0!important;border:0!important;border-radius:12px!important;
  background:#fff!important;box-shadow:inset 0 0 0 1px rgba(66,86,79,.07)!important;overflow:hidden!important;
}
.nstudio-page .nstudio-final-review .nstudio-editor-summary-spec,
.nstudio-page .nstudio-final-review .nstudio-final-image-column{height:360px!important;min-height:360px!important;max-height:360px!important}
.nstudio-page .nstudio-final-review .nstudio-final-data-check-row{
  grid-column:1/-1!important;height:360px!important;min-height:360px!important;max-height:360px!important;
}
.nstudio-page .nstudio-final-card-title,
.nstudio-page .nstudio-final-review .inline-mockup-preview-head{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;
  min-height:48px!important;margin:0!important;padding:12px 15px!important;
  border:0!important;border-bottom:1px solid rgba(66,86,79,.08)!important;border-radius:0!important;
  background:#f4f7f6!important;color:#344a43!important;font-size:15px!important;line-height:1.35!important;font-weight:850!important;
}
.nstudio-page .nstudio-final-card-title>span:first-child,
.nstudio-page .nstudio-final-review .inline-mockup-preview-head strong{display:flex!important;align-items:center!important;gap:7px!important;font-size:15px!important;color:#344a43!important}
.nstudio-page .nstudio-final-card-title .icon{margin:0!important;color:#668279!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dt,
.nstudio-page .nstudio-final-review .nstudio-editor-summary dd{font-size:12px!important;line-height:1.48!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dt{color:#818b87!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dd{color:#34433e!important}
.nstudio-page .nstudio-final-review .summary-split-row{margin-top:-2px!important}

.nstudio-page .nstudio-final-review .nstudio-final-image-mount,
.nstudio-page .nstudio-final-review .inline-mockup-preview{height:100%!important;min-height:0!important}
.nstudio-page .nstudio-final-review .inline-mockup-preview{display:flex!important;flex-direction:column!important}
.nstudio-page .nstudio-final-review .inline-mockup-preview-body{
  flex:1 1 auto!important;min-height:0!important;margin:0!important;padding:12px!important;border-radius:0!important;background:#fafbfa!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
.nstudio-page .nstudio-final-review .inline-mockup-preview-body img{width:100%!important;height:100%!important;max-height:none!important;object-fit:contain!important}

.nstudio-page .nstudio-final-review .nstudio-final-data-check-title{min-height:48px!important}
.nstudio-page .nstudio-final-review .nstudio-final-data-check-row>.nstudio-data-check{
  margin:0!important;padding:0!important;border:0!important;background:#fff!important;
}
.nstudio-page .nstudio-final-review #nstudioDataCheckPanel>.nstudio-data-check-toggle{display:none!important}
.nstudio-page .nstudio-final-review #nstudioDataCheckPanel>.nstudio-data-check-body{
  display:block!important;padding:14px 15px 16px!important;
  border:0!important;border-radius:0!important;background:#fff!important;
}
.nstudio-page .nstudio-final-review .nstudio-data-check-body-head{margin-bottom:10px!important}
.nstudio-page .nstudio-final-review .nstudio-data-check-item{grid-template-columns:22px minmax(110px,150px) minmax(0,1fr)!important}

/* ---- original style block boundary ---- */

/* ===== 2026-08-25 responsive / specification cleanup ===== */

/* 左仕様欄の項目背景はすべて同じニュートラルグレー */
.nstudio-page .order-layout>aside.panel:first-of-type .form-block,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="size"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-key="panels"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="designEnabled"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="baseColor.color"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.edgeFinish"],
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field="sewing.type"],
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-pocket-spec,
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-tie-spec{
  background:#f3f4f4!important;
}

/* cm / mm / in: ラベルは説明、許可単位だけをProfile設定で表示 */
.nstudio-page .nstudio-size-title{align-items:center!important;margin-bottom:14px!important;}
.nstudio-page .nstudio-unit-control:not([hidden]){display:inline-flex!important;align-items:center!important;gap:7px!important;margin-left:14px!important;}
.nstudio-page .nstudio-unit-switch{
  display:inline-flex!important;align-items:center!important;gap:2px!important;padding:3px!important;
  border:1px solid #c7cfcc!important;border-radius:8px!important;background:#e9eceb!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.035)!important;
}
.nstudio-page .nstudio-unit-switch::before{display:none!important;content:none!important;}
.nstudio-page .nstudio-unit-switch button{
  min-width:42px!important;height:28px!important;padding:0 9px!important;border:0!important;border-radius:6px!important;
  background:transparent!important;color:#67726e!important;font-size:12px!important;font-weight:800!important;cursor:pointer!important;
}
.nstudio-page .nstudio-unit-switch button.is-active{background:#315d53!important;color:#fff!important;box-shadow:0 1px 3px rgba(28,55,48,.18)!important;}

/* 背景デザイン: アイコンは見出しの左だけ。説明文は左端へ揃える */

/* 全幅共通: 横はみ出しと謎の右余白を作らない */
.nstudio-page,
.nstudio-page #nstudio-editor,
.nstudio-page #nstudio-editor>.wrap,
.nstudio-page .order-layout,
.nstudio-page .order-layout>*{
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
}
.nstudio-page #nstudio-editor>.wrap{
  width:100%!important;
  max-width:1680px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:14px!important;
  padding-right:14px!important;
}
.nstudio-page .order-layout{
  width:100%!important;
  margin:0!important;
}

/* Final review tabs are controlled by the single mobile layout. */
.nstudio-page .nstudio-final-review-tabs{display:none}

/* ---- original style block boundary ---- */

/* v43: consolidated responsive/design workspace. Replaces v35-mobile/v36-mobile/v37-mobile/v40/v41/v42. */

/* One canonical top control: title,
save/open,
and product switch. */
.nstudio-page .nstudio-app-shell>.nstudio-top-control-section{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"title actions" "types types"!important;
  align-items:center!important;gap:14px 18px!important;min-height:0!important;margin:0!important;padding:4px 8px 18px!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
}
.nstudio-page .nstudio-app-shell>.nstudio-top-control-section::after{display:none!important}
.nstudio-page .nstudio-top-control-section .nstudio-mode-heading{
  grid-area:title!important;width:100%!important;max-width:100%!important;min-width:0!important;min-height:82px!important;margin:0!important;
  display:grid!important;grid-template-columns:78px max-content minmax(0,1fr)!important;grid-template-rows:auto auto!important;column-gap:12px!important;row-gap:4px!important;
  align-items:center!important;justify-content:start!important;text-align:left!important;
}
.nstudio-page .nstudio-top-control-section .nstudio-mode-mascot{display:block!important;grid-column:1!important;grid-row:1/3!important;width:76px!important;max-width:76px!important;height:80px!important;max-height:80px!important;margin:0!important;object-fit:contain!important}
.nstudio-page .nstudio-top-control-section .nstudio-mode-title{grid-column:2!important;grid-row:1!important;align-self:end!important;font-size:34px!important;line-height:1.05!important;font-weight:900!important;letter-spacing:.035em!important;white-space:nowrap!important}
.nstudio-page .nstudio-top-control-section .nstudio-mode-description{grid-column:3!important;grid-row:1/3!important;align-self:center!important;min-width:0!important;margin:0 0 0 8px!important;color:#586761!important;font-weight:650!important;letter-spacing:.01em!important;text-align:left!important;}
.nstudio-page .nstudio-top-control-section .nstudio-mode-tagline{grid-column:2!important;grid-row:2!important;align-self:start!important;margin:0!important;font-size:13px!important;line-height:1.25!important}
.nstudio-page .nstudio-top-control-section .nstudio-top-actions{grid-area:actions!important;display:flex!important;flex-direction:column!important;align-items:flex-end!important;justify-content:center!important;gap:11px!important;min-height:82px!important;margin:0!important;padding:0!important}
.nstudio-page .nstudio-top-control-section .nstudio-top-utility-row{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;min-height:36px!important}
.nstudio-page .nstudio-top-control-section .nstudio-save-hub{display:flex!important;align-items:center!important;justify-content:flex-end!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important}
.nstudio-page .nstudio-top-control-section .nstudio-type-grid{grid-area:types!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin:0!important}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section{display:none!important}


/* Consolidated from the old v35-v37 request layers. */
.nstudio-page .editor-mode-row{justify-content:center!important;text-align:center!important}
.nstudio-page .editor-mode-switch{margin-left:auto!important;margin-right:auto!important}
.nstudio-page .editor-mode-switch .mode-btn{padding:10px 18px!important;font-size:15px!important;line-height:1.25!important;}
.nstudio-page .preview-head.nstudio-column-heading-editor{justify-content:center!important;text-align:center!important}
.nstudio-page .preview-head.nstudio-column-heading-editor .nstudio-column-heading-copy{width:100%!important;display:flex!important;justify-content:center!important;text-align:center!important}

.nstudio-page .order-layout>aside.panel:first-of-type{padding:14px!important;border:1px solid rgba(74,101,92,.10)!important;border-radius:14px!important;background:#fff!important;box-shadow:none!important}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block{margin:0 0 9px!important;padding:12px!important;border:0!important;border-radius:10px!important;background:#f3f4f4!important;box-shadow:none!important}
.nstudio-page .order-layout>aside.panel:first-of-type .spec-block-title,
.nstudio-page .order-layout>aside.panel:first-of-type .form-block[data-spec-field] .spec-block-title{min-height:0!important;margin:0 0 9px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#344943!important;font-size:14px!important;line-height:1.4!important;font-weight:850!important}
.nstudio-page .order-layout>aside.panel:first-of-type .spec-block-title>.icon,
.nstudio-page .order-layout>aside.panel:first-of-type .spec-block-title>span:first-child>.icon{display:none!important}
.nstudio-page .nstudio-column-heading-spec .icon{display:inline-block!important}
.nstudio-page .spec-field-size .size-custom.custom-size-panel{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;width:100%!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.nstudio-page #nstudioSplitAutoNote{display:none!important}
.nstudio-page .nstudio-auto-split-toggle{white-space:nowrap!important}


/* Desktop final review keeps the established 3-column proportions; mobile overrides below. */
.nstudio-page .nstudio-final-review .nstudio-editor-summary{grid-template-columns:minmax(230px,.88fr) minmax(260px,.68fr) minmax(360px,1.44fr)!important;gap:14px!important;align-items:stretch!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary-spec,
.nstudio-page .nstudio-final-review .nstudio-final-image-column,
.nstudio-page .nstudio-final-review .nstudio-final-data-check-row{grid-column:auto!important;height:380px!important;min-height:380px!important;max-height:380px!important}
.nstudio-page .nstudio-final-review .nstudio-summary-title.nstudio-final-card-title,
.nstudio-page .nstudio-final-review .nstudio-final-data-check-title,
.nstudio-page .nstudio-final-review .inline-mockup-preview-head{min-height:48px!important;margin:0!important;padding:12px 15px!important;border:0!important;border-bottom:1px solid rgba(66,86,79,.08)!important;border-radius:0!important;background:#f4f7f6!important;color:#344a43!important;box-shadow:none!important}
.nstudio-page .nstudio-final-review .nstudio-final-card-scroll{height:calc(100% - 48px)!important;overflow:auto!important;padding:12px 14px 15px!important;scrollbar-gutter:stable}
.nstudio-page .nstudio-final-review #nstudioDataCheckPanel>.nstudio-data-check-body{height:332px!important;max-height:332px!important;overflow:auto!important;scrollbar-gutter:stable}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dl{grid-template-columns:minmax(70px,.52fr) minmax(0,1.48fr)!important;gap:6px 10px!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dt,
.nstudio-page .nstudio-final-review .nstudio-editor-summary dd{margin:0!important;padding:3px 0!important;font-size:12px!important;line-height:1.5!important}
.nstudio-page .nstudio-final-review .nstudio-editor-summary dd{overflow-wrap:anywhere}
@media(max-width:1100px) and (min-width:1001px){.nstudio-page .nstudio-final-review .nstudio-editor-summary{grid-template-columns:minmax(0,.9fr) minmax(0,.72fr) minmax(0,1.38fr)!important;gap:10px!important}}

/* ===== desktop design sidebar ===== */
.nstudio-page .nstudio-design-main-tabs{
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;
  margin:2px 0 22px!important;padding:5px!important;border:1px solid #cbd6d2!important;
  border-radius:11px!important;background:#e9eeec!important;box-shadow:0 1px 3px rgba(34,54,47,.06)!important;
}
.nstudio-page .nstudio-design-main-tabs button{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  min-width:0!important;min-height:44px!important;padding:9px 10px!important;border:0!important;border-radius:8px!important;
  background:transparent!important;color:#47554f!important;font:inherit!important;font-size:12px!important;font-weight:800!important;cursor:pointer!important;
}
.nstudio-page .nstudio-design-main-tabs button:hover{background:#f8faf9!important;color:#243b34!important}
.nstudio-page .nstudio-design-main-tabs button.is-active{background:#425f56!important;color:#fff!important;box-shadow:0 1px 5px rgba(31,53,46,.18)!important}
.nstudio-page .nstudio-design-main-tabs button .icon{margin:0!important;font-size:13px!important}
.nstudio-page .nstudio-design-main-tabs button.is-active .icon{color:#fff!important}
.nstudio-page .nstudio-design-main-panel[hidden]{display:none!important}
.nstudio-page .nstudio-design-main-panel{min-width:0!important}

.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tools{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin:0 0 20px!important;
}
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tool{
  min-height:60px!important;padding:8px 5px!important;border:1px solid #dce4e1!important;border-radius:10px!important;
  background:#fff!important;color:#465953!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:5px!important;font:inherit!important;font-size:12px!important;font-weight:750!important;cursor:pointer!important;
}
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tool .icon{margin:0!important;font-size:16px!important;color:#5b776e!important}
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tool:hover,
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tool.is-active{border-color:#8ea69e!important;background:#f1f6f4!important;color:#29483f!important}

.nstudio-page .nstudio-design-inline-tool{margin-top:18px!important;border-top:0!important;}
.nstudio-page .nstudio-design-inline-tool-head{
  margin:0 0 16px!important;padding:0 0 11px!important;border:0!important;border-bottom:1px solid #e4e8e6!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
.nstudio-page .nstudio-design-inline-tool-head strong{font-size:13px!important;line-height:1.35!important;color:#303936!important}
.nstudio-page .nstudio-inline-tool-close{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:32px!important;padding:5px 8px!important;border:1px solid #d9e0dd!important;border-radius:7px!important;background:#fff!important;color:#5d6964!important;font:inherit!important;font-size:12px!important;font-weight:800!important;cursor:pointer!important}
.nstudio-page .nstudio-inline-tool-close .icon{margin:0!important}
.nstudio-page .nstudio-design-quick-heading,
.nstudio-page .nstudio-design-quick-card .nstudio-design-quick-heading{margin:0 0 13px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.nstudio-page #nstudioRightUploadPanelMount .nstudio-design-quick-upload{display:block!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.nstudio-page #nstudioRightUploadPanelMount{padding-bottom:8px!important}

.nstudio-page .nstudio-context-adjust-panel{margin:0 0 20px!important;}
.nstudio-page .nstudio-context-adjust-panel>#nstudioMultiAlignPanel,
.nstudio-page .nstudio-context-adjust-panel>.nstudio-selected-adjust-wrap{margin:0 0 10px!important}
.nstudio-page .nstudio-context-adjust-panel>.nstudio-selected-adjust-wrap:last-child,
.nstudio-page .nstudio-context-adjust-panel>#nstudioMultiAlignPanel:last-child{margin-bottom:0!important}
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="surface"] .nstudio-design-cloth-card{margin:0!important;border:0!important;box-shadow:none!important;}

/* Desktop: material/background are true side drawers. One content DOM is reused by mobile. */
@media (min-width:1025px){
  .nstudio-page .nstudio-side-drawer{display:flex!important}
  
}

/* ===== mobile workspace ===== */
.nstudio-page .nstudio-mobile-bottom-nav,
.nstudio-page .nstudio-mobile-workspace-backdrop,
.nstudio-page .nstudio-mobile-sheet-close,
.nstudio-page .nstudio-mobile-drawing-sheet,
.nstudio-page .nstudio-mobile-adjust-sheet{display:none}

/* Narrow workspace is controlled only by JS layout state. No independent viewport breakpoint here. */
html.nstudio-layout-narrow.nstudio-mobile-sheet-lock,
html.nstudio-layout-narrow.nstudio-mobile-sheet-lock body{overscroll-behavior:none!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed){padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))!important;overflow-x:clip!important}
html.nstudio-layout-narrow .nstudio-page #nstudio-editor>.wrap,
html.nstudio-layout-narrow .nstudio-page .nstudio-app-shell,
html.nstudio-layout-narrow .nstudio-page .order-layout,
html.nstudio-layout-narrow .nstudio-page .preview-panel{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-app-shell{margin:0!important;padding:8px 6px 12px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-app-shell>.nstudio-top-control-section{display:grid!important;grid-template-columns:1fr!important;grid-template-areas:"title" "actions" "types"!important;gap:10px!important;min-height:0!important;padding:8px 8px 14px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-mode-heading{width:100%!important;grid-template-columns:64px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-mode-mascot{grid-row:1/4!important;width:62px!important;max-width:62px!important;height:70px!important;max-height:70px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-mode-title{font-size:27px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-mode-description{display:block!important;grid-column:2!important;grid-row:3!important;align-self:start!important;min-width:0!important;max-width:100%!important;margin:11px 0 0!important;font-size:13px!important;line-height:1.5!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-mode-tagline{grid-row:2!important;font-size:12px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-top-actions{align-items:stretch!important;min-width:0!important;min-height:0!important;gap:12px!important;margin-top:8px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-top-utility-row{justify-content:flex-start!important;min-width:0!important;min-height:34px!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-save-hub{justify-content:center!important;min-width:0!important;flex-wrap:wrap!important;overflow:visible!important;padding-top:10px!important;border-top:1px solid #e6ebe8!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-type-grid{gap:7px!important}
html.nstudio-layout-narrow .nstudio-page .order-layout{display:block!important;margin:0!important;padding:0!important}
html.nstudio-layout-narrow .nstudio-page .order-layout>.preview-panel{display:block!important;position:relative!important;width:100%!important;margin:0!important;padding:8px!important;z-index:1!important}
html.nstudio-layout-narrow .nstudio-page .preview-head.nstudio-column-heading-editor{justify-content:center!important;text-align:center!important}
html.nstudio-layout-narrow .nstudio-page .preview-head .nstudio-column-heading-copy{width:100%!important;display:flex!important;justify-content:center!important}
html.nstudio-layout-narrow .nstudio-page .editor-mode-row{justify-content:center!important;margin-bottom:14px!important}
html.nstudio-layout-narrow .nstudio-page .editor-mode-switch{width:min(100%,560px)!important;margin:0 auto!important}
  /* Spec and design become the only two workspace sheets. */
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) .order-layout>.nstudio-spec-sidebar,
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) .order-layout>#nstudioDesignSidebar{position:fixed!important;z-index:99720!important;left:50%!important;right:auto!important;top:auto;bottom:calc(70px + env(safe-area-inset-bottom,0px))!important;
    width:min(680px,calc(100vw - 4px))!important;height:auto!important;min-height:0!important;max-height:min(68dvh,620px,calc(100dvh - 82px - env(safe-area-inset-bottom,0px)))!important;
    margin:0!important;padding:0 10px 14px!important;box-sizing:border-box!important;border:1px solid rgba(57,79,72,.13)!important;border-radius:18px 18px 12px 12px!important;
    background:#fff!important;box-shadow:0 -10px 34px rgba(23,38,33,.20)!important;overflow:auto!important;overscroll-behavior:contain!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translate(-50%,calc(100% + 92px))!important;
    transition:transform .22s ease,opacity .16s ease,visibility .16s ease!important;}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed).nstudio-mobile-sheet-spec .order-layout>.nstudio-spec-sidebar,
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed).nstudio-mobile-sheet-design .order-layout>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed).nstudio-mobile-sheet-surface .order-layout>#nstudioDesignSidebar{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate(-50%,0)!important}
html.nstudio-layout-narrow .nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title,
html.nstudio-layout-narrow .nstudio-page .order-layout>#nstudioDesignSidebar>.nstudio-design-sidebar-head{position:sticky!important;z-index:6!important;top:0!important;min-height:54px!important;margin:0 -10px 12px!important;padding:10px 52px 10px 14px!important;
    border-bottom:1px solid #e6e9e7!important;background:rgba(255,255,255,.97)!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;}
html.nstudio-layout-narrow .nstudio-page .order-layout>.nstudio-spec-sidebar .nstudio-mobile-sheet-close,
html.nstudio-layout-narrow .nstudio-page .order-layout>#nstudioDesignSidebar .nstudio-mobile-sheet-close{display:flex!important}
html.nstudio-layout-narrow .nstudio-page #nstudioDesignSidebar .nstudio-design-main-tabs{display:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tools{grid-template-columns:repeat(3,minmax(0,1fr))!important;margin-bottom:18px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="add"] .nstudio-design-primary-tool{min-height:56px!important}
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-dropzone{min-height:0!important;padding:8px!important;border:0!important;background:transparent!important;display:block!important;text-align:left!important}
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-icon,
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-title,
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-copy,
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-note{display:none!important}
html.nstudio-layout-narrow .nstudio-page #nstudioQuickUploadMount .main-upload-prominent{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-height:44px!important;padding:9px 11px!important;font-size:12px!important;border-radius:9px!important}
  /* Mobile uses in-sheet switching,
never the desktop drawers. */
html.nstudio-layout-narrow .nstudio-page .nstudio-side-drawer,
html.nstudio-layout-narrow .nstudio-page .nstudio-drawer-backdrop{display:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-surface-home[hidden]{display:none!important}
  /* Fixed bottom navigation: NUNO palette, five distinct tap targets. */
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav{position:fixed!important;z-index:99740!important;left:50%!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;transform:translateX(-50%)!important;
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px!important;width:min(680px,calc(100vw - 12px))!important;
    padding:5px!important;border:1px solid #cfc6b8!important;border-radius:14px!important;background:#eee8de!important;color:#384943!important;box-shadow:0 8px 28px rgba(35,49,44,.24)!important;}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button{min-width:0!important;min-height:50px!important;padding:7px 3px!important;border:1px solid #d9d1c5;border-radius:9px!important;background:#fffdf9!important;color:#45534e!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;font:inherit!important;font-size:12px!important;line-height:1.15!important;font-weight:500!important;cursor:pointer!important;box-shadow:0 1px 2px rgba(43,55,50,.05)}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button .icon{margin:0!important;font-size:17px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav .nstudio-mobile-nav-drawing-svg{display:block;width:18px;height:18px;margin:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav .nstudio-mobile-nav-drawing-svg.is-outline-shape{fill:#fff;stroke:currentColor}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav .nstudio-mobile-nav-drawing-svg.is-filled{fill:currentColor;stroke:none}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button:hover,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button:focus-visible{background:#f5f1ea!important;border-color:#b9c9c2;color:#314b43!important;outline:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button.is-active{background:#dfeae6!important;border-color:#87a398;color:#294c42!important;box-shadow:inset 0 0 0 1px rgba(83,126,113,.10)!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav button:disabled{opacity:.42;cursor:default;background:#f4f1ec}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-workspace-backdrop{position:fixed!important;z-index:99700!important;inset:0!important;display:block!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;background:rgba(21,31,28,.42)!important;transition:opacity .18s ease,visibility .18s ease!important}
html.nstudio-layout-narrow .nstudio-page.nstudio-mobile-sheet-open .nstudio-mobile-workspace-backdrop{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
  /* Short contextual edit entry point. */
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-prompt{position:absolute!important;z-index:28!important;transform:translateX(-50%)!important;max-width:none!important;min-height:40px!important;padding:8px 12px!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:999px!important;background:#252525!important;color:#fff!important;box-shadow:0 5px 18px rgba(0,0,0,.28)!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;font-size:12px!important;font-weight:850!important;line-height:1.2!important;cursor:pointer!important;white-space:nowrap!important;text-align:center!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-prompt[hidden]{display:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-prompt .icon{margin:0!important;font-size:14px!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-sheet{position:fixed!important;z-index:99730!important;left:50%!important;right:auto!important;bottom:calc(70px + env(safe-area-inset-bottom,0px))!important;width:min(680px,calc(100vw - 4px))!important;height:auto!important;max-height:min(68dvh,620px,calc(100dvh - 82px - env(safe-area-inset-bottom,0px)))!important;margin:0!important;padding:0 10px 14px!important;border:1px solid rgba(57,79,72,.13)!important;border-radius:18px 18px 12px 12px!important;background:#fff!important;box-shadow:0 -10px 34px rgba(23,38,33,.20)!important;overflow:auto!important;overscroll-behavior:contain!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translate(-50%,calc(100% + 92px))!important;transition:transform .22s ease,opacity .16s ease,visibility .16s ease!important;display:block!important}
html.nstudio-layout-narrow .nstudio-page.nstudio-mobile-sheet-drawing .nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page.nstudio-mobile-sheet-adjust .nstudio-mobile-adjust-sheet{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate(-50%,0)!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-head,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-head{position:sticky!important;z-index:6!important;top:0!important;min-height:54px!important;margin:0 -10px 12px!important;padding:10px 52px 10px 14px!important;border-bottom:1px solid #e6e9e7!important;background:rgba(255,255,255,.97)!important;display:flex!important;align-items:center!important;justify-content:flex-start!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-head strong,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-head strong,
html.nstudio-layout-narrow .nstudio-page .order-layout>.nstudio-design-sidebar>.nstudio-design-sidebar-head strong{font-size:14px!important;color:#29332f!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-head .nstudio-mobile-sheet-close,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-head .nstudio-mobile-sheet-close{display:flex!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:0 0 4px}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid>button{min-width:0;min-height:58px;padding:7px 4px;border:1px solid #d8dfdc;border-radius:9px;background:#fbfcfb;color:#34453f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font:inherit;font-size:12px;font-weight:500;line-height:1.15;cursor:pointer}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid>button.is-active{border-color:#73998d;background:#e4efeb;color:#234a40}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid>button .icon{margin:0;font-size:18px}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid .nstudio-drawing-tool-svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.7}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid .nstudio-drawing-tool-svg.is-outline-shape{fill:#fff;stroke:currentColor}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-grid .nstudio-drawing-tool-svg.is-filled{fill:currentColor;stroke:none}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-separator{display:none}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-mount>.nstudio-context-adjust-panel{margin:0!important;padding:0!important;border:0!important;background:transparent!important}
  /* Final review stays below the workspace and starts collapsed as three compact buttons. */
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview{position:relative!important;z-index:1!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:18px 0 84px!important;padding:8px!important;border:0!important;border-radius:0!important;background:#fff!important;box-shadow:none!important;overflow:visible!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview>.nstudio-final-review-heading{display:none!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview>.nstudio-final-review-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview>.nstudio-final-review-tabs button{min-width:0!important;min-height:44px!important;padding:7px 5px!important;border:1px solid #d9dfdc!important;border-radius:9px!important;background:#f6f8f7!important;color:#52625d!important;font:inherit!important;font-size:12px!important;font-weight:850!important;white-space:normal!important;cursor:pointer!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview>.nstudio-final-review-tabs button .icon{display:block!important;margin:0 auto 3px!important;font-size:15px!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview>.nstudio-final-review-tabs button.is-active{background:#425f56!important;border-color:#425f56!important;color:#fff!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview .nstudio-editor-summary{display:none!important;width:100%!important;margin:10px 0 0!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview.is-mobile-review-expanded .nstudio-editor-summary{display:block!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview .nstudio-final-card{display:none!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview.is-mobile-review-expanded .nstudio-final-card.is-final-tab-active{display:block!important}
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #nstudioFinalReview .nstudio-final-card-scroll{height:auto!important;max-height:360px!important}
  /* Embed mobile keeps specification inline above the workspace.
     Image / cloth / drawing / edit use the same visual sheet treatment as standalone. */
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed{padding-bottom:0!important;overflow-x:clip!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed #nstudioFinalReview{display:none!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed #nstudio-editor>.wrap{padding:0!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-app-shell{margin:0!important;padding:4px!important;border:0!important;border-radius:0!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .order-layout.nstudio-embed-mobile-workspace{position:relative!important;isolation:isolate!important;overflow:hidden!important;}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .order-layout.nstudio-embed-mobile-workspace>.preview-panel.nstudio-embed-mobile-workspace-host{position:relative!important;z-index:1!important;overflow:hidden!important;}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-bottom-nav{position:absolute!important;z-index:40!important;left:8px!important;right:8px!important;bottom:8px!important;width:auto!important;max-width:calc(100% - 16px)!important;transform:none!important;margin:0!important;display:flex!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-mobile-bottom-nav [data-nstudio-mobile-sheet="spec"]{display:none!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-canvas-status-row{margin-bottom:30px;}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-workspace-backdrop{position:absolute!important;z-index:20!important;inset:0!important;border-radius:10px!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{
  display:block!important;position:absolute!important;z-index:30!important;left:8px!important;right:8px!important;top:auto!important;bottom:68px!important;
  width:auto!important;height:auto!important;min-height:0!important;max-height:min(68%,620px,calc(100% - 76px))!important;margin:0!important;
  padding:0 10px 14px!important;box-sizing:border-box!important;border:1px solid rgba(57,79,72,.13)!important;border-radius:18px 18px 12px 12px!important;
  background:#fff!important;box-shadow:0 -10px 34px rgba(23,38,33,.20)!important;overflow:auto!important;overscroll-behavior:contain!important;
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(calc(100% + 84px))!important;
  transition:transform .22s ease,opacity .16s ease,visibility .16s ease!important;
}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{z-index:35!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed.nstudio-mobile-sheet-design .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed.nstudio-mobile-sheet-surface .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed.nstudio-mobile-sheet-drawing .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed.nstudio-mobile-sheet-adjust .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{
  transform:translateY(0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important
}


@media (max-width:560px){
  .nstudio-page:not(.is-nstudio-embed) .order-layout>.nstudio-spec-sidebar,
  .nstudio-page:not(.is-nstudio-embed) .order-layout>#nstudioDesignSidebar,
  .nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-drawing-sheet,
  .nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-adjust-sheet{
    width:calc(100vw - 4px)!important;height:auto!important;max-height:min(68dvh,620px,calc(100dvh - 82px - env(safe-area-inset-bottom,0px)))!important;
    bottom:calc(68px + env(safe-area-inset-bottom,0px))!important;border-radius:18px 18px 12px 12px!important
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-bottom-nav{width:calc(100vw - 8px)!important;bottom:calc(4px + env(safe-area-inset-bottom,0px))!important;border-radius:12px!important}
  .nstudio-page .nstudio-mobile-bottom-nav button{min-height:48px!important}
  /* svh stays stable while browser chrome expands/collapses during page scroll.
     Fabric therefore never exposes the striped canvas-area below its frozen pixel size. */
  .nstudio-page:not(.is-nstudio-embed) #editModePanel .design-shell{height:clamp(360px,62svh,580px)!important;min-height:0!important}
}

/* Narrow standalone edit canvas uses the stable small viewport height.
   Browser toolbar show/hide during page scroll must not grow the CSS box underneath Fabric. */
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) #editModePanel .design-shell{
  height:clamp(360px,62svh,580px)!important;
  min-height:0!important;
}

/* ---- original style block boundary ---- */

/* v44: visual cleanup / editor history / compact review */
.nstudio-page{margin-top:0!important;}
.nstudio-page .nstudio-app-shell{
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-app-shell>.order-layout{background:#fff!important;}
.nstudio-page .order-layout>aside.panel:first-of-type,
.nstudio-page .preview-panel,
.nstudio-page .nstudio-design-sidebar{
  box-shadow:none!important;
}

/* product selector */
.nstudio-page .nstudio-top-control-section .nstudio-type-grid .option span{
  min-height:52px!important;
  padding:10px 12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  text-align:center!important;
  font-size:14px!important;
  line-height:1.3!important;
  font-weight:800!important;
}
.nstudio-page .nstudio-top-control-section .nstudio-type-grid .option span .icon{
  margin:0!important;
  font-size:15px!important;
  line-height:1!important;
}
.nstudio-page .nstudio-top-control-section .nstudio-type-grid .option input:checked+span{
  background:#e7f0f6!important;color:#365d75!important;border-color:#8faebe!important;
  box-shadow:inset 0 0 0 1px rgba(74,119,146,.10)!important;
}
.nstudio-page .nstudio-top-control-section .nstudio-type-grid .option input:checked+span .icon{color:#4d7690!important;}
.nstudio-page .nstudio-final-review{border-top:0!important;}
@media (min-width:1025px){
  .nstudio-page .order-layout>.nstudio-spec-sidebar,
.nstudio-page .order-layout>.preview-panel,
.nstudio-page .order-layout>.nstudio-design-sidebar{
    border:1px solid #e1e4e3!important;border-radius:12px!important;background:#fff!important;
  }
}

/* product + undo/redo row */
.nstudio-page .nstudio-editor-context-row{
  display:flex!important;
  align-items:center!important;
  
  gap:12px!important;
  min-height:40px!important;
  margin:0 0 10px!important;
}
.nstudio-page .nstudio-editor-product-name{
  display:flex!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.nstudio-page .nstudio-editor-product-name .nstudio-product-name{
  font-size:12px!important;
  line-height:1.35!important;
  color:#5b6662!important;
}
.nstudio-page .nstudio-editor-history-top{
  display:flex!important;
  width:auto!important;
  margin:0!important;
  gap:5px!important;
}
.nstudio-page .nstudio-editor-history-top .action-btn{
  min-height:34px!important;
  padding:6px 9px!important;
  font-size:12px!important;
  white-space:nowrap!important;
}

/* reset is intentionally tucked away */

/* export belongs to the finish/check area */
.nstudio-page .nstudio-final-export-actions{
  display:flex!important;
  justify-content:center!important;
  margin:14px 0 0!important;
}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown{position:relative!important;overflow:visible!important;}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  list-style:none!important;
  cursor:pointer!important;
}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn::-webkit-details-marker{display:none!important;}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn::after{
  content:"▼";margin-left:3px;font-size:12px;opacity:.65;
}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>.editor-file-menu{
  position:absolute!important;
  z-index:10000!important;
  left:50%!important;
  right:auto!important;
  top:calc(100% + 6px)!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  min-width:250px!important;
}

/* desktop inline tools do not need a return button */
@media (min-width:1025px){
  .nstudio-page #nstudioInlineToolClose{display:none!important;}
}

/* mobile sheets */
@media (max-width:1024px){
  .nstudio-page .preview-head.nstudio-column-heading-editor{display:flex!important;}
  .nstudio-page #nstudio-editor>.wrap{width:100%!important;padding-left:2px!important;padding-right:2px!important;}
  .nstudio-page .nstudio-app-shell{width:100%!important;padding-left:2px!important;padding-right:2px!important;}
  .nstudio-page .order-layout>.preview-panel{width:100%!important;padding-left:4px!important;padding-right:4px!important;border:0!important;border-radius:0!important;}
  /* Mobile sheet borders/radius/shadow are owned by the canonical sheet rules above.
     Do not strip them here; standalone and embed must look the same. */
  .nstudio-page #nstudioFinalReview{border:0!important;border-radius:0!important;padding-left:2px!important;padding-right:2px!important;}
  .nstudio-page .nstudio-top-control-section .nstudio-type-grid .option span{
    min-height:50px!important;
    padding:9px 7px!important;
    font-size:13px!important;
  }
  .nstudio-page .nstudio-editor-context-row{
    justify-content:center!important;
    margin-bottom:8px!important;
  }
  .nstudio-page .nstudio-editor-product-name{display:none!important;}
  .nstudio-page .nstudio-editor-history-top .action-btn{
    min-width:44px!important;
    min-height:38px!important;
    padding:7px 10px!important;
    font-size:12px!important;
  }

  .nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title,
.nstudio-page .order-layout>.nstudio-design-sidebar>.nstudio-design-sidebar-head,
.nstudio-page .nstudio-mobile-adjust-head{
    position:sticky!important;
    top:0!important;
    min-height:56px!important;
    padding:10px 58px 10px 14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
  }
  .nstudio-page .nstudio-mobile-sheet-close{
    position:absolute!important;
    right:10px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#f1f3f2!important;
    color:#46534e!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .nstudio-page .nstudio-mobile-sheet-close .icon{margin:0!important;font-size:16px!important;}

  .nstudio-page #nstudioInlineToolClose:not([hidden]){
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    min-width:78px!important;
    min-height:38px!important;
    padding:7px 10px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .nstudio-page #nstudioInlineToolClose[hidden]{display:none!important;}

  /* compact "final review" = heading + 3 buttons, panel opens only after tap */
  .nstudio-page #nstudioFinalReview{
    padding:18px 6px 6px!important;
    border-top:1px solid #e5e8e7!important;
  }
  .nstudio-page #nstudioFinalReview>.nstudio-final-review-heading{
    display:flex!important;
    justify-content:center!important;
    margin:0 0 9px!important;
    padding:0!important;
    min-height:0!important;
    border:0!important;
    background:transparent!important;
    font-size:14px!important;
    line-height:1.3!important;
    font-weight:850!important;
  }
  .nstudio-page #nstudioFinalReview>.nstudio-final-review-heading .nstudio-mobile-sheet-close{display:none!important;}
  .nstudio-page #nstudioFinalReview>.nstudio-final-review-tabs{
    position:static!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
  }
  .nstudio-page #nstudioFinalReview>.nstudio-final-review-tabs button{
    min-height:42px!important;
    padding:7px 5px!important;
    border:1px solid #dadddc!important;
    border-radius:9px!important;
    background:#fff!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
  .nstudio-page #nstudioFinalReview>.nstudio-final-review-tabs button.is-active{
    background:#f2f4f3!important;
    color:#263b35!important;
  }
  .nstudio-page #nstudioFinalReview:not(.is-mobile-review-expanded) .nstudio-editor-summary{
    display:none!important;
  }
    }

/* ---- original style block boundary ---- */

/* v45: specification border / design spacing / shape module / cloth color / export */
/* 仕様内の各項目には枠を重ねない。カラム外枠は3カラム共通ルールで統一する */
.nstudio-page .order-layout>.nstudio-spec-sidebar>.form-block{border:0!important;}

/* デザイン内の各ツール見出しを上端から離す */
.nstudio-page .nstudio-design-inline-tool{padding-top:18px!important;}
.nstudio-page .nstudio-design-inline-tool-head{margin-top:4px!important;margin-bottom:20px!important;padding-top:0!important;}
.nstudio-page .nstudio-design-inline-tool-section:not([hidden]){margin-top:20px!important;}




/* 布色は独立した淡い面にし、背景デザインとの距離を取る */
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="surface"] .nstudio-design-cloth-card{padding:0!important;background:transparent!important;}
.nstudio-page .nstudio-cloth-color-block{padding:14px!important;border:0!important;border-radius:10px!important;}
.nstudio-page .nstudio-cloth-color-block .nstudio-design-quick-heading{margin-bottom:12px!important;}
.nstudio-page .nstudio-design-main-panel[data-nstudio-design-main-panel="surface"] .nstudio-design-section-separator{height:0!important;margin:24px 0 18px!important;border:0!important;}


/* 袋縫い/チ設定は縫製ブロック内で左端を揃え、数値欄はサイズ欄と同じ入力枠 */
.nstudio-page .spec-field-sewing>.nstudio-pocket-spec,
.nstudio-page .spec-field-sewing>.nstudio-tie-spec{
  width:100%!important;margin:12px 0 0!important;padding:12px 0 0!important;border:0!important;border-top:1px dashed rgba(117,96,68,.20)!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;box-sizing:border-box!important;
}
.nstudio-page .spec-field-sewing>.nstudio-pocket-spec .spec-block-title,
.nstudio-page .spec-field-sewing>.nstudio-tie-spec .spec-block-title{margin:0 0 10px!important;padding:0!important;font-size:12px!important;color:#76654e!important;}
.nstudio-page .spec-field-sewing .nstudio-pocket-size-row,
.nstudio-page .spec-field-sewing .nstudio-tie-subfield,
.nstudio-page .spec-field-sewing .nstudio-tie-size-row{width:100%!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-sizing:border-box!important;}
.nstudio-page .spec-field-sewing .nstudio-tie-spec-grid{gap:12px!important;align-items:stretch!important;}
.nstudio-page .spec-field-sewing .nstudio-pocket-size-row>label,
.nstudio-page .spec-field-sewing .nstudio-tie-size-row>label{display:grid!important;grid-template-columns:var(--nstudio-tie-label-width,48px) minmax(0,132px)!important;align-items:center!important;justify-content:start!important;gap:8px!important;width:100%!important;margin:0!important;}
.nstudio-page .spec-field-sewing .nstudio-tie-size-row{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;}
.nstudio-page .spec-field-sewing .nstudio-tie-subfield{display:grid!important;align-items:center!important;justify-content:start!important;gap:8px!important;}
.nstudio-page .spec-field-sewing .nstudio-tie-check{margin:0!important;padding:0!important;}


/* 入稿書き出しは最終確認から少し離し、最終アクションとして大きく */
.nstudio-page .nstudio-final-export-actions{margin-top:24px!important;}
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn{
  min-width:280px!important;min-height:50px!important;padding:12px 20px!important;font-size:14px!important;font-weight:850!important;justify-content:center!important;
}

@media(max-width:1024px){
  .nstudio-page .nstudio-design-inline-tool{padding-top:18px!important;}
  .nstudio-page .nstudio-design-inline-tool-head{margin-bottom:16px!important;}
  .nstudio-page .nstudio-cloth-color-block{padding:13px!important;}
  .nstudio-page .nstudio-final-export-actions{margin-top:20px!important;}
  .nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown{width:100%!important;}
  .nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn{width:min(100%,360px)!important;min-width:0!important;min-height:48px!important;font-size:13px!important;}
}

/* ---- original style block boundary ---- */

/* v46: 3カラム外枠統一 / embed安定化 / デザイン見出し共通化 */
@media (min-width:1025px){
  .nstudio-page .order-layout>.nstudio-spec-sidebar,
.nstudio-page .order-layout>.preview-panel,
.nstudio-page .order-layout>#nstudioDesignSidebar{
    border:1px solid #dfe3e2!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
}
@media (max-width:1024px){
  .nstudio-page .order-layout>.nstudio-spec-sidebar,
.nstudio-page .order-layout>.preview-panel,
.nstudio-page .order-layout>#nstudioDesignSidebar{border:0!important;border-radius:0!important;}
}

/* 画像調整は中の調整パネルだけを見せ、外側の二重枠を作らない */
.nstudio-page .nstudio-context-adjust-panel{
  padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
.nstudio-page .nstudio-context-adjust-panel>.nstudio-selected-adjust-wrap{margin-top:0!important;padding-top:0!important;border-top:0!important;}

/* 布色は白。背景デザインとの区切りは余白だけで表現 */
.nstudio-page .nstudio-cloth-color-block{background:#fff!important;}

/* デザイン内は「見出し1つ + 説明」の共通フォーマット */
.nstudio-page .nstudio-design-inline-tool-head{
  display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;
}
.nstudio-page .nstudio-design-inline-tool-head-copy{min-width:0!important;display:block!important;}
.nstudio-page .nstudio-design-inline-tool-head-copy>strong{display:block!important;font-size:14px!important;line-height:1.35!important;color:#334640!important;}
.nstudio-page .nstudio-design-inline-tool-head-copy>small{display:block!important;margin-top:4px!important;font-size:12px!important;line-height:1.5!important;font-weight:500!important;color:#7a8581!important;}
.nstudio-page #nstudioRightUploadPanelMount .nstudio-design-quick-upload{padding-top:0!important;}

/* embedではワークスペース自体の見出しは不要 */
.nstudio-page.is-nstudio-embed:not([data-nstudio-layout="narrow"]) .preview-head.nstudio-column-heading-editor,
.nstudio-page.is-nstudio-embed:not([data-nstudio-layout="narrow"]) #nstudioDesignSidebar>.nstudio-design-sidebar-head{display:none!important;}
.nstudio-page.is-nstudio-embed #nstudioDesignSidebar{padding-top:10px!important;}

/* embedの上位2タブはアイコンと文字を必ず横中央に揃える */
.nstudio-page.is-nstudio-embed .nstudio-design-main-tabs button{
  display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  text-align:center!important;line-height:1.2!important;
}
.nstudio-page.is-nstudio-embed .nstudio-design-main-tabs button>.icon{
  display:inline-block!important;position:static!important;flex:0 0 auto!important;width:16px!important;margin:0!important;transform:none!important;text-align:center!important;
}
.nstudio-page.is-nstudio-embed .nstudio-design-main-tabs button>span{display:inline-block!important;min-width:0!important;}

/* embedはiframeの高さではなく横幅だけで編集領域サイズを決める。
   nstudioembed.php が通常フローの実高を親へ通知するため、vh/dvhは使わない。 */
.nstudio-page.is-nstudio-embed .design-shell,
.nstudio-page.is-nstudio-embed .preview-display-shell:not(#previewBgShell){
  height:var(--nstudio-embed-workspace-height,clamp(460px,58vw,620px))!important;
  min-height:0!important;
  max-height:none!important;
}
.nstudio-page.is-nstudio-embed .preview-display-shell:not(#previewBgShell){
  --nstudio-embed-workspace-height:clamp(420px,52vw,560px);
}
.nstudio-page.is-nstudio-embed .order-layout,
.nstudio-page.is-nstudio-embed .preview-panel{margin-bottom:0!important;}

@media(max-width:1024px){
  .nstudio-page.is-nstudio-embed .order-layout.nstudio-embed-mobile-workspace{min-height:0!important;border-radius:0!important;}
  .nstudio-page.is-nstudio-embed .order-layout.nstudio-embed-mobile-workspace>.preview-panel.nstudio-embed-mobile-workspace-host{padding:4px 4px 68px!important;}
  .nstudio-page.is-nstudio-embed #nstudioDesignSidebar{padding-top:0!important;}
}

/* ---- original style block boundary ---- */












@media(min-width:1025px){
  .nstudio-page .order-layout>.preview-panel{padding-top:14px!important}
  .nstudio-page .order-layout>#nstudioDesignSidebar{padding-top:14px!important}
  .nstudio-page .preview-head.nstudio-column-heading-editor,
.nstudio-page #nstudioDesignSidebar>.nstudio-design-sidebar-head{height:36px!important;min-height:36px!important;margin:0 0 14px!important;padding:0!important;align-items:flex-start!important}
  .nstudio-page .editor-mode-row,
.nstudio-page .nstudio-design-main-tabs{margin-top:0!important}
  .nstudio-page.is-nstudio-embed .order-layout{align-items:start!important;height:auto!important;min-height:0!important;overflow:visible!important}
  .nstudio-page.is-nstudio-embed .order-layout>#nstudioDesignSidebar{position:static!important;top:auto!important;height:auto!important;max-height:none!important;overflow:visible!important}
}

/* ---- original style block boundary ---- */

/* 埋め込み右端切れ:
   古い埋め込みCSSの固定360pxと実グリッド340pxの競合を無効化し、
   デザイン欄を必ず割り当て列の内側へ収める。 */
.nstudio-page.is-nstudio-embed .order-layout > #nstudioDesignSidebar,
.nstudio-page.is-nstudio-embed .order-layout > .nstudio-design-sidebar{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
}
.nstudio-page.is-nstudio-embed .order-layout,
.nstudio-page.is-nstudio-embed .preview-panel{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}








/* v20260830 UI polish: language menu / upload hint / selection / capture / steppers */
.nstudio-page .nstudio-language-control,
.nstudio-page .nstudio-ui-mode-control{
  display:inline-flex!important;align-items:center!important;gap:6px!important;min-height:38px!important;
  padding:7px 9px!important;border:1px solid rgba(49,93,83,.20)!important;border-radius:999px!important;background:#fff!important;
  color:#344c45!important;font-size:12px!important;font-weight:800!important;line-height:1!important;cursor:pointer!important;
  box-sizing:border-box!important;
  position:relative;
  overflow:hidden;
}
.nstudio-page .nstudio-top-utility-row>.nstudio-language-control,
.nstudio-page .nstudio-top-utility-row>.nstudio-ui-mode-control{align-self:center!important;margin-left:0!important;}
.nstudio-page .nstudio-language-control:hover,
.nstudio-page .nstudio-ui-mode-control:hover{background:#e3ece8!important;}
.nstudio-page .nstudio-language-control>.icon,
.nstudio-page .nstudio-ui-mode-control>.icon{margin:0!important;color:#526c64!important;}
.nstudio-page .nstudio-language-control .nstudio-language-label,
.nstudio-page .nstudio-ui-mode-control .nstudio-ui-mode-label{display:none!important;}
.nstudio-page .nstudio-language-value,
.nstudio-page .nstudio-ui-mode-value{
  display:inline-block;
  min-width:0;
  white-space:nowrap;
  pointer-events:none;
}
.nstudio-page .nstudio-language-control .nstudio-control-caret,
.nstudio-page .nstudio-ui-mode-control .nstudio-control-caret{
  margin:0;
  pointer-events:none;
}
.nstudio-page .nstudio-language-control select,
.nstudio-page .nstudio-ui-mode-control select{
  appearance:none!important;-webkit-appearance:none!important;min-width:100%!important;height:100%!important;margin:0!important;padding:0!important;
  border:0!important;outline:0!important;background:transparent!important;color:#344c45!important;font:inherit!important;font-weight:800!important;cursor:pointer!important;
  box-shadow:none!important;
  position:absolute;
  inset:0;
  width:100%;
  opacity:0;
  z-index:2;
}

/* 画像調整の旧疑似見出しを消し、実見出しだけ表示 */
.nstudio-page .image-size-panel::before{content:none!important;display:none!important;}

/* キャンバスD&D案内: 背景だけ透過して布色を見せる */
.nstudio-page .upload-placeholder{
  background:rgba(255,255,255,.72)!important;
}
.nstudio-page .upload-placeholder:hover{background:rgba(255,255,255,.82)!important;}

/* 背景画像/間口表示中でも、下部の完成プレビュー生成用DOMを裏で計測可能にする */
.nstudio-page #previewPlainShell.is-capture-visible{
  display:block!important;position:absolute!important;left:-10000px!important;top:0!important;width:640px!important;max-width:640px!important;
  visibility:hidden!important;pointer-events:none!important;
}

/* 2026-08-30: editor header alignment / lighter mode labels */
.nstudio-page .editor-mode-switch .mode-btn{
  font-weight:600!important;
}
.nstudio-page .nstudio-editor-context-row{
  
  width:100%!important;
}
.nstudio-page .nstudio-editor-product-name{
  
  min-width:0!important;
  
  
}
.nstudio-page .nstudio-editor-product-name .nstudio-product-name{
  display:block!important;
  
  
}
.nstudio-page .nstudio-editor-history-top{
  flex:0 0 auto!important;
  margin-left:auto!important;
  justify-content:flex-end!important;
}

/* Module visibility is UI-only. Hidden modules keep their state/runtime alive. */



/* Embed layout shell. Actual visibility is controlled by the UI visibility preset/API. */
.nstudio-page.is-nstudio-embed #nstudioFinalReview{
  display:block!important;
  width:100%!important;
  margin:14px 0 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nstudio-page.is-nstudio-embed #nstudioFinalReview>.nstudio-final-review-heading,
.nstudio-page.is-nstudio-embed #nstudioFinalReview>.nstudio-final-review-tabs,
.nstudio-page.is-nstudio-embed #nstudioFinalReview>.nstudio-editor-summary{display:none!important;}
.nstudio-page.is-nstudio-embed .nstudio-final-export-actions{
  justify-content:center!important;
  width:100%!important;
  margin:0!important;
  padding:8px 0 0!important;
}
.nstudio-page.is-nstudio-embed .nstudio-final-export-actions .nstudio-export-dropdown{width:auto!important;max-width:100%!important;}


html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed #nstudioMobileBottomNav{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  grid-auto-columns:auto!important;
  width:auto!important;
  max-width:calc(100% - 16px)!important;
}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed #nstudioMobileBottomNav>[data-nstudio-mobile-sheet="spec"]{display:none!important}

/* granular UI visibility */
.nstudio-page .nstudio-ui-part-hidden{display:none!important;}

/* Optional tutorial launcher. The tutorial engine itself is lazy-loaded and detachable. */
.nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher{
  align-self:center!important;
  position:static!important;
  z-index:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  margin-left:6px;
  padding:8px 12px;
  border:1px solid rgba(49,93,83,.28);
  border-radius:999px;
  background:#fff;
  color:#315d53;
  box-shadow:0 4px 12px rgba(35,61,54,.10);
  font:inherit;
  font-size:12px;
  font-weight:850;
  line-height:1.2;
  white-space:nowrap;
  cursor:pointer;
}
.nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher:hover{background:#f3f8f5;}
.nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher:disabled{opacity:.55;cursor:wait;}
.nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher.is-tutorial-active{display:none!important;}
.nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher>i.icon{
  width:1em!important;height:1em!important;margin:0!important;line-height:1!important;vertical-align:middle!important;
}
@media(max-width:1024px){
  .nstudio-page .nstudio-top-utility-row>.nstudio-tutorial-launcher{min-height:34px!important;margin:0!important;padding:6px 9px!important;font-size:12px!important;}
  .nstudio-page .nstudio-top-utility-row>.nstudio-language-menu>.nstudio-language-control,
  .nstudio-page .nstudio-top-utility-row>.nstudio-ui-mode-menu>.nstudio-ui-mode-control{min-height:34px!important;margin:0!important;padding:5px 7px!important;}
  .nstudio-page .nstudio-top-utility-row>.nstudio-compact-menu{margin:0!important;}
  .nstudio-page .nstudio-top-control-section .nstudio-project-toolbar{justify-content:center!important;flex-wrap:wrap!important;padding-top:10px!important;border-top:1px solid #e6ebe8!important;}
  .nstudio-page .nstudio-project-toolbar .nstudio-project-status{flex-basis:100%!important;text-align:center!important;}
}
@media(max-width:520px){
  .nstudio-page .nstudio-project-toolbar{gap:5px!important;}
  .nstudio-page .nstudio-project-menu-trigger,
.nstudio-page .nstudio-restore-quick{min-height:36px!important;padding:7px 9px!important;font-size:12px!important;}
}

/* ===== canonical UI readability / embed isolation =====
   Keep this as the single final readability layer. Do not add versioned
   typography patches below this block. */
.nstudio-page{
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",Arial,sans-serif!important;
  font-size:14px!important;
  line-height:1.55!important;
  color:#293530!important;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
.nstudio-page button,
.nstudio-page input,
.nstudio-page select,
.nstudio-page textarea{
  font-family:inherit!important;
  color:#293530;
}
.nstudio-page .nstudio-design-sidebar-head small,
.nstudio-page .nstudio-design-quick-heading small,
.nstudio-page .nstudio-background-feature-copy small,
.nstudio-page .nstudio-background-settings-heading small,
.nstudio-page .nstudio-side-drawer-head small,
.nstudio-page .nstudio-setting-note,
.nstudio-page .nstudio-data-check-summary,
.nstudio-page .nstudio-data-check-note,
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-copy,
.nstudio-page #nstudioQuickUploadMount .nstudio-asset-upload-note{
  font-size:12px!important;
  line-height:1.5!important;
  color:#596761!important;
}
.nstudio-page .nstudio-background-feature-head,
.nstudio-page .nstudio-background-settings-heading,
.nstudio-page .nstudio-export-item strong{
  font-size:13px!important;
  color:#2d3935!important;
}
.nstudio-page .nstudio-mode-tagline,
.nstudio-page .nstudio-editor-product-name,
.nstudio-page .nstudio-editor-product-name .nstudio-product-name{
  font-size:13px!important;
  color:#43514c!important;
}
.nstudio-page .nstudio-side-drawer-head strong{font-size:15px!important;color:#26332e!important;}
.nstudio-page .nstudio-drawer-close{font-size:12px!important;color:#3f4c47!important;}
.nstudio-page .nstudio-export-menu-title{font-size:12px!important;color:#55635e!important;}
.nstudio-page .nstudio-export-item small{font-size:12px!important;line-height:1.45!important;color:#65726d!important;}
.nstudio-page .nstudio-export-item.is-recommended:after{font-size:12px!important;}

.nstudio-page .nstudio-design-primary-tool,
.nstudio-page .editor-mode-switch .mode-btn,
.nstudio-page .nstudio-design-main-tabs button,
.nstudio-page .nstudio-editor-history-top .action-btn,
.nstudio-page .nstudio-final-export-actions .nstudio-export-dropdown>summary.action-btn{
  font-size:12px!important;
}

/* Export menu opens inward in an iframe instead of being clipped below it. */
.nstudio-page.is-nstudio-embed .nstudio-final-export-actions{position:relative!important;z-index:80!important;}
.nstudio-page.is-nstudio-embed .nstudio-final-export-actions .nstudio-export-dropdown{position:relative!important;z-index:81!important;}
.nstudio-page.is-nstudio-embed .nstudio-final-export-actions .nstudio-export-dropdown>.editor-file-menu{
  top:auto!important;
  bottom:calc(100% + 8px)!important;
  z-index:2147482500!important;
}


/* ===== Specification schema + mobile/embed correctness ===== */
.nstudio-page .is-nstudio-schema-hidden{display:none!important}
.nstudio-page .is-nstudio-spec-readonly{opacity:.88}
.nstudio-page .nstudio-schema-standard-select,
.nstudio-page .nstudio-custom-spec-control select,
.nstudio-page .nstudio-custom-spec-control input[type="text"]{
  width:100%;min-height:40px;padding:7px 10px;border:1px solid #cbd5d1;border-radius:8px;background:#fff;color:#293731;font:inherit;font-size:13px;box-sizing:border-box
}
.nstudio-page .nstudio-custom-spec-static{min-height:40px;padding:9px 10px;border:1px solid #dde4e1;border-radius:8px;background:#f8faf9;color:#35443f;font-size:13px;line-height:1.5}
.nstudio-page .nstudio-custom-spec-check{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 10px;border:1px solid #d8e0dd;border-radius:8px;background:#fff;color:#35443f;font-size:13px;cursor:pointer}
.nstudio-page .nstudio-custom-spec-check input{width:18px;height:18px;margin:0}
.nstudio-page .nstudio-custom-spec-options{display:grid;gap:7px}
.nstudio-page .nstudio-custom-spec-options.is-button-group{grid-template-columns:repeat(2,minmax(0,1fr))}
.nstudio-page .nstudio-custom-spec-option{position:relative;display:block;cursor:pointer}
.nstudio-page .nstudio-custom-spec-option input{position:absolute;opacity:0;pointer-events:none}
.nstudio-page .nstudio-custom-spec-option span{display:flex;align-items:center;justify-content:center;min-height:40px;padding:7px 9px;border:1px solid #d3dcd8;border-radius:8px;background:#fff;color:#3d4c47;font-size:12px;font-weight:750;text-align:center}
.nstudio-page .nstudio-custom-spec-option input:checked+span{border-color:#678f83;background:#e8f2ee;color:#244b42;box-shadow:0 0 0 1px rgba(77,126,112,.12)}
.nstudio-page .nstudio-custom-spec-options.is-radio-group .nstudio-custom-spec-option span{justify-content:flex-start}
.nstudio-page .nstudio-custom-spec-unit{flex:0 0 auto;color:#66736e;font-size:12px}
.nstudio-page .nstudio-custom-spec-control input[type="color"]{width:72px;height:40px;padding:2px;border:1px solid #cbd5d1;border-radius:8px;background:#fff}

/* 割れ数と自動設定は同じ行。 */
.nstudio-page .nstudio-split-field{display:grid!important;grid-template-columns:max-content minmax(0,1fr)!important;align-items:stretch!important;gap:8px!important;width:100%!important}
.nstudio-page .nstudio-split-field>.image-size-input-wrap{width:auto!important;min-width:0!important}
.nstudio-page .nstudio-split-field>.nstudio-auto-split-toggle{width:100%!important;min-width:0!important;margin:0!important;align-self:stretch!important;min-height:40px!important;justify-content:center!important}

.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-heading{grid-template-columns:64px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-mascot{grid-row:1/4!important}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-description{grid-column:2!important;grid-row:2!important;align-self:start!important;margin:3px 0 0!important;font-size:13px!important;line-height:1.45!important}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-tagline{grid-row:3!important}

/* Narrow embed sheet controls follow the resolved layout state, not a second breakpoint. */
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar>.nstudio-design-sidebar-head,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet>.nstudio-mobile-drawing-head,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet>.nstudio-mobile-adjust-head{display:flex!important;position:sticky!important;top:0!important;z-index:8!important;min-height:54px!important;margin:0 -10px 12px!important;padding:10px 52px 10px 14px!important;border-bottom:1px solid #e6e9e7!important;background:rgba(255,255,255,.97)!important;align-items:center!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-mobile-sheet-close{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:10!important}
html.nstudio-layout-narrow .nstudio-page #nstudioMobileAdjustMount #nstudioInlineToolPanel.is-mobile-adjust-mounted{display:block!important;width:100%!important;margin:0!important;padding:0!important;visibility:visible!important;opacity:1!important}
html.nstudio-layout-narrow .nstudio-page #nstudioMobileAdjustMount #nstudioInlineToolPanel.is-mobile-adjust-mounted .nstudio-design-inline-tool-section:not([hidden]){display:block!important;visibility:visible!important}
html.nstudio-layout-narrow .nstudio-page #nstudioMobileAdjustMount #nstudioInlineToolPanel.is-mobile-adjust-mounted .nstudio-design-inline-tool-section[hidden]{display:none!important;visibility:hidden!important}
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-insert-dialog{z-index:2147483000!important}


/* Canonical mobile bottom-sheet skin.
   Placement may differ between standalone(fixed) and embed(absolute), appearance must not. */
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) .order-layout>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-adjust-sheet,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet,
html.nstudio-layout-narrow .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{
  padding:0 10px 14px!important;
  box-sizing:border-box!important;
  border:1px solid rgba(57,79,72,.13)!important;
  border-radius:18px 18px 12px 12px!important;
  background:#fff!important;
  box-shadow:0 -10px 34px rgba(23,38,33,.20)!important;
}
html.nstudio-layout-narrow .nstudio-page .order-layout>#nstudioDesignSidebar>.nstudio-design-sidebar-head,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-drawing-sheet>.nstudio-mobile-drawing-head,
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-adjust-sheet>.nstudio-mobile-adjust-head{
  position:sticky!important;
  z-index:8!important;
  top:0!important;
  min-height:54px!important;
  margin:0 -10px 12px!important;
  padding:10px 52px 10px 14px!important;
  border-bottom:1px solid #e6e9e7!important;
  background:rgba(255,255,255,.97)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  box-sizing:border-box!important;
}


/* ===== vNext: compact layout / mobile embed fixes ===== */
.nstudio-page .nstudio-top-control-section .nstudio-top-utility-row{margin-bottom:2px!important}

/* Mobile bottom navigation fills the full bar with however many buttons are visible. */
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav{display:flex}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav>button{flex:1 1 0!important;min-width:0!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-mobile-bottom-nav>button[hidden]{display:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-top-utility-row::-webkit-scrollbar{display:none!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-top-utility-row>*{flex:0 0 auto!important}
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-top-utility-row:has(details[open]),
html.nstudio-layout-narrow .nstudio-page .nstudio-top-control-section .nstudio-save-hub:has(details[open]){overflow:visible!important}
html.nstudio-layout-narrow .nstudio-page .preview-panel>.nstudio-product-select-panel{margin:0 0 20px!important}
html.nstudio-layout-narrow .nstudio-page #nstudioObjectListSlot{display:none!important}











/* Hidden inline design tabs must stay hidden even after moving the editor into the mobile adjust sheet. */
.nstudio-page .nstudio-design-inline-tool-section[hidden]{display:none!important;visibility:hidden!important}














/* Mobile adjust sheet must expose the real image/SVG adjustment panel after it is moved from the sidebar. */
@media(max-width:1024px){
  .nstudio-page #nstudioMobileAdjustMount>.nstudio-context-adjust-panel.is-active{width:100%!important}
  .nstudio-page #nstudioMobileAdjustMount .nstudio-selected-adjust-wrap.is-active{width:100%!important}
  .nstudio-page #nstudioMobileAdjustMount #imageSizePanel:not(.is-hidden){display:block!important;width:100%!important;visibility:visible!important;opacity:1!important}
}

.nstudio-page .nstudio-schema-standard-proxy{margin-top:8px!important}
.nstudio-page .nstudio-schema-standard-proxy>.nstudio-custom-spec-control{width:100%!important}

/* ===== mobile gesture workspace / toolbar split ===== */
.nstudio-page .side-toolbar .icon-tool:disabled{
  opacity:.38!important;
  cursor:default!important;
  pointer-events:none!important;
}
.nstudio-page .nstudio-object-actions{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:7px!important;
  margin:12px 0 10px!important;
  padding-top:12px!important;
  border-top:1px solid #e5e9e7!important;
}
.nstudio-page .nstudio-object-actions .action-btn{
  min-width:0!important;
  min-height:38px!important;
  padding:7px 5px!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  font-size:12px!important;
}
.nstudio-page .nstudio-object-actions .action-btn.danger{
  
  border-color:#e1c1c1!important;
  
}

@media (max-width:1024px){
  /* Mobile exposes drawing through the bottom-sheet entry point; keep the desktop toolbar out of the canvas. */
  .nstudio-page #editModePanel .design-shell>.side-toolbar{display:none!important}
  .nstudio-page .nstudio-editor-context-row{display:none!important}

  /* Add / cloth / adjust sheets stay around 80% instead of covering the workspace. */
  .nstudio-page:not(.is-nstudio-embed) .order-layout>.nstudio-design-sidebar,
.nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-drawing-sheet,
.nstudio-page:not(.is-nstudio-embed) .nstudio-mobile-adjust-sheet{
    height:auto!important;
    max-height:min(68dvh,620px,calc(100dvh - 82px - env(safe-area-inset-bottom,0px)))!important;
  }
  .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
.nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet,
.nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{
    top:auto!important;
    bottom:68px!important;
    height:auto!important;
    min-height:0!important;
    max-height:min(68%,620px,calc(100% - 76px))!important;
  }

  .nstudio-page .nstudio-object-actions{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .nstudio-page .nstudio-object-actions .action-btn{
    min-height:42px!important;
    font-size:12px!important;
  }
}


/* ===== 2026-09-03 mobile standalone header / canvas upload polish ===== */
/* Product summary belongs to the canvas context,
so keep it centered. */
.nstudio-page .nstudio-editor-context-row{
  justify-content:center!important;
}
.nstudio-page .nstudio-editor-product-name{
  flex:1 1 auto!important;
  justify-content:center!important;
  text-align:center!important;
}
.nstudio-page .nstudio-editor-product-name .nstudio-product-name{
  width:100%!important;
  text-align:center!important;
}

@media (max-width:1024px){
  /* Standalone header actions stay on one compact row instead of wrapping. */
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-top-actions{
    width:100%!important;
    max-width:100%!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-save-hub{
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:stretch!important;
    justify-content:center!important;
    column-gap:5px!important;
    row-gap:7px!important;
    padding:8px 0 0!important;
    overflow:visible!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-toolbar>.nstudio-project-menu{
    flex:1 1 calc((100% - 10px) / 3)!important;
    min-width:0!important;
    max-width:none!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-toolbar>.nstudio-restore-quick:not([hidden]){
    order:-2!important;
    flex:0 0 100%!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-toolbar>.nstudio-project-status:not([hidden]){
    order:-1!important;
    flex:0 0 100%!important;
    width:100%!important;
    text-align:center!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-menu{
    position:static!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-menu-trigger,
.nstudio-page:not(.is-nstudio-embed) .nstudio-restore-quick{
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    padding:7px 6px!important;
    gap:4px!important;
    font-size:12px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-menu-trigger .icon,
.nstudio-page:not(.is-nstudio-embed) .nstudio-restore-quick .icon{
    flex:0 0 auto!important;
    margin:0!important;
  }
  /* Dropdown is anchored to the whole toolbar,
not the narrow trigger. */
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-menu-panel:not(.nstudio-compact-menu-panel){
    left:0!important;
    right:0!important;
    top:calc(100% + 7px)!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:min(68dvh,560px)!important;
    box-sizing:border-box!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-project-status{
    position:absolute!important;
    left:0!important;
    right:auto;
    top:calc(100% + 5px)!important;
    max-width:100%!important;
    z-index:1000!important;
  }

  /* Product switching is one horizontal strip; labels never break mid-name. */
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-type-grid{
    display:flex!important;
    grid-template-columns:none!important;
    width:100%!important;
    max-width:100%!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:1px 2px 5px!important;
    scroll-snap-type:x proximity!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-type-grid::-webkit-scrollbar{
    display:none!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-type-grid .option{
    flex:0 0 auto!important;
    min-width:104px!important;
    scroll-snap-align:start!important;
  }
  .nstudio-page:not(.is-nstudio-embed) .nstudio-top-control-section .nstudio-type-grid .option span{
    min-height:40px!important;
    padding:7px 10px!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    word-break:keep-all!important;
  }
}

/* ===== 2026-09-03 adjustment / SVG palette visibility fixes ===== */
/* Adjustment UI uses neutral gray instead of pink/purple,
including multi selection. */
.nstudio-page{
  --ns-adjust:#59615e!important;
  --ns-adjust-bg:#f4f4f5!important;
}
.nstudio-page #nstudioRightAdjustMount .image-size-panel,
.nstudio-page #nstudioMobileAdjustMount .image-size-panel{
  background:#f4f4f5!important;
}
.nstudio-page .nstudio-multi-align-panel{
  border-color:#d2d7d5!important;
  background:#f4f4f5!important;
  box-shadow:inset 0 0 0 1px rgba(70,80,76,.025)!important;
}
.nstudio-page .nstudio-multi-align-head,
.nstudio-page .nstudio-multi-align-head strong{color:#4d5753!important;}
.nstudio-page .nstudio-multi-align-head span,
.nstudio-page .nstudio-multi-align-group-label{color:#737c78!important;}
.nstudio-page .nstudio-multi-align-group{border-color:#dadddb!important;background:#f8f9f8!important;}
.nstudio-page .nstudio-multi-align-actions button{border-color:#d0d6d3!important;background:#fff!important;color:#4d5753!important;}
.nstudio-page .nstudio-multi-align-actions button:hover{border-color:#9da8a3!important;background:#e9ecea!important;color:#37413d!important;}

/* Center / forward / backward use the same solid button shape as delete,
with a neutral color. */
.nstudio-page .nstudio-object-actions .action-btn:not(.danger){
  border:1px solid #c7cfcb!important;
  border-radius:7px!important;
  background:#f3f5f4!important;
  color:#46514c!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-object-actions .action-btn:not(.danger):hover{
  border-color:#929f99!important;
  background:#e5e9e7!important;
  color:#303a36!important;
}
.nstudio-page .nstudio-object-actions .action-btn.danger{
  border:1px solid #e1c1c1!important;
  border-radius:7px!important;
  background:#fff4f4!important;
  color:#9a3737!important;
  box-shadow:none!important;
}
.nstudio-page .nstudio-object-actions .action-btn.danger:hover{
  border-color:#c88f8f!important;
  background:#fbe5e5!important;
  color:#842d2d!important;
}

/* Give specification blocks more breathing room. */
.nstudio-page .order-layout>aside.panel:first-of-type .form-block{
  margin-top:0!important;
  
}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block:last-of-type{margin-bottom:0!important;}

/* ============================================================
   Product selector: specification-first UI
   ============================================================ */
.nstudio-page .nstudio-product-select-block{
  margin-top:14px!important;
  margin-bottom:18px!important;
}
.nstudio-page #nstudioProductSelector{
  width:100%;
}
.nstudio-page .nstudio-product-type-select{
  display:block;
  width:100%;
  min-height:42px;
  margin:0;
  padding:9px 38px 9px 12px;
  border:1px solid #cfd7d4;
  border-radius:8px;
  background:#fff;
  color:#27312d;
  font:inherit;
  font-weight:600;
  line-height:1.3;
  cursor:pointer;
}
.nstudio-page .nstudio-product-type-select:focus{
  outline:none;
  border-color:#7f9a92;
  box-shadow:0 0 0 2px rgba(85,118,108,.12);
}
.nstudio-page .nstudio-product-type-radios{
  display:none!important;
}
@media (max-width:1024px){
  .nstudio-page .nstudio-product-select-block{
    margin-top:10px!important;
    margin-bottom:16px!important;
  }
  .nstudio-page .nstudio-product-type-select{
    min-height:44px;
    font-size:15px;
  }
}

/* ============================================================
   Product selector: outside specification sheet
   ============================================================ */
.nstudio-page .nstudio-product-select-panel{
  width:clamp(220px,17vw,280px);
  max-width:100%;
  margin:0 0 10px;
  padding:10px 12px;
  border:1px solid #d8dfdc;
  border-radius:10px;
  background:#f5f6f6;
  box-sizing:border-box;
}
.nstudio-page .nstudio-product-select-panel>label{
  display:block;
  margin:0 0 6px;
  color:#48534f;
  font-size:12px;
  font-weight:800;
  line-height:1.2;
}
.nstudio-page .nstudio-product-select-panel #nstudioProductSelector{width:100%;}
.nstudio-page .nstudio-product-select-panel .nstudio-product-type-select{
  min-height:40px;
  padding-top:8px;
  padding-bottom:8px;
}
/* Old in-spec wrapper no longer exists,
but keep it suppressed if stale markup is injected. */
.nstudio-page .nstudio-spec-sidebar>.nstudio-product-select-block{display:none!important;}

@media (max-width:1024px){
  .nstudio-page .nstudio-product-select-panel{
    width:100%;
    margin:0 0 8px;
    padding:8px 10px;
    border-radius:9px;
  }
  .nstudio-page .nstudio-product-select-panel>label{
    margin-bottom:5px;
    font-size:12px;
  }
  .nstudio-page .nstudio-product-select-panel .nstudio-product-type-select{
    min-height:42px;
    font-size:14px;
  }
}

/* ============================================================
   Product selector: first item in the left specification column
   ============================================================ */
.nstudio-page .order-layout>.nstudio-spec-sidebar>.nstudio-product-select-panel{
  width:100%!important;
  max-width:none!important;
  margin:0 0 18px!important;
  padding:10px 12px!important;
  box-sizing:border-box!important;
}
.nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title{
  margin-top:4px!important;
}

/* ============================================================
   2026-09-03 spec layout / no-design cleanup
   ============================================================ */
/* Slightly tighten the gap before the workspace and between spec sections. */
@media (min-width:1025px){
  .nstudio-page:not(.is-nstudio-embed) .nstudio-app-shell>.nstudio-top-control-section{padding-bottom:12px!important;}
}
.nstudio-page .order-layout>aside.panel:first-of-type .form-block{margin-bottom:22px!important;}

/* Make the item selector easy to notice without adding another UI layer. */
.nstudio-page .order-layout>.nstudio-spec-sidebar>.nstudio-product-select-panel{
  border-color:#b9cbc5!important;
  background:#eef4f2!important;
  box-shadow:inset 3px 0 0 #6f9589!important;
}
.nstudio-page .order-layout>.nstudio-spec-sidebar>.nstudio-product-select-panel>label{
  color:#36564d!important;
  font-size:12px!important;
  letter-spacing:.02em!important;
}
.nstudio-page .order-layout>.nstudio-spec-sidebar>.nstudio-product-select-panel .nstudio-product-type-select{
  border-color:#b8c9c3!important;
  font-weight:800!important;
}

/* No logo/text design: safe/bleed guides and their settings are unnecessary. */
.nstudio-page.is-logo-design-disabled:not(.is-nstudio-embed) .nstudio-canvas-status-row,
.nstudio-page.is-logo-design-disabled:not(.is-nstudio-embed) #nstudioSettingsPanel{display:none!important;}

/* v-next: embed project toolbar / compact base color label */

.nstudio-page.is-nstudio-embed .nstudio-top-control-section{display:block!important;min-height:0!important;margin:0!important;padding:2px 4px 6px!important;border:0!important;background:transparent!important;box-shadow:none!important;}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section::after{display:none!important;}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-top-actions{display:block!important;min-height:0!important;margin:0!important;padding:0!important;}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-save-hub{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-project-toolbar>.nstudio-project-menu{flex:0 0 auto!important;margin:0!important;}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-project-menu-trigger{min-height:36px!important;white-space:nowrap!important;}

@media(max-width:1024px){
  .nstudio-page.is-nstudio-embed .nstudio-top-control-section{display:block!important;padding:2px 4px 5px!important;}
  .nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-save-hub{justify-content:center!important;gap:4px!important;overflow:visible!important;}
  .nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-project-menu-trigger{padding-left:8px!important;padding-right:8px!important;font-size:12px!important;}
}

/* Embed responsive layout is defined once at the end of this file. */

/* ==========================================================================
   iframe host base
   --------------------------------------------------------------------------
   nstudioembed.php にはレイアウトCSSを持たせない。
   iframe固有の外枠・余白・スクロール制御だけをここで管理する。
   UIの表示/非表示と order-layout の列構成は通常の NUNO STUDIO CSS /
   setUiVisibility() に一本化する。
   ========================================================================== */
html.nstudio-embed-host,
body.nstudio-embed-host{
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.nstudio-embed-host,
html.nstudio-embed-host *,
html.nstudio-embed-host *::before,
html.nstudio-embed-host *::after{
  box-sizing: border-box;
}

body.nstudio-embed-host #nstudio-embed-root,
body.nstudio-embed-host #nstudio-embed-root > .nstudio-page{
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
}

body.nstudio-embed-host #nstudio-embed-root > .nstudio-page{
  position: relative !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.nstudio-embed-host #nstudio-embed-root,
body.nstudio-embed-host .nstudio-page .order-layout,
body.nstudio-embed-host .nstudio-page .order-layout > *{
  min-width: 0 !important;
  box-sizing: border-box !important;
}

html.nstudio-embed-host ::-webkit-scrollbar,
body.nstudio-embed-host ::-webkit-scrollbar{
  display: none;
}

/* 2026-09-04 item select + compact spec heading alignment */
@media (max-width:1024px){
  .nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title{
    justify-content:flex-start!important;
    text-align:left!important;
  }
  .nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title>.nstudio-column-heading-copy{
    width:auto!important;
    margin-left:0!important;
    margin-right:auto!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }
  .nstudio-page .order-layout>.nstudio-spec-sidebar>.sidebar-spec-title>.nstudio-column-heading-copy strong{
    justify-content:flex-start!important;
    text-align:left!important;
  }
}

/* ==========================================================================
   CANONICAL WORKSPACE RESPONSIVE LAYOUT — 2026.09.04.03
   --------------------------------------------------------------------------
   JS writes exactly one state to .nstudio-page:
     data-nstudio-layout="wide"   >= 1280
     data-nstudio-layout="medium" 1025 - 1279
     data-nstudio-layout="narrow" <= 1024

   order-layout column count is defined ONLY in this section. Component-level
   media queries elsewhere may still tighten spacing/typography,
but must not
   switch the workspace between 1 / 2 / 3 columns.
   ========================================================================== */
.nstudio-page[data-nstudio-layout] .order-layout,
.nstudio-page[data-nstudio-layout] .order-layout > *,
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields,
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > *{
  min-width:0!important;
  box-sizing:border-box!important;
}

/* Specification heading is structurally outside the reorderable field grid. */
.nstudio-page[data-nstudio-layout] .order-layout > .nstudio-spec-sidebar{
  display:block!important;
}
.nstudio-page[data-nstudio-layout] .order-layout > .nstudio-spec-sidebar > .sidebar-spec-title{
  display:flex!important;
  grid-column:1 / -1!important;
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  justify-content:flex-start!important;
  text-align:left!important;
}
.nstudio-page[data-nstudio-layout] .order-layout > .nstudio-spec-sidebar > .sidebar-spec-title > .nstudio-column-heading-copy{
  width:auto!important;
  margin-left:0!important;
  margin-right:auto!important;
  justify-content:flex-start!important;
  text-align:left!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > #nstudioProductSpecControls,
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > #nstudioCustomSpecControls{
  display:contents!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > #nstudioProductSizeControls{
  display:none!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > .nstudio-product-select-panel{
  width:100%!important;
  max-width:none!important;
  margin:0 0 18px!important;
  padding:10px 12px!important;
  border-color:#b9cbc5!important;
  background:#eef4f2!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > .nstudio-product-select-panel > label{
  color:#36564d!important;
  font-size:12px!important;
  letter-spacing:.02em!important;
}
.nstudio-page[data-nstudio-layout] .nstudio-spec-fields > .nstudio-product-select-panel .nstudio-product-type-select{
  width:100%!important;
  max-width:100%!important;
  border-color:#b8c9c3!important;
  font-weight:800!important;
}

/* --------------------------------------------------------------------------
   WIDE >= 1280: spec / editor / design
   -------------------------------------------------------------------------- */
.nstudio-page[data-nstudio-layout="wide"] .order-layout{
  display:grid!important;
  grid-template-columns:280px minmax(0,1fr) 340px!important;
  grid-template-areas:"spec preview design"!important;
  gap:14px!important;
  align-items:start!important;
}
.nstudio-page[data-nstudio-layout="wide"] .order-layout > .nstudio-spec-sidebar{
  grid-area:spec!important;
  width:280px!important;
  min-width:280px!important;
  max-width:280px!important;
  margin:0!important;
}
.nstudio-page[data-nstudio-layout="wide"] .order-layout > .preview-panel{
  grid-area:preview!important;
  width:100%!important;
  min-width:0!important;
}
/* Wide layout: keep the Grid cell stable; only the editor contents stick.
   Apply the same inner-sticky behavior in standalone and embedded views. */
.nstudio-page[data-nstudio-layout="wide"] .order-layout > .preview-panel{
  position:relative!important;
  top:auto!important;
  align-self:stretch!important;
}
.nstudio-page[data-nstudio-layout="wide"] .order-layout > .preview-panel > .nstudio-preview-sticky-inner{
  position:var(--nstudio-preview-sticky-position,sticky)!important;
  top:var(--nstudio-preview-sticky-top,12px)!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:0!important;
}
.nstudio-page[data-nstudio-layout="wide"]:not(.is-preview-mode) #editModePanel .design-shell{
  height:min(68vh,700px,calc(100vh - 270px))!important;
  min-height:min(480px,calc(100vh - 270px))!important;
}
.nstudio-page[data-nstudio-layout="wide"].is-preview-mode{
  --nstudio-preview-sticky-position:static;
  --nstudio-preview-sticky-top:auto;
}
.nstudio-page:not(.is-nstudio-embed)[data-nstudio-layout="wide"] .order-layout > #nstudioDesignSidebar,
.nstudio-page:not(.is-nstudio-embed)[data-nstudio-layout="wide"] .order-layout > .nstudio-design-sidebar{
  overflow-anchor:none!important;
}
.nstudio-page[data-nstudio-layout="wide"] .order-layout > #nstudioDesignSidebar,
.nstudio-page[data-nstudio-layout="wide"] .order-layout > .nstudio-design-sidebar{
  grid-area:design!important;
  width:340px!important;
  min-width:340px!important;
  max-width:340px!important;
}
.nstudio-page[data-nstudio-layout="wide"] .nstudio-spec-fields{
  display:flex!important;
  flex-direction:column!important;
}


/* --------------------------------------------------------------------------
   MEDIUM 1025-1279: specification full row,
editor + design below
   -------------------------------------------------------------------------- */
.nstudio-page[data-nstudio-layout="medium"] #nstudio-editor > .wrap{
  padding-left:10px!important;
  padding-right:10px!important;
}
.nstudio-page[data-nstudio-layout="medium"] .order-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 340px!important;
  grid-template-areas:"spec spec" "preview design"!important;
  gap:12px 14px!important;
  align-items:start!important;
}
.nstudio-page[data-nstudio-layout="medium"] .order-layout > .nstudio-spec-sidebar{
  grid-area:spec!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:12px!important;
}
.nstudio-page[data-nstudio-layout="medium"] .order-layout > .preview-panel{
  grid-area:preview!important;
  width:100%!important;
  min-width:0!important;
}
.nstudio-page[data-nstudio-layout="medium"] .order-layout > #nstudioDesignSidebar,
.nstudio-page[data-nstudio-layout="medium"] .order-layout > .nstudio-design-sidebar{
  grid-area:design!important;
  width:340px!important;
  min-width:340px!important;
  max-width:340px!important;
}
.nstudio-page[data-nstudio-layout="medium"] .order-layout > .nstudio-spec-sidebar > .sidebar-spec-title{
  margin:0 0 10px!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-fields{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))!important;
  gap:10px 12px!important;
  align-items:start!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-fields > .nstudio-product-select-panel,
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-fields > .form-block,
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-fields > #nstudioProductSpecControls > .form-block,
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-fields > #nstudioCustomSpecControls > .form-block{
  grid-column:auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
}

/* Controls adapt inside a medium specification cell instead of changing the
   whole workspace at another breakpoint. */
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-sidebar .spec-block-title,
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-sidebar .nstudio-spec-title-with-toggle,
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-sidebar .nstudio-size-title{
  min-width:0!important;
  max-width:100%!important;
  flex-wrap:wrap!important;
  row-gap:6px!important;
}

.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-sidebar .option-grid{
  width:100%!important;
  min-width:0!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-spec-sidebar .option span{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}


/* --------------------------------------------------------------------------
   NARROW <= 1024: one-column editor workspace + existing mobile sheets
   -------------------------------------------------------------------------- */
.nstudio-page[data-nstudio-layout="narrow"] .order-layout{
  display:block!important;
  grid-template-columns:none!important;
  grid-template-areas:none!important;
  width:100%!important;
  min-width:0!important;
}
.nstudio-page[data-nstudio-layout="narrow"] .order-layout > .preview-panel{
  display:block!important;
  position:relative!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
}
.nstudio-page[data-nstudio-layout="narrow"] .nstudio-spec-fields{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  gap:0!important;
}
.nstudio-page[data-nstudio-layout="narrow"] .preview-panel > .nstudio-product-select-panel{
  width:100%!important;
  max-width:none!important;
  margin:0 0 8px!important;
}

/* iframe-specific behavior changes mounting/height flow,
never breakpoints. */
.nstudio-page.is-nstudio-embed[data-nstudio-layout="wide"] .order-layout > #nstudioDesignSidebar,
.nstudio-page.is-nstudio-embed[data-nstudio-layout="wide"] .order-layout > .nstudio-design-sidebar,
.nstudio-page.is-nstudio-embed[data-nstudio-layout="medium"] .order-layout > #nstudioDesignSidebar,
.nstudio-page.is-nstudio-embed[data-nstudio-layout="medium"] .order-layout > .nstudio-design-sidebar{
  position:static!important;
  top:auto!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}


/* 2026-09-05: clearer primary labels and readable NUNO STUDIO lead copy. */
.nstudio-page .editor-mode-switch .mode-btn{
  font-size:16px!important;
  line-height:1.3!important;
  font-weight:650!important;
}
.nstudio-page .nstudio-top-control-section .nstudio-mode-description{
  max-width:480px!important;
  font-size:15px!important;
  line-height:1.55!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
}
@media (max-width:1024px){
  .nstudio-page .editor-mode-switch .mode-btn{
    font-size:15px!important;
  }
}


/* Adjustment actions: layer/center on row one,
duplicate/delete on row two. */
.nstudio-page .nstudio-object-actions{display:block!important;}
.nstudio-page .nstudio-object-actions-primary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
.nstudio-page .nstudio-object-actions-layer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:7px;}
.nstudio-page .nstudio-object-actions-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:7px;}
.nstudio-page .image-size-lock{display:flex;align-items:center;gap:6px;}

/* ===== 2026-09-06 embed/mobile consistency ===== */


/* Embedded project/file controls stay inside the iframe width. */
.nstudio-page.is-nstudio-embed .nstudio-top-control-section,
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-top-actions,
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-save-hub{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:visible;
}
.nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-save-hub{
  flex-wrap:wrap;
  row-gap:5px;
}
.nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-project-menu,
.nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-restore-quick{
  min-width:0;
  max-width:100%;
}

/* When the heading gets tight,
the description follows the tagline. */
@media (max-width:1180px){
  .nstudio-page .nstudio-top-control-section .nstudio-mode-heading{
    grid-template-columns:78px minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    column-gap:12px;
    row-gap:2px;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-mascot{
    grid-row:1/4!important;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-description{
    grid-column:2!important;
    grid-row:3!important;
    align-self:start;
    max-width:none;
    margin:7px 0 0!important;
  }
}

@media (max-width:1024px){
  .nstudio-page .nstudio-top-control-section .nstudio-mode-heading{
    grid-template-columns:64px minmax(0,1fr)!important;
  }

  /* Embedded mobile sheets share the standalone shell. Internal cards/forms
     intentionally use the same global rules,
with no embed-only recoloring. */
  .nstudio-page.is-nstudio-embed[data-nstudio-layout="narrow"] .nstudio-embed-mobile-workspace-host>#nstudioDesignSidebar,
.nstudio-page.is-nstudio-embed[data-nstudio-layout="narrow"] .nstudio-embed-mobile-workspace-host>.nstudio-mobile-drawing-sheet,
.nstudio-page.is-nstudio-embed[data-nstudio-layout="narrow"] .nstudio-embed-mobile-workspace-host>.nstudio-mobile-adjust-sheet{
    border:1px solid rgba(57,79,72,.13)!important;
    border-radius:18px 18px 12px 12px!important;
    box-shadow:0 -10px 34px rgba(23,38,33,.20)!important;
  }

  /* File buttons shrink as one row instead of escaping the iframe. */
  .nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-project-menu,
.nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-restore-quick{
    flex:1 1 0!important;
    min-width:0;
    max-width:150px;
  }
  .nstudio-page.is-nstudio-embed .nstudio-project-menu-trigger,
.nstudio-page.is-nstudio-embed .nstudio-restore-quick{
    width:100%;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* ===== 2026-09-06 mobile floating live preview ===== */
.nstudio-page .nstudio-mobile-live-preview{
  display:none;
}
@media (max-width:1024px){
  .nstudio-page .nstudio-mobile-live-preview{
    position:fixed;
    z-index:99760;
    width:clamp(140px,34vw,200px);
    max-width:calc(100vw - 16px);
    margin:0;
    padding:0;
    border:1px solid rgba(44,67,60,.24);
    border-radius:10px;
    background:rgba(255,255,255,.97);
    box-shadow:0 6px 20px rgba(18,31,27,.22);
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    user-select:none;
    -webkit-user-select:none;
    touch-action:none;
    transition:opacity .24s ease,box-shadow .14s ease;
  }
  .nstudio-page .nstudio-mobile-live-preview.is-visible{
    display:block;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  .nstudio-page .nstudio-mobile-live-preview.is-fading{
    display:block;
    opacity:0;
    visibility:visible;
    pointer-events:none;
  }
  .nstudio-page .nstudio-mobile-live-preview.is-dragging{
    opacity:.82;
    box-shadow:0 12px 32px rgba(18,31,27,.30);
    cursor:grabbing;
  }
  .nstudio-page .nstudio-mobile-live-preview-bar{
    min-height:28px;
    padding:3px 5px 3px 7px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:5px;
    border-bottom:1px solid #d7e5df;
    background:#e8f2ed;
    color:#365149;
    cursor:grab;
    touch-action:none;
  }
  .nstudio-page .nstudio-mobile-live-preview-bar strong{
    min-width:0;
    display:flex;
    align-items:center;
    gap:5px;
    font-size:10px;
    line-height:1.2;
    font-weight:800;
    white-space:nowrap;
  }
  .nstudio-page .nstudio-mobile-live-preview-bar strong .icon{
    margin:0;
    font-size:12px;
  }
  .nstudio-page .nstudio-mobile-live-preview-bar small{
    display:none;
  }
  .nstudio-page .nstudio-mobile-live-preview-bar-actions{
    min-width:0;
    display:flex;
    align-items:center;
    gap:5px;
  }
  .nstudio-page .nstudio-mobile-live-preview-close{
    width:22px;
    height:22px;
    flex:0 0 22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:0;
    padding:0;
    border:0;
    border-radius:6px;
    background:rgba(255,255,255,.72);
    color:#506a62;
    cursor:pointer;
    touch-action:manipulation;
  }
  .nstudio-page .nstudio-mobile-live-preview-close:hover,
.nstudio-page .nstudio-mobile-live-preview-close:focus-visible{
    background:#fff;
    color:#29473f;
    outline:none;
  }
  .nstudio-page .nstudio-mobile-live-preview-close .icon{
    margin:0;
    font-size:11px;
  }
  .nstudio-page .nstudio-mobile-live-preview-stage{
    position:relative;
    width:100%;
    height:auto;
    min-height:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2px;
    background:#f5f7f6;
    overflow:hidden;
    box-sizing:border-box;
  }
  .nstudio-page .nstudio-mobile-live-preview-stage img{
    display:none;
    width:100%;
    height:auto;
    object-fit:contain;
    object-position:center;
    pointer-events:none;
    -webkit-user-drag:none;
  }
  .nstudio-page .nstudio-mobile-live-preview-empty{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:72px;
    padding:8px;
    color:#71807b;
    font-size:10px;
    line-height:1.45;
    text-align:center;
    box-sizing:border-box;
  }
  .nstudio-page .nstudio-mobile-live-preview.is-loading .nstudio-mobile-live-preview-bar::after{
    content:"";
    width:6px;
    height:6px;
    flex:0 0 6px;
    border-radius:999px;
    background:rgba(255,255,255,.72);
    animation:nstudio-mobile-live-preview-pulse .8s ease-in-out infinite alternate;
  }
  .nstudio-page.is-nstudio-embed .nstudio-embed-mobile-workspace-host>.nstudio-mobile-live-preview{
    position:absolute;
    z-index:80;
    max-width:calc(100% - 16px);
  }
}
@media (max-width:420px){
  .nstudio-page .nstudio-mobile-live-preview{
    width:clamp(136px,40vw,176px);
  }
  .nstudio-page .nstudio-mobile-live-preview-bar small{
    display:none;
  }
}
@keyframes nstudio-mobile-live-preview-pulse{
  from{opacity:.35;transform:scale(.85)}
  to{opacity:1;transform:scale(1)}
}


/* 2026-09-07: medium layout uses the same title hierarchy as mobile.
   Keep NUNO STUDIO + product tagline together; description starts below with space. */
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-heading{
  grid-template-columns:78px minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  row-gap:0!important;
  align-items:start!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-mascot{
  grid-column:1!important;
  grid-row:1/4!important;
  align-self:start!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-title{
  grid-column:2!important;
  grid-row:1!important;
  align-self:end!important;
  margin:0!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-tagline{
  grid-column:2!important;
  grid-row:2!important;
  align-self:start!important;
  margin:3px 0 0!important;
}
.nstudio-page[data-nstudio-layout="medium"] .nstudio-top-control-section .nstudio-mode-description{
  grid-column:2!important;
  grid-row:3!important;
  align-self:start!important;
  margin:12px 0 0!important;
}

/* 2026-09-07: keep the NUNO STUDIO title + tagline together on narrow widths.
   Description always follows them with a deliberate gap. */
@media (max-width:1024px){
  .nstudio-page .nstudio-top-control-section .nstudio-mode-heading{
    grid-template-columns:64px minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    row-gap:0!important;
    align-items:start!important;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-mascot{
    grid-column:1!important;
    grid-row:1/4!important;
    align-self:start!important;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-title{
    grid-column:2!important;
    grid-row:1!important;
    align-self:end!important;
    margin:0!important;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-tagline{
    grid-column:2!important;
    grid-row:2!important;
    align-self:start!important;
    margin:3px 0 0!important;
  }
  .nstudio-page .nstudio-top-control-section .nstudio-mode-description{
    grid-column:2!important;
    grid-row:3!important;
    align-self:start!important;
    margin:11px 0 0!important;
  }
}


/* English editor toolbar: keep Select / Move / Zoom labels in DOM,
show icons only. */
html[lang^="en"] .nstudio-page #toolSelect > span,
html[lang^="en"] .nstudio-page #toolHand > span,
html[lang^="en"] .nstudio-page #toolZoomIn > span,
html[lang^="en"] .nstudio-page #toolZoomOut > span,
html[lang^="en"] .nstudio-page #previewViewZoomIn > span,
html[lang^="en"] .nstudio-page #previewViewZoomOut > span,
html[lang^="en"] .nstudio-page #previewViewFit > span{
  display:none!important;
}


/* Preview export menu: keep finished-image exports beside preview background modes. */
.nstudio-page .nstudio-preview-save-menu{
  position:relative;
  margin-left:auto;
  flex:0 0 auto;
}
.nstudio-page .nstudio-preview-save-menu-panel{
  left:auto;
  right:0;
}
.nstudio-page .preview-submode-bar .nstudio-preview-save-menu > summary.action-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:38px;
  padding:8px 11px;
  border:1px solid #9ebfd2;
  border-radius:8px;
  background:#fff;
  color:#315f7a;
  box-shadow:none;
  font-size:13px;
  font-weight:700;
  line-height:1.2;
  list-style:none;
  cursor:pointer;
}
.nstudio-page .preview-submode-bar .nstudio-preview-save-menu > summary.action-btn::-webkit-details-marker{display:none}
.nstudio-page .preview-submode-bar .nstudio-preview-save-menu > summary.action-btn::after{
  content:"▼";
  margin-left:2px;
  font-size:11px;
  opacity:.65;
}
.nstudio-page .preview-submode-bar .nstudio-preview-save-menu > summary.action-btn:hover{
  border-color:#9ebfd2;
  background:#e2f0f8;
  color:#315f7a;
}
.nstudio-page .preview-submode-bar .nstudio-preview-save-menu[open] > summary.action-btn{
  border-color:#3f7898;
  background:#4d87a8;
  color:#fff;
}

/* ===== Background image picker modal =====
 * This modal is created by NUNO STUDIO (not by noren3d.js). It must sit above
 * every in-frame drawer/popover so transparent UI layers cannot steal clicks.
 */
#bgmodal-backdrop{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2147483500;
  padding:16px;
  background:rgba(0,0,0,.55);
  pointer-events:auto;
  isolation:isolate;
  box-sizing:border-box;
}
#bgmodal-backdrop[hidden]{display:none;}
#bgmodal{
  position:relative;
  z-index:1;
  width:min(980px,calc(100vw - 32px));
  max-height:calc(100dvh - 32px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:12px;
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  pointer-events:auto;
}
#bgmodal .bgm-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-bottom:1px solid #eee;
  background:#fff;
  flex:0 0 auto;
}
#bgmodal .bgm-title{font-weight:700;font-size:15px;}
#bgmodal .bgm-close{
  position:relative;
  z-index:2;
  min-width:40px;
  min-height:40px;
  border:0;
  border-radius:10px;
  background:#f3f3f3;
  cursor:pointer;
  pointer-events:auto;
}
#bgmodal .bgm-body{min-height:0;padding:14px;overflow:auto;pointer-events:auto;}
#bgmodal .bgm-note{font-size:12px;color:#666;margin:0 0 10px;}
#bgmodal .bgm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;}
#bgmodal .bgm-card{border:1px solid #eee;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;background:#fff;}
#bgmodal .bgm-thumb{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#fafafa;}
#bgmodal .bgm-meta{padding:10px;display:flex;flex-direction:column;gap:8px;}
#bgmodal .bgm-name{font-size:12px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#bgmodal .bgsetbtn{width:100%;border:0;border-radius:10px;padding:10px;cursor:pointer;background:#666;color:#fff;font-weight:700;pointer-events:auto;}
#bgmodal .bgm-loading,#bgmodal .bgm-error{padding:12px;border-radius:10px;background:#f6f6f6;color:#333;}
#bgmodal .bgm-error{background:#fff3f3;color:#a40000;border:1px solid #ffd0d0;}

/* Finished-preview escape hatch: visible inside the preview itself without covering the artwork. */
.nstudio-page #previewModePanel{position:relative}
.nstudio-page .nstudio-preview-return-edit{position:absolute;left:10px;top:10px;z-index:18;display:inline-flex;align-items:center;gap:5px;min-height:34px;padding:7px 10px;border:1px solid rgba(70,89,82,.20);border-radius:8px;background:rgba(255,255,255,.94);color:#30443d;font-size:12px;font-weight:800;box-shadow:0 3px 12px rgba(30,45,40,.08);cursor:pointer;backdrop-filter:blur(3px)}
.nstudio-page .nstudio-preview-return-edit:hover{background:#fff;border-color:#aebfb8}
.nstudio-page .nstudio-preview-return-edit .icon{margin:0}


/* Compact header menus: closed state stays pill-shaped; open state reuses the project/save menu language. */
.nstudio-page .nstudio-compact-menu{position:relative;overflow:visible;margin:0;padding:0;border:0;background:transparent;}
.nstudio-page .nstudio-compact-menu>summary{list-style:none;}
.nstudio-page .nstudio-compact-menu>summary::-webkit-details-marker{display:none;}
.nstudio-page .nstudio-compact-menu-panel{width:176px;min-width:156px;max-width:calc(100vw - 24px);}
.nstudio-page .nstudio-compact-menu-panel .nstudio-compact-menu-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;}
.nstudio-page .nstudio-compact-menu-panel .nstudio-compact-menu-item>span{display:block;min-width:0;font-weight:800;}
.nstudio-page .nstudio-compact-menu-panel .nstudio-compact-menu-check{margin:0;opacity:0;color:#5f8176;}
.nstudio-page .nstudio-compact-menu-panel .nstudio-compact-menu-item.is-active{background:#edf3f0;color:#2f4d43;}
.nstudio-page .nstudio-compact-menu-panel .nstudio-compact-menu-item.is-active .nstudio-compact-menu-check{opacity:1;}
.nstudio-page .nstudio-compact-menu[open]>.nstudio-language-control,
.nstudio-page .nstudio-compact-menu[open]>.nstudio-ui-mode-control{background:#e3ece8;}

/* Noren tie spacing: minimum is a fixed manufacturing rule, maximum is editable. */


/* Completed preview viewport controls reuse the editor's bottom zoom commandbar. */
.nstudio-page .nstudio-preview-design-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr) auto;
  gap:10px;
  height:100%;
  min-height:0;
  padding:12px;
  box-sizing:border-box;
}
.nstudio-page .nstudio-preview-design-shell .preview-display-stage{
  grid-column:1;
  grid-row:1;
  min-width:0;
  min-height:0;
  border:none;
  border-radius:0;
  padding:0;
  touch-action:none;
}
.nstudio-page .nstudio-preview-view-controls{
  grid-column:1;
  grid-row:2;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
.nstudio-page .nstudio-preview-view-toolbar{width:auto;max-width:100%;box-sizing:border-box;}
.nstudio-page .nstudio-preview-zoom-indicator{cursor:default;pointer-events:none;}
.nstudio-page .preview-display-stage.is-preview-zoomed{cursor:grab;}
.nstudio-page .preview-display-stage.is-preview-zoomed:active{cursor:grabbing;}
@media(max-width:1024px){
  .nstudio-page .nstudio-preview-design-shell{gap:0;padding:8px;}
  .nstudio-page .nstudio-preview-return-edit{left:10px;}
}

/* Narrow completed preview keeps the same bottom zoom toolbar as desktop. */
html.nstudio-layout-narrow .nstudio-page #previewModePanel .nstudio-preview-design-shell{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:6px;height:100%;min-height:0;padding:6px;}
html.nstudio-layout-narrow .nstudio-page #previewModePanel .nstudio-preview-view-controls{display:flex;}
html.nstudio-layout-narrow .nstudio-page #previewModePanel .preview-display-stage{width:100%;height:auto;min-height:0;padding:0;}
html.nstudio-layout-narrow .nstudio-page #previewModePanel .preview-rig{width:100%;height:100%;min-height:0;margin:0;}


/* Build .43: split totals / guide-note colors / grommet sewing settings */
.nstudio-page .nstudio-piece-split-meta{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;min-width:0;}
.nstudio-page .nstudio-piece-split-meta .nstudio-piece-split-toggle{margin-left:0;}
.nstudio-page .nstudio-piece-split-total{font-size:12px;font-weight:700;color:#45534f;white-space:nowrap;}
/* Build .46: when piece-size editing is active the aggregate number field is hidden,
 * so let the label/split/total row use the vacated full width instead of squeezing
 * all three controls into the normal 88px label column. */
.nstudio-page .spec-field-size .image-size-field.is-piece-split>.image-size-label-row{
  grid-column:1 / -1!important;
  width:100%;
  min-width:0!important;
  justify-content:flex-start!important;
}
.nstudio-page .spec-field-size .image-size-field.is-piece-split>.image-size-label-row>label:first-child{flex:0 0 auto;}
.nstudio-page .spec-field-size .image-size-field.is-piece-split .nstudio-piece-split-meta{
  flex:0 0 auto;
  margin-left:auto;
}
.nstudio-page .spec-field-size .image-size-field.is-piece-split .nstudio-piece-split-toggle,
.nstudio-page .spec-field-size .image-size-field.is-piece-split .nstudio-piece-split-total{flex:0 0 auto;}
.nstudio-page .canvas-bleed-note .nstudio-guide-note-bleed{color:#e19755;font-weight:400;}
.nstudio-page .canvas-bleed-note .nstudio-guide-note-safe{color:#3d91c8;font-weight:400;}
.nstudio-page .canvas-bleed-note .nstudio-guide-note-separator{color:#7b8581;font-weight:400;}
.nstudio-page .nstudio-setting-field-bleed .nstudio-setting-title{color:#e19755;}
.nstudio-page .nstudio-setting-field-safe .nstudio-setting-title{color:#3d91c8;}
.nstudio-page .nstudio-grommet-spec{margin-top:-2px;padding-top:2px;}
.nstudio-page .nstudio-grommet-spec-grid{display:flex;flex-direction:column;gap:8px;}
.nstudio-page .nstudio-grommet-spacing-row{margin-left:24px;padding:10px 11px;border:1px solid #e0e5e3;border-radius:8px;background:#fafbfa;}
.nstudio-page .nstudio-grommet-spacing-row>label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:#59645f;}
.nstudio-page .nstudio-grommet-number{display:flex;align-items:center;gap:5px;}
.nstudio-page .nstudio-grommet-number em{font-size:12px;font-style:normal;color:#7b8581;}
.nstudio-page .spec-field-sewing>.nstudio-grommet-spec{margin:0!important;padding:0!important;border:0!important;background:transparent!important;}
.nstudio-page .order-layout>aside.panel:first-of-type .nstudio-grommet-spec{background:transparent!important;}


/* Interactive controls should not select their labels during mouse/touch use. */
.nstudio-page button,
.nstudio-page [role="button"],
.nstudio-page .action-btn,
.nstudio-page summary{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}

/* Build .74: mobile specification guide is a stable bottom sheet.
 * Its header position must not move with the amount of guide content. */
html.nstudio-layout-narrow .nstudio-page .spec-guide-popup{
  align-items:flex-end;
  justify-content:center;
  padding:0 8px calc(8px + env(safe-area-inset-bottom, 0px));
}
html.nstudio-layout-narrow .nstudio-page .spec-guide-box{
  display:flex;
  flex-direction:column;
  width:100%;
  height:80vh;
  height:80dvh;
  max-height:80vh;
  max-height:80dvh;
  overflow:hidden;
  box-sizing:border-box;
  border-radius:18px 18px 10px 10px;
}
html.nstudio-layout-narrow .nstudio-page .spec-guide-head{
  flex:0 0 auto;
}
html.nstudio-layout-narrow .nstudio-page .spec-guide-list{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}


/* 2026.09.25.110 - height interpretation is shown below the height input */
.nstudio-page .nstudio-height-input-line{display:flex;align-items:center;min-width:0}
.nstudio-page .nstudio-height-input-line>.image-size-input-wrap{flex:1 1 auto;min-width:0}
.nstudio-page .nstudio-height-includes-tie{display:inline-flex;align-items:center;gap:6px;margin:7px 0 0;font-size:14px;font-weight:400;color:#46534f;white-space:nowrap;cursor:pointer}
.nstudio-page .nstudio-height-includes-tie input{margin:0}
@media(max-width:560px){.nstudio-page .nstudio-height-includes-tie{font-size:14px}}
/* Semantic hidden state is authoritative for Product/Schema option visibility. */
.nstudio-page [hidden]{display:none!important;}

/* Embed mobile project menus are anchored to the whole project toolbar.
   The trigger itself can be narrower than the menu; anchoring to each trigger
   made Open / Save / Export panels escape past the left edge of the iframe. */
@media (max-width:1024px){
  .nstudio-page.is-nstudio-embed .nstudio-top-control-section .nstudio-save-hub.nstudio-project-toolbar{
    position:relative!important;
    overflow:visible!important;
  }
  .nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-project-menu{
    position:static!important;
  }
  .nstudio-page.is-nstudio-embed .nstudio-project-toolbar>.nstudio-project-menu>.nstudio-project-menu-panel:not(.nstudio-compact-menu-panel){
    left:0!important;
    right:0!important;
    top:calc(100% + 7px)!important;
    bottom:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
}


/* Nobori fixture stacking: horizontal rod must always stay behind vertical pole. */
.nstudio-page.is-type-nobori .preview-pole-horizontal{
  z-index: 1 !important;
}
.nstudio-page.is-type-nobori .preview-pole-vertical{
  z-index: 2 !important;
}