.container{max-width:960px;margin:0 auto;padding:0 clamp(1rem,4.5vw,1.5rem) 3rem}.breadcrumb{font-size:.92rem;color:var(--text-muted);margin-bottom:.3rem}.breadcrumb a{color:var(--text-muted);text-decoration:none}.breadcrumb a:hover{color:var(--guava-green)}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:.95rem;color:var(--guava-green);text-decoration:none;margin-bottom:1rem}.hero-banner{width:100%;height:4px;border-radius:8px;margin-bottom:1.5rem}.article-content h1 em{font-style:normal;display:block;font-size:.65em;color:var(--text-muted);margin-top:.3rem;font-weight:400}.article-content h2{font-size:clamp(1.3rem,4.8vw,1.55rem)}.article-content p{font-size:clamp(16.5px,4.4vw,18px);line-height:1.9;margin:1.1rem 0}.article-content ul,.article-content ol{margin:.8rem 0;padding-left:1.5rem}.article-content li{margin-bottom:.5rem;line-height:1.85;font-size:clamp(16px,4.2vw,17.5px)}.content-img{display:block;width:100%;max-width:820px;height:auto;border-radius:12px;margin:1rem auto .5rem}.article-img-caption{text-align:center;font-size:.92rem;line-height:1.7;color:var(--text-muted);margin:.5rem auto 1.2rem;max-width:680px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:1.2rem 1.4rem}.card h3{font-size:1.15rem}.card p{font-size:1rem;line-height:1.85}.quick-tool-bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:.8rem 1rem;margin:1rem 0 1.5rem;font-size:.95rem}.quick-tool-bar span{color:var(--text-muted)}.quick-tool-bar a{color:var(--guava-green);text-decoration:none;background:#39ff1414;padding:5px 12px;border-radius:6px}.quick-tool-bar a:hover{background:#39ff142e}.faq-list{margin:1rem 0 2rem}.faq-item{border:1px solid var(--border);border-radius:10px;margin-bottom:.6rem;overflow:hidden}.faq-q{padding:1.1rem 1.3rem;cursor:pointer;font-weight:600;font-size:1.05rem;list-style:none;display:flex;justify-content:flex-start;gap:.5rem}.faq-q::-webkit-details-marker{display:none}.faq-q:before{content:"▸";color:var(--guava-green);flex-shrink:0}.faq-item[open] .faq-q:before{content:"▾ "}.faq-a{margin:0 1.3rem 1.1rem;color:var(--text-secondary);font-size:1rem;line-height:1.85}.related-links{display:flex;flex-direction:column;gap:.7rem;margin:1rem 0 2rem}.rl-item{display:block;padding:1rem 1.2rem;border:1px solid var(--border);border-radius:10px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}.rl-item:hover{border-color:var(--guava-green);transform:translate(4px)}.rl-cat{font-size:.78rem;color:var(--guava-green);text-transform:uppercase;letter-spacing:.5px}.rl-item strong{display:block;margin:.2rem 0;font-size:1.02rem}.rl-desc{font-size:.9rem;color:var(--text-muted)}table{width:100%;border-collapse:collapse;font-size:.97rem}th,td{padding:.75rem .9rem;text-align:left;border-bottom:1px solid var(--border);line-height:1.7}th{font-weight:700;font-size:.92rem;color:var(--text-muted)}.offside-diagram{margin:1.2rem 0 1.8rem;padding:0;border:none}.offside-svg{width:100%;max-width:720px;height:auto;display:block;margin:0 auto;border-radius:12px}.offside-svg[data-zoomable]{cursor:zoom-in;transition:filter .2s,transform .2s}.offside-svg[data-zoomable]:hover{filter:brightness(1.06);transform:translateY(-1px)}.offside-zoom-tip{display:block;text-align:center;font-size:.88rem;color:var(--text-muted);margin:.3rem 0 .4rem}.offside-hint{margin:.6rem auto 0;max-width:720px;padding:1rem 1.2rem;border-radius:12px;border:1.5px solid}.offside-hint p{margin:0!important;font-size:1rem!important;line-height:1.85;color:inherit}.offside-hint__verdict{font-weight:800;font-size:1.18rem;margin-bottom:.4rem;letter-spacing:.5px}.offside-hint--bad{background:#f443361a;border-color:#f443368c;color:#ffb4ad}.offside-hint--bad .offside-hint__verdict{color:#ff5252}.offside-hint--good{background:#4caf501a;border-color:#4caf508c;color:#c8e6c9}.offside-hint--good .offside-hint__verdict{color:#66bb6a}.lightbox{position:fixed;inset:0;background:#000000ed;z-index:9999;display:none;align-items:center;justify-content:center;padding:24px;cursor:zoom-out;animation:lbFadeIn .18s ease-out}.lightbox.is-open{display:flex}@keyframes lbFadeIn{0%{opacity:0}to{opacity:1}}.lightbox__inner{width:100%;max-width:1100px;max-height:90vh;overflow:auto;-webkit-overflow-scrolling:touch;cursor:default}.lightbox__inner svg{width:100%;height:auto;display:block;border-radius:12px}.lightbox__close{position:fixed;top:16px;right:16px;width:48px;height:48px;border-radius:50%;background:#ffffff2e;color:#fff;border:none;font-size:26px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10001}.lightbox__close:hover{background:#ffffff47}.lightbox__hint{position:fixed;bottom:18px;left:50%;transform:translate(-50%);color:#ffffffb3;font-size:14px;pointer-events:none}@media (max-width: 600px){.article-content h1{font-size:1.55rem}.article-content h2{font-size:1.25rem}.offside-hint{padding:.85rem 1rem}.offside-hint__verdict{font-size:1.05rem}.offside-hint p{font-size:.95rem!important}}.oq-quiz-area{max-width:600px;margin:2rem auto;padding:1.5rem;background:#ffffff05;border-radius:16px;border:1px solid #2a2a2a}.oq-progress{margin-bottom:1rem}.oq-progress-text{display:block;text-align:center;font-size:1rem;color:#ccc;margin-bottom:.5rem;font-weight:600}.oq-progress-track{height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden}.oq-progress-fill{height:100%;background:var(--guava-green, #39FF14);border-radius:3px;transition:width .4s ease}.oq-pitch-wrap{width:100%;margin:0 auto 1rem;border-radius:10px;overflow:hidden;border:2px solid rgba(255,255,255,.15)}.oq-pitch-wrap svg{display:block;width:100%;height:auto}.oq-pulse-ring{animation:oq-pulse 1.5s ease-in-out infinite}@keyframes oq-pulse{0%,to{opacity:.8;r:19}50%{opacity:.3;r:24}}.oq-blink-ring{animation:oq-blink .8s ease-in-out infinite}@keyframes oq-blink{0%,to{opacity:1}50%{opacity:.2}}.oq-line-anim{animation:oq-line-draw .5s ease-out forwards;stroke-dashoffset:200}@keyframes oq-line-draw{0%{stroke-dashoffset:200;opacity:0}to{stroke-dashoffset:0;opacity:.9}}.oq-ball-glow{filter:drop-shadow(0 0 4px rgba(251,191,36,.6))}.oq-question{text-align:center;font-size:1.15rem;font-weight:700;color:#eee;margin:0 0 1rem}.oq-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.oq-btn{font-size:1.15rem;font-weight:700;padding:14px 32px;border-radius:12px;border:2px solid transparent;cursor:pointer;transition:all .2s;letter-spacing:1px}.oq-btn:hover{transform:translateY(-2px)}.oq-btn:active{transform:translateY(1px)}.oq-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.oq-btn-offside{background:linear-gradient(135deg,#dc2626,#ef4444);color:#fff;border-color:#ef4444}.oq-btn-offside:hover{box-shadow:0 4px 15px #ef444466}.oq-btn-onside{background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff;border-color:#22c55e}.oq-btn-onside:hover{box-shadow:0 4px 15px #22c55e66}.oq-btn.oq-correct{box-shadow:0 0 20px #22c55e99;border-color:#22c55e}.oq-btn.oq-wrong{animation:oqShake .5s ease;border-color:#666;opacity:.5}@keyframes oqShake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.oq-explanation{margin-top:1.2rem;animation:oqFadeIn .35s ease-out}@keyframes oqFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.oq-result-badge{text-align:center;font-size:1.4rem;font-weight:800;margin-bottom:.5rem}.oq-result-badge.oq-badge-correct{color:#22c55e}.oq-result-badge.oq-badge-wrong{color:#ef4444}.oq-explain-text{background:#39ff140d;border-left:3px solid var(--guava-green, #39FF14);border-radius:0 10px 10px 0;padding:14px 18px;font-size:1.05rem;line-height:1.8;color:#ddd;margin-bottom:1rem}.oq-next-btn{display:block;margin:0 auto;background:transparent;border:1.5px solid #555;color:#ccc;font-size:1.05rem;padding:10px 36px;border-radius:10px;cursor:pointer;transition:all .2s}.oq-next-btn:hover{border-color:var(--guava-green, #39FF14);color:#fff}.oq-final{text-align:center;animation:oqFadeIn .5s ease-out}.oq-final-score{font-size:3rem;font-weight:900;color:var(--guava-green, #39FF14);margin-bottom:.3rem}.oq-final-title{font-size:1.4rem;font-weight:700;color:#fbbf24;margin-bottom:.5rem}.oq-final-msg{font-size:1rem;color:#bbb;margin-bottom:1.2rem;line-height:1.7}.oq-replay-btn{background:linear-gradient(135deg,#b8860b,#d4a056);border:2px solid #c9983a;color:#1a1a1a;font-size:1.15rem;font-weight:800;padding:14px 40px;border-radius:12px;cursor:pointer;transition:all .3s;letter-spacing:2px}.oq-replay-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #b8860b66}.oq-share-prompt{margin-top:1rem;font-size:.95rem;color:#888}.oq-stats-card{max-width:600px;margin:2rem auto;padding:1.2rem 1.5rem;background:var(--bg-card, rgba(255,255,255,.03));border:1px solid #333;border-radius:14px}.oq-stats-title{font-size:1.05rem;font-weight:700;color:#eee;margin-bottom:.8rem}.oq-stats-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.oq-stat{background:#ffffff0a;border-radius:8px;padding:8px 16px;font-size:.95rem;color:#bbb}.oq-stat strong{font-size:1.2rem;margin-left:4px;color:var(--guava-green, #39FF14)}@media (max-width: 768px){.oq-quiz-area{padding:1rem}.oq-btn{font-size:1.05rem;padding:12px 24px}.oq-question{font-size:1.05rem}.oq-final-score{font-size:2.5rem}.oq-final-title{font-size:1.2rem}}@media (max-width: 480px){.oq-btn{font-size:.95rem;padding:10px 20px;flex:1;min-width:120px}.oq-explain-text{font-size:.95rem;padding:10px 14px}.oq-stat{padding:6px 12px;font-size:.9rem}}