*{box-sizing:border-box}body{margin:0;background:#f5f1e8;color:#25362e;font-family:system-ui,sans-serif}header{padding:26px 24px;background:#182139;color:#faf7ef;border-bottom:3px solid #b89b61}header small{letter-spacing:.18em;color:#d6c7a6}h1{font-family:serif;font-size:26px;margin:10px 0}header p{font-size:14px;line-height:1.8;margin-bottom:0}.controls{max-width:1200px;margin:22px auto;padding:0 20px}.controls label{display:block;font-weight:600;margin-bottom:10px}input{font:inherit;padding:10px;max-width:100%}#status{line-height:1.8;font-size:14px}main{max-width:1200px;margin:0 auto 36px;padding:0 20px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px}aside,article{background:#fffdf8;border:1px solid #ddd5c5;border-radius:16px;padding:18px}#search{width:100%;border:1px solid #ddd5c5;border-radius:8px;margin-bottom:14px}#list{display:grid;gap:8px}button{font:inherit;cursor:pointer;text-align:left;border:1px solid #e2dccf;background:#f8f5ee;border-radius:10px;padding:12px;color:#25362e}button.active{border-color:#477660;background:#eaf2eb}button small{display:block;font-size:11px;color:#79766d;margin-top:6px;overflow-wrap:anywhere}#path{font-size:12px;color:#79766d;overflow-wrap:anywhere}h2{font:600 22px/1.6 serif;margin:10px 0}iframe{width:100%;height:70vh;border:0;background:white;border-radius:10px}#empty{padding:50px 12px;color:#79766d;line-height:1.8}#image-count{font-size:13px;color:#79766d}#image-strip{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}#image-strip img{width:85px;height:100px;object-fit:contain;background:white;border:1px solid #e2dccf}footer{padding:16px;font-size:12px;color:#79766d;text-align:center}@media(max-width:700px){main{grid-template-columns:1fr}iframe{height:65vh}header{padding:22px 20px}}

.source-body{font:16px/1.85 system-ui,sans-serif;color:#25362e;max-height:75vh;overflow:auto;padding:14px;background:white;border:1px solid #ebe5d9;border-radius:10px;overflow-wrap:anywhere}
.source-body p{margin:0 0 .9em}.source-body p:empty{display:none}.source-body span{color:inherit}
.source-body img{display:block;max-width:100%;height:auto;margin:15px auto;cursor:zoom-in}
.source-body table{display:block;overflow-x:auto;border-collapse:collapse;font-size:14px}.source-body th,.source-body td{border:1px solid #ddd;padding:8px}
#image-strip img{cursor:zoom-in}dialog{width:96vw;max-width:1200px;height:92vh;padding:14px;border:0;border-radius:14px;background:#f6f2e9}dialog::backdrop{background:#101727c9}
.zoom-tools{display:flex;gap:8px;margin-bottom:12px}.zoom-tools button:last-child{margin-left:auto}
#zoom-area{height:calc(100% - 65px);overflow:auto;background:#e7e2d8;padding:12px}#zoom-image{display:block;width:100%;max-width:none;height:auto;margin:auto}
.archive-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.archive-controls{background:#fffdf8;padding:20px;border:1px solid #ddd5c5;border-radius:16px}.archive-actions select{min-width:180px;max-width:100%;flex:1;font:inherit;padding:11px;border:1px solid #ddd5c5;border-radius:8px;background:white;color:#25362e}button:disabled{opacity:.5;cursor:default}.storage-note{font-size:12px;color:#79766d;line-height:1.8}#save-status{font-size:14px;line-height:1.8}

[hidden]{display:none!important}.back{display:block;color:#eadbb7;margin-bottom:16px}#auth-status{padding:40px}button:focus-visible,a:focus-visible{outline:3px solid #b89b61}

.notes-panel{min-width:0}.section-label{color:#92763f;letter-spacing:.15em}.notes-panel h2{font-size:21px}
#note-list{display:grid;gap:8px;max-height:190px;overflow:auto;margin:18px 0}#note-list p{color:#79766d;font-size:13px}
#note-fields{border:0;margin:0;padding:0;min-width:0}#note-fields legend{font-size:13px;color:#79766d;margin-bottom:12px}
#note-fields label{display:block;font-size:14px;font-weight:600;margin:14px 0 7px}
#note-fields input,#note-fields select,#note-fields textarea{width:100%;font:inherit;color:inherit;background:white;border:1px solid #ddd5c5;border-radius:8px;padding:10px}
#note-body{min-height:300px;resize:vertical;line-height:1.8}.note-selects{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#note-status{font-size:14px;line-height:1.8;overflow-wrap:anywhere}#note-source{overflow-wrap:anywhere}
#note-save{background:#253e33;color:#fffdf8}#note-fields:disabled{opacity:.6}
@media(min-width:1150px){main{max-width:1600px;grid-template-columns:230px minmax(0,1fr) minmax(340px,.9fr)}.controls{max-width:1600px}.notes-panel{position:sticky;top:18px;align-self:start;max-height:93vh;overflow:auto}#note-body{min-height:28vh}}
@media(min-width:701px) and (max-width:1149px){.notes-panel{grid-column:1/-1}}