.hmc-app{
    
    --pri: #133B32;        
    --pri-h: #1F5A4D;      
    --sub: #3F8E7A;        
    --surface: #EEF7F4;
    --tint: #C6E0D7;
    --line: #D5E6E0;
    --ink: #1A2622;
    --muted: #4E5F59;
    --on-pri: #EEF7F4;
    
    --room: #997A33;
    --room-bg: #FBF7EC;
    --room-fill: #E4D5AE;
    --err: #A33B2E;
    --sans: "Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
    --num: Inter,"Noto Sans JP",system-ui,sans-serif;
  }
.hmc-app *{ box-sizing: border-box; margin: 0; padding: 0; }
.hmc-app{
    font-family: var(--sans);
    background: var(--surface);
    color: var(--ink);
    min-height: 100vh;
    line-height: 1.9;
    letter-spacing: .02em;
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
  }
.hmc-app h1,.hmc-app h2,.hmc-app h3{ font-weight: 700; line-height: 1.55; letter-spacing: .03em; }
.hmc-app .site-header{ background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.hmc-app .site-header .inner{
    max-width: 520px; margin: 0 auto; padding: 0 16px;
    height: 60px; display: flex; align-items: center;
  }
.hmc-app .brand{ display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
.hmc-app .brand-name{ font-weight: 700; font-size: 14px; line-height: 1.35; letter-spacing: .03em; }
.hmc-app .brand-sub{ display: block; font-size: 10px; font-weight: 500; color: var(--muted); letter-spacing: .05em; }
.hmc-app .site-nav{ border-bottom: 1px solid var(--line); background: #fff; }
.hmc-app .site-nav .inner{
    max-width: 520px; margin: 0 auto; padding: 0 16px;
    display: flex; gap: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
.hmc-app .site-nav a{
    flex: none; font-size: 12px; font-weight: 500; color: var(--muted);
    text-decoration: none; padding: 11px 0; white-space: nowrap;
  }
.hmc-app .site-nav a:hover{ color: var(--pri); }
.hmc-app .stage{ padding: 22px 16px 40px; display: flex; justify-content: center; }
.hmc-app .card{
    background: #fff; border: 1px solid var(--line); border-radius: 8px;
    padding: 30px 26px; width: 100%; max-width: 488px;
  }
.hmc-app #screen-top{ text-align: center; }
.hmc-app .logo-badge{
    display: inline-block; background: var(--surface); color: var(--pri);
    font-size: 11px; font-weight: 700; letter-spacing: 1.2px;
    padding: 5px 14px; border-radius: 4px; margin-bottom: 16px;
  }
.hmc-app #screen-top h2{ font-size: 22px; line-height: 1.6; margin-bottom: 12px; }
.hmc-app #screen-top .lead{ color: var(--muted); font-size: 13.5px; line-height: 1.9; margin-bottom: 20px; }
.hmc-app .face-row{ display: flex; gap: 6px; justify-content: center; margin-bottom: 18px; flex-wrap: wrap; }
.hmc-app .face{
    font-size: 11.5px; font-weight: 500; padding: 7px 11px; border-radius: 4px;
    background: var(--surface); border: 1px solid var(--line); color: var(--muted);
  }
.hmc-app .maker-note{
    background: var(--surface); border-left: 3px solid var(--pri); border-radius: 0 4px 4px 0;
    padding: 14px 15px; text-align: left; font-size: 12.5px; line-height: 1.95;
    color: var(--muted); margin-bottom: 20px;
  }
.hmc-app .maker-note b{ color: var(--pri); }
.hmc-app .meta-note{ font-size: 11.5px; color: var(--muted); margin-bottom: 16px; }
.hmc-app .facts{ display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 20px; }
.hmc-app .facts div{ border: 1px solid var(--line); border-radius: 4px; padding: 10px 8px; }
.hmc-app .facts dt{ font-size: 10.5px; color: var(--muted); line-height: 1.5; }
.hmc-app .facts dd{ margin-top: 2px; font-size: 13px; font-weight: 700; line-height: 1.5; }
.hmc-app .btn-start,.hmc-app .btn-cta,.hmc-app .btn-next,.hmc-app .btn-submit{
    width: 100%; padding: 16px; border-radius: 4px; border: none;
    background: var(--pri); color: var(--on-pri);
    font-family: var(--sans); font-size: 15px; font-weight: 700;
    cursor: pointer; letter-spacing: .04em; transition: background .15s;
  }
.hmc-app .btn-start:hover,.hmc-app .btn-cta:hover,.hmc-app .btn-next:hover,.hmc-app .btn-submit:hover{ background: var(--pri-h); }
.hmc-app .btn-submit[disabled]{ background: var(--sub); cursor: default; }
.hmc-app :focus-visible{ outline: 2px solid var(--pri); outline-offset: 3px; border-radius: 2px; }
.hmc-app .progress-wrap{ margin-bottom: 22px; }
.hmc-app .progress-labels{
    display: flex; justify-content: space-between;
    font-size: 11.5px; color: var(--muted); margin-bottom: 7px; font-weight: 700;
  }
.hmc-app .progress-stage{ color: var(--pri); }
.hmc-app .progress-count{ font-family: var(--num); }
.hmc-app .progress-bar{ height: 5px; background: var(--line); border-radius: 3px; overflow: hidden; }
.hmc-app .progress-fill{ height: 100%; background: var(--pri); border-radius: 3px; transition: width .4s cubic-bezier(.4,0,.2,1); }
.hmc-app #screen-q1,.hmc-app #screen-q2{ display: none; }
.hmc-app .q-axis-badge{
    display: inline-block; font-size: 11px; font-weight: 700;
    letter-spacing: .4px; padding: 4px 11px; border-radius: 4px; margin-bottom: 14px;
    background: var(--surface); color: var(--pri-h);
  }
.hmc-app .q-text{ font-size: 17px; font-weight: 700; line-height: 1.75; margin-bottom: 20px; }
.hmc-app .choices{ display: flex; flex-direction: column; gap: 9px; }
.hmc-app .choice-btn{
    background: #fff; border: 1px solid var(--line); border-radius: 4px;
    padding: 15px 17px; color: var(--ink);
    font-family: var(--sans); font-size: 14.5px; font-weight: 500;
    text-align: left; line-height: 1.7; cursor: pointer; transition: all .15s;
  }
.hmc-app .choice-btn.center{ text-align: center; font-weight: 700; }
.hmc-app .choice-btn:hover{ background: var(--surface); border-color: var(--sub); }
.hmc-app .choice-btn.selected{ background: var(--surface); border-color: var(--pri); color: var(--pri); font-weight: 700; }
.hmc-app .col-box{ margin-top: 20px; border-top: 1px solid var(--line); padding-top: 15px; }
.hmc-app .col-label{ font-size: 11px; font-weight: 700; color: var(--muted); letter-spacing: .06em; margin-bottom: 9px; }
.hmc-app .col-card{
    display: block; border: 1px solid var(--line); border-left: 3px solid var(--sub);
    border-radius: 0 4px 4px 0; padding: 12px 14px; text-decoration: none;
    background: var(--surface); transition: background .15s;
  }
.hmc-app .col-card:hover{ background: var(--tint); }
.hmc-app .col-title{ display: block; font-size: 13px; font-weight: 700; color: var(--pri); line-height: 1.7; }
.hmc-app .col-meta{ display: block; font-size: 10.5px; color: var(--muted); margin-top: 5px; line-height: 1.6; }
.hmc-app .col-more{
    display: inline-block; font-size: 11.5px; font-weight: 700; color: var(--pri-h);
    text-decoration: none; margin-top: 10px; border-bottom: 1px solid var(--tint); padding-bottom: 1px;
  }
.hmc-app .col-more:hover{ border-bottom-color: var(--pri-h); }
.hmc-app .exp-box{ margin-top: 20px; border-top: 1px solid var(--line); padding-top: 14px; }
.hmc-app .exp-toggle{
    background: none; border: none; cursor: pointer; padding: 0;
    font-family: var(--sans); font-size: 12px; font-weight: 700; color: var(--pri);
    text-align: left; line-height: 1.6;
  }
.hmc-app .exp-toggle:hover{ text-decoration: underline; text-underline-offset: 3px; }
.hmc-app .exp-body{
    display: none; margin-top: 11px; background: var(--surface);
    border-radius: 4px; padding: 13px 14px; font-size: 12px; line-height: 1.95; color: var(--muted);
  }
.hmc-app .exp-body.open{ display: block; }
.hmc-app .exp-who{ font-size: 11px; font-weight: 700; color: var(--pri); margin-bottom: 5px; }
.hmc-app .exp-tmp{ font-size: 10.5px; color: var(--err); font-weight: 700; margin-top: 8px; }
.hmc-app #screen-loading{ display: none; text-align: center; padding: 56px 0; }
.hmc-app .spinner{
    width: 42px; height: 42px; border: 3px solid var(--line); border-top-color: var(--pri);
    border-radius: 50%; animation: spin .8s linear infinite; margin: 0 auto 22px;
  }
@keyframes spin { to { transform: rotate(360deg); } }
.hmc-app #screen-loading p{ color: var(--muted); font-size: 13.5px; font-weight: 700; }
.hmc-app #screen-type{ display: none; }
.hmc-app .type-head{ text-align: center; margin-bottom: 18px; }
.hmc-app .type-eyebrow{ font-size: 11.5px; color: var(--muted); font-weight: 700; margin-bottom: 6px; }
.hmc-app .type-name{ font-size: 25px; font-weight: 700; color: var(--pri); line-height: 1.45; }
.hmc-app .figures-panel{
    background: var(--surface); border: 1px solid var(--tint);
    border-radius: 8px; padding: 14px 13px 15px; margin-top: 18px;
  }
.hmc-app .figures-label{
    font-size: 11.5px; font-weight: 700; color: var(--pri);
    letter-spacing: .06em; margin-bottom: 12px; text-align: center;
  }
.hmc-app .fig-chips{ display: flex; gap: 9px; }
.hmc-app .fig-chip{
    flex: 1; background: #fff; border: 1px solid var(--line);
    border-radius: 4px; padding: 12px 8px 13px; text-align: center;
  }
.hmc-app .fig-name{ font-size: 16px; font-weight: 700; color: var(--pri); line-height: 1.45; margin-bottom: 6px; }
.hmc-app .fig-note{ font-size: 10.5px; color: var(--muted); line-height: 1.65; }
@media (max-width: 380px) {.hmc-app .fig-name{ font-size: 14.5px; }}
.hmc-app .tease{
    font-size: 12.5px; font-weight: 500; color: var(--muted);
    background: var(--surface); border: 1px solid var(--line);
    border-radius: 4px; padding: 12px 13px; margin-bottom: 18px; line-height: 1.9;
  }
.hmc-app .tease .names{ color: var(--pri); font-size: 13.5px; font-weight: 700; }
.hmc-app .type-desc{ font-size: 13.5px; line-height: 1.95; color: var(--muted); margin: 18px 0; }
.hmc-app .block{ border: 1px solid var(--line); border-radius: 8px; padding: 16px 17px; margin-bottom: 13px; }
.hmc-app .block-t{ font-size: 12.5px; font-weight: 700; color: var(--pri); margin-bottom: 9px; line-height: 1.6; }
.hmc-app .block ul{ margin: 0; padding-left: 18px; }
.hmc-app .block li{ font-size: 12.5px; line-height: 1.9; color: var(--muted); margin-bottom: 3px; }
.hmc-app .block p{ font-size: 12.5px; line-height: 1.95; color: var(--muted); }
.hmc-app .block.story{ background: var(--surface); }
.hmc-app .blind-tag{
    display: inline-block; font-size: 12px; font-weight: 700; padding: 5px 12px;
    border-radius: 4px; margin-top: 2px; background: var(--tint); color: var(--pri);
  }
.hmc-app .next-note{ font-size: 12.5px; color: var(--muted); line-height: 1.95; margin: 18px 0 14px; text-align: center; }
.hmc-app .next-note b{ color: var(--ink); }
.hmc-app #screen-lead{ display: none; }
.hmc-app .lead-head{ text-align: center; margin-bottom: 18px; }
.hmc-app .lead-eyebrow{
    display: inline-block; background: var(--surface); color: var(--pri);
    font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: 4px; margin-bottom: 12px;
  }
.hmc-app .lead-head h2{ font-size: 19px; color: var(--pri); margin-bottom: 9px; line-height: 1.6; }
.hmc-app .lead-head p{ font-size: 12.5px; color: var(--muted); line-height: 1.95; }
.hmc-app .lead-benefit{ background: var(--surface); border-radius: 8px; padding: 14px 16px; margin-bottom: 20px; }
.hmc-app .lead-benefit ul{ list-style: none; margin: 0; padding: 0; }
.hmc-app .lead-benefit li{ font-size: 12.5px; line-height: 1.85; color: var(--muted); padding-left: 20px; position: relative; }
.hmc-app .lead-benefit li + li{ margin-top: 7px; }
.hmc-app .lead-benefit li::before{
    content: ""; position: absolute; left: 3px; top: .95em;
    width: 6px; height: 6px; border-radius: 50%; background: var(--sub);
  }
.hmc-app .lead-benefit b{ color: var(--pri); }
.hmc-app .fld{ margin-bottom: 15px; }
.hmc-app .fld label{ display: block; font-size: 12px; font-weight: 700; color: var(--ink); margin-bottom: 5px; line-height: 1.5; }
.hmc-app .fld .req{ color: var(--err); font-size: 10.5px; font-weight: 700; margin-left: 5px; }
.hmc-app .fld .opt{ color: var(--muted); font-size: 10.5px; font-weight: 500; margin-left: 5px; }
.hmc-app .fld .hint{ font-size: 10.5px; color: var(--muted); font-weight: 400; line-height: 1.7; margin-top: 4px; }
.hmc-app .fld input,.hmc-app .fld select{
    width: 100%; padding: 12px 13px; border: 1px solid var(--line); border-radius: 4px;
    font-family: var(--sans); font-size: 14.5px; color: var(--ink); background: #fff; line-height: 1.6;
  }
.hmc-app .fld input:focus,.hmc-app .fld select:focus{ outline: 2px solid var(--pri); outline-offset: 1px; border-color: var(--pri); }
.hmc-app .fld input.bad,.hmc-app .fld select.bad{ border-color: var(--err); background: #FDF6F4; }
.hmc-app .fld .err-msg{ display: none; font-size: 11px; font-weight: 700; color: var(--err); margin-top: 5px; line-height: 1.7; }
.hmc-app .fld .err-msg.on{ display: block; }
.hmc-app .consent{
    display: flex; gap: 10px; align-items: flex-start;
    background: var(--surface); border-radius: 4px; padding: 13px 14px; margin-bottom: 7px;
  }
.hmc-app .consent input{ width: 18px; height: 18px; flex: none; margin-top: 3px; accent-color: var(--pri); }
.hmc-app .consent label{ font-size: 12px; font-weight: 400; color: var(--muted); line-height: 1.85; margin: 0; }
.hmc-app .consent label a{ color: var(--pri); font-weight: 700; }
.hmc-app .consent.bad{ background: #FDF6F4; outline: 1px solid var(--err); }
.hmc-app .send-msg{ font-size: 12px; font-weight: 700; line-height: 1.8; margin-top: 12px; display: none; }
.hmc-app .send-msg.on{ display: block; }
.hmc-app .send-msg.ng{ color: var(--err); }
.hmc-app .send-msg.ok{ color: var(--pri); }
.hmc-app .btn-skip{
    width: 100%; padding: 13px; border-radius: 4px; border: none; background: none;
    color: var(--muted); font-family: var(--sans); font-size: 13px; font-weight: 700;
    cursor: pointer; margin-top: 12px; text-decoration: underline; text-underline-offset: 3px;
  }
.hmc-app .btn-skip:hover{ color: var(--ink); }
.hmc-app .lead-note{ font-size: 10.5px; color: var(--muted); line-height: 1.85; margin-top: 14px; text-align: center; }
.hmc-app .lead-status{ border-radius: 8px; padding: 14px 16px; margin-bottom: 18px; font-size: 12.5px; line-height: 1.9; }
.hmc-app .lead-status.done{ background: var(--surface); color: var(--muted); }
.hmc-app .lead-status.done b{ color: var(--pri); }
.hmc-app #screen-result{ display: none; }
.hmc-app .result-badge{
    display: inline-block; background: var(--surface); color: var(--pri);
    font-size: 11px; font-weight: 700; letter-spacing: 1.2px;
    padding: 5px 14px; border-radius: 4px; margin-bottom: 14px;
  }
.hmc-app .result-head{ text-align: center; margin-bottom: 20px; }
.hmc-app .result-head h2{ font-size: 19px; color: var(--pri); margin-bottom: 7px; }
.hmc-app .result-head p{ font-size: 12px; color: var(--muted); line-height: 1.85; }
.hmc-app .result-head p b{ color: var(--room); }
.hmc-app .type-recap{
    display: flex; flex-direction: column; align-items: flex-start; gap: 9px;
    background: var(--surface); border-radius: 8px; padding: 14px 15px; margin-bottom: 20px;
  }
.hmc-app .type-recap .tr-l{ font-size: 10.5px; color: var(--muted); font-weight: 700; }
.hmc-app .type-recap .tr-n{ font-size: 17px; font-weight: 700; color: var(--pri); }
.hmc-app .type-recap .tr-f{
    width: 100%; font-size: 14px; font-weight: 700; color: var(--pri);
    background: #fff; border: 1px solid var(--tint); border-radius: 4px; padding: 8px 12px; line-height: 1.7;
  }
.hmc-app .type-recap .tr-f .tr-f-l{ display: block; font-size: 10px; color: var(--muted); font-weight: 700; margin-bottom: 2px; }
.hmc-app .sec-title{
    font-size: 13.5px; font-weight: 700; color: var(--pri);
    border-left: 3px solid var(--pri); padding-left: 10px; margin: 26px 0 14px; line-height: 1.6;
  }
.hmc-app .res-axis-row{ margin-bottom: 15px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.hmc-app .res-axis-row:last-child{ border-bottom: none; }
.hmc-app .res-axis-top{ display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.hmc-app .res-axis-icon{
    width: 32px; height: 32px; border-radius: 4px; background: var(--surface);
    display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0;
  }
.hmc-app .res-axis-name{ flex: 1; }
.hmc-app .res-axis-name .n1{ font-size: 14.5px; font-weight: 700; line-height: 1.5; color: var(--pri); }
.hmc-app .res-axis-name .n2{ font-size: 10.5px; color: var(--muted); }
.hmc-app .res-axis-lv{ font-family: var(--num); font-size: 12px; font-weight: 600; white-space: nowrap; color: var(--pri); }
.hmc-app .res-axis-meter{ display: flex; gap: 4px; margin-bottom: 8px; }
.hmc-app .meter-seg{ flex: 1; height: 10px; border-radius: 2px; }
.hmc-app .meter-seg.on{ background: var(--pri); }
.hmc-app .meter-seg.off{ background: var(--room-fill); }
.hmc-app .res-axis-comment{ font-size: 12px; color: var(--muted); line-height: 1.8; }
.hmc-app .lv-badge{
    display: inline-block; font-family: var(--sans); font-size: 10px; font-weight: 700; color: #fff;
    border-radius: 3px; padding: 2px 7px; margin-left: 6px; vertical-align: middle;
  }
.hmc-app .meter-legend{
    display: flex; gap: 16px; justify-content: center; flex-wrap: wrap;
    font-size: 10.5px; color: var(--muted); margin-bottom: 16px;
  }
.hmc-app .meter-legend span{ display: flex; align-items: center; gap: 5px; }
.hmc-app .lg-sw{ width: 15px; height: 9px; border-radius: 2px; display: inline-block; }
.hmc-app .blind-mark{
    display: inline-block; font-size: 10px; font-weight: 700; color: #fff;
    background: var(--room); border-radius: 3px; padding: 2px 7px; margin-left: 6px; vertical-align: middle;
  }
.hmc-app .match-box{
    border: 1px solid var(--room); border-radius: 8px;
    padding: 16px 17px; margin: 20px 0; background: var(--room-bg);
  }
.hmc-app .match-box .mt{ font-size: 12.5px; font-weight: 700; color: var(--room); margin-bottom: 8px; }
.hmc-app .match-box p{ font-size: 13px; line-height: 1.95; color: #41392B; }
.hmc-app .match-box .em{ font-weight: 700; color: var(--room); }
.hmc-app .partner-box{ background: var(--surface); border-radius: 8px; padding: 17px; margin-bottom: 16px; }
.hmc-app .partner-box .pt{ font-size: 13.5px; font-weight: 700; color: var(--pri); margin-bottom: 9px; line-height: 1.6; }
.hmc-app .partner-box p{ font-size: 12.5px; line-height: 1.95; color: var(--muted); margin-bottom: 11px; }
.hmc-app .partner-tag{
    display: inline-block; background: #fff; border: 1px solid var(--pri);
    color: var(--pri); font-size: 12px; font-weight: 700; border-radius: 4px; padding: 7px 12px; line-height: 1.6;
  }
.hmc-app .partner-link{
    display: inline-block; font-size: 11.5px; font-weight: 700; color: var(--pri-h);
    text-decoration: none; margin-top: 11px; border-bottom: 1px solid var(--tint); padding-bottom: 1px;
  }
.hmc-app .partner-link:hover{ border-bottom-color: var(--pri-h); }
.hmc-app .why-list{ list-style: none; padding: 0; margin: 0; }
.hmc-app .why-list li{
    font-size: 12.5px; line-height: 1.9; color: var(--muted);
    padding: 11px 0 11px 22px; position: relative; border-bottom: 1px solid var(--line);
  }
.hmc-app .why-list li:last-child{ border-bottom: none; }
.hmc-app .why-list li::before{
    content: ""; position: absolute; left: 4px; top: 1.1em;
    width: 6px; height: 6px; border-radius: 50%; background: var(--sub);
  }
.hmc-app .why-list b{ color: var(--pri); }
.hmc-app .cmp{ width: 100%; border-collapse: collapse; margin-bottom: 9px; }
.hmc-app .cmp th,.hmc-app .cmp td{ padding: 10px 6px; font-size: 11.5px; border-bottom: 1px solid var(--line); }
.hmc-app .cmp thead th{ font-size: 11px; color: var(--muted); font-weight: 700; border-bottom: 1.5px solid var(--line); line-height: 1.5; }
.hmc-app .cmp thead th.c2{ color: var(--pri); }
.hmc-app .cmp tbody th{ text-align: left; font-weight: 400; color: var(--ink); line-height: 1.7; }
.hmc-app .cmp tbody th{ width: 24%; font-weight: 700; color: var(--muted); font-size: 11px; }
.hmc-app .cmp td{ text-align: center; width: 38%; line-height: 1.65; color: var(--muted); }
.hmc-app .cmp td.paid{ color: var(--pri); font-weight: 700; }
.hmc-app .cmp-note{ font-size: 11.5px; color: var(--muted); line-height: 1.95; }
.hmc-app .cmp-note b{ color: var(--ink); }
.hmc-app .sample{ border: 1px solid var(--tint); border-radius: 8px; padding: 0; overflow: hidden; margin-bottom: 9px; }
.hmc-app .sample-hd{
    background: var(--pri); color: var(--on-pri); padding: 10px 14px;
    font-size: 12px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 8px;
  }
.hmc-app .sample-hd .tag{ background: rgba(255,255,255,.18); border-radius: 3px; padding: 2px 7px; font-size: 10px; flex: none; }
.hmc-app .sample-bd{ padding: 14px; }
.hmc-app .sample-row{ margin-bottom: 12px; }
.hmc-app .sample-row:last-child{ margin-bottom: 0; }
.hmc-app .sample-row .sl{ font-size: 11.5px; font-weight: 700; color: var(--pri); margin-bottom: 3px; }
.hmc-app .sample-row .sv{ font-size: 12px; color: var(--muted); line-height: 1.85; }
.hmc-app .road{ display: flex; flex-direction: column; gap: 8px; margin-bottom: 9px; }
.hmc-app .road-step{ display: flex; gap: 11px; align-items: flex-start; border: 1px solid var(--line); border-radius: 8px; padding: 13px 14px; }
.hmc-app .road-step.now{ border-color: var(--room); background: var(--room-bg); }
.hmc-app .road-step.now .rs-no{ background: var(--room); }
.hmc-app .rs-no{
    width: 22px; height: 22px; border-radius: 50%; background: var(--sub);
    color: #fff; font-family: var(--num); font-size: 11px; font-weight: 600;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px;
  }
.hmc-app .rs-no.paid{ background: var(--pri); }
.hmc-app .rs-t{ font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 2px; line-height: 1.6; }
.hmc-app .rs-d{ font-size: 11px; color: var(--muted); line-height: 1.85; }
.hmc-app .rs-now-tag{ font-size: 10px; font-weight: 700; color: var(--room); }
.hmc-app .rs-step-no{ font-family: var(--num); font-size: 10px; font-weight: 600; color: var(--muted); letter-spacing: .05em; display: block; }
.hmc-app .cta-note{ font-size: 10.5px; color: var(--muted); text-align: center; margin-top: 9px; line-height: 1.8; }
.hmc-app .btn-retry{
    width: 100%; padding: 14px; border-radius: 4px; border: 1px solid var(--pri);
    background: #fff; color: var(--pri); font-family: var(--sans);
    font-size: 14px; font-weight: 700; cursor: pointer; margin-top: 10px; transition: background .15s;
  }
.hmc-app .btn-retry:hover{ background: var(--surface); }
.hmc-app .btn-pdf{
    width: 100%; padding: 14px; border-radius: 4px; border: 1px solid var(--line);
    background: #fff; color: var(--pri); font-family: var(--sans);
    font-size: 13.5px; font-weight: 700; cursor: pointer; margin-top: 22px; transition: background .15s;
  }
.hmc-app .btn-pdf:hover{ background: var(--surface); }
.hmc-app .pdf-hint{ font-size: 10.5px; color: var(--muted); text-align: center; margin-top: 7px; line-height: 1.75; }
.hmc-app .fee{
    display: inline-block; font-size: 10px; font-weight: 700; line-height: 1.5;
    border-radius: 3px; padding: 1px 7px; margin-left: 6px; vertical-align: 1px; white-space: nowrap;
  }
.hmc-app .fee.free{ background: #fff; color: var(--sub); border: 1px solid var(--sub); }
.hmc-app .fee.paid{ background: var(--pri); color: var(--on-pri); border: 1px solid var(--pri); }
.hmc-app .fee.ind{ background: #fff; color: var(--muted); border: 1px solid var(--line); }
.hmc-app .fig-caveat{ font-size: 10.5px; color: var(--muted); line-height: 1.75; margin-top: 10px; text-align: center; }
.hmc-app .road-step.main{ border: 2px solid var(--pri); }
.hmc-app .rs-body{ flex: 1; min-width: 0; }
.hmc-app .btn-sub{
    width: 100%; padding: 13px; border-radius: 4px; border: 1px solid var(--pri);
    background: #fff; color: var(--pri); font-family: var(--sans);
    font-size: 14px; font-weight: 700; cursor: pointer; letter-spacing: .03em; transition: background .15s;
  }
.hmc-app .btn-sub:hover{ background: var(--surface); }
.hmc-app .road-step .btn-cta,.hmc-app .road-step .btn-sub{ margin-top: 11px; padding: 13px; font-size: 14px; }
.hmc-app .site-footer{ border-top: 1px solid var(--line); background: #fff; padding: 30px 16px 34px; }
.hmc-app .site-footer .inner{ max-width: 520px; margin: 0 auto; }
.hmc-app .foot-nav{ list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 9px 20px; }
.hmc-app .foot-nav a{ font-size: 12px; color: var(--muted); text-decoration: none; }
.hmc-app .foot-nav a:hover{ color: var(--pri); }
.hmc-app .site-footer .foot-meta{ font-size: 12px; color: var(--muted); margin-top: 8px; }
.hmc-app .site-footer .disclaimer{ margin-top: 16px; font-size: 10.5px; color: var(--muted); line-height: 1.85; }
.hmc-app .site-footer .copy{ margin-top: 14px; font-size: 11.5px; color: var(--muted); }
.hmc-app .fade-in{ animation: hmcFadeIn .3s ease; }
@keyframes hmcFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.hmc-app .print-only{ display: none; }
@media print {@page { size: A4; margin: 14mm 14mm 16mm; }
.hmc-app *{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.hmc-app{ background: #fff; font-size: 12px; }
.hmc-app .site-header,.hmc-app .site-nav,.hmc-app .site-footer .foot-nav,.hmc-app .site-footer .copy,.hmc-app button,.hmc-app .cta-note,.hmc-app .pdf-hint,.hmc-app .partner-link{ display: none !important; }
.hmc-app .stage{ padding: 0; display: block; }
.hmc-app .card{ border: none; padding: 0; max-width: none; }
.hmc-app .fade-in{ animation: none; }
.hmc-app .site-footer{ border: none; padding: 10px 0 0; }
.hmc-app .site-footer .inner{ max-width: none; }
.hmc-app .print-only{ display: block; }
.hmc-app .print-head{
      display: flex; justify-content: space-between; align-items: flex-end;
      border-bottom: 2px solid var(--pri); padding-bottom: 8px; margin-bottom: 14px;
    }
.hmc-app .ph-brand{ font-size: 14px; font-weight: 700; color: var(--pri); line-height: 1.4; }
.hmc-app .ph-brand span{ display: block; font-size: 9.5px; font-weight: 500; color: var(--muted); }
.hmc-app .ph-meta{ font-size: 10px; color: var(--muted); text-align: right; line-height: 1.6; }
.hmc-app .print-foot{
      margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--line);
      font-size: 10.5px; color: var(--ink); line-height: 1.8;
    }
.hmc-app .res-axis-row,.hmc-app .match-box,.hmc-app .partner-box,.hmc-app .why-list li,.hmc-app .cmp,.hmc-app .sample,.hmc-app .road-step,.hmc-app .type-recap{ break-inside: avoid; }
.hmc-app .sec-title{ break-after: avoid; }}
.hmc-app{min-height:0;border-radius:8px;margin:24px 0;isolation:isolate;overflow-wrap:anywhere;}
.hmc-app h2,.hmc-app h3{background:none;border:none;border-radius:0;box-shadow:none;padding:0;}
.hmc-app h2:before,.hmc-app h2:after,.hmc-app h3:before,.hmc-app h3:after{content:none!important;}
.hmc-check-page .hp-toc{display:none!important}.hmc-check-page .hp-reading-layout{display:block!important}.hmc-check-page .hp-prose{max-width:960px;margin-inline:auto}.hmc-app .card h2{color:var(--ink)!important}.hmc-app p{margin:0}.hmc-app button{appearance:none;text-decoration:none;}
.hmc-app .stage{display:block}.hmc-app .card{margin-inline:auto;}
.hmc-app .choice-btn:disabled{cursor:default;opacity:.8;}
.hmc-app .choice-btn.selected:disabled{opacity:1;}
.hmc-app .hmc-test-note{padding:12px 18px;background:#fbf7ec;color:#69521f;font-size:13px;line-height:1.7;}
.hmc-app .hmc-fallback{padding:16px;border:1px solid var(--line);margin:16px 0;background:white;}
.hmc-app .hmc-fallback textarea{width:100%;min-height:180px;white-space:pre-wrap;font:inherit;}
.hmc-app .hmc-native-form{display:none!important;}
.hmc-app a{overflow-wrap:anywhere;}.hmc-app .cmp thead th{color:#fff!important;background:var(--pri)!important}.hmc-app [id^="screen-"]{scroll-margin-top:120px}
@media(max-width:420px){.hmc-app .stage{padding:16px 8px}.hmc-app .card{padding:24px 16px}.hmc-app .q-text{font-size:16px}}
@media print{
 body.hmc-printing>*{display:none!important}
 body.hmc-printing>#hmc-print-clone{display:block!important}
 #hmc-print-clone{margin:0!important}
 #hmc-print-clone .hmc-test-note,#hmc-print-clone .hmc-fallback{display:none!important}
 #hmc-print-clone .stage{padding:0}#hmc-print-clone .card{display:none!important}
 #hmc-print-clone #screen-result{display:block!important}
}
@media(prefers-reduced-motion:reduce){.hmc-app *{animation:none!important;scroll-behavior:auto!important;transition:none!important}}