.qcm-page{color:#2b241e;background:#e8deca;min-height:100dvh}.qcm-hero{border-bottom:1px solid #a99c89;align-items:end;gap:4vw;padding:54px max(4vw,24px) 64px;grid-template-columns:minmax(130px,2fr) minmax(580px,8fr) minmax(170px,2fr)!important;display:grid!important}.qcm-hero>a{color:#a94d35;letter-spacing:.1em;text-transform:uppercase;align-self:start;font:800 8px Arial,sans-serif;text-decoration:none}.qcm-hero>div>small{color:#a94d35;letter-spacing:.16em;font:800 8px Arial,sans-serif}.qcm-hero h1{letter-spacing:-.06em;text-wrap:balance;max-width:920px;margin:27px 0 22px;font:400 clamp(48px,5.7vw,90px)/.88 Georgia,serif}.qcm-hero p{color:#675d50;max-width:760px;margin:0;font:17px/1.65 Georgia,serif}.qcm-hero>nav{border:1px solid #a99c89;justify-content:flex-end;display:flex!important}.qcm-hero>nav button{color:#655b4e;cursor:pointer;background:0 0;border:0;border-right:1px solid #a99c89;min-width:52px;height:48px;font:800 9px Arial,sans-serif}.qcm-hero>nav button:last-child{border-right:0}.qcm-hero>nav button.active{color:#f1e7d5;background:#a94d35}.qcm-studio{grid-template-columns:minmax(330px,4fr) minmax(560px,8fr);align-items:start;gap:4vw;padding:54px max(3vw,24px) 90px;display:grid}.qcm-controls{border-top:4px solid #315e50}.qcm-step{border-bottom:1px solid #a99c89;padding:28px 0 34px}.qcm-step>small{color:#a94d35;letter-spacing:.14em;margin-bottom:24px;font:800 8px Arial,sans-serif;display:block}.qcm-step>label{color:#665c4f;letter-spacing:.05em;grid-template-columns:110px 1fr auto;align-items:center;gap:12px;margin-top:14px;font:700 10px Arial,sans-serif;display:grid}.qcm-step select{color:#2b241e;background:#eee6d4;border:1px solid #9f927f;border-radius:0;width:100%;height:48px;padding:0 13px;font:15px Georgia,serif}.qcm-step input[type=range]{accent-color:#315e50;width:100%}.qcm-step output{color:#315e50;min-width:38px;font:700 11px Arial,sans-serif}.qcm-backgrounds{grid-template-columns:1fr 1fr;gap:8px;display:grid}.qcm-backgrounds button{color:#2b241e;cursor:pointer;text-align:left;background:0 0;border:1px solid #a99c89;grid-template-columns:68px 1fr;align-items:center;gap:12px;min-height:92px;padding:8px;display:grid}.qcm-backgrounds img,.qcm-backgrounds i{object-fit:cover;background:linear-gradient(145deg,#315e50,#15271f);width:68px;height:74px;display:block}.qcm-backgrounds span{font:15px/1.2 Georgia,serif}.qcm-backgrounds button.active{color:#f2e8d6;background:#315e50;border-color:#315e50}.qcm-formats{border:1px solid #a99c89;grid-template-columns:repeat(3,1fr);display:grid}.qcm-formats button{color:#574e43;cursor:pointer;background:0 0;border:0;border-right:1px solid #a99c89;height:46px;font:700 9px Arial,sans-serif}.qcm-formats button:last-child{border-right:0}.qcm-formats button.active{color:#f2e8d6;background:#a94d35}.qcm-toggles{grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;display:grid}.qcm-toggles label{color:#51493f;align-items:center;gap:10px;min-height:42px;font:13px Georgia,serif;display:flex}.qcm-toggles input{accent-color:#315e50;width:17px;height:17px}.qcm-preview{position:sticky;top:120px}.qcm-preview>div{background:#211b16;border-top:4px solid #c69d40;justify-content:center;align-items:center;min-height:560px;padding:34px;display:flex}.qcm-preview canvas{width:auto;max-width:100%;height:auto;max-height:72vh;display:block;box-shadow:0 25px 70px #1e161057}.qcm-preview>div>p{color:#d4c7b2;font:16px Georgia,serif}.qcm-preview footer{background:#eee6d4;border:1px solid #a99c89;border-top:0;grid-template-columns:1fr auto auto;align-items:center;gap:10px;min-height:86px;padding:16px 18px;display:grid}.qcm-preview footer span{color:#716658;max-width:480px;font:12px/1.45 Georgia,serif}.qcm-preview footer button{color:#332b24;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;background:0 0;border:1px solid #8f8270;min-height:46px;padding:0 17px;font:800 8px Arial,sans-serif}.qcm-preview footer button.primary{color:#f2e8d6;background:#a94d35;border-color:#a94d35}.qcm-preview footer button:disabled{opacity:.4;cursor:not-allowed}:is(.qcm-preview footer button:hover:not(:disabled),.qcm-preview footer button:focus-visible:not(:disabled)){outline-offset:2px;outline:2px solid #c69d40}.qcm-preview footer button:active:not(:disabled){transform:translateY(1px)}@media (max-width:1050px){.qcm-hero{grid-template-columns:140px 1fr!important}.qcm-hero>nav{grid-column:2;justify-self:start}.qcm-studio{grid-template-columns:340px minmax(0,1fr);gap:24px}.qcm-preview>div{padding:22px}.qcm-preview footer{grid-template-columns:1fr 1fr}.qcm-preview footer span{grid-column:1/3}}@media (max-width:780px){.qcm-hero{padding:42px 18px 50px;display:block!important}.qcm-hero>div{margin-top:42px}.qcm-hero h1{font-size:clamp(46px,14vw,65px)}.qcm-hero>nav{width:max-content;margin-top:28px}.qcm-studio{padding:38px 18px 72px;display:block}.qcm-preview{margin-top:42px;position:relative;top:auto}.qcm-preview>div{min-height:0;padding:14px}.qcm-preview canvas{max-height:none}.qcm-preview footer{grid-template-columns:1fr 1fr;display:grid}.qcm-preview footer span{grid-column:1/3}.qcm-backgrounds{grid-template-columns:1fr 1fr}.qcm-step>label{grid-template-columns:1fr}.qcm-step output{grid-column:1}}@media (max-width:460px){.qcm-backgrounds,.qcm-preview footer{grid-template-columns:1fr}.qcm-preview footer span{grid-column:1}.qcm-formats{grid-template-columns:1fr}.qcm-formats button{border-bottom:1px solid #a99c89;border-right:0}.qcm-formats button:last-child{border-bottom:0}}.qcm-preview footer>span{max-width:480px}.qcm-social{background:#e2d7c2;border-top:1px solid #a99c89;grid-column:1/4;margin:9px -18px -16px;padding:16px 18px 18px}.qcm-social>small{color:#756a5c;letter-spacing:.13em;text-transform:uppercase;margin-bottom:10px;font:800 7px Arial,sans-serif;display:block}.qcm-social>nav{flex-wrap:wrap;gap:7px;display:flex}.qcm-social>nav button{background:#eee6d473;border-color:#9f927f;min-height:39px;padding:0 13px}.qcm-social>nav button:first-child{color:#f2e8d6;background:#211b16;border-color:#211b16;min-width:42px}@media (max-width:1050px){.qcm-social{grid-column:1/3}}@media (max-width:460px){.qcm-social{grid-column:1}}.qcm-toggles input{width:24px;min-width:24px;height:24px}.qcm-step input[type=range]{height:24px}.qcm-step input[type=range]::-webkit-slider-thumb{width:24px;height:24px}.qcm-step input[type=range]::-moz-range-thumb{width:24px;height:24px}.qcm-step>small,.qcm-hero>div>small,.qcm-social>small{font-size:12px}.qcm-align{border:1px solid #a99c89;grid-template-columns:repeat(3,1fr);margin-top:12px;display:grid}.qcm-align button{color:#574e43;cursor:pointer;text-transform:uppercase;background:0 0;border:0;border-right:1px solid #a99c89;min-height:46px;font:700 9px Arial,sans-serif}.qcm-align button:last-child{border-right:0}.qcm-align button.active{color:#f2e8d6;background:#315e50}.qcm-align button:focus-visible{outline-offset:2px;outline:2px solid #c69d40}.qcm-toggles label{cursor:pointer}.qcm-toggles label:has(input:focus-visible){outline-offset:3px;outline:2px solid #315e50}