/* WOC App Core 2.2 — reading studio, clipping and navigable long reads */
:root{--woc22-accent:#b82029;--woc22-shadow:0 16px 50px rgba(9,15,22,.13)}
.woc22-home-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 19px;padding:14px 16px;border:1px solid var(--line,#e8e8e8);border-radius:18px;background:var(--surface-solid,#fff);box-shadow:0 3px 18px rgba(13,22,36,.045)}
.woc22-home-bar[hidden]{display:none!important}
.woc22-home-copy{display:flex;align-items:center;gap:12px;min-width:0}
.woc22-home-icon{width:42px;height:42px;flex:none;border-radius:13px;background:var(--surface-soft,#f8f1f1);display:grid;place-items:center;color:var(--red,#bb252f)}
.woc22-home-icon svg,.woc22-reader-actions svg,.woc22-reader-reading svg,.woc22-empty svg,.woc22-clip-toolbar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.woc22-home-copy>div:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.woc22-home-copy small{font-size:10px;letter-spacing:.075em;text-transform:uppercase;color:var(--red,#bb252f);font-weight:850}
.woc22-home-copy strong{font-size:16px;letter-spacing:-.35px;line-height:1.15;color:var(--text,#191919)}
.woc22-home-copy span{font-size:11px;color:var(--muted,#757575);line-height:1.4}
.woc22-home-bar>button{border:0;white-space:nowrap;cursor:pointer;border-radius:12px;padding:11px 13px;font-size:12px;font-weight:900;color:#fff;background:var(--red,#ba2630);min-height:41px}
.woc22-home-bar>button span{margin-left:5px}
body.woc22-hub-open{overflow:hidden}
.woc22-hub{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:flex-end;justify-content:center}
.woc22-hub[hidden]{display:none!important}
.woc22-backdrop{position:absolute;inset:0;background:rgba(10,15,22,.54);backdrop-filter:blur(5px)}
.woc22-sheet{position:relative;z-index:1;display:flex;flex-direction:column;width:min(710px,100%);max-height:min(94dvh,940px);height:min(88dvh,850px);border-radius:26px 26px 0 0;background:var(--bg,#fff);color:var(--text,#111);border:1px solid var(--line,#ddd);box-shadow:0 24px 80px rgba(0,0,0,.20);overflow:hidden;padding-bottom:env(safe-area-inset-bottom,0px)}
.woc22-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:24px 22px 16px}
.woc22-sheet-head small{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--red,#b7222a)}
.woc22-sheet-head h2{font-size:26px;line-height:1.05;letter-spacing:-.8px;margin:6px 0 0;font-weight:950;color:var(--text,#111)}
.woc22-x{width:39px;height:39px;display:grid;place-items:center;flex:none;border:1px solid var(--line,#ddd);border-radius:12px;background:var(--surface-solid,#fff);color:var(--text,#111);font-size:26px;cursor:pointer}
.woc22-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 20px 14px;padding:4px;border-radius:13px;background:var(--surface-soft,#f6f6f7)}
.woc22-tabs::-webkit-scrollbar{display:none}
.woc22-tabs button{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:5px;border:0;background:transparent;border-radius:10px;color:var(--muted,#5a5a5a);font-size:12px;font-weight:850;padding:11px 10px;cursor:pointer}
.woc22-tabs button.active{background:var(--surface-solid,#fff);color:var(--text,#111);box-shadow:0 2px 9px rgba(0,0,0,.08)}
.woc22-tabs button b{font-size:10px;padding:2px 6px;background:var(--surface-soft,#eee);border-radius:99px}
.woc22-sheet-body{flex:1;overflow:auto;overscroll-behavior:contain;padding:0 20px 26px;scrollbar-width:thin}
.woc22-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 0 15px}
.woc22-stats>div{border:1px solid var(--line,#e1e1e1);border-radius:15px;padding:13px 8px;background:var(--surface-solid,#fff);text-align:center}
.woc22-stats strong{display:block;font-size:23px;line-height:1;letter-spacing:-.7px;font-weight:950}
.woc22-stats span{display:block;margin-top:6px;font-size:10px;color:var(--muted,#666);font-weight:750}
.woc22-intro{padding:2px 1px 14px;color:var(--muted,#666);font-size:12px;line-height:1.55}
.woc22-card{display:grid;gap:12px;padding:17px 16px;border-radius:17px;border:1px solid var(--line,#ddd);background:var(--surface-solid,#fff);margin-bottom:9px}
.woc22-card small,.woc22-note small{color:var(--red,#b7222a);font-size:10px;font-weight:900;line-height:1.4;letter-spacing:.015em}
.woc22-card h3{margin:6px 0 0;color:var(--text,#111);line-height:1.28;font-size:15px;letter-spacing:-.2px}
.woc22-card-actions{display:flex;gap:7px;flex-wrap:wrap}
.woc22-card-actions button,.woc22-note-actions button{border:0;border-radius:10px;min-height:36px;padding:8px 14px;color:#fff;background:var(--red,#b7222a);font-size:11px;font-weight:900;cursor:pointer}
.woc22-card-actions button.woc22-ghost,.woc22-note-actions button.woc22-ghost{border:1px solid var(--line,#ddd);background:var(--surface-soft,#fafafa);color:var(--text,#111)}
.woc22-bar{height:4px;border-radius:6px;overflow:hidden;background:var(--line,#ddd);margin:11px 0 0}
.woc22-bar i{display:block;height:100%;background:var(--red,#b7222a);border-radius:6px}
.woc22-note{border:1px solid var(--line,#ddd);background:var(--surface-solid,#fff);border-radius:16px;padding:15px;margin:0 0 10px}
.woc22-note blockquote{margin:9px 0 13px;padding:1px 0 1px 12px;border-left:3px solid var(--red,#b7222a);color:var(--text,#111);font-size:14px;line-height:1.58;font-family:ui-serif,Georgia,serif;white-space:pre-wrap;overflow-wrap:anywhere}
.woc22-note-actions{display:flex;gap:7px;flex-wrap:wrap}
.woc22-note-actions button{background:var(--surface-soft,#f4f4f4);color:var(--text,#111);border:1px solid var(--line,#ddd)}
.woc22-empty{display:grid;place-items:center;padding:42px 24px;text-align:center;border:1px dashed var(--line,#ddd);border-radius:18px;background:var(--surface-soft,#fafafa)}
.woc22-empty svg{width:40px;height:40px;color:var(--red,#b7222a)}
.woc22-empty h3{font-size:17px;margin:15px 0 6px;color:var(--text,#111)}
.woc22-empty p{font-size:12px;color:var(--muted,#666);line-height:1.55;max-width:310px;margin:0}
.woc22-reader-tools{border-top:1px solid var(--line,#ddd);border-bottom:1px solid var(--line,#ddd);margin:14px 0 25px;padding:11px 0;display:grid;gap:10px}
.woc22-reader-topline{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:9px}
.woc22-reader-reading{display:inline-flex;align-items:center;gap:6px;color:var(--muted,#666);font-size:11.5px}
.woc22-reader-reading svg{width:16px;height:16px}
.woc22-reader-actions{display:flex;gap:6px;flex-wrap:wrap}
.woc22-reader-actions button{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line,#ddd);border-radius:9px;padding:8px 9px;min-height:35px;font-size:11px;background:var(--surface-soft,#fafafa);color:var(--text,#111);font-weight:850;cursor:pointer}
.woc22-reader-actions button[aria-pressed="true"]{color:var(--red,#b7222a);border-color:var(--red,#b7222a)}
.woc22-reader-actions svg{width:15px;height:15px}
.woc22-toc{border-radius:13px;background:var(--surface-soft,#fafafa);border:1px solid var(--line,#ddd);overflow:hidden}
.woc22-toc summary{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:12px 13px;cursor:pointer;font-weight:900;font-size:12px;list-style:none;color:var(--text,#111)}
.woc22-toc summary::-webkit-details-marker{display:none}
.woc22-toc summary span{font-weight:650;font-size:11px;color:var(--muted,#777)}
.woc22-toc nav{display:flex;flex-direction:column;gap:3px;border-top:1px solid var(--line,#ddd);padding:7px}
.woc22-toc nav button{display:block;width:100%;padding:10px 11px;text-align:left;border:0;background:transparent;border-radius:9px;color:var(--text,#111);font-size:12px;line-height:1.5;cursor:pointer}
.woc22-toc nav button.sub{padding-left:23px;color:var(--muted,#666)}
.woc22-toc nav button:focus-visible,.woc22-toc nav button:hover{background:var(--surface-solid,#fff)}
#woc22Prefs{margin:13px 0 0;border-top:1px solid var(--line,#ddd);padding-top:14px}
.woc22-reader-pref-row{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px;font-weight:750;margin:10px 0;color:var(--text,#111)}
.woc22-reader-pref-row input{width:110px;max-width:40%;accent-color:var(--red,#b7222a)}
.woc22-reset{border:1px solid var(--line,#ddd);background:var(--surface-soft,#fafafa);color:var(--text,#111);font-size:11px;padding:9px 12px;border-radius:9px;cursor:pointer;margin-top:7px}
#readerPanel .reader-article{max-width:min(100%,var(--woc22-width,740px));margin-inline:auto}
#readerPanel .reader-body p,#readerPanel .reader-body li{line-height:var(--woc22-line,1.72)}
#readerPanel .reader-body h2,#readerPanel .reader-body h3{scroll-margin-top:90px}
.woc22-clip-toolbar{position:fixed;bottom:calc(100px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;padding:6px;border:1px solid rgba(255,255,255,.20);border-radius:15px;background:#191b20;color:#fff;box-shadow:var(--woc22-shadow);z-index:2147482998;max-width:calc(100vw - 30px)}
.woc22-clip-toolbar[hidden]{display:none!important}
.woc22-clip-toolbar button{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:10px;background:transparent;color:#fff;padding:9px 10px;font-size:12px;font-weight:850;white-space:nowrap;cursor:pointer}
.woc22-clip-toolbar button:first-child{background:#b8242b}
.woc22-clip-toolbar svg{width:16px;height:16px}
.woc22-hub button:focus-visible,.woc22-home-bar button:focus-visible,.woc22-reader-actions button:focus-visible,.woc22-clip-toolbar button:focus-visible,.woc22-reader-prefs button:focus-visible{outline:3px solid #e4a12d;outline-offset:2px}
html[data-theme="dark"] .woc22-clip-toolbar{background:#101114}
@media(min-width:800px){.woc22-hub{align-items:center;padding:28px}.woc22-sheet{border-radius:28px;height:min(760px,90dvh)}}
@media(max-width:390px){.woc22-home-bar{padding:12px 10px}.woc22-home-icon{width:36px;height:36px}.woc22-home-copy span{font-size:10px}.woc22-home-bar>button{font-size:11px;padding:10px}.woc22-sheet-head{padding:19px 14px 13px}.woc22-sheet-body{padding:0 13px 23px}.woc22-tabs{margin-inline:13px}.woc22-tabs button{padding:10px 8px;font-size:11px}.woc22-reader-actions button{font-size:10px}.woc22-clip-toolbar button{padding:8px 7px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.woc22-hub,.woc22-sheet,.woc22-home-bar{animation:none!important;transition:none!important}}
.woc22-batch{display:flex;gap:9px;margin:0 0 12px;flex-wrap:wrap}
.woc22-batch button{border:1px solid var(--line,#ddd);background:var(--surface-solid,#fff);color:var(--red,#b7222a);border-radius:11px;padding:9px 13px;min-height:39px;font-size:11px;font-weight:850;cursor:pointer}
.woc22-batch button:disabled{opacity:.65;cursor:wait}
