.compat{padding:clamp(3rem,6vw,4.5rem) 0;background:var(--surface);overflow:hidden}.compat .wrap{padding-inline:clamp(1rem,4vw,2rem)}.compat-header{text-align:center;margin-bottom:clamp(2rem,4vw,3rem)}.compat-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin-bottom:.75rem}.compat-eyebrow svg{width:16px;height:16px;fill:var(--red)}.compat-title{font-family:Cormorant Garamond,Georgia,serif;font-size:clamp(1.3rem,2.5vw,1.7rem);font-weight:500;letter-spacing:.02em;line-height:1.2;margin-bottom:.3rem}.compat-jp{display:block;font-family:Shippori Mincho,serif;font-size:13px;color:var(--gray-400);letter-spacing:.15em}.compat-line{display:block;width:40px;height:2px;background:var(--red);margin:.75rem auto 0}.compat-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,2.5rem);max-width:920px;margin:0 auto}.compat-col{display:flex;flex-direction:column;gap:.65rem}.compat-col-head{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);padding-bottom:.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.4rem;margin:0}.compat-col-head svg{width:15px;height:15px;stroke:var(--gray-400);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.compat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.65rem}.compat-item{display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border:1px solid var(--border);border-radius:10px;transition:border-color .2s,box-shadow .2s}@media(hover:hover){.compat-item:hover{border-color:var(--gray-200);box-shadow:0 2px 12px var(--shadow-sm)}}.compat-status{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.compat-status.yes{background:var(--green-light)}.compat-status.yes svg{fill:var(--green)}.compat-status.partial{background:#d9770614}.compat-status.partial svg{fill:#d97706}.compat-status.no{background:#d4002a0f}.compat-status.no svg{fill:var(--red)}.compat-status svg{width:14px;height:14px}.compat-item-info{flex:1;min-width:0;display:block}.compat-item-name{display:block;font-size:13px;font-weight:700;color:var(--text)}.compat-item-note{display:block;font-size:11px;color:var(--text-muted);line-height:1.4;margin-top:.1rem}.compat-empty{font-size:12px;color:var(--gray-400);padding:.75rem .85rem;border:1px dashed var(--border);border-radius:10px;text-align:center}.compat-footnote{display:flex;align-items:flex-start;gap:.4rem;font-size:11px;color:var(--text-muted);line-height:1.45;margin-top:.35rem;padding:.5rem .65rem;border-radius:8px;background:var(--gray-50);border:1px dashed var(--gray-100)}.compat-footnote svg{width:14px;height:14px;min-width:14px;fill:var(--gray-400);margin-top:1px}.compat-angle{margin-top:clamp(1.5rem,3vw,2.25rem);max-width:920px;margin-left:auto;margin-right:auto}.compat-angle-head{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);padding-bottom:.5rem;border-bottom:1px solid var(--border);margin:0 0 .75rem;display:flex;align-items:center;gap:.4rem}.compat-angle-head svg{width:15px;height:15px;stroke:var(--gray-400);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.compat-angles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem}.compat-angle-card{background:var(--gray-50);border:1px solid var(--border);border-radius:10px;padding:.85rem 1rem;text-align:center;transition:border-color .2s;display:flex;flex-direction:column;align-items:center;justify-content:center}@media(hover:hover){.compat-angle-card:hover{border-color:var(--gray-200)}}.compat-angle-card.recommended{border-color:var(--red);background:var(--red-light)}.compat-angle-val{font-family:Cormorant Garamond,Georgia,serif;font-size:clamp(1.2rem,2vw,1.5rem);font-weight:600;color:var(--text);line-height:1;display:block}.compat-angle-card.recommended .compat-angle-val{color:var(--red)}.compat-angle-label{display:block;font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-top:.25rem}.compat-angle-card.recommended .compat-angle-label{color:var(--red)}.compat-angle-rec{display:block;font-size:10px;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.08em;margin-top:.3rem}[data-theme=dark] .compat{background:var(--surface)}[data-theme=dark] .compat-col-head{border-color:#ffffff0f}[data-theme=dark] .compat-item{border-color:#ffffff14}[data-theme=dark] .compat-item:hover{border-color:#ffffff26;box-shadow:0 2px 12px #0000004d}[data-theme=dark] .compat-angle-head{border-color:#ffffff0f}[data-theme=dark] .compat-angle-card{background:#ffffff08;border-color:#ffffff14}[data-theme=dark] .compat-angle-card.recommended{background:#d4002a14;border-color:var(--red)}[data-theme=dark] .compat-footnote{background:#ffffff05;border-color:#ffffff0f}[data-theme=dark] .compat-empty{border-color:#ffffff14;color:#ffffff80}@media(min-width:1800px){.compat-inner,.compat-angle{max-width:1180px}.compat-title{font-size:clamp(1.7rem,1.8vw,2.1rem)}.compat-angle-val{font-size:clamp(1.5rem,1.4vw,1.9rem)}}@media(max-width:700px){.compat-inner{grid-template-columns:1fr}.compat-angles{grid-template-columns:repeat(3,1fr);gap:.5rem}}@media(max-width:560px){.compat-angles{grid-template-columns:repeat(auto-fit,minmax(95px,1fr))}}@media(max-width:420px){.compat-angles{grid-template-columns:1fr}.compat-angle-card{flex-direction:row;align-items:center;gap:.75rem;text-align:left;padding:.65rem .85rem;justify-content:flex-start}.compat-angle-val{font-size:1.1rem}.compat-angle-label{margin-top:0}.compat-angle-rec{margin-top:0;margin-left:auto}}@media(max-width:360px){.compat-status{width:24px;height:24px}.compat-status svg{width:12px;height:12px}.compat-item{padding:.55rem .7rem;gap:.6rem}}@media(prefers-reduced-motion:reduce){.compat-item,.compat-angle-card{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/section-whet-compat.css.map */