.hat-text-page{max-width:1180px;margin:auto;padding:24px;color:#503c35;overflow-wrap:anywhere}.hat-text-page h1{font-size:clamp(22px,4vw,30px);line-height:1.4;margin:12px 0}.hat-text-page h2{font-size:21px;margin:22px 0 12px}.hat-text-page h3{font-size:18px}.hat-text-page button,.hat-text-page input,.hat-text-page textarea,.hat-text-page select{font:inherit;max-width:100%;box-sizing:border-box}.hat-text-page button{border:1px solid #d4bbb1;border-radius:12px;background:#fffaf7;color:#633e34;padding:11px 15px;cursor:pointer;min-height:44px}.hat-text-page button:disabled{opacity:.55;cursor:wait}.hat-text-page button.primary-button{background:#b32b3b;color:#fff}.hat-text-page label{display:grid;gap:7px;margin:12px 0;font-weight:600}.hat-text-page input:not([type=checkbox]),.hat-text-page textarea,.hat-text-page select{width:100%;min-width:0;padding:10px;border:1px solid #cbb7aa;border-radius:8px;background:#fff;color:#45362f;min-height:44px}.hat-text-page textarea{resize:vertical;line-height:1.6}.hat-text-page small{font-size:13px;line-height:1.5;font-weight:400}.hat-badge{display:inline-block;background:#f3e5df;border-radius:20px;padding:6px 12px;font-size:14px}.hat-products{display:flex;gap:10px;overflow-x:auto;padding:6px 2px 15px}.hat-products button{flex:0 0 145px;display:flex;flex-direction:column;gap:8px;align-items:center}.hat-products button[aria-pressed=true]{border:3px solid #b32b3b;background:#fff0e9}.hat-products img{width:100%;height:105px;object-fit:contain}.hat-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px}.hat-controls{min-width:0}.hat-preview-column{min-width:0;align-self:start;position:sticky;top:12px}.hat-image-stage{position:relative;width:100%;background:#f6f0e9;border:1px solid #d7c7ba;border-radius:14px;overflow:hidden}.hat-image-stage canvas{width:100%;height:auto;display:block}.hat-rendering{position:absolute;top:20px;right:20px;bottom:20px;left:20px}.hat-placeholder{padding:65px 24px;text-align:center;line-height:1.7}.hat-disclaimer{font-size:15px;line-height:1.7;color:#523b31;background:#fff5e7;padding:14px;border-radius:10px;margin:10px 0;word-break:keep-all;overflow-wrap:anywhere}.hat-errors,.hat-message{background:#fff0eb;border:1px solid #d3977e;color:#8a2b20;border-radius:10px;padding:14px;line-height:1.6}.hat-errors{padding-left:30px}.hat-settings{border:1px solid #cfb6a9;border-radius:12px;padding:16px;margin-top:24px;min-width:0}.hat-settings legend{font-weight:700}.hat-settings p{font-size:14px;line-height:1.6}.hat-text-page .hat-check{display:flex;align-items:start;gap:10px;line-height:1.5}.hat-check input{width:20px;height:20px;flex-shrink:0}.hat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hat-field-editor{background:#f8eee6;padding:12px;margin:16px 0;border-radius:10px}.app-shell.hat-text-shell{padding:16px;min-height:100dvh}.mobile-frame.hat-text-frame{width:100%;max-width:1220px;min-height:calc(100dvh - 32px);height:auto;overflow:visible}.hat-text-cta{width:100%;flex-shrink:0}.hat-text-cta .intro-button{height:auto;min-height:70px;white-space:normal;text-align:left;gap:10px}.hat-text-cta .color-pick-button-title{white-space:normal;overflow-wrap:anywhere;font-size:clamp(16px,4.5vw,20px)}.intro-screen:has(.hat-text-cta){overflow-y:auto}.intro-screen:has(.hat-text-cta) .landing-card{height:auto;min-height:100%;overflow:visible;gap:14px}.intro-screen:has(.hat-text-cta) .landing-card>*{flex-shrink:0}.intro-screen:has(.hat-text-cta) .intro-note{line-height:1.6;flex-wrap:wrap}@media(max-width:700px){.hat-text-page{padding:16px}.hat-workspace{display:flex;flex-direction:column}.hat-preview-column{position:static;order:-1}.app-shell.hat-text-shell{padding:0}.mobile-frame.hat-text-frame{min-height:100dvh}.hat-grid{gap:8px}}.hat-confirm{position:fixed;z-index:100;top:20%;left:50%;transform:translate(-50%);width:min(420px,calc(100vw - 32px));padding:24px;background:#fff8ee;border:2px solid #b32b3b;border-radius:16px;box-shadow:0 0 0 100vmax #0005}.hat-confirm button{margin:6px}.hat-private-shell{min-height:100dvh;background:#fffdfa}.hat-session-bar{max-width:1180px;margin:auto;padding:16px 24px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}.hat-session-bar button{padding:10px 16px;border:1px solid #cfb6a9;border-radius:12px;background:#fffaf7;color:#633e34}.hat-text-cta [role=status]{font-size:15px;line-height:1.6}.hat-products small{white-space:normal}.hat-image-stage canvas{user-select:none;-webkit-user-select:none;-webkit-user-drag:none;touch-action:auto}.hat-text-page button.hat-text-drag,.hat-text-page button.hat-text-drag:hover,.hat-text-page button.hat-text-drag:focus,.hat-text-page button.hat-text-drag:active{position:absolute;display:block;padding:0;margin:0;min-height:0;min-width:0;border:0;border-radius:0;background:transparent;outline:none;box-shadow:none;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}.hat-text-page button.hat-text-drag[data-dragging=true]{cursor:grabbing}.hat-product-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.hat-product-card{flex:0 0 145px;display:flex;flex-direction:column;gap:8px;min-width:0}.hat-products .hat-product-card button{flex:none;width:100%}.hat-products .hat-product-select{flex:1}.hat-products .hat-product-hide{font-size:13px;padding:10px 6px;min-height:44px}.hat-hidden-products{border:1px solid #cfb6a9;padding:12px;border-radius:12px;background:#fff8ef}.hat-hidden-products .hat-product-card{align-items:center;text-align:center}.hat-confirm p{white-space:pre-line}.hat-font-proof{border:1px solid #cfb6a9;border-radius:12px;padding:16px;margin-top:20px;background:#fff}.hat-font-proof p{font-size:14px;line-height:1.6}.hat-font-proof-text{white-space:pre-wrap;overflow-wrap:anywhere;color:#211917;font-synthesis:none;padding:16px 0}.hat-input-errors{color:#8a2b20;font-size:14px;line-height:1.6;padding-left:20px}.hat-order-dialog{border:1px solid #ded5cb;border-radius:18px;padding:0;width:min(760px,calc(100% - 24px));max-width:none;max-height:90dvh;color:#40372f;background:#fffdf9;box-shadow:0 18px 80px #0003;overflow:hidden}.hat-order-dialog[open]{display:flex;flex-direction:column}.hat-order-dialog::backdrop{background:#0006}.hat-order-dialog header{padding:18px 20px 10px}.hat-order-dialog h2{margin:0 0 8px}.hat-order-dialog p{margin:6px 0;font-size:14px}.hat-order-dialog>.hat-message{margin:4px 16px}.hat-order-list{overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:4px 16px;min-height:0}.hat-order-row{display:grid;grid-template-columns:44px 24px 56px minmax(0,1fr);align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #e9e2d9}.hat-order-row[data-moving=true]{background:#fff0d7}.hat-order-row img{width:56px;height:56px;object-fit:contain;pointer-events:none}.hat-order-name{min-width:0}.hat-order-name strong,.hat-order-name small{display:block;overflow-wrap:anywhere}.hat-order-name small{font-size:12px;color:#76695d}.hat-order-name .hat-order-hidden{color:#9a472f;font-weight:700}.hat-order-number{font-variant-numeric:tabular-nums;text-align:center}.hat-order-dialog button{min-height:44px}.hat-order-dialog .hat-order-handle{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;font-size:26px;padding:0}.hat-order-dialog .hat-order-handle:active{cursor:grabbing}.hat-order-actions{grid-column:4;display:flex;gap:6px;flex-wrap:wrap}.hat-order-actions button{padding:6px 10px;font-size:13px}.hat-order-dialog footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 16px;border-top:1px solid #e2d7ca;background:#fffdf9}.hat-order-dialog footer span{margin-right:auto;font-size:12px}.hat-product-heading{flex-wrap:wrap}@media(max-width:520px){.hat-order-dialog header{padding:14px}.hat-order-list{padding:0 10px}.hat-order-row{gap:7px;grid-template-columns:44px 20px 48px minmax(0,1fr)}.hat-order-row img{width:48px;height:48px}.hat-order-actions{grid-column:2 / -1;justify-content:flex-end}.hat-order-dialog footer{flex-wrap:wrap}.hat-order-dialog footer span{flex-basis:100%}.hat-order-dialog footer button{flex:1}}.hat-order-dialog footer button{width:auto;flex:none;white-space:nowrap;margin:0}.hat-order-dialog footer span{flex:1;min-width:0}@media(max-width:520px){.hat-order-dialog footer button{flex:1}.hat-order-dialog footer span{flex-basis:100%}}.hat-image-scene{position:relative;width:100%}.hat-image-stage:is([data-product-id=product-1785394152687-xxlasy],[data-product-id=product-1785394293527-k1a2l1]){aspect-ratio:.76;display:grid;place-items:center}.hat-image-stage:is([data-product-id=product-1785394152687-xxlasy],[data-product-id=product-1785394293527-k1a2l1]) .hat-image-scene{width:69%}.hat-product-card:is([data-product-id=product-1785394152687-xxlasy],[data-product-id=product-1785394293527-k1a2l1]) img{transform:scale(.94)}.product-thumbnail:has(image[href="/products/hat-images-20261012/valentine-fitting-20261012.png"]) svg,.product-thumbnail:has(image[href="/products/hat-images-20261012/whiteday-fitting-20261012.png"]) svg{transform:scale(.94)}.hat-koye-colors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:12px 0}.hat-koye-colors button{padding:5px;min-width:0;border:1px solid #ddd;border-radius:8px;background:#fff}.hat-koye-colors button[aria-pressed=true]{border:2px solid #ad3450;background:#fff1f4}.hat-koye-colors img{width:100%;aspect-ratio:1;object-fit:contain}.hat-koye-colors strong,.hat-koye-colors small{display:block;font-size:12px}.hat-koye-guide{padding:12px;background:#fff5e9;border-radius:10px}.hat-koye-guide small{display:block;margin-top:7px}.hat-koye-output{background:#faf6f1;padding:8px;border-radius:6px}.hat-koye-output pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0}.hat-koye-colors span{font-size:11px;display:block;aspect-ratio:1;padding-top:18px;box-sizing:border-box}
