
  .ionix-sg-trigger-wrap,
  .ionix-sg-overlay,
  .ionix-sg-overlay * { box-sizing: border-box; }
  .ionix-sg-trigger-wrap { margin: 14px 0 10px; }
  .ionix-sg-trigger { display: inline-flex; align-items: center; gap: 10px; background: #FAF6F0; border: 1.5px solid #C4A265; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 600; color: #2D2A26; letter-spacing: 0.4px; padding: 12px 20px; border-radius: 999px; transition: all 0.25s ease; min-height: 44px; }
  .ionix-sg-trigger:hover { background: #C4A265; color: #fff; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(196, 162, 101, 0.25); }
  .ionix-sg-trigger__icon { flex-shrink: 0; color: #C4A265; transition: color 0.25s ease; }
  .ionix-sg-trigger:hover .ionix-sg-trigger__icon { color: #fff; }
  .ionix-sg-trigger__arrow { font-size: 16px; opacity: 0.6; transition: transform 0.25s ease; }
  .ionix-sg-trigger:hover .ionix-sg-trigger__arrow { transform: translateX(3px); opacity: 1; }
  .ionix-sg-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0); backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px); visibility: hidden; pointer-events: none; transition: background 0.35s ease, backdrop-filter 0.35s ease, visibility 0s 0.35s; padding: 20px; font-family: inherit; }
  .ionix-sg-overlay.is-open { background: rgba(0, 0, 0, 0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); visibility: visible; pointer-events: auto; transition: background 0.35s ease, backdrop-filter 0.35s ease, visibility 0s 0s; }
  .ionix-sg-modal { position: relative; width: 100%; max-width: 620px; max-height: 92vh; max-height: 92dvh; background: #FAF6F0; border-radius: 16px; overflow: hidden; box-shadow: 0 25px 60px rgba(0, 0, 0, 0.3); opacity: 0; transform: translateY(30px) scale(0.97); transition: opacity 0.35s ease, transform 0.35s ease; display: flex; flex-direction: column; }
  .ionix-sg-overlay.is-open .ionix-sg-modal { opacity: 1; transform: translateY(0) scale(1); }
  .ionix-sg-close { position: absolute; top: 12px; right: 12px; z-index: 3; width: 36px; height: 36px; border-radius: 50%; border: none; cursor: pointer; background: rgba(255, 255, 255, 0.9); color: #2D2A26; display: flex; align-items: center; justify-content: center; transition: background 0.2s ease, transform 0.2s ease; }
  .ionix-sg-close:hover { background: #fff; transform: scale(1.08); }
  .ionix-sg-header { padding: 28px 24px 14px; text-align: center; border-bottom: 1px solid rgba(107, 99, 87, 0.12); }
  .ionix-sg-title { margin: 0; font-family: Georgia, 'Cormorant Garamond', 'Times New Roman', serif; font-weight: 500; font-size: 28px; letter-spacing: 5px; color: #2D2A26; }
  .ionix-sg-hr { width: 36px; height: 2px; background: #C4A265; margin: 10px auto 8px; }
  .ionix-sg-sub { margin: 0; font-size: 12px; letter-spacing: 0.6px; color: #6B6357; }
  .ionix-sg-tabs { display: flex; border-bottom: 1px solid rgba(107, 99, 87, 0.12); background: #F2ECDF; }
  .ionix-sg-tab { flex: 1; background: none; border: none; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; color: #6B6357; padding: 14px 8px; letter-spacing: 0.8px; text-transform: uppercase; border-bottom: 2px solid transparent; transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease; }
  .ionix-sg-tab:hover { color: #2D2A26; background: rgba(255, 255, 255, 0.4); }
  .ionix-sg-tab.is-active { color: #2D2A26; border-bottom-color: #C4A265; background: #FAF6F0; }
  .ionix-sg-panel { display: none; padding: 22px 22px 28px; overflow-y: auto; -webkit-overflow-scrolling: touch; flex: 1 1 auto; }
  .ionix-sg-panel.is-active { display: block; }
  .ionix-ff-progress { position: relative; height: 4px; background: rgba(107, 99, 87, 0.1); border-radius: 2px; margin-bottom: 10px; }
  .ionix-ff-progress__bar { height: 100%; width: 33.33%; background: #C4A265; border-radius: 2px; transition: width 0.4s ease; }
  .ionix-ff-step-label { display: block; font-size: 10.5px; letter-spacing: 1px; color: #6B6357; text-transform: uppercase; margin-bottom: 18px; font-weight: 500; }
  .ionix-ff-step { display: none; animation: ionix-ff-fade 0.35s ease; }
  .ionix-ff-step.is-active { display: block; }
  @keyframes ionix-ff-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
  .ionix-ff-qtitle { margin: 0 0 6px; font-family: Georgia, 'Cormorant Garamond', serif; font-size: 22px; font-weight: 500; color: #2D2A26; }
  .ionix-ff-qhelp { margin: 0 0 20px; font-size: 13px; color: #6B6357; line-height: 1.5; }
  .ionix-ff-unit-toggle { display: inline-flex; background: #F2ECDF; border-radius: 999px; padding: 4px; margin-bottom: 18px; }
  .ionix-ff-unit { background: none; border: none; cursor: pointer; font-family: inherit; font-size: 11.5px; font-weight: 600; letter-spacing: 1px; color: #6B6357; padding: 6px 16px; border-radius: 999px; transition: all 0.25s ease; }
  .ionix-ff-unit.is-active { background: #2D2A26; color: #fff; }
  .ionix-ff-field { margin-bottom: 16px; }
  .ionix-ff-field label { display: block; font-size: 13px; font-weight: 600; color: #2D2A26; margin-bottom: 6px; }
  .ionix-ff-sub { display: block; font-size: 11px; font-weight: 400; color: #6B6357; margin-top: 2px; }
  .ionix-ff-input-row { position: relative; display: flex; align-items: center; }
  .ionix-ff-input-row input { width: 100%; padding: 12px 50px 12px 14px; border: 1.5px solid rgba(107, 99, 87, 0.2); border-radius: 10px; background: #fff; font-family: inherit; font-size: 15px; color: #2D2A26; transition: border-color 0.2s ease; -moz-appearance: textfield; }
  .ionix-ff-input-row input::-webkit-outer-spin-button, .ionix-ff-input-row input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
  .ionix-ff-input-row input:focus { outline: none; border-color: #C4A265; }
  .ionix-ff-unit-label { position: absolute; right: 14px; font-size: 12px; color: #6B6357; font-weight: 600; letter-spacing: 0.5px; pointer-events: none; }
  .ionix-ff-error { color: #B14545; font-size: 12.5px; margin-bottom: 10px; min-height: 18px; }
  .ionix-ff-next, .ionix-ff-restart { width: 100%; padding: 14px 20px; border: none; border-radius: 10px; background: #2D2A26; color: #fff; font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: 0.5px; cursor: pointer; transition: background 0.2s ease, transform 0.2s ease; margin-top: 6px; }
  .ionix-ff-next:hover, .ionix-ff-restart:hover { background: #C4A265; transform: translateY(-1px); }
  .ionix-ff-back { background: none; border: none; color: #6B6357; font-family: inherit; font-size: 13px; font-weight: 500; cursor: pointer; padding: 10px 0; transition: color 0.2s ease; }
  .ionix-ff-back:hover { color: #2D2A26; }
  .ionix-ff-nav-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 16px; }
  .ionix-ff-nav-row .ionix-ff-next { margin-top: 0; width: auto; flex: 1; }
  .ionix-ff-nav-result { margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(107, 99, 87, 0.12); }
  .ionix-ff-nav-result .ionix-ff-restart { width: auto; padding: 10px 20px; background: none; color: #6B6357; border: 1px solid rgba(107, 99, 87, 0.3); font-size: 12.5px; }
  .ionix-ff-nav-result .ionix-ff-restart:hover { background: #2D2A26; color: #fff; border-color: #2D2A26; }
  .ionix-ff-choices { display: grid; gap: 12px; margin: 10px 0 8px; }
  .ionix-ff-choice { cursor: pointer; display: block; }
  .ionix-ff-choice input { position: absolute; opacity: 0; pointer-events: none; }
  .ionix-ff-choice-card { position: relative; padding: 16px 18px; background: #fff; border: 1.5px solid rgba(107, 99, 87, 0.2); border-radius: 12px; transition: all 0.2s ease; }
  .ionix-ff-choice input:checked + .ionix-ff-choice-card { border-color: #C4A265; background: #FAF6F0; box-shadow: 0 0 0 3px rgba(196, 162, 101, 0.15); }
  .ionix-ff-choice-card h4 { margin: 0 0 4px; font-size: 15px; font-weight: 600; color: #2D2A26; }
  .ionix-ff-choice-card p { margin: 0; font-size: 12.5px; color: #6B6357; line-height: 1.5; }
  .ionix-ff-choice-badge { position: absolute; top: -8px; right: 14px; background: #C4A265; color: #fff; font-size: 9px; font-weight: 700; letter-spacing: 1px; padding: 3px 8px; border-radius: 999px; }
  .ionix-ff-result__title { font-size: 11px; letter-spacing: 1.5px; color: #6B6357; text-transform: uppercase; margin: 0 0 8px; font-weight: 600; text-align: center; }
  .ionix-ff-result__size { font-family: Georgia, 'Cormorant Garamond', serif; font-size: 72px; font-weight: 500; color: #2D2A26; text-align: center; line-height: 1; margin: 0 0 8px; letter-spacing: 2px; }
  .ionix-ff-result__intl { text-align: center; font-size: 12px; color: #6B6357; margin: 0 0 20px; letter-spacing: 0.5px; }
  .ionix-ff-result__rows { background: #fff; border-radius: 12px; padding: 6px 0; border: 1px solid rgba(107, 99, 87, 0.12); }
  .ionix-ff-result__row { display: flex; justify-content: space-between; align-items: center; padding: 12px 18px; border-bottom: 1px solid rgba(107, 99, 87, 0.08); font-size: 13px; }
  .ionix-ff-result__row:last-child { border-bottom: none; }
  .ionix-ff-result__row-label { color: #6B6357; }
  .ionix-ff-result__row-value { color: #2D2A26; font-weight: 600; }
  .ionix-ff-result__note { margin: 16px 0 0; padding: 14px 16px; background: #F2ECDF; border-left: 3px solid #C4A265; border-radius: 8px; font-size: 12.5px; color: #6B6357; line-height: 1.55; }
  .ionix-ff-result__note strong { color: #2D2A26; display: block; margin-bottom: 4px; font-size: 13px; }
  .ionix-ff-result__note--warn { background: #FCF3E8; border-left-color: #D18B3C; }
  .ionix-sg-rule { display: flex; align-items: center; gap: 12px; background: #F2ECDF; border-left: 3px solid #C4A265; padding: 12px 14px; border-radius: 8px; margin-bottom: 16px; }
  .ionix-sg-rule__icon { width: 26px; height: 26px; flex-shrink: 0; background: #C4A265; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-family: Georgia, serif; }
  .ionix-sg-rule__text { font-size: 13px; color: #6B6357; line-height: 1.4; }
  .ionix-sg-rule__text strong { color: #2D2A26; }
  .ionix-sg-rule__text u { color: #9E7F47; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
  .ionix-sg-table { width: 100%; border-collapse: collapse; font-size: 13px; border-radius: 10px; overflow: hidden; margin-bottom: 16px; }
  .ionix-sg-table thead th { background: linear-gradient(180deg, #C4A265 0%, #9E7F47 100%); color: #fff; font-weight: 600; font-size: 10.5px; letter-spacing: 1.3px; text-transform: uppercase; padding: 12px 6px; text-align: center; }
  .ionix-sg-table tbody tr { border-bottom: 1px solid rgba(107, 99, 87, 0.1); }
  .ionix-sg-table tbody tr:nth-child(even) { background: #F2ECDF; }
  .ionix-sg-table tbody td { padding: 14px 6px; text-align: center; vertical-align: middle; }
  .ionix-sg-size { font-family: Georgia, 'Cormorant Garamond', serif; font-size: 20px; font-weight: 600; color: #2D2A26; line-height: 1; display: block; }
  .ionix-sg-sintl { display: block; font-size: 9.5px; color: #6B6357; letter-spacing: 0.3px; margin-top: 3px; }
  .ionix-sg-v1 { display: block; font-weight: 600; color: #2D2A26; font-size: 13.5px; }
  .ionix-sg-v2 { display: block; font-size: 10.5px; color: #6B6357; margin-top: 2px; }
  .ionix-sg-intl { margin: 8px 0 18px; background: #fff; border: 1px solid rgba(107, 99, 87, 0.15); border-radius: 10px; padding: 10px 14px; }
  .ionix-sg-intl summary { cursor: pointer; font-size: 12.5px; font-weight: 600; color: #2D2A26; padding: 4px 0; list-style: none; }
  .ionix-sg-intl summary::-webkit-details-marker { display: none; }
  .ionix-sg-intl summary::before { content: '+ '; color: #C4A265; font-weight: 700; }
  .ionix-sg-intl[open] summary::before { content: '− '; }
  .ionix-sg-intl-table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 11.5px; }
  .ionix-sg-intl-table th { background: #2D2A26; color: #fff; padding: 8px 4px; font-size: 9.5px; letter-spacing: 0.5px; text-transform: uppercase; font-weight: 600; }
  .ionix-sg-intl-table td { padding: 10px 4px; text-align: center; border-bottom: 1px solid rgba(107, 99, 87, 0.1); color: #2D2A26; }
  .ionix-sg-intl-table tbody tr:nth-child(even) { background: #F2ECDF; }
  .ionix-sg-howto { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 8px; }
  .ionix-sg-howto__card { background: #fff; border: 1px solid rgba(107, 99, 87, 0.15); border-radius: 10px; padding: 14px 10px; text-align: center; }
  .ionix-sg-howto__num { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; background: #C4A265; color: #fff; border-radius: 50%; font-size: 11px; font-weight: 700; margin-bottom: 8px; }
  .ionix-sg-howto__card h4 { margin: 0 0 4px; font-family: Georgia, serif; font-size: 14px; color: #2D2A26; font-weight: 600; }
  .ionix-sg-howto__card p { margin: 0; font-size: 10.5px; color: #6B6357; line-height: 1.45; }
  @media (max-width: 520px) {
    .ionix-sg-modal { max-width: 100%; border-radius: 14px; }
    .ionix-sg-title { font-size: 22px; letter-spacing: 3px; }
    .ionix-sg-panel { padding: 18px 14px 22px; }
    .ionix-sg-tab { font-size: 11.5px; letter-spacing: 0.4px; padding: 12px 4px; }
    .ionix-sg-table { font-size: 11px; }
    .ionix-sg-table thead th { font-size: 9px; padding: 9px 3px; letter-spacing: 0.5px; }
    .ionix-sg-table tbody td { padding: 11px 3px; }
    .ionix-sg-size { font-size: 16px; }
    .ionix-sg-v1 { font-size: 12px; }
    .ionix-sg-v2 { font-size: 9.5px; }
    .ionix-sg-sintl { font-size: 8.5px; }
    .ionix-sg-howto { grid-template-columns: 1fr; }
    .ionix-ff-result__size { font-size: 60px; }
    .ionix-ff-qtitle { font-size: 19px; }
  }
