:root{--saku-night: #0B1220;--shinya: #131C30;--tsukikage: #3A4160;--moon-silver: #C9D2E3;--gekko: #F5F7FB;--getsurin: #C7A96B;--hagane: #46608C;--yakikomi: #D96A20;--yoizumi: #1B2233;--hakubo: #5A6478;--tangetsu: #DDE3EE;--geppaku: #E8ECF5;--usuzuki: #9AA5BD;--yoiyami: #26314B;--bg: var(--gekko);--surface: #FFFFFF;--text: var(--yoizumi);--text-muted: var(--hakubo);--line: var(--tangetsu);--link: var(--hagane);--accent: var(--getsurin);--font-display: "Zen Old Mincho", "Noto Serif JP", "Yu Mincho", serif;--font-body: "Zen Kaku Gothic New", "Noto Sans JP", "Yu Gothic", sans-serif;--font-data: "IBM Plex Mono", "Consolas", monospace;--font-logotype: "Zen Kurenaido", "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;--tracking-brand: .22em;--tracking-wide: .1em;--tracking-display: .06em;--leading-body: 1.9;--leading-tight: 1.35;--fs-xs: .75rem;--fs-sm: .875rem;--fs-md: 1rem;--fs-lg: 1.25rem;--fs-xl: 1.563rem;--fs-2xl: 1.953rem;--fs-3xl: 2.441rem;--fs-4xl: 3.052rem;--fs-display: clamp(2rem, 5vw, 3.4rem);--sp-1: 4px;--sp-2: 8px;--sp-3: 16px;--sp-4: 24px;--sp-5: 32px;--sp-6: 48px;--sp-7: 64px;--sp-8: 96px;--container: 1040px;--radius: 2px;--radius-lg: 6px;--radius-pill: 999px;--hairline: 1px solid var(--line);--shadow-moon: 0 8px 32px rgba(11, 18, 32, .1);--shadow-night: 0 8px 32px rgba(0, 0, 0, .45);--ease: cubic-bezier(.22, .6, .2, 1);--dur-fast: .16s;--dur: .32s;--dur-slow: .56s;--focus-ring-color: var(--hagane);--focus-ring: 2px solid var(--focus-ring-color)}[data-theme=night],.theme-night{--bg: var(--saku-night);--surface: var(--shinya);--text: var(--geppaku);--text-muted: var(--usuzuki);--line: var(--yoiyami);--link: var(--moon-silver);--focus-ring-color: var(--getsurin)}[data-product=corporate]{--accent: var(--getsurin)}[data-product=photograph]{--accent: var(--moon-silver)}[data-product=finscope]{--accent: var(--hagane)}[data-product=hizuke]{--accent: var(--yakikomi)}a{color:var(--link);text-underline-offset:4px}a:focus-visible,button:focus-visible,input:focus-visible{outline:var(--focus-ring);outline-offset:3px}.brand-label{font-family:var(--font-body);font-size:var(--fs-sm);letter-spacing:var(--tracking-brand);text-transform:uppercase;color:var(--text-muted)}.display{font-family:var(--font-display);letter-spacing:var(--tracking-display);font-weight:500}.rule-moon{border:0;border-top:1px solid var(--moon-silver);width:56px;margin:var(--sp-3) 0}.mode-serif{font-family:var(--font-display);letter-spacing:.08em}.btn{display:inline-block;padding:10px 28px;border:1px solid currentColor;border-radius:var(--radius);font-size:var(--fs-sm);letter-spacing:var(--tracking-wide);color:var(--text);text-decoration:none;background:transparent;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}.btn:hover{background:var(--text);color:var(--bg)}.btn-accent{border-color:var(--accent);color:var(--accent)}.btn-accent:hover{background:var(--accent);color:var(--saku-night)}.btn-round{border-radius:var(--radius-pill);background:var(--saku-night);color:#fff;border-color:var(--saku-night);padding:12px 40px;font-weight:500}.btn-round:hover{background:var(--tsukikage);border-color:var(--tsukikage);color:#fff}[data-theme=night] .btn-round,.theme-night .btn-round{background:var(--gekko);border-color:var(--gekko);color:var(--saku-night)}[data-theme=night] .btn-round:hover,.theme-night .btn-round:hover{background:var(--moon-silver);border-color:var(--moon-silver);color:var(--saku-night)}a.go{font-size:var(--fs-sm);letter-spacing:var(--tracking-wide);text-decoration:none}a.go:after{content:" →";color:var(--accent)}.tag{display:inline-block;padding:2px 12px;border:1px solid var(--line);border-radius:var(--radius-pill);font-size:var(--fs-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-3)}.card{background:var(--surface);border:var(--hairline);border-radius:var(--radius-lg);padding:var(--sp-5);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-moon)}.card h3{font-size:var(--fs-lg);margin:var(--sp-2) 0}.card p{color:var(--text-muted);font-size:var(--fs-sm);margin-bottom:var(--sp-3)}.lang-toggle{display:inline-flex;border:1px solid var(--line);border-radius:var(--radius-pill);padding:2px;gap:2px}.lang-toggle button{appearance:none;border:0;background:transparent;color:var(--text-muted);font:inherit;font-size:var(--fs-xs);letter-spacing:var(--tracking-wide);padding:5px 14px;border-radius:var(--radius-pill);cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}.lang-toggle button.is-active{background:var(--text);color:var(--bg)}.updates{list-style:none}.updates li{display:grid;grid-template-columns:120px 1fr;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:var(--hairline)}.updates time{font-family:var(--font-data);font-size:var(--fs-sm);color:var(--text-muted)}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:var(--fs-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted)}.field input[type=text],.field input[type=email]{border:var(--hairline);border-radius:var(--radius);padding:10px 14px;font:inherit;background:var(--surface);color:var(--text);min-width:220px}.field input:focus-visible{outline:var(--focus-ring);outline-offset:2px;border-color:var(--hagane)}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}@font-face{font-family:Zen Old Mincho;src:url(/fonts/ZenOldMincho-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Zen Kaku Gothic New;src:url(/fonts/ZenKakuGothicNew-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Zen Kaku Gothic New;src:url(/fonts/ZenKakuGothicNew-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Zen Kurenaido;src:url(/fonts/ZenKurenaido-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:BIZ UDPMincho;src:url(/fonts/BIZUDPMincho-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:BIZ UDPGothic;src:url(/fonts/BIZUDPGothic-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--fs-md);line-height:var(--leading-body)}#app{display:flex;flex-direction:column;min-height:100vh}.app-header{border-bottom:var(--hairline);background:var(--surface);padding:var(--sp-3) var(--sp-4)}.brand-lockup{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2);padding:7px}.brand-mark{height:28px;width:auto;display:block}.brand-wordmark{font-family:var(--font-logotype);letter-spacing:var(--tracking-brand);font-size:var(--fs-md);text-transform:uppercase;color:var(--text)}.brand-product{font-family:var(--font-display);font-size:var(--fs-sm);letter-spacing:var(--tracking-display);color:var(--text-muted);border-left:1px solid var(--line);padding-left:var(--sp-2)}.pane-tabs{display:none;gap:2px;padding:var(--sp-2) var(--sp-3) 0;background:var(--bg)}.pane-tab{flex:1;appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--text-muted);font:inherit;font-size:var(--fs-sm);letter-spacing:var(--tracking-wide);padding:10px;border-radius:var(--radius);cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}.pane-tab.is-active{background:var(--text);color:var(--bg);border-color:var(--text)}.app-main{flex:1;display:flex;flex-direction:column;gap:var(--sp-4);max-width:1400px;width:100%;margin:0 auto;padding:var(--sp-4)}.input-pane,.preview-pane{min-width:0}.field-group{margin-bottom:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3)}#letter-form{padding-bottom:230px}.section-title{font-family:var(--font-display);font-size:var(--fs-lg);margin:0}.hint{font-size:var(--fs-xs);color:var(--text-muted);margin:0}.hint code{font-family:var(--font-data);background:var(--bg);padding:1px 4px;border-radius:var(--radius)}.field textarea,.field select,.field input[type=date]{border:var(--hairline);border-radius:var(--radius);padding:10px 14px;font:inherit;background:var(--surface);color:var(--text);width:100%}.field textarea{resize:vertical;min-height:3em}#body-text{min-height:16em;font-size:var(--fs-md)}textarea:focus-visible,select:focus-visible,input[type=date]:focus-visible,input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:var(--focus-ring);outline-offset:3px}.template-inserter{display:flex;align-items:flex-end;gap:var(--sp-2);flex-wrap:wrap}.template-inserter .field{flex:1;min-width:220px}.segment-group{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.segment-group legend{font-size:var(--fs-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted);padding:0}.segment{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.segment label{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:var(--radius-pill);padding:6px 14px;font-size:var(--fs-sm);cursor:pointer;background:var(--surface)}.segment input[type=radio]{accent-color:var(--hagane)}.toggle-field{display:flex;flex-direction:column;gap:6px}.toggle-field label{display:flex;align-items:center;gap:6px;font-size:var(--fs-sm)}.toggle-field input[type=checkbox]{accent-color:var(--hagane)}.toggle-field input[type=text]{border:var(--hairline);border-radius:var(--radius);padding:10px 14px;font:inherit;background:var(--surface);color:var(--text)}.toggle-field input[type=text]:disabled{color:var(--text-muted);background:var(--bg)}.action-area{position:sticky;bottom:0;background:var(--surface);border:var(--hairline);box-shadow:var(--shadow-moon);gap:var(--sp-2)}.action-buttons{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.action-area .btn{margin:0}.action-area #progress-text:empty,.action-area #download-area:empty{display:none}.download-area{display:flex;flex-direction:column;gap:var(--sp-2);align-items:flex-start}.download-area .btn{margin:0}.pdf-preview-frame{width:100%;height:70vh;border:var(--hairline);border-radius:var(--radius);background:var(--surface)}.preview-toolbar{max-width:620px;margin-bottom:var(--sp-3)}.glyph-warning{border:1px solid var(--hagane);border-left-width:4px;border-radius:var(--radius);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);color:var(--text);background:var(--surface);margin-bottom:var(--sp-3)}.preview-pages{display:flex;flex-direction:column;gap:var(--sp-4)}.letter-page{display:flex;flex-direction:column;gap:var(--sp-1);max-width:620px}.letter-page-frame{background:#fff;box-shadow:var(--shadow-moon);border-radius:var(--radius);overflow:hidden;width:100%}.letter-page-svg{display:block;width:100%;height:100%}.letter-page-label{align-self:flex-end;font-family:var(--font-data);font-size:var(--fs-xs);color:var(--text-muted)}.app-footer{background:var(--bg);color:var(--text);padding:var(--sp-3) var(--sp-4);text-align:center;font-size:var(--fs-xs);letter-spacing:var(--tracking-wide)}.app-footer p{margin:0}@media (max-width: 720px){.pane-tabs{display:flex}.app-main{padding:var(--sp-3)}[data-active-pane=input] #preview-pane,[data-active-pane=preview] #input-pane{display:none}}@media (min-width: 721px){.app-main{flex-direction:row;align-items:flex-start}.input-pane{flex:0 0 40%;max-width:40%}.preview-pane{flex:1 1 60%;position:sticky;top:var(--sp-4)}}@media (max-width: 480px){.app-main{padding:var(--sp-2)}.field-group{padding:var(--sp-3)}.segment label{padding:6px 10px}.app-header{padding:var(--sp-2) var(--sp-3)}.brand-lockup{gap:6px;padding:6px}.brand-wordmark{font-size:var(--fs-sm);letter-spacing:.12em}.brand-product{font-size:var(--fs-xs);padding-left:var(--sp-1)}}