.workshop-layout{grid-template-columns:minmax(0,1.04fr) minmax(0,1fr)}
.workshop-art{background:#dbddbc;justify-content:center;padding:28px 24px 20px;isolation:isolate;min-height:660px}
.workshop-art:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 83px,#87906b12 84px 86px);z-index:-1;transform:rotate(-3deg) scale(1.2)}
.workshop-art-caption{font:italic 17px/1.6 Georgia,serif;transform:rotate(-3deg);color:#6d7e59;text-align:center;margin:4px 0 14px;position:relative;z-index:1}
.workshop-live-cloth{width:100%;max-width:470px;transform:rotate(-2deg);filter:drop-shadow(4px 8px 3px #68744f20);position:relative;z-index:1}
.workshop-cloth-svg{width:100%;height:auto;display:block}
.workshop-table-art{width:100%;max-width:470px;position:relative;z-index:1;margin-top:-4px}
.workshop-art-note{font:italic 13px/1.65 Georgia,serif;color:#6e7e59;text-align:center;margin:0 10px;position:relative;z-index:1}
.workshop-copy{padding:32px 30px 24px;min-width:0}
.workshop-copy .chapter{margin-bottom:13px}
.workshop-copy h2{font-size:37px;margin-bottom:14px}
.workshop-copy .workshop-intro{font-size:12px;line-height:1.7;margin:0 0 20px}
.workshop-fieldset{border:0;margin:0 0 16px;padding:0;min-width:0}
.workshop-fieldset legend{font-size:10px;font-weight:bold;letter-spacing:.35px;margin:0 0 9px;padding:0;color:#748264}
.workshop-motifs{display:flex;gap:8px}
.workshop-motif{flex:1;min-width:0;border:1px solid #c8b58d;border-radius:3px;background:#ead7af;padding:4px 3px 9px;box-shadow:0 3px 0 #b79e724d;min-height:74px;transition:background .15s,transform .15s}
.workshop-motif svg{width:43px;height:43px;max-width:100%;display:block;margin:auto}
.workshop-motif span{font:11px Georgia,serif;display:block}
.workshop-motif:hover{background:#f1deb3;transform:translateY(-2px)}
.workshop-motif[aria-pressed=true]{background:#fbefcf;border:2px solid var(--orange);padding:3px 2px 8px;box-shadow:0 3px 0 #b9573233}
.workshop-colors{display:flex;gap:9px;flex-wrap:wrap}
.workshop-color{border:1px solid transparent;background:none;padding:6px 7px;display:flex;align-items:center;gap:7px;min-height:44px;border-radius:3px;font-size:11px}
.workshop-color[aria-pressed=true]{border-color:#acb798;background:#e9ecd9}
.workshop-swatch{width:21px;height:21px;border-radius:50%;box-shadow:inset 0 0 0 3px #fff8df77;display:block;flex-shrink:0}
.workshop-swatch-red{background:#b04e38}.workshop-swatch-green{background:#416447}.workshop-swatch-ochre{background:#af7d2e}
.workshop-cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:10px 12px;background:#f0e8cd;border:1px solid #d7c9a6;position:relative}
.workshop-cells:before,.workshop-cells:after{content:'';position:absolute;left:4px;right:4px;border-top:1px dashed #c6b78e;pointer-events:none}.workshop-cells:before{top:4px}.workshop-cells:after{bottom:4px}
.workshop-cell{min-height:59px;background:#fbf6e6;border:1px dashed #bdbba0;padding:3px;position:relative;border-radius:2px;display:flex;align-items:center;justify-content:center}
.workshop-cell-art{display:block;width:49px;height:49px}
.workshop-cell-art svg{width:100%;height:100%}
.workshop-empty-mark{font:25px/49px Georgia,serif;color:#c4c3a5}
.workshop-cell-number{font-size:8px;position:absolute;left:4px;top:4px;color:#8d967c}
.workshop-cell-filled{border-style:solid;border-color:#d6c4a0;background:#fff9e9}
.workshop-cell:hover{background:#eee5c7;border-color:#b48e55}
.workshop-cell-erase:hover{background:#f1d9c8;border-color:#b95732}
.workshop-tools{display:flex;gap:1px 14px;flex-wrap:wrap;margin-top:-5px}
.workshop-tool{border:0;background:none;font-size:10px;min-height:44px;padding:8px 0;text-decoration:underline;text-decoration-color:#a8b291;text-underline-offset:4px;color:#6b7c5a}
.workshop-tool span{font-size:14px}
.workshop-tool:disabled{opacity:.4;text-decoration:none}
.workshop-tool[aria-pressed=true]{color:var(--orange);font-weight:bold;text-decoration-color:var(--orange)}
.workshop-progress{font-size:11px;line-height:1.7;margin:9px 0 0;color:#657650}
.workshop-feedback{font-size:11px;line-height:1.65;color:#9b5b35;min-height:36px;margin:7px 0 12px}
.workshop-actions{display:flex;align-items:center;gap:17px;flex-wrap:wrap}
.workshop-actions .primary{font-size:12px;min-height:48px;padding:12px 17px;gap:14px}
.workshop-actions .hint-button{min-height:44px}
.workshop-hint{font-size:11px;line-height:1.75;background:#ece9cf;border-left:2px solid var(--ochre);padding:9px 12px;margin-top:13px;color:#697758}
.workshop-hint p{margin:4px 0 9px}.workshop-hint p:last-child{margin-bottom:3px}
.workshop-copy .source-note{margin-top:17px;font-size:9px}
.workshop-book-art{width:100%;background:#dfe2c5;padding:7px 7px 12px;overflow:hidden}
.workshop-book-art .workshop-cloth-svg{max-height:240px;transform:rotate(-2deg)}
.workshop-book-art p{font:italic 12px/1.5 Georgia,serif!important;text-align:center;margin:2px 3px 0!important;color:#687957!important}
@media(max-width:760px){.workshop-layout{grid-template-columns:1fr}.workshop-art{min-height:0;padding:25px 28px 17px}.workshop-art-caption{font-size:15px;margin-bottom:3px}.workshop-live-cloth{max-width:350px}.workshop-table-art{max-width:350px;max-height:58px;margin-top:-10px}.workshop-art-note{font-size:11px}.workshop-copy{padding:29px 27px 25px}.workshop-copy h2{font-size:35px}.workshop-copy h2 br{display:none}.workshop-copy .workshop-intro{font-size:12px}.workshop-cell{min-height:66px}.workshop-cell-art{width:54px;height:54px}.workshop-progress{font-size:11px}.workshop-motif{min-height:77px}.workshop-motif svg{height:47px;width:47px}.workshop-book-art .workshop-cloth-svg{max-height:220px}}
@media(max-width:420px){.workshop-art{padding:23px 18px 17px}.workshop-live-cloth{max-width:310px}.workshop-copy{padding:25px 21px}.workshop-copy h2{font-size:32px}.workshop-motifs{gap:6px}.workshop-motif span{font-size:10px}.workshop-colors{gap:3px;justify-content:space-between}.workshop-color{font-size:10px;gap:5px;padding:6px 4px}.workshop-tools{column-gap:12px}.workshop-tool{font-size:10px}.workshop-actions{gap:10px}.workshop-actions .primary{flex:1;padding:12px;font-size:11px}.workshop-actions .hint-button{font-size:10px}.workshop-art-caption{font-size:13px}.workshop-book-art{padding:4px}}
@media(prefers-reduced-motion:reduce){.workshop-motif{transition:none}}
