@charset "UTF-8";
:root{--ink:#29241b;--paper:#c5b48c;--cream:#d0c19d;--rust:#a24729;--mono:'Courier New',Courier,monospace;color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:25px}
body{margin:0;min-height:100vh;color:var(--cream);font:14px/1.4 var(--mono);background-color:#201c17;background-image:linear-gradient(90deg,#171511d9,#241e15b3 48%,#141611d1),url('assets/images/sea.jpg');background-size:cover;background-attachment:fixed}
body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:30;opacity:.13;background-image:repeating-linear-gradient(83deg,transparent 0 79px,#c6b59122 79px 80px,transparent 80px 171px),repeating-linear-gradient(2deg,transparent 0 3px,#0d0a0655 3px 4px);mix-blend-mode:overlay}
button,input,select{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer;color:inherit}
button:disabled{cursor:default}
a{color:inherit;text-underline-offset:4px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #edb47a;outline-offset:4px}
.wrap{width:calc(100% - 88px);max-width:1200px;margin:0 auto}
.skip-link{position:fixed;top:-90px;left:20px;background:var(--paper);color:var(--ink);padding:15px;z-index:60}
.skip-link:focus{top:15px}
.masthead{min-height:69px;display:flex;align-items:center;justify-content:space-between;gap:20px;border:0;color:#b8ab8c;font-size:10px}
.brand{display:block;letter-spacing:2px;font-size:13px;font-weight:bold;text-decoration:none;line-height:1.25;transform:rotate(-1deg)}
.brand-mark{display:none}
.brand-sub{display:block;font-size:8px;letter-spacing:1px;font-weight:normal}
.header-label{font-size:9px;border-bottom:2px solid #9b8c6c;border-top:1px solid #9b8c6c;padding:3px 1px;transform:rotate(1.5deg);letter-spacing:2px}
.collection-link{font-size:10px;display:flex;align-items:center;gap:12px;text-decoration:none}
.collection-link span{display:inline-block;color:#25221b;background:#b9a986;padding:7px 10px;font-weight:bold;transform:rotate(-3deg);box-shadow:2px 3px 0 #080906}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:16px 0 27px;position:relative}
.page-heading>div{transform:rotate(-1.1deg)}
.eyebrow{font-size:10px;letter-spacing:1.8px;margin:0 0 7px;line-height:1.5}
h1{font:900 clamp(28px,3.3vw,44px)/.99 var(--mono);letter-spacing:-2px;margin:0;color:#c1b497;text-shadow:1px 0 #c1b49766,-1px 1px #c1b49766,2px 2px #100e0a;filter:contrast(1.15)}
.title-period{color:#b6a787}
.heading-note{font:bold 12px/1.35 var(--mono);text-align:center;color:#bdaa80;max-width:260px;padding:13px 16px;border:3px double #a08e65;transform:rotate(4deg);opacity:.85;margin:8px 8px 0 0;box-shadow:1px 0 #54432a}
.heading-note span{display:block;font-size:8px;border-top:1px solid #9d8c6644;margin-top:7px;padding-top:6px;font-weight:normal}
.archive-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:22px 39px;align-items:start;position:relative}
.collection,.listening-area{display:contents}
.paper{color:var(--ink);background-color:var(--paper);background-image:radial-gradient(ellipse at 1% 3%,#684d3080,transparent 19%),radial-gradient(ellipse at 94% 100%,#7e57265c,transparent 25%),repeating-linear-gradient(2deg,transparent 0 2px,#543b2420 2px 3px),linear-gradient(98deg,#8b6b3330,transparent 30%,transparent 49.5%,#75552d22 50%,transparent 50.3%,transparent);box-shadow:3px 6px 0 #0a0b0799;position:relative}
.paper:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(#4b36194d .6px,transparent 1px),radial-gradient(#50371955 .7px,transparent 1px),radial-gradient(#4b361966 .4px,transparent .8px);background-size:7px 11px,13px 17px,19px 23px;background-position:0 0,4px 7px,2px 15px;mix-blend-mode:multiply}
.punchcard{grid-column:2;grid-row:1;padding:22px 22px 21px;transform:rotate(5deg);margin:15px -5px 0;z-index:3;border:0;border-left:1px solid #e2cc94;clip-path:polygon(0 1%,85% 0,100% 12%,99% 96%,96% 100%,2% 99%,0 88%)}
.punchcard:before{content:'';position:absolute;inset:0 7px;pointer-events:none;border-left:1px dashed #6c57367a;border-right:1px dashed #6c57367a}
.punch-heading{font-size:8px;line-height:1.2;display:flex;gap:10px;justify-content:space-between;padding-bottom:13px;border-bottom:2px solid #6c5736;letter-spacing:1px}
.card-code{font-size:7px;white-space:nowrap;margin-top:3px}
.punch-title{font:bold 26px/.91 var(--mono);letter-spacing:-1.5px;padding:16px 0 17px;position:relative;color:#332d1e;text-shadow:1px 0 #332d1e44}
.punch-title>span{position:absolute;right:-3px;top:21px;font:11px var(--mono);letter-spacing:0;border:2px solid #8a3a24b3;color:#893b27;transform:rotate(-10deg);padding:6px}
.punch-grid{display:grid;grid-template-columns:repeat(6,1fr);column-gap:7px;row-gap:17px;border-top:1px solid #68583755;padding-top:16px}
.punch{background:none;border:0;padding:0;color:#66563a;font-size:11px;display:grid;justify-items:center;gap:5px;font-weight:bold}
.punch-hole{height:29px;width:15px;border:1px solid #836b44;background:#b39a6822;box-shadow:inset 1px 0 #6c553222}
.punch.punched{color:#312819}
.punched .punch-hole{background:#211b11;box-shadow:inset 2px 2px #080a07;border:0;clip-path:polygon(8% 0,100% 3%,95% 100%,0 96%);transform:rotate(3deg)}
.punch.selected .punch-hole{background:#64311f;box-shadow:inset 3px 2px #321807}
.punch-foot{border-top:1px dashed #6e573a;margin:15px 0 0;padding-top:12px;font-size:8px;letter-spacing:1px;text-align:center}
.machine{grid-column:1;grid-row:1/3;position:relative;isolation:isolate;padding:20px 24px 17px;margin:9px 0 0;transform:rotate(-.55deg);background-color:#2a2923;background-image:radial-gradient(ellipse at 0 92%,#7a462d55,transparent 35%),radial-gradient(ellipse at 99% 1%,#6d4e2755,transparent 30%),repeating-linear-gradient(4deg,transparent 0 3px,#0b0d0955 3px 4px),linear-gradient(90deg,#13181388,#171b1355);background-size:auto;border:6px solid #4a4130;border-top-color:#746248;border-right-color:#3b3024;border-bottom-color:#13130e;box-shadow:inset 2px 2px 0 #0b120d,inset -2px -2px #6b66502e,4px 9px 0 #080b09,8px 16px 0 #090c0766;clip-path:polygon(0 0,28% .2%,49% 0,81% .4%,100% 0,99.8% 37%,100% 74%,99.5% 100%,69% 99.5%,38% 100%,0 99.7%,.3% 56%)}
.machine:after{content:'';position:absolute;inset:-3px;z-index:-1;pointer-events:none;background:repeating-linear-gradient(108deg,transparent 0 108px,#8e795c30 108px 109px,transparent 109px 110px,#171b1290 110px 111px,transparent 111px 177px),radial-gradient(ellipse at 0 95%,#9b4e2080,transparent 12%),radial-gradient(ellipse at 95% 4%,#9b4e2070,transparent 10%);mix-blend-mode:screen;opacity:.6}
.screw{position:absolute;width:14px;height:14px;background:#665e48;border:2px solid #242b1d;outline:1px solid #8c7b5555;border-radius:50%;box-shadow:1px 2px 0 #090e09;z-index:4}
.screw:after{content:'';position:absolute;top:4px;left:0;right:0;height:2px;background:#1c1f16;transform:rotate(31deg);box-shadow:0 1px #a1946880}
.screw-tl{top:6px;left:5px}.screw-tr{top:5px;right:6px;transform:rotate(60deg)}.screw-bl{bottom:5px;left:7px;transform:rotate(-40deg)}.screw-br{bottom:7px;right:5px}
.machine-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:0 9px 20px;padding:9px 0 12px;border-bottom:2px solid #11160f;color:#a79d7c;font-size:9px;font-weight:bold;letter-spacing:1px;text-shadow:0 -1px #020601}
.machine-header>span:first-child{color:#cec19a;max-width:215px}
.machine-status{display:flex;gap:6px;align-items:center;font-size:7px;white-space:nowrap}
.status-dot{display:inline-block;flex-shrink:0;border-radius:50%;width:6px;height:6px;background:#817855;border:1px solid #332a18}
.machine-status .status-dot{width:9px;height:9px;background:#733622;outline:2px solid #312a19;box-shadow:0 0 0 3px #100e08}
.playing .machine-status .status-dot{background:#da9548;box-shadow:0 0 4px #efa950,0 0 0 3px #100e08}
.record-deck{display:grid;grid-template-columns:205px minmax(0,1fr);gap:25px;align-items:start;padding:4px 0 26px}
.portrait{position:relative;margin:9px 1px 0 -3px;background:#baa77e;padding:8px 8px 29px;transform:rotate(-4.2deg);box-shadow:5px 5px 0 #050b07bb;clip-path:polygon(0 .3%,99% 0,100% 99%,96% 99.6%,28% 100%,0 98.7%)}
.portrait:before,.field-note:before,.sea-photo:before{content:'';position:absolute;top:-9px;left:21%;width:61%;height:26px;background:#ae946699;transform:rotate(4deg);z-index:3;border-left:1px dashed #cab38080;border-right:1px dashed #cab38080;clip-path:polygon(0 0,97% 4%,100% 20%,96% 40%,100% 50%,97% 100%,0 93%,2% 30%);box-shadow:0 1px 0 #33250d55}
.portrait-window{aspect-ratio:.78;overflow:hidden;position:relative;border:1px solid #514732;background:#0e140f}
.portrait img{width:100%;height:100%;object-fit:cover;display:block;image-rendering:auto;filter:grayscale(1) sepia(.38) contrast(1.85) brightness(.8)}
.scanlines{position:absolute;inset:0;background-image:radial-gradient(#201d1666 .6px,transparent .7px),repeating-linear-gradient(0deg,#0e140e44 0 1px,transparent 1px 3px);background-size:3px 3px,auto;opacity:.55;mix-blend-mode:multiply}
.playing .scanlines{animation:film 1.4s steps(3) infinite;opacity:.85}
.portrait figcaption{font:bold 12px/1.2 var(--mono);color:#31271a;text-align:center;padding:12px 0 0;transform:rotate(-1deg)}
.photo-ref{position:absolute;bottom:8px;right:11px;font-size:7px;color:#6a5132;letter-spacing:1px}
.record-details{position:relative;transform:rotate(1.3deg);color:#30291c;background:#c4b285;background-image:repeating-linear-gradient(0deg,transparent 0 2px,#46321913 2px 3px),radial-gradient(ellipse at 94% 2%,#64431c66,transparent 29%),linear-gradient(104deg,transparent 49.5%,#896c3633 49.8%,#e5d2a022 50%,transparent 50.2%);padding:19px 19px 22px;box-shadow:3px 6px 0 #0d100bbb;clip-path:polygon(0 0,99% .4%,100% 98%,96% 99.3%,94% 98.5%,89% 99.8%,82% 99%,80% 97.9%,77% 99.1%,71% 98.6%,69% 99.8%,57% 99.1%,51% 100%,46% 98.7%,37% 99.8%,33% 99.2%,31% 97.9%,28% 99.1%,21% 98.6%,16% 99.7%,7% 99.1%,4% 98.4%,0 99.5%)}
.record-details:before{content:'';display:block;height:9px;background:repeating-linear-gradient(90deg,#4e442e 0 3px,transparent 3px 11px,#4e442e 11px 14px,transparent 14px 18px,transparent 18px 29px,#4e442e 29px 32px,transparent 32px 41px);opacity:.4;margin:0 0 15px}
.file-label{display:flex;justify-content:space-between;align-items:center;gap:9px;font-size:9px;font-weight:bold;letter-spacing:.6px;border-bottom:1px solid #55462a;padding:0 0 10px;margin-bottom:14px;color:#534227}
.file-stamp{color:#913e23;font:bold 8px var(--mono);border:2px solid #913e2399;padding:3px;transform:rotate(-7deg);letter-spacing:1px}
.record-details h2{font:bold 29px/.99 var(--mono);letter-spacing:-1.7px;margin:0;text-wrap:balance;color:#29271b;text-shadow:.8px 0 #29271b66}
.diary-author{font:13px/1.3 var(--mono);margin:16px 0;text-decoration:underline;text-decoration-color:#59442688;text-underline-offset:5px}
.metadata{border-top:1px dashed #6d5a36;padding:12px 0 0;margin:0 0 16px;display:grid;gap:8px}
.metadata>div{display:grid;grid-template-columns:63px minmax(0,1fr);gap:9px;font-size:10px;line-height:1.3}
.metadata dt{font-size:8px;font-weight:bold;padding-top:1px;color:#655035}
.metadata dd{margin:0;color:#3c3425}
.signal-display{height:89px;position:relative;overflow:hidden;background-color:#192118;background-image:repeating-linear-gradient(90deg,transparent 0 23px,#a9af7533 23px 24px),repeating-linear-gradient(0deg,transparent 0 15px,#a9af751f 15px 16px);border:3px solid #61583f;border-top-color:#373624;border-left-color:#343624;padding:8px 10px 6px;box-shadow:inset 2px 3px 0 #0c140c}
.signal-display:after{content:'';position:absolute;inset:0;background:linear-gradient(108deg,transparent 47%,#b2b99055 47.3%,transparent 47.6%),linear-gradient(71deg,transparent 26%,#b2b99044 26.2%,transparent 26.8%),repeating-linear-gradient(2deg,transparent 0 3px,#080e0855 3px 4px);pointer-events:none;opacity:.4}
.signal-label,.signal-scale{display:flex;justify-content:space-between;font-size:6px;color:#a1a774;letter-spacing:1px;line-height:1}
.waveform{height:43px;display:flex;align-items:center;gap:2px;justify-content:space-between;margin:3px 0 4px}
.waveform i{display:block;flex:1;height:var(--bar);background:#a9ad6a;opacity:.6;transform:scaleY(.25)}
.playing .waveform i{animation:wave .6s steps(4) infinite alternate;animation-delay:var(--delay);opacity:.9}
.transport{display:flex;align-items:center;gap:15px;margin:0 -5px;padding:21px 11px 13px;background:#10140f88;border-top:4px solid #0b0e09;border-bottom:1px solid #81704b55;box-shadow:0 -1px #796b48;position:relative}
.play-button{display:grid;justify-items:center;align-content:center;gap:8px;background:#bcb08c;background-image:repeating-linear-gradient(1deg,#201a100f 0 2px,transparent 2px 3px);color:#28271a;width:78px;height:73px;flex-shrink:0;border:3px solid #e0cca1;border-bottom:8px solid #837147;border-right:6px solid #9f8c60;border-top-color:#cfc19b;border-radius:1px;box-shadow:3px 4px 0 #050805;font-size:11px;font-weight:bold;letter-spacing:1px}
.play-button:hover{background-color:#d0bf96}
.play-button:active{transform:translate(1px,3px);border-bottom-width:5px;box-shadow:2px 1px 0 #050805}
#play-icon{font-size:22px;line-height:1}
.rewind-button{width:42px;height:57px;flex-shrink:0;display:grid;place-content:center;justify-items:center;gap:1px;background:#494a38;border:2px solid #66634a;border-right:3px solid #1f291b;border-bottom:5px solid #20281b;box-shadow:2px 2px 0 #060b06;font:bold 10px var(--mono);color:#c7b892;padding:1px}
.rewind-button>span{font-size:25px;line-height:1}
.timeline{flex:1;min-width:0}
.time-labels{display:flex;justify-content:space-between;font-size:12px;color:#c7bc91;letter-spacing:1px}
.timeline-caption{display:flex;justify-content:space-between;gap:8px;font-size:7px;line-height:1;color:#a49e7b;letter-spacing:.4px}
input[type=range]{--progress:0%;appearance:none;width:100%;height:27px;background:transparent;cursor:pointer;padding:0;margin:4px 0;accent-color:#bfaa7b}
input[type=range]::-webkit-slider-runnable-track{height:7px;background:linear-gradient(to right,#a68d55 var(--progress),#070e08 var(--progress));border-top:2px solid #020802;border-bottom:1px solid #736b4c}
input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:23px;background:repeating-linear-gradient(0deg,#b9a26d 0 3px,#dbc393 3px 4px);border:2px solid #bcaa7d;border-bottom:4px solid #675733;margin-top:-10px;border-radius:0;box-shadow:2px 2px 0 #040804}
input[type=range]::-moz-range-track{height:7px;background:#090f08;border-bottom:1px solid #736b4c}
input[type=range]::-moz-range-thumb{width:13px;height:23px;background:#b9a26d;border:2px solid #bcaa7d;border-radius:0}
.volume-control{width:72px;border-left:1px solid #796e4955;padding-left:12px;flex-shrink:0}
.volume-control label{font-size:8px;letter-spacing:1px;color:#bcb08c}
.placeholder-note{font-size:9px;line-height:1.5;color:#b4a682;border-top:1px dashed #6b6345;padding-top:11px;margin:14px 3px 0}
.audio-error{font-size:12px;color:#e1ad7d;line-height:1.5}
.machine-bottom{display:flex;justify-content:space-between;margin:20px 6px 0;color:#978b68;font-size:7px;font-weight:bold;letter-spacing:1px}
.transcript{grid-column:1;grid-row:3;margin:5px 24px 18px 12px;transform:rotate(-1deg);background-color:#baa882;box-shadow:4px 4px 0 #211f1355,8px 9px 0 #a89a7244,11px 14px 0 #0c0c0899}
.transcript:before{content:'';position:absolute;top:0;bottom:0;left:0;width:15px;background:radial-gradient(circle at 6px 9px,#252319 3px,transparent 3.5px) 0 0/13px 21px;border-right:1px dashed #87704c}
.transcript summary{padding:20px 24px 20px 33px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;list-style:none;gap:15px;position:relative;z-index:1}
.transcript summary::-webkit-details-marker{display:none}
.transcript summary .eyebrow{display:block;font-size:8px;color:#645034;font-weight:bold;letter-spacing:1px}
.transcript-title{font:bold 19px var(--mono);letter-spacing:-1px;text-transform:uppercase;color:#30271a}
.transcript-toggle{font:bold 25px var(--mono);color:#6e3e26;padding:0 3px}
.transcript[open] .transcript-toggle{transform:rotate(45deg)}
.transcript-content{font:13px/1.75 var(--mono);padding:0 27px 25px 34px;position:relative;z-index:1;background-image:repeating-linear-gradient(0deg,transparent 0 22px,#88704c22 22px 23px)}
.transcript-content p{margin:0 0 17px}
.transcript-content p:last-child{margin:0}
.transcript-source{font-weight:bold;border-top:2px solid #7d654655;padding-top:18px}
.field-note{grid-column:2;grid-row:2/4;position:relative;margin:-5px 8px 30px -2px;transform:rotate(-6deg);background:#c2b08a;padding:9px 9px 17px;color:#352b1c;box-shadow:4px 6px 0 #0c0d07bb;z-index:2}
.field-note:before{top:-13px;left:17%;width:68%;height:29px;background:#b8a07199;transform:rotate(9deg)}
.field-photo{display:block;width:100%;height:220px;object-fit:cover;filter:grayscale(1) sepia(.4) contrast(1.7) brightness(.85);border:1px solid #574a33}
.field-note-number{display:block;font-size:8px;text-align:right;padding:7px 0;color:#665136}
.field-note p{font:bold 12px/1.3 var(--mono);letter-spacing:-.5px;margin:0 3px;transform:rotate(-1deg)}
.field-note p span{display:block;font-size:6px;letter-spacing:.2px;margin-top:8px;color:#735d3c}
.shelf-heading{grid-column:1/-1;grid-row:4;display:flex;align-items:end;justify-content:space-between;padding:14px 24px 13px;color:#2c2519;background:#b19d71;background-image:repeating-linear-gradient(0deg,transparent 0 2px,#59442419 2px 3px);border-top:4px double #6d5332;border-bottom:1px solid #685031;transform:rotate(.5deg);margin:12px 4px -22px -3px;box-shadow:3px 4px 0 #0a0c0799;position:relative}
.shelf-heading:before{content:'';position:absolute;right:18px;top:-24px;width:130px;height:24px;background:#b19d71;clip-path:polygon(10px 0,95% 0,100% 100%,0 100%);box-shadow:inset 0 3px #665332;z-index:-1}
.shelf-heading h2{font:bold 24px/1 var(--mono);margin:0;letter-spacing:-1px}
.shelf-heading>span{font-size:11px;font-weight:bold;letter-spacing:3px}
.filters{grid-column:1/-1;grid-row:5;display:flex;gap:27px;background:#bba982;margin:0 4px -22px -3px;padding:15px 25px 0;transform:rotate(.5deg);position:relative;z-index:2;box-shadow:3px 2px 0 #0a0c0799}
.filters button{font-size:11px;font-weight:bold;letter-spacing:.5px;border:0;border-bottom:3px solid transparent;padding:0 0 9px;background:transparent;color:#6a5739;text-transform:uppercase}
.filters button.active{color:#322719;border-bottom-color:#8c3d26}
.filters button span{display:inline-block;border:1px solid #7f6640;padding:0 4px;margin-left:4px;font-size:9px;line-height:1.3}
.record-list{grid-column:1/-1;grid-row:6;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background-color:#bba982;background-image:repeating-linear-gradient(0deg,transparent 0 2px,#543b2420 2px 3px),radial-gradient(ellipse at 90% 100%,#7653254d,transparent 20%);color:#3c2f1d;margin:0 4px -22px -3px;padding:7px 19px 23px;transform:rotate(.5deg);box-shadow:3px 6px 0 #0a0c0799;position:relative;align-content:start}
.record-row{position:relative;display:flex;align-items:center;gap:12px;background:none;border:0;border-bottom:1px solid #7d694833;border-right:1px solid #7d694866;text-align:left;min-height:89px;padding:15px 16px 14px 8px;color:#312919}
.record-row:nth-child(3n){border-right:0}
.record-serial{font-size:17px;font-weight:bold;color:#77603d;border-right:1px solid #76613e;padding:4px 9px 4px 0;letter-spacing:-1px;line-height:1}
.record-row-body{display:grid;gap:7px;flex:1;min-width:0}
.record-row-title{font:bold 13px/1.2 var(--mono);letter-spacing:-.5px}
.record-row-detail{font-size:7px;letter-spacing:.4px;color:#6d5938;line-height:1.2}
.record-marker{font:bold 20px var(--mono);color:#88432a;flex-shrink:0}
.record-row.locked{color:#73603f}
.record-row.locked .record-row-title{text-decoration:line-through;text-decoration-color:#73603f55}
.record-row.active{background:#49331318;outline:2px solid #87472e;outline-offset:-7px}
.record-row.active .record-serial{color:#8b4128}
.record-row.unlocked:hover{background-color:#efe1b622}
.drawer-empty{grid-column:1/-1;font:13px/1.6 var(--mono);padding:7px;margin:10px 0 0;color:#58492f}
.save-note{grid-column:1/-1;grid-row:7;display:flex;gap:9px;margin:0 4px 0 -3px;padding:12px 28px 17px;transform:rotate(.5deg);font-size:9px;line-height:1.5;color:#574627;background:#bba982;box-shadow:3px 6px 0 #0a0c0799;border-top:1px dashed #7d694866}
.save-note .status-dot{margin-top:3px;background:#5b613a;border:0}
.empty-player{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:20px;min-height:419px;padding:18px 7px 37px}
.sea-photo{position:relative;margin:0 -10px 0 -13px;transform:rotate(-5deg);box-shadow:3px 6px 0 #080d08}
.sea-photo img{display:block;width:100%;height:298px;object-fit:cover;border:8px solid #af9a72;filter:grayscale(1) sepia(.6) contrast(1.5) brightness(.8)}
.photo-caption{position:absolute;bottom:17px;left:17px;font-size:7px;font-weight:bold;letter-spacing:1px;background:#242418;padding:5px 6px;color:#c9b38a}
.empty-insert{padding:25px 24px 29px;transform:rotate(3deg);clip-path:polygon(0 0,100% .5%,99% 99%,96% 97%,93% 100%,85% 97%,80% 100%,72% 99%,68% 100%,59% 98%,52% 100%,42% 99%,33% 100%,25% 98%,15% 100%,5% 98%,0 99%)}
.empty-insert .eyebrow{font-size:8px;color:#6d5735;font-weight:bold}
.empty-insert h2{font:bold 38px/.95 var(--mono);letter-spacing:-2px;margin:16px 0 20px;color:#30291a;text-transform:uppercase}
.empty-insert p{font-size:11px;line-height:1.5;color:#4f4029}
.empty-stamp{display:inline-block;transform:rotate(-7deg);font:bold 11px var(--mono);color:#8b3e25;border:3px double #8b3e25;padding:6px 7px;margin:13px 0 2px;letter-spacing:-.3px}
.notice{color:#30271a;background:#c4b17f;box-shadow:2px 3px 0 #0e100999;border-left:4px solid #8b4327;font-size:11px;font-weight:bold;line-height:1.5;padding:10px 14px;margin:0 28% 19px 3px;transform:rotate(-.55deg)}
.footer{display:flex;justify-content:space-between;gap:20px;padding:30px 0 24px;margin-top:29px;font-size:8px;line-height:1.6;letter-spacing:.7px;color:#b6a480;transform:rotate(-.2deg)}
.footer-divider{padding:0 7px}
@keyframes wave{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
@keyframes film{0%{transform:translateY(0)}33%{transform:translateY(1px)}66%{transform:translateY(-1px)}100%{transform:translateY(0)}}
/* Production forms are typewritten worksheets, not part of the visitor equipment. */
.admin-heading{padding:21px 0 36px}
.admin-heading h1{font-size:45px;letter-spacing:-2px;text-transform:uppercase}
.admin-layout{display:grid;grid-template-columns:minmax(0,1fr) 365px;gap:42px;align-items:start}
.admin-form{padding:31px 34px 35px;transform:rotate(-.65deg);border-top:3px double #7a6440;border-left:1px solid #d6c099;box-shadow:4px 7px 0 #100e0955,8px 12px 0 #99805855,12px 18px 0 #0c100977;position:relative}
.admin-form:after{z-index:0}
.admin-form>*{position:relative;z-index:1}
.admin-form h2{font:bold 27px/1.05 var(--mono);letter-spacing:-1.3px;margin:0 0 15px;text-transform:uppercase}
.admin-form .eyebrow{color:#6b5632;font-size:9px;font-weight:bold}
.admin-intro{font-size:12px;line-height:1.6;color:#56442a;margin:0 0 25px}
.form-field{display:block;margin-bottom:25px}
.form-field>span{display:block;font-size:11px;font-weight:bold;letter-spacing:.5px;margin-bottom:8px;color:#4a361c}
.form-field input,.form-field select{display:block;width:100%;color-scheme:light;min-height:47px;padding:12px 10px;font-size:12px;color:#2e2618;background:#e0cd9c66;border:0;border-bottom:2px solid #66512e;box-shadow:inset 1px 2px #59432533;border-radius:0}
.form-field input:focus,.form-field select:focus{background:#ead8ac99}
.form-field small{display:block;font-size:10px;color:#655031;line-height:1.6;margin-top:8px}
.desk-button{border:2px solid #786745;border-bottom:5px solid #241e11;border-right:4px solid #322716;background:#494330;background-image:repeating-linear-gradient(0deg,transparent 0 2px,#07090522 2px 3px);color:#dbca9d;min-height:47px;padding:11px 16px;font:bold 11px var(--mono);text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;text-align:center;box-shadow:2px 3px 0 #1d1e1280}
.desk-button:hover{background-color:#5d543b}
.desk-button:active{transform:translateY(2px);box-shadow:0 0 0 #000}
.desk-button.secondary{background-color:#b2a078;color:#392b16;border-color:#d0b987;border-bottom-color:#7b6440;border-right-color:#8b754f}
.desk-button.secondary:hover{background-color:#cabb91}
.desk-button:disabled{opacity:.45;box-shadow:none}
.admin-actions{display:flex;gap:13px;flex-wrap:wrap}
.desk-note{font:10px/1.6 var(--mono);color:#b6a480;margin:26px 3px}
.qr-sheet{padding:27px 27px 30px;transform:rotate(3deg);text-align:center;margin:14px 0 0;clip-path:polygon(0 0,90% .5%,100% 8%,99% 100%,83% 99%,60% 100%,36% 99.5%,0 100%);border-left:1px solid #d4c392}
.qr-sheet:before{content:'';position:absolute;inset:10px;border:1px dashed #7a614077;pointer-events:none}
.qr-sheet .eyebrow{font-size:9px;color:#624b2d;font-weight:bold}
.qr-sheet h2{font:bold 25px/1.05 var(--mono);text-transform:uppercase;letter-spacing:-1.5px;margin:15px 0 9px;color:#352b18}
.qr-source{font-size:9px;line-height:1.5;overflow-wrap:anywhere;color:#715634;margin:9px 0 18px}
.qr-image{width:252px;height:252px;max-width:100%;background:white;margin:20px auto 18px;display:grid;place-items:center;position:relative;z-index:2;color:#504b3c;font-size:10px;box-shadow:2px 3px 0 #7d63444d}
.qr-image svg{width:100%;height:100%;display:block;shape-rendering:crispEdges}
.qr-instruction{font-size:11px;line-height:1.5;font-weight:bold;margin:15px 0 22px}
.qr-footer{font-size:8px;font-weight:bold;border-top:2px solid #77533277;padding-top:15px;letter-spacing:.8px}
.link-result{border-top:2px dashed #836c43;padding-top:23px;margin-top:24px}
.link-result .form-field{margin-bottom:16px}
.link-result input{font-size:11px}
.form-message{font-size:11px;line-height:1.5;color:#543f24;margin:20px 0 0;font-weight:bold}
.form-message.error{color:#87341c}
.address-note{font-size:11px;line-height:1.6;border-left:3px solid #8d4a29;padding:9px 12px;background:#6b45231a;color:#674221;margin-top:21px}
.preview-tools{margin:30px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.preview-tools .desk-button{font-size:10px;padding:12px 7px}
.print-only{display:none}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.archive-layout{grid-template-columns:minmax(0,1fr) 210px;column-gap:28px}.machine{padding:18px 18px 16px}.record-deck{grid-template-columns:165px minmax(0,1fr);gap:20px}.record-details{padding:16px 14px 20px}.record-details h2{font-size:26px;letter-spacing:-1.5px}.portrait figcaption{font-size:11px}.diary-author{font-size:12px}.metadata>div{grid-template-columns:51px 1fr;gap:5px;font-size:9px}.punchcard{padding:19px 18px 18px}.punch-title{font-size:23px}.punch-title>span{font-size:9px;right:-6px}.punch-heading{font-size:7px;gap:5px}.card-code{font-size:6px}.punch-grid{column-gap:5px}.punch-hole{width:13px}.field-photo{height:197px}.transport{gap:12px;padding-left:5px;padding-right:5px}.play-button{width:67px;height:67px}.rewind-button{width:36px;height:51px}.volume-control{width:57px;padding-left:10px}.time-labels{font-size:10px}.admin-layout{grid-template-columns:minmax(0,1fr) 325px;gap:29px}.admin-form{padding:27px}.qr-sheet{padding:26px 24px}.qr-image{width:235px;height:235px}.record-row{padding-left:5px;gap:8px}.record-row-title{font-size:12px}}
@media(max-width:900px) and (min-width:801px){.wrap{width:calc(100% - 42px)}.archive-layout{grid-template-columns:minmax(0,1fr) 185px;column-gap:22px}.punch-title{font-size:21px}.punch-title>span{font-size:8px;right:-8px;top:24px}.machine{padding:16px 15px}.record-deck{grid-template-columns:135px minmax(0,1fr);gap:16px}.portrait figcaption{font-size:9px}.record-details h2{font-size:24px}.record-details .file-stamp{display:none}.machine-header{font-size:7px;letter-spacing:.5px;gap:9px}.machine-status{font-size:6px}.volume-control{width:47px;padding-left:8px}.volume-control label{font-size:6px}.field-photo{height:164px}.header-label{display:none}.heading-note{font-size:10px;width:195px;padding:10px 12px}.field-note p{font-size:10px}.metadata>div{display:block}.metadata dt{margin-bottom:3px}.punch-heading{font-size:6px}.punch-title{letter-spacing:-1px}.punchcard{padding-left:17px;padding-right:17px}.punch-grid{gap:13px 3px}.punch-hole{width:11px}.record-list{padding:6px 15px 19px}.record-row-title{font-size:11px}.record-row-detail{font-size:6px}}
@media(max-width:800px){.wrap{width:calc(100% - 40px);max-width:600px}.masthead{min-height:63px;gap:15px}.header-label{display:none}.brand{font-size:11px;letter-spacing:1px}.brand-sub{font-size:7px}.collection-link{font-size:8px;gap:8px}.collection-link span{padding:6px 8px}.page-heading{padding:19px 0 26px}.page-heading h1{font-size:39px;letter-spacing:-2px}.heading-note{display:none}.eyebrow{font-size:9px}.archive-layout{display:flex;flex-direction:column;gap:25px}.machine{order:0;width:100%;transform:rotate(-.5deg);padding:20px 20px 16px;margin:0}.record-deck{grid-template-columns:175px minmax(0,1fr);gap:25px}.record-details h2{font-size:29px}.portrait figcaption{font-size:11px}.file-label{font-size:8px}.metadata>div{grid-template-columns:57px 1fr;gap:7px;font-size:10px}.transcript{order:1;width:calc(100% - 24px);margin:0 12px 13px;transform:rotate(1deg)}.punchcard{order:2;width:calc(100% - 24px);margin:9px 12px 0;transform:rotate(-2deg);clip-path:polygon(0 0,94% 0,100% 12%,99.7% 100%,0 99.5%);padding:21px 25px 22px}.punch-title{font-size:26px;line-height:1;letter-spacing:-1px;padding:15px 0 13px}.punch-title br{display:none}.punch-title>span{font-size:12px;top:11px;right:0}.punch-heading{font-size:8px}.card-code{font-size:8px}.punch-grid{grid-template-columns:repeat(12,1fr);column-gap:6px;padding-top:13px}.punch-hole{width:14px;height:27px}.punch-foot{text-align:left;font-size:8px;padding-top:10px;margin-top:12px}.field-note{order:3;align-self:flex-end;width:180px;display:none}.shelf-heading{order:4;width:100%;margin:17px 0 -25px;transform:rotate(.3deg);padding:17px 19px 13px}.filters{order:5;width:100%;margin:0 0 -25px;padding:15px 20px 0;transform:rotate(.3deg)}.record-list{order:6;width:100%;margin:0 0 -25px;padding:8px 14px 20px;grid-template-columns:repeat(2,minmax(0,1fr));transform:rotate(.3deg)}.record-row{gap:11px;min-height:90px;padding-left:6px;padding-right:10px}.record-row:nth-child(3n){border-right:1px solid #7d694866}.record-row:nth-child(2n){border-right:0}.record-row-title{font-size:12px}.record-row-detail{font-size:6px}.record-serial{font-size:16px}.save-note{order:7;width:100%;margin:0;padding:13px 22px 17px;transform:rotate(.3deg)}.notice{margin:0 5px 21px;font-size:11px}.transport{gap:14px}.play-button{width:71px;height:71px}.volume-control{width:65px}.time-labels{font-size:12px}.empty-player{min-height:395px;padding:10px 3px 30px;gap:13px}.empty-insert{padding:24px 21px}.empty-insert h2{font-size:37px}.empty-insert p{font-size:11px}.empty-player .sea-photo img{height:277px}.footer{margin-top:20px;font-size:7px}.admin-layout{display:flex;flex-direction:column;gap:28px}.admin-form-area,.admin-preview{width:100%}.admin-form{padding:29px}.qr-sheet{width:330px;max-width:calc(100% - 18px);margin:0 auto}.qr-image{width:252px;height:252px}.preview-tools{max-width:350px;margin:29px auto 0}.admin-heading h1{font-size:42px;letter-spacing:-2px}.admin-heading{padding-bottom:31px}}
@media(max-width:480px){.wrap{width:calc(100% - 30px)}.masthead{min-height:56px}.collection-link{font-size:0}.collection-link span{font-size:10px}.brand{font-size:10px}.brand-sub{font-size:6px}.page-heading{padding:16px 0 23px}.page-heading h1{font-size:29px;letter-spacing:-1.7px;line-height:1.03}.page-heading .eyebrow{font-size:8px;margin-bottom:9px}.machine{padding:17px 12px 15px;border-width:5px}.machine-header{font-size:6px;letter-spacing:.3px;margin:0 7px 18px;padding:7px 0 10px;gap:10px}.machine-header>span:first-child{max-width:145px}.machine-status{font-size:5px;gap:5px}.machine-status .status-dot{width:6px;height:6px;outline:1px solid #312a19}.screw{width:11px;height:11px}.screw:after{top:3px;height:1px}.record-deck{grid-template-columns:100px minmax(0,1fr);gap:15px;padding:1px 0 21px}.portrait{padding:5px 5px 20px;margin-top:12px;transform:rotate(-3deg)}.portrait-window{aspect-ratio:.59}.portrait figcaption{font-size:9px;letter-spacing:-.4px;padding-top:8px}.photo-ref{font-size:5px;right:5px;bottom:6px}.portrait:before{height:20px;top:-7px;left:16%;width:71%}.record-details{padding:12px 11px 17px;transform:rotate(1.4deg)}.record-details:before{height:7px;margin-bottom:10px;opacity:.45}.file-label{font-size:6px;letter-spacing:.2px;line-height:1.5;padding-bottom:7px;margin-bottom:10px}.file-stamp{display:none}.record-details h2{font-size:22px;letter-spacing:-1.4px;line-height:1.01}.diary-author{font-size:10px;line-height:1.25;margin:12px 0}.metadata{padding-top:9px;gap:7px;margin-bottom:12px}.metadata>div{display:block}.metadata dt{font-size:6px;margin-bottom:2px}.metadata dd{font-size:8px;line-height:1.3}.signal-display{height:62px;padding:5px 6px;border-width:2px}.signal-label{font-size:5px;letter-spacing:.1px}.signal-scale{display:none}.waveform{height:34px;gap:1px;margin-top:1px}.transport{gap:10px;padding:15px 4px 9px;margin:0 -4px}.play-button{width:56px;height:62px;border-right-width:4px;border-bottom-width:6px;font-size:9px;gap:7px}#play-icon{font-size:19px}.rewind-button{width:30px;height:46px;font-size:8px;border-right-width:3px;padding:0}.rewind-button>span{font-size:22px}.time-labels{font-size:10px;letter-spacing:0}.timeline-caption{font-size:5px;letter-spacing:.2px;gap:4px}.volume-control{width:43px;padding-left:7px}.volume-control label{font-size:6px;letter-spacing:.2px}input[type=range]{height:26px;margin:3px 0}input[type=range]::-webkit-slider-thumb{width:10px;height:20px;margin-top:-8px}.placeholder-note{font-size:8px;line-height:1.4;margin-top:11px;padding-top:9px}.machine-bottom{font-size:5px;letter-spacing:.5px;margin-top:16px}.transcript{width:calc(100% - 18px);margin:0 9px 4px}.transcript summary{padding:18px 20px 18px 29px}.transcript-title{font-size:16px;letter-spacing:-.8px}.transcript summary .eyebrow{font-size:7px}.transcript-content{padding:0 23px 23px 30px;font-size:12px}.punchcard{width:calc(100% - 14px);margin:8px 7px 0;padding:20px}.punch-title{font-size:22px;letter-spacing:-1.3px;padding-top:14px}.punch-title>span{font-size:10px;right:-1px;top:11px;padding:5px}.punch-heading{font-size:7px}.card-code{font-size:7px}.punch-grid{column-gap:4px}.punch{font-size:9px}.punch-hole{width:12px;height:25px}.punch-foot{font-size:7px}.record-list{padding-left:11px;padding-right:11px}.record-row{gap:8px;padding:13px 8px 13px 4px;min-height:91px}.record-row-title{font-size:11px;letter-spacing:-.5px}.record-row-detail{font-size:5px;letter-spacing:0}.record-serial{font-size:14px;padding-right:6px}.record-marker{font-size:15px}.record-row.active{outline-offset:-3px}.shelf-heading{padding:14px 18px 11px}.shelf-heading h2{font-size:21px}.shelf-heading>span{font-size:9px}.filters{padding-left:19px;gap:22px}.filters button{font-size:10px}.save-note{font-size:8px;padding-left:20px}.empty-player{grid-template-columns:.7fr 1.3fr;gap:7px;min-height:325px;padding:10px 0 24px}.empty-player .sea-photo{margin-left:-8px}.empty-player .sea-photo img{height:239px;border-width:5px}.empty-insert{padding:22px 16px 24px}.empty-insert .eyebrow{font-size:6px}.empty-insert h2{font-size:28px;letter-spacing:-1.5px;margin:12px 0 17px}.empty-insert p{font-size:10px}.empty-stamp{font-size:8px;padding:5px;margin-top:10px}.photo-caption{font-size:5px;left:9px;bottom:14px;padding:4px;letter-spacing:.3px}.notice{font-size:10px;padding:10px 12px;margin-right:2px;margin-left:1px}.footer{font-size:6px;gap:10px;letter-spacing:.3px;padding-top:24px}.footer-divider{padding:0 4px}.admin-heading h1{font-size:33px;letter-spacing:-1.7px}.admin-form{padding:25px 22px 28px}.admin-form h2{font-size:24px}.admin-intro{font-size:11px}.form-field>span{font-size:10px}.form-field input,.form-field select{font-size:12px}.desk-button{font-size:10px;padding:11px 12px}.admin-actions{gap:10px}.qr-sheet{padding:25px 24px}.address-note{font-size:10px}.desk-note{font-size:9px}}
@media(max-width:350px){.record-deck{grid-template-columns:85px minmax(0,1fr);gap:12px}.record-details{padding-left:10px;padding-right:10px}.record-details h2{font-size:20px;letter-spacing:-1.1px}.portrait figcaption{font-size:8px}.transport{gap:8px}.volume-control{width:34px;padding-left:6px}.play-button{width:49px}.rewind-button{width:28px}.punch-title{font-size:19px}.punch-title>span{font-size:9px;top:12px}.punchcard{padding-left:18px;padding-right:18px}.punch-hole{width:10px}.record-row{gap:5px}.record-row-title{font-size:10px}.record-serial{font-size:12px}.record-row-detail{font-size:5px}.page-heading h1{font-size:26px}.machine-header{font-size:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.playing .waveform i{transform:scaleY(.7)}}
@media print{body{background:white!important;color:black!important}body:before,.masthead,.page-heading,.admin-form-area,.preview-tools,.footer,.desk-note,.skip-link{display:none!important}.wrap{width:100%;max-width:none;margin:0}.admin-layout{display:block}.admin-preview{width:100%}.qr-sheet{width:105mm;max-width:none;transform:none;clip-path:none;margin:20mm auto;padding:9mm;background:white!important;color:black!important;box-shadow:none;border:1px solid black;break-inside:avoid}.qr-sheet:before,.qr-sheet:after{display:none}.qr-image{width:65mm;height:65mm;box-shadow:none}.qr-footer,.qr-source,.qr-sheet .eyebrow,.qr-sheet h2{color:black!important}.print-only{display:block;font-size:8px;overflow-wrap:anywhere;margin-top:14px}.qr-sheet h2{font-size:24px}}

.print-filters{position:absolute;pointer-events:none}
.visitor-page h1,.visitor-page .record-details h2,.visitor-page .file-stamp,.visitor-page .punch-title,.visitor-page .shelf-heading h2{filter:url(#worn-ink)}
.photo-assembly{min-width:0}
.wire-reels{display:flex;justify-content:space-around;gap:13px;padding:24px 4px 0;position:relative;transform:rotate(1deg)}
.wire-reels:before{content:'';position:absolute;bottom:8px;left:28px;right:24px;height:1px;background:#967f5344;transform:rotate(3deg)}
.reel{display:block;width:65px;height:65px;border-radius:50%;border:3px solid #848473;box-shadow:0 0 0 2px #11180f,2px 5px 0 #060c07;background:radial-gradient(circle,#b5b098 0 6%,#182016 7% 11%,#b7b199 12% 16%,transparent 17% 66%,#99947b 67% 76%,#33382b 77%),conic-gradient(#191e16 0deg 50deg,#9d9d87 50deg 77deg,#191e16 77deg 170deg,#9d9d87 170deg 197deg,#191e16 197deg 290deg,#9d9d87 290deg 317deg,#191e16 317deg 360deg);position:relative}
.playing .reel{animation:reel-turn 4s linear infinite}
.reel:last-child{transform:rotate(27deg)}
@keyframes reel-turn{to{transform:rotate(360deg)}}
@media(max-width:1100px){.wire-reels{padding-top:20px;gap:8px}.reel{width:52px;height:52px}}
@media(max-width:800px){.wire-reels{padding-top:24px}.reel{width:59px;height:59px}}
@media(max-width:480px){.wire-reels{padding:26px 0 0;gap:11px}.reel{width:39px;height:39px;border-width:2px}.wire-reels:before{left:15px;right:15px;bottom:5px}}
@media(prefers-reduced-motion:reduce){.playing .reel{animation:none}}