:root{--bg: #ffffff;--fg: #000000;--muted: #666;--line: #000;--ink: #000;--grid: #c9c9c9;--good: #0a7d28;--bad: #c01616;--keybg: #f2f2f2}[data-theme=dark]{--bg: #000000;--fg: #ffffff;--muted: #999;--line: #fff;--ink: #ffffff;--grid: #3a3a3a;--good: #46d369;--bad: #ff5b5b;--keybg: #161616}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}.verbadge{position:fixed;top:calc(env(safe-area-inset-top) + 2px);right:6px;z-index:1000;font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--fg);opacity:.45;pointer-events:none}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--fg);font-family:Helvetica Neue,Arial,system-ui,sans-serif;font-weight:700;overscroll-behavior:none;-webkit-user-select:none;user-select:none}#app{display:flex;flex-direction:column;min-height:100dvh}.view{flex:1;display:flex;flex-direction:column;padding:max(12px,env(safe-area-inset-top)) 14px 8px;gap:10px;min-height:0}.topbar{display:flex;align-items:center;gap:8px}.title{font-size:20px;font-style:italic;letter-spacing:-.5px}.spacer{flex:1}.output{border:2px solid var(--line);border-radius:6px;padding:10px 12px;min-height:72px;max-height:120px;overflow-y:auto;font-size:18px;font-weight:600;font-style:italic;white-space:pre-wrap;word-break:break-word}.caret{animation:blink 1s steps(1) infinite;font-weight:400}@keyframes blink{50%{opacity:0}}.status{text-align:center;font-size:15px;color:var(--muted);min-height:20px}.status.good{color:var(--good)}.status.bad{color:var(--bad)}.padwrap{position:relative;flex:1;min-height:220px;border:2px solid var(--line);border-radius:10px;overflow:hidden;touch-action:none}.pad{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none}.kb{gap:12px}.textrow{display:flex;gap:10px;align-items:stretch}.textrow .output{flex:1;min-height:92px}.topright{display:flex;flex-direction:column;gap:6px;width:72px}.backbtn{flex:1;background:transparent;color:var(--fg);border:2px solid var(--line);border-radius:8px;font-size:26px;font-weight:800;font-family:inherit}.backbtn:active{background:var(--fg);color:var(--bg)}.tinybtn{background:transparent;color:var(--fg);border:2px solid var(--line);border-radius:8px;padding:6px 0;font-size:16px;font-family:inherit}.tinybtn:active{background:var(--fg);color:var(--bg)}.mainrow{flex:1;display:flex;gap:12px;min-height:0}.modecol{display:flex;flex-direction:column;gap:12px;width:64px}.modebtn{flex:1;background:transparent;color:var(--fg);border:2px solid var(--line);border-radius:8px;font-size:22px;font-weight:800;font-style:italic;font-family:inherit}.modebtn.on{background:var(--fg);color:var(--bg)}.modebtn:active{opacity:.7}.padcol{flex:1;display:flex;flex-direction:column;gap:6px;min-height:0}.padcol .padwrap{flex:1}.controls{display:flex;gap:8px}.key{flex:1;background:var(--keybg);color:var(--fg);border:2px solid var(--line);border-radius:8px;padding:14px 0;font-size:18px;font-weight:800;font-family:inherit}.key:active,.key.on{background:var(--fg);color:var(--bg)}.key.space{flex:2}.key.caps{font-style:italic}.mini{background:transparent;color:var(--fg);border:1.5px solid var(--line);border-radius:6px;padding:6px 10px;font-size:13px;font-weight:700;font-family:inherit}.mini:active{background:var(--fg);color:var(--bg)}.nav{display:flex;border-top:2px solid var(--line)}.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 0 max(10px,env(safe-area-inset-bottom));text-decoration:none;color:var(--muted);border-right:1px solid var(--grid)}.tab:last-child{border-right:none}.tab:active{background:var(--keybg)}.tabicon{font-size:20px;line-height:1}.tablabel{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.tab.active{color:var(--fg)}.tab.active .tabicon{transform:scale(1.05)}.hintcanvas{width:100%;height:150px}.counter{text-align:center;font-size:14px;color:var(--muted)}.hinttext{font-size:13px;font-weight:500;color:var(--muted);line-height:1.5;margin:0}.glyphgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;overflow-y:auto;padding-bottom:8px}.glyphitem{border:1.5px solid var(--line);border-radius:8px;padding:4px;text-align:center}.glyphcell{width:100%;height:70px}.glabel{font-size:14px}.settingslist{display:flex;flex-direction:column;gap:4px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 4px;border-bottom:1px solid var(--grid);font-weight:600;font-size:15px}.row input[type=checkbox]{width:26px;height:26px;accent-color:var(--fg)}.switch{flex:0 0 auto;min-width:64px;padding:10px 16px;border:2px solid var(--line);border-radius:20px;background:transparent;color:var(--muted);font-weight:800;font-size:14px;font-family:inherit;letter-spacing:1px}.switch.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}.switch:active{opacity:.7}.row input[type=range]{flex:1;min-width:0;accent-color:var(--fg)}.row .key{flex:0 0 auto;padding:10px 16px}.row>span{flex:1;min-width:0}.logsection{margin-top:14px;border-top:2px solid var(--line);padding-top:12px}.logheader{font-size:14px;font-weight:800;margin-bottom:8px}.loglist{display:flex;flex-direction:column;gap:6px;margin-top:10px}.logitem{display:flex;align-items:center;gap:10px;border:1px solid var(--grid);border-radius:8px;padding:6px}.logcanvas{width:56px;height:56px;flex:0 0 auto;border:1px solid var(--grid);border-radius:6px;color:var(--fg)}.logmeta{min-width:0}.logresult{font-size:15px;font-weight:800}.logtop{font-size:11px;font-weight:600;color:var(--muted)}