.sn-page { padding-top:30px; padding-bottom:60px; }
.sn-breadcrumb,.sn-reader-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 20px; }
.sn-breadcrumb small { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:12px; }
.sn-breadcrumb > a .ui-icon { transform:rotate(180deg); }
.sn-library.panel { padding:24px; background:var(--cream); border:1px solid var(--line); }
.sn-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.sn-toolbar .y-search { flex:1 1 240px; min-width:0; }
.sn-toolbar input { min-width:0; width:100%; }
.sn-subject { display:flex; align-items:center; gap:8px; font-size:13px; flex:0 1 220px; min-width:0; }
.sn-subject select { flex:1; min-width:0; }
.sn-count { margin:20px 0 15px; font-size:13px; color:var(--muted); }
.sn-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.sn-card { min-width:0; display:flex; flex-direction:column; padding:20px; border:1px solid var(--line); border-radius:18px; background:var(--paper); }
.sn-meta { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.sn-meta time,.sn-reader-meta small { font-size:11px; color:var(--muted); }
.sn-tag { border:1px solid var(--line); border-radius:8px; padding:4px 9px; font-size:12px; color:var(--brand); background:var(--cream); overflow-wrap:anywhere; }
.sn-card h2 { font-family:inherit; font-size:18px; margin:16px 0 8px; line-height:1.5; }
.sn-card h2 button { font:inherit; color:inherit; border:0; padding:0; background:none; cursor:pointer; text-align:left; overflow-wrap:anywhere; }
.sn-chapter { color:var(--muted); font-size:12px; margin:0 0 12px; overflow-wrap:anywhere; }
.sn-preview { white-space:pre-wrap; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; color:var(--muted); font-size:13px; line-height:1.8; margin:0 0 20px; }
.sn-actions { margin-top:auto; padding-top:12px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.sn-actions .y-text-link { border:0; background:none; padding:4px 0; cursor:pointer; }
.sn-empty { text-align:center; padding:48px 16px; }
.sn-empty .y-icon-tile { margin:0 auto 18px; }
.sn-empty h2 { font-size:21px; font-family:inherit; line-height:1.6; }
.sn-empty p { margin:12px 0 22px; color:var(--muted); line-height:1.8; font-size:14px; }
.sn-pagination { display:flex; justify-content:center; align-items:center; gap:16px; padding-top:24px; font-size:13px; }
.sn-editor { min-height:240px; resize:vertical; line-height:1.9; }
.sn-body { white-space:pre-wrap; overflow-wrap:anywhere; font-size:15px; line-height:2; padding:22px 0 28px; border-top:1px solid var(--line); }
.sn-reader .modal-heading { overflow-wrap:anywhere; }
.sn-conflict { padding:14px; margin:12px 0 20px; border:1px solid var(--line); border-radius:12px; background:var(--paper); font-size:13px; }
.sn-conflict[hidden] { display:none; }
.sn-conflict pre { font:inherit; white-space:pre-wrap; overflow-wrap:anywhere; max-height:240px; overflow:auto; padding:12px 0; }
.sn-conflict details { margin:10px 0; }
body[data-page=learning] .wb-tool-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
@media(max-width:1200px) { body[data-page=learning] .wb-tool-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .sn-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { body[data-page=learning] .wb-tool-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .sn-grid { grid-template-columns:1fr; } .sn-library.panel { padding:18px; } .sn-toolbar { gap:10px; } .sn-toolbar .y-search { flex-basis:100%; } .sn-subject { flex:1; } .sn-card { padding:18px; } .sn-page .y-page-head { align-items:flex-start; flex-wrap:wrap; gap:16px; } }
@media(max-width:390px) { .sn-library.panel { padding:14px; } .sn-breadcrumb { flex-wrap:wrap; } .sn-reader-meta { align-items:flex-start; flex-wrap:wrap; } .sn-pagination { gap:10px; } }