.history-actions{grid-template-columns:1fr}
.summary-list [hidden],#edit-design[hidden],#design-detail-edit[hidden]{display:none!important}
.admin-help-bottom{margin:22px 0 0}

.corner-control{margin-top:13px;padding:12px 13px 8px;border:1px solid #dce3ef;border-radius:12px;background:#f8faff}
.corner-control[hidden]{display:none}
.corner-control .range-row{margin-bottom:0}
.shape-icon.square{border-radius:var(--corner-radius,0%)}
.shape-icon.half{border-radius:50% 50% var(--corner-radius,0%) var(--corner-radius,0%)/100% 100% var(--corner-radius,0%) var(--corner-radius,0%)}
.shape-icon.droplet{border-radius:var(--corner-radius,0%) var(--corner-radius,0%) 50% 50%/var(--corner-radius,0%) var(--corner-radius,0%) 100% 100%}

.sticker-shell.shape-square,.proof-sticker.shape-square,
.shape-square .image-viewport,.shape-square .proof-viewport,
.sticker-shell.shape-square:after,.proof-sticker.shape-square:after{border-radius:var(--corner-radius,0%)}
.sticker-shell.shape-half,.proof-sticker.shape-half,
.shape-half .image-viewport,.shape-half .proof-viewport,
.sticker-shell.shape-half:after,.proof-sticker.shape-half:after{border-radius:50% 50% var(--corner-radius,0%) var(--corner-radius,0%)/100% 100% var(--corner-radius,0%) var(--corner-radius,0%)}
.sticker-shell.shape-droplet,.proof-sticker.shape-droplet,
.shape-droplet .image-viewport,.shape-droplet .proof-viewport,
.sticker-shell.shape-droplet:after,.proof-sticker.shape-droplet:after{border-radius:var(--corner-radius,0%) var(--corner-radius,0%) 50% 50%/var(--corner-radius,0%) var(--corner-radius,0%) 100% 100%}

.size-presets{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:11px}
.size-presets>span{width:100%;font-size:.7rem;color:var(--muted)}
.size-presets button{min-height:32px;padding:5px 10px;border:1px solid #ccd5e5;border-radius:999px;background:#fff;color:var(--brand);font-size:.72rem;font-weight:800;cursor:pointer}
.size-presets button.is-active{border-color:var(--brand);background:var(--brand);color:#fff}

.saved-piece-preview,.dialog-design-preview,.design-detail-preview{border-radius:var(--corner-radius,0%)}
.saved-piece-preview.circle,.dialog-design-preview.circle,.design-detail-preview.circle{border-radius:50%}
.saved-piece-preview.square,.dialog-design-preview.square,.design-detail-preview.square{border-radius:var(--corner-radius,0%)}
.saved-piece-preview.half,.dialog-design-preview.half,.design-detail-preview.half{border-radius:50% 50% var(--corner-radius,0%) var(--corner-radius,0%)/100% 100% var(--corner-radius,0%) var(--corner-radius,0%)}
.saved-piece-preview.droplet,.dialog-design-preview.droplet,.design-detail-preview.droplet{border-radius:var(--corner-radius,0%) var(--corner-radius,0%) 50% 50%/var(--corner-radius,0%) var(--corner-radius,0%) 100% 100%}
.saved-piece-preview.contour,.dialog-design-preview.contour,.design-detail-preview.contour{border-radius:12%;background:transparent}

.dialog-design{width:100%;font:inherit;color:inherit;text-align:left;appearance:none;cursor:pointer;position:relative}
.dialog-design:hover,.dialog-design:focus-visible{border-color:#9eb2df;background:#f9fbff;outline:0;box-shadow:0 0 0 3px rgba(56,96,190,.11)}
.dialog-design:after{content:"แตะดูแบบ";position:absolute;right:13px;bottom:5px;color:var(--muted);font-size:.61rem;font-weight:700}
.dialog-design-preview{flex:none}

.design-detail-dialog{width:min(620px,calc(100vw - 28px));border:0;border-radius:24px;padding:0;box-shadow:0 24px 80px rgba(24,34,55,.28)}
.design-detail-dialog::backdrop{background:rgba(29,38,55,.56);backdrop-filter:blur(4px)}
.design-detail-dialog form{position:relative;padding:28px;max-height:90vh;overflow:auto}
.design-detail-heading{text-align:center;padding:0 38px 17px}
.design-detail-heading>span{color:var(--brand);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.design-detail-heading h2{margin:5px 0 3px;font-size:1.28rem}
.design-detail-heading p{margin:0;color:var(--muted);font-size:.76rem;line-height:1.55}
.design-detail-stage{min-height:350px;display:grid;place-items:center;padding:25px;border:1px solid #e2e7f0;border-radius:18px;background-color:#f1f3f7;background-image:linear-gradient(45deg,#e5e9f0 25%,transparent 25%),linear-gradient(-45deg,#e5e9f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5e9f0 75%),linear-gradient(-45deg,transparent 75%,#e5e9f0 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}
.design-detail-preview{display:grid;place-items:center;overflow:hidden;background:#fff;filter:drop-shadow(0 13px 18px rgba(37,43,58,.16))}
.design-detail-preview img{display:block;width:100%;height:100%;object-fit:contain;transform-origin:center}
.design-detail-list{display:grid;grid-template-columns:repeat(3,1fr);margin:14px 0 6px;border:1px solid var(--line);border-radius:13px;overflow:hidden}
.design-detail-list div{padding:11px;text-align:center}
.design-detail-list div+div{border-left:1px solid var(--line)}
.design-detail-list dt{font-size:.68rem;color:var(--muted)}
.design-detail-list dd{margin:4px 0 0;font-size:.8rem;font-weight:900}
.design-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}
.design-detail-actions .button{width:100%}

html,body{max-width:100%;overflow-x:hidden;overflow-x:clip}
.topbar,.shell,.editor-view,.editor-grid,.preview-card,.controls-card,.file-strip,.stage,.admin-help-bottom,.action-bar{max-width:100%;min-width:0}
.topbar,.shell,.editor-view,.editor-grid,.preview-card,.controls-card,.stage,.admin-help-bottom,.action-bar{width:100%}
.editor-grid>*{min-width:0}
.file-strip>div:nth-child(2){width:0;min-width:0}
.file-icon,.ready-badge{flex:0 0 auto}

@media(max-width:900px){.editor-grid,.proof-grid{grid-template-columns:minmax(0,1fr)}}

@media(max-width:760px){
  .editor-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .stage{min-height:315px;padding:40px 20px}
  .sticker-shell{width:min(235px,66vw)}
  .controls-card{padding:18px}
  .shape-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  .shape-button{min-height:78px;padding-left:2px;padding-right:2px}
  .more-tools,.control-section+.control-section{margin-top:18px;padding-top:18px}
  .admin-help-bottom{margin-top:14px}
  .admin-help-bottom .button{width:100%;min-width:0;white-space:normal}
  .action-bar{position:static;grid-template-columns:minmax(0,.72fr) minmax(0,1.78fr);gap:9px;margin-top:14px}
  .action-bar .button{width:100%;min-width:0;white-space:normal}
  .design-detail-stage{min-height:310px;padding:20px}
}

@media(max-width:420px){
  .shape-grid{grid-template-columns:repeat(3,1fr)}
  .shape-button{min-height:74px}
  .shape-button span{font-size:.61rem;line-height:1.25}
  .stage{min-height:295px;padding:38px 16px}
  .sticker-shell{width:min(220px,64vw)}
  .drag-hint{bottom:10px}
  .admin-help-bar{grid-template-columns:36px minmax(0,1fr);gap:10px}
  .admin-help-bar .button{grid-column:1/-1}
  .dialog-design:after{content:"ดูแบบ";right:8px;bottom:4px}
  .design-detail-dialog form{padding:22px 16px}
  .design-detail-heading{padding:0 22px 14px}
  .design-detail-stage{min-height:275px;padding:16px}
  .design-detail-list{grid-template-columns:1fr}
  .design-detail-list div{display:flex;justify-content:space-between;text-align:left;padding:9px 11px}
  .design-detail-list div+div{border-left:0;border-top:1px solid var(--line)}
  .design-detail-list dd{margin:0}
  .design-detail-actions{grid-template-columns:1fr 1fr}
  .ready-badge{padding:5px 7px;font-size:.65rem}
}
