.resources-page .page-body { padding:16px 20px 32px; }
.resource-list { display:grid; gap:20px; margin-top:18px; }
.resource-status { margin:12px 4px; color:var(--secondary-label); font-size:14px; line-height:1.45; }
.resource-status:empty { display:none; }
.screen .resource-categories { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; margin:16px 0 4px; padding:2px 1px 6px; background:none; border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.resource-categories::-webkit-scrollbar { display:none; }
.resource-categories[hidden] { display:none; }
.resource-categories button { flex:none; min-height:36px; padding:0 14px; border-radius:999px; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.14); color:inherit; font:600 13px/1 "Satoshi",sans-serif; backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); cursor:pointer; }
html[data-theme] .screen .resource-categories button.glass-surface { box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 3px rgba(0,0,0,.05); backdrop-filter:none; -webkit-backdrop-filter:none; }
html.svg-glass[data-theme] .screen .resource-categories button.glass-surface { box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 3px rgba(0,0,0,.05); backdrop-filter:none; -webkit-backdrop-filter:none; }
.resource-categories button[aria-pressed="true"] { color:var(--ios-blue); background:rgba(255,255,255,.32); border-color:rgba(255,255,255,.5); }
.resource-card { overflow:hidden; border-radius:24px; cursor:pointer; }
.resource-cover-wrap { position:relative; overflow:hidden; }
.resource-cover-wrap:after { content:""; position:absolute; inset:62% 0 0; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); mask-image:linear-gradient(transparent,#000 36%); -webkit-mask-image:linear-gradient(transparent,#000 36%); pointer-events:none; }
.resource-cover { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; }
.resource-copy { padding:18px; }
.resource-copy h2 { margin:7px 0 10px; font-size:20px; font-weight:600; line-height:1.25; letter-spacing:-.3px; }
.resource-meta,.resource-language { margin:0; font-size:12px; line-height:1.4; color:var(--secondary-label); }
.resource-description { margin:0 0 12px; font-size:15px; line-height:1.5; color:var(--secondary-label); }
.resource-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.screen .resource-action { border:0; color:var(--ios-blue); white-space:nowrap; }
.screen .resource-actions .resource-action { flex:1; --ui-control-font:14px; --ui-control-height:44px; padding:0 12px; }
.screen .resource-action[hidden] { display:none; }
.pdf-toolbar { display:flex; align-items:center; gap:8px; padding:8px 16px 12px; flex:none; }
.pdf-toolbar #pdfProgress { margin-right:auto; font-size:13px; font-variant-numeric:tabular-nums; color:var(--secondary-label); }
.screen .pdf-toolbar .resource-action { --ui-control-height:44px; --ui-control-font:14px; padding:0 11px; }
.pdf-reader .native-header h1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pdf-reader .page-body { position:relative; padding:12px; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; background:rgba(120,120,128,.12); }
#pdfPages { margin:0 auto; }
#pdfPages.pdf-native { width:100%; height:100%; }
#pdfPages.pdf-native iframe { display:block; width:100%; height:100%; min-height:540px; border:0; border-radius:8px; background:#fff; }
.pdf-page { position:relative; width:100%; margin:0 0 12px; background:#fff; color:#111; box-shadow:0 1px 4px rgba(0,0,0,.1); overflow:hidden; }
.pdf-page canvas { display:block; width:100%; height:100%; }
.pdf-page .textLayer { --total-scale-factor:var(--scale-factor); }
.pdf-page ::selection { background:rgba(0,122,255,.25); }
.resource-gate[hidden],#pdfPages[hidden] { display:none; }
.resource-gate { position:relative; min-height:100%; display:flex; flex-direction:column; border-radius:20px; overflow:hidden; background:var(--card,#fff); color:var(--ios-label,#111); box-shadow:0 16px 45px rgba(0,0,0,.13); }
.resource-gate-preview { position:relative; height:clamp(180px,38vh,320px); overflow:hidden; background:linear-gradient(145deg,#eeb65f,#8f6027); }
.resource-gate-preview img { width:100%; height:100%; object-fit:cover; display:block; }
.resource-gate-preview:after { content:""; position:absolute; inset:36% 0 0; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); background:linear-gradient(180deg,transparent,rgba(0,0,0,.24)); pointer-events:none; }
.resource-gate-preview span { position:absolute; z-index:1; top:16px; left:16px; padding:7px 11px; border-radius:999px; background:rgba(16,17,19,.72); color:#fff; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.resource-gate-form { position:relative; z-index:2; display:grid; gap:10px; margin:-26px 12px 12px; padding:20px; border:1px solid rgba(255,255,255,.55); border-radius:24px; background:rgba(255,255,255,.94); color:#151515; box-shadow:0 12px 36px rgba(0,0,0,.15); }
.resource-gate-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:#fff0d8; color:#a45c0b; font-size:20px; }
.resource-gate-form h2 { margin:0; font-size:22px; line-height:1.12; letter-spacing:-.04em; }
.resource-gate-form>p { margin:0; font-size:13px; line-height:1.45; color:#5d5d62; }
.resource-gate-form label { margin-top:6px; font-size:12px; font-weight:720; }
.resource-gate-form input { width:100%; height:46px; padding:0 14px; border:1px solid #c7c7cc; border-radius:13px; background:#fff; color:#111; font-size:16px; outline:none; }
.resource-gate-form input:focus-visible { border-color:#a45c0b; box-shadow:0 0 0 3px rgba(164,92,11,.17); }
.resource-gate-form button { min-height:46px; border:0; border-radius:13px; background:#161616; color:#fff; font-size:14px; font-weight:740; cursor:pointer; }
.resource-gate-form button:disabled { opacity:.55; cursor:wait; }
.resource-gate-form .resource-gate-privacy { font-size:11px; }
.resource-gate-form .resource-gate-error { color:#a12323; font-weight:650; }
html[data-theme="dark"] .resource-gate-form { background:rgba(31,31,33,.96); color:#f7f7f8; border-color:rgba(255,255,255,.14); }
html[data-theme="dark"] .resource-gate-form>p { color:#babac0; }
html[data-theme="dark"] .resource-gate-form input { background:#252528; border-color:#55555b; color:#fff; }
html[data-theme="dark"] .resource-gate-form button { background:#f6f6f7; color:#141414; }