:root{color:#132b43;--font-size:28px;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Yu Gothic,sans-serif;font-size:16px}*{box-sizing:border-box}body{background:#fff;margin:0}button,input,textarea,select{font:inherit;color:inherit}button{min-height:64px;font-size:calc(var(--font-size)*.7);cursor:pointer;touch-action:manipulation;background:#fff;border:2px solid #8fa4b6;border-radius:14px;padding:14px 20px;font-weight:700}button:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:3px;outline:4px solid #f0a63a}button:disabled{opacity:.45;cursor:not-allowed}.app{flex-direction:column;gap:24px;max-width:1400px;min-height:100vh;margin:auto;padding:clamp(16px,3vw,40px);display:flex}header{justify-content:space-between;align-items:center;gap:16px;display:flex}h1{letter-spacing:.08em;margin:0;font-size:clamp(36px,5vw,64px)}.status{font-size:calc(var(--font-size)*.55);color:#496477;text-align:right;font-weight:700}.status:empty{display:none}main{flex:1}.current{min-height:96px;font-size:var(--font-size);background:#dbeeff;border-radius:20px;align-items:center;margin-bottom:20px;padding:20px 28px;font-weight:800;display:flex}.tabs{grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;display:grid}.tabs button,.phrase{font-size:calc(var(--font-size)*.8)}.selected{background:#a9d6fb;border-color:#5ca9e8}.phrase-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.phrase{min-height:clamp(88px,12vh,140px);font-size:calc(var(--font-size)*.85);border-color:#8fa4b6}.global-stop{z-index:2;position:fixed;top:16px;right:24px}.stop{color:#fff;background:#ef5350;border-color:#d83c39}.global-stop .stop{font-size:calc(var(--font-size)*.55);min-height:64px}nav{padding-bottom:env(safe-area-inset-bottom);grid-template-columns:repeat(4,1fr);gap:12px;display:grid}nav button{font-size:calc(var(--font-size)*.6)}h2{font-size:calc(var(--font-size)*.95);margin:0 0 20px}h3{font-size:calc(var(--font-size)*.7);margin:32px 0 12px}.input-screen label{font-weight:800;font-size:calc(var(--font-size)*.7);margin-bottom:12px;display:block}.input-screen textarea{width:100%;min-height:40vh;font-size:var(--font-size);resize:vertical;border:3px solid #8fa4b6;border-radius:16px;padding:20px;line-height:1.6}.actions{flex-wrap:wrap;gap:12px;margin-top:16px;display:flex}.actions button{flex:1;min-width:160px}.primary{background:#a9d6fb;border-color:#5ca9e8}.hint,.empty{font-size:calc(var(--font-size)*.55);color:#496477}.section-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-head button{font-size:calc(var(--font-size)*.48);min-height:56px}.history-list{flex-direction:column;gap:12px;display:flex}.history-row{border-bottom:1px solid #d3dde5;align-items:stretch;gap:10px;padding-bottom:12px;display:flex}.history-text{text-align:left;min-height:80px;font-size:calc(var(--font-size)*.7);border:0;flex:1;padding:14px 4px}.history-text small{color:#496477;margin-top:6px;font-size:.55em;font-weight:400;display:block}.history-row>button:last-child{font-size:calc(var(--font-size)*.43);min-height:56px}.setting-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.setting-grid label{font-size:calc(var(--font-size)*.55);border:1px solid #d3dde5;border-radius:12px;align-items:center;gap:12px;padding:16px;font-weight:700;display:flex}.setting-grid input[type=range]{accent-color:#328bc8;flex:1;min-width:100px}.setting-grid select{border:2px solid #8fa4b6;border-radius:8px;max-width:100%;min-height:52px;padding:8px}.setting-grid .check{grid-column:1/-1}.setting-grid input[type=checkbox]{width:28px;height:28px}.edit-category{border:1px solid #d3dde5;border-radius:12px;margin-bottom:12px;padding:14px}.edit-category>strong{font-size:calc(var(--font-size)*.62)}.edit-category>div{border-top:1px solid #edf1f4;align-items:center;gap:8px;padding:10px 0;display:flex}.edit-category>div span{font-size:calc(var(--font-size)*.55);flex:1}.edit-category button,.backup button,.file-button{min-height:52px;font-size:calc(var(--font-size)*.45);padding:10px 14px}.backup{flex-wrap:wrap;gap:12px;display:flex}.file-button{cursor:pointer;border:2px solid #8fa4b6;border-radius:14px;align-items:center;font-weight:700;display:inline-flex}.file-button input{display:none}@media (width<=700px){.app{gap:16px;padding:88px 16px 16px}header{display:block}h1{text-align:center}.status{text-align:center;margin-top:8px}.current{min-height:84px;font-size:calc(var(--font-size)*.8);padding:16px}.tabs{gap:8px}.tabs button{font-size:calc(var(--font-size)*.6);min-height:58px;padding:10px 6px}.phrase-grid{gap:10px}.phrase{min-height:92px;font-size:calc(var(--font-size)*.7);padding:10px}.global-stop{top:12px;right:12px}.global-stop .stop{font-size:calc(var(--font-size)*.45);padding:10px}.setting-grid{grid-template-columns:1fr}.setting-grid .check{grid-column:auto}nav{gap:8px}nav button{font-size:calc(var(--font-size)*.48);min-height:58px;padding:10px 4px}.history-row{display:block}.history-row>button:last-child{width:100%}}.global-stop{align-self:flex-end;margin-bottom:-8px;position:sticky;top:8px;bottom:auto;right:auto}@media (width<=700px){.global-stop{align-self:stretch;margin:0}.global-stop .stop{width:100%}}.kana-side button{font-size:calc(var(--font-size)*.48);font-weight:800}@media (width<=700px){.kana-keyboard{padding:10px}.kana-layout{grid-template-columns:1fr}.kana-row{grid-template-columns:repeat(5,1fr);gap:6px}.kana-key{min-height:58px}.kana-side{grid-template-columns:1fr 1fr;gap:6px;display:grid}.kana-side button{min-height:58px}}.input-mode{padding-top:16px}.compact-input textarea{resize:none;height:48px;min-height:48px;padding:8px 12px;line-height:1.3}.kana-keyboard{background:#fff;border:2px solid #d3dde5;border-radius:16px;margin-top:12px;padding:10px}.keyboard-heading{font-size:calc(var(--font-size)*.6);margin-bottom:6px;font-weight:800}.kana-layout{grid-template-columns:minmax(0,1fr) 150px;gap:8px;display:grid}.kana-row{grid-template-columns:repeat(10,minmax(40px,1fr));gap:5px;margin-bottom:5px;display:grid}.kana-key,.kana-side button{min-height:54px;font-size:calc(var(--font-size)*.65);background:#fff;border:2px solid #8fa4b6;border-radius:8px;padding:4px}.kana-side{flex-direction:column;gap:6px;display:flex}.kana-side button{min-height:48px;font-size:calc(var(--font-size)*.45);font-weight:800}.kana-side .speak-large{min-height:64px;font-size:calc(var(--font-size)*.62);background:#a9d6fb;border-color:#5ca9e8}.kana-side .stop-control{color:#fff;background:#ef5350;border-color:#d83c39}.hint{margin:8px 0 0}@media (width<=900px){.kana-layout{grid-template-columns:1fr}.kana-row{grid-template-columns:repeat(5,1fr);gap:6px}.kana-key{min-height:58px}.kana-side{grid-template-columns:1fr 1fr;gap:6px;display:grid}.kana-side button{min-height:52px}.kana-side .speak-large,.kana-side .stop-control{min-height:64px}}html,body,#root{height:100%;min-height:100%;overflow:hidden}.app{height:100dvh;min-height:0;overflow:hidden}main{overscroll-behavior:contain;min-height:0;padding-bottom:8px;overflow-y:auto}nav{flex:none}.kana-side .speak-large{min-height:96px;font-size:calc(var(--font-size)*.72);flex:1}@media (width<=900px){.kana-side .speak-large{grid-column:1/-1;min-height:88px}}
