/* 共通テーマ: M3風トークン + 基本部品（全ツール共有） */
:root{--p:#1E3A8A;--onp:#fff;--pc:#DBE1FF;--onpc:#0B1F5C;--bg:#F4F3FA;--sf:#FAF8FF;--sc:#EFEDF4;--sch:#E4E2EA;--on:#1B1B21;--onv:#45464F;--ol:#757780;--olv:#C5C6D0;--er:#BA1A1A;--erc:#FFDAD6;--oner:#410002;--chg:#FFEFC2;--cm:#6B7280;--st:#0B6B3A;--nm:#9C4A00;--kw:#1E3A8A;--wt:#FFE2A8;--wb:#B26A00;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--p:#B6C4FF;--onp:#0A2472;--pc:#1E3A8A;--onpc:#DBE1FF;--bg:#121318;--sf:#1A1B21;--sc:#1F1F25;--sch:#292A2F;--on:#E4E1E9;--onv:#C5C6D0;--ol:#8F909A;--olv:#45464F;--er:#FFB4AB;--erc:#93000A;--oner:#FFDAD6;--chg:#4A3F00;--cm:#9CA3AF;--st:#7DD9A0;--nm:#FFB77A;--kw:#B6C4FF;--wt:#5C4300;--wb:#FFB86B}}
:root[data-theme="dark"]{--p:#B6C4FF;--onp:#0A2472;--pc:#1E3A8A;--onpc:#DBE1FF;--bg:#121318;--sf:#1A1B21;--sc:#1F1F25;--sch:#292A2F;--on:#E4E1E9;--onv:#C5C6D0;--ol:#8F909A;--olv:#45464F;--er:#FFB4AB;--erc:#93000A;--oner:#FFDAD6;--chg:#4A3F00;--cm:#9CA3AF;--st:#7DD9A0;--nm:#FFB77A;--kw:#B6C4FF;--wt:#5C4300;--wb:#FFB86B}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--on);font:14px/1.5 "Noto Sans JP",system-ui,sans-serif}
.b.ic{padding:0;width:40px;justify-content:center}
.ms{font-family:'Material Symbols Outlined';font-style:normal;font-size:20px;width:20px;height:20px;overflow:hidden;display:inline-block;line-height:1;flex:none}
.b{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 20px;border:0;border-radius:20px;font:500 14px inherit;font-family:inherit;cursor:pointer;background:none;color:var(--p)}
.b::before{content:'';position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .2s}
.b:hover::before{opacity:.08}.b:focus-visible::before,.b:active::before{opacity:.12}
.b:focus-visible,.sw:focus-visible,select:focus-visible{outline:2px solid var(--p);outline-offset:2px}
.b:disabled{opacity:.38;pointer-events:none}
.fl{background:var(--p);color:var(--onp)}.tn{background:var(--pc);color:var(--onpc)}.sm{height:32px;padding:0 12px}
.seg{display:flex;border:1px solid var(--ol);border-radius:20px;overflow:hidden}
.seg button{border:0;background:none;color:var(--on);height:38px;padding:0 18px;font:500 14px inherit;font-family:inherit;cursor:pointer}
.seg button+button{border-left:1px solid var(--ol)}
.seg button[aria-pressed=true]{background:var(--pc);color:var(--onpc)}
.sw{appearance:none;-webkit-appearance:none;margin:0;width:52px;height:32px;border-radius:16px;border:2px solid var(--ol);background:var(--sch);position:relative;cursor:pointer;transition:.2s}
.sw::after{content:'';position:absolute;top:6px;left:6px;width:16px;height:16px;border-radius:50%;background:var(--ol);transition:.2s}
.sw:checked{background:var(--p);border-color:var(--p)}.sw:checked::after{width:24px;height:24px;top:2px;left:22px;background:var(--onp)}
select{height:32px;border-radius:8px;border:1px solid var(--ol);background:var(--sf);color:var(--on);padding:0 8px;font:inherit;max-width:180px}
[hidden]{display:none!important}
input[type=text]{flex:1;min-width:0;height:40px;border:1px solid var(--ol);border-radius:8px;padding:0 12px;background:var(--sf);color:var(--on);font:inherit;font-family:ui-monospace,Menlo,monospace}
input[type=text]:focus{outline:2px solid var(--p);border-color:var(--p)}
dialog{border:0;border-radius:28px;background:var(--sf);color:var(--on);padding:24px;width:min(440px,92vw);max-height:80vh;overflow:auto}
dialog::backdrop{background:rgba(0,0,0,.4)}dialog h3{margin:0 0 12px;font-size:22px;font-weight:400}
#sn{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(24px + env(safe-area-inset-bottom,0px));background:var(--on);color:var(--sf);padding:12px 20px;border-radius:8px;z-index:9}
