/* Comparison uses the existing cyan, steel and gold identity. */
.compare-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;width:100%;margin-top:12px;border:1px solid #8dccdd38;border-radius:10px;background:#18394a65;color:#c6e6ef;font-size:11px;transition:background .2s,border-color .2s,transform .2s}
.compare-toggle svg{width:14px;height:14px}.compare-toggle:hover{background:#29546988;border-color:#b4e4ee80}.compare-toggle:active{transform:scale(.98)}.compare-toggle[aria-pressed=true]{color:#ffe1a0;border-color:#d9b76c85;background:#75512435}
.compare-invitation{display:flex;justify-content:space-between;gap:16px;color:#a9c7d6;font-size:12px;padding:16px 0;margin:4px 0 18px;border-block:1px solid #8dccdd26}.compare-invitation a{display:flex;gap:8px;align-items:center;color:#f1d28d;min-height:30px}.compare-invitation>span{align-self:center}.compare-invitation svg{width:15px}
.compare-shelf{display:flex;align-items:center;gap:20px;padding:18px 22px;border:1px solid #c2a86c55;border-radius:18px;margin:10px 0 25px;background:linear-gradient(115deg,#193d50cc,#182537d9 65%,#54402255);box-shadow:inset 0 1px #dbf7ff20,0 12px 30px #001b2840;backdrop-filter:blur(20px)}
.compare-thumbs{display:flex;gap:5px;flex:none}.compare-thumbs img{width:33px;height:44px;object-fit:contain;border-radius:4px;background:#152638}.compare-shelf strong{display:block;font-size:14px;color:#f5ddb0}.compare-shelf span{display:block;font-size:11px;color:#b4cedb;margin-top:5px}.compare-shelf .button{margin-left:auto;white-space:nowrap}.compare-shelf>.text-link{min-height:44px;font-size:12px}.detail-copy>[data-comparison-shelf]{margin-top:20px}.detail-copy .compare-thumbs{display:none}.detail-copy .compare-shelf{padding:16px;gap:12px}.detail-copy .compare-shelf span{display:none}
.comparison-workspace{border:1px solid #93cbd94d;border-radius:24px;overflow:hidden;background:linear-gradient(120deg,#142d3fdb,#101d2be8);box-shadow:inset 0 1px #e2faff26,0 28px 70px #00152255;margin-bottom:60px;backdrop-filter:blur(18px)}
.compare-toolbar{display:flex;align-items:center;gap:28px;padding:26px 30px;border-bottom:1px solid #98c8d530}.compare-toolbar>div{margin-right:auto}.compare-toolbar p{color:#bed0dc;font-size:12px;margin:9px 0 0}.compare-toolbar label{display:flex;align-items:center;gap:9px;font-size:12px;min-height:44px;color:#d2e7ef;cursor:pointer}.compare-toolbar input{width:17px;height:17px;accent-color:#e5c780}.compare-toolbar button{min-height:44px;font-size:12px}
.compare-scroll{overflow:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#b9a36a #152638;isolation:isolate}.compare-scroll:focus-visible{outline:2px solid #c3f4ff;outline-offset:-4px}.comparison-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:13px;color:#deebf2;font-variant-numeric:tabular-nums}.comparison-table th,.comparison-table td{padding:22px 25px;vertical-align:top;border-bottom:1px solid #a4c6d323;text-align:left;overflow-wrap:anywhere}.comparison-table thead th{position:relative;font-weight:500;background:radial-gradient(ellipse at 50% 20%,#30627c60,transparent 75%)}.comparison-table tr>:first-child{width:180px;position:sticky;left:0;z-index:2;background:#132838;box-shadow:1px 0 #9dcbd52b}.comparison-table tbody th{font-size:12px;color:#c9e0e9;font-weight:500}.comparison-table tbody th small{display:block;font-size:10px;font-weight:400;color:#abc5d2;margin-top:6px}.comparison-table tbody tr.compare-price td{color:#ffe2a6;font-size:19px;font-weight:600}.comparison-table .compare-same td{color:#b1c7d4}.compare-corner span{display:block;color:#e3c47e;font-family:Rajdhani,sans-serif;font-weight:600;letter-spacing:.1em;line-height:1.2;font-size:24px;margin-top:66px}
.compare-image{display:flex;align-items:center;justify-content:center;height:210px;margin:12px 0 22px}.compare-image img{max-width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 15px #020d22aa);transition:transform .3s}.compare-image img.object{max-height:145px}.compare-image:hover img{transform:translateY(-5px)}.compare-name{display:block;color:#f3f7fa;font-size:20px;font-weight:600;letter-spacing:-.025em;line-height:1.3;min-height:52px}.compare-remove{position:absolute;z-index:1;right:10px;top:10px;display:grid;place-items:center;min-width:44px;min-height:44px;color:#c7dfe8;border-radius:50%;background:#102638dd}.compare-remove:hover{color:#ffe1a1;background:#3e4853}.compare-remove svg{width:16px;height:16px}.compare-size{display:block;font-size:11px;color:#b8d5e1;margin-top:15px}.compare-size select{display:block;width:100%;min-height:44px;padding:8px;margin-top:7px;border:1px solid #9ec9da66;border-radius:9px;background:#142c3d;color:#e1f0f5;font-size:14px}.compare-format{display:block;color:#b8d5e1;font-size:12px;margin:18px 0}.compare-links a{display:flex;align-items:center;gap:8px;min-height:44px;color:#eacb8b;font-size:12px}.compare-links svg{width:14px}.compare-note{font-size:12px;line-height:1.8;max-width:75ch;color:#b6ceda;padding:22px 30px;margin:0}.compare-scroll-hint{display:none}.compare-empty{padding:65px 24px;text-align:center;border:1px solid #93cbd944;border-radius:24px;background:#17334677;margin-bottom:60px}.compare-empty-art{color:#edcc83;margin-bottom:24px}.compare-empty-art svg{width:66px;height:66px}.compare-empty h2{font-size:clamp(25px,4vw,40px);max-width:22ch;margin:0 auto 18px;line-height:1.15}.compare-empty p{max-width:47ch;color:#bed4df;line-height:1.8;margin:0 auto 25px;font-size:14px}
@media(max-width:760px){
 .compare-invitation{font-size:11px;gap:10px}.compare-invitation a{min-height:44px;white-space:nowrap}.compare-shelf{gap:12px;padding:14px;flex-wrap:wrap;border-radius:15px}.compare-thumbs img{width:24px;height:33px}.compare-shelf strong{font-size:12px}.compare-shelf span{font-size:10px;max-width:19ch}.compare-shelf .button{font-size:11px;min-height:44px;padding:10px 14px}.compare-shelf>.text-link{margin-left:auto}.compare-toolbar{padding:20px;gap:8px 20px;flex-wrap:wrap}.compare-toolbar>div{flex-basis:100%}.compare-toolbar label{font-size:11px}.compare-toolbar button{margin-left:auto;font-size:11px}.compare-scroll-hint{display:block;color:#b6d0de;font-size:11px;line-height:1.6;margin:0;padding:14px 20px;border-bottom:1px solid #9dcbd526}.comparison-workspace{border-radius:18px}.comparison-table{table-layout:fixed;font-size:11px;min-width:348px}.comparison-table.compare-count-3{width:482px}.comparison-table.compare-count-2{width:348px}.comparison-table th,.comparison-table td{width:134px;min-width:134px;padding:12px}.comparison-table tr>:first-child{width:80px;min-width:80px;max-width:80px;padding:16px 10px}.comparison-table tbody th{font-size:10px}.compare-corner span{font-size:16px;margin-top:65px}.compare-image{height:150px;margin-bottom:17px}.compare-image img.object{max-height:100px}.compare-name{font-size:15px;min-height:40px}.compare-size select{font-size:16px}.compare-size{font-size:10px}.comparison-table tbody tr.compare-price td{font-size:16px}.compare-note{padding:20px;font-size:11px}.compare-empty{padding:45px 20px}.compare-toggle{font-size:10px;margin-top:10px}
}
@media(prefers-reduced-motion:reduce){.compare-image img,.compare-toggle{transition:none}.compare-image:hover img{transform:none}}
html[data-motion=off] .compare-image img,html[data-motion=off] .compare-toggle{transition:none}
@media(forced-colors:active){.comparison-workspace,.compare-empty,.compare-shelf{background:Canvas;border-color:CanvasText}.comparison-table tr>:first-child{background:Canvas;border-right:1px solid CanvasText}.comparison-table th,.comparison-table td{border-bottom-color:CanvasText}.compare-toggle,.compare-remove{background:ButtonFace;color:ButtonText;border:1px solid ButtonText}.comparison-table a,.compare-shelf a,.compare-invitation a{color:LinkText}.compare-size select{background:Field;color:FieldText}.comparison-workspace :is(th,td,p,span,label),.compare-shelf :is(span,strong),.compare-invitation>span{color:CanvasText}}
@media(max-width:760px){
 .compare-invitation{display:none}.compare-shelf{flex-wrap:nowrap;gap:10px}.compare-shelf .compare-thumbs,.compare-shelf span{display:none}.compare-shelf strong{font-size:11px;white-space:nowrap}.compare-shelf>.text-link{margin-left:0}.compare-shelf .button{padding:10px 12px}
}
.compare-scroll{scroll-padding-inline-start:180px}
@media(max-width:760px){.compare-scroll{scroll-padding-inline-start:80px}.comparison-table.compare-count-1{width:100%;min-width:0}}
@media(max-width:360px){.compare-shelf{padding:12px 10px;gap:7px}.compare-shelf strong{font-size:10px}.compare-shelf .button{font-size:10px;padding:8px}.compare-shelf>.text-link{font-size:10px}}
