/* Phase 3 UI: 取込の進捗・結果・詳細・ドロップゾーン。色は本体トークン(ダーク/ライト両対応)。CSP対応のため style 属性は使わない */

/* 進捗/結果/トースト: タブバーの上に浮かぶ。本体の Island とは独立(タブ切替で消えないように) */
.p3-status{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:150;display:flex;align-items:center;gap:12px;
 max-width:min(92vw,420px);min-width:180px;padding:11px 14px 11px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--color-text,#0c2a22);
 background:color-mix(in srgb,var(--color-surface,#f6fffb) 86%,transparent);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);
 box-shadow:0 10px 32px rgb(0 0 0/.2),inset 0 1px 0 rgb(255 255 255/.5),0 0 0 1px rgb(0 0 0/.05)}
.p3-status[hidden]{display:none}
.p3-status-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.p3-status[data-tone=success]{box-shadow:0 10px 32px rgb(0 0 0/.2),inset 0 1px 0 rgb(255 255 255/.5),0 0 0 1.5px color-mix(in srgb,var(--color-success,#34d399) 70%,transparent)}
.p3-status[data-tone=warning]{box-shadow:0 10px 32px rgb(0 0 0/.2),inset 0 1px 0 rgb(255 255 255/.5),0 0 0 1.5px color-mix(in srgb,#e5a00d 75%,transparent)}
.p3-bar{flex:0 0 72px;height:5px;border-radius:3px;background:rgb(0 0 0/.1);overflow:hidden}
.p3-bar i{display:block;height:100%;width:0;border-radius:3px;background:var(--color-accent,#28a477)}
.p3-x{all:unset;box-sizing:border-box;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;background:color-mix(in srgb,var(--color-accent,#28a477) 14%,transparent);-webkit-tap-highlight-color:transparent;min-height:28px;display:inline-flex;align-items:center}
.p3-x:focus-visible{outline:2px solid var(--color-accent,#28a477);outline-offset:2px}

/* 取込結果ダイアログ(詳細) */
.p3-detail{position:fixed;inset:0;z-index:210;display:flex;align-items:center;justify-content:center;padding:20px}
.p3-scrim{position:absolute;inset:0;background:rgb(8 24 20/.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.p3-dpanel{position:relative;width:min(480px,100%);max-height:78dvh;overflow:auto;padding:20px 20px 16px;border-radius:24px;color:var(--color-text,#0c2a22);
 background:color-mix(in srgb,var(--color-surface,#f6fffb) 92%,transparent);backdrop-filter:blur(28px) saturate(1.5);-webkit-backdrop-filter:blur(28px) saturate(1.5);box-shadow:0 20px 60px rgb(0 0 0/.3),inset 0 1px 0 rgb(255 255 255/.5)}
.p3-dpanel h3{margin:0 0 4px;font-size:18px}
.p3-sum{margin:0 0 12px;font-size:13px;color:var(--color-text-muted,#5b7a70)}
.p3-dpanel ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.p3-dpanel li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:12px;background:rgb(0 0 0/.045);font-size:13px;word-break:break-all}
.p3-dpanel li span{font-size:12px;color:var(--color-text-muted,#5b7a70)}
.p3-fail{border-left:3px solid #e5484d}.p3-dup{border-left:3px solid #e5a00d}
.p3-actions{display:flex;justify-content:flex-end;margin-top:14px}

/* ドラッグ中の全画面ドロップゾーン */
.p3-drop{position:fixed;inset:0;z-index:220;display:grid;place-items:center;pointer-events:none;background:color-mix(in srgb,var(--color-accent,#28a477) 22%,rgb(8 24 20/.5));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.p3-drop[hidden]{display:none}
.p3-drop>div{display:flex;flex-direction:column;gap:6px;align-items:center;padding:34px 40px;border-radius:28px;border:2px dashed rgb(255 255 255/.85);color:#fff;text-align:center;text-shadow:0 2px 10px rgb(0 0 0/.35)}
.p3-drop b{font-size:18px}.p3-drop span{font-size:13px;opacity:.9}

/* 取込ボタン行(ホーム/空状態) */
.p3-importbar{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 4px}

/* 実カバー画像 */
.p2-cover.p3-img{background-size:cover!important;background-position:center!important}
.p2-cover.p3-img b{display:none}

@media (prefers-color-scheme:dark){
 .p3-status,.p3-dpanel{background:color-mix(in srgb,#10201b 90%,transparent);color:#e7fff6}
 .p3-bar{background:rgb(255 255 255/.16)}.p3-dpanel li{background:rgb(255 255 255/.07)}
}
@media (prefers-reduced-motion:reduce){.p3-status,.p3-dpanel{backdrop-filter:none;-webkit-backdrop-filter:none}}