:root{--bg:#fafcfb;--surface:#fff;--text:#253330;--text-sub:#61706c;--accent:#a95645;--accent-strong:#954c3d;--border:#ccd8d5;--badge-bg:#e8f0ee;--badge-border:#ccd8d5;--warn-bg:#f7f1e4;--warn-border:#d9c9a4;--warn-text:#8b7046;--error:#a64b4b;--error-bg:#f8ecec;--code-bg:#edf3f1;--focus:#a95645;--radius:12px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);margin:0;font-family:Noto Sans JP,Hiragino Sans,Yu Gothic,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.7}code,pre,textarea.mono,output.mono,.mono{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}a{color:var(--accent-strong)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.container{max-width:860px;margin:0 auto;padding:0 16px}.site-header{border-bottom:1px solid var(--border);background:var(--surface)}.site-header-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding-top:10px;padding-bottom:10px;display:flex}.brand{color:var(--text);align-items:center;gap:8px;font-weight:700;text-decoration:none;display:flex}.brand-text small{color:var(--text-sub);margin-left:4px;font-weight:400}.site-nav{flex-wrap:wrap;gap:16px;display:flex}.site-nav a{color:var(--text-sub);text-decoration:none}.site-nav a:hover{color:var(--accent-strong);text-decoration:underline}.site-footer{border-top:1px solid var(--border);color:var(--text-sub);margin-top:48px;padding:24px 0 40px;font-size:.85rem}.footer-nav{flex-wrap:wrap;gap:16px;margin-top:8px;display:flex}.footer-nav a{color:var(--text-sub)}main.container{padding-top:24px;padding-bottom:24px}h1{margin:.5em 0;font-size:1.5rem;line-height:1.4}h2{border-left:4px solid var(--accent);margin-top:2em;padding-left:10px;font-size:1.15rem}.lead{color:var(--text-sub);margin-top:0}.security-line{color:var(--text-sub);margin:12px 0;font-size:.85rem}.security-line a{color:var(--text-sub)}.tool-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:16px 0;padding:16px}.field{margin:12px 0}.field label{margin-bottom:4px;font-weight:600;display:block}.field .hint{color:var(--text-sub);font-size:.85rem;font-weight:400;display:block}input[type=text],input[type=number],input[type=password],textarea,select{width:100%;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:1rem}textarea{resize:vertical;min-height:10em}input[type=checkbox]{width:1.15em;height:1.15em}.checks{flex-wrap:wrap;gap:8px 20px;display:flex}.checks label{align-items:center;gap:6px;font-weight:400;display:flex}.row{flex-wrap:wrap;align-items:end;gap:12px;display:flex}.row .field{flex:140px;margin:8px 0}button{border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;border-radius:6px;padding:10px 18px;font-size:1rem}button:hover{background:var(--accent-strong);border-color:var(--accent-strong)}button.secondary{color:var(--accent-strong);background:0 0}button.secondary:hover{background:var(--badge-bg)}.btn-row{flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0;display:flex}.copy-feedback{color:var(--accent-strong);min-height:1.2em;font-size:.85rem}.result-block{margin-top:16px}.result-block h2,.result-block h3{margin-top:0}pre.result,output.result{background:var(--code-bg);border:1px solid var(--border);white-space:pre-wrap;overflow-wrap:anywhere;border-radius:8px;margin:8px 0;padding:12px;font-size:.95rem;display:block;overflow-x:auto}.big-code{letter-spacing:.12em;text-align:center;margin:8px 0;font-size:clamp(2rem,9vw,3rem);font-weight:700}.totp-remaining{text-align:center;color:var(--text-sub)}progress{width:100%;height:8px;accent-color:var(--accent)}.notice,.notice-warn,.notice-error{border-radius:8px;margin:12px 0;padding:10px 14px;font-size:.92rem}.notice{background:var(--badge-bg);border:1px solid var(--badge-border)}.notice-warn{background:var(--warn-bg);border:1px solid var(--warn-border);color:var(--warn-text)}.notice-error{background:var(--error-bg);border:1px solid var(--error);color:var(--error)}.notice-error:empty,.copy-feedback:empty{display:none}.tools-heading{color:var(--text-sub);border-left:none;margin:28px 0 4px;padding-left:0;font-size:1rem;font-weight:600}.tool-rows{margin:0;padding:0;list-style:none}.tool-row{border-bottom:1px solid var(--border);padding:14px 0}.tool-row:last-child{border-bottom:none}.tool-row a{color:var(--accent-strong);font-size:1.05rem;font-weight:700;text-decoration:none}.tool-row a:hover{text-decoration:underline}.tool-row p{color:var(--text-sub);margin:4px 0 0;font-size:.92rem}dl.meta div{flex-wrap:wrap;gap:8px;display:flex}dl.meta dt{min-width:5em;font-weight:600}dl.meta dd{margin:0}table.plain{border-collapse:collapse;width:100%;font-size:.92rem}table.plain th,table.plain td{text-align:left;border-bottom:1px solid var(--border);vertical-align:top;padding:6px 10px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=480px){.security-badge-details dt{width:100%;min-width:0}.btn-row button{flex:auto}}.h1-sub{font-weight:400}.panel-title{margin-top:0}.qr-canvas{border:1px solid var(--border);background:#fff;border-radius:8px;max-width:100%;height:auto;display:block}.skip-link{background:var(--surface);color:var(--text);z-index:10;padding:8px 16px;position:absolute;top:0;left:-9999px}.skip-link:focus{left:0}.checks-fieldset{border:none;margin:12px 0;padding:0}.checks-fieldset legend{color:var(--text-sub);margin-bottom:4px;padding:0;font-size:.85rem;font-weight:600}.image-preview,.result-canvas{border:1px solid var(--border);border-radius:8px;max-width:100%;height:auto;max-height:420px;margin:8px 0;display:block}.result-canvas.pickable{cursor:crosshair}.result-canvas.checker{background-image:conic-gradient(#cfcfcf 25%, #fff 0 50%, #cfcfcf 0 75%, #fff 0);background-size:16px 16px}.result-canvas.bg-white{background:#fff}.result-canvas.bg-black{background:#000}.swatch{border:1px solid var(--border);vertical-align:middle;border-radius:4px;width:1.2em;height:1.2em;display:inline-block}.color-indicator{align-items:center;gap:6px;display:inline-flex}button.small{padding:4px 12px;font-size:.85rem}input[type=range]{width:100%;accent-color:var(--accent)}.checks label .hint{margin-left:2px;display:inline}.lang-switch{color:var(--text-sub);align-items:center;gap:6px;font-size:.85rem;display:flex}.lang-switch a{color:var(--text-sub);text-decoration:none}.lang-switch a:hover{text-decoration:underline}.lang-switch a[aria-current=page]{color:var(--text);font-weight:700}