.opc-header{padding:80px 0 56px}.opc-header h1{font-family:var(--serif);letter-spacing:-.035em;max-width:1100px;margin:18px 0 24px;font-size:clamp(56px,9vw,120px);font-weight:400;line-height:.94}.opc-header h1 em{color:var(--accent);font-style:italic}.opc-sub{color:var(--ink-dim);max-width:640px;margin:0;font-size:17px;line-height:1.55}.opc-sub b{color:var(--ink);font-weight:500}.opc-section{padding:28px 0}.nav-right{align-items:center;gap:12px;display:flex}.lang-toggle{border:1px solid var(--rule,#0000001f);font-family:var(--mono);letter-spacing:.04em;color:var(--ink-dim,#6a6a6a);border-radius:999px;align-items:center;gap:4px;margin-right:4px;padding:4px 10px;font-size:11px;display:inline-flex}.lang-toggle button{cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;background:0 0;border:0;border-radius:999px;padding:2px 6px;line-height:1}.lang-toggle button.on{color:var(--ink,#111);font-weight:600}.lang-toggle button:hover{color:var(--ink,#111)}.lang-sep{opacity:.4}.ghost-btn{border:1px solid var(--rule-strong);color:var(--ink);font-family:var(--sans);cursor:pointer;background:0 0;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:500}.ghost-btn:hover{border-color:var(--ink)}.user-pop{position:relative}.user-chip{background:var(--bg-elev);border:1px solid var(--rule-strong);font-family:var(--sans);color:var(--ink);cursor:pointer;border-radius:999px;align-items:center;gap:8px;padding:4px 12px 4px 4px;font-size:13px;display:inline-flex}.user-chip:hover{border-color:var(--ink)}.user-chip .avatar{color:#fff;width:26px;height:26px;font-family:var(--mono);border-radius:50%;justify-content:center;align-items:center;font-size:10px;font-weight:600;display:flex}.user-name{color:var(--ink)}.user-menu{background:var(--bg-elev);border:1px solid var(--rule-strong);z-index:60;border-radius:12px;min-width:220px;padding:8px;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 12px 32px #14110d1a}.user-menu .menu-head{padding:8px 10px 12px}.user-menu .user-name-full{font-size:14px;font-weight:500}.user-menu .user-email{color:var(--ink-faint);margin-top:2px;font-size:11px}.user-menu a{color:var(--ink);cursor:pointer;border-radius:6px;padding:8px 10px;font-size:13px;display:block}.user-menu a:hover{background:var(--bg-card)}.user-menu a.signout{color:#a8323b}.user-menu hr.rule{margin:6px 0}.avatar.small{color:#fff;width:22px;height:22px;font-family:var(--mono);border-radius:50%;justify-content:center;align-items:center;font-size:9.5px;font-weight:600;display:inline-flex}.filter-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:24px;display:flex}.filter-tabs{background:var(--bg-elev);border:1px solid var(--rule-strong);border-radius:999px;padding:4px;display:inline-flex}.filter-tabs button{font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-dim);background:0 0;border:none;border-radius:999px;align-items:center;gap:6px;padding:8px 16px;font-size:11px;display:flex}.filter-tabs button:hover{color:var(--ink)}.filter-tabs button.on{background:var(--ink);color:var(--bg)}.filter-tabs .count{background:#ffffff26;border-radius:4px;padding:1px 6px;font-size:9.5px}.filter-tabs button:not(.on) .count{background:var(--bg-card);color:var(--ink-faint)}.filter-meta .mono.small.dim{font-family:var(--mono);color:var(--ink-faint);text-transform:uppercase;letter-spacing:.06em;font-size:11px}.section-label{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:var(--bg-elev);border:1px solid var(--rule);border-radius:10px;align-items:center;gap:8px;margin-bottom:12px;padding:12px 16px;font-size:11px;font-weight:500;display:flex}.section-label.dim{color:var(--ink-dim)}.section-label .crown{color:var(--accent);font-size:14px}.champion-list{flex-direction:column;gap:8px;display:flex}.champion-row{background:var(--bg-elev);border:1px solid var(--rule);cursor:pointer;border-radius:12px;align-items:center;gap:16px;padding:18px 20px;transition:border-color .15s,transform .15s,box-shadow .15s;display:flex}.champion-row:hover{border-color:var(--rule-strong);transform:translateY(-1px);box-shadow:0 4px 16px #14110d0d}.champion-row.detail{cursor:default;margin-bottom:24px}.champion-row.detail:hover{box-shadow:none;transform:none}.row-rank{font-family:var(--mono);color:var(--ink-faint);letter-spacing:.04em;flex-shrink:0;width:28px;font-size:11px}.logo-mark{background:var(--bg);border-radius:10px;flex-shrink:0;width:48px;height:48px;overflow:hidden}.logo-mark.logo-fallback{color:#fff;font-family:var(--serif);justify-content:center;align-items:center;font-style:italic;font-weight:500;display:flex}.row-meta{flex:1;min-width:0}.row-head{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:2px;display:flex}.row-meta h3{font-family:var(--sans);letter-spacing:-.005em;color:var(--ink);margin:0;font-size:16px;font-weight:600}.champion-row.detail .row-meta h3{font-family:var(--serif);letter-spacing:-.02em;font-size:32px;font-weight:400}.row-pill{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--bg-card);color:var(--ink-dim);border-radius:4px;padding:2px 8px;font-size:9.5px}.row-pill.soon{color:var(--warn);background:#fff5e0}.row-pill.featured{background:var(--accent-soft);color:var(--accent)}.row-by{font-size:11.5px;font-family:var(--mono);color:var(--ink-faint);letter-spacing:.02em;margin-bottom:4px}.row-tagline{color:var(--ink-dim);font-size:13.5px;line-height:1.45}.champion-row.detail .row-tagline{font-size:14.5px}.row-actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.vote-btn,.comment-btn{background:var(--bg);border:1px solid var(--rule);font-family:var(--mono);color:var(--ink-dim);cursor:pointer;border-radius:8px;align-items:center;gap:5px;padding:7px 11px;font-size:11.5px;font-weight:500;transition:all .15s;display:inline-flex}.vote-btn:hover:not(:disabled),.comment-btn:hover{border-color:var(--rule-strong);color:var(--ink)}.vote-btn.voted{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);cursor:default}.vote-btn:disabled{cursor:default}.visit-btn{background:var(--ink);border:1px solid var(--ink);width:30px;height:30px;color:var(--bg);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.visit-btn:hover{background:var(--accent);border-color:var(--accent)}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100;background:#14110d6b;justify-content:center;align-items:flex-start;padding:60px 24px;animation:.2s fadein;display:flex;position:fixed;inset:0;overflow-y:auto}@keyframes fadein{0%{opacity:0}}.champion-modal{background:var(--bg);border-radius:16px;width:100%;max-width:760px;padding:36px;animation:.25s rise;position:relative;box-shadow:0 24px 80px #14110d2e}.champion-modal.small{max-width:480px}@keyframes rise{0%{opacity:0;transform:translateY(20px)}}.champion-modal .close{background:var(--bg-elev);border:1px solid var(--rule-strong);width:32px;height:32px;color:var(--ink-dim);z-index:10;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:18px;display:flex;position:absolute;top:18px;right:18px}.champion-modal .close:hover{color:var(--ink)}.login-card{padding:8px 0}.login-card .modal-h2{letter-spacing:-.025em;margin:14px 0 12px;font-size:clamp(34px,4.5vw,48px);font-weight:400;line-height:1}.login-card .modal-h2 em{color:var(--accent);font-style:italic}.google-btn{background:var(--bg-elev);border:1px solid var(--rule-strong);width:100%;font-family:var(--sans);color:var(--ink);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:10px;margin-bottom:18px;padding:12px 18px;font-size:14px;font-weight:500;display:flex}.google-btn:hover{border-color:var(--ink)}.login-alt{border-top:1px solid var(--rule);padding:14px 0}.login-alt .mono.small.dim{letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px;font-size:10.5px;display:block}.demo-users{flex-wrap:wrap;gap:8px;display:flex}.demo-users button{background:var(--bg-card);border:1px solid var(--rule);font-family:var(--sans);color:var(--ink);cursor:pointer;border-radius:999px;align-items:center;gap:8px;padding:6px 12px 6px 6px;font-size:12.5px;display:inline-flex}.demo-users button:hover{border-color:var(--ink)}.login-fine{color:var(--ink-faint);letter-spacing:.02em;margin:18px 0 0;font-size:10.5px}.submit-modal .modal-h2{letter-spacing:-.025em;margin:14px 0 12px;font-size:clamp(34px,4.5vw,48px);font-weight:400;line-height:1}.submit-modal .modal-h2 em{color:var(--accent);font-style:italic}.submit-helper{color:var(--ink-dim);max-width:560px;margin:0 0 24px;font-size:13.5px;line-height:1.5}.submit-helper b{color:var(--ink);font-weight:500}.submit-form,.form-row{flex-direction:column;gap:16px;display:flex}.form-row.two{grid-template-columns:1fr 1fr;gap:16px;display:grid}.form-row label{flex-direction:column;gap:6px;display:flex}.label-key{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);font-size:10.5px}.label-key em{color:var(--ink-faint);text-transform:none;letter-spacing:.02em;margin-left:4px;font-size:10.5px;font-style:normal}.submit-form input,.submit-form select,.submit-form textarea,.settings-block input,.settings-block textarea{font-family:var(--sans);background:var(--bg-elev);border:1px solid var(--rule-strong);color:var(--ink);border-radius:8px;width:100%;padding:10px 12px;font-size:14px}.submit-form textarea,.settings-block textarea{resize:vertical;line-height:1.5}.submit-form input:focus,.submit-form select:focus,.submit-form textarea:focus,.settings-block input:focus,.settings-block textarea:focus{border-color:var(--ink);outline:none}.submit-form input:disabled,.settings-block input:disabled{opacity:.5;cursor:not-allowed}.submit-form input[type=color]{cursor:pointer;height:42px;padding:4px}.submit-footer{justify-content:space-between;align-items:center;padding-top:8px;display:flex}.primary-btn{background:var(--ink);color:var(--bg);font-family:var(--sans);cursor:pointer;border:none;border-radius:8px;padding:12px 22px;font-size:14px;font-weight:500}.primary-btn:hover{background:var(--accent)}.screenshot-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;display:grid}.screenshot-frame{aspect-ratio:3/2;border:1px solid var(--rule);background:var(--bg-elev);border-radius:10px;overflow:hidden}.about-block{background:var(--bg-elev);border:1px solid var(--rule);border-radius:12px;margin-bottom:24px;padding:24px}.about-block h4{font-family:var(--sans);margin:0 0 12px;font-size:15px;font-weight:600}.about-block p{color:var(--ink-dim);margin:0;font-size:14px;line-height:1.65}.comments-block{background:var(--bg-elev);border:1px solid var(--rule);border-radius:12px;padding:24px}.comments-block h4{font-family:var(--sans);margin:0 0 16px;font-size:15px;font-weight:600}.comments-block h4 .dim{color:var(--ink-faint);font-weight:400}.comment-form{gap:12px;margin-bottom:18px;display:flex}.comment-input-wrap{flex:1}.comment-form textarea{width:100%;font-family:var(--sans);background:var(--bg);border:1px solid var(--rule-strong);resize:vertical;border-radius:8px;padding:10px 12px;font-size:13.5px;line-height:1.5}.comment-form textarea:focus{border-color:var(--ink);outline:none}.comment-actions{justify-content:space-between;align-items:center;margin-top:8px;display:flex}.comment-actions .mono.small.dim{font-family:var(--mono);color:var(--ink-faint);font-size:10.5px}.comment-actions button{background:var(--ink);color:var(--bg);font-family:var(--sans);cursor:pointer;border:none;border-radius:6px;padding:7px 16px;font-size:12.5px;font-weight:500}.comment-actions button:disabled{opacity:.4;cursor:not-allowed}.comment-locked{text-align:center;background:var(--bg-card);border-radius:10px;margin-bottom:18px;padding:24px}.comment-locked p{color:var(--ink-dim);margin:0 0 12px;font-size:13.5px}.comment-list{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.comment-item{border-top:1px solid var(--rule);gap:12px;padding-top:14px;display:flex}.comment-item:first-child{border-top:0;padding-top:0}.comment-body-wrap{flex:1;min-width:0}.comment-meta{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:4px;font-size:12px;display:flex}.comment-meta b{color:var(--ink);font-weight:600}.comment-meta .mono.dim{font-family:var(--mono);color:var(--ink-faint);font-size:10.5px}.comment-del{color:#a8323b;cursor:pointer;margin-left:auto;font-size:11px}.comment-del:hover{text-decoration:underline}.comment-body{color:var(--ink);white-space:pre-wrap;margin:0;font-size:13.5px;line-height:1.55}.empty-state{max-width:560px;padding:64px 0}.empty-state h2{letter-spacing:-.03em;margin:14px 0 18px;font-size:64px;line-height:1}.empty-state h2 em{color:var(--accent);font-style:italic}.empty-state p{color:var(--ink-dim);margin:0 0 24px;font-size:16px;line-height:1.55}.empty-state.inset{background:var(--bg-elev);border:1px dashed var(--rule-strong);border-radius:16px;flex-direction:column;align-items:flex-start;gap:14px;padding:56px 32px;display:flex}.empty-state.small{text-align:center;padding:24px}.opc-cta-section{padding:80px 0}.big-cta{background:var(--ink);color:var(--bg);border-radius:24px;padding:64px 56px}.big-cta .eyebrow{color:#fafaf799}.big-cta .eyebrow .dot{background:var(--accent)}.big-cta h2{font-family:var(--serif);letter-spacing:-.03em;margin:18px 0;font-size:clamp(48px,6vw,80px);font-weight:400;line-height:.96}.big-cta h2 em{color:var(--accent);font-style:italic}.big-cta p{color:#fafaf7b3;max-width:540px;margin:0 0 28px;font-size:16px;line-height:1.6}.big-cta-btn{background:var(--accent);color:#fff;font-family:var(--sans);cursor:pointer;border:none;border-radius:8px;margin-right:10px;padding:14px 24px;font-size:14px;font-weight:500;display:inline-block}.big-cta-btn:hover{color:var(--ink);background:#fff}.big-cta-btn.ghost{color:var(--bg);background:0 0;border:1px solid #fafaf740}.big-cta-btn.ghost:hover{color:var(--bg);background:#fafaf71a}.account-page{padding-top:64px}.account-head{align-items:center;gap:24px;margin-bottom:32px;display:flex}.account-avatar{color:#fff;width:84px;height:84px;font-family:var(--serif);border-radius:50%;justify-content:center;align-items:center;font-size:32px;font-weight:500;display:flex}.account-tabs{background:var(--bg-elev);border:1px solid var(--rule-strong);border-radius:999px;gap:4px;margin-bottom:24px;padding:4px;display:flex;overflow-x:auto}.account-tabs button{font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-dim);white-space:nowrap;cursor:pointer;background:0 0;border:none;border-radius:999px;padding:8px 16px;font-size:11px}.account-tabs button:hover{color:var(--ink)}.account-tabs button.on{background:var(--ink);color:var(--bg)}.my-comments-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.my-comments-list li{background:var(--bg-elev);border:1px solid var(--rule);cursor:pointer;border-radius:10px;padding:16px 20px}.my-comments-list li:hover{border-color:var(--rule-strong)}.mc-on{color:var(--ink-dim);margin-bottom:4px;font-size:12px}.mc-on b{color:var(--ink)}.my-comments-list p{color:var(--ink);margin:0;font-size:13.5px;line-height:1.5}.settings-block{flex-direction:column;gap:16px;max-width:640px;display:flex}.danger-zone{background:#fdeae6;border:1px solid #f4baa8;border-radius:10px;padding:20px}.danger-zone h4{color:#8a2317;margin:0 0 6px;font-size:14px}.danger-zone p{color:#5a1810;margin:0 0 14px;font-size:12.5px}.danger-btn{color:#fff;font-family:var(--sans);cursor:pointer;background:#b03020;border:none;border-radius:6px;padding:8px 14px;font-size:12.5px}.danger-btn:hover{background:#8a2317}.archive-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.archive-card{background:var(--bg-elev);border:1px solid var(--rule);border-radius:14px;padding:24px}.archive-num{font-family:var(--mono);color:var(--ink);letter-spacing:.06em;text-transform:uppercase;font-size:12px}.archive-week{margin-top:4px;margin-bottom:16px;font-size:10.5px}.archive-list{flex-direction:column;gap:8px;margin-bottom:18px;display:flex}.archive-mini{align-items:center;gap:10px;font-size:13px;display:flex}.archive-link{font-family:var(--mono);color:var(--accent);cursor:pointer;letter-spacing:.04em;text-transform:uppercase;font-size:11px}.archive-link:hover{text-decoration:underline}.opc-footer{border-top:1px solid var(--rule);background:var(--bg);padding:56px 0 32px}.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr;gap:56px;margin-bottom:40px;display:grid}.opc-footer .brand{letter-spacing:-.02em;color:var(--ink);align-items:center;gap:10px;font-size:24px;display:inline-flex}.opc-footer .brand .mark{border:1.5px solid var(--ink);border-radius:50%;width:22px;height:22px;position:relative}.opc-footer .brand .mark:after{content:"";background:var(--accent);border-radius:50%;position:absolute;inset:4px}.footer-sub{color:var(--ink-dim);max-width:280px;margin:12px 0 0;font-size:13.5px;line-height:1.5}.opc-footer h5{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin:0 0 12px;font-size:11px;font-weight:500}.opc-footer ul{margin:0;padding:0;list-style:none}.opc-footer ul li{color:var(--ink-dim);margin-bottom:8px;font-size:13.5px}.opc-footer ul a{cursor:pointer}.opc-footer ul a:hover{color:var(--accent)}.copyright{border-top:1px solid var(--rule);font-family:var(--mono);letter-spacing:.04em;color:var(--ink-faint);justify-content:space-between;padding-top:24px;font-size:11px;display:flex}.toast{background:var(--ink);color:var(--bg);font-family:var(--mono);letter-spacing:.04em;z-index:200;border-radius:8px;padding:12px 20px;font-size:12px;animation:.25s toast-rise;position:fixed;bottom:32px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #14110d40}@keyframes toast-rise{0%{opacity:0;transform:translate(-50%)translateY(20px)}}@media (max-width:768px){.champion-row{flex-wrap:wrap}.row-actions{justify-content:flex-end;width:100%}.screenshot-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}.big-cta{padding:40px 28px}.opc-header h1{font-size:56px}.champion-modal{padding:28px 24px}.form-row.two{grid-template-columns:1fr}.nav-right .ghost-btn,.nav-right .user-name{display:none}}
