:root{--ink:#23362f;--muted:#748078;--paper:#fbfaf5;--line:#dce2d9;--accent:#326b56;--gold:#d9bc79}*{box-sizing:border-box}body{margin:0;font-family:"Apple SD Gothic Neo","Malgun Gothic",sans-serif;background:var(--paper);color:var(--ink)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,input{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bc9651;outline-offset:4px}img{display:block;max-width:100%}.book-header{min-height:66px;padding:14px clamp(20px,4vw,64px);display:flex;gap:20px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:4}.book-brand{font-size:11px;font-weight:700;letter-spacing:.13em}.book-header nav{display:flex;gap:7px;flex-wrap:wrap}.book-header nav a{padding:8px 12px;border:1px solid var(--line);border-radius:30px;font-size:11px}.book-header nav a[aria-current=page]{background:var(--ink);color:white;border-color:var(--ink)}main{max-width:1440px;margin:auto;padding:54px clamp(20px,4vw,64px) 80px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.18em;color:var(--accent);text-transform:uppercase}h1{font-size:clamp(30px,4vw,54px);line-height:1.2;letter-spacing:-.06em;font-weight:600;margin:16px 0}p{color:var(--muted);font-size:14px;line-height:1.85;word-break:keep-all}.hero{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:70px;align-items:center;padding:18px 0 58px;border-bottom:1px solid var(--line)}.hero .cover{width:245px;aspect-ratio:1;object-fit:cover;box-shadow:0 18px 45px #29453620;transform:rotate(3deg);border-radius:5px}.hero p{max-width:620px}.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.tags span{font-size:11px;border:1px solid var(--line);border-radius:30px;padding:7px 12px}.section-head{display:flex;justify-content:space-between;align-items:end;margin:40px 0 22px}.section-head h2{font-size:24px;letter-spacing:-.04em;margin:8px 0 0}.count{font-size:12px;color:var(--muted)}.lesson-card{display:grid;grid-template-columns:1.4fr 1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:white;transition:transform .2s,box-shadow .2s}.lesson-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px #243b3210}.card-art{display:grid;place-items:center;position:relative;background:#e9ede3;min-height:280px;padding:25px}.card-art img{width:100%;aspect-ratio:2.975;object-fit:contain;box-shadow:0 12px 22px #243b321c}.lesson-number{position:absolute;top:20px;left:20px;display:grid;place-items:center;width:49px;height:49px;background:var(--ink);color:white;border-radius:50%;font:600 19px Georgia,serif}.card-copy{padding:36px}.card-copy h3{font-size:29px;letter-spacing:-.055em;margin:12px 0}.card-copy p{font-size:12px}.enter{display:inline-flex;align-items:center;gap:40px;padding:12px 17px;background:var(--accent);color:white;border-radius:7px;margin-top:14px;font-size:12px}.note{font-size:11px;margin-top:22px}.gallery-intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}.gallery-intro h1{font-size:clamp(28px,3vw,43px)}.gallery-intro p{max-width:700px;font-size:13px}.small-link{font-size:12px;border-bottom:1px solid var(--ink);padding:6px 0;white-space:nowrap}.observation{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:#edf1e9;border:1px solid var(--line);border-radius:10px;padding:18px 22px;margin-bottom:28px;font-size:12px;color:#5c6d62;line-height:1.7}.observation strong{display:block;color:var(--ink);margin-bottom:4px;font-size:12px}.filterbar{display:flex;align-items:center;gap:8px;margin-bottom:22px}.filterbar button,.modal-tools button{background:white;border:1px solid var(--line);padding:9px 15px;border-radius:30px;font-size:11px;color:var(--ink)}button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.filterbar .count{margin-left:auto}.image-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}.image-card{padding:0;border:1px solid var(--line);border-radius:10px;background:white;color:var(--ink);overflow:hidden;text-align:left;transition:box-shadow .15s,transform .15s}.image-card:hover{transform:translateY(-3px);box-shadow:0 10px 22px #243b3215}.image-card img{width:100%;aspect-ratio:1;object-fit:contain;background:white}.image-card span{display:block;padding:13px 12px;font-size:12px;line-height:1.5}.image-card small{display:block;color:var(--muted);font-size:9px;letter-spacing:.08em;margin-bottom:6px}.image-grid.results{grid-template-columns:repeat(2,minmax(0,1fr))}.results .image-card img{aspect-ratio:2.975;object-fit:contain;background:#f0efe9}.results .image-card span{display:flex;justify-content:space-between;align-items:center;font-size:11px}.results .image-card small{margin:0}.book-footer{display:flex;justify-content:space-between;gap:14px;margin-top:40px;padding-top:22px;border-top:1px solid var(--line);font-size:12px}.error{color:#a33c32;font-size:12px}.viewer-dialog{border:0;border-radius:15px;padding:0;width:min(1180px,95vw);height:min(850px,93dvh);max-height:93dvh;background:var(--paper);color:var(--ink);overflow:hidden;box-shadow:0 30px 100px #0006}.viewer-dialog::backdrop{background:#15231be0;backdrop-filter:blur(6px)}.dialog-layout{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.dialog-head{display:flex;align-items:center;gap:15px;padding:17px 22px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:16px;flex:1;margin:0}.dialog-head button{border:1px solid var(--line);background:white;width:32px;height:32px;border-radius:50%;font-size:18px}.dialog-stage{display:flex;align-items:center;justify-content:center;overflow:auto;background:#e6e9e0;padding:18px}.dialog-stage img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;flex:none;transform-origin:center;box-shadow:0 5px 22px #1b362115}.dialog-stage.zoomed{display:block}.dialog-stage.zoomed img{margin:auto;max-width:none;max-height:none}.dialog-bottom{padding:15px 22px}.modal-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.modal-tools label{font-size:11px;display:flex;align-items:center;gap:8px}.modal-tools input{width:100px;accent-color:var(--accent)}.modal-tools .save{background:var(--accent);color:white;border-color:var(--accent);margin-left:auto}.modal-tools button:disabled{opacity:.5;cursor:wait}.dialog-bottom p{font-size:11px;line-height:1.4;margin:9px 0 0;min-height:16px}.mode-copy{border:0;color:var(--muted);font-size:10px}.gallery-status{min-height:18px}.screen-only-warning{font-size:11px;color:#758077}@media(max-width:1000px){.image-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{gap:30px;grid-template-columns:1fr 190px}.hero .cover{width:190px}.card-copy{padding:25px}.book-header{padding:12px 20px}}@media(max-width:650px){.book-header{flex-direction:column;align-items:flex-start;gap:12px;position:static}.book-header nav{gap:5px}.book-header nav a{font-size:10px;padding:7px 10px}main{padding-top:30px}.hero{grid-template-columns:1fr;padding-bottom:30px;gap:25px}.hero .cover{width:135px;grid-row:1;transform:rotate(-3deg)}.lesson-card{grid-template-columns:1fr}.card-art{min-height:210px;padding:22px 15px}.card-copy h3{font-size:25px}.gallery-intro{display:block}.gallery-intro .small-link{display:inline-block;margin-top:8px}.observation{grid-template-columns:1fr;padding:16px;gap:12px}.image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.image-grid.results{grid-template-columns:1fr}.image-card span{font-size:11px;padding:10px}.filterbar button{font-size:10px;padding:8px 10px}.filterbar .count{font-size:10px}.viewer-dialog{height:91dvh;width:96vw;max-width:96vw}.dialog-head{padding:13px;gap:8px}.dialog-head h2{font-size:12px}.dialog-head button{flex:none;width:30px;height:30px}.dialog-stage{padding:10px}.dialog-bottom{padding:13px}.modal-tools{gap:6px}.modal-tools button{font-size:10px;padding:8px 10px}.modal-tools input{width:80px}.modal-tools .save{margin-left:0}.book-footer{font-size:11px}}
.image-card img{height:auto}
.result-filterbar{flex-wrap:wrap}.result-filterbar .count{margin-left:auto}
@media(min-width:768px){html:has(#gnavSidebar.open) body.creative-course-index{margin-right:150px;transition:margin-right .35s}}