:root{font-family:"Microsoft JhengHei",system-ui,sans-serif;color:#352e27;background:#eee9df;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #9b573e;outline-offset:4px}a{color:inherit;text-decoration:none}header{display:flex;justify-content:space-between;align-items:center;padding:23px 4vw;border-bottom:1px solid #d8d0c3;font-size:13px}header span{font-size:11px;letter-spacing:2px}main{max-width:1600px;margin:auto;padding:36px 4vw}.eyebrow{color:#89765e;font-size:12px;letter-spacing:3px}h1{font-size:clamp(27px,3vw,44px);line-height:1.5;margin:8px 0;font-weight:600;letter-spacing:-1px}h1 em{font-style:normal;font-weight:400;color:#796b5c;margin-left:15px}.intro>p:last-child{font-size:14px;color:#776b5e}.workspace{display:grid;grid-template-columns:310px minmax(0,1fr);gap:28px;margin-top:30px}.choices{display:grid;gap:11px}.choices button{display:flex;gap:16px;align-items:center;text-align:left;padding:20px 15px;background:#f5f1ea;border:1px solid #d7cebf;border-radius:4px;color:inherit}.choices button[aria-pressed=true]{border:2px solid #795943;padding:19px 14px;background:#fffaf1}.swatch{display:block;width:38px;height:55px;border-radius:2px;flex-shrink:0;border-bottom:15px solid #6c442c;background-color:#ba856e;background-image:radial-gradient(#ffffff80 .7px,transparent 1px),radial-gradient(#322d2880 .9px,transparent 1.2px);background-size:7px 6px,9px 7px}.swatch.cream{background-color:#e4d6bd}.swatch.green{background-color:#99a58e;border-bottom-color:#997049}small,strong,b{display:block}small{color:#958371;font-size:10px;letter-spacing:2px;margin-bottom:6px}strong{font-size:16px;font-weight:600}b{font-size:11px;font-weight:400;color:#84776a;margin-top:7px}.wide{width:100%;margin-top:18px;padding:14px;background:#443b30;color:#fff8eb;border:0;border-radius:3px}.tip{font-size:12px;color:#8a7e6f;line-height:1.9}.graphic{font-size:13px;margin-top:17px;line-height:1.7}.stage{min-width:0;position:relative;background:radial-gradient(ellipse at 50% 35%,#fffdf7,#e1dace);border:1px solid #ddd4c7;border-radius:5px;overflow:hidden}.stage-label{position:absolute;top:18px;left:22px;right:22px;display:flex;justify-content:space-between;color:#897967;font-size:10px;letter-spacing:1px;z-index:1;pointer-events:none}model-viewer{width:100%;height:560px;--poster-color:transparent}#loading,#error{position:absolute;top:46%;left:10%;right:10%;text-align:center;padding:18px;background:#fffcf0e8;border-radius:6px;font-size:14px;pointer-events:none}#error{pointer-events:auto}.controls{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;padding:14px;background:#f7f3ebaa;border-top:1px solid #dcd4c9}button:not(.choices button):not(.wide){border:1px solid #d2c7b7;border-radius:4px;background:#fffaf2;color:#5e4f3f;padding:9px 13px;font-size:12px}button[aria-pressed=true]:not(.choices button){background:#6b5540;color:white}.notes{border-top:1px solid #d4cabd;margin-top:36px;padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:50px;font-size:12px;line-height:1.9;color:#8b7c6b}.notes h2{color:#5b4c3d;font-size:17px;font-weight:500;margin-top:0}.notes p{margin-top:0}footer{text-align:center;color:#948779;font-size:11px;padding:25px;border-top:1px solid #d8d0c3}.compare-head{display:flex;align-items:center;justify-content:space-between;margin-top:35px}.compare-head h2{font-size:23px;font-weight:500}#comparison>p{font-size:12px;color:#887866}.compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.compare-card{border:1px solid #d8d0c4;background:#f8f3e9;border-radius:5px;text-align:center}.compare-card h3{font-size:14px;font-weight:500;margin:18px 0 0}.compare-card model-viewer{height:330px}[hidden]{display:none!important}@media(max-width:850px){main{padding:20px 4vw}header span{display:none}h1 em{display:block;margin-left:0}h1{font-size:28px}.workspace{grid-template-columns:1fr;gap:15px;margin-top:20px}.choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.choices button{padding:12px 6px;display:block}.choices button[aria-pressed=true]{padding:11px 5px}.swatch{height:25px;width:100%;border-bottom-width:7px;margin-bottom:9px}strong{font-size:12px;line-height:1.7}small{font-size:9px}b{display:none}.wide{margin-top:10px}.tip{display:none}model-viewer{height:430px}.stage-label{left:12px;right:12px;font-size:9px}.controls{gap:5px;padding:10px}.notes{grid-template-columns:1fr;gap:10px;margin-top:24px}.compare-grid{grid-template-columns:1fr}.compare-card model-viewer{height:350px}}
