.work-main{grid-template-columns:minmax(0,1fr);width:100%}.work-main>*{min-width:0;width:100%}.canvas-panel,.material-card{min-width:0}.parameter-details{grid-column:1/-1;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:12px 0;background:#f9fbff}.parameter-details summary{cursor:pointer;color:var(--blue);font-size:14px;font-weight:650}.parameter-details .parameter-body{display:block}.crop-wrap{max-height:440px;overflow:auto}.crop-wrap canvas{height:auto;max-height:none}.settings-panel .wide{align-self:center}@media(max-width:850px){.settings-panel{display:block}.settings-panel>.two{display:grid}.parameter-details .parameter-body{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.parameter-body>.two,.parameter-body>#paletteNotice{grid-column:1/-1}.parameter-body select{max-width:100%}.canvas-viewport{width:100%}.work-main{width:100%}.grid{min-width:0}.row{min-width:0}.canvas-top>div:first-child{min-width:0;width:100%}.canvas-top .name-input{width:100%}.template-card{min-width:0}.topbar .logo{flex-shrink:0}}
.image-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px}.image-compare figure{margin:0;min-width:0}.image-compare figcaption{font-size:14px;margin:8px 0}.image-compare canvas{width:100%;height:260px;object-fit:contain;background:repeating-conic-gradient(#e4e9f1 0% 25%,white 0% 50%) 0/16px 16px;border-radius:10px}#sourcePreview .source-thumb{height:220px}#sourcePreview button{margin-top:8px}@media(max-width:500px){.image-compare canvas{height:230px}}
.paint-palette{max-height:280px;overflow-y:auto;align-content:flex-start}.parameter-body>.inline{white-space:normal;align-items:flex-start}.parameter-body>.inline input{flex-shrink:0}#colorNumber{max-width:110px}@media(max-width:850px){.parameter-body>*{grid-column:1/-1}.parameter-body>.two{display:grid;grid-template-columns:1fr 1fr}.paint-palette{max-height:230px}}
.processing-dialog{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;text-align:center;padding:30px 24px;border:1px solid #bed2ff;box-shadow:0 18px 70px #17233b33}.processing-dialog::backdrop{background:#17233b66}.processing-dialog h2{font-size:23px;margin:18px 0 12px}.processing-dialog #processingStage{font-size:17px;font-weight:650;color:var(--blue);margin:10px 0}.processing-time{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}.processing-dialog .muted{font-size:14px;line-height:1.7;margin-bottom:0}.processing-spinner{width:46px;height:46px;border-radius:50%;border:4px solid #dce7ff;border-top-color:var(--blue);animation:processing-spin 1s linear infinite;margin:0 auto}@keyframes processing-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.processing-spinner{animation:none}}

.app-loading{min-height:60dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 16px}.app-loading h1{font-size:24px;margin:20px 0 8px}.app-loading p{margin:0;line-height:1.7}#accountBtn:disabled{cursor:wait}
#redrawForm .inline{white-space:normal;align-items:flex-start;line-height:1.7;font-size:14px}#redrawForm .inline input{flex-shrink:0;margin-top:5px}#redrawImage{margin-top:10px}#redrawForm{min-width:0}#redrawForm select{max-width:100%}@media(max-width:850px){#accountBtn{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#beanWallet{padding:10px}}
.studio-open #main{padding-bottom:110px}.generate-bar{position:fixed;z-index:20;right:24px;bottom:20px;display:flex;align-items:center;gap:16px;padding:10px 12px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 32px #17233b20}.generate-bar #jobStatus{margin:0;font-size:13px}.generate-bar #generate{min-width:170px;white-space:nowrap}.generate-bar #jobStatus:empty{display:none}#exportStatus{color:var(--blue);min-height:22px;font-size:14px}.print-settings .two{gap:12px}.print-settings input{width:100%}@media(max-width:850px){.generate-bar{right:12px;left:12px;bottom:max(12px,env(safe-area-inset-bottom));justify-content:space-between}.generate-bar #generate{flex:1}.generate-bar #jobStatus:not(:empty){max-width:50%}.print-settings .two{display:grid;grid-template-columns:1fr 1fr}}
.image-editor{width:min(920px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:20px;overflow:auto;margin:auto}.image-editor .dialog-head h2{font-size:20px}.editor-tabs,.editor-controls,.editor-view-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0}.editor-controls[hidden]{display:none}.editor-controls label{font-size:14px;margin:0}.editor-controls select{margin:0}.editor-controls input[type=range]{width:120px;margin:0}.editor-controls p{width:100%;margin:0;font-size:13px}.editor-tabs .selected,[data-brush].selected{background:#155eef;color:#fff}.editor-stage{height:clamp(200px,40dvh,480px);overflow:auto;position:relative;background:#17233b;border-radius:12px;padding:16px;touch-action:none;overscroll-behavior:contain}.editor-image{position:relative;margin:auto;flex-shrink:0}.editor-image canvas{display:block;max-width:none!important;max-height:none!important;background:repeating-conic-gradient(#e4e9f1 0% 25%,white 0% 50%) 0/14px 14px;touch-action:none}#cropBox{position:absolute;border:2px solid white;box-shadow:0 0 0 9999px #0008;cursor:move;touch-action:none;box-sizing:border-box}#cropBox .thirds{position:absolute;inset:0;background:linear-gradient(to right,transparent 33%,#fff7 33%,#fff7 calc(33% + 1px),transparent calc(33% + 1px),transparent 66%,#fff7 66%,#fff7 calc(66% + 1px),transparent calc(66% + 1px)),linear-gradient(to bottom,transparent 33%,#fff7 33%,#fff7 calc(33% + 1px),transparent calc(33% + 1px),transparent 66%,#fff7 66%,#fff7 calc(66% + 1px),transparent calc(66% + 1px));pointer-events:none}#cropBox [data-handle]{position:absolute;width:32px;height:32px;padding:0;border:0;background:transparent;transform:translate(-50%,-50%);border-radius:0}#cropBox [data-handle]::after{content:'';position:absolute;inset:10px;border:2px solid white;background:#155eef;border-radius:2px}#cropBox [data-handle=nw]{left:0;top:0}#cropBox [data-handle=n]{left:50%;top:0}#cropBox [data-handle=ne]{left:100%;top:0}#cropBox [data-handle=e]{left:100%;top:50%}#cropBox [data-handle=se]{left:100%;top:100%}#cropBox [data-handle=s]{left:50%;top:100%}#cropBox [data-handle=sw]{left:0;top:100%}#cropBox [data-handle=w]{left:0;top:50%}.editor-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;position:sticky;bottom:-20px;background:white;padding:12px 0 4px}.editor-footer .primary{min-width:130px}#editorHint{font-size:14px;margin:8px 0}.removal-methods{display:grid;gap:12px}.removal-methods button{text-align:left;padding:16px}.removal-methods small{display:block;margin-top:6px;font-weight:normal;font-size:13px}@media(max-width:600px){.image-editor{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:14px;box-sizing:border-box}.image-editor .editor-stage{height:36dvh;min-height:220px}.editor-view-controls button{padding:9px;font-size:14px}.editor-footer{bottom:-14px;padding-bottom:max(10px,env(safe-area-inset-bottom))}}
.pattern-finish{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 0 16px}.pattern-finish[hidden]{display:none}.pattern-finish label{margin:0;display:flex;align-items:center;gap:10px;font-size:14px}.pattern-finish select{width:110px;margin:0}.pattern-finish .muted{font-size:13px;flex:1;min-width:180px}#maxColors:disabled,#colorNumber:disabled{opacity:.45}
