:root{font-family:Tahoma,Arial,sans-serif;color:#173c33;background:#f6f6f0;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,label.upload{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid #dbe1d9;background:#fff;border-radius:11px;padding:11px 16px;color:#25483e;transition:.18s}button:hover{background:#edf4ef}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #c99c50;outline-offset:3px}header{max-width:1440px;margin:auto;padding:23px 40px;border-bottom:1px solid #dce2d9;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:12px;text-decoration:none;color:inherit;font-size:21px;font-weight:700}.logo{font-size:36px;color:#b38b4e}small{display:block;font-weight:400}.brand small{font-size:11px;letter-spacing:.4px;margin-top:6px;color:#69786c}.private{font-size:12px;color:#6a7c70}main{max-width:1440px;margin:0 auto;padding:32px 40px;display:grid;grid-template-columns:minmax(0,1.85fr) minmax(300px,1fr);gap:32px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.eyebrow{font-size:11px;letter-spacing:1px;color:#8b784f}h1{font-size:38px;margin:12px 0}p{line-height:1.8;margin:0;color:#6a786f}.intro p{font-size:13px}.step{font-family:Georgia,serif;font-size:24px;color:#a79e8d;direction:ltr}.stage{position:relative;aspect-ratio:4/3;border-radius:24px;background:radial-gradient(ellipse at 45% 30%,#2e5d50,#102c25);overflow:hidden;isolation:isolate;box-shadow:0 18px 45px #173c3314}#view{display:block;width:100%;height:100%;object-fit:contain;touch-action:manipulation}.stage-top,.stage-bottom{position:absolute;left:20px;right:20px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#fff;font-size:11px;pointer-events:none}.stage-top{top:20px}.stage-top span{padding:9px 12px;background:#061f1aa8;border:1px solid #ffffff20;border-radius:30px}.stage-bottom{bottom:18px}.stage-bottom button{pointer-events:auto;color:#fff;background:#ffffff1c;border-color:#ffffff30}.welcome{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:white;padding:55px 20px}.welcome h2{font-size:23px;margin:12px 0}.welcome p{font-size:13px;color:#cad9cd}.hand-art{font-size:65px;filter:grayscale(1);opacity:.55}.primary{background:#dbc18c;color:#16392e;border:0;font-weight:700;min-width:200px}.primary:hover{background:#e9d4a6}.welcome .primary{margin-top:22px}.text-button{background:transparent;border:0;color:#d0dcd4;font-size:12px;margin-top:8px}.camera-tools{display:flex;gap:8px;margin-top:15px;flex-wrap:wrap}.camera-tools button{font-size:12px;background:transparent}.note{font-size:11px;margin-top:16px;max-width:620px}.panel{background:#fff;border:1px solid #e3e7df;border-radius:19px;padding:22px;margin-bottom:16px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}h2{font-size:16px;margin:0}.section-heading span{font-size:11px;color:#899287}.catalog{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.ring-card{padding:5px 3px 8px;border:1px solid #e8ece5;border-radius:11px;min-width:0;font-size:11px}.ring-card img{width:100%;aspect-ratio:1;object-fit:contain;display:block}.ring-card.active{border-color:#265b46;background:#f1f6f0;box-shadow:0 0 0 1px #265b46}.upload{display:block;text-align:center;padding:13px;border:1px dashed #b5c6b9;border-radius:12px;margin-top:16px;cursor:pointer;font-size:12px}.micro{font-size:10px;margin-top:8px;text-align:center}.fingers{display:flex;gap:6px;flex-wrap:wrap}.fingers button{flex:1;padding:10px 6px;font-size:11px}.fingers button.active{background:#174937;color:#fff;border-color:#174937}details{border-top:1px solid #edf0ea;margin-top:20px;padding-top:16px}summary{cursor:pointer;font-size:12px;list-style:none;display:flex;justify-content:space-between}.range{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:12px;margin:20px 0}input[type=range]{width:55%;accent-color:#235e46}select{background:#f6f8f3;border:1px solid #dae3d8;border-radius:7px;padding:5px}.tip{display:flex;gap:14px;padding:5px 12px}.tip>span{color:#bfa16a;font-size:30px}.tip p{font-size:13px;color:#335444}.tip small{font-size:11px;color:#7b897e}.hidden{display:none!important}dialog{border:0;border-radius:22px;padding:24px;width:min(440px,94vw);color:#173c33}dialog::backdrop{background:#08251cba;backdrop-filter:blur(5px)}dialog p{font-size:12px;margin:12px 0}dialog .primary{width:100%}.close{float:left;padding:3px 10px;font-size:23px;border:0}#crop{width:100%;background:#e9eee6;border-radius:15px;touch-action:none;cursor:move}#status.error{background:#723b2b}.stage.demo .tag{background:#806833}footer{font-size:11px} @media(min-width:1200px){aside{padding-top:8px}.catalog{gap:10px}.ring-card{font-size:12px}}@media(max-width:850px){header{padding:17px 18px}.private{font-size:0}.private:first-letter{font-size:15px}main{padding:22px 16px;grid-template-columns:1fr;gap:22px}h1{font-size:30px}.intro{margin-bottom:18px}.stage{aspect-ratio:3/4;max-height:70vh}.panel{padding:18px}.catalog{grid-template-columns:repeat(5,1fr)}.ring-card img{max-height:83px}.stage-top,.stage-bottom{left:12px;right:12px}.stage-top{top:12px}.stage-bottom{bottom:12px}#hint{max-width:55%;line-height:1.6}.hand-art{font-size:58px}.welcome h2{font-size:22px}.step{font-size:20px}.brand{font-size:18px}.camera-tools button{flex:1;padding:10px 7px;font-size:11px}.note{font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.ring-card{padding:8px 8px 14px}.ring-card img{aspect-ratio:5/6;object-fit:cover;border-radius:8px;max-height:none}.ring-card span{display:block;margin-top:11px;font-size:14px}.ring-card small{font-size:9px;margin-top:6px;color:#7b887d}.upload{color:#254e3d;text-decoration:none}.stage-top #status{max-width:65%;line-height:1.5}@media(max-width:850px){.ring-card img{max-height:210px;object-fit:contain;background:#182024}.catalog{grid-template-columns:1fr 1fr}}
