.migration-body.has-color-tray{padding-bottom:calc(var(--color-tray-height,0px) + 16px)}
.migration-tools{--tool-ink:#08152f;--tool-line:#dce8fa;color:var(--tool-ink);max-width:100%}.migration-tools *{box-sizing:border-box}.migration-tools [hidden]{display:none!important}.migration-tools button,.migration-tools input,.migration-tools select,.migration-tools textarea{font:inherit}.migration-tools button,.migration-tools select{min-height:44px}.migration-tools button{color:#213b65;background:#fff;border:1px solid var(--tool-line);border-radius:7px;padding:8px 12px;cursor:pointer}.migration-tools button:hover{border-color:#0065ff}.migration-tools button:disabled{opacity:.55;cursor:default}.migration-tools :focus-visible{outline:3px solid #0065ff;outline-offset:3px}.migration-tools input,.migration-tools select,.migration-tools textarea{color:var(--tool-ink);background:#fff;border:1px solid #bccde5;border-radius:8px;padding:10px;max-width:100%}.migration-tools input{min-height:48px}.tool-note{background:#f3f7fd;border-left:3px solid #0065ff;padding:16px 20px;line-height:1.9}.tool-notice{min-height:1.7em;overflow-wrap:anywhere}.tool-related{display:flex;gap:14px 24px;flex-wrap:wrap;border-top:1px solid var(--tool-line);padding:26px 0;margin-top:36px}.tool-related a{min-height:44px;display:inline-flex;align-items:center}.tool-source{margin-top:28px;border:1px solid var(--tool-line);padding:16px 20px;border-radius:8px}.tool-source summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700}.tool-source p{line-height:1.9}.tool-source a{overflow-wrap:anywhere}.tool-measurements{margin:24px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.tool-measurements>div{border:1px solid var(--tool-line);border-radius:10px;padding:22px}.tool-measurements dt{font-weight:700;margin-bottom:14px}.tool-measurements dd{margin:0;font-size:clamp(18px,2.5vw,28px);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.tool-measurements small{display:block;font-size:13px;color:#526780;margin-top:12px}.tool-resize-form fieldset{border:1px solid var(--tool-line);border-radius:10px;padding:24px;display:flex;align-items:end;gap:20px;flex-wrap:wrap}.tool-resize-form label{display:grid;gap:8px;max-width:100%}.tool-resize-form input{width:180px}.tool-resize-form button,.color-tray-heading>[data-copy-favorites]{background:#08152f;color:#fff}.tool-resize-form{margin-bottom:20px}.color-search-label{display:block;font-size:14px;font-weight:700;margin-bottom:8px}.color-controls input[type=search]{width:100%;padding:15px 20px;border-radius:8px;font-size:16px}.color-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--tool-line);margin:20px 0 16px;gap:4px}.color-tabs button{border:0;border-radius:0;background:none;border-bottom:3px solid transparent;font-size:16px;padding:12px 6px}.color-tabs button[aria-selected=true]{color:#0065ff;border-bottom-color:#0065ff;font-weight:700}.color-filter-line{display:flex;justify-content:space-between;align-items:center;gap:12px}.color-family-desktop{display:flex;flex-wrap:wrap;gap:4px}.color-family-desktop button{border:0;border-radius:24px;padding:8px 12px;white-space:nowrap}.color-family-desktop button[aria-pressed=true]{background:#e2efff;color:#0065ff;font-weight:700}.color-family-mobile{display:none}.color-background-label{display:flex;align-items:center;gap:8px;white-space:nowrap}.color-background-label select{min-width:76px}.color-result-line{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0}.color-result-line p{font-size:14px;margin:0;color:#536784}.color-result-line button{font-size:13px;border:0;text-decoration:underline}.color-workspace{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}.color-library.is-enhanced .color-workspace{grid-template-columns:minmax(0,1fr) 286px}.color-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 16px;align-items:start;background:#fff;padding:4px;border-radius:8px}.color-card{min-width:0;background:#fff;color:#08152f}.color-swatch{display:block;width:100%;height:104px;border:0!important;border-radius:8px!important;padding:0!important;position:relative}.color-swatch[aria-pressed=true]{outline:3px solid #0065ff;outline-offset:3px}.color-swatch[aria-pressed=true]:after{content:'選択中';position:absolute;right:5px;bottom:5px;background:#fff;color:#08152f;font-size:11px;padding:3px 6px;border-radius:3px}.color-card-info{padding:10px 2px 4px}.color-card-info h3{font-size:15px;line-height:1.5;margin:0!important;overflow-wrap:anywhere;letter-spacing:0!important}.color-card-info .color-reading{font-size:11px;line-height:1.5;min-height:1.5em;margin:3px 0 6px;overflow-wrap:anywhere;color:#536784}.color-card code{font-size:13px;color:#3b557d}.color-card-actions{display:grid;grid-template-columns:1fr;gap:4px;margin-top:8px}.color-card-actions button{font-size:12px;padding:6px 3px;min-width:0;overflow-wrap:anywhere}.color-card-actions button[aria-pressed=true]{color:#0053c6;background:#e4efff;border-color:#0065ff;font-weight:700}.color-category{font-size:10px;color:#60748c;display:block;margin-bottom:3px}.is-enhanced .color-category{display:none}.color-detail-desktop{border-left:1px solid var(--tool-line);padding-left:24px}.color-detail-desktop>div{position:sticky;top:100px}.color-detail-swatch{height:142px;border-radius:8px}.color-detail-name{font-size:28px!important;line-height:1.4!important;margin:18px 0 4px!important;letter-spacing:0!important;overflow-wrap:anywhere}.color-detail-reading{font-size:14px!important;margin:0 0 18px!important;min-height:1.4em}.color-detail-values{font-size:13px;margin:12px 0}.color-detail-values>div{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;border-bottom:1px solid var(--tool-line);padding:12px 0}.color-detail-values dt{font-weight:700}.color-detail-values dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.color-detail-hint{font-size:12px;line-height:1.7;color:#536784}.color-detail-actions{display:grid;gap:8px;margin-top:14px}.color-text-tests{border-top:1px solid var(--tool-line);margin-top:20px;padding-top:18px}.color-text-tests>p{font-size:13px;font-weight:700}.color-text-samples{display:grid;grid-template-columns:1fr 1fr;gap:8px}.color-text-samples>p{margin:0;padding:22px 6px;text-align:center;font-size:15px;font-weight:700;border-radius:5px}.color-text-samples small{display:block;font-size:10px;margin-top:5px}.color-library[data-surround=black] .color-grid{background:#111;padding:10px}.color-library[data-surround=black] .color-card-info{padding:10px 6px 6px}.color-empty{padding:30px 15px;background:#f3f7fd;border-radius:8px;line-height:1.8}.color-tray{position:fixed;z-index:55;bottom:0;left:0;width:100%;padding:14px max(20px,calc((100vw - 1180px)/2));background:#fff;border-top:1px solid #bbd5fc;box-shadow:0 -8px 24px #08152f0a;padding-bottom:calc(10px + env(safe-area-inset-bottom))}.color-tray-heading{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-bottom:10px}.color-tray-heading strong{font-size:16px}.color-tray-heading>button{font-size:13px}.color-tray-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.color-tray-item{border:1px solid var(--tool-line);display:grid;grid-template-columns:45px 1fr auto;align-items:center;border-radius:6px;min-width:0;overflow:hidden}.color-tray-chip{height:48px;width:45px;display:block}.color-tray-label{padding:3px 7px;overflow-wrap:anywhere;font-size:12px}.color-tray-label span{display:block;font-size:10px}.color-tray-item button{border:0;padding:4px 6px;font-size:11px;border-radius:0}.color-tray-help{font-size:11px;line-height:1.6;margin:8px 0 0;color:#536784}.color-tray-edit{display:none}.color-detail-dialog{width:min(100%,540px);max-height:88dvh;border:1px solid var(--tool-line);border-radius:18px 18px 0 0;margin:auto auto 0;padding:22px 22px calc(24px + env(safe-area-inset-bottom));overflow:auto;color:#08152f;background:#fff;z-index:90}.color-detail-dialog::backdrop{background:#00102599}.color-dialog-close{display:block;margin-left:auto;margin-bottom:14px;min-width:80px}.color-detail-dialog .color-detail-swatch{height:145px}.manual-copy{padding:18px;border:1px solid var(--tool-line);margin:15px 0}.manual-copy label{display:block;font-size:14px;line-height:1.8}.manual-copy textarea{width:100%;margin-top:8px}.color-library>.tool-notice{position:fixed;z-index:75;bottom:180px;right:20px;max-width:min(520px,calc(100vw - 40px));background:#fff;padding:10px 16px;border:1px solid #9acbea;border-radius:6px;box-shadow:0 2px 8px #08152f14;font-size:13px}.color-library>.tool-notice:empty{display:none}.color-library>.manual-copy:not([hidden]){position:fixed;z-index:85;bottom:180px;left:50%;transform:translateX(-50%);width:min(600px,calc(100vw - 32px));background:#fff;box-shadow:0 5px 30px #08152f3b}
/* Keep the paired samples aligned when the article shell adds spacing to p+p. */
.migration-page .color-text-samples>p{margin:0;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.6;gap:5px}
.migration-page .color-text-samples>p>small{margin:0;line-height:1.6}
/* The shared article dialog rule must not turn the mobile bottom sheet into a centered panel. */
.migration-page .color-detail-dialog{width:min(100%,540px);max-width:100%;max-height:88dvh;border-radius:18px 18px 0 0;padding:22px 22px calc(24px + env(safe-area-inset-bottom))}
@media(min-width:1180px){.color-card-actions{grid-template-columns:1fr 1.2fr}.color-grid{gap:28px 16px}}
@media(max-width:1000px) and (min-width:781px){.color-library.is-enhanced .color-workspace{grid-template-columns:minmax(0,1fr) 250px;gap:18px}.color-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.color-detail-desktop{padding-left:18px}.color-family-desktop button{font-size:13px;padding:6px 8px}}
@media(max-width:780px){.tool-measurements{grid-template-columns:1fr}.tool-measurements>div{padding:18px}.tool-resize-form fieldset{padding:18px;gap:16px}.tool-resize-form label,.tool-resize-form input{width:100%}.color-library.is-enhanced .color-workspace{display:block}.color-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}.color-swatch{height:110px}.color-detail-desktop{display:none!important}.color-family-desktop{display:none}.color-family-mobile{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px}.color-family-mobile select{min-width:95px;max-width:135px}.color-background-label{font-size:13px}.color-background-label select{min-width:62px}.color-tabs{gap:0;margin-top:16px}.color-tabs button{font-size:13px;padding:10px 2px;overflow-wrap:anywhere}.color-filter-line{gap:10px}.color-search-label{font-size:13px}.color-controls input[type=search]{font-size:14px;padding:12px}.color-card-info h3{font-size:16px}.color-card-info .color-reading{font-size:11px}.color-card-actions{grid-template-columns:1fr;gap:4px}.color-card-actions button{font-size:12px}.color-tray{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}.color-tray-heading{gap:8px;margin-bottom:8px}.color-tray-heading strong{font-size:13px}.color-tray-heading>button{font-size:12px;padding:6px 8px}.color-tray-edit{display:block}.color-tray-items{gap:8px}.color-tray-item{display:block;border:0;overflow:visible}.color-tray-chip{height:32px;width:100%;border-radius:4px}.color-tray-label{font-size:10px;padding:4px 0 0;text-align:center;white-space:nowrap}.color-tray-label span{display:none}.color-tray-item button{display:none;width:100%;font-size:11px;padding:5px 0;margin-top:5px;border:1px solid var(--tool-line);border-radius:4px}.color-tray.is-editing .color-tray-item button{display:block}.color-tray-help{display:none}.color-library>.tool-notice{bottom:160px;right:16px;max-width:calc(100vw - 32px)}.color-library>.manual-copy:not([hidden]){bottom:155px}.tool-related{gap:8px 18px}}
@media(prefers-reduced-motion:no-preference){.migration-tools button{transition:border-color .12s,background-color .12s}}
.color-library>.tool-notice,.color-library>.manual-copy:not([hidden]){bottom:calc(var(--color-tray-height,0px) + 12px)}
.color-library>.tool-notice{pointer-events:none}
.color-detail-dialog>[data-close-detail]{position:sticky;top:0;z-index:1;background:#fff}