:root{--ink:#1f2c39;--ink2:#304250;--paper:#eee9df;--offwhite:#FBF6ED;--lime:#E8C077;--orange:#D99858;--muted:#aeb4b3;--line:#5c7280;--rail:248px;--mono:'IBM Plex Mono',Consolas,monospace;--sans:'Noto Sans KR',Arial,sans-serif;--display:'Archivo Black','Arial Black',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--offwhite);font-family:var(--sans);min-height:100vh}button,input{font:inherit}button{cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:4px}::selection{background:var(--lime);color:var(--ink)}.skip-link{position:absolute;left:10px;top:-80px;background:var(--lime);color:var(--ink);padding:12px;z-index:100}.skip-link:focus{top:10px}
.scan-noise{pointer-events:none;position:fixed;inset:0;z-index:10;opacity:.13;background-image:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(247,251,226,.04) 4px);mix-blend-mode:screen}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.topline{height:43px;background:#E8C077;color:#283744;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 23px;font:700 10px var(--mono);letter-spacing:.045em;border-bottom:2px solid #253441}.topline>span{white-space:nowrap}.topline strong{border:1px solid;padding:2px 5px;margin-left:5px}.topline-plus{font-size:20px;margin-left:15px;vertical-align:middle}.live-dot{width:7px;height:7px;border-radius:50%;background:#D99858;display:inline-block;vertical-align:middle;margin-right:6px;box-shadow:0 0 0 3px rgba(251,119,83,.13)}.workspace{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);flex:1;min-height:0}.left-rail{background:#2c3c4a;border-right:1px solid #667a86;padding:25px 17px 17px;display:flex;flex-direction:column;min-height:calc(100dvh - 78px)}.rail-logo{text-decoration:none;display:flex;align-items:flex-end;gap:12px;margin:0 8px 22px}.rail-logo>span{font-family:var(--display);font-size:64px;line-height:.9;letter-spacing:-.08em}.logo-period{color:var(--lime)}.rail-logo small{font:600 9px/1.6 var(--mono);letter-spacing:.11em;color:#e2ddd2;padding-bottom:4px}.rail-divider{height:1px;background:#667a86;margin-bottom:23px}.rail-label,.microtext{font:600 10px var(--mono);letter-spacing:.13em;color:#bcbfbb}.rail-label{padding:0 10px;margin-bottom:12px}.file-nav{display:flex;flex-direction:column;gap:5px}.file-nav-item{width:100%;border:1px solid transparent;background:transparent;color:#e0dbcf;display:flex;align-items:center;text-align:left;gap:12px;padding:13px 8px 13px 10px;transition:background .2s,color .2s,border-color .2s}.file-nav-item:hover{border-color:#829298;background:#3f5361}.file-nav-item.active{background:var(--lime);color:#23303e;border-color:var(--lime);transform:translateX(3px)}.nav-index{font:600 11px var(--mono);align-self:flex-start;margin-top:3px}.nav-main{font-size:14px;font-weight:800;flex:1;line-height:1.2}.nav-main small{display:block;font:500 9px var(--mono);letter-spacing:.05em;margin-top:7px;opacity:.72}.nav-arrow{font:700 18px var(--mono);align-self:flex-start}.rail-lower{margin-top:auto;padding:35px 10px 5px;display:flex;flex-direction:column;gap:16px;color:#c5c6c0}.rail-lower span{font:500 9px var(--mono);letter-spacing:.08em}.rail-lower p{font:700 10px/1.8 var(--mono);letter-spacing:.01em;color:#f8f3ea}.striped-line{height:16px;width:140px;background:repeating-linear-gradient(90deg,#E8C077 0,#E8C077 4px,transparent 4px,transparent 8px);transform:skew(-20deg)}.main-stage{min-width:0;overflow-x:hidden;background:#1f2c39}.stage-view{padding:22px clamp(22px,3.8vw,64px) 45px;max-width:1680px;margin:0 auto;animation:appear .33s ease-out}.stage-view[hidden]{display:none!important}@keyframes appear{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.stage-topline{height:26px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#cdccc4;font:600 10px var(--mono);letter-spacing:.06em;border-bottom:1px solid #4e6372;padding-bottom:14px}.record-state{color:#e9e4d9;white-space:nowrap}.tiny-square{width:7px;height:7px;background:var(--lime);display:inline-block;margin-right:8px}.cover-scene{position:relative;isolation:isolate;overflow:hidden;margin-top:24px;min-height:593px;background:#324553;border:1px solid #7a8a93}.cover-grid,.bond-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,rgba(226,238,187,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(226,238,187,.07) 1px,transparent 1px);background-size:43px 43px;opacity:.7;z-index:-1}.cover-scene:before{content:'';position:absolute;top:-230px;right:-110px;width:700px;height:700px;background:radial-gradient(circle,rgba(237,246,105,.13),transparent 70%);z-index:-1}.cover-scene:after{content:'';position:absolute;right:-15%;bottom:-48%;width:80%;height:75%;border:1px solid rgba(219,237,143,.17);border-radius:50%;pointer-events:none;z-index:-1}.cover-top-mark{position:absolute;top:19px;left:25px;right:25px;display:flex;justify-content:space-between;gap:15px;font:600 10px var(--mono);color:#d4d2c8}.cover-top-mark span:nth-child(2){letter-spacing:.16em}.cover-top-mark span:last-child{font-size:26px}.cover-tiny-label{position:absolute;left:37px;top:115px;z-index:3;font:600 10px/1.8 var(--mono);letter-spacing:.07em;color:#f8f3e9}.wordmark{position:absolute;z-index:2;top:177px;left:20px;margin:0;font:clamp(85px,10.5vw,178px)/.84 var(--display);letter-spacing:-.09em;color:var(--lime);pointer-events:none}.wordmark>span{display:block}.wordmark>span:last-child{padding-left:35px}.accent-dot{color:var(--orange)}.cover-image{position:absolute;top:69px;left:43%;width:29%;height:465px;margin:0;background:#FBF6ED;border:11px solid #FBF6ED;box-shadow:14px 16px 0 #1e2b37;transform:rotate(5deg);z-index:1;overflow:hidden}.cover-image img{width:100%;height:93%;display:block;object-fit:contain;object-position:center top;filter:contrast(1.05) grayscale(.05)}.cover-image figcaption{height:7%;display:flex;align-items:center;justify-content:center;font:600 8px var(--mono);color:#253442;letter-spacing:.05em;white-space:nowrap}.cover-stamp{position:absolute;right:35px;top:116px;width:150px;height:150px;border:3px solid #D99858;color:#D99858;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;font:800 22px/.98 var(--mono);transform:rotate(15deg);letter-spacing:.06em;opacity:.9}.cover-stamp:before{content:'';position:absolute;inset:6px;border:1px dashed currentColor;border-radius:50%}.cover-statement{position:absolute;z-index:2;bottom:75px;right:35px;width:260px}.cover-statement strong{display:block;font-size:clamp(22px,2.35vw,35px);line-height:1.34;letter-spacing:-.07em;margin:12px 0 10px;font-weight:900}.orange{color:var(--orange)}.cover-statement p{font-size:12px;line-height:1.8;color:#cecdc5;margin:0}.cover-bottom-line{position:absolute;bottom:0;left:0;right:0;height:46px;background:var(--lime);color:#202d3a;display:flex;justify-content:space-between;align-items:center;padding:0 24px;font:700 11px var(--mono);z-index:3}.cover-pulse{font-size:24px}.cover-actions{display:grid;grid-template-columns:1fr 1fr;border:1px solid #7a8a93;margin-top:14px}.cover-actions button{min-height:68px;border:none;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:0 24px;font:800 13px var(--sans);transition:background .2s,color .2s}.cover-actions button span:last-child{font:700 23px var(--mono)}.action-primary{background:var(--orange);color:#212f3c}.action-primary:hover{background:#D99858}.action-secondary{background:#314351;color:#FBF6ED}.action-secondary:hover{background:#495e6c}.under-cover{display:flex;justify-content:space-between;gap:15px;margin-top:12px;color:#a0a9aa;font:500 9px var(--mono);letter-spacing:.06em}.statusbar{height:35px;background:#19242f;border-top:1px solid #667a86;padding:0 20px;color:#cccbc4;display:flex;align-items:center;justify-content:space-between;font:500 9px var(--mono);letter-spacing:.03em}.statusbar-slash{margin:0 6px;color:var(--orange)}
/* VIEWS */
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:36px 0 29px}.heading-index{font:700 11px var(--mono);color:var(--lime)}.section-heading h2{margin:8px 0 0;font:900 clamp(40px,5.3vw,74px)/1.15 var(--sans);letter-spacing:-.09em}.heading-meta{font:600 10px var(--mono);color:#a6aeae;letter-spacing:.04em;margin-bottom:6px;text-align:right}.person-tabs{display:flex;gap:0;border:1px solid #b8bbb9;max-width:800px}.person-tab{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 19px;border:0;border-right:1px solid #b8bbb9;color:#d4d1c8;background:#2c3d4b;text-align:left;transition:background .2s}.person-tab:last-child{border-right:0}.person-tab span:first-child{font:600 10px var(--mono)}.person-tab strong{font:clamp(19px,2.3vw,30px) var(--display);letter-spacing:-.04em}.person-tab span:last-child{font:700 20px var(--mono)}.person-tab.is-current{background:var(--lime);color:var(--ink)}.person-tab:hover:not(.is-current){background:#4a5f6e}.person-dossier{display:grid;grid-template-columns:minmax(235px,.9fr) minmax(0,1.55fr);border:1px solid #b4b9b6;margin-top:18px;min-height:520px;background:var(--paper);color:var(--ink)}.person-visual{background:#dbd6cb;position:relative;display:flex;align-items:center;justify-content:center;padding:30px;min-height:520px;border-right:2px solid #253441;overflow:hidden}.person-visual:after{content:'+';position:absolute;bottom:25px;right:25px;font:900 80px var(--mono);color:#c1c3be}.person-visual img{width:auto;max-width:85%;height:auto;max-height:400px;object-fit:contain;mix-blend-mode:multiply;position:relative;z-index:1;filter:contrast(1.08)}.photo-corner{position:absolute;font:700 25px var(--mono);color:#71838d}.photo-corner.tl{top:15px;left:20px}.photo-corner.br{bottom:15px;right:20px}.photo-bar{position:absolute;bottom:26px;left:24px;font:700 10px var(--mono);letter-spacing:.05em}.person-sheet{padding:27px clamp(22px,3.4vw,54px) 32px}.file-ribbon{display:flex;justify-content:space-between;gap:12px;border-bottom:2px solid #263442;padding-bottom:11px;font:700 10px var(--mono)}.person-sheet h3{font:clamp(40px,4.8vw,68px) var(--display);letter-spacing:-.07em;margin:20px 0 8px;display:flex;align-items:end;gap:16px;flex-wrap:wrap}.person-sheet h3 small{font:700 20px var(--sans);letter-spacing:-.03em;margin-bottom:4px}.person-intro{font:600 14px/1.8 var(--sans);color:#586e7c;margin:8px 0 19px;max-width:620px}.fact-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;border:1px solid #c4c5c0;margin:20px 0 22px;align-items:center}.fact-row>*{padding:12px 8px;text-align:center;border-right:1px solid #c4c5c0}.fact-row>*:last-child{border-right:0}.fact-row span{font:700 10px var(--mono);color:#687b87}.fact-row b{font-size:13px}.sheet-heading{display:flex;align-items:center;gap:14px;font:800 10px var(--mono);margin:21px 0 13px;letter-spacing:.04em}.sheet-heading:after{content:'';height:1px;flex:1;background:#c6c6c1}.keyword-line{display:flex;flex-wrap:wrap;gap:7px}.keyword-line span{border:1px solid #263542;background:#e9e4d9;padding:7px 11px;font-size:12px;font-weight:700}.person-notes{padding-left:19px;font-size:13px;line-height:1.8;max-width:610px}.person-notes li+li{margin-top:5px}.person-sheet blockquote{margin:10px 0 0;padding:12px 15px;background:#e2ddd1;border-left:6px solid #2d3f4d;font-size:15px;font-weight:800}.archive-smallprint{color:#bdbfbc;font:500 11px/1.8 var(--sans);margin-top:18px}
/* BOND */
.bond-diagram{background:#eee9df;color:#24323f;min-height:550px;position:relative;overflow:hidden;border:1px solid #c3c4bf}.bond-grid{background-image:linear-gradient(90deg,rgba(30,50,28,.1) 1px,transparent 1px),linear-gradient(rgba(30,50,28,.1) 1px,transparent 1px);opacity:1;z-index:0}.bond-type{position:relative;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #293846;padding:17px 23px;font:700 10px var(--mono);gap:20px}.bond-type strong{font:30px var(--display)}.bond-left,.bond-right{position:absolute;top:120px;width:33%;z-index:2}.bond-left{left:5%}.bond-right{right:5%;text-align:right}.bond-unit{font:700 11px var(--mono);color:#7c8c94}.bond-left strong,.bond-right strong{display:block;font-weight:900;font-size:clamp(27px,3.5vw,47px);line-height:1.22;letter-spacing:-.09em;margin:16px 0 10px}.bond-left small,.bond-right small{font-size:11px}.diagram-graphic{position:absolute;width:52%;left:24%;top:210px;max-height:240px;color:#243240;z-index:1}.bond-label{position:absolute;bottom:45px;left:24px;right:24px;font-size:clamp(19px,3.1vw,42px);font-weight:900;letter-spacing:-.08em;border-top:2px solid #293946;padding-top:16px}.bond-bottom{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:17px}.bond-bottom>div{padding:18px 19px;background:#344755;border-left:4px solid var(--lime)}.bond-bottom>div:nth-child(2){border-color:var(--orange)}.box-eyebrow{color:var(--lime);font:600 10px var(--mono)}.bond-bottom>div:nth-child(2) .box-eyebrow{color:var(--orange)}.bond-bottom p{margin:10px 0 0;line-height:1.8;font-size:13px;color:#e1dcd0}
/* STORIES */
.story-tools{display:flex;align-items:center;gap:14px;justify-content:space-between;margin-bottom:18px}.story-search{display:flex;align-items:center;flex:1;max-width:620px;background:#ece7dc;border:1px solid #c5c6c0;color:#304250;padding:0 12px}.story-search span{font:700 10px var(--mono);white-space:nowrap}.story-search input{background:transparent;border:0;outline:0;min-width:0;flex:1;padding:17px 12px;font-size:13px}.story-tools>span{font:600 10px var(--mono);color:#d4d2c8}.story-workspace{display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.5fr);min-height:570px;border:1px solid #9da7a9}.story-list{background:#354857;border-right:1px solid #9da7a9;min-height:570px}.story-list-empty{padding:30px 21px;color:#c5c6c0;font-size:13px;line-height:1.8}.story-list-empty:before{content:'[ NO INDEX ]';display:block;color:var(--lime);font:700 11px var(--mono);margin-bottom:15px}.story-list-button{width:100%;background:none;border:0;border-bottom:1px solid #607482;color:#f8f3ea;padding:18px 19px;text-align:left;display:flex;flex-direction:column;gap:7px}.story-list-button:hover,.story-list-button.active{background:var(--lime);color:#253340}.story-list-button strong{font-size:14px}.story-list-button small{font:500 10px var(--mono);opacity:.8}.story-reader{background:#f5f0e6;color:#253441;padding:clamp(27px,4.5vw,65px);min-height:570px}.reader-kicker{font:700 11px var(--mono);color:#7f8f96;letter-spacing:.05em}.story-reader h3{font-size:clamp(28px,3.1vw,46px);font-weight:900;letter-spacing:-.08em;line-height:1.4;margin:22px 0}.story-reader p{font-size:14px;line-height:2;max-width:630px;color:#566c7a;white-space:pre-wrap;word-break:keep-all}.external-record{display:inline-flex;background:#2d3e4c;color:var(--lime);text-decoration:none;padding:16px 21px;font:700 12px var(--sans);margin-top:22px}.external-record:hover{background:#4d6270}.reader-meta{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 25px}.reader-meta span{border:1px solid #acb2b2;padding:4px 8px;font:600 10px var(--mono)}.reader-nav{border-top:2px solid #a4acad;display:flex;justify-content:space-between;gap:10px;padding-top:14px;margin-top:35px}.reader-nav button{border:1px solid #3b4f5d;background:transparent;padding:11px;color:#2d3f4d;font:700 11px var(--mono)}.reader-nav button:disabled{opacity:.4;cursor:not-allowed}
/* ART */
.gallery-columns{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:15px;align-items:stretch}.art-file{position:relative;min-width:0;background:#dfdace;border:1px solid #9ea8aa;cursor:zoom-in;text-align:left;color:#283845;padding:0;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}.art-file:hover{transform:translateY(-6px);box-shadow:6px 6px 0 var(--orange)}.art-file-main{background:#f6f1e7}.art-topline{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:2px solid #384c5a;font:700 10px var(--mono)}.art-file>img{width:100%;height:430px;object-fit:contain;object-position:center center;padding:17px;mix-blend-mode:multiply}.art-caption{margin-top:auto;border-top:2px solid #384c5a;padding:15px;display:flex;flex-direction:column;gap:9px}.art-caption strong{font:clamp(17px,1.7vw,26px) var(--display)}.art-caption small{font-size:11px;color:#7d8d95}.lightbox{border:2px solid var(--lime);background:#2b3c4a;color:#f9f4eb;max-width:min(90vw,850px);max-height:91vh;padding:22px;box-shadow:0 0 0 100vmax rgba(0,0,0,.82)}.lightbox::backdrop{background:rgba(0,0,0,.81)}.lightbox img{display:block;max-width:100%;max-height:70vh;object-fit:contain;margin:auto;background:#FBF6ED}.lightbox p{margin:12px 40px 0 0;font-size:12px}.lightbox-close{position:absolute;top:3px;right:8px;border:0;background:none;color:var(--lime);font-size:34px}
@media(min-width:1700px){.cover-scene{min-height:650px}.wordmark{font-size:170px;top:198px}.cover-image{left:43%;height:510px;top:60px;width:27%}.cover-statement{right:7%;bottom:75px}}@media(max-width:1280px){:root{--rail:215px}.left-rail{padding:20px 10px 13px}.wordmark{font-size:clamp(78px,9.7vw,140px);left:12px}.cover-image{left:43%;width:30%}.cover-stamp{width:110px;height:110px;font-size:16px;right:20px;top:101px}.cover-statement{right:20px;width:230px}.cover-tiny-label{left:20px}.file-nav-item{gap:8px}.rail-logo>span{font-size:52px}}
@media(max-width:960px){:root{--rail:0px}.workspace{display:block}.left-rail{min-height:0;padding:12px 16px 0;border-bottom:1px solid #8b999e;border-right:0;display:block}.rail-logo{display:inline-flex;margin:0 0 12px}.rail-logo>span{font-size:37px}.rail-logo small{font-size:8px}.rail-divider,.rail-label,.rail-lower{display:none}.file-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding-bottom:10px}.file-nav-item{min-width:0;width:auto;flex:1;padding:10px 7px;justify-content:center;gap:7px}.file-nav-item.active{transform:none}.nav-index{font-size:10px;margin-top:0}.nav-main{font-size:12px;flex:0 0 auto}.nav-main small{font-size:8px;margin-top:5px}.nav-arrow{display:none}.topline{height:36px}.topline-motto{display:none}.stage-view{padding:18px 24px 35px}.cover-scene{min-height:590px}.wordmark{font-size:clamp(93px,14vw,145px)}.cover-image{left:47%;width:30%}.cover-statement{bottom:75px}.statusbar{height:32px}}
@media(max-width:650px){.topline{padding:0 10px;gap:5px;font-size:8px}.topline-plus{display:none}.stage-view{padding:12px 12px 25px}.stage-topline{font-size:8px}.stage-topline .record-state{font-size:8px}.cover-scene{min-height:834px;margin-top:14px}.cover-top-mark{left:15px;right:15px;font-size:8px;top:13px}.cover-tiny-label{top:63px;left:15px;font-size:8px}.wordmark{top:130px;left:10px;font-size:clamp(78px,19vw,129px);line-height:.91}.wordmark>span:last-child{padding-left:3px}.cover-image{top:248px;left:21%;width:56%;height:362px;transform:rotate(-5deg);border-width:7px;box-shadow:9px 10px 0 #1c2835}.cover-image figcaption{font-size:6px}.cover-stamp{top:75px;right:18px;width:82px;height:82px;font-size:12px;border-width:2px}.cover-statement{left:19px;right:19px;bottom:82px;width:auto;min-width:0;border-top:1px solid #7c8c94;padding-top:11px}.cover-statement strong{font-size:clamp(24px,6.4vw,34px);line-height:1.22;margin:5px 0}.cover-statement p{font-size:10px;line-height:1.6}.cover-statement .microtext{font-size:8px}.cover-bottom-line{height:44px;padding:0 10px;font-size:8px}.cover-actions{display:flex;flex-direction:column}.cover-actions button{min-height:56px;padding:0 15px;font-size:12px}.under-cover{flex-wrap:wrap;font-size:8px;gap:7px}.under-cover span:last-child{display:none}.section-heading{margin:25px 0 20px}.section-heading h2{font-size:39px}.heading-meta{display:none}.person-tabs{flex-direction:column}.person-tab{border-right:0;border-bottom:1px solid #b8bbb9}.person-tab:last-child{border-bottom:0}.person-tab strong{font-size:25px}.person-dossier{grid-template-columns:1fr}.person-visual{min-height:300px;padding:20px;border-right:0;border-bottom:2px solid #253441}.person-visual img{max-height:255px;max-width:75%}.person-sheet{padding:20px}.person-sheet h3{font-size:44px}.person-sheet h3 small{font-size:17px}.fact-row{grid-template-columns:1fr 1fr}.fact-row>*:nth-child(2){border-right:0}.fact-row>*:nth-child(-n+2){border-bottom:1px solid #c4c5c0}.bond-diagram{min-height:610px}.bond-type{flex-wrap:wrap;font-size:9px}.bond-type strong{font-size:23px}.bond-type span:last-child{display:none}.bond-left,.bond-right{width:43%;top:115px}.bond-left{left:4%}.bond-right{right:4%}.bond-left strong,.bond-right strong{font-size:27px}.bond-left small,.bond-right small{font-size:10px;line-height:1.6;display:block}.diagram-graphic{width:90%;left:5%;top:265px}.bond-label{bottom:25px;font-size:24px}.bond-bottom{grid-template-columns:1fr}.story-tools{align-items:stretch;flex-direction:column}.story-tools>span{align-self:flex-end}.story-workspace{grid-template-columns:1fr}.story-list{min-height:140px;border-right:0;border-bottom:1px solid #9da7a9}.story-reader{min-height:380px;padding:24px}.gallery-columns{grid-template-columns:1fr 1fr;gap:9px}.art-file-main{grid-column:1/-1}.art-file>img{height:250px}.art-file-main>img{height:320px}.art-caption{padding:10px}.art-caption strong{font-size:15px}.art-caption small{font-size:10px}.statusbar{padding:0 8px;font-size:8px}.statusbar>span:last-child{display:none}}
@media(max-width:370px){.file-nav-item{min-width:0}.cover-scene{min-height:810px}.wordmark{font-size:74px}.cover-image{width:60%;left:17%;height:328px;top:250px}.cover-statement{left:15px;right:15px;width:auto}.cover-stamp{right:10px}.person-sheet h3{font-size:38px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}


/* =============================================================
   FIELD DESK v4 | TYPE DEPTH SYSTEM
   Keep Blue × Amber palette and the original layout untouched.
   Shadows belong to headings and labels; body text stays sharp.
   ============================================================= */
:root {
  --depth-base: rgba(8, 16, 27, .5);
  --depth-haze: rgba(10, 20, 30, .24);
}

/* 1. COVER WORDMARK — layered ink/amber relief + cast shadow */
.wordmark {
  text-shadow:
    0 1px 0 #E1B76B,
    0 2px 0 #D0A45D,
    0 3px 0 #B98B48,
    0 4px 0 #916C3E,
    1px 5px 0 #694F37,
    3px 8px 0 rgba(12, 22, 34, .36),
    8px 14px 22px rgba(4, 12, 22, .56);
}
.wordmark .accent-dot {
  text-shadow:
    0 1px 0 #BE7547,
    0 2px 0 #A8643D,
    0 3px 0 #895236,
    2px 6px 0 rgba(10, 18, 28, .3),
    6px 10px 15px rgba(6, 13, 23, .42);
}

/* 2. HEADLINES — editorial type with subtle letterpress weight */
.section-heading h2 {
  text-shadow:
    0 1px 0 #607481,
    0 2px 0 #394F5E,
    3px 5px 10px rgba(2, 12, 23, .42);
}
.section-heading h2 .orange {
  text-shadow:
    0 1px 0 #B7794E,
    0 2px 0 #8B5B41,
    3px 5px 10px rgba(2, 12, 23, .32);
}
.cover-statement strong {
  text-shadow:
    0 2px 0 rgba(13, 25, 34, .94),
    2px 4px 8px rgba(4, 13, 23, .52);
}
.cover-statement strong .orange {
  text-shadow:1px 2px 0 #835136, 3px 5px 9px rgba(5, 14, 26, .4);
}

/* 3. PERSONNEL PAGES — shadow changes with the document surface */
.person-sheet h3 {
  text-shadow:
    1px 1px 0 #CBD0CE,
    2px 2px 0 #ABB6B6,
    3px 4px 7px rgba(27, 44, 54, .2);
}
.person-sheet h3 small { text-shadow:none; }
.person-tab:not(.is-current) strong {
  text-shadow:0 2px 1px rgba(6, 17, 27, .38);
}
.person-tab.is-current strong {
  text-shadow:1px 1px 0 rgba(255, 248, 218, .36);
}

/* 4. RELATIONSHIP DIAGRAM — etched type on pale document */
.bond-left strong, .bond-right strong, .bond-label {
  text-shadow:
    1px 1px 0 #FFFFFF,
    2px 2px 0 #C4CBC9,
    3px 4px 7px rgba(23, 43, 56, .19);
}

/* 5. ARCHIVE/ART — light typographic depth, not body-text blur */
.story-reader h3, .art-caption strong {
  text-shadow:1px 1px 0 #FDF9F0, 2px 3px 5px rgba(28, 48, 58, .17);
}
.rail-logo>span {
  text-shadow:2px 3px 0 rgba(13, 24, 34, .72), 4px 6px 10px rgba(4, 12, 22, .38);
}
.rail-logo .logo-period {
  text-shadow:1px 2px 0 #A47C45, 3px 5px 8px rgba(4, 12, 22, .3);
}
.file-nav-item:not(.active) .nav-main {
  text-shadow:0 1px 3px rgba(5, 15, 25, .32);
}
.file-nav-item.active .nav-main {
  text-shadow:1px 1px 0 rgba(255, 250, 225, .3);
}

/* Responsive title: preserve readable relief without muddy edges. */
@media (max-width:650px) {
  .wordmark {
    text-shadow:
      0 1px 0 #D0A45D,
      0 2px 0 #B98B48,
      0 3px 0 #916C3E,
      3px 5px 0 rgba(12, 22, 34, .33),
      5px 9px 15px rgba(4, 12, 22, .55);
  }
  .wordmark .accent-dot {
    text-shadow:0 1px 0 #B56E43, 0 2px 0 #895236, 3px 5px 8px rgba(6,13,23,.4);
  }
  .section-heading h2 {text-shadow:0 1px 0 #394F5E, 2px 3px 6px rgba(2,12,23,.4)}
  .bond-left strong, .bond-right strong, .bond-label {
    text-shadow:1px 1px 0 #FFF, 2px 3px 4px rgba(23,43,56,.16);
  }
}


/* ============================================================
   FIELD DESK v5 / FILE TAB + DOSSIER OBJECT DESIGN
   Blue x Amber palette, v4 relief type, and page logic preserved.
   ============================================================ */
:root { --sheet-shadow: 9px 11px 0 rgba(5, 15, 25, .36); }

/* File drawer: layers rather than a flat list of links */
.left-rail { position: relative; box-shadow: inset -9px 0 14px rgba(4,12,22,.16); }
.rail-dir-head { display:flex; justify-content:space-between; align-items:center; padding:0 8px; margin-bottom:11px; gap:8px; }
.rail-dir-head .rail-label { padding:0; margin:0; }
.rail-count {color:#DCC18D; font:700 9px var(--mono); letter-spacing:.08em; white-space:nowrap;}
.file-nav { gap:9px; margin-right:-17px; padding-right:15px; }
.file-nav-item {position:relative; border:1px solid #607686; border-left:3px solid #718694; background:#324655; min-height:62px; padding:12px 10px 11px 14px; box-shadow:3px 4px 0 rgba(9,20,30,.52),inset 0 1px 0 rgba(255,255,255,.07); transform:translate(0,0); transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease; }
.file-nav-item:before {content:'';position:absolute;top:-5px;left:12px;width:62px;height:5px;background:#526979;border:1px solid #718694;border-bottom:0;border-radius:3px 3px 0 0;}
.file-nav-item:after{content:'';position:absolute;top:10px;right:11px;width:5px;height:5px;border:1px solid rgba(230,229,217,.5);border-radius:50%; opacity:.6;}
.file-nav-item:hover:not(.active) {background:#425968;transform:translate(-2px,-2px);box-shadow:5px 6px 0 rgba(8,18,28,.62);border-color:#8ea4ac;}
.file-nav-item.active {border:1px solid #F2D28C;border-left:5px solid #D99858; color:#1F2C39;background:#E8C077; transform:translate(6px,-1px); box-shadow:5px 6px 0 #101D29, inset 0 2px 0 rgba(255,255,255,.55), inset 0 -2px 0 rgba(153,97,45,.24); }
.file-nav-item.active:before{background:#E8C077;border-color:#F2D28C; width:80px; }
.file-nav-item.active:after{border-color:#745F3C; opacity:.55;}
.nav-index { background:rgba(9,19,29,.18);padding:4px 5px;margin-top:1px;min-width:29px;text-align:center;}
.file-nav-item.active .nav-index {background:rgba(49,55,57,.15);}
.nav-main {font-size:14px;letter-spacing:-.03em;}
.nav-main small {letter-spacing:.085em;}
.nav-arrow {font-size:16px;margin-right:8px;}
.rail-current {margin:22px 3px 0;padding:11px 10px;border:1px dashed #8BA2A6;background:rgba(17,32,43,.56);display:flex;align-items:center;gap:10px;min-height:59px;box-shadow:inset 0 2px 6px rgba(0,0,0,.16);}
.rail-current-marker {width:8px;height:8px;flex:0 0 auto;background:#E8C077;box-shadow:0 0 0 3px rgba(232,192,119,.14);}
.rail-current>div {min-width:0;flex:1;display:flex;flex-direction:column;gap:4px;}
.rail-current small {font:600 8px var(--mono);color:#B5C4C5;letter-spacing:.1em;}
.rail-current strong {font:700 11px var(--mono);color:#F4E7C9;letter-spacing:.04em;overflow-wrap:anywhere;}
.rail-current-arrow {font-size:18px;color:#D99858;}

/* Folder tab labels match the physical file idea. */
.person-tabs {max-width:none;border:0;gap:10px;align-items:end;padding:8px 7px 0;}
.person-tab {position:relative;min-height:78px;border:1px solid #8599A1!important;border-bottom:3px solid #647B87!important;padding:14px 21px; background:#334B5C;box-shadow:5px 5px 0 rgba(4,14,23,.45);transform:translateY(0);transition:background .2s,transform .2s,box-shadow .2s; }
.person-tab:before {content:'';position:absolute;width:70px;height:7px;background:#476072;border:1px solid #8599A1;border-bottom:0;left:16px;top:-7px;border-radius:5px 5px 0 0;}
.person-tab.is-current {background:#E8C077;color:#1F2C39;border-color:#F3D49C!important;border-bottom-color:#B98D4B!important;transform:translateY(-3px);box-shadow:6px 8px 0 rgba(3,13,23,.55), inset 0 2px 0 rgba(255,252,237,.6);}
.person-tab.is-current:before {background:#E8C077;border-color:#F3D49C;}
.person-tab:not(.is-current):hover {background:#486272;transform:translateY(-3px);}
.person-tab span:first-child {letter-spacing:.06em;}
.person-tab strong {font-size:clamp(18px,2.5vw,33px);}

/* A physical dossier: portrait plate, punched paper, annotations. */
.person-dossier {position:relative;margin-top:17px;border:1px solid #A8B3B4;box-shadow:var(--sheet-shadow);grid-template-columns:minmax(250px,.92fr) minmax(0,1.55fr);}
.person-dossier:before {content:'';position:absolute;left:12px;right:-7px;bottom:-8px;height:8px;background:#A6B4BC;z-index:-1;}
.person-visual {background:linear-gradient(155deg,#C9D2D4 0%,#E5DFD3 62%,#D0D5D5 100%);isolation:isolate;min-height:560px;}
.person-visual:before {content:'';position:absolute;inset:0;opacity:.45;pointer-events:none;background-image:repeating-linear-gradient(0deg,transparent 0, transparent 25px,rgba(71,95,111,.12) 26px),repeating-linear-gradient(90deg,transparent 0,transparent 25px,rgba(71,95,111,.12) 26px);}
.person-dossier[data-active-person="hwayang"] .person-visual {background:linear-gradient(150deg,#F4D8AD 0%,#E7DDD0 70%,#EAD1BB 100%);}
.portrait-shelf {position:absolute;top:25px;left:24px;z-index:2;color:#2C4755;font:700 11px var(--mono);letter-spacing:.08em;}
.portrait-mat {width:min(82%,330px);height:370px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;padding:17px;border:2px solid #71828B;background:rgba(255,255,255,.22);box-shadow:7px 9px 0 rgba(37,53,64,.16),inset 0 0 0 5px rgba(251,247,235,.65);}
.person-dossier[data-active-person="hwayang"] .portrait-mat {border-color:#B88B61;box-shadow:7px 9px 0 rgba(121,74,38,.15),inset 0 0 0 5px rgba(251,247,235,.65);}
.person-visual img {max-width:100%;max-height:100%;filter:drop-shadow(7px 10px 5px rgba(31,44,54,.18));mix-blend-mode:multiply;}
.person-visual:after {font-size:64px;opacity:.35;}
.photo-hash {position:absolute;bottom:57px;right:24px;font:800 12px var(--mono);letter-spacing:.13em;color:#7A8D95;}
.person-sheet {position:relative;background:linear-gradient(90deg,#DEDCD4 0,#F2EDE3 20px,#EEE9DF 21px);padding-left:clamp(30px,4vw,63px);overflow:hidden;}
.person-sheet:before {content:'';position:absolute;top:0;bottom:0;left:19px;border-left:1px solid rgba(98,119,127,.35);}
.sheet-punches {position:absolute;top:80px;left:7px;bottom:60px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none;}
.sheet-punches i {width:13px;height:13px;background:#263946;border-radius:50%;box-shadow:inset 2px 2px 3px rgba(0,0,0,.48),1px 1px 0 #FFF;border:2px solid #9CAEB2;}
.file-ribbon {padding-top:3px;}
.dossier-kicker {display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:22px;color:#5C7280;font:700 9px var(--mono);letter-spacing:.05em;}
.dossier-verified {color:#687E72;text-align:right;}
.person-sheet h3 {margin-top:9px;}
.person-intro {border-bottom:1px solid #C4C6C4;padding-bottom:18px;}
.fact-row {border:1px solid #AAB6B7;background:#F7F3EA;box-shadow:3px 3px 0 #D2D5D1;}
.fact-row span {color:#567080;}
.keyword-line span {border:1px solid #90A3AA;background:#E7EBE8;box-shadow:2px 2px 0 #C6D2D3;}
.person-dossier[data-active-person="hwayang"] .keyword-line span {background:#F7E4C8;border-color:#C6A17E;box-shadow:2px 2px 0 #DBC6B1;}
.person-sheet blockquote {border-left-color:#657E8B;background:#DFE5E4;box-shadow:3px 3px 0 #D0D8D7;}
.person-dossier[data-active-person="hwayang"] .person-sheet blockquote {background:#F6E8D5;border-left-color:#D99858;}
.dossier-addendum {display:grid;grid-template-columns:1fr 1.1fr;gap:14px;margin-top:22px;}
.dossier-addendum>div {border:1px solid #7E919B;min-height:150px; padding:20px 22px;box-shadow:5px 6px 0 rgba(5,15,25,.35);}
.addendum-observation {background:#304655;border-left:5px solid #B1C1CB!important;}
.addendum-tastes {background:#364956;border-left:5px solid #E8C077!important;}
.addendum-index {font:700 10px var(--mono);letter-spacing:.09em;color:#E8C077;}
.addendum-observation p {font-size:15px;font-weight:700;line-height:1.75;max-width:48ch;margin:17px 0 14px;word-break:keep-all;}
.addendum-footer {font:600 9px var(--mono);letter-spacing:.04em;color:#AEBCC1;}
.tastes-grid {display:grid;grid-template-columns:1fr 1fr;margin-top:17px;gap:13px;}
.tastes-grid>div {min-width:0;}
.tastes-grid>div:first-child {border-right:1px solid #6A7F8A;padding-right:13px;}
.tastes-grid span {font:700 10px var(--mono);color:#E8C077;}
.tastes-grid p {margin:8px 0 0;font-size:13px;line-height:1.75;color:#F1EEE7;word-break:keep-all;}

/* Accessible focus and restrained motion */
.file-nav-item:focus-visible,.person-tab:focus-visible {outline:3px solid #D99858;outline-offset:3px;}
@media(max-width:1280px) {
 .file-nav {margin-right:-10px;padding-right:8px;}
 .person-sheet {padding-left:36px;padding-right:25px;}
}
@media(max-width:960px) {
 .rail-dir-head,.rail-current {display:none;}
 .file-nav {margin:0;padding:5px 0 10px;gap:6px;grid-template-columns:repeat(3,minmax(0,1fr));}
 .file-nav-item {min-height:54px;border-left-width:2px;padding:10px 8px;box-shadow:2px 3px 0 rgba(7,18,28,.5);}
 .file-nav-item.active {transform:none;border-left-width:3px;box-shadow:2px 3px 0 rgba(9,19,29,.65);}
 .file-nav-item:before {display:none;}
 .file-nav-item:after {display:none;}
 .person-dossier {grid-template-columns:minmax(220px,.85fr) minmax(0,1.2fr);}
 .portrait-mat {height:300px;}
 .person-sheet {padding-left:34px;}
}
@media(max-width:650px) {
 .file-nav {grid-template-columns:repeat(3,minmax(0,1fr));}
 .file-nav-item {min-height:57px;gap:6px;padding:9px 7px;}
 .file-nav-item.active {transform:none;}
 .nav-index {min-width:0;font-size:9px;padding:3px;}
 .nav-main {font-size:12px;}
 .nav-main small {font-size:7px;letter-spacing:0;}
 .person-tabs {gap:8px;padding:7px 3px 0;align-items:stretch;}
 .person-tab {width:100%;}
 .person-tab {min-height:66px;}
 .person-dossier {grid-template-columns:1fr;box-shadow:5px 7px 0 rgba(5,15,25,.35);}
 .person-visual {min-height:340px;}
 .portrait-mat {height:255px;max-width:265px;}
 .person-sheet {padding:21px 20px 27px 34px;}
 .person-sheet:before {left:19px;}
 .sheet-punches {left:7px;top:55px;bottom:30px;}
 .sheet-punches i {width:11px;height:11px;}
 .dossier-kicker {margin-top:18px;flex-wrap:wrap;font-size:8px;}
 .person-sheet h3 {font-size:clamp(36px,10vw,44px);}
 .dossier-addendum {grid-template-columns:1fr;gap:13px;}
 .dossier-addendum>div {min-height:unset;padding:17px 19px;}
 .tastes-grid {gap:10px;}
}
@media(max-width:370px) { .person-tab {padding:10px 13px;} .person-tab strong {font-size:21px;} .nav-main {font-size:11px;} }


/* =============================================================
   FIELD DESK v6 | MOTION, TOUCH & RESPONSIVE POLISH
   Animated file retrieval, paper-sheet swap and thumb-friendly
   navigation. No change to the confirmed Blue x Amber palette.
   ============================================================= */
:root { --sheet-ease: cubic-bezier(.2,.76,.26,1); }

/* A file is taken out of the drawer and placed onto the desk. */
.stage-view.is-visible {
  animation: file-arrival .49s var(--sheet-ease) both;
  transform-origin: 40% 8%;
}
@keyframes file-arrival {
  0% { opacity:0; transform:translate3d(20px,16px,0) rotate(.36deg); filter:blur(2.5px); }
  65% { opacity:1; filter:blur(0); }
  100% { opacity:1; transform:translate3d(0,0,0) rotate(0); filter:blur(0); }
}
.stage-view .stage-topline { position:relative; }
.stage-view.is-visible .stage-topline::after {
  content:""; position:absolute; bottom:-5px; left:0; height:2px;
  width:min(80px,26%); background:var(--orange);
  transform-origin:left center; animation:file-rule .65s .07s var(--sheet-ease) both;
}
@keyframes file-rule { from { transform:scaleX(0); opacity:.25; } to {transform:scaleX(1);opacity:1;} }

/* A physical, reactive drawer. Reduced motion supported below. */
.file-nav-item { -webkit-tap-highlight-color:transparent; }
.file-nav-item:active, .action-primary:active, .action-secondary:active,
.person-tab:active, .art-file:active { filter:brightness(.96); }
.file-nav-item.active .nav-arrow { animation:tab-arrow .28s var(--sheet-ease) both; }
@keyframes tab-arrow { from { transform:translate(-7px,4px); opacity:0; } to {transform:translate(0,0);opacity:1;} }

/* Person swap: illustrated folio settles first, then the notes. */
.person-dossier.dossier-opening .person-visual {
  animation:portrait-open .51s var(--sheet-ease) both;
  transform-origin:left center;
}
.person-dossier.dossier-opening .person-sheet {
  animation:sheet-open .56s var(--sheet-ease) both;
  transform-origin:top right;
}
.dossier-addendum.dossier-opening > div {
  animation:note-open .45s var(--sheet-ease) both;
}
.dossier-addendum.dossier-opening > div:nth-child(2) {animation-delay:.07s;}
@keyframes portrait-open { from { opacity:.45; transform:translate3d(-13px,6px,0); } to {opacity:1; transform:translate3d(0,0,0);} }
@keyframes sheet-open { from { opacity:.5; transform:translate3d(14px,4px,0) rotateY(-3deg); } to {opacity:1; transform:translate3d(0,0,0) rotateY(0);} }
@keyframes note-open { from {opacity:0; transform:translateY(11px);} to {opacity:1;transform:translateY(0);} }

/* Hover stays subtle and never hides content behind an animation. */
.action-primary, .action-secondary, .external-record, .reader-nav button {
  transition:transform .19s ease,box-shadow .19s ease,background .19s ease,filter .19s ease;
}
.action-primary:hover, .action-secondary:hover, .external-record:hover,
.reader-nav button:hover:not(:disabled) {transform:translateY(-2px);box-shadow:0 5px 0 rgba(9,19,29,.36);}
.gallery-columns .art-file { -webkit-tap-highlight-color:transparent; }
.art-file:hover img { filter:saturate(1.06); }

/* Keep story search and the actual reader accessible. */
.story-search:focus-within {outline:3px solid var(--orange);outline-offset:2px;}
.story-search input:focus {outline:none;}
.story-reader p {overflow-wrap:anywhere;}
.reader-nav button {min-height:44px;}
.lightbox-close {min-width:44px;min-height:44px;}

@media(max-width:960px) {
  /* The file drawer becomes a real horizontally scrollable tab strip,
     rather than five cramped tiles taking multiple rows. */
  .left-rail {
    position:sticky;top:0;z-index:25;
    padding:8px 12px 7px;background:#283B49;
    box-shadow:0 7px 14px rgba(7,17,26,.3);
  }
  .rail-logo {margin-bottom:6px;align-items:center;}
  .rail-logo>span {font-size:29px;line-height:1;}
  .rail-logo small {font-size:7px;line-height:1.15;}
  .file-nav {
    display:flex;flex-direction:row;flex-wrap:nowrap;grid-template-columns:none;
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x proximity;overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    margin:0;padding:6px 2px 8px;gap:7px;
    scrollbar-width:thin; scrollbar-color:#8296A2 transparent;
  }
  .file-nav-item,.file-nav-item.active {
    scroll-snap-align:start;flex:0 0 auto;min-width:131px;
    min-height:51px;transform:none;padding:9px 9px 9px 11px;
    box-shadow:2px 3px 0 rgba(7,18,28,.46);
    border-left-width:3px;
  }
  .file-nav-item:hover:not(.active) {transform:none;box-shadow:2px 3px 0 rgba(7,18,28,.46);}
  .file-nav-item.active {box-shadow:inset 0 1px 0 rgba(255,255,255,.42),2px 3px 0 rgba(7,18,28,.5);}
  .file-nav-item::before, .file-nav-item::after {display:none;}
  .nav-main {font-size:12px;}
  .nav-main small {font-size:8px;}
  .nav-index {font-size:9px;}
  .stage-view.is-visible {animation-duration:.34s;}
  .stage-view.is-visible .stage-topline::after {animation-duration:.4s;}
}
@media(max-width:650px) {
  .topline {height:30px;}
  .file-nav {gap:6px;margin:0;padding:5px 1px 8px;}
  .file-nav-item,.file-nav-item.active {
    min-width:130px;min-height:50px;gap:6px;
    padding:8px 9px 8px 11px;
  }
  .nav-main {font-size:12px;}
  .nav-main small {font-size:7px;}
  .nav-index {font-size:9px;}
  .person-tabs {flex-direction:row;gap:7px;padding:8px 2px 0;}
  .person-tab {
    min-height:65px;flex:1;width:auto;
    padding:9px 10px;gap:6px;
  }
  .person-tab strong {font-size:clamp(18px,5.8vw,25px);}
  .person-tab>span:first-child {font-size:8px;}
  .person-tab>span:last-child {display:none;}
  .person-tab.is-current {transform:translateY(-2px);}
  .portrait-mat {max-width:250px;}
  .person-sheet {overflow-wrap:anywhere;}
  .story-list {max-height:250px;min-height:110px;overflow-y:auto;}
  .story-search input {min-height:47px;font-size:16px;}
  .story-reader {min-height:360px;padding:24px 19px 35px;}
  .story-reader h3 {font-size:clamp(27px,8vw,36px);line-height:1.3;}
  .story-reader p {font-size:15px;line-height:1.95;}
  .reader-nav {gap:8px;}
  .reader-nav button {padding:11px 9px;}
  .art-file {min-height:44px;}
  .art-file>img {object-fit:contain;}
  .statusbar {font-size:8px;}
}
@media(max-width:370px) {
  .person-tabs {gap:5px;}
  .person-tab {padding:8px;}
  .person-tab strong {font-size:20px;}
  .file-nav-item,.file-nav-item.active {min-width:126px;}
}
@media(prefers-reduced-motion:reduce) {
  .stage-view.is-visible,.stage-view.is-visible .stage-topline::after,
  .file-nav-item.active .nav-arrow,
  .person-dossier.dossier-opening .person-visual,
  .person-dossier.dossier-opening .person-sheet,
  .dossier-addendum.dossier-opening > div {animation:none!important;filter:none!important;transform:none!important;}
  .file-nav {scroll-behavior:auto!important;}
}

/* =======================================
   V7 / PDF DOCUMENT ARCHIVE
   ======================================= */

.pdf-archive {
  margin-top: 48px;
  padding-top: 30px;
  border-top: 1px solid rgba(87, 106, 123, 0.45);
}

.pdf-archive-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 28px;
}

.pdf-eyebrow {
  font-family: "IBM Plex Mono", monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: #d99858;
}

.pdf-archive-heading h3 {
  font-size: clamp(26px, 4vw, 38px);
  margin: 8px 0;
  text-shadow: 2px 3px 0 rgba(0, 0, 0, 0.14);
}

.pdf-archive-heading p {
  font-size: 13px;
  opacity: 0.75;
}

.pdf-total {
  background: #d99858;
  color: #202d3a;
  font-size: 12px;
  font-weight: 800;
  padding: 9px 14px;
  border-radius: 4px;
  box-shadow: 3px 3px 0 #576a7b;
}

.pdf-folder {
  margin-bottom: 24px;
  padding: 20px;
  background: #202d3a;
  border: 1px solid #576a7b;
  border-radius: 8px;
  box-shadow: 5px 6px 0 rgba(18, 28, 39, 0.18);
}

.pdf-folder-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
  color: #e8c077;
}

.pdf-folder-heading span,
.pdf-folder-heading small {
  font-family: "IBM Plex Mono", monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.pdf-folder-heading h4 {
  color: #f3efe6;
  font-size: 17px;
  margin: 0;
}

.pdf-folder-heading small {
  margin-left: auto;
}

.pdf-document-list {
  display: grid;
  gap: 10px;
}

.pdf-document {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px;
  margin-top: 10px;
  color: #f3efe6;
  background: #354657;
  border: 1px solid #576a7b;
  border-radius: 5px;
  text-decoration: none;
  transition: transform 0.2s ease,
              background 0.2s ease,
              box-shadow 0.2s ease;
}

.pdf-document:hover,
.pdf-document:focus-visible {
  background: #455a6e;
  transform: translateY(-3px);
  box-shadow: 0 5px 0 #d99858;
}

.pdf-icon {
  flex-shrink: 0;
  padding: 9px 7px;
  border: 1px solid #d99858;
  color: #e8c077;
  font-size: 11px;
  font-weight: 800;
}

.pdf-document-name {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  overflow-wrap: anywhere;
}

.pdf-document-name strong {
  color: #f3efe6;
  font-size: 14px;
}

.pdf-document-name small {
  color: #bcc8d2;
  font-size: 11px;
}

.pdf-arrow {
  margin-left: auto;
  color: #e8c077;
  font-size: 20px;
}

@media (max-width: 600px) {
  .pdf-archive {
    margin-top: 30px;
  }

  .pdf-folder {
    padding: 14px;
  }

  .pdf-folder-heading {
    gap: 8px;
  }

  .pdf-document {
    padding: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pdf-document {
    transition: none;
  }
}

/* V7 / INDEPENDENT DOCUMENT PANELS */

#ch .pdf-archive,
#novel .pdf-archive {
  margin-top: 18px;
  padding-top: 0;
  border-top: none;
}

#ch .pdf-folder,
#novel .pdf-folder {
  max-width: 1000px;
}

#ch .pdf-document,
#novel .pdf-document {
  cursor: pointer;
}

/* ========================================
   V7 / OFFICIAL PAIR SHEET
   ======================================== */

.bond-reference {
  margin: 0;
  padding: 14px;
  background: #f5f2ec;
  border: 1px solid #7b8993;
  box-shadow: 9px 10px 0 rgba(10, 20, 30, 0.3);
}

.bond-reference a {
  display: block;
  cursor: zoom-in;
}

.bond-reference img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.bond-reference figcaption {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding-top: 14px;
  color: #394b5a;
  font-family: "IBM Plex Mono", monospace;
  font-size: 11px;
  font-weight: 600;
}

/* 모바일 최적화 */
@media (max-width: 650px) {
  .bond-reference {
    padding: 6px;
    box-shadow: 4px 5px 0 rgba(10, 20, 30, 0.3);
  }

  .bond-reference figcaption {
    padding: 10px 5px 4px;
    font-size: 9px;
  }
}

/* =====================================
   V7 / STORY ARCHIVE REDESIGN
   ===================================== */

#stories .story-workspace,
#stories .story-list,
#stories .story-reader {
  min-height: 470px;
}

.story-welcome {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, .8fr);
  align-items: center;
  gap: 28px;
  min-height: 350px;
}

.story-welcome h3 {
  font-size: clamp(32px, 3.5vw, 54px);
  line-height: 1.2;
  margin: 18px 0 24px;
  letter-spacing: -0.06em;
  text-shadow: 3px 4px 0 rgba(0, 0, 0, .12);
}

.story-welcome p {
  color: #526272;
  font-size: 14px;
  line-height: 1.9;
  margin-bottom: 14px;
}

.story-welcome-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 26px;
  font-family: "IBM Plex Mono", monospace;
  font-size: 10px;
  font-weight: 700;
  color: #8F7353;
  letter-spacing: .05em;
}

.status-dot {
  width: 8px;
  height: 8px;
  background: #D99858;
  border-radius: 50%;
}

.story-welcome-art {
  margin: 0;
  padding: 10px;
  background: #DDD9D0;
  border: 1px solid #A5ADB1;
  box-shadow: 7px 8px 0 rgba(32,45,58,.25);
  transform: rotate(2deg);
}

.story-welcome-art img {
  display: block;
  width: 100%;
  height: 270px;
  object-fit: contain;
  background: #F5F0E6;
}

.story-welcome-art figcaption {
  padding-top: 10px;
  color: #394B5A;
  font: 700 9px "IBM Plex Mono", monospace;
  text-align: center;
}

/* 좁은 화면 */
@media (max-width: 1100px) {
  .story-welcome {
    grid-template-columns: 1fr;
  }

  .story-welcome-art {
    max-width: 320px;
    width: 100%;
    margin: 0 auto;
  }

  .story-welcome-art img {
    height: 230px;
  }
}

@media (max-width: 650px) {
  #stories .story-list {
    min-height: 110px;
  }

  #stories .story-reader {
    min-height: 0;
  }

  .story-welcome {
    gap: 24px;
  }

  .story-welcome h3 {
    font-size: 36px;
  }

  .story-welcome-art img {
    height: 200px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .story-welcome-art {
    transform: none;
  }
}

/* ==========================================
   V7 / EXTERNAL STORY ACCESS
   ========================================== */

/* 기존 빈 검색·독서 영역 숨기기 */
#stories .story-tools,
#stories .story-workspace {
  display: none !important;
}

/* 새로운 서사 열람실 */
.story-access {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 30px;
  align-items: center;
  padding: 34px;
  margin-top: 24px;

  background: #263848;
  border: 1px solid #576A7B;
  box-shadow: 8px 9px 0 rgba(12, 22, 32, 0.3);
}

.story-access-label {
  color: #E8C077;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.story-access h3 {
  color: #F3EFE6;
  font-size: clamp(36px, 5vw, 68px);
  line-height: 1.15;
  letter-spacing: -0.055em;
  margin: 20px 0;

  text-shadow: 4px 5px 0 rgba(0, 0, 0, 0.24);
}

.story-access-main p {
  color: #C8D4DE;
  font-size: 14px;
  line-height: 1.85;
  margin: 0 0 10px;
}

.story-access-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 28px 0;
}

.story-access-stats div {
  flex: 1;
  min-width: 85px;
  padding: 16px;
  background: #354B5D;
  border: 1px solid #576A7B;
}

.story-access-stats strong {
  display: block;
  color: #E8C077;
  font-size: 30px;
  font-weight: 900;
}

.story-access-stats span {
  color: #CBD6DE;
  font-size: 11px;
}

.story-access-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;

  background: #E8C077;
  color: #202D3A;
  font-size: 14px;
  font-weight: 900;
  text-decoration: none;

  box-shadow: 4px 5px 0 #A36F43;
  transition: transform 0.2s ease,
              box-shadow 0.2s ease;
}

.story-access-button:hover,
.story-access-button:focus-visible {
  transform: translate(-2px, -2px);
  box-shadow: 6px 7px 0 #A36F43;
}

.story-access-note {
  display: block;
  margin-top: 14px;
  color: #AFC0CD;
  font-size: 11px;
}

/* 오른쪽 페어 이미지 */
.story-access-visual {
  padding: 12px;
  background: #F3EFE6;
  border: 1px solid #B0B7BA;
  box-shadow: 7px 8px 0 rgba(0,0,0,0.3);
}

.story-access-visual img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: contain;
}

.story-access-visual span {
  display: block;
  margin-top: 12px;
  color: #344656;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
  letter-spacing: 0.06em;
}

/* 모바일 */
@media (max-width: 900px) {
  .story-access {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .story-access h3 {
    font-size: clamp(34px, 8vw, 52px);
  }

  .story-access-visual {
    max-width: 460px;
    width: 100%;
    margin: 0 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .story-access-button {
    transition: none;
  }
}

/* V7 / ILLUSTRATION CREDITS */

.person-artist {
  margin: 0 0 18px;
  color: #8A6244;
  font-family: "IBM Plex Mono", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.art-caption .art-credit {
  display: block;
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid #B8B2A7;
  color: #785437;
  font-size: 11px;
  font-weight: 800;
}