/* 就活AIツール（ct-ai-tools）の画面。スマホが先。1.3.0（2026-10-31 しんたろーさん「トップのAIツールと同じように。全部統一させたい」）：トップのAIツール（ct-top-d の .ctx-f）に色・形をそろえた
   紺 #0D1F4F の字・青 #1F74EE・やわらかいグラデーションのカード（角丸14px）・白と薄い青の組み合わせ */
html .ctai{--k:#0D1F4F;--y:#1F74EE;--o:#1658D8;--g:#EEF5FC;--ln:#C9DDF3;--sub:#2A3752;box-sizing:border-box;max-width:760px;margin:8px auto 24px;color:var(--k);font-size:16px;line-height:1.75;text-align:left}
html .ctai *,html .ctai *::before,html .ctai *::after{box-sizing:border-box}
html .ctai p{margin:0}
html .ctai button{font-family:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none;margin:0;-webkit-tap-highlight-color:transparent}
html .ctai a{-webkit-tap-highlight-color:transparent}
html .ctai [hidden]{display:none !important}
/* テーマの記事の中の箇条書き・リンクの指定（.ct-content ul など）に負けないように、.ctai をつけて強める */
html .ctai ul,html .ctai ol{margin:0;padding:0}
html .ctai li::before{content:none}

/* 上のカード（トップのAIツールのカードと同じ形。FILE 01 の字・時間のラベル・グラデーション） */
html .ctai__file{position:relative;margin:14px 0 16px;overflow:hidden;border-radius:14px;box-shadow:inset 0 0 0 1px var(--bd,transparent),0 6px 16px rgba(20,70,150,.13)}
html .ctai__tab{position:static;display:block;height:auto;padding:13px 16px 0;border:0;border-radius:0;background:transparent;font-size:10px;font-weight:700;letter-spacing:.14em;line-height:1.2;opacity:.92}
html .ctai__card{padding:8px 16px 16px;border:0;border-radius:0;background:transparent}
html .ctai__badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px !important}
html .ctai__badges span{padding:2px 10px;border-radius:999px;font-size:11px;font-weight:800;line-height:1.6}
html .ctai__lead{color:inherit;font-size:15px;line-height:1.75;font-weight:500}
html .ctai .ctai__file .ctai__tab,html .ctai .ctai__file .ctai__card{background:transparent;border:0;color:inherit}
html .ctai.is-1 .ctai__lead,html .ctai.is-3 .ctai__lead,html .ctai.is-5 .ctai__lead,html .ctai.is-7 .ctai__lead{font-weight:600;text-shadow:0 1px 2px rgba(0,30,90,.28)}
html .ctai.is-1 .ctai__file{--bd:transparent;background:radial-gradient(120% 70% at 100% 0%,rgba(70,150,255,.45),transparent 60%),linear-gradient(160deg,#063088 0%,#0447a0 50%,#0a6cc6 100%);color:#fff}
html .ctai.is-2 .ctai__file{--bd:rgba(150,200,240,.55);background:linear-gradient(160deg,#f8fbfe 0%,#e6f4fe 55%,#d8effd 100%);color:#0D1F4F}
html .ctai.is-3 .ctai__file{--bd:transparent;background:linear-gradient(160deg,#4b92ec 0%,#3079e0 52%,#2262cb 100%);color:#fff}
html .ctai.is-4 .ctai__file{--bd:rgba(150,200,240,.55);background:linear-gradient(160deg,#fbfdfe 0%,#eff7fd 60%,#e3f0fc 100%);color:#0D1F4F}
html .ctai.is-5 .ctai__file{--bd:transparent;background:radial-gradient(90% 60% at 100% 0%,rgba(106,211,233,.75),transparent 65%),linear-gradient(160deg,#01588a 0%,#05679a 55%,#0e81c5 100%);color:#fff}
html .ctai.is-6 .ctai__file{--bd:rgba(150,200,240,.55);background:linear-gradient(160deg,#f6fafd 0%,#e6f4fc 60%,#dceffb 100%);color:#0D1F4F}
html .ctai.is-7 .ctai__file{--bd:transparent;background:linear-gradient(160deg,#1d7fe0 0%,#0a5cb8 55%,#06428f 100%);color:#fff}
html .ctai.is-1 .ctai__badges span,html .ctai.is-3 .ctai__badges span{background:#fff;color:#1658d8}
html .ctai.is-5 .ctai__badges span{background:#fff;color:#0b6c9c}
html .ctai.is-7 .ctai__badges span{background:#fff;color:#0a5cb8}
html .ctai.is-2 .ctai__badges span{background:#2b86f2;color:#fff}
html .ctai.is-4 .ctai__badges span{background:#2b86f2;color:#fff}
html .ctai.is-6 .ctai__badges span{background:#4aa3f2;color:#fff}

/* 使い方の切りかえ（このページで使う／自分のChatGPTで使う） */
html .ctai__modes{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 0 14px;padding:4px;border-radius:999px;background:var(--g)}
html .ctai__mode{padding:9px 6px;border:0;border-radius:999px;background:transparent;font-size:14px !important;font-weight:800;line-height:1.3}
html .ctai__mode[aria-selected="true"]{background:var(--y);color:#fff}

/* 会話 */
html .ctai__resume{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px !important;padding:8px 12px;border-radius:10px;background:var(--g);font-size:13px;line-height:1.5}
html .ctai__resume button{flex:none;padding:4px 10px;border:1.2px solid var(--ln);border-radius:999px;background:#fff;font-size:12px !important;font-weight:800}
html .ctai__log{display:flex;flex-direction:column;gap:14px}
html .ctai-msg{display:flex;gap:8px;align-items:flex-start;scroll-margin-top:84px}
html .ctai-msg__av{flex:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--y);color:#fff;font-size:12px;font-weight:900;letter-spacing:.02em}
html .ctai-msg__main{min-width:0;flex:1}
html .ctai-msg__who{margin-bottom:2px !important;font-size:11px;font-weight:800;color:#666}
html .ctai-msg__bubble{padding:12px 14px;border-radius:4px 16px 16px 16px;background:var(--g);font-size:15px;line-height:1.8;overflow-wrap:anywhere}
html .ctai-msg--user{justify-content:flex-end}
html .ctai-msg--user .ctai-msg__main{flex:0 1 auto;max-width:88%}
html .ctai-msg--user .ctai-msg__bubble{border-radius:16px 4px 16px 16px;background:#E3F0FD;white-space:pre-wrap}
html .ctai-msg__acts{display:flex;gap:6px;margin-top:6px}
html .ctai-msg__acts button{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border:1px solid #ccc;border-radius:999px;background:#fff;font-size:12px !important;font-weight:700;color:#444}
html .ctai-msg__bubble p{margin:0 0 .7em}
html .ctai-msg__bubble>*:last-child{margin-bottom:0}
html .ctai-msg__bubble .ctai-h{margin:.9em 0 .4em;padding-left:8px;border-left:4px solid var(--y);font-weight:800;line-height:1.5}
html .ctai-msg__bubble .ctai-h:first-child{margin-top:0}
html .ctai .ctai-msg__bubble ul,html .ctai .ctai-msg__bubble ol{margin:0 0 .7em;padding-left:1.4em}
html .ctai .ctai-msg__bubble ul{list-style:disc}
html .ctai .ctai-msg__bubble ol{list-style:decimal}
html .ctai .ctai-msg__bubble li{display:list-item;list-style:inherit}
html .ctai .ctai-msg__bubble li::marker{color:#1F74EE;font-weight:800}
html .ctai-msg__bubble li{margin:.15em 0}
html .ctai-msg__bubble strong{font-weight:900;background:linear-gradient(transparent 62%,rgba(31,116,238,.2) 62%)}
html .ctai-msg__bubble hr{margin:.9em 0;border:0;border-top:1px dashed #bbb}
html .ctai-tbl{margin:0 0 .8em;overflow-x:auto;-webkit-overflow-scrolling:touch}
html .ctai .ctai-tbl table{min-width:100%;border-collapse:collapse;background:#fff;font-size:13px;line-height:1.6}
html .ctai .ctai-tbl th,html .ctai .ctai-tbl td{padding:6px 8px;border:1px solid #ddd;vertical-align:top;text-align:left}
html .ctai .ctai-tbl th,html .ctai .ctai-tbl td{overflow-wrap:normal;word-break:normal}
html .ctai .ctai-tbl .nw{white-space:nowrap}
html .ctai .ctai-tbl th{background:#EEF5FC;font-weight:800;white-space:nowrap}
html .ctai-dots{display:inline-flex;gap:5px;align-items:center;height:20px}
html .ctai-dots i{width:7px;height:7px;border-radius:50%;background:#999;animation:ctaiDot 1s infinite ease-in-out}
html .ctai-dots i:nth-child(2){animation-delay:.15s}
html .ctai-dots i:nth-child(3){animation-delay:.3s}
html .ctai-dots+span{margin-left:8px;font-size:13px;color:#666}
@keyframes ctaiDot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
html .ctai-caret{display:inline-block;width:8px;height:1em;margin-left:2px;vertical-align:-2px;background:var(--y);animation:ctaiBlink 1s steps(2) infinite}
@keyframes ctaiBlink{50%{opacity:0}}

/* エラー */
html .ctai__err{margin:14px 0 0;padding:12px 14px;border:2px solid var(--o);border-radius:12px;background:#FFF1EA;font-size:14px;line-height:1.7}
html .ctai__err b{display:block;margin-bottom:4px;color:var(--o)}
html .ctai__err-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* 下に固定する入力欄 */
html .ctai__bar{position:-webkit-sticky;position:sticky;bottom:0;z-index:20;margin:16px 0 0;padding:10px 0 calc(10px + env(safe-area-inset-bottom,0px));background:#fff;box-shadow:0 -1px 0 #e3e3e3,0 -8px 16px -8px rgba(0,0,0,.12)}
html .ctai__chips{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none}
html .ctai__chips::-webkit-scrollbar{display:none}
html .ctai__chip{flex:none;padding:5px 12px;border:1.2px solid var(--ln);border-radius:999px;background:#fff;font-size:13px !important;font-weight:800;line-height:1.4}
html .ctai__chip:disabled{opacity:.4}
html .ctai__row{display:flex;gap:8px;align-items:flex-end}
html .ctai__input{flex:1;min-width:0;min-height:48px;max-height:40vh;margin:0;padding:11px 14px;border:1.5px solid var(--ln);border-radius:16px;background:#fff;color:var(--k);font:inherit;font-size:16px;line-height:1.55;resize:none;outline:0}
html .ctai__input:focus{border-color:var(--y);box-shadow:0 0 0 3px rgba(31,116,238,.28)}
html .ctai__send{flex:none;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:0;border-radius:50%;background:var(--y);box-shadow:0 2px 8px rgba(20,70,150,.25)}
html .ctai__send:disabled{background:#e6e6e6;box-shadow:none}
html .ctai__send.is-stop{background:#0D1F4F;box-shadow:none}
html .ctai__send svg{width:22px;height:22px;color:#fff}
html .ctai__foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:12px;color:#666}
html .ctai__reset{padding:2px 0;border:0;background:none;font-size:12px !important;color:#666;text-decoration:underline}

/* 自分のChatGPTで使う（コピー） */
html .ctai-copy__ttl{margin:0 0 10px !important;font-size:17px;font-weight:900}
html .ctai .ctai-steps{margin:0;padding:0;list-style:none;counter-reset:s}
html .ctai .ctai-steps>li{position:relative;margin:0 0 14px;padding:0 0 0 40px;counter-increment:s}
html .ctai .ctai-steps>li::before{content:counter(s);position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--y);color:#fff;font-size:14px;font-weight:800}
html .ctai-steps b{display:block;margin-bottom:6px;font-size:15px;line-height:1.6}
html .ctai-steps small{display:block;font-size:13px;line-height:1.6;color:#555}
html .ctai-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:13px 16px;border:0;border-radius:999px;font-size:16px !important;font-weight:900;line-height:1.3;text-align:center;text-decoration:none !important}
html .ctai-btn--key{background:var(--y);color:#fff !important;box-shadow:0 6px 14px rgba(31,116,238,.28)}
html .ctai-btn--key.is-done{background:#0D1F4F;color:#fff !important;box-shadow:none}
html .ctai-btn--dark{background:#0D1F4F;color:#fff !important}
html .ctai-btn--line{width:auto;padding:8px 14px;border:1.2px solid var(--ln);background:#fff;color:var(--k) !important;font-size:13px !important}
html .ctai-copy details{margin-top:4px;border:1px solid var(--ln);border-radius:12px;background:#fff}
html .ctai-copy summary{padding:10px 14px;font-size:14px;font-weight:800;cursor:pointer}
html .ctai-copy pre{max-height:300px;margin:0;padding:12px 14px;overflow:auto;border-top:1px solid #E1ECF8;background:#F6FAFE;font:12px/1.7 inherit;font-family:inherit;white-space:pre-wrap;word-break:break-word}

/* 注意書き・ほかのツール */
html .ctai__notes{margin:20px 0 0;padding:12px 14px;border-radius:12px;background:var(--g);font-size:12.5px;line-height:1.7;color:var(--sub)}
html .ctai__notes ul{margin:0;padding-left:1.2em}
html .ctai .ctai__notes li{display:list-item;list-style:disc;margin:.15em 0}
html .ctai__others{margin:22px 0 0}
html .ctai__others-ttl{margin:0 0 8px !important;font-size:14px;font-weight:900}
html .ctai .ctai__others ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
html .ctai__others li{margin:0}
html .ctai__others a{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--ln);border-radius:12px;background:#fff;color:var(--k) !important;text-decoration:none !important;font-size:14px;font-weight:800;line-height:1.4}
html .ctai__others a small{flex:none;padding:1px 7px;border-radius:6px;background:var(--y);color:#fff;font-size:10px;font-weight:800;letter-spacing:.06em}
html .ctai__others a span{flex:1}
html .ctai__others a i{font-style:normal}

html .ctai__toast{position:fixed;left:50%;bottom:120px;z-index:4000;padding:8px 16px;border-radius:999px;background:var(--k);color:#fff;font-size:14px;font-weight:800;transform:translateX(-50%);pointer-events:none;animation:ctaiToast 1.8s ease forwards}
@keyframes ctaiToast{0%{opacity:0;transform:translate(-50%,8px)}12%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}

@media (prefers-reduced-motion:reduce){html .ctai-dots i,html .ctai-caret,html .ctai__toast{animation:none}}
@media screen and (min-width:640px){
html .ctai__card{padding:18px 22px 20px}
html .ctai__lead{font-size:16px}
html .ctai-msg__bubble{font-size:16px}
html .ctai .ctai__others ul{grid-template-columns:repeat(3,1fr)}
}
html .ctai-msg__bubble .ctai-k{font-weight:900}
/* 自己分析パスポート（紺と金。いただいたPythonのコードと同じ色） */
html .ctai-pp{margin:24px 0 0;padding:20px 16px;border-radius:16px;background:#16233d;color:#f5f1e6}
html .ctai .ctai-pp__ttl{margin:0 0 6px;color:#d9c48f;font-size:18px;font-weight:900;line-height:1.5}
html .ctai .ctai-pp__lead{margin:0 0 12px;font-size:14px;line-height:1.7}
html .ctai-pp__in{display:block;box-sizing:border-box;width:100%;min-height:150px;margin:0 0 12px;padding:10px 12px;border:2px solid #d9c48f;border-radius:12px;background:#fff;color:var(--k);font:inherit;font-size:16px;line-height:1.6;resize:vertical}
html .ctai .ctai-pp__err{margin:10px 0 0;padding:8px 12px;border-radius:8px;background:#FFF4C2;color:var(--k);font-size:13px;font-weight:700;line-height:1.6}
html .ctai-pp__out{margin-top:16px}
html .ctai-pp__img{display:block;width:100%;height:auto;margin:0 0 12px;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.35)}
html .ctai-pp .ctai-btn--dark{background:#d9c48f;color:#16233d !important}
html .ctai-pp__out small{display:block;margin-top:8px;color:#d9c48f;font-size:12px;line-height:1.6}
html .ctai-msg__acts .ctai-msg__pp{border-color:#16233d;background:#16233d;color:#d9c48f}
