/* MottoApp / Option 10. Shared presentation layer. Load AFTER existing CSS.
   Apply class mapp-theme-mist to body. No authentication/business behavior. */
body.mapp-theme-mist{
 --mapp-primary:#175db6;--mapp-primary-hover:#124b94;--mapp-navy:#0c2c5d;
 --mapp-mist:#edf4fa;--mapp-surface:#fff;--mapp-border:#d5e1ee;
 --mapp-text:#102b50;--mapp-muted:#526780;--mapp-cyan:#08c8e8;
 --navy:var(--mapp-navy);--navy2:#163c6c;--blue:var(--mapp-primary);
 --lime:var(--mapp-primary);--lime2:var(--mapp-primary-hover);
 --ink:var(--mapp-text);--muted:var(--mapp-muted);--line:var(--mapp-border);
 --soft:var(--mapp-mist);--white:#fff;--r:16px;--rs:10px;
 --shadow:0 8px 28px rgb(12 44 93 / 5%);
 background:#fff;color:var(--ink);font-family:Arial,'Noto Sans JP','Yu Gothic',system-ui,sans-serif;
 font-size:16px;line-height:1.75;
}
.mapp-theme-mist *{box-sizing:border-box}
.mapp-theme-mist :focus-visible{outline:3px solid var(--mapp-primary);outline-offset:4px}
.mapp-theme-mist .site-header{background:#fff;border-bottom:1px solid var(--line);min-height:88px;gap:24px}
.mapp-theme-mist .brand{color:var(--navy);letter-spacing:-.035em}
.mapp-theme-mist .mapp-brand-logo{display:block;width:180px;height:auto;max-width:100%}
.mapp-theme-mist .site-header .desktop-nav a:hover{color:var(--blue)}
.mapp-theme-mist .mapp-ui-card,.mapp-theme-mist :is(.card,.mapp-contact-card,.mapp-content-item){background:var(--mapp-surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.mapp-theme-mist :is(.eyebrow,.mapp-hero-eyebrow){color:var(--blue);font-size:12px;letter-spacing:.12em}
.mapp-theme-mist .hero{background:var(--mapp-mist);color:var(--navy)}
.mapp-theme-mist .hero:after{display:none}
.mapp-theme-mist .mapp-home-hero{min-height:0}
.mapp-theme-mist .hero-grid{min-height:360px;grid-template-columns:minmax(0,1fr);gap:72px;padding-top:56px;padding-bottom:56px}
.mapp-theme-mist .hero h1{color:var(--navy);font-size:clamp(36px,5vw,64px);line-height:1.15;letter-spacing:-.035em;margin:16px 0 24px}
.mapp-theme-mist .hero p{color:var(--muted);font-size:17px}
.mapp-theme-mist .hero .eyebrow{color:var(--blue)}
.mapp-theme-mist :is(.mapp-form-field,.field){color:var(--ink)}
.mapp-theme-mist :is(.mapp-form-field,.field,.search) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){background:#fff;color:var(--ink);border:1px solid #aabed5;border-radius:8px;min-height:48px;font-size:16px;box-shadow:none}
.mapp-theme-mist input::placeholder,.mapp-theme-mist textarea::placeholder{color:#62768e;opacity:1}
.mapp-theme-mist input[type=checkbox],.mapp-theme-mist input[type=radio]{accent-color:var(--blue)}
.mapp-theme-mist :is(.inline-link){color:var(--blue)}
.mapp-theme-mist .auth-wrap{max-width:560px;width:100%}
.mapp-theme-mist .auth-logo .brand{display:flex;justify-content:center}
.mapp-theme-mist .progress span.on{background:var(--blue)}
.mapp-theme-mist .mapp-signin-icon{width:28px;height:28px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mapp-theme-mist :is(.content-hero,.mapp-page-heading){background:var(--soft);color:var(--navy);border-bottom:1px solid #e3ecf5;padding-top:48px;padding-bottom:44px}
.mapp-theme-mist .content-hero p{color:var(--muted)}
.mapp-theme-mist .content-hero>svg{color:var(--blue);opacity:.7}
.mapp-theme-mist .mapp-public-page{background:#fff;min-height:65vh}
.mapp-theme-mist .mapp-public-page>.wrap{padding-top:40px;padding-bottom:64px}
.mapp-theme-mist .mapp-card-icon{background:var(--soft);color:var(--blue);border-color:var(--line)}
.mapp-theme-mist :is(.mapp-service-empty){background:#fff;border:1px solid var(--line);box-shadow:none}
.mapp-theme-mist .policy-accordion summary{background:#fff;color:var(--navy)}
.mapp-theme-mist .step-note{background:var(--soft);border-color:var(--blue)}
.mapp-theme-mist .contact-grid>aside>.card:first-child{background:var(--soft)}
.mapp-theme-mist .site-footer{background:#fff;color:var(--muted);border-top:1px solid var(--line);padding:48px 0 24px}
.mapp-theme-mist .footer-grid h3,.mapp-theme-mist .site-footer .brand{color:var(--navy)}
.mapp-theme-mist .footer-grid :is(a,button){color:var(--muted);font-size:13px}
.mapp-theme-mist .footer-grid a:hover{color:var(--blue);text-decoration:underline}
.mapp-theme-mist .mapp-copyright{border-top:1px solid var(--line);color:var(--muted);margin-top:32px;padding-top:20px}
.mapp-theme-mist .mapp-back-to-top{background:var(--blue);color:#fff}
@media(max-width:900px){
 .mapp-theme-mist .site-header{padding:12px 20px;gap:12px}
 .mapp-theme-mist .hero-grid{grid-template-columns:1fr;gap:32px;padding-top:44px;padding-bottom:44px;min-height:0}
 .mapp-theme-mist .hero-grid>div:first-child{text-align:left}
 .mapp-theme-mist .hero h1{font-size:48px}
}
@media(max-width:600px){
 .mapp-theme-mist .site-header{min-height:72px;padding:12px 16px;flex-wrap:wrap}
 .mapp-theme-mist .mapp-brand-logo{width:140px}
 .mapp-theme-mist .header-actions{gap:6px;margin-left:auto;flex-shrink:1}
 .mapp-theme-mist .hero h1{font-size:38px;overflow-wrap:anywhere}
 .mapp-theme-mist .hero-grid{padding:32px 20px 40px}
 .mapp-theme-mist .auth-wrap{max-width:100%}
 .mapp-theme-mist .content-hero{padding:32px 0}
 .mapp-theme-mist .footer-grid{grid-template-columns:1fr 1fr;gap:24px}
 .mapp-theme-mist .footer-grid>div:first-child{grid-column:1/-1}
 .mapp-theme-mist .site-footer{padding:36px 0 22px}
}
@media(prefers-reduced-motion:reduce){.mapp-theme-mist *{scroll-behavior:auto!important;transition:none!important}}
.mapp-theme-mist .site-footer p{color:var(--muted)}
.mapp-theme-mist .mapp-public-page>.content-hero{background:var(--mapp-mist)}
.mapp-theme-mist .hero .hero-grid{max-width:1200px;min-height:360px;grid-template-columns:minmax(0,1fr);gap:72px;padding-top:56px;padding-bottom:56px}
@media(max-width:900px){.mapp-theme-mist .hero .hero-grid{grid-template-columns:1fr;gap:32px;min-height:0;padding:44px 24px}}
@media(max-width:600px){.mapp-theme-mist .hero .hero-grid{padding:32px 20px 40px}}
.mapp-theme-mist .field.error input{border-color:var(--red)}
/* 狭い画面では装飾アイコンと多言語の説明文を重ねない。 */
@media(max-width:600px){
	.mapp-theme-mist .mapp-public-page>.content-hero{padding:32px 20px;min-height:0}
	.mapp-theme-mist .mapp-public-page>.content-hero>svg{display:none}
}
