:root{--ink:#344339;--muted:#879084;--paper:#fbfaf3;--line:#dddcd0}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#e9e8df;font:13px Arial,'Noto Sans KR',sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit;background:transparent;border:1px solid #c9cec1;border-radius:4px;padding:9px 13px}button:hover{background:#dfe4d7}button:focus-visible,a:focus-visible{outline:2px solid #547852;outline-offset:3px}button:disabled{opacity:.3;cursor:default}.dark{background:#3a4c3f;color:#fff;border-color:#3a4c3f}.dark:hover{background:#51664f}header{height:76px;padding:0 5vw;border-bottom:1px solid #d0d2c6;display:flex;align-items:center;justify-content:space-between}.brand{font:italic 29px Georgia;color:var(--ink);text-decoration:none;letter-spacing:-4px;display:flex;align-items:center}.brand>span:first-child{color:#909d7e}.brand .brandname{letter-spacing:0;font:17px Georgia;margin-left:23px}.tools{display:flex;gap:9px;align-items:center}#status{font-size:10px;color:#6f8067;margin-right:12px}main{max-width:1320px;margin:auto;padding:24px 65px 0 35px}.topline{display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px;color:#7f8779;margin:0 4px 17px}.desk{position:relative;padding-right:131px;perspective:1800px}.book{display:grid;grid-template-columns:1fr 1fr;background:var(--paper);border-radius:6px 4px 4px 6px;box-shadow:0 2px 0 #dad9cb,0 5px 0 #f7f5eb,0 7px 0 #d8d6c7,0 22px 36px #33402a26;position:relative;min-height:580px;height:calc(100vh - 243px);max-height:890px}.book:after{content:'';position:absolute;left:50%;top:0;bottom:0;width:40px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#a6a49418 40%,#6e715429 50%,#b9b8a61c 58%,transparent);pointer-events:none;z-index:3}.page{padding:33px 34px 29px;position:relative;min-width:0;overflow:hidden;display:flex;flex-direction:column}.page.left{border-right:1px solid #d4d3c1}.pagehead{display:flex;justify-content:space-between;gap:12px;color:#9a9b8c;font-size:9px;letter-spacing:1.8px;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:23px}.pagenum{position:absolute;bottom:12px;left:0;right:0;text-align:center;font:11px Georgia;color:#999d8a}.pagecontent{min-height:0;flex:1;display:flex;flex-direction:column}.edittext{border:0;padding:0;text-align:left;border-radius:3px;background:none;display:block;width:100%;min-width:0}.editing .edittext:hover{background:#d7dfc12e}.edittext h2{font:normal clamp(23px,2.45vw,35px)/1.15 Georgia;margin:0 0 17px;overflow-wrap:anywhere}.edittext p{font-size:12px;line-height:1.9;white-space:pre-wrap;margin:0 0 14px;overflow-wrap:anywhere;max-height:145px;overflow:auto}.placeholder{color:#a1a28e}.cover h2{font:normal clamp(30px,3.2vw,47px)/1.1 Georgia;letter-spacing:-1.2px;margin-bottom:20px}.cover .edittext p{max-height:80px}.cover .photo-grid{flex:1;min-height:100px;margin-top:15px}.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:auto;min-height:130px;height:46%;}.photo-grid.single{grid-template-columns:1fr}.photo-slot{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;padding:0;border:0;border-radius:0;background:none}.photo-box{position:relative;width:100%;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;background:#efeee3;border:1px dashed #c8cbb8;overflow:hidden;color:#9da58f;font-size:10px}.photo-box .plus{font:27px Georgia;color:#8b9b7e}.photo-box img{height:100%;width:100%;position:absolute;inset:0;background:#efeee3}.photo-slot:before{content:'';position:absolute;top:-7px;left:35%;width:30%;height:17px;background:#d9d4b994;z-index:2;transform:rotate(-5deg)}.caption{font:italic 11px/1.4 Georgia;margin-top:10px;min-height:15px;text-align:center;color:#92967e}.photo .photo-grid{height:68%;order:-1;margin:0 0 22px}.photo .edittext h2{font-size:25px}.text .edittext{flex:1;min-height:0;display:flex;flex-direction:column}.text .edittext p{background:repeating-linear-gradient(transparent,transparent 29px,#d8ddcc 30px);line-height:30px;max-height:none;flex:1;overflow:auto}.tabs{position:absolute;right:0;top:23px;width:132px;display:flex;flex-direction:column;gap:10px}.tab{position:relative;border:0;border-radius:0 5px 5px 0;background:var(--tab);text-align:left;height:57px;padding:10px 12px 10px 17px;font-size:10px;line-height:1.4;color:#4f5948;box-shadow:2px 3px 5px #34402d0b;transition:transform .2s}.tab strong{font:11px Georgia;display:block;margin-bottom:3px}.tab.active{transform:translateX(9px);box-shadow:2px 4px 8px #34402d18}.tab.active:before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:#61765a}.bottom{display:flex;align-items:center;justify-content:space-between;margin:25px 131px 10px 0}.bottom>button{border:0;font-size:20px}.bottom>button span{font-size:11px;padding:0 8px}.pagination{text-align:center;font:11px Georgia;color:#7f8875}#dots{display:flex;justify-content:center;gap:8px;margin-top:8px}#dots button{width:6px;height:6px;min-width:6px;background:#c3c8b8;border:0;padding:0;border-radius:50%}#dots button.active{background:#536c48}.workspace-tools{display:flex;justify-content:center;gap:18px;align-items:center;margin-right:131px;color:#8e9585;font-size:10px}.workspace-tools button{border:0;font-size:10px}footer{display:flex;justify-content:space-between;padding:22px 5vw 18px;color:#929985;font-size:10px}footer>span:first-child{font:italic 13px Georgia}.book.turn-next{animation:next .38s ease}.book.turn-prev{animation:prev .38s ease}@keyframes next{0%{transform:rotateY(0)}45%{transform:rotateY(-7deg);filter:brightness(.97)}100%{transform:rotateY(0)}}@keyframes prev{45%{transform:rotateY(7deg);filter:brightness(.97)}}dialog{border:1px solid #c7ccb9;border-radius:8px;background:var(--paper);color:var(--ink);width:560px;max-width:94vw;max-height:92vh;padding:28px;box-shadow:0 25px 100px #26332344}dialog::backdrop{background:#26332366;backdrop-filter:blur(3px)}dialog h2{font:28px Georgia;margin:22px 0}.dialoghead{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:2px}.dialoghead button{border:0;font-size:24px;padding:0 5px}label{display:block;font-size:11px;color:#718164;margin:16px 0}input,textarea,select{display:block;width:100%;background:#fffef9;border:1px solid #d2d7c6;padding:11px;color:#344339;border-radius:4px;margin-top:7px}textarea{resize:vertical;line-height:1.7}.dialogactions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}#photopreview{display:block;max-width:100%;height:220px;object-fit:contain;margin:auto}#photopreview:not([src]){display:none}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#344339;color:white;padding:13px 22px;border-radius:5px;z-index:20;display:none}.readonly .workspace-tools{visibility:hidden}.readonly .edittext{cursor:default}.readonly .photo-slot{cursor:default}.readonly .photo-slot:hover{background:none}.readonly .photo-box{border-style:solid}.readonly .placeholder{opacity:.6}.empty-page{align-items:center;justify-content:center;color:#a1a690;font:italic 19px Georgia}body.loading main{opacity:.4}@media(max-width:900px){main{padding:20px 28px}.desk{padding-right:85px}.tabs{width:86px}.tab{padding:9px 8px;font-size:9px}.bottom,.workspace-tools{margin-right:85px}.page{padding:25px 22px}.brand .brandname{font-size:14px}.tools #status{display:none}.book{min-height:590px}.cover h2{font-size:33px}.workspace-tools{gap:8px}.workspace-tools>span{display:none}}@media(max-width:620px){header{height:65px;padding:0 18px}.brand .brandname{font-size:12px;margin-left:13px}.tools{gap:4px}.tools button{font-size:10px;padding:8px}.tools #restore{display:none}main{padding:18px 15px}.topline{font-size:8px;letter-spacing:1px}.desk{padding-right:46px}.tabs{width:47px;top:17px;gap:8px}.tab{height:64px;font-size:8px;padding:7px 4px;overflow:hidden}.tab strong{font-size:12px}.tab.active{transform:translateX(3px)}.book{grid-template-columns:1fr;min-height:554px;height:calc(100svh - 231px);max-height:824px}.book:after{left:4px;width:12px}.page.left{border:0}.page{padding:27px 24px}.pagehead{margin-bottom:21px}.cover h2{font-size:39px}.bottom,.workspace-tools{margin-right:46px}.bottom{margin-top:20px}.bottom>button{padding:5px}.workspace-tools{justify-content:space-between}footer{padding:15px 20px;display:block;text-align:center;line-height:1.8}footer>span{display:block}.pagecontent .edittext p{font-size:12px}#chapterlabel{max-width:135px;overflow:hidden;white-space:nowrap}dialog{padding:22px}}@media(prefers-reduced-motion:reduce){.book.turn-next,.book.turn-prev{animation:none}.tab{transition:none}}
@media(max-width:620px){.tools #restore{display:inline-block}.tools{gap:2px}.tools button{padding:7px 5px}.brand .brandname{max-width:80px}}
.book{perspective:1800px}.leaf,.stationary{position:absolute;top:0;bottom:0;width:50%;pointer-events:none}.stationary{z-index:4;background:var(--paper)}.on-left{left:0}.on-right{right:0}.leaf{z-index:6;transform-style:preserve-3d}.leaf.forward{left:50%;transform-origin:left center;animation:flipForward .78s cubic-bezier(.36,.03,.29,1) both}.leaf.backward{right:50%;transform-origin:right center;animation:flipBack .78s cubic-bezier(.36,.03,.29,1) both}.leaf>.page{position:absolute;inset:0;background-color:var(--paper);backface-visibility:hidden}.leaf>.back{transform:rotateY(180deg)}.leaf>.page:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#504d3340,transparent 70%);pointer-events:none;animation:paperShade .78s both}.leaf.backward>.page:after{background:linear-gradient(270deg,#504d3340,transparent 70%)}@keyframes flipForward{to{transform:rotateY(-180deg)}}@keyframes flipBack{to{transform:rotateY(180deg)}}@keyframes paperShade{0%,100%{opacity:0}50%{opacity:1}}@media(max-width:620px){.leaf{width:100%}.leaf.forward{left:0}.leaf.backward{right:0}.leaf>.back{visibility:hidden}.tabs{gap:6px}.tab{height:60px}}
.brand b{font:normal clamp(18px,2.5vw,27px) Georgia,serif;letter-spacing:-.6px}.tabs{gap:5px}.tab{height:54px}@media(max-width:620px){.brand .brandname{display:none}.tabs{gap:5px}.tab{height:54px}}
.family-page .edittext{flex:0 1 auto}.family-page .edittext h2{margin-bottom:8px}.family-page .edittext p{max-height:72px;flex:none;line-height:1.6;background:none}.family-page .photo-grid{display:grid;order:0;flex:1;min-height:190px;height:auto;margin:12px 0 0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1.15fr) minmax(0,1fr);gap:14px 12px}.family-page .photo-slot:nth-child(3){grid-column:1/-1;grid-row:1}.family-page .photo-slot:nth-child(-n+2){grid-row:2}.family-page .caption{margin-top:4px}
.journal:not(.family-page) .edittext {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-height: 0;
  align-items: stretch;
}
.journal:not(.family-page) .edittext p {
  flex: 1;
  min-height: 0;
  max-height: none;
  margin: 0;
  overflow: auto;
}
.journal:not(.family-page) .photo-grid {
  flex-shrink: 0;
  margin-top: 12px;
}
.scan-scroll{flex:1;min-height:0;overflow:auto;padding:0 4px 8px}.scan-title,.scan-note{border:0;text-align:left;padding:0;background:transparent}.scan-title{font:normal clamp(22px,2vw,30px)/1.15 Georgia;margin:0 0 20px}.scan-layout{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px 10px;align-items:start}.scan-note{grid-column:1/-1;line-height:1.6;font-size:13px;white-space:pre-wrap}.scan-note strong{display:table;font:600 13px/1.5 Georgia;background:linear-gradient(transparent 36%,#efe4a7 36%,#efe4a7 94%,transparent 94%);margin-bottom:7px}.scan-note span{display:block}.scan-slot{border:0;padding:0;min-width:0;background:transparent}.scan-frame{min-height:76px;aspect-ratio:1.4;display:grid;place-items:center;width:100%;background:#efeee3;border:1px dashed #c5cbb8;font-size:11px;color:#75816c;position:relative}.scan-frame img{position:absolute;width:100%;height:100%;inset:0}.scan-slot small,.column-sketch small{display:block;font:italic 10px Georgia;margin-top:4px}.gallery-two .slot-0{grid-column:1/4}.gallery-two .slot-1{grid-column:3/7;grid-row:2;margin-top:22px}.gallery-five .slot-0{grid-column:1/4}.gallery-five .slot-1{grid-column:5/7}.gallery-five .slot-2,.gallery-five .slot-3,.gallery-five .slot-4{grid-column:span 2;grid-row:2;margin-top:24px}.gallery-five .scan-frame{aspect-ratio:.8}.cultivation .note-1,.screening .note-1{grid-column:1/5;grid-row:2}.cultivation .slot-0,.screening .slot-1{grid-column:5/7;grid-row:2}.cultivation .note-2,.screening .note-2{grid-row:3}.isolation .slot-0,.screening .slot-0{grid-column:1/3;grid-row:1}.isolation .note-0,.screening .note-0{grid-column:3/7;grid-row:1}.isolation .note-1{grid-column:1/5;grid-row:2}.isolation .slot-1{grid-column:5/7;grid-row:2/4}.column-sketch{grid-column:1/5;grid-row:3;text-align:center;font:italic 12px Georgia}.column-sketch b{display:block;background:#ebe7d4;border:1px solid #c9c3ae;border-radius:0 0 50% 50%;width:64px;margin:6px auto;padding:10px 0}
.assay-row{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:12px;align-items:start;margin-bottom:17px}.assay-row .scan-note{grid-column:auto;min-width:0}.assay-row .scan-frame{aspect-ratio:1.65}.assay-row:has(>.scan-slot:only-child) .scan-frame{max-height:230px}.assay-row .scan-note span{font-variant-numeric:tabular-nums}
#experience-nav{margin:0 0 14px;display:flex;gap:10px}#experience-nav[hidden]{display:none}#experience-nav button{background:#f6f6ed;font-size:12px}

:root {
  --heading: "Cormorant Garamond", Georgia, serif;
  --body: "Proza Libre", Arial, sans-serif;
  --masthead: "Amatic SC", "Arial Narrow", sans-serif;
}
body, .tab { font-family: var(--body); }
.brand b, .brand .brandname, .edittext h2, .scan-title, .scan-note strong, dialog h2 {
  font-family: var(--heading);
  font-weight: 600;
}
.pagehead span:first-child, .topline span:first-child {
  font: 700 22px/1.12 var(--masthead);
  letter-spacing: .25px;
}
.page .edittext p, .scan-note span {
  font-family: var(--body);
}
.page.family-page .edittext .family-greeting {
  font-family: var(--heading);
  font-size: clamp(23px,2.45vw,35px);
  font-weight: 600;
  line-height: 1.15;
}
.column-sketch{margin:0;background:white;border-radius:4px;overflow:hidden}
.column-sketch img{display:block;width:100%;height:auto}

/* Let notebook photographs keep their uploaded proportions. */
.scan-frame:has(img),.assay-row .scan-frame:has(img){aspect-ratio:auto;min-height:0;max-height:none;overflow:hidden}
.scan-frame img{position:static;display:block;width:100%;height:auto;max-height:560px;object-fit:contain}
.assay-row{align-items:stretch}
.assay-row>.scan-slot{align-self:start}
.internship-feature .assay-row:has(>.scan-slot){grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px}
.internship-feature .scan-frame{aspect-ratio:3/4;min-height:240px}
.internship-feature .scan-frame:has(img){aspect-ratio:auto;min-height:0}
@media(max-width:420px){.internship-feature .assay-row:has(>.scan-slot){grid-template-columns:1fr}.internship-feature .scan-frame{min-height:260px}}

.bottom>button{background:#405641;color:#fff;border:1px solid #354936;border-radius:6px;min-height:44px;padding:8px 15px}
.bottom>button span{font-size:14px;padding:0 4px}
.bottom>button:hover:enabled{background:#304431}
.bottom>button:disabled{opacity:.45}
.assay-row:has(>.scan-slot:only-child) .scan-frame:has(img){max-height:none}
@media(max-width:620px){.bottom{gap:5px}.bottom>button{padding:6px}.pagination{min-width:0}#dots{flex-wrap:wrap;gap:5px}}

.opening-band {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 14px;
  margin:0 0 18px;
  padding:11px 0;
  border-top:3px solid var(--ink);
  border-bottom:1px solid var(--line);
}
.opening-band b {
  background:var(--accent);
  padding:4px 10px;
  font:700 23px/1.05 var(--masthead);
}
.opening-band span {font:600 10px/1.4 var(--body);letter-spacing:1.3px}
.opening-band + .scan-scroll .scan-title,
.opening-band + .pagecontent .edittext h2 {
  font:600 clamp(32px,3.25vw,48px)/1.04 var(--heading);
  letter-spacing:-.02em;
  overflow-wrap:anywhere;
  margin-bottom:20px;
}

.closing-contact .pagecontent{justify-content:center}
.closing-contact .edittext{flex:0 1 auto;border-top:1px solid var(--line);padding:22px 0}
.closing-contact .edittext h2{font-size:clamp(32px,4vw,50px)}
.closing-contact .edittext p{background:none;line-height:1.7}

#exporttext[hidden]{display:none}

/* Center the spread itself and reserve an equal gutter opposite its tabs. */
main{--gutter:140px;box-sizing:border-box;width:100%;min-height:100svh;display:grid;align-content:center;padding:42px var(--gutter);position:relative}
.desk{padding:0}
.tabs{left:100%;right:auto}
.bottom{position:absolute;top:calc(50% + min(445px,max(290px,(100vh - 243px)/2)));left:var(--gutter);right:var(--gutter);margin:15px 0 0}
#experience-nav:not([hidden]){position:absolute;bottom:calc(50% + min(445px,max(290px,(100vh - 243px)/2)));left:var(--gutter)}
@media(max-width:900px){main{--gutter:90px}}
@media(max-width:620px){main{--gutter:12px;padding-block:96px}.tabs{position:static;width:100%;flex-direction:row;overflow:auto;gap:3px}.tab{flex:1;min-width:0;height:auto}.desk{position:relative}.tabs{position:absolute;left:0;top:100%;margin-top:8px}.bottom{top:calc(50% + min(412px,max(277px,(100svh - 231px)/2)) + 48px)}}
