.rank-page{max-width:1440px;margin:0 auto;padding:36px 30px 70px;color:#30372d}.rank-heading{margin:24px 0 32px}.rank-heading h1{font-size:clamp(30px,4vw,48px);margin:8px 0}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:#707459}.rank-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,1fr);gap:36px;align-items:start}.rank-preview{position:sticky;top:24px;min-width:0;background:#f1eee7;border:1px solid #ddd7ca;border-radius:15px;overflow:hidden}.rank-preview p{padding:0 20px}.rank-caption,.rank-hint{font-size:13px;color:#64675e;line-height:1.55}.rank-caption{margin:8px 0 20px}#rank-stage{height:460px;max-height:65vh;touch-action:pan-y;outline-offset:-4px}#rank-stage canvas{width:100%;height:100%;display:block;touch-action:none}#rank-stage>img{width:100%;height:85%;object-fit:cover}#rank-stage>p{text-align:center}.rank-tools{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;padding:14px 10px}.rank-page button,.rank-page input,.rank-page textarea,.rank-page select{font:inherit}.rank-page button{cursor:pointer;border:1px solid #cacdbf;background:white;color:#36412f;border-radius:7px;padding:10px 12px;min-height:44px}.rank-page button:hover{border-color:#5b674d}.rank-page button[aria-pressed=true]{border:2px solid #526340;background:#edf1e6;padding:9px 11px}.rank-page button:disabled{opacity:.5;cursor:default}.rank-page button:focus-visible,.rank-page input:focus-visible,.rank-page select:focus-visible,.rank-page textarea:focus-visible{outline:3px solid #9ba982;outline-offset:2px}.rank-step{padding:24px 0;border-top:1px solid #dfe1d5}.rank-step:first-child{padding-top:0;border:0}.rank-step h2{font-size:21px;margin:0 0 16px;display:flex;align-items:center;gap:10px}.rank-step h2>span{font:12px Arial,sans-serif;border:1px solid #ced3c2;border-radius:50%;width:25px;height:25px;display:inline-grid;place-items:center}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rank-page label{display:block;font-size:14px;margin:14px 0 7px}.rank-page select,.rank-page textarea,.rank-page input[type=search],.rank-page input[type=text]{width:100%;padding:12px;border:1px solid #bdc3b0;border-radius:6px;background:white;box-sizing:border-box;color:#30372d}.rank-page textarea{resize:vertical}.rank-page fieldset{padding:0;margin:0;border:0;min-width:0}.rank-page fieldset:disabled{opacity:.5}.rank-art-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px;max-height:400px;overflow:auto;padding:3px}.rank-art-grid button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font-size:11px;line-height:1.3;min-height:105px;text-align:center;overflow-wrap:anywhere}.rank-art-grid img{width:64px;height:64px;object-fit:contain}.rank-page details{margin-top:12px}.rank-page summary{cursor:pointer;font-size:14px}.cord-swatch{display:block;height:18px;border-radius:9px;margin:0 8px 9px;box-shadow:inset 0 1px 3px #0004;background:repeating-linear-gradient(90deg,#fff0 0 2px,#0002 2px 3px),linear-gradient(90deg,var(--accent) 0 15%,var(--cord) 15% 85%,var(--accent) 85%)}.rank-review{background:#eff2e8;padding:22px;border:1px solid #d8dfca;border-radius:10px}.rank-review h2{margin-bottom:14px}.rank-review dl{margin:0;font-size:13px}.rank-review dt{font-weight:600;margin-top:10px}.rank-review dd{margin:3px 0;overflow-wrap:anywhere;white-space:pre-wrap}.rank-page .rank-approval{display:flex;align-items:flex-start;gap:9px;margin:18px 0;line-height:1.5}.rank-approval input{width:19px;height:19px;flex-shrink:0}.rank-page .rank-primary{display:block;width:100%;background:#4a583c;color:white;border-color:#4a583c;padding:14px;font-weight:600}.rank-page [hidden]{display:none!important}.rank-page [role=alert]{color:#8f2924}.rank-cart-preview{height:180px;width:100%;min-width:190px}.rank-cart-preview canvas{width:100%;height:100%}.rank-page .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:900px){.rank-page{padding:22px 16px 50px}.rank-layout{grid-template-columns:1fr;gap:26px}.rank-preview{position:relative;top:auto}#rank-stage{height:350px}.rank-heading{margin:18px 0 24px}.rank-controls{min-width:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.rank-footer{text-align:center;padding:30px 16px;background:#f2f3ed;color:#626953;font-size:13px}
#rank-open-3d{margin-top:10px}.rank-art-grid button span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.rank-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;width:min(760px,calc(100vw - 28px));max-width:calc(100vw - 28px);height:fit-content;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);padding:0;border:1px solid #c8cbbb;border-radius:16px;color:#30372d;background:#fff;overflow:auto;box-shadow:0 24px 70px #0005}.rank-dialog::backdrop{background:#131c18a8}.rank-dialog [hidden]{display:none!important}.rank-dialog button{font:inherit;cursor:pointer;background:#f8f9f5;border:1px solid #c4cbbb;border-radius:7px;padding:10px 12px;min-height:44px;color:#30372d}.rank-dialog button:disabled{opacity:.48;cursor:not-allowed}.rank-dialog :focus-visible{outline:3px solid #8f7239;outline-offset:3px}.rank-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid #d7dbd2}.rank-dialog-head>div{min-width:0}.rank-dialog-head>button{flex-shrink:0}.rank-dialog-head h2{font-size:23px;line-height:1.3;margin:0}.rank-dialog-head p{font-size:14px;line-height:1.4;margin:5px 0 0}.rank-dialog-stage{height:min(42dvh,340px);min-height:200px;touch-action:none;background:#f1eee7;overflow:hidden}.rank-dialog-stage canvas{display:block;width:100%;height:100%}.rank-review-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:5px}.rank-review-tabs button{font-size:14px;font-weight:600}.rank-review-tabs span{display:block;font-size:12px;font-weight:400;margin-top:4px}.rank-review-tabs [aria-selected=true]{background:#303b2d;color:white}.rank-dialog-final{padding:0 22px 22px}.rank-dialog-final p{font-size:14px;line-height:1.5}.rank-dialog .rank-primary{display:block;width:100%;padding:14px 18px;background:#4a583c;color:white;font-weight:600}.rank-dialog .rank-approval{display:flex;align-items:flex-start;gap:10px;line-height:1.5;margin:16px 0;font-size:15px}.rank-dialog .rank-approval input{width:20px;height:20px;flex-shrink:0;accent-color:#4a583c}.rank-dialog [role=alert]{color:#8f2924}@media(max-width:600px){.rank-dialog-head{padding:14px}.rank-dialog-head h2{font-size:20px}.rank-dialog-final{padding:0 15px 18px}.rank-dialog-stage{height:min(34dvh,270px)}}

.rank-examples{margin:48px 0 16px}.rank-example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.rank-example-grid img{display:block;width:100%;height:100%;max-height:430px;object-fit:contain;background:#eeeae2;border-radius:12px}.rank-example-grid a:focus-visible{outline:3px solid #8a7230}@media(max-width:600px){.rank-example-grid{grid-template-columns:1fr}}

.rank-example-grid img{height:auto;aspect-ratio:4/3}.rank-example-grid span{display:block;padding:10px 0;font-size:14px}.rank-example-grid a{align-self:start}

#rank-preview-details[hidden]{display:none}#rank-stage>img{height:100%}
