
.nweb-empty{padding:14px;background:#fff4f4;border:1px solid #efcaca;border-radius:14px}
.nweb-archive-filter{margin:0 0 18px}
.nweb-filter-bar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:16px 18px;border:1px solid rgba(34,113,177,.14);border-radius:18px;background:rgba(255,255,255,.82);backdrop-filter:blur(10px);box-shadow:0 8px 30px rgba(15,23,42,.06)}
.nweb-filter-bar label{display:flex;flex-direction:column;gap:8px;font-weight:600}
.nweb-filter-bar select{min-width:220px;padding:10px 12px;border:1px solid #cfd3d7;border-radius:12px;background:#fff}
.nweb-clear-filter{text-decoration:none;padding:10px 14px;border:1px solid #cfd3d7;border-radius:12px;color:#111827;background:#fff}
.nweb-archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}
.nweb-card{background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 28px rgba(15,23,42,.08);overflow:hidden;border-radius:20px;transition:transform .25s ease, box-shadow .25s ease}
.nweb-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(15,23,42,.14)}
.nweb-card-link{text-decoration:none;color:inherit;display:block}
.nweb-card-thumb img,.nweb-card-thumb-empty{width:100%;height:300px;object-fit:cover;display:flex;align-items:center;justify-content:center;background:#f2f2f2}
.nweb-card-body{padding:14px}
.nweb-card-body h3{margin:0 0 8px;font-size:18px}
.nweb-card-meta{color:#666;margin-bottom:6px}
.nweb-card-cats,.nweb-viewer-cats{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.nweb-card-cat,.nweb-viewer-cat{display:inline-flex;align-items:center;padding:6px 10px;border:1px solid rgba(34,113,177,.18);border-radius:999px;background:rgba(34,113,177,.08);color:#12466d;font-size:12px;font-weight:700}
.nweb-viewer{background:#fff;border:1px solid rgba(15,23,42,.08);padding:16px;border-radius:24px;box-shadow:0 10px 30px rgba(15,23,42,.08)}
.nweb-viewer-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.nweb-title-box{display:flex;align-items:center;gap:12px}
.nweb-logo-box img{max-height:70px;width:auto;display:block}
.nweb-title{margin:0;font-size:24px}
.nweb-sub{color:#666}
.nweb-nav-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nweb-nav-btn,.nweb-page-tab,.nweb-thumb,.nweb-zoom-btn{padding:8px 12px;border:1px solid #cfd3d7;background:#fff;cursor:pointer;border-radius:12px;transition:all .2s ease}
.nweb-nav-btn:hover,.nweb-page-tab:hover,.nweb-thumb:hover,.nweb-zoom-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(15,23,42,.08)}
.nweb-page-strip{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.nweb-page-tab.active,.nweb-thumb.active{background:#2271b1;color:#fff;border-color:#2271b1}
.nweb-main{display:grid;grid-template-columns:130px 1fr;gap:16px}
.nweb-sidebar{display:flex;flex-direction:column;gap:8px}
.nweb-page{display:none}
.nweb-page.active{display:block}

.nweb-canvas{position:relative;width:100%;max-width:1100px;height:1550px;margin:0 auto;background:#fff;border:1px solid #ddd;box-shadow:0 2px 8px rgba(0,0,0,.12);overflow:hidden;border-radius:0;isolation:isolate;transform:translateZ(0)}
.nweb-section{--mx:50%;--my:50%;position:absolute;background-size:cover;background-position:center;background-repeat:no-repeat;cursor:pointer;border:1px solid transparent;border-radius:0;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,filter .18s ease;z-index:30;overflow:hidden;backface-visibility:hidden}
.nweb-section::before{content:"";position:absolute;inset:0;border:2px solid #d32f2f;opacity:0;transition:opacity .14s ease;pointer-events:none;box-sizing:border-box}
.nweb-section::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.08) 26%,rgba(255,255,255,0) 55%);opacity:0;transition:opacity .14s ease;pointer-events:none}
.nweb-section.is-active-hover{transform:scale(1.01);box-shadow:0 0 0 1px rgba(211,47,47,.35);z-index:40}
.nweb-section.is-active-hover::before,.nweb-section.is-active-hover::after{opacity:1}

.nweb-popup[hidden]{display:none}
.nweb-popup{position:fixed;inset:0;z-index:999999}
.nweb-popup-overlay{position:absolute;inset:0;background:rgba(6,10,18,.75);backdrop-filter:blur(8px)}
.nweb-popup-box{position:relative;z-index:2;width:min(96vw,1200px);margin:24px auto;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);padding:16px;border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.nweb-popup-close{position:absolute;top:8px;right:8px;width:36px;height:36px;border:none;background:#d63638;color:#fff;font-size:24px;cursor:pointer;border-radius:999px}
.nweb-popup-tools{display:flex;justify-content:center;gap:8px;margin-bottom:12px}
.nweb-popup-image-wrap{max-height:80vh;overflow:auto;text-align:center}
.nweb-popup-image{max-width:100%;transform-origin:center center;transition:transform .2s ease;border-radius:14px}
body.nweb-popup-open{overflow:hidden}

@keyframes nwebBorderMove{0%{background-position:0% 50%}100%{background-position:200% 50%}}

@media (max-width:900px){.nweb-main{grid-template-columns:1fr}.nweb-sidebar{flex-direction:row;flex-wrap:wrap}.nweb-canvas{height:1000px}}
