:root{--colorNeutralBackground1:#fff;--colorNeutralBackground2:#fafafa;--colorNeutralBackground3:#f5f5f5;--colorNeutralBackground4:#f0f0f0;--colorNeutralBackground5:#ebebeb;--colorNeutralForeground1:#242424;--colorNeutralForeground2:#424242;--colorNeutralForeground3:#616161;--colorNeutralForeground4:#707070;--colorNeutralStroke1:#d1d1d1;--colorNeutralStroke2:#e0e0e0;--colorNeutralStroke3:#f0f0f0;--colorBrandBackground:#0078d4;--colorBrandBackgroundHover:#106ebe;--colorBrandBackgroundPressed:#004578;--colorBrandForeground1:#0078d4;--colorBrandForeground2:#106ebe;--colorBrandStroke1:#0078d4;--colorStatusDangerBackground1:#fde7e9;--colorStatusDangerForeground1:#b10e1c;--colorStatusDangerBackground1Hover:#fdd;--shadow2:0 1px 2px #0000001f, 0 0 2px #0000000f;--shadow4:0 2px 4px #00000024, 0 0 2px #0000000f;--shadow8:0 4px 8px #00000024, 0 0 2px #0000000f;--shadow16:0 8px 16px #00000024, 0 0 2px #0000000f;--borderRadiusNone:0;--borderRadiusSmall:2px;--borderRadiusMedium:4px;--borderRadiusLarge:6px;--borderRadiusXLarge:8px;--borderRadius2XLarge:12px;--borderRadius3XLarge:16px;--borderRadiusCircular:10000px;--spacingXXS:2px;--spacingXS:4px;--spacingSNudge:6px;--spacingS:8px;--spacingMNudge:10px;--spacingM:12px;--spacingL:16px;--spacingXL:20px;--spacingXXL:24px;--spacingXXXL:32px;--strokeWidthThin:1px;--strokeWidthThick:2px;--fontFamilyBase:"Segoe UI", "Segoe UI Web (West European)", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", "Noto Sans JP", sans-serif;--fontSizeBase100:10px;--fontSizeBase200:12px;--fontSizeBase300:14px;--fontSizeBase400:16px;--fontSizeBase500:20px;--fontSizeBase600:24px;--fontWeightRegular:400;--fontWeightMedium:500;--fontWeightSemibold:600;--fontWeightBold:700;--lineHeightBase100:14px;--lineHeightBase200:16px;--lineHeightBase300:20px;--lineHeightBase400:22px;--lineHeightBase500:28px;--lineHeightBase600:32px;--sidebar-width:300px;--header-height:64px;--colorNeutralCardBackground:#fff;--colorNeutralPageBackground:#d6dbe3}*{box-sizing:border-box}body{font-family:var(--fontFamilyBase);background:var(--colorNeutralPageBackground);color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);-webkit-font-smoothing:antialiased;margin:0}#root{width:100%;margin:0}.app-layout{flex-direction:column;min-height:100vh;display:flex}.app-header{height:var(--header-height);background:var(--colorNeutralBackground1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);padding:0 var(--spacingXXL);z-index:50;box-shadow:var(--shadow2);align-items:center;display:flex;position:sticky;top:0}.header-content{align-items:center;gap:var(--spacingM);width:100%;display:flex}.app-title{font-size:var(--fontSizeBase500);font-weight:var(--fontWeightBold);line-height:var(--lineHeightBase500);color:var(--colorNeutralForeground1);letter-spacing:-.02em;margin:0}.app-subtitle{font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);color:var(--colorNeutralForeground3);margin:0}.result-count{font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);color:var(--colorNeutralForeground3);font-weight:var(--fontWeightSemibold);background:var(--colorNeutralBackground3);padding:var(--spacingXS) var(--spacingM);border-radius:var(--borderRadiusCircular);margin-left:auto}.sidebar-toggle{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusXLarge);padding:var(--spacingS);cursor:pointer;color:var(--colorNeutralForeground2);background:0 0;line-height:1;display:none}.sidebar-toggle:hover{background:var(--colorNeutralBackground3)}.content-layout{flex:1;display:flex}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--colorNeutralBackground1);border-right:var(--strokeWidthThin) solid var(--colorNeutralStroke2);padding:var(--spacingXL);height:calc(100vh - var(--header-height));top:var(--header-height);position:sticky;overflow-y:auto}.sidebar-overlay{display:none}.filter-search{margin-bottom:var(--spacingL);position:relative}.search-icon{left:var(--spacingM);color:var(--colorNeutralForeground4);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.search-input{width:100%;padding:var(--spacingSNudge) var(--spacingS) var(--spacingSNudge) 36px;font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralForeground3);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);outline:none;transition:border-color .15s}.search-input:focus{border-color:var(--colorNeutralStroke1);border-bottom-color:var(--colorBrandStroke1);border-bottom-width:var(--strokeWidthThick);padding-bottom:calc(var(--spacingSNudge) - 1px)}.search-input::placeholder{color:var(--colorNeutralForeground4)}.btn-clear{width:100%;padding:var(--spacingSNudge) var(--spacingL);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);background:var(--colorStatusDangerBackground1);color:var(--colorStatusDangerForeground1);border:var(--strokeWidthThin) solid transparent;border-radius:var(--borderRadiusMedium);cursor:pointer;margin-bottom:0;transition:background .15s}.btn-clear:hover{background:var(--colorStatusDangerBackground1Hover)}.filter-section{margin-bottom:var(--spacingL);padding-bottom:var(--spacingL);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke3)}.filter-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.preset-list{gap:var(--spacingS);display:grid}.preset-btn{align-items:flex-start;gap:var(--spacingXXS);width:100%;padding:var(--spacingM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusLarge);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);cursor:pointer;text-align:left;flex-direction:column;transition:border-color .15s,background .15s,transform .15s;display:flex}.preset-btn:hover{border-color:var(--colorBrandStroke1);background:#eef6fd;transform:translateY(-1px)}.preset-btn-title{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);font-weight:var(--fontWeightSemibold)}.preset-btn-description{font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);color:var(--colorNeutralForeground3)}.filter-section-title{font-size:var(--fontSizeBase100);line-height:var(--lineHeightBase100);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground3);text-transform:uppercase;letter-spacing:.05em;margin:0 0 var(--spacingM)}.range-field{margin-bottom:var(--spacingM)}.range-label{font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground2);margin-bottom:var(--spacingXS);display:block}.range-inputs{align-items:center;gap:var(--spacingXS);display:flex}.range-input{padding:var(--spacingSNudge) var(--spacingS);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralForeground3);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);outline:none;flex:1;min-width:0;transition:border-color .15s}.range-input:focus{border-color:var(--colorNeutralStroke1);border-bottom-color:var(--colorBrandStroke1);border-bottom-width:var(--strokeWidthThick);padding-bottom:calc(var(--spacingSNudge) - 1px)}.range-separator{color:var(--colorNeutralForeground4);font-size:var(--fontSizeBase200);flex-shrink:0}.filter-select{width:100%;padding:var(--spacingSNudge) var(--spacingS);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralForeground3);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%23616161' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;outline:none;padding-right:28px}.filter-select:focus{border-color:var(--colorNeutralStroke1);border-bottom-color:var(--colorBrandStroke1);border-bottom-width:var(--strokeWidthThick);padding-bottom:calc(var(--spacingSNudge) - 1px)}.tag-category{margin-bottom:var(--spacingS)}.tag-category-header{align-items:center;gap:var(--spacingS);margin-bottom:var(--spacingXS);display:flex}.tag-category-label{align-items:center;gap:var(--spacingS);cursor:pointer;padding:var(--spacingXS) 0;flex:1;display:flex}.tag-category-label:hover .tag-category-name{color:var(--colorBrandForeground1)}.chevron-icon{color:var(--colorNeutralForeground3);flex-shrink:0;transition:transform .15s}.tag-category-name{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);transition:color .15s}.tag-count-badge{font-size:var(--fontSizeBase100);font-weight:var(--fontWeightSemibold);background:var(--colorBrandBackground);color:#fff;border-radius:var(--borderRadiusCircular);line-height:var(--lineHeightBase100);padding:1px 7px}.mode-toggle{font-size:var(--fontSizeBase100);font-family:var(--fontFamilyBase);padding:var(--spacingXXS) var(--spacingS);border-radius:var(--borderRadiusCircular);cursor:pointer;white-space:nowrap;font-weight:var(--fontWeightSemibold);transition:all .15s}.mode-multi{color:var(--colorBrandForeground1);border:var(--strokeWidthThin) solid #b3d9f2;background:#e8f4fd}.mode-multi:hover{background:#d0eafb}.mode-single{background:var(--colorNeutralBackground3);color:var(--colorNeutralForeground3);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1)}.mode-single:hover{background:var(--colorNeutralStroke2)}.tag-list{padding-left:var(--spacingXL);padding-bottom:var(--spacingXS)}.tag-btn{margin:var(--spacingXXS);padding:var(--spacingXS) var(--spacingM);border-radius:var(--borderRadiusCircular);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);background:var(--colorNeutralBackground1);min-height:24px;color:var(--colorNeutralForeground2);cursor:pointer;font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-family:var(--fontFamilyBase);transition:all .15s;display:inline-block}.tag-btn:hover{background:var(--colorNeutralBackground3);border-color:var(--colorNeutralForeground4)}.tag-btn-active{background:var(--colorBrandBackground);color:#fff;border-color:var(--colorBrandBackground)}.tag-btn-active:hover{background:var(--colorBrandBackgroundHover);border-color:var(--colorBrandBackgroundHover)}.main-content{padding:var(--spacingXXL);flex:1;min-width:0}.detail-page{background:var(--colorNeutralPageBackground);min-height:100vh;padding:var(--spacingXXL)}.detail-shell{max-width:1120px;margin:0 auto}.detail-toolbar{justify-content:space-between;align-items:center;gap:var(--spacingM);margin-bottom:var(--spacingL);display:flex}.detail-back-btn,.detail-image-link{min-height:40px;padding:var(--spacingS) var(--spacingL);border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase200);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);cursor:pointer;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.detail-back-btn{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground2)}.detail-image-link{border:var(--strokeWidthThin) solid var(--colorBrandStroke1);background:var(--colorNeutralBackground1);color:var(--colorBrandForeground1)}.detail-hero,.detail-section{background:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadius2XLarge);box-shadow:var(--shadow2)}.detail-hero{gap:var(--spacingXXL);padding:var(--spacingXXL);margin-bottom:var(--spacingL);grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);display:grid}.detail-kicker{margin:0 0 var(--spacingXS);color:var(--colorBrandForeground1);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);font-weight:var(--fontWeightSemibold);letter-spacing:.04em;text-transform:uppercase}.detail-title-row{align-items:center;gap:var(--spacingS);margin-bottom:var(--spacingS);flex-wrap:wrap;display:flex}.detail-title{margin:0;font-size:clamp(28px,4vw,44px);line-height:1.05}.detail-meta{margin:0 0 var(--spacingL);color:var(--colorNeutralForeground3);font-size:var(--fontSizeBase300)}.detail-description{color:var(--colorNeutralForeground2);font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase400);margin:0}.detail-spec-grid{gap:var(--spacingM);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.detail-spec-card{padding:var(--spacingL);border-radius:var(--borderRadiusXLarge);background:var(--colorNeutralBackground3)}.detail-spec-label{margin-bottom:var(--spacingXS);color:var(--colorNeutralForeground4);font-size:var(--fontSizeBase100);text-transform:uppercase;display:block}.detail-spec-value{font-size:var(--fontSizeBase400);line-height:var(--lineHeightBase400);color:var(--colorNeutralForeground1)}.detail-section{padding:var(--spacingXL);margin-bottom:var(--spacingL)}.detail-section-header{justify-content:space-between;align-items:end;gap:var(--spacingM);margin-bottom:var(--spacingM);flex-wrap:wrap;display:flex}.detail-section-title{font-size:var(--fontSizeBase500);line-height:var(--lineHeightBase500);margin:0}.detail-section-copy,.detail-message{color:var(--colorNeutralForeground3);margin:0}.detail-tag-list{gap:var(--spacingXS);flex-wrap:wrap;display:flex}.similar-bike-grid{gap:var(--spacingL);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.similar-bike-card{gap:var(--spacingM);padding:var(--spacingL);border-radius:var(--borderRadiusXLarge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);background:var(--colorNeutralBackground1);color:inherit;flex-direction:column;text-decoration:none;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.similar-bike-card:hover{box-shadow:var(--shadow8);border-color:var(--colorBrandStroke1);transform:translateY(-2px)}.similar-bike-header{gap:var(--spacingXXS);flex-direction:column;display:flex}.similar-bike-header span{color:var(--colorNeutralForeground3);font-size:var(--fontSizeBase200)}.similar-bike-meta{gap:var(--spacingXS);color:var(--colorNeutralForeground2);font-size:var(--fontSizeBase200);flex-wrap:wrap;display:flex}.similar-bike-tags{gap:var(--spacingXS);flex-wrap:wrap;display:flex}.active-filters-panel{margin-bottom:var(--spacingXL);padding:var(--spacingL);background:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusXLarge);box-shadow:var(--shadow2)}.active-filters-header{justify-content:space-between;align-items:center;gap:var(--spacingS);margin-bottom:var(--spacingM);display:flex}.active-filters-title{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);margin:0}.active-filters-list{gap:var(--spacingS);flex-wrap:wrap;display:flex}.active-filter-chip{align-items:center;gap:var(--spacingXS);padding:var(--spacingXS) var(--spacingM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusCircular);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground2);cursor:pointer;font-size:var(--fontSizeBase200);font-family:var(--fontFamilyBase);transition:background .15s,border-color .15s,color .15s;display:inline-flex}.active-filter-chip:hover{border-color:var(--colorBrandStroke1);color:var(--colorBrandForeground1);background:#e8f4fd}.active-filter-chip-remove{font-size:var(--fontSizeBase300);line-height:1}.card-grid{gap:var(--spacingXL);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.bike-card{background:var(--colorNeutralCardBackground);border-radius:var(--borderRadiusXLarge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);box-shadow:var(--shadow2);cursor:default;transition:box-shadow .2s,transform .2s;display:flex;overflow:hidden}.bike-card[role=link]{cursor:pointer}.bike-card:hover{box-shadow:var(--shadow8);transform:translateY(-2px)}.bike-card[role=link]:focus-visible{outline:var(--strokeWidthThick) solid var(--colorBrandStroke1);outline-offset:var(--spacingXXS)}.card-body{padding:var(--spacingL) var(--spacingXL) var(--spacingXL);flex-direction:column;flex:1;display:flex}.card-header-row{justify-content:space-between;align-items:flex-start;gap:var(--spacingS);margin-bottom:var(--spacingXS);display:flex}.card-header-left{align-items:center;gap:var(--spacingS);flex:1;min-width:0;display:flex}.card-header-right{align-items:center;gap:var(--spacingXS);flex-shrink:0;display:flex}.card-title{font-size:var(--fontSizeBase400);font-weight:var(--fontWeightBold);line-height:var(--lineHeightBase400);color:var(--colorNeutralForeground1);letter-spacing:-.01em;margin:0}.card-title-link{color:inherit;border-bottom:1px solid #0000;text-decoration:none;transition:color .15s,border-color .15s}.card-title-link:hover{color:var(--colorBrandForeground1);border-color:currentColor}.card-year{font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);color:var(--colorNeutralForeground4);flex-shrink:0}.card-maker{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);margin-bottom:var(--spacingM)}.card-specs{gap:var(--spacingS) var(--spacingL);padding:var(--spacingM);background:var(--colorNeutralBackground3);border-radius:var(--borderRadiusMedium);margin-bottom:var(--spacingM);grid-template-columns:1fr 1fr;display:grid}.spec-item{flex-direction:column;display:flex}.spec-label{font-size:var(--fontSizeBase100);line-height:var(--lineHeightBase100);color:var(--colorNeutralForeground4);text-transform:uppercase;letter-spacing:.02em}.spec-value{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1)}.card-description{font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground2);margin:0 0 var(--spacingM);-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.card-running-cost{gap:var(--spacingXS) var(--spacingM);padding:var(--spacingS) var(--spacingM);border-radius:var(--borderRadiusMedium);margin-bottom:var(--spacingM);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200);color:var(--colorNeutralForeground2);background:#f9f5e8;flex-wrap:wrap;display:flex}.running-cost-label{width:100%;font-weight:var(--fontWeightSemibold);font-size:var(--fontSizeBase100);color:var(--colorNeutralForeground4);text-transform:uppercase;letter-spacing:.02em}.card-tags{gap:var(--spacingXS);flex-wrap:wrap;margin-top:auto;display:flex}.card-tag{font-size:var(--fontSizeBase100);line-height:var(--lineHeightBase100);font-weight:var(--fontWeightMedium);color:var(--colorBrandForeground2);border-radius:var(--borderRadiusCircular);padding:var(--spacingXXS) var(--spacingS);background:#e8f4fd;display:inline-block}.card-tag-button{cursor:pointer;border:1px solid #0000;transition:background .15s,color .15s,border-color .15s}.card-tag-button:hover{background:#d7ebfc}.card-tag-active{background:var(--colorBrandBackground);color:#fff;border-color:var(--colorBrandBackground)}.compare-btn{margin-top:var(--spacingM);width:100%;padding:var(--spacingXS) var(--spacingM);font-size:var(--fontSizeBase200);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground2);cursor:pointer;transition:all .15s}.compare-btn:hover:not(:disabled){background:var(--colorNeutralBackground3)}.compare-btn:disabled{opacity:.4;cursor:not-allowed}.compare-btn-active{color:var(--colorBrandForeground1);border-color:var(--colorBrandStroke1);background:#e8f4fd}.compare-tray{background:var(--colorNeutralBackground1);border-top:var(--strokeWidthThin) solid var(--colorNeutralStroke1);z-index:200;padding:var(--spacingM) var(--spacingXXL);position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 12px #0000001a}.compare-tray-content{align-items:center;gap:var(--spacingM);max-width:1200px;margin:0 auto;display:flex}.compare-tray-label{font-size:var(--fontSizeBase300);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);flex-shrink:0}.compare-tray-bikes{gap:var(--spacingXS);flex:1;display:flex;overflow-x:auto}.compare-tray-chip{align-items:center;gap:var(--spacingXS);color:var(--colorBrandForeground1);padding:var(--spacingXS) var(--spacingS);border-radius:var(--borderRadiusCircular);font-size:var(--fontSizeBase200);white-space:nowrap;background:#e8f4fd;display:flex}.compare-chip-remove{color:var(--colorBrandForeground1);cursor:pointer;background:0 0;border:none;padding:0;font-size:16px;line-height:1}.compare-tray-open{padding:var(--spacingS) var(--spacingXL);background:var(--colorBrandBackground);color:#fff;border-radius:var(--borderRadiusMedium);cursor:pointer;font-size:var(--fontSizeBase300);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);border:none;flex-shrink:0;transition:background .15s}.compare-tray-open:hover:not(:disabled){background:var(--colorBrandBackgroundHover)}.compare-tray-open:disabled{opacity:.5;cursor:not-allowed}.compare-overlay{z-index:300;padding:var(--spacingXXL);background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.compare-modal{background:var(--colorNeutralBackground1);border-radius:var(--borderRadius2XLarge);box-shadow:var(--shadow16);flex-direction:column;width:100%;max-width:800px;max-height:80vh;display:flex}.compare-modal-header{padding:var(--spacingXL);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);justify-content:space-between;align-items:center;display:flex}.compare-modal-header h2{font-size:var(--fontSizeBase500);color:var(--colorNeutralForeground1);margin:0}.compare-modal-close{color:var(--colorNeutralForeground3);cursor:pointer;padding:var(--spacingXS);background:0 0;border:none;font-size:24px}.compare-table-wrap{padding:var(--spacingXL);overflow:auto}.compare-table{border-collapse:collapse;width:100%;font-size:var(--fontSizeBase300)}.compare-table th,.compare-table td{padding:var(--spacingS) var(--spacingM);text-align:left;border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke3)}.compare-table th{font-weight:var(--fontWeightSemibold);color:var(--colorBrandForeground1)}.compare-label{font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground3);white-space:nowrap}.compare-diff{font-weight:var(--fontWeightSemibold);background:#fffde7}.favorite-btn{cursor:pointer;color:var(--colorNeutralForeground4);padding:var(--spacingXXS);background:0 0;border:none;flex-shrink:0;font-size:18px;line-height:1;transition:color .15s}.favorite-btn:hover,.favorite-active{color:#e74c3c}.status-badge{padding:var(--spacingXXS) var(--spacingS);border-radius:var(--borderRadiusSmall);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase100);flex-shrink:0}.status-discontinued{background:var(--colorStatusDangerBackground1);color:var(--colorStatusDangerForeground1)}.card-model-code{font-size:var(--fontSizeBase200);color:var(--colorNeutralForeground4)}.spec-highway-ok{color:#0e7a0d;font-weight:var(--fontWeightBold)}.spec-highway-ng{color:var(--colorStatusDangerForeground1);font-weight:var(--fontWeightBold)}.spec-foot-reach{font-weight:var(--fontWeightBold);padding:var(--spacingXXS) var(--spacingXS);border-radius:var(--borderRadiusSmall);color:var(--colorBrandForeground1);background:#e8f4fd}.market-availability{font-weight:var(--fontWeightBold)}.market-current{color:#0e7a0d}.market-high{color:var(--colorBrandForeground1)}.market-medium{color:#a06300}.market-low{color:var(--colorStatusDangerForeground1)}.filter-actions{gap:var(--spacingS);margin-bottom:var(--spacingM);flex-direction:column;display:flex}.btn-copy-url{width:100%;padding:var(--spacingXS) var(--spacingM);font-size:var(--fontSizeBase200);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorBrandStroke1);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorBrandForeground1);cursor:pointer;flex:none;transition:all .15s}.btn-copy-url:hover{background:#e8f4fd}.filter-checkbox{align-items:center;gap:var(--spacingS);font-size:var(--fontSizeBase200);color:var(--colorNeutralForeground2);cursor:pointer;margin-top:var(--spacingS);display:flex}.pagination{justify-content:center;align-items:center;gap:var(--spacingXS);margin-top:var(--spacingXXL);padding:var(--spacingL) 0;flex-wrap:wrap;display:flex}.pagination-summary{margin-right:var(--spacingS);color:var(--colorNeutralForeground3);font-size:var(--fontSizeBase200);line-height:var(--lineHeightBase200)}.pagination-btn{min-width:36px;height:36px;padding:var(--spacingXS) var(--spacingS);font-size:var(--fontSizeBase200);font-family:var(--fontFamilyBase);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground2);cursor:pointer;transition:all .15s}.pagination-btn:hover:not(:disabled){background:var(--colorNeutralBackground3);border-color:var(--colorNeutralForeground4)}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.pagination-btn-active{background:var(--colorBrandBackground);color:#fff;border-color:var(--colorBrandBackground)}.pagination-btn-active:hover{background:var(--colorBrandBackgroundHover)}.no-results{color:var(--colorNeutralForeground4);text-align:center;padding:60px var(--spacingXXL);font-size:var(--fontSizeBase300);line-height:var(--lineHeightBase300);grid-column:1/-1}@media (width<=768px){.sidebar-toggle{display:flex}.sidebar{left:calc(-1 * var(--sidebar-width) - 20px);z-index:100;height:100vh;box-shadow:var(--shadow16);transition:left .25s;position:fixed;top:0}.sidebar-open{left:0}.sidebar-overlay{z-index:99;background:#0006;display:block;position:fixed;inset:0}.card-grid{grid-template-columns:1fr}.main-content{padding:var(--spacingL)}.app-header{padding:0 var(--spacingL)}.detail-page{padding:var(--spacingL)}.detail-toolbar{flex-direction:column;align-items:stretch}.detail-hero{padding:var(--spacingL);grid-template-columns:1fr}.detail-spec-grid{grid-template-columns:1fr}.detail-section{padding:var(--spacingL)}}.sidebar::-webkit-scrollbar{width:var(--spacingSNudge)}.sidebar::-webkit-scrollbar-track{background:0 0}.sidebar::-webkit-scrollbar-thumb{background:var(--colorNeutralStroke1);border-radius:var(--borderRadiusCircular)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--colorNeutralForeground4)}:focus-visible{outline:var(--strokeWidthThick) solid var(--colorBrandStroke1);outline-offset:var(--spacingXXS)}input:focus-visible{outline:none}
