:root{--ink:#1C2526;--paper:#FAF7F0;--brand:#0F7B78;--action:#D9452B;font-family:system-ui,"Noto Sans JP",sans-serif;color:var(--ink);background:var(--paper);font-size:20px;line-height:1.7}
*{box-sizing:border-box}body{margin:0}a{color:var(--brand)}img{max-width:100%;height:auto}button,input,textarea,select{font:inherit}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:64px;padding:.65rem 1rem;border:2px solid var(--brand);border-radius:16px;color:var(--brand);background:#fff;text-decoration:none;cursor:pointer;transition:transform .24s cubic-bezier(.2,1.6,.6,1);text-align:center}button:active,.button:active{transform:scale(.96)}button:disabled{opacity:.6;cursor:wait}.primary{min-height:80px;background:var(--action);border-color:var(--action);color:#fff;font-weight:700}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.25rem;padding:.5rem;max-width:1100px;margin:auto}.topbar>a{justify-self:end}.topbar .button{padding:.4rem;font-size:1rem}.topbar>div:first-child{min-width:0}main{max-width:1000px;margin:0 auto;padding:1rem}h1{font-size:1.65rem;line-height:1.4}h2{font-size:1.3rem}p{overflow-wrap:anywhere}.stack{display:grid;gap:1rem}.card{padding:1rem;background:#fff;border:1px solid #c6d6d2;border-radius:20px}.card-icon{width:64px;height:64px;object-fit:contain}.help-space{height:96px;position:relative;max-width:1000px;margin:auto}.actions{display:flex;flex-wrap:wrap;gap:.6rem}.actions>*{flex:1}input:not([type=checkbox]):not([type=radio]),textarea,select{width:100%;min-height:64px;border:2px solid #677978;border-radius:12px;padding:.6rem;color:var(--ink);background:#fff}textarea{min-height:180px}label{display:block}input[type=checkbox],input[type=radio]{width:28px;height:28px;min-width:28px;flex-shrink:0}fieldset{border:0;padding:0;margin:0}legend{font-weight:700}footer{text-align:center;padding:2rem 1rem} [hidden]{display:none!important}:focus-visible{outline:4px solid #e2a000;outline-offset:3px}.error{color:#9b2513;font-weight:700}.notice{background:#e4f1ee;border-radius:12px;padding:1rem}.photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.7rem}.photos img{border-radius:12px;max-height:400px;object-fit:contain}.raw{white-space:pre-wrap;overflow-wrap:anywhere}.status{font-weight:700;color:var(--brand)}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.category-grid button{flex-direction:column}.category-grid [aria-pressed=true]{background:#d5ebe5;border-width:4px}.avatar{display:inline-flex;border-radius:50%;width:64px;height:64px;align-items:center;justify-content:center;background:#d5ebe5;font-weight:700}
@media(min-width:768px){.help-space{display:none}.home-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:2rem}main{padding:2rem}.category-grid{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){button,.button,.help-bubble{animation:none!important;transition:none;transform:none!important}}
.help-bubble{position:absolute;right:1rem;top:.35rem;min-height:72px;background:#fff;border:3px solid var(--brand);box-shadow:0 4px 0 #b5d2c8;animation:help-pop 220ms ease-out both}.help-bubble img{width:54px;height:54px;object-fit:contain}.help-preview{position:absolute;top:90px;right:1rem;left:1rem;z-index:3;box-shadow:0 8px 25px #1c252633}.help-preview p{margin:0}.category-grid .card-icon{width:100px;height:100px}button,.button{box-shadow:0 3px 0 #c2d1cc}
@keyframes help-pop{0%{opacity:0;transform:translate(20px,-14px) scale(.8) rotate(8deg)}75%{opacity:1;transform:scale(1.04) rotate(-2deg)}100%{opacity:1;transform:none}}
:root{font-family:"BIZ UDPGothic","Noto Sans CJK JP","Noto Sans JP","Yu Gothic",Meiryo,"Hiragino Kaku Gothic ProN",system-ui,sans-serif;font-weight:500}
#draft-status:empty,#compose-error:empty,#reply-error:empty,#profile-error:empty{display:none}
.card>.button{width:100%}
.help-space:has(.help-preview:not([hidden])){height:auto;min-height:96px;padding-top:96px;padding-bottom:1rem}
.help-preview{position:relative;inset:auto;margin:0 1rem;z-index:auto}
.status[data-status=OPEN]{border:2px solid var(--action);border-radius:10px;padding:.2rem .5rem;color:var(--ink)}
.status[data-status=RESOLVED]{color:var(--brand)}.status[data-status=CLOSED_UNRESOLVED]{color:#4b5555}
/* 2026-10-02 見出しは文節の途中で折り返さない／上の帯を1行にまとめる */
h1,h2{word-break:auto-phrase}.ph{display:inline-block;max-width:100%}
.topbar{grid-template-columns:auto 1fr auto;min-height:72px}.topbar>div:first-child{min-width:0}.topbar>#step-label{text-align:center;font-size:1rem}
.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:.4rem}.topbar-actions .button,.topbar-actions .help-bubble{min-height:64px;padding:.4rem .5rem;font-size:1rem;white-space:nowrap}
.topbar>.topbar-actions{justify-self:end}.help-slot{display:contents}
.help-bubble{position:static;min-height:64px;animation:help-pop 220ms ease-out both}.help-bubble img{width:36px;height:36px}
.brand{font-weight:700;color:var(--brand);font-size:1.05rem;line-height:1.3}
.help-space{height:0;min-height:0}
.help-space:has(.help-preview:not([hidden])){height:auto;min-height:0;padding:0 0 1rem}
@media(max-width:400px){.brand{font-size:.95rem}.topbar-actions{gap:.3rem}.topbar-actions .button,.topbar-actions .help-bubble{padding:.4rem .4rem}.topbar{padding:.5rem .4rem;gap:.2rem}}
.brand{white-space:nowrap}
@media(max-width:400px){.brand{font-size:.85rem}.help-bubble img{width:30px;height:30px}.help-bubble{gap:.25rem}}

.heading-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;min-width:0}.heading-row h1{flex:1 1 10rem;min-width:0;margin:.4rem 0}.heading-illust{flex:none;margin-left:auto;width:100px;height:100px;object-fit:contain}
@media(min-width:768px){.heading-row{gap:1rem;flex-wrap:nowrap}.heading-row h1{flex:0 1 auto}.heading-illust{width:220px;height:220px;margin-left:0}}
@media(max-width:400px){.heading-row{gap:.25rem}.heading-illust{width:88px;height:88px}}
.stack>*,.home-grid>*{min-width:0}
@keyframes heading-pop{0%{transform:scale(0);animation-timing-function:ease-out}60%{transform:scale(1.2);animation-timing-function:cubic-bezier(.3,1.5,.6,1)}100%{transform:scale(1)}}
.heading-illust{transform-origin:center;animation:heading-pop .55s .15s backwards}
@media(prefers-reduced-motion:reduce){.heading-illust{animation:none}}

/* 2026-10-02 段1：解決の記録（4段階）。既存の色・部品に合わせる */
.choice-list{display:grid;gap:.8rem}.choice-list button{min-height:88px;font-weight:700}.choice-list [aria-pressed=true]{background:#d5ebe5;border-width:4px}
#resolve-error:empty{display:none}
#method-group button{min-height:72px;font-weight:500}
#resolution h2{margin:0}#resolution ul{margin:.3rem 0;padding-left:1.4rem}
#confirm-summary p,#resolution p{margin:0}

/* 2026-10-02 参考事例（ネットで見つけた修理の話）。利用者の記録と区別するため灰色系。青緑・朱色は使わない */
.ref-frame{margin-top:1.5rem;padding:1rem;background:#EEEDE8;border:2px solid #8B8B84;border-radius:20px;min-width:0;max-width:100%}
.ref-frame h2{margin:0;color:var(--ink)}
.ref-card{min-width:0;max-width:100%;padding:1rem;background:#F8F8F5;border:2px solid #A9A9A2;border-radius:16px}
.ref-card h3{margin:0 0 .4rem;font-size:1.15rem;line-height:1.5;overflow-wrap:anywhere}
.ref-card p{margin:.3rem 0;overflow-wrap:anywhere}
.ref-label{font-weight:700}
.ref-link{display:inline-flex;align-items:center;min-height:64px;padding:.4rem 1rem;max-width:100%;color:var(--ink);background:#fff;border:2px solid #5F5F5A;border-radius:14px;font-weight:700;text-decoration:underline}
.ref-note{font-weight:700}

.hint{font-size:.9rem;margin:0;color:var(--ink)}.machine-info{margin:0;font-weight:700}.machine-info span{display:inline-block;margin-right:1rem}.maker-model{margin-top:1rem}
.install-hint{position:relative;padding:.8rem 80px .8rem 1rem;font-size:1rem;display:block}.install-hint[hidden]{display:none!important}.install-hint p{margin:0}.install-hint [data-install]{width:100%}.install-hint .install-close{position:absolute;top:0;right:0;min-width:64px;padding:0;font-size:1.6rem;border-width:0;box-shadow:none;background:transparent}

/* 型式の見方ガイド */
.guide-link{display:inline-block;padding:.6rem 0;font-size:1rem}.hint .guide-link{font-size:1rem}.guide-places{margin:0}.guide-places dt{font-weight:700;margin-top:.6rem}.guide-places dd{margin:0}.guide ul{margin:0;padding-left:1.4rem}

/* 2026-10-03 「解決しました」の演出：星・一言・音の切替。邪魔をしない（押せない・終わったら取り除く） */
.celebrate-message{font-size:1.6rem;font-weight:700;line-height:1.5;color:var(--brand);text-align:center;animation:celebrate-pop .55s .1s backwards}
#resolve-success{overflow-x:clip}
@keyframes celebrate-pop{0%{transform:scale(0);animation-timing-function:ease-out}60%{transform:scale(1.08);animation-timing-function:cubic-bezier(.3,1.5,.6,1)}100%{transform:scale(1)}}
.sound-toggle{min-height:48px;font-size:1rem;justify-self:center;padding:.3rem 1rem}
.celebrate-stage{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:60}
.celebrate-star{position:absolute;left:50%;top:50%;width:var(--size,28px);height:var(--size,28px);margin:calc(var(--size,28px) / -2) 0 0 calc(var(--size,28px) / -2);background:#F6C945;clip-path:polygon(50% 0,62% 36%,98% 38%,69% 60%,79% 96%,50% 75%,21% 96%,31% 60%,2% 38%,38% 36%);opacity:0;transform:scale(0);animation:star-burst 1s var(--delay,0ms) ease-out forwards}
.celebrate-star[data-tone="1"]{background:#FFE27A}.celebrate-star[data-tone="2"]{background:#2FA39F}.celebrate-star[data-tone="3"]{background:#F08A3C}
@keyframes star-burst{0%{opacity:1;transform:translate(0,0) scale(0) rotate(0)}30%{opacity:1;transform:translate(calc(var(--dx) * .6),calc(var(--dy) * .6)) scale(1.2) rotate(calc(var(--rot) * .5))}60%{opacity:1;transform:translate(var(--dx),var(--dy)) scale(1) rotate(var(--rot))}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + 40px)) scale(.8) rotate(var(--rot))}}
@media(prefers-reduced-motion:reduce){.celebrate-stage{display:none}.celebrate-message{animation:none}}
