:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0e1111;color:#ecf1ee;--bg: #0e1111;--bg-soft: #121717;--line: #2b3432;--line-strong: #3e4d49;--panel: #171d1c;--panel-elevated: #1d2523;--muted: #97a39f;--ink: #ecf1ee;--accent: #29d3bd;--accent-strong: #6ee7f9;--accent-soft: rgba(41, 211, 189, .14);--accent-line: rgba(41, 211, 189, .42);--warn: #fb7185;--warn-soft: rgba(251, 113, 133, .12);--shadow: 0 18px 46px rgba(0, 0, 0, .28)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:linear-gradient(180deg,rgba(41,211,189,.08),transparent 280px),var(--bg)}button,input,select{font:inherit}button{cursor:pointer;transition:border-color .16s ease,background-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}button:disabled{cursor:not-allowed;opacity:.45}.app-shell{width:min(1440px,100%);margin:0 auto;padding:26px}.topbar,.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:22px}.topbar h1,.viewer-header h1{margin:0;font-size:28px;line-height:1.2;letter-spacing:0}.viewer-header h1{max-width:min(72vw,920px);overflow-wrap:anywhere;font-size:20px}.eyebrow{margin:0 0 6px;color:var(--accent-strong);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.top-actions,.toolbar{display:flex;align-items:center;gap:10px}.toolbar{position:sticky;top:10px;z-index:4;flex-wrap:wrap;margin-bottom:18px;border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:10px;background:#121717e0;box-shadow:0 14px 36px #0000003d;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.icon-button,.text-button,.delete-button,.nav-button,.favorite-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;min-width:42px;height:42px;color:var(--ink);background:var(--panel-elevated)}.text-button{gap:8px;width:auto;padding:0 14px}.icon-button:hover,.text-button:hover,.delete-button:hover,.nav-button:hover,.favorite-button:hover{border-color:var(--accent-line);background:#22302d;box-shadow:0 0 0 3px #29d3bd14}.icon-button:active,.text-button:active,.delete-button:active,.nav-button:active,.favorite-button:active,.media-card:active{transform:translateY(1px)}.icon-button:focus-visible,.text-button:focus-visible,.delete-button:focus-visible,.nav-button:focus-visible,.favorite-button:focus-visible,.breadcrumb button:focus-visible,.view-switcher button:focus-visible,.media-card:focus-visible,.open-item:focus-visible,.select-control:focus-within,.search-box:focus-within,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.danger,.delete-button{color:var(--warn)}.breadcrumb{display:flex;flex:1 1 280px;flex-wrap:wrap;align-items:center;gap:4px}.breadcrumb button{border:0;border-radius:6px;padding:8px 9px;color:var(--muted);background:transparent}.breadcrumb button.current{color:var(--ink);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}.breadcrumb button:hover{color:var(--ink);background:#ffffff0d}.collection-title{min-height:42px;padding:0 8px;color:var(--muted)}.view-switcher{display:inline-flex;min-height:42px;border:1px solid var(--line);border-radius:8px;padding:3px;background:#111716}.view-switcher button{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:6px;padding:0 11px;color:var(--muted);background:transparent}.view-switcher button.active{color:var(--ink);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}.view-switcher button:hover{color:var(--ink);background:#ffffff0d}.search-box{display:flex;align-items:center;gap:8px;height:42px;min-width:min(340px,100%);padding:0 12px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:#111716}.search-box input{width:100%;border:0;outline:0;color:var(--ink);background:transparent}.search-box input::placeholder{color:#66726e}select{height:42px;border:1px solid var(--line);border-radius:8px;padding:0 10px;color:var(--ink);background:#111716}.notice{margin:22px 0;color:var(--muted)}.notice.error{color:var(--warn)}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;align-items:stretch}.load-more{display:flex;justify-content:center;padding:22px 0 8px}.media-card{position:relative;display:flex;flex-direction:column;gap:8px;min-height:246px;border:1px solid var(--line);border-radius:8px;padding:10px;text-align:left;color:inherit;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 120px),var(--panel);box-shadow:var(--shadow);overflow:hidden}.media-card.selected{border-color:var(--accent-line);box-shadow:0 0 0 2px #29d3bd2e,var(--shadow)}.media-card:hover{border-color:var(--line-strong);background:linear-gradient(180deg,rgba(41,211,189,.08),transparent 130px),var(--panel-elevated);transform:translateY(-2px)}button.media-card{width:100%}.open-item{display:flex;flex:1;flex-direction:column;gap:8px;border:0;padding:0;text-align:left;color:inherit;background:transparent}.thumb{width:100%;aspect-ratio:4 / 3;border-radius:6px;object-fit:cover;background:#0b0f0f;box-shadow:inset 0 0 0 1px #ffffff0d}.thumb.placeholder{display:grid;place-items:center;color:#73807c}.thumb.folder{color:var(--accent);background:linear-gradient(135deg,#29d3bd2e,#6ee7f914),#111716}.item-title{display:-webkit-box;min-height:42px;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;line-height:1.35;color:var(--ink);font-weight:650}.item-meta{color:var(--muted);font-size:12px}.delete-button{position:absolute;right:10px;bottom:10px;width:36px;height:36px;min-width:36px;background:#111716e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.favorite-button{position:absolute;left:10px;bottom:10px;width:36px;height:36px;min-width:36px;color:var(--muted);background:#111716e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.favorite-button.active{border-color:#fbbf2494;color:#fbbf24;background:#2a2211e6}.select-control{position:absolute;top:10px;left:10px;z-index:2;display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--line);border-radius:8px;background:#111716e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.select-control input{width:17px;height:17px;margin:0;accent-color:var(--accent)}.selection-actions{display:inline-flex;align-items:center;gap:8px;min-height:42px;border:1px solid var(--accent-line);border-radius:8px;padding:0 6px 0 12px;background:var(--accent-soft)}.selection-actions span{color:var(--muted);font-size:13px;white-space:nowrap}.empty-state{grid-column:1 / -1;margin:28px 0;color:var(--muted)}.viewer-shell{display:flex;min-height:100dvh;flex-direction:column;padding:18px 22px;background:linear-gradient(180deg,rgba(41,211,189,.08),transparent 260px),#070909;color:#f6f7f4}.viewer-shell .eyebrow{color:var(--accent-strong)}.viewer-shell .icon-button{border-color:#283230;color:#f6f7f4;background:#181f1de0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.viewer-actions{display:inline-flex;gap:10px}.viewer-shell .favorite-active{border-color:#fbbf2494;color:#fbbf24;background:#2a2211e6}.viewer-stage{position:relative;display:grid;flex:1;place-items:center;min-height:0;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent);overflow:hidden}.viewer-image,.viewer-video{max-width:100%;max-height:calc(100dvh - 110px);border-radius:6px;box-shadow:0 22px 70px #00000080}.viewer-video{width:min(1120px,100%);background:#000}.nav-button{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:56px;border-color:#283230;color:#f6f7f4;background:#121816b8;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.nav-button.left{left:0}.nav-button.right{right:0}.center-message{display:grid;min-height:100dvh;place-items:center;padding:24px;background:var(--bg);color:var(--muted)}.library-layout{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:18px;align-items:start}.collection-list{display:flex;position:sticky;top:90px;flex-direction:column;gap:10px}.collection-row,.article-row{display:flex;width:100%;align-items:flex-start;gap:12px;border:1px solid var(--line);border-radius:8px;padding:13px;text-align:left;color:var(--ink);background:var(--panel)}.collection-row:hover,.article-row:hover,.collection-row.active{border-color:var(--accent-line);background:var(--panel-elevated);box-shadow:0 0 0 3px #29d3bd14}.collection-row span,.article-row span{display:grid;gap:5px;min-width:0}.collection-row strong,.article-row strong{overflow-wrap:anywhere;line-height:1.35}.collection-row small,.article-row small,.article-row em{color:var(--muted);font-size:12px;font-style:normal;line-height:1.45}.library-content{min-width:0}.library-toolbar{position:static;margin-bottom:14px}.article-list{display:grid;gap:10px}.html-frame{display:block;width:100%;height:calc(100dvh - 148px);min-height:620px;border:1px solid var(--line);border-radius:8px;background:#fff}.article-shell{width:min(1080px,100%)}.article-reader{display:grid;gap:20px}.article-meta{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px}.article-meta span,.article-description{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--panel)}.article-description{margin:0;color:var(--muted);line-height:1.7}.article-body{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}.article-body p{margin:0 0 1em;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.95}.image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.image-gallery figure{display:grid;gap:8px;margin:0}.image-gallery img,.image-missing{width:100%;aspect-ratio:4 / 3;border:1px solid var(--line);border-radius:8px;object-fit:contain;background:#080b0b}.image-missing{display:grid;place-items:center;color:var(--muted)}.image-gallery figcaption{color:var(--muted);font-size:12px;overflow-wrap:anywhere}@media(max-width:720px){.app-shell{padding:16px}.topbar,.viewer-header{align-items:flex-start;flex-wrap:wrap}.toolbar{align-items:stretch;top:0}.view-switcher{flex:1 1 100%}.view-switcher button{flex:1;justify-content:center;padding:0 8px}.search-box{flex:1 1 100%}.media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.media-card{min-height:214px;padding:8px}.item-title{min-height:38px;font-size:14px}.viewer-shell{padding:12px}.viewer-header h1{max-width:58vw;font-size:16px}.nav-button{width:42px;height:52px}.library-layout{grid-template-columns:1fr}.collection-list{position:static}.html-frame{min-height:520px}.image-gallery{grid-template-columns:1fr}}