@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap";:root{font-family:DM Sans,Arial,sans-serif;color:#342b20;background:#e6dac5;font-synthesis:none;--paper:#fffcf5;--cream:#eee6d8;--gold:#80613a;--ink:#342b20;--muted:#6c5b45;--line:#c5b18f;--serif:"Libre Caslon Display",Georgia,serif;--ease:cubic-bezier(.22,1,.36,1)}*{box-sizing:border-box}body{margin:0;min-width:320px;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;touch-action:manipulation;border:0}button:disabled{cursor:default}button,a,input{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #947644}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}img{max-width:100%;display:block}button{transition:background .2s,color .2s,border-color .2s,box-shadow .2s}a:hover{color:var(--gold)}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;border:0}body{min-height:100svh;background:#e6dac5 url(/assets/beige-silk.webp) center center/cover fixed no-repeat}#root{min-height:100svh;isolation:isolate}html{scrollbar-width:none}html::-webkit-scrollbar{display:none}.site-header{position:relative;display:flex;justify-content:center;align-items:center;max-width:1370px;margin:auto;padding:14px 44px 3px}.wordmark{font-family:Georgia,serif;font-size:42px;line-height:1;letter-spacing:-1.8px;text-align:center}.wordmark span{display:block;font-family:DM Sans,sans-serif;font-size:8px;line-height:1.4;font-weight:500;letter-spacing:.35em;margin-top:6px}.text-button{font-size:11px;background:transparent;padding:5px 0;color:var(--muted)}.text-button:hover{color:var(--ink)}.how-button,.start-fresh{border:1px solid #705b3c38;border-radius:999px;background:#fff8ec18;color:#66543e;font-weight:400;box-shadow:none;text-decoration:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.how-button:hover,.start-fresh:hover{background:#fff5e44d;border-color:#705b3c66;color:var(--ink)}.how-button{position:absolute;right:44px;top:28px;min-height:32px;padding:7px 14px;font-size:10px}.introduction{text-align:center;padding:4px 20px 8px;animation:scene-in .7s var(--ease) both}h1{font-family:var(--serif);font-size:64px;line-height:.99;font-weight:400;letter-spacing:-.035em;margin:0 0 8px}h2{font-family:var(--serif);font-size:31px;line-height:1.05;font-weight:400;letter-spacing:-.025em}.introduction>p{font-size:11px;line-height:1.4;letter-spacing:.24em}.eyebrow{font-size:9px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--muted)}.atelier{display:grid;grid-template-columns:minmax(0,1fr) 224px;column-gap:34px;row-gap:8px;max-width:1280px;padding:0 42px 22px;margin:auto;align-items:end}.creation{grid-column:1/-1;min-width:0;text-align:center}.base-picker{min-height:42px;text-align:center}.base-picker fieldset{display:inline-flex;justify-content:center;gap:3px;margin:0;border:1px solid #a58e68;border-radius:50px;padding:3px;background:#e0d0b64d;box-shadow:inset 0 0 0 1px #fff7e642;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.base-picker legend{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}.base-picker fieldset button{background:transparent;border:1px solid transparent;border-radius:30px;padding:8px 25px;font-size:12px;color:var(--ink);min-width:105px}.base-picker fieldset button:hover{background:#fff8eb59}.base-picker fieldset button[aria-pressed=true]{background:#fff3dc;border-color:#fff9ec;box-shadow:0 2px 6px #61421c20;color:#2d2418;font-weight:600}.jewelry-stage{position:relative;aspect-ratio:4/5;width:clamp(460px,calc((100svh - 330px)*.8),720px);max-width:100%;margin:3px auto -5px;isolation:isolate;animation:scene-in .85s .04s var(--ease) both}.box-photo{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 15px 15px #5f442224)}.base-chain{position:absolute;left:21%;top:60%;width:56%;height:24%;object-fit:contain;pointer-events:none;animation:chain-in .35s var(--ease)}.placed-charm{position:absolute;width:13%;height:13%;background:none;padding:0;transform:translate(-50%,-5%) rotate(var(--tilt));transform-origin:top center;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:left .6s var(--ease),top .6s var(--ease),transform .4s var(--ease),opacity .2s,filter .2s;animation:charm-arrive .5s var(--ease)}.placed-charm:hover{transform:translate(-50%,-5%) rotate(0) scale(1.12);z-index:2;filter:drop-shadow(0 3px 3px #65441522)}.placed-charm:active{cursor:grabbing}.placed-charm img{width:100%;height:100%;object-fit:contain;pointer-events:none}.placed-charm.is-lifted{opacity:.16}.placed-charm.is-drop-target{filter:drop-shadow(0 0 4px #ad852f);transform:translate(-50%,-5%) rotate(0) scale(1.08)}.empty-bracelet-note{position:absolute;top:70.5%;left:25%;right:27%;text-align:center;font-size:12px;line-height:1.45;text-wrap:balance;color:var(--muted);pointer-events:none}.drag-ghost{position:fixed;transform:translate(-50%,-30%) rotate(-6deg);width:72px;height:86px;pointer-events:none!important;z-index:1000;filter:drop-shadow(2px 8px 5px #4a341d26)}.drag-ghost img{width:100%;height:100%;object-fit:contain;pointer-events:none}.drag-demo{position:fixed;z-index:80;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0;transform-origin:50% 0;filter:drop-shadow(0 8px 6px #65441530);animation:demo-drag 2.8s var(--ease) both}.drag-demo img{width:100%;height:100%;object-fit:contain;pointer-events:none}@keyframes demo-drag{0%{opacity:0;transform:translate(0) rotate(0)}10%{opacity:.58;transform:translateY(-3px) rotate(-9deg)}20%{opacity:.58;transform:translateY(-3px) rotate(7deg)}29%{opacity:.58;transform:translateY(-4px) rotate(0)}75%{opacity:.55;transform:translate(var(--demo-x),var(--demo-y)) rotate(-5deg) scale(var(--demo-scale))}86%{opacity:.4;transform:translate(var(--demo-x),var(--demo-y)) rotate(0) scale(var(--demo-scale))}to{opacity:0;transform:translate(var(--demo-x),var(--demo-y)) rotate(0) scale(var(--demo-scale))}}.arrangement{height:0;overflow:hidden}.charm-library{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;animation:scene-in .8s .1s var(--ease) both}.library-toolbar{grid-column:1;grid-row:1;min-width:0;margin-bottom:13px}.filters{display:flex;min-width:0;gap:8px;overflow-x:auto;scrollbar-width:none;padding:3px 1px;overscroll-behavior-x:contain}.filters::-webkit-scrollbar{display:none}.filters button{flex-shrink:0;background:#cfbb992b;border:1px solid #ac906548;border-radius:100px;padding:9px 18px;font-size:12px;line-height:1.2;white-space:nowrap;color:#51422e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.filters button:hover{background:#fbefd68c;border-color:#a78d61}.filters button[aria-pressed=true]{background:#fff3dc;border-color:#fdf3df;box-shadow:0 2px 8px #74512415;color:#302619;font-weight:600}.start-fresh{display:block;width:max-content;min-height:30px;margin:0 auto 5px;padding:6px 14px;font-size:10px}.charm-tray{grid-column:1/-1;grid-row:2;display:flex;gap:7px;border:1px solid #b79e7777;border-radius:20px;padding:9px 10px 11px;background:#c0aa88 url(/assets/beige-velvet.webp) center center/cover;box-shadow:inset 0 1px 2px #fff3da90,inset 0 0 0 4px #f1dfc030,0 9px 18px #5c401c17;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#886f4270 transparent;touch-action:pan-x}.charm-card{position:relative;flex:0 0 104px;min-width:0;height:124px;display:flex;align-items:center;flex-direction:column;padding:12px 3px 7px;background:transparent;border:1px solid transparent;border-radius:11px;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-x;scroll-snap-align:start}.charm-card:hover{background:#fff6df38;border-color:#fff5db73}.charm-card.is-selected{background:#fff7df16;border-color:#f9eacb30}.charm-card:active{cursor:grabbing}.charm-card img{width:76px;height:69px;object-fit:contain;margin-bottom:3px;transition:transform .45s var(--ease),opacity .2s;touch-action:pan-x;filter:drop-shadow(0 3px 2px #6d481724)}.charm-card:hover img{transform:translateY(-4px) rotate(-4deg)}.charm-card.is-lifted img{opacity:.22;transform:none}.charm-label{max-width:100%;overflow:hidden;text-overflow:ellipsis}.charm-detail{width:100%;min-width:0;font-family:var(--serif);font-size:15px;line-height:1.12;color:#443522;display:flex;gap:4px;align-items:center;flex-direction:column;text-align:center;white-space:nowrap}.charm-detail>.extra-price{font-family:DM Sans,sans-serif;font-size:8px;line-height:1.3;color:#5b482d}.selection-mark{position:absolute;top:4px;right:6px;font-size:6px;color:#5e4523;letter-spacing:.03em}.charm-tray.is-returning{outline:2px solid #8a6d3b;outline-offset:3px}.helper{grid-column:1/-1;grid-row:3;font-size:9px;line-height:1.5;color:#6c5b45;margin:8px 1px 0}.checkout{min-width:0;text-align:center;margin-top:-76px;display:flex;flex-direction:column;align-items:center;align-self:end;animation:scene-in .8s .15s var(--ease) both}.register{position:relative;width:224px;max-width:100%;aspect-ratio:1;margin:0 auto 7px;filter:drop-shadow(0 7px 8px #50321115)}.register>img{width:100%;height:100%;object-fit:contain}.register-display{position:absolute;left:19%;right:19%;top:23%;height:16%;display:flex;justify-content:center;align-items:center;color:#fff5d7;line-height:1.2;pointer-events:none}.register-display strong{font-family:Georgia,serif;font-size:27px;font-weight:400;letter-spacing:-.04em;animation:price-in .4s var(--ease)}.checkout-actions{width:100%}.primary-button{background:#f8e8cc;color:#332619;padding:14px 24px;text-align:center;font-size:13px;font-weight:600;min-height:44px;border:1px solid #fff1d7;border-radius:7px;box-shadow:0 3px 12px #67471c1c;transition:background .2s,transform .2s,box-shadow .2s}.primary-button:hover{background:#fff3dc;border-color:#fff7e9;box-shadow:0 5px 16px #67471c26;transform:translateY(-1px)}.primary-button:active{transform:translateY(0) scale(.98)}.primary-button:disabled{background:#d1c0a4;border-color:#d9c8ad;color:#6d5b41;box-shadow:none;transform:none}.box-button{width:100%;max-width:250px;margin:0}.completion-hint{font-size:9px;line-height:1.5;color:#655135;margin-top:8px;min-height:14px}.completion-hint.is-complete{visibility:hidden}.letter-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100}.letter-dismiss{position:absolute;top:0;right:0;bottom:0;left:0;background:#2b261b12;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.letter-bubble{position:absolute;top:var(--bubble-top);left:50%;width:min(640px,calc(100% - 40px));transform:translate(-50%);background:#fffcf5;border:1px solid #d5c6aa;border-radius:24px;box-shadow:0 22px 80px #4b351b26,0 3px 10px #4b351b0a;padding:22px 23px 13px;animation:bubble-in .35s var(--ease);overflow:hidden}.letter-close{position:absolute;right:23px;top:18px;font-size:10px}.letter-intro{display:flex;align-items:center;gap:15px;padding-right:26px;margin-bottom:17px}.letter-intro>img{width:70px;height:80px;object-fit:contain;animation:letter-in .25s var(--ease)}.letter-intro .eyebrow{font-size:8px}.letter-intro h2{font-size:35px;margin:5px 0}.letter-intro p:last-child{font-size:10px;color:var(--muted);line-height:1.5}.letter-options{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:5px;padding:3px}.letter-options button{display:flex;flex-direction:column;align-items:center;background:#f5eee1;border:1px solid transparent;border-radius:10px;padding:5px 1px 6px;min-width:0;cursor:grab;touch-action:none}.letter-options button:hover,.letter-options button:focus-visible{background:#ede1cc;border-color:#d1bb91}.letter-options button[aria-pressed=true]{background:#e8dbc2;border-color:#ad8f58}.letter-options img{width:34px;height:36px;object-fit:contain;pointer-events:none;transition:transform .3s var(--ease)}.letter-options button:hover img{transform:translateY(-3px) rotate(-5deg)}.letter-options span{font-size:9px;color:#7f6a45;margin-top:3px}.letter-footer{display:flex;justify-content:space-between;align-items:center;margin-top:13px;border-top:1px solid #e7decd;padding-top:9px;min-height:29px}.letter-footer>span{font-family:var(--serif);font-size:17px;color:#867553}.letter-footer button{font-size:10px}.letter-layer.is-dragging-letter{pointer-events:none}.is-dragging-letter .letter-dismiss,.is-dragging-letter .letter-bubble{opacity:0;pointer-events:none}.modal{background:#f8f3e8;border:1px solid #cabb9c;border-radius:20px;color:var(--ink);padding:42px;max-width:500px;width:calc(100% - 36px);max-height:calc(100dvh - 48px);box-shadow:0 30px 100px #211a1640;overflow:auto;animation:modal-in .3s var(--ease)}.modal::backdrop{background:#28231d99;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.modal-close{position:absolute;top:17px;right:23px}.modal h2{font-size:43px;margin:9px 0 25px}.how-steps{margin:0;padding-left:20px}.how-steps li{margin-bottom:21px;padding-left:10px}.how-steps h3{font-family:var(--serif);font-size:25px;font-weight:400;margin-bottom:6px}.how-steps p{font-size:12px;line-height:1.7;color:var(--muted)}.modal-note{font-size:11px;color:var(--muted);line-height:1.7;margin:20px 0}.modal>.primary-button{width:100%}.finish-description{font-size:11px;line-height:1.6;color:var(--muted)}.finish-charms{display:flex;justify-content:center;gap:2px;margin:-7px 0 17px}.finish-charms img{height:75px;width:70px;object-fit:contain;min-width:0;max-width:20%}.name-label{display:block;text-align:left;font-size:11px;margin:23px 0 8px}.name-label span{color:var(--muted)}.modal input{width:100%;padding:13px;border:1px solid var(--line);border-radius:6px;background:#fffcf6;color:var(--ink);font-size:12px}.finish-total{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:21px 0 16px;font-size:12px}.finish-total strong{font-family:Georgia,serif;font-size:22px;font-weight:400}.keep-creating{display:block;margin:14px auto 0}.saved-notice{font-size:11px;color:#4b6441;margin-top:12px}@keyframes charm-arrive{0%{opacity:0;translate:0 -10px}to{opacity:1;translate:0 0}}@keyframes chain-in{0%{opacity:.3}to{opacity:1}}@keyframes price-in{0%{opacity:.3;translate:0 4px}to{opacity:1;translate:0 0}}@keyframes bubble-in{0%{opacity:0;translate:0 10px;scale:.98}to{opacity:1;translate:0 0;scale:1}}@keyframes letter-in{0%{opacity:.55;scale:.94}to{opacity:1;scale:1}}@keyframes modal-in{0%{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}@media(min-width:1600px){.letter-bubble{width:780px}.letter-options{gap:7px}.letter-options img{width:43px;height:47px}.letter-options span{font-size:10px}}@keyframes scene-in{0%{opacity:0;translate:0 9px}to{opacity:1;translate:0 0}}.letter-bubble{--letter-top:max(18px,min(var(--bubble-top), calc(100dvh - 380px) ));top:var(--letter-top);max-height:calc(100dvh - var(--letter-top) - 18px);overflow-y:auto}.letter-error{font-size:10px;line-height:1.5;color:#8a5b26;margin:10px 3px 0}.capacity-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);width:max-content;max-width:calc(100% - 36px);padding:13px 20px;border:1px solid #d5c6aa;border-radius:12px;background:#fffaf0;box-shadow:0 6px 30px #4b351b26;font-size:11px;line-height:1.5;z-index:90;animation:bubble-in .25s var(--ease)}@media(min-width:1600px){.atelier{max-width:1460px;grid-template-columns:minmax(0,1fr) 265px;gap:12px 40px}.site-header{max-width:1460px}.jewelry-stage{width:clamp(520px,calc((100svh - 330px)*.8),780px)}.register{width:265px}.register-display strong{font-size:31px}.charm-card{flex-basis:100px}.charm-card img{width:72px}}@media(max-width:1000px)and (min-width:701px){.atelier{padding-right:28px;padding-left:28px;grid-template-columns:minmax(0,1fr) 190px;column-gap:24px}.site-header{padding-left:28px;padding-right:28px}.how-button{right:28px}.register{width:190px}.register-display strong{font-size:23px}.library-toolbar{gap:10px}.filters{gap:5px}.filters button{padding:9px 12px;font-size:9px}.start-fresh{font-size:9px}.jewelry-stage{width:clamp(420px,calc((100svh - 330px)*.8),600px)}}@media(max-width:700px){body{background-position:51% top;background-attachment:fixed}.site-header{justify-content:space-between;padding:10px 20px 3px}.wordmark{font-size:30px;letter-spacing:-1.2px}.wordmark span{display:none}.how-button{position:static;min-height:30px;padding:6px 12px;font-size:9px}.introduction{padding:4px 16px 8px}.introduction h1{font-size:clamp(32px,10.25vw,40px);line-height:1;margin-bottom:4px}.introduction>p{font-size:9px;line-height:1.4;letter-spacing:.2em}.atelier{display:flex;flex-direction:column;padding:0 17px;gap:0;align-items:stretch}.creation{width:100%}.base-picker{min-height:36px}.base-picker fieldset{padding:3px;gap:2px}.base-picker fieldset button{font-size:10px;padding:6px 15px;min-width:85px}.jewelry-stage{width:min(100%,max(225px,calc((100svh - 355px)*.8)));max-width:100%;margin:1px auto}.empty-bracelet-note{font-size:10px}.charm-library{display:flex;flex-direction:column;width:100%}.library-toolbar{display:contents}.filters{order:0;gap:7px;margin:0 -17px 5px;padding:2px 17px;overflow:auto}.filters button{font-size:9px;padding:7px 15px}.charm-tray{order:1;gap:4px;padding:6px 7px 7px;border-radius:17px;scrollbar-width:none}.charm-tray::-webkit-scrollbar{display:none}.charm-card{flex-basis:87px;height:102px;padding:8px 3px 4px}.charm-card img{width:58px;height:55px;margin-bottom:4px}.charm-detail{font-size:14px;gap:3px}.charm-detail>.extra-price{font-size:7px}.selection-mark{font-size:6px;top:3px;right:5px}.charm-card:hover img{transform:none}.start-fresh{min-height:30px;margin:0 auto 3px;padding:6px 13px;font-size:9px}.helper{display:none}.checkout{display:flex;width:100%;max-width:none;align-self:stretch;align-items:center;gap:0;margin:6px 0 0;overflow:hidden}.checkout-actions{order:0;text-align:center;width:100%}.box-button{display:block;min-height:44px;width:70%;max-width:280px;margin:0 auto;font-size:12px;border-radius:7px}.completion-hint{margin-top:7px;font-size:9px;min-height:0}.completion-hint.is-complete{display:none}.register{order:1;width:min(100%,360px);max-width:none;aspect-ratio:1;margin:15px auto -65px;mask-image:linear-gradient(to bottom,#000 0%,#000 59%,transparent 91%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 59%,transparent 91%)}.register-display strong{font-size:34px}.drag-ghost{width:65px;height:79px}.modal{padding:37px 25px 28px}.modal h2{font-size:37px}.finish-charms img{width:54px;height:66px;max-width:19%}.letter-bubble{top:auto;max-height:calc(100dvh - 44px);bottom:max(22px,env(safe-area-inset-bottom));width:calc(100% - 28px);border-radius:22px;padding:20px 18px 12px}.letter-dismiss{background:#2b261b24;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.letter-intro{gap:12px;margin-bottom:15px}.letter-intro>img{width:63px;height:73px}.letter-intro h2{font-size:32px}.letter-intro p:last-child{font-size:9px;max-width:180px}.letter-intro .eyebrow{font-size:7px}.letter-close{right:20px;top:17px;font-size:9px}.letter-options{display:flex;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c7b58e transparent;gap:6px;padding:4px 2px 11px;scroll-snap-type:x proximity;touch-action:pan-x}.letter-options button{flex:0 0 49px;touch-action:pan-x;scroll-snap-align:start;padding:6px 3px}.letter-options img{width:41px;height:45px}.letter-options span{font-size:10px}.letter-footer{margin-top:9px}.letter-footer>span{font-size:16px}}@media(max-width:360px){.site-header{padding-top:8px}.introduction h1{font-size:32px}.filters button{padding:7px 12px}.register-display strong{font-size:30px}.letter-intro h2{font-size:29px}.letter-intro p:last-child{max-width:160px}}@media(max-width:700px)and (max-height:740px){.site-header{padding-bottom:0}.introduction{padding-top:1px;padding-bottom:5px}.jewelry-stage{margin-top:0;margin-bottom:0}.filters{margin-bottom:3px}.checkout{margin-top:3px}}@media(min-width:701px){.site-header{height:88px;max-width:1500px;padding:14px 36px 10px}.how-button{right:36px}#main{--charm-row:clamp(112px, calc((100svh - 216px)/4) ,172px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:80px minmax(0,1fr) clamp(220px,calc((100svh - 120px)*.4),330px);grid-template-areas:"intro charms" "creation charms" "creation checkout";gap:10px 40px;height:calc(100svh - 88px);min-height:540px;max-width:1500px;margin:auto;padding:10px 36px 16px}.atelier{display:contents}.introduction{grid-area:intro;align-self:center;padding:0 0 4px}.introduction h1{font-size:clamp(38px,4.2vw,60px);margin-bottom:8px}.introduction>p{font-size:10px}.creation{grid-area:creation;min-height:0;align-self:start}.jewelry-stage{width:min(100%,calc((100svh - 292px)*.8));margin:3px auto -2px}.start-fresh{margin:0 auto}.charm-library{grid-area:charms;min-height:0;max-height:100%;height:calc(var(--charm-row)*2 + 98px);grid-template-rows:auto minmax(0,1fr) auto;align-self:start;padding-top:8px}.library-toolbar{margin-bottom:12px}.filters{gap:7px;padding:3px 1px}.filters button{font-size:11px;padding:9px 15px}.charm-tray{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:var(--charm-row);align-content:start;gap:7px;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y proximity;scroll-padding-top:9px;touch-action:pan-y}.charm-card{width:100%;height:var(--charm-row);padding:12px 3px 7px;touch-action:pan-y}.charm-card img{width:clamp(70px,calc((100svh - 180px)*.13),100px);height:clamp(64px,calc((100svh - 180px)*.12),92px);margin-bottom:7px;touch-action:pan-y}.charm-detail{font-size:17px;gap:5px}.charm-detail>.extra-price{font-size:9px}.helper{margin-top:8px}.checkout{grid-area:checkout;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center;align-self:stretch;gap:20px;margin:0;border-top:1px solid #947b512e;padding:10px 8px 0}.register{width:min(100%,calc((100svh - 120px)*.39));margin:0 auto;max-width:310px}.register-display strong{font-size:clamp(24px,2.2vw,34px)}.checkout-actions{width:100%;max-width:240px;justify-self:center}.box-button{max-width:none}.completion-hint{font-size:10px;line-height:1.6}.completion-hint.is-complete{display:none}}@media(min-width:701px)and (max-width:1100px){#main{column-gap:24px;padding-right:24px;padding-left:24px}.site-header{padding-right:24px;padding-left:24px}.how-button{right:24px}.introduction h1{font-size:clamp(32px,4vw,44px)}.base-picker fieldset button{min-width:85px;padding:8px 17px}.filters{gap:5px}.filters button{padding:9px 12px;font-size:10px}.charm-tray{grid-template-columns:repeat(3,minmax(0,1fr))}.charm-detail{font-size:15px}.charm-detail>.extra-price{font-size:8px}.checkout{gap:12px;padding-right:0;padding-left:0}.register-display strong{font-size:clamp(19px,2.4vw,26px)}.box-button{padding:13px 12px;font-size:12px}}@media(min-width:701px)and (max-width:800px){#main{column-gap:18px;padding-right:18px;padding-left:18px;grid-template-rows:80px minmax(0,1fr) 255px}.charm-tray{grid-template-columns:repeat(2,minmax(0,1fr))}.checkout{grid-template-columns:minmax(0,1fr);gap:0;padding-top:4px}.register{width:180px}.checkout-actions{max-width:220px}.completion-hint{font-size:9px;margin-top:5px}.base-picker fieldset button{min-width:78px;padding:8px 12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}