/* A browsable paper album, sharing the existing studio instead of a second editor. */
.creation-modes{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.creation-modes button{border:1px solid #ccb99e;background:transparent;color:#795b43;padding:11px 20px;font:inherit;cursor:pointer;min-height:44px}.creation-modes button[aria-pressed=true]{background:#873a2d;color:#fff6e4;border-color:#873a2d}.creation-modes button span{font:12px Georgia,serif;margin-left:12px;opacity:.7}.creation-modes button:disabled{opacity:.4}
#motif-library{padding:28px 32px 20px;border:1px solid #ddcdb3;background:#fbf6ea;box-shadow:0 14px 45px -35px #5b351d}
.motif-library-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9c5a5;padding-bottom:25px;gap:20px}.motif-library-heading span{font-size:12px;color:#9d795b;letter-spacing:.22em}.motif-library-heading h2{font:38px/1.6 "Yijian Brush",KaiTi,serif;margin:12px 0 5px;color:#733b2b}.motif-library-heading p{font-size:14px;color:#8b745e;margin:0}.motif-book-seal{font:26px/1.1 KaiTi,serif;color:#9e4430;border:1px solid #ab6147;outline:1px solid #c89c7e;outline-offset:4px;padding:10px 7px;margin-right:12px;transform:rotate(-4deg)}
.motif-library-tools{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:24px 0 4px}#motif-categories{display:flex;gap:6px;flex-wrap:wrap}#motif-categories button{border:0;background:transparent;border-bottom:2px solid transparent;color:#8b7259;padding:10px 12px;min-height:44px;font:14px inherit;cursor:pointer}#motif-categories button[aria-pressed=true]{color:#8d3628;border-bottom-color:#8d3628}.motif-library-tools input{border:1px solid #dac7ab;border-radius:25px;background:#fffaf1;padding:11px 17px;max-width:100%;font-size:14px;color:#6a4734}#motif-library-status{font-size:12px;color:#977959;min-height:18px;margin:14px 0}
#motif-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 18px}.motif-card{display:block;min-width:0;padding:0;border:0;background:transparent;text-align:left;cursor:pointer;color:#684331}.motif-card-paper{position:relative;aspect-ratio:1;background:#f1e7d3;border:1px solid #ddc8a7;box-shadow:3px 5px 0 #d9c5a53b,inset 0 0 30px #fff8e86b;overflow:hidden}.motif-card:nth-child(3n+2) .motif-card-paper{background:#efe0c9}.motif-card:nth-child(3n) .motif-card-paper{background:#f5edde}.motif-art{padding:12%;width:100%;height:100%;filter:drop-shadow(1px 3px 1px #67271823)}.motif-art svg{display:block;width:100%;height:100%;overflow:visible;transition:transform .3s ease}.motif-card:hover svg{transform:translateY(-3px) rotate(-2deg)}.motif-card:focus-visible{outline:2px solid #9e4a33;outline-offset:5px}.motif-index{position:absolute;left:8px;top:6px;font:11px Georgia,serif;color:#aa8c6c}.motif-caption{padding:12px 3px 3px;display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}.motif-caption h3{font:23px "Yijian Brush",KaiTi,serif;margin:0}.motif-caption span{font-size:10px;color:#9b7e64}.motif-provenance{margin-top:28px;padding-top:18px;border-top:1px solid #ddccb1;font-size:12px;color:#92765b;line-height:1.9}.motif-provenance summary{cursor:pointer}
#motif-dialog{border:1px solid #cbb699;padding:0;background:#fcf6e9;color:#6d4531;width:min(850px,94vw);max-width:none;max-height:90dvh;overflow:auto;box-shadow:0 25px 90px #34211555}#motif-dialog::backdrop{background:#2e211999;backdrop-filter:blur(4px)}#motif-close{position:sticky;top:10px;float:right;z-index:2;margin:10px 12px -55px 0;border:1px solid #d2bfa2;background:#fffaef;border-radius:24px;padding:10px 18px;min-height:44px;cursor:pointer;color:#76523c}.motif-detail-layout{display:grid;grid-template-columns:1fr 1fr}#motif-detail-art{background:#eee0c6;display:flex;align-items:center;min-width:0}#motif-detail-art .motif-art{aspect-ratio:1;height:auto;padding:12%}.motif-detail-copy{padding:60px 30px 35px;min-width:0}.motif-detail-copy>span{font-size:12px;color:#a17b58}.motif-detail-copy h2{font:44px "Yijian Brush",KaiTi,serif;margin:20px 0}.motif-detail-copy p{font-size:14px;line-height:1.9}.motif-detail-copy #motif-tip{border-left:2px solid #bc9671;padding-left:14px;color:#8c684a}.motif-detail-copy #motif-fold-note{font-size:12px;color:#9f8569}.motif-detail-copy .button{margin:10px 0 15px;width:100%}.motif-detail-copy details{font-size:12px;line-height:1.8;color:#957255}.motif-detail-copy details p{font-size:12px}.motif-detail-copy summary{cursor:pointer}.motif-detail-copy a{color:#923d2a}
#motif-current{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border:1px solid #d6c3a7;border-bottom:0;background:#efe3cd;color:#79563c}#motif-current span{font-size:12px;margin-right:15px;color:#a28464}#motif-current strong{font:25px "Yijian Brush",KaiTi,serif}#motif-current button{border:0;background:transparent;border-bottom:1px solid #af8a64;color:#885334;font:13px inherit;padding:8px;cursor:pointer;min-height:44px}
.task-entry{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:22px;margin-bottom:22px;border:1px solid #d7c2a6;background:#faf2e3}.task-entry h2{font:25px KaiTi,serif;margin:0 0 8px}.task-entry p{font-size:13px;color:#8d6d53;margin:0}.task-entry button{white-space:nowrap}.saved-work details{margin:12px 0;font-size:13px}.saved-work pre{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:1200px){#motif-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){#motif-library{padding:22px 16px}.motif-library-heading h2{font-size:29px}.motif-library-heading p{font-size:12px}.motif-book-seal{display:none}#motif-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 12px}.motif-caption h3{font-size:22px}.motif-caption span{font-size:10px}.motif-library-tools input{width:100%;font-size:16px}.motif-library-tools label{width:100%}#motif-categories{gap:0}#motif-categories button{padding:8px 10px;font-size:13px}.motif-detail-layout{display:block}#motif-detail-art .motif-art{max-width:300px;margin:auto;padding:22px}.motif-detail-copy{padding:22px}.motif-detail-copy h2{font-size:34px;margin:10px 0}.creation-modes button{font-size:14px;padding:10px 14px}.task-entry{align-items:flex-start;flex-direction:column}}
@media(max-width:420px){#motif-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.motif-art{padding:9%}}
@media(prefers-reduced-motion:no-preference){#motif-dialog[open]{animation:motif-open .25s ease-out}@keyframes motif-open{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}
@media(prefers-reduced-motion:reduce){.motif-art svg{transition:none}}
