:root{--ocean:#1a4a6b;--ocean-mid:#2d7aa8;--ocean-light:#6ab4d8;--ocean-pale:#d4eaf5;--sand:#e8d9c0;--sand-light:#f5ede0;--marsh:#5a8a6a;--foam:#f0f8ff;--driftwood:#7a5c42;--text:#1a2535;--text-muted:#4a6275;--text-light:#8aabb8;--border:#b8d4e4;--white:#fff;--red:#b03030;--shadow:0 2px 16px rgba(20,60,90,.10);--radius:10px;--radius-lg:16px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Georgia,serif;background:var(--sand-light);color:var(--text);min-height:100vh;font-size:15px}button,input,select,textarea{font:inherit}.hidden{display:none!important}h1,h2,h3,h4{font-weight:400}#login-view{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(170deg,var(--ocean),var(--ocean-mid) 45%,var(--marsh));padding:20px}.login-card{background:var(--white);border-radius:var(--radius-lg);padding:48px 40px;width:100%;max-width:380px;text-align:center;box-shadow:0 12px 48px rgba(10,40,70,.35)}.logo-big{font-size:28px;color:var(--ocean);margin-bottom:4px;letter-spacing:1px}.logo-big span,.topbar .logo span{color:var(--marsh);font-style:italic}.login-card .sub{font-size:13px;color:var(--text-muted);margin-bottom:28px;font-family:sans-serif}.login-card input{width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--radius);margin-bottom:16px;background:var(--sand-light);color:var(--text)}.login-card p{font-size:11px;color:var(--text-light);margin-top:20px;font-family:sans-serif}.topbar{background:linear-gradient(90deg,var(--ocean),var(--ocean-mid));color:var(--foam);display:flex;align-items:center;gap:16px;padding:0 24px;height:56px;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(20,60,90,.25)}.topbar .logo{font-size:20px;letter-spacing:.5px;flex:1;display:flex;align-items:center;gap:10px}.topbar .logo span{color:var(--ocean-light)}.user-info{font-size:13px;color:var(--ocean-pale)}.nav{background:var(--ocean);display:flex;padding:0 12px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.08)}.nav-btn{background:none;border:none;color:rgba(255,255,255,.72);padding:10px 14px;cursor:pointer;font-family:sans-serif;font-size:13px;border-bottom:3px solid transparent;display:flex;align-items:center;gap:6px}.nav-btn:hover{color:#fff;background:rgba(255,255,255,.07)}.nav-btn.active{border-bottom-color:var(--ocean-light);color:var(--ocean-light)}.main{padding:24px;max-width:1260px;margin:0 auto;width:100%}.page{display:none}.page.active{display:block}.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px}.page-header h2{font-size:22px;color:var(--ocean)}.sub{font-size:13px;color:var(--text-muted);margin-top:2px;font-family:sans-serif}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.search-bar{display:flex;align-items:center;gap:8px;background:var(--white);border:1.5px solid var(--border);border-radius:var(--radius);padding:7px 12px;flex:1;max-width:340px}.search-bar input{border:none;background:none;outline:none;flex:1;font-size:13px}.btn-primary,.btn-sm,.btn-ghost,.btn-danger,.btn-marsh{border:none;border-radius:8px;cursor:pointer;font-family:sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:5px;transition:.15s}.btn-primary{background:var(--ocean);color:var(--foam);padding:12px 28px;width:100%;font-size:14px}.btn-sm{background:var(--ocean);color:var(--foam);padding:7px 14px;font-size:12px}.btn-marsh{background:var(--marsh);color:#fff;padding:7px 14px;font-size:12px}.btn-ghost{background:none;border:1.5px solid var(--border);padding:7px 14px;font-size:12px;color:var(--text-muted)}.btn-danger{background:var(--red);color:#fff;padding:7px 12px;font-size:12px}.btn-sm:hover,.btn-primary:hover{background:var(--ocean-mid)}.btn-marsh:hover{background:#3d6b50}.btn-ghost:hover{border-color:var(--ocean-light);color:var(--text)}.btn-on-dark{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.25)}.grid,.seq-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.card,.seq-card,.person-card,.panel,.anecdote-card{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--border)}.card,.seq-card,.person-card,.anecdote-card{overflow:hidden;cursor:pointer;transition:.2s}.card:hover,.seq-card:hover,.person-card:hover,.anecdote-card:hover{box-shadow:var(--shadow);border-color:var(--ocean-light);transform:translateY(-2px)}.card-thumb,.seq-thumb{width:100%;aspect-ratio:16/9;background:var(--sand);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.card-thumb img,.seq-thumb img{width:100%;height:100%;object-fit:cover}.seq-thumb.bw img{filter:grayscale(100%)}.duration-badge,.origin-badge,.ts-badge,.dur-badge,.bw-flag{position:absolute;background:rgba(10,30,50,.78);color:#fff;font-size:11px;border-radius:5px;padding:2px 7px;font-family:sans-serif}.duration-badge,.dur-badge{bottom:6px;right:8px}.origin-badge{top:6px;left:8px;background:var(--ocean-mid)}.ts-badge{bottom:6px;left:8px;font-family:monospace}.bw-flag{top:6px;right:8px}.card-body,.seq-card-body{padding:12px 14px}.card-body h4,.seq-card-body h4{font-size:14px;margin-bottom:4px;line-height:1.35}.meta{font-size:11px;color:var(--text-muted);font-family:sans-serif;display:flex;gap:8px;flex-wrap:wrap}.actions{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}.tag-pill{display:inline-flex;align-items:center;gap:4px;background:var(--ocean-pale);border:1px solid var(--border);border-radius:20px;padding:2px 9px;font-size:11px;font-family:sans-serif;color:var(--ocean)}.tag-pill button{background:none;border:none;cursor:pointer;color:inherit}.tag-pill.clickable{cursor:pointer}.tag-pill.active-tag{background:var(--ocean-mid);border-color:var(--ocean);color:#fff}.filters-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:20px;padding:12px 14px;background:var(--white);border-radius:var(--radius);border:1px solid var(--border)}select,input,textarea{border:1.5px solid var(--border);border-radius:8px;background:var(--foam);color:var(--text);padding:8px 10px}textarea{resize:vertical}.player-layout,.map-layout,.anecdote-edit-layout{display:grid;grid-template-columns:1fr 300px;gap:20px}.person-edit-layout{display:grid;grid-template-columns:220px 1fr;gap:24px}.player-frame{width:100%;aspect-ratio:16/9;background:#0a1a2a;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:16px}.player-frame iframe{width:100%;height:100%;border:0}.panel{padding:18px}.seq-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer}.seq-item:hover,.seq-item.active-seq{background:var(--ocean-pale)}.seq-item .ts{font-size:11px;font-family:monospace;color:var(--ocean-mid);min-width:42px}.inline-form{display:grid;grid-template-columns:1fr 80px 80px auto;gap:8px;align-items:end}.form-row{margin-bottom:14px}.form-row label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:5px;font-family:sans-serif}.overlay{position:fixed;inset:0;background:rgba(10,25,40,.6);z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}.modal{background:var(--white);border-radius:var(--radius-lg);padding:28px 32px;width:100%;max-width:560px;max-height:90vh;overflow:auto;box-shadow:0 16px 48px rgba(10,30,60,.22)}.modal h3{font-size:18px;color:var(--ocean);margin-bottom:20px}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;flex-wrap:wrap}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.person-card{padding:18px 14px;text-align:center}.avatar,.avatar-lg{border-radius:50%;background:var(--ocean-pale);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ocean-mid);overflow:hidden;margin:0 auto 10px}.avatar{width:72px;height:72px;font-size:22px}.avatar-lg{width:120px;height:120px;font-size:36px}.avatar img,.avatar-lg img{width:100%;height:100%;object-fit:cover}.person-name{font-size:13px;font-weight:700;color:var(--ocean)}.person-role{font-size:11px;color:var(--text-muted);font-family:sans-serif}.anecdote-card{padding:18px 20px;margin-bottom:14px;position:relative}.anecdote-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ocean-mid)}.anecdote-title{font-size:16px;color:var(--ocean);margin-bottom:6px}.anecdote-excerpt{font-size:13px;color:var(--text-muted);font-family:sans-serif;line-height:1.5}.anecdote-view-wrap{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--border);padding:32px;max-width:760px}.map-box{background:var(--ocean-pale);border-radius:var(--radius-lg);border:2px dashed var(--border);aspect-ratio:4/3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--text-muted);font-family:sans-serif}.empty{text-align:center;padding:40px;color:var(--text-light);font-family:sans-serif;font-size:13px}.divider{border:0;border-top:1px solid var(--border);margin:18px 0}.toast{position:fixed;right:18px;bottom:18px;background:var(--ocean);color:#fff;padding:10px 14px;border-radius:8px;font-family:sans-serif;font-size:13px;z-index:300}@media(max-width:800px){.main{padding:16px}.player-layout,.map-layout,.anecdote-edit-layout,.person-edit-layout{grid-template-columns:1fr}.inline-form{grid-template-columns:1fr 1fr}.inline-form button{grid-column:1/-1}.topbar{padding:0 14px}.user-info{display:none}}
.leaflet-map{width:100%;height:clamp(360px,58vh,540px);border-radius:var(--radius-lg);border:1px solid var(--border);overflow:hidden;background:var(--ocean-pale)}
.leaflet-container{font-family:Arial,sans-serif;position:relative;overflow:hidden}
.leaflet-container img{width:auto;height:auto;object-fit:initial}
.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane>svg,.leaflet-pane>canvas{position:absolute;left:0;top:0}.leaflet-tile{user-select:none;-webkit-user-drag:none}.leaflet-container .leaflet-overlay-pane svg{max-width:none!important;max-height:none!important}.leaflet-control{position:relative;z-index:800;pointer-events:auto}.leaflet-top,.leaflet-bottom{position:absolute;z-index:1000;pointer-events:none}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}.leaflet-control{float:left;clear:both}.leaflet-right .leaflet-control{float:right}.leaflet-top .leaflet-control{margin-top:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{margin-right:10px}
.active-map-layer{background:var(--ocean-pale);border-color:var(--ocean-mid);color:var(--ocean)}.map-hint{display:flex;align-items:flex-start;gap:8px;background:var(--ocean-pale);border:1px solid var(--border);border-radius:8px;padding:9px 10px;color:var(--text-muted);font-family:sans-serif;font-size:12px;line-height:1.35}.leaflet-tooltip{font-family:Arial,sans-serif;font-size:12px}
.map-save-btn{width:100%;margin-top:12px}.map-marker{display:flex;align-items:center;justify-content:center;background:transparent;border:0}.map-marker svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 4px rgba(0,0,0,.45))}.map-marker svg path{stroke:#fff;stroke-width:2.4px}.map-marker svg circle{fill:#fff}.map-marker-edit svg path{fill:#0b75c9}.map-marker-saved svg path{fill:var(--marsh)}
@media(max-width:800px){.leaflet-map{height:380px}}
.person-photo-panel{display:flex;flex-direction:column;align-items:center;gap:10px}.crop-wrap{width:100%;margin-top:10px}.crop-wrap img{display:block;max-width:100%;max-height:320px}.cropper-view-box,.cropper-face{border-radius:50%}
.genealogy-area{margin-top:24px}.genealogy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.kinship-panel{grid-column:1/-1}.inline-link-form{display:grid;grid-template-columns:minmax(0,1fr)150px auto;gap:8px;align-items:center;margin:12px 0}.link-list{display:grid;gap:8px}.link-row,.kinship-row,.panel-title-row{display:flex;align-items:center;gap:10px}.link-row{background:var(--foam);border:1px solid var(--border);border-radius:8px;padding:8px}.link-row span,.kinship-row span{flex:1}.link-row select{max-width:160px}.kinship-row{border-bottom:1px solid var(--border);padding:9px 0;font-family:sans-serif;font-size:13px}.kinship-row:last-child{border-bottom:0}.kinship-row strong{color:var(--ocean);font-weight:700}.panel-title-row{justify-content:space-between;margin-bottom:8px}.empty.compact{padding:14px}
.profile-view-layout{display:grid;grid-template-columns:220px 1fr;gap:24px}.profile-name{font-size:24px;color:var(--ocean);margin-bottom:14px}.profile-facts{display:flex;flex-direction:column;gap:10px}.profile-fact{display:flex;align-items:center;gap:9px;font-family:sans-serif;color:var(--text-muted)}.profile-fact i{color:var(--ocean-mid)}.profile-note{border-top:1px solid var(--border);margin-top:8px;padding-top:14px;line-height:1.55;white-space:pre-wrap}.admin-badge{display:inline-flex;align-items:center;justify-content:center;gap:5px;background:var(--marsh);color:#fff;border-radius:20px;padding:3px 9px;font-family:sans-serif;font-size:11px;margin-top:6px}.check-row{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-family:sans-serif;font-size:13px;color:var(--text-muted)}.check-row input{width:auto}
.chapter-panel{margin-top:0}.chapter-panel input,.chapter-panel textarea{width:100%}.chapter-layout{display:grid;grid-template-columns:minmax(0,1fr)320px;gap:18px;align-items:start}.chapter-main-fields{min-width:0}.chapter-time-row{display:grid;grid-template-columns:130px 130px minmax(180px,1fr);gap:12px}.time-field input{text-align:center}.chapter-association-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.chapter-location-grid{display:grid;grid-template-columns:minmax(280px,1fr)150px 150px;gap:12px}.suggest-row{display:flex;gap:8px}.suggest-row input{min-width:0;flex:1}.chapter-illustration{display:flex;flex-direction:column;gap:10px}.chapter-image-box{aspect-ratio:16/9;background:var(--foam);border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}.chapter-image-box img{width:100%;height:100%;object-fit:cover}.wait-modal{max-width:420px}.wait-box,.wait-error{display:flex;align-items:center;gap:12px;padding:12px 0;font-family:sans-serif;color:var(--text-muted)}.wait-error{color:var(--red)}.wait-spinner{width:22px;height:22px;border:3px solid var(--ocean-pale);border-top-color:var(--ocean-mid);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.compact-map{height:320px}.seq-item.active-seq{background:var(--ocean-pale);border:1px solid var(--ocean-light)}.seq-item small{margin-left:auto;color:var(--text-light);font-family:sans-serif;font-size:11px;white-space:nowrap}.location-modal{max-width:760px}
@media(max-width:800px){.genealogy-grid{grid-template-columns:1fr}.inline-link-form{grid-template-columns:1fr}.link-row{align-items:stretch;flex-direction:column}.link-row select{max-width:none}.panel-title-row{align-items:flex-start;flex-direction:column}}
@media(max-width:800px){.chapter-layout,.chapter-time-row,.chapter-association-grid,.chapter-location-grid{grid-template-columns:1fr}.suggest-row{align-items:stretch}.compact-map{height:280px}}
@media(max-width:800px){.profile-view-layout{grid-template-columns:1fr}}
.user-profile-button{width:38px;height:38px;border:1.5px solid rgba(255,255,255,.32);border-radius:50%;background:rgba(255,255,255,.08);padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;flex:0 0 auto}.user-profile-button:hover{border-color:var(--ocean-light);background:rgba(255,255,255,.16)}.topbar-avatar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--foam);font-size:19px}.topbar-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.watch-layout{display:grid;grid-template-columns:minmax(0,1fr)340px;gap:20px}.watch-chapters{align-self:start;position:sticky;top:76px}.watch-detail-panel{margin-top:16px}.watch-detail-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px}.watch-detail-head h3{font-size:20px;color:var(--ocean);margin-top:6px}.watch-description{line-height:1.55;color:var(--text);margin:12px 0 16px;white-space:pre-wrap}.watch-facts{display:grid;gap:10px}.watch-fact{display:flex;align-items:flex-start;gap:9px;font-family:sans-serif;color:var(--text-muted)}.watch-fact i{color:var(--ocean-mid);margin-top:2px}.watch-fact span{display:flex;gap:6px;flex-wrap:wrap}.watch-fact small{display:block;width:100%;color:var(--text-light);font-size:11px;margin-top:2px}.watch-anecdotes{border-top:1px solid var(--border);margin-top:18px;padding-top:16px}.watch-anecdotes h4{color:var(--ocean);font-size:15px;margin-bottom:10px}.watch-anecdote{background:var(--foam);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:8px}.watch-anecdote strong{display:block;color:var(--ocean);font-size:13px;margin-bottom:4px}.watch-anecdote p{font-family:sans-serif;font-size:12px;line-height:1.45;color:var(--text-muted)}
.unsaved-pill{display:inline-flex;align-items:center;border:1px solid #d7a331;background:#fff5d6;color:#8a5b00;border-radius:20px;padding:3px 9px;font-family:sans-serif;font-size:11px}
.tag-admin{display:grid;gap:10px}.tag-admin-row{display:grid;grid-template-columns:auto minmax(160px,1fr)auto auto;gap:8px;align-items:center;background:var(--foam);border:1px solid var(--border);border-radius:8px;padding:8px}
@media(max-width:800px){.watch-layout{grid-template-columns:1fr}.watch-chapters{position:static}}
@media(max-width:800px){.tag-admin-row{grid-template-columns:1fr}.tag-admin-row .tag-pill{justify-self:start}}