/* ============================================================
   職務経歴書chan — 履歴書chan ブランドトークン準拠・モバイルファースト
   ============================================================ */
.writing-sample {margin:24px 0;border:1px solid var(--c-border);border-radius:12px;overflow:hidden;background:#fff}
.writing-sample figcaption {padding:16px;background:#fff4f6;line-height:1.7}
.writing-sample__paper {padding:clamp(16px,4vw,40px);color:#302827}
.writing-sample__title {text-align:center;font-size:1.4rem;letter-spacing:.15em}
.writing-sample__date {text-align:right}
.writing-sample h4 {margin:24px 0 12px;border-bottom:1px solid #dbc9c5;padding-bottom:8px;font-size:1rem}
.writing-guide li {line-height:1.9;margin-bottom:8px}
.writing-guide nav a {display:inline-block;padding:6px 0}
.writing-guide .btn {white-space:normal;text-align:center;max-width:100%;height:auto;min-height:48px}
.writing-small {font-size:.875rem}
:root{
  --c-primary:#f26c8b; --c-primary-dark:#d94e70; --c-coral:#ff8fa6;
  --c-accent:#ffe6ec; --c-accent-soft:#fff5f7;
  --c-orange:#ff9a42; --c-orange-dark:#f97316; --c-peach:#fff3ea; --c-cream:#fff9f6;
  --c-text:#4a2e2b; --c-text-sub:#7a6864; --c-faint:#b3a09b; --c-border:#f3d9d3; --c-white:#fff;
  --c-cat:#f8bd77;
  --radius:18px; --radius-lg:28px;
  --shadow-card:0 12px 34px rgba(242,108,139,.12); --shadow-cta:0 12px 22px rgba(249,115,22,.24);
  --shadow-sm:0 3px 10px rgba(242,108,139,.10);
  --font:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP",Meiryo,sans-serif;
  --font-doc:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;
  --header-h:56px; --sticky-h:76px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--header-h) + 12px)}
body{margin:0; background:var(--c-cream); color:var(--c-text); font-family:var(--font); font-size:15px; line-height:1.8; -webkit-font-smoothing:antialiased}
body.has-sticky{padding-bottom:calc(var(--sticky-h) + env(safe-area-inset-bottom))}
a{color:var(--c-primary-dark)}
button{font-family:inherit; color:inherit}
input,textarea{font-family:inherit; color:inherit; font-size:inherit}
h1,h2,h3{line-height:1.45; text-wrap:balance; margin:0}
p{margin:0 0 .9em}
.wrap{max-width:1120px; margin:0 auto; padding:0 16px}
.skip{position:absolute; left:-999px; top:8px; background:var(--c-white); padding:8px 12px; border-radius:8px; z-index:100}
.skip:focus{left:8px}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
:focus-visible{outline:3px solid var(--c-orange); outline-offset:2px}

/* ---------- header ---------- */
.hd{position:sticky; top:0; z-index:40; background:rgba(255,249,246,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--c-border)}
.hd__in{display:flex; align-items:center; gap:12px; height:var(--header-h)}
.logo{display:flex; align-items:center; gap:9px; text-decoration:none; color:inherit; margin-right:auto; min-width:0}
.logo__mark{width:36px; height:36px; border-radius:11px; flex:none; background:linear-gradient(180deg,#f6a5b8,#e9748f); display:grid; place-items:center}
.logo__t{font-weight:800; font-size:16px; line-height:1.1; white-space:nowrap}
.logo__t small{display:block; font-size:10px; color:var(--c-text-sub); font-weight:500; margin-top:2px}
.hd__nav{display:flex; gap:6px; align-items:center}
.hd__nav a{text-decoration:none; font-size:13px; font-weight:700; padding:8px 10px; border-radius:999px; color:var(--c-text-sub)}
.hd__nav a.hd__cta{background:linear-gradient(180deg,var(--c-orange),var(--c-orange-dark)); color:#fff; padding:8px 14px}
@media (max-width:480px){ .hd__nav a:not(.hd__cta){display:none} .logo__t small{display:none} }

/* ---------- footer ---------- */
.ft{margin-top:56px; border-top:1px solid var(--c-border); padding:28px 0 32px; font-size:13px; color:var(--c-text-sub)}
.ft__grid{display:grid; gap:18px}
.ft__logo{font-weight:800; color:var(--c-text); margin:0 0 4px}
.ft__desc{line-height:1.8}
.ft nav{display:flex; flex-direction:column; gap:8px}
.ft nav a{text-decoration:none; font-weight:600}
.ft__copy{margin-top:18px; color:var(--c-faint); font-size:12px}
.operator{background:var(--c-white); border:2px solid var(--c-accent); border-radius:var(--radius); padding:14px 18px; margin-bottom:22px; line-height:1.7}
.operator p{margin:0}
.operator__role{font-size:11px; font-weight:800; color:var(--c-primary); letter-spacing:.06em}
.operator__name{font-size:16px; font-weight:800; color:var(--c-text)} .operator__name a{text-decoration:none; color:inherit}
.operator__cred{font-size:12.5px; color:var(--c-text); font-weight:600; margin-top:2px}
.operator__desc{font-size:12.5px; color:var(--c-text-sub); margin-top:4px}
.supervised{font-size:12.5px; color:var(--c-text-sub); margin:-6px 0 14px} .supervised a{font-weight:700}
.kv{display:grid; gap:8px; margin:0}
.kv div{display:grid; grid-template-columns:7em 1fr; gap:10px; background:var(--c-white); border:2px solid var(--c-border); border-radius:12px; padding:10px 14px; font-size:14px}
.kv dt{font-weight:800; color:var(--c-text-sub)} .kv dd{margin:0}
@media (min-width:720px){ .ft__grid{grid-template-columns:1.4fr 1fr} }

/* ---------- breadcrumb ---------- */
.bc{font-size:12px; color:var(--c-text-sub); padding:10px 16px 0; max-width:1120px; margin:0 auto; overflow-x:auto; white-space:nowrap}
.bc ol{list-style:none; margin:0; padding:0; display:flex; gap:4px}
.bc li+li::before{content:"›"; margin:0 6px 0 2px; color:var(--c-faint)}
.bc a{color:inherit; text-decoration:none}
.bc [aria-current]{color:var(--c-text); font-weight:700}

/* ---------- FV / hero ---------- */
.fv,.hero{padding:22px 0 10px}
.eyebrow{font-size:12px; font-weight:800; color:var(--c-primary); letter-spacing:.04em; margin:0 0 6px}
.fv h1,.hero h1{font-size:26px; font-weight:800; margin-bottom:10px}
.fv__lead,.hero__lead{font-size:15px; color:var(--c-text-sub); margin-bottom:16px}
.fv__lead b{color:var(--c-orange-dark); font-size:1.15em}
.fv__cta,.hero__cta{display:flex; flex-direction:column; gap:10px; align-items:flex-start}
.hero__note{font-size:12px; color:var(--c-faint); margin-top:12px}
@media (min-width:720px){ .fv h1,.hero h1{font-size:34px} .hero{padding:40px 0 16px} .hero__cta{flex-direction:row; align-items:center} }

/* ---------- buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; border:0; border-radius:999px; padding:13px 26px; font-size:15px; font-weight:800; cursor:pointer; text-decoration:none; line-height:1.3; min-height:48px}
.btn--primary{background:linear-gradient(180deg,var(--c-orange),var(--c-orange-dark)); color:#fff; box-shadow:var(--shadow-cta)}
.btn--primary:hover{filter:brightness(1.05)}
.btn--primary[disabled]{opacity:.45; box-shadow:none; cursor:not-allowed; filter:none}
.btn--ghost{background:var(--c-white); color:var(--c-text); border:2px solid var(--c-border)}
.btn--ghost:hover{border-color:var(--c-primary); color:var(--c-primary-dark)}
.btn--lg{padding:16px 34px; font-size:17px}
.btn.sec{background:var(--c-white); color:var(--c-text-sub); border:2px solid var(--c-border); box-shadow:none; padding:10px 20px; font-size:14px}
.btn.sec:hover{border-color:var(--c-primary); color:var(--c-primary-dark)}
.btn.link{background:none; box-shadow:none; color:var(--c-primary-dark); font-weight:700; padding:10px 6px; font-size:13px; text-decoration:underline; text-underline-offset:3px}
.btn__skip{font-size:14px; color:var(--c-text-sub); text-decoration:underline; text-underline-offset:3px; padding:6px 2px}
.more{font-weight:700; text-decoration:none}

/* ---------- content sections ---------- */
.answer{background:var(--c-white); border:2px solid var(--c-accent); border-radius:var(--radius); padding:16px 18px; margin:14px 0 8px; font-size:15px; line-height:1.9; box-shadow:var(--shadow-sm)}
.answer p{margin:0}
.sec{padding:26px 0 6px}
.sec h2{font-size:20px; font-weight:800; margin-bottom:10px; padding-left:12px; border-left:4px solid var(--c-primary)}
.sec h3{font-size:16px; font-weight:800; margin:16px 0 6px}
.sec p{color:var(--c-text)}
.note{font-size:13px; color:var(--c-text-sub); background:var(--c-peach); border-radius:12px; padding:10px 14px; line-height:1.8}
.src{font-size:12px; color:var(--c-faint)}
.ul{padding-left:1.3em; margin:0 0 .9em} .ul li{margin-bottom:4px}
.updated{font-size:12px; color:var(--c-faint); margin-top:20px}
.cta-mid{text-align:center; padding:20px 0}

.checklist{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.checklist li{display:flex; align-items:flex-start; gap:10px; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:10px 12px; font-size:14px; line-height:1.6}
.checklist li span{flex:1}
.copy{flex:none; border:1px solid var(--c-border); background:var(--c-cream); border-radius:999px; padding:4px 10px; font-size:11.5px; font-weight:700; color:var(--c-text-sub); cursor:pointer}
.copy:hover,.copy.done{border-color:var(--c-primary); color:var(--c-primary-dark)}

.axes{display:grid; gap:8px; margin:12px 0 16px}
.axes div{display:grid; grid-template-columns:52px 1fr; gap:10px; align-items:start; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:10px 12px}
.axes dt{font-weight:800; color:var(--c-primary-dark); font-size:15px}
.axes dd{margin:0; font-size:13.5px; color:var(--c-text-sub); line-height:1.7}
@media (min-width:720px){ .axes{grid-template-columns:1fr 1fr} }

.ex{list-style:none; margin:0 0 12px; padding:0; display:grid; gap:8px}
.ex li{background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:11px 14px; font-size:14px; line-height:1.9}
mark.fill{background:var(--c-peach); color:var(--c-orange-dark); font-weight:800; padding:0 4px; border-radius:4px; border-bottom:2px solid var(--c-orange)}

.chips{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px}
.chips li,.chips a{display:inline-flex; align-items:center; border:2px solid var(--c-border); background:var(--c-white); border-radius:999px; padding:6px 13px; font-size:13px; font-weight:600; text-decoration:none; color:var(--c-text)}
.chips li:has(>a){padding:0; border:0} .chips li>a{display:inline-flex}

.sv-bar{display:grid; grid-template-columns:8.5em 1fr 3em; gap:10px; align-items:center; margin:6px 0; font-size:13px}
.sv-bar__t{height:14px; background:var(--c-accent); border-radius:99px; overflow:hidden}
.sv-bar__t i{display:block; height:100%; background:linear-gradient(90deg,var(--c-coral),var(--c-primary)); border-radius:99px}
.sv-bar__v{font-weight:800; text-align:right; font-variant-numeric:tabular-nums}
.bars{margin:8px 0 6px}

.qa{background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:12px 16px; margin-bottom:10px}
.qa h3{margin:0 0 6px; font-size:15px}
.qa h3::before{content:"Q. "; color:var(--c-primary)}
.qa p{margin:0; font-size:14px; color:var(--c-text-sub); line-height:1.8}

.links{list-style:none; padding:0; margin:0; display:grid; gap:6px}
.links a{display:block; background:var(--c-white); border:2px solid var(--c-border); border-radius:12px; padding:9px 14px; text-decoration:none; font-weight:600; font-size:14px}
.links a:hover{border-color:var(--c-primary)}
@media (min-width:720px){ .links{grid-template-columns:1fr 1fr} }

.steps{list-style:none; counter-reset:s; margin:0; padding:0; display:grid; gap:8px}
.steps li{counter-increment:s; display:grid; grid-template-columns:34px 1fr; gap:10px; align-items:start; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:10px 12px}
.steps li::before{content:counter(s); width:28px; height:28px; border-radius:50%; background:var(--c-primary); color:#fff; display:grid; place-items:center; font-weight:800; font-size:13px}
.steps b{display:block; font-size:14.5px} .steps span{grid-column:2; font-size:13px; color:var(--c-text-sub); line-height:1.6}

.feats{display:grid; gap:10px}
.feat{background:var(--c-white); border:2px solid var(--c-border); border-radius:var(--radius); padding:14px 16px}
.feat b{display:block; font-size:15px; margin-bottom:4px} .feat p{margin:0; font-size:13.5px; color:var(--c-text-sub)}
@media (min-width:720px){ .feats{grid-template-columns:1fr 1fr} }

.catgrid{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:8px}
.catgrid a{display:flex; align-items:center; gap:8px; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:10px 12px; text-decoration:none; font-weight:700; font-size:13.5px; color:var(--c-text); min-height:48px}
.catgrid a:hover{border-color:var(--c-primary)} .catgrid__e{font-size:18px}
@media (min-width:720px){ .catgrid{grid-template-columns:repeat(3,1fr)} }
.sister{text-align:center; color:var(--c-text-sub); font-size:14px}

.cat{margin-bottom:22px}
.cat__h{font-size:17px; font-weight:800; margin-bottom:6px} .cat__h a{text-decoration:none; color:inherit} .cat__h small{font-size:12px; color:var(--c-faint); font-weight:500; margin-left:6px}
.cat__jobs{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px}
.cat__jobs a{display:inline-block; background:var(--c-white); border:1px solid var(--c-border); border-radius:999px; padding:5px 12px; font-size:13px; text-decoration:none; color:var(--c-text)}
.cat__jobs a.more{border:0; background:none; color:var(--c-primary-dark)}

.joblist{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.joblist a{display:flex; justify-content:space-between; align-items:center; gap:10px; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:11px 14px; text-decoration:none; color:var(--c-text); min-height:48px}
.joblist a:hover{border-color:var(--c-primary)} .joblist b{font-size:15px} .joblist small{font-size:12px; color:var(--c-primary-dark); font-weight:700; white-space:nowrap}
@media (min-width:720px){ .joblist{grid-template-columns:1fr 1fr} }
.rest{margin-top:14px; font-size:13px; color:var(--c-text-sub)} .rest summary{cursor:pointer; font-weight:700; padding:6px 0} .rest .chips{margin-top:8px}

.tbl{border-collapse:collapse; width:100%; font-size:13.5px; background:var(--c-white); border-radius:14px; overflow:hidden}
.tbl th,.tbl td{padding:9px 12px; border-bottom:1px solid var(--c-border); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl thead th{background:var(--c-accent-soft); color:var(--c-primary-dark); font-size:12px}
.tbl tfoot th{background:var(--c-peach); font-weight:800}
.tbl a{text-decoration:none; font-weight:600}

/* ---------- sticky CTA (親指圏) ---------- */
.sticky-cta{position:fixed; left:0; right:0; bottom:0; z-index:30; background:rgba(255,249,246,.94); backdrop-filter:blur(8px); border-top:1px solid var(--c-border); padding:10px 16px calc(10px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; align-items:center; gap:4px}
.sticky-cta .btn{width:100%; max-width:520px}
.sticky-cta__alt{font-size:12px; color:var(--c-text-sub); text-decoration:underline; text-underline-offset:3px}
@media (min-width:900px){ .sticky-cta{display:none} }

/* ============================================================
   ビルダー（/create/）
   ============================================================ */
.create{padding-top:12px}
.cur{display:flex; align-items:center; gap:8px; background:var(--c-white); border:2px solid var(--c-accent); border-radius:999px; padding:6px 8px 6px 14px; margin-bottom:12px; font-size:13px; flex-wrap:wrap}
.cur__l{font-weight:800; color:var(--c-text-sub)} .cur__v{font-weight:800; color:var(--c-primary-dark); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cur__opt{font-size:10.5px; font-weight:800; color:var(--c-orange-dark); background:var(--c-peach); border-radius:99px; padding:1px 8px}
.cur__btn{border:0; background:var(--c-primary); color:#fff; border-radius:999px; padding:7px 14px; font-size:12.5px; font-weight:800; cursor:pointer; min-height:34px}
.cur__btn:hover{background:var(--c-primary-dark)}

.nyan-row{display:flex; align-items:flex-end; gap:10px; margin-bottom:12px}
.nyan{width:64px; flex:none} .nyan svg{display:block; width:100%; height:auto}
.bubble{background:var(--c-white); border:2px solid var(--c-accent); border-radius:var(--radius) var(--radius) var(--radius) 4px; padding:10px 14px; font-size:13.5px; line-height:1.7; font-weight:600; box-shadow:var(--shadow-sm); flex:1}

.bar{height:8px; background:var(--c-accent); border-radius:99px; overflow:hidden; margin-bottom:8px}
.bar i{display:block; height:100%; background:linear-gradient(90deg,var(--c-coral),var(--c-primary)); border-radius:99px; transition:width .3s}
.rail{display:flex; overflow-x:auto; margin-bottom:14px; scrollbar-width:none} .rail::-webkit-scrollbar{display:none}
.rail-item{display:flex; align-items:center; gap:5px; white-space:nowrap; border:0; background:none; padding:4px 10px 4px 0; font-size:12px; color:var(--c-faint); cursor:default}
.rail-item .n{width:19px; height:19px; border-radius:50%; display:grid; place-items:center; font-size:10.5px; font-weight:700; border:1.5px solid currentColor; flex:none}
.rail-item.done{color:var(--c-primary); cursor:pointer} .rail-item.done .n{background:var(--c-primary); border-color:var(--c-primary); color:#fff}
.rail-item.now{color:var(--c-primary-dark); font-weight:800} .rail-item.now .n{background:var(--c-accent); border-color:var(--c-primary-dark)}

.tabs{display:flex; gap:4px; background:var(--c-white); border:1px solid var(--c-border); border-radius:999px; padding:4px; margin-bottom:14px; box-shadow:var(--shadow-sm)}
.tabs button{flex:1; border:0; background:none; padding:9px; border-radius:999px; font-size:13.5px; font-weight:700; cursor:pointer; color:var(--c-text-sub); min-height:40px}
.tabs button[aria-pressed="true"]{background:var(--c-primary); color:#fff}
.create__grid{display:grid; gap:20px}
body[data-view="p"] .panel,body[data-view="p"] .nyan-row{display:none}
body[data-view="q"] .side{display:none}
@media (min-width:900px){
  .tabs{display:none}
  .create__grid{grid-template-columns:minmax(0,1fr) minmax(0,420px); align-items:start}
  body[data-view="p"] .panel,body[data-view="p"] .nyan-row,body[data-view="q"] .side{display:block}
  .side{position:sticky; top:calc(var(--header-h) + 12px)}
  .nyan{width:80px}
}

.panel{background:var(--c-white); border:1px solid var(--c-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); overflow:hidden}
.q-head{padding:20px 18px 2px} .q-eyebrow{font-size:11px; letter-spacing:.1em; color:var(--c-primary); font-weight:800; margin:0 0 5px}
.q-title{font-size:20px; font-weight:800} .q-help{margin:6px 0 0; color:var(--c-text-sub); font-size:13px}
.q-body{padding:14px 18px 20px; display:flex; flex-direction:column; gap:16px}
.hint{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px; color:var(--c-text-sub)}
.hint .pill{background:var(--c-accent); color:var(--c-primary-dark); border-radius:999px; padding:3px 12px; font-weight:800; font-size:12px; font-variant-numeric:tabular-nums}
.chip{border:2px solid var(--c-border); background:var(--c-white); border-radius:999px; padding:8px 14px; font-size:13.5px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; text-align:left; line-height:1.55; font-weight:600; min-height:42px}
.chip:hover{border-color:var(--c-coral)}
.chip[aria-pressed="true"]{background:var(--c-accent); border-color:var(--c-primary); color:var(--c-primary-dark)}
.chip.wide{width:100%; border-radius:14px; align-items:flex-start; font-weight:500}
.chip.own{border-style:dashed} .chip.own[aria-pressed="true"]{border-style:solid}
.ownbadge{font-size:10px; font-weight:800; color:var(--c-orange-dark); background:var(--c-peach); border-radius:99px; padding:1px 7px; flex:none}
.mk{width:16px; height:16px; border-radius:50%; border:2px solid var(--c-border); flex:none; display:grid; place-items:center; font-size:9px; color:transparent; margin-top:2px}
.chip:not(.wide) .mk{margin-top:0}
.chip[aria-pressed="true"] .mk,.ach[data-on="1"] .mk,.str[aria-pressed="true"] .mk{background:var(--c-primary); border-color:var(--c-primary); color:#fff}
.q-body .chips{display:flex; flex-wrap:wrap; gap:8px}
.fields{display:grid; gap:14px} .f{display:grid; gap:5px}
.f>label{font-size:12px; font-weight:800; color:var(--c-text-sub)} .f .opt{font-weight:500; color:var(--c-faint)}
.req{color:var(--c-primary); font-size:10.5px; background:var(--c-accent); border-radius:99px; padding:1px 8px; margin-left:5px; font-weight:800}
.q-body input[type=text]:not(.blank),.q-body input[type=tel],.q-body input[type=email],.q-body input[type=number],.q-body select,.q-body textarea{border:2px solid var(--c-border); background:var(--c-white); border-radius:12px; padding:11px 13px; width:100%; line-height:1.6; font-size:16px}
.q-body textarea{resize:vertical; min-height:72px}
.q-body input:focus,.q-body textarea:focus{outline:none; border-color:var(--c-primary); box-shadow:0 0 0 3px var(--c-accent)}
.row2{display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center} .tilde{color:var(--c-text-sub); font-size:13px}
.check{display:inline-flex; align-items:center; gap:7px; font-size:13px; cursor:pointer; font-weight:600} .check input{width:18px; height:18px; accent-color:var(--c-primary)}
.achs{display:grid; gap:9px}
.ach{border:2px solid var(--c-border); border-radius:14px; background:var(--c-white); padding:11px 14px; display:grid; grid-template-columns:auto 1fr; gap:10px; cursor:pointer; align-items:start; line-height:2; font-size:13.5px}
.ach:hover{border-color:var(--c-coral)} .ach[data-on="1"]{background:var(--c-accent-soft); border-color:var(--c-primary); cursor:default}
.ach .txt{color:var(--c-text-sub)} .ach[data-on="1"] .txt{color:var(--c-text)}
.blank{border:0; border-bottom:2.5px solid var(--c-orange); background:transparent; text-align:center; padding:0 4px 1px; font-weight:800; color:var(--c-orange-dark); font-variant-numeric:tabular-nums; min-width:3ch; border-radius:4px 4px 0 0; font-size:16px}
.blank::placeholder{color:var(--c-faint); font-weight:500} .blank:focus{outline:none; background:var(--c-accent)}
.strs{display:grid; gap:10px}
.str{border:2px solid var(--c-border); border-radius:var(--radius); background:var(--c-white); padding:12px 15px; text-align:left; cursor:pointer; display:grid; gap:4px}
.str:hover{border-color:var(--c-coral)} .str[aria-pressed="true"]{background:var(--c-accent-soft); border-color:var(--c-primary)}
.str .sl{font-weight:800; font-size:14px; display:flex; align-items:center; gap:8px} .str .sb{font-size:12px; color:var(--c-text-sub); line-height:1.8}
.grp{display:grid; gap:8px}
.grp h4{margin:0; font-size:11px; letter-spacing:.06em; color:var(--c-primary-dark); font-weight:800; background:var(--c-accent-soft); border-radius:99px; padding:4px 12px; justify-self:start}
.cochip{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:800; color:var(--c-orange-dark); background:var(--c-peach); border-radius:999px; padding:3px 12px}
.selrow{display:flex; flex-wrap:wrap; gap:7px; align-items:center; background:var(--c-accent-soft); border:1px dashed var(--c-primary); border-radius:14px; padding:10px 13px}
.selrow .lbl{font-size:11.5px; font-weight:800; color:var(--c-primary-dark)}
.tagsel{display:inline-flex; align-items:center; gap:6px; background:var(--c-white); border:1px solid var(--c-primary); border-radius:999px; padding:4px 6px 4px 12px; font-size:12.5px; font-weight:700}
.delx{border:0; background:var(--c-accent); color:var(--c-primary-dark); width:22px; height:22px; border-radius:50%; cursor:pointer; font-size:11px; display:grid; place-items:center; padding:0}
.delx:hover{background:var(--c-primary); color:#fff}
.adder{display:flex; gap:8px; align-items:center} .adder input{flex:1} .adder .addbtn{white-space:nowrap; padding:9px 16px; font-size:13px}
.nav{display:flex; gap:9px; align-items:center; flex-wrap:wrap; padding:14px 18px; border-top:1px solid var(--c-border); background:var(--c-accent-soft)}
.nav .spacer{margin-left:auto}
.side-head{display:flex; align-items:center; justify-content:space-between; font-size:11.5px; color:var(--c-text-sub); padding:0 4px 8px; font-weight:700}
.paper-wrap{background:var(--c-white); border:1px solid var(--c-border); border-radius:var(--radius); box-shadow:var(--shadow-card); padding:22px 20px 26px; position:relative; font-family:var(--font-doc)}
@media (min-width:900px){ .paper-wrap{max-height:calc(100dvh - var(--header-h) - 40px); overflow-y:auto; padding:26px} }
.paper h2{margin:0 0 4px; text-align:center; font-size:17px; font-weight:600; letter-spacing:.42em; text-indent:.42em}
.paper .meta{text-align:right; font-size:11.5px; color:var(--c-text-sub); line-height:1.9; margin-bottom:16px} .paper .meta .nm{color:var(--c-text); font-size:13px}
.paper.has-seal .meta{padding-right:66px}
.psec{margin:0 0 16px} .psec-h{font-size:13px; font-weight:600; margin:0 0 6px; padding-bottom:4px; border-bottom:1px solid var(--c-border); display:flex; align-items:center; gap:6px}
.psec-h::before{content:"■"; color:var(--c-primary); font-size:9px}
.psec p{margin:0 0 5px; font-size:12px; line-height:1.95; text-align:justify}
.psec ul{margin:0; padding-left:0; list-style:none; font-size:12px; line-height:1.95}
.psec li{padding-left:1.1em; text-indent:-1.1em}
.psec li::before{content:"・"}
.psec ul.cols{columns:2; column-gap:14px}
.co{margin:0 0 13px} .co-n{font-size:12.5px; font-weight:600; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap} .co-n .per{font-weight:400; font-size:11px; color:var(--c-text-sub)}
.co-m{font-size:11px; color:var(--c-text-sub); margin:1px 0 4px} .co-sub{font-size:11.5px; font-weight:600; margin:6px 0 2px; color:var(--c-primary-dark)}
.ghosted{color:var(--c-faint)} .endmark{text-align:right; font-size:12px; color:var(--c-text-sub); margin-top:12px}
.seal{position:absolute; top:16px; right:18px; width:58px; height:58px; border-radius:50%; border:2.5px solid var(--c-primary); color:var(--c-primary); display:grid; place-items:center; font-family:var(--font-doc); font-weight:600; font-size:15px; transform:rotate(-11deg); animation:stamp .35s cubic-bezier(.2,1.5,.4,1)}
@keyframes stamp{from{transform:rotate(-11deg) scale(1.9); opacity:0}to{transform:rotate(-11deg) scale(1); opacity:1}}
.done-actions{display:flex; gap:9px; flex-wrap:wrap}
.draft-tools{margin:12px 0 20px;padding:12px;border:1px solid var(--c-border);border-radius:12px;background:var(--c-white)}
.draft-tools p{font-size:13px;margin:0 0 8px}
.export-dialog{width:min(640px,calc(100% - 24px));max-height:90dvh;overflow:auto;border:1px solid var(--c-border);border-radius:20px;padding:22px;color:var(--c-text);background:var(--c-cream)}
.export-dialog::backdrop{background:rgba(50,30,35,.5)}
.export-heading{display:flex;gap:12px;align-items:center;justify-content:space-between}
.export-heading h2{font-size:21px;margin:0}
.export-dialog p{margin:14px 0;line-height:1.8}
.export-dialog #pdfActions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.export-dialog label:not(.support-consent){display:block;margin-top:14px;font-weight:700}
.export-dialog input:not([type=checkbox]),.export-dialog select{width:100%;padding:12px;border:1px solid var(--c-border);border-radius:10px;font-size:16px;background:white;color:var(--c-text)}
.creation-nav{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.creation-nav a{display:flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--c-primary);border-radius:24px;max-width:100%;overflow-wrap:anywhere}
.home-section h3{font-size:1.1rem;line-height:1.7;margin:12px 0}
.home-section .feat h4{margin:0 0 10px;font-size:1rem}
.support-choice{text-align:center;padding:12px 0}
.support-choice h3{color:var(--c-primary-dark);font-size:1.2rem;line-height:1.6}
.support-choice strong{color:#c94d00}
.support-choice .btn{display:flex;width:100%;white-space:normal;min-height:48px;height:auto;margin:12px 0;padding:14px 18px;line-height:1.5}
.support-choice .support-apply{background:linear-gradient(100deg,#ff9636,#ff7510);color:#fff;border:0;font-weight:700}
.support-choice .support-apply:disabled{opacity:.5;cursor:not-allowed}
.export-heading #closeExport{flex-shrink:0;white-space:nowrap;min-width:70px}
.support-choice .support-skip{background:#fff;color:var(--c-primary-dark);border:1px solid var(--c-primary)}
.support-choice .support-disclosure{text-align:left;font-size:.8rem;line-height:1.8;margin-top:18px}
.support-provider{font-size:.85rem;color:var(--c-text-sub)}
.support-offer{margin-top:24px;border-top:1px solid var(--c-border);padding-top:18px}
.support-offer summary{cursor:pointer;font-weight:700}
.support-consent{display:flex;align-items:flex-start;gap:10px;margin:18px 0;font-size:14px}
.support-consent input{flex:0 0 auto;margin-top:5px}
@media print{.export-dialog,.draft-tools{display:none!important}}
.outbox{width:100%; min-height:200px; font-family:var(--font-doc); font-size:12px; line-height:1.9; border:2px solid var(--c-border); border-radius:12px; padding:13px; background:var(--c-cream); white-space:pre; overflow:auto}
.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:var(--c-text); color:#fff; padding:11px 22px; border-radius:999px; font-size:13.5px; font-weight:700; box-shadow:var(--shadow-card); z-index:60}
.invite{background:var(--c-peach); border-radius:14px; padding:12px 14px; font-size:13px; line-height:1.7; display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.invite b{color:var(--c-orange-dark)}

/* ============================================================
   全画面ピッカー（1画面＝1階層。変化は必ずビューポート内で起きる）
   ============================================================ */
.picker{position:fixed; inset:0; width:100%; max-width:none; height:100dvh; max-height:none; margin:0; border:0; padding:0; background:var(--c-cream); color:var(--c-text); display:none; flex-direction:column}
.picker[open]{display:flex}
.picker::backdrop{background:rgba(74,46,43,.45)}
.picker__hd{display:grid; grid-template-columns:44px 1fr 44px; align-items:center; height:var(--header-h); border-bottom:1px solid var(--c-border); background:var(--c-white); flex:none}
.picker__title{text-align:center; font-size:15px; font-weight:800; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:0 4px}
.picker__title:focus{outline:none}
.picker__back,.picker__close{border:0; background:none; font-size:26px; line-height:1; cursor:pointer; height:44px; color:var(--c-text-sub)}
.picker__back[hidden]{visibility:hidden; display:block}
.picker__search{padding:10px 14px; background:var(--c-white); border-bottom:1px solid var(--c-border); flex:none}
.picker__search input{width:100%; border:2px solid var(--c-border); border-radius:999px; padding:10px 16px; font-size:16px; background:var(--c-cream)}
.picker__search input:focus{outline:none; border-color:var(--c-primary); box-shadow:0 0 0 3px var(--c-accent)}
.picker__list{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:10px 14px calc(var(--sticky-h) + 24px); overscroll-behavior:contain}
.pk-h{font-size:11px; font-weight:800; color:var(--c-faint); letter-spacing:.06em; margin:14px 4px 6px}
.pk-row{display:flex; align-items:center; gap:10px; width:100%; text-align:left; background:var(--c-white); border:2px solid var(--c-border); border-radius:14px; padding:12px 14px; margin-bottom:8px; font-size:15px; font-weight:700; cursor:pointer; min-height:52px; transition:background .1s,border-color .1s}
.pk-row:active{background:var(--c-accent)}
.pk-row .e{font-size:20px; width:28px; text-align:center; flex:none}
.pk-row .t{flex:1; min-width:0} .pk-row .t small{display:block; font-size:11.5px; color:var(--c-text-sub); font-weight:500; margin-top:1px}
.pk-row .a{color:var(--c-faint); font-size:18px; flex:none}
.pk-row.skip{position:static; border-style:dashed; border-color:var(--c-orange); background:var(--c-peach)}
.pk-row.skip .e{color:var(--c-orange-dark)}
.pk-row[aria-selected="true"]{background:var(--c-primary); border-color:var(--c-primary); color:#fff}
.pk-row[aria-selected="true"] .t small,.pk-row[aria-selected="true"] .a{color:rgba(255,255,255,.85)}
.pk-row[aria-selected="true"] .a::before{content:"✓"}
.pk-empty{padding:16px; background:var(--c-white); border-radius:14px; font-size:13.5px; color:var(--c-text-sub); line-height:1.8}
.picker__ft{position:sticky; bottom:0; flex:none; display:flex; align-items:center; gap:12px; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(255,249,246,.96); backdrop-filter:blur(8px); border-top:1px solid var(--c-border)}
.picker__sel{flex:1; min-width:0; font-size:12px; color:var(--c-text-sub)} .picker__sel b{display:block; font-size:14px; color:var(--c-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.picker__ft .btn{flex:none; padding:12px 20px; font-size:14px}
.picker__ft .btn.pulse{animation:pulse .45s ease}
@keyframes pulse{0%{transform:scale(1)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important} }

/* ============================================================
   印刷 / PDF保存 — A4縦の職務経歴書として出力する
   画面用のUIはすべて落とし、#paper だけを本文として組み直す。
   ============================================================ */
@media print {
  @page { size: A4 portrait; margin: 20mm 18mm; }

  html, body { background: #fff !important; margin: 0; padding: 0; }
  body {
    font-family: var(--font-doc);
    color: #000;
    font-size: 10.5pt;
    line-height: 1.75;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }

  /* 画面用の要素は印刷しない */
  .hd, .ft, .skip, .nyan-row, .bar, .rail, .tabs, .panel, .side-head,
  .sticky-cta, .cur, .toast, .invite, .adder, .selrow, .note, noscript,
  .bc, .fv__cta, .cta-mid, .copy, .more, .rest, .create-title, .create-notice { display: none !important; }

  /* 画面のタブ切替（data-view）に関係なく書類を出す */
  body[data-view="q"] .side,
  body[data-view="p"] .side { display: block !important; }

  .wrap, .create, .create__grid, .side { display: block !important; max-width: none; margin: 0; padding: 0; position: static; }
  .paper-wrap {
    border: 0; box-shadow: none; border-radius: 0; padding: 0;
    max-height: none; overflow: visible; background: #fff;
  }
  .seal { display: none !important; }          /* 「完成」印は書類に出さない */

  /* ---- 書類本体 ---- */
  .paper { color: #000; }
  .paper h2 {                                   /* 表題「職務経歴書」 */
    font-size: 16pt; font-weight: 600; text-align: center;
    letter-spacing: .5em; text-indent: .5em; margin: 0 0 8mm;
  }
  .paper .meta {
    text-align: right; font-size: 9.5pt; color: #000;
    line-height: 1.9; margin: 0 0 7mm; padding-right: 0;
  }
  .paper .meta .nm { font-size: 11pt; }

  .psec { margin: 0 0 6mm; }
  .psec-h {
    font-size: 11.5pt; font-weight: 600; color: #000;
    border-bottom: 0.4pt solid #000; padding-bottom: 1.5mm; margin: 0 0 3mm;
    break-after: avoid; page-break-after: avoid;
  }
  .psec-h::before { content: "■"; color: #000; font-size: 8pt; margin-right: 1mm; }
  .psec p { font-size: 10.5pt; line-height: 1.85; margin: 0 0 2mm; text-align: justify; }
  .psec ul { margin: 0 0 2mm; padding-left: 0; list-style: none; font-size: 10.5pt; line-height: 1.8; }
  .psec li { margin-bottom: 0.8mm; padding-left: 4mm; text-indent: -4mm; break-inside: avoid; page-break-inside: avoid; }
  .psec li::before { content: "・"; }
  /* スキル・資格は2段組にしてA4の行数を節約する */
  .psec ul.cols { columns: 2; column-gap: 8mm; }
  .psec ul.cols li { break-inside: avoid; }

  /* 勤務先ブロックは途中で切らない */
  .co { margin: 0 0 5mm; break-inside: avoid; page-break-inside: avoid; }
  .co-n { font-size: 11pt; font-weight: 600; display: block; margin-bottom: 1mm; }
  .co-n .per { float: right; font-weight: 400; font-size: 9.5pt; color: #000; }
  .co-n::after { content: ""; display: block; clear: both; }
  .co-m { font-size: 9.5pt; color: #000; margin: 0 0 1mm; }
  .co-sub {
    font-size: 10pt; font-weight: 600; color: #000; margin: 2.5mm 0 1mm;
    break-after: avoid; page-break-after: avoid;
  }
  .co-sub::before { content: "◆"; font-size: 8pt; margin-right: 1mm; }

  .ghosted { display: none; }                   /* 未入力の案内文は出さない */
  .endmark { text-align: right; font-size: 10.5pt; color: #000; margin-top: 6mm; }

  /* 段落の泣き別れを防ぐ */
  p, li { orphans: 2; widows: 2; }
}

/* ---------- 職種ページ：選べるチェックリスト ---------- */
.picklist{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.picklist label{display:flex; align-items:flex-start; gap:11px; background:var(--c-white); border:2px solid var(--c-border);
  border-radius:14px; padding:11px 14px; font-size:14px; line-height:1.7; cursor:pointer; min-height:48px}
.picklist label:hover{border-color:var(--c-coral)}
.picklist input{width:20px; height:20px; margin:2px 0 0; accent-color:var(--c-primary); flex:none}
.picklist label:has(input:checked){background:var(--c-accent-soft); border-color:var(--c-primary)}
.sticky-cta__count{margin:0; font-size:12px; font-weight:700; color:var(--c-primary-dark)}

/* ---------- ウィザード：勤務先の確認 ---------- */
.colist{display:grid; gap:10px}
.coitem{border:2px solid var(--c-border); border-radius:14px; background:var(--c-white); padding:12px 14px}
.coitem__h{display:flex; align-items:center; justify-content:space-between; gap:10px}
.coitem__h b{font-size:15px}
.coitem__h .btn{padding:6px 14px; min-height:36px; font-size:12.5px}
.coitem__m{font-size:12.5px; color:var(--c-text-sub); margin-top:3px}
.addco-btn{width:100%; justify-content:center}

/* Brand and responsive layout: share the sister site's original illustrations. */
@media screen {
  :root{--c-primary-dark:#ad3655; --c-faint:#7f6d68; --header-h:72px}
  img{max-width:100%; height:auto}
  [hidden]{display:none!important}
  .picker__back[hidden]{display:block!important; visibility:hidden}
  .hd__in{gap:20px}
  .hd__nav{gap:10px; flex-shrink:0}
  .logo__t{font-size:18px}
  .logo__t small{font-size:11px; margin-top:5px}
  .btn--primary,.hd__nav a.hd__cta{background:#bd405c; box-shadow:0 5px 16px rgba(189,64,92,.16)}
  .btn--primary:hover,.hd__nav a.hd__cta:hover{background:#a6314b; filter:none}
  .btn{max-width:100%; overflow-wrap:anywhere}
  .btn.sec{margin:0}
  .home .hero{display:grid; gap:16px; padding:40px 0 32px; align-items:center}
  .hero__copy{min-width:0}
  .home .hero h1{font-size:clamp(27px,3.15vw,43px); line-height:1.55; letter-spacing:-.045em; text-wrap:initial; margin:12px 0 20px}
  .hero h1 em{font-style:normal; color:var(--c-primary-dark)}
  .hero__catch{display:inline-block}
  .home .hero__lead{font-size:15px; line-height:2}
  .hero__visual{margin:0; min-width:0; text-align:center}
  .hero__visual img{display:block; width:100%; object-fit:contain}
  .hero__visual figcaption{font-size:12px; color:var(--c-text-sub); margin-top:4px}
  .trust-pills{display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:20px 0}
  .trust-pills li{background:white; border:1px solid var(--c-border); border-radius:8px; padding:6px 10px; font-size:12px; font-weight:700}
  .hero__secondary{margin:14px 0 0; font-size:14px; font-weight:700}
  .hero__note{color:var(--c-text-sub); font-size:11px; line-height:1.8}
  .home-intro{background:#fff; border:1px solid var(--c-border); border-radius:18px; padding:22px 26px; font-size:13px; line-height:1.9}
  .home-intro p{margin:0}
  .home-intro strong{display:block; font-size:16px; margin-bottom:6px}
  .home-section{padding:56px 0 0}
  .home-section h2{font-size:clamp(22px,2.2vw,28px); border:0; padding:0; margin:0 0 12px; text-wrap:initial}
  .home-section .eyebrow{font-size:10px; letter-spacing:.13em; color:var(--c-primary-dark)}
  .home-section .section-lead{color:var(--c-text-sub); font-size:14px; margin-bottom:22px}
  .job-search{margin:22px 0; padding:20px; border-radius:18px; background:var(--c-accent-soft); border:1px solid var(--c-border)}
  .job-search label{display:block; font-weight:700; font-size:13px; margin-bottom:6px}
  .job-search input{width:100%; padding:13px 16px; border:1px solid #b99c94; border-radius:10px; font-size:16px; background:white; color:var(--c-text)}
  .job-search p{font-size:12px; margin:8px 0 0; color:var(--c-text-sub)}
  .job-search .joblist{margin-top:14px}
  .home-categories{grid-template-columns:1fr; gap:10px}
  .home-categories a{padding:17px 16px; border-width:1px; height:100%; border-radius:12px; font-size:14px}
  .home-categories small{display:block; font-size:11px; color:var(--c-text-sub); font-weight:400; margin-top:3px}
  .home-categories .catgrid__e{font-size:24px; flex:none; width:36px}
  .catgrid__arrow{margin-left:auto; font-size:22px; color:var(--c-primary-dark)}
  .home-categories .all-categories{background:var(--c-accent-soft)}
  .skip-path{font-size:13px; padding:18px 0 0; text-align:center}
  .skip-path a{display:inline-block; font-weight:700}
  .home-steps{gap:14px}
  .home-steps li{border-width:1px; padding:22px 18px; border-radius:16px}
  .home-steps b{margin-bottom:10px; font-size:15px}
  .home-steps span{display:block}
  .home-steps li::before{background:var(--c-accent); color:var(--c-primary-dark)}
  .reassurance{display:grid; gap:26px; margin-top:56px; padding:30px 22px; border-radius:24px; background:#fff0ec}
  .reassurance>div>p{font-size:14px}
  .reassurance .feat{border-width:1px; box-shadow:none}
  .faq-item{border-bottom:1px solid var(--c-border); background:#fff; padding:0 20px}
  .faq-item:first-of-type{border-radius:14px 14px 0 0}
  .faq-item:last-of-type{border-radius:0 0 14px 14px}
  .faq-item summary{padding:18px 0; font-size:14px; font-weight:700; cursor:pointer}
  .faq-item p{font-size:14px; line-height:1.9; padding:0 0 18px; margin:0}
  .detail-links{display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:18px; font-size:12px}
  .sister-banner{margin-top:56px; display:flex; align-items:center; flex-wrap:wrap; gap:20px; background:#fff; border:1px solid var(--c-border); border-radius:18px; padding:24px}
  .sister-banner img{flex:none; border-radius:14px}
  .sister-banner div{flex:1; min-width:190px}
  .sister-banner h2{font-size:19px; margin-bottom:6px}
  .sister-banner p{font-size:13px; margin:0; color:var(--c-text-sub)}
  .sister-banner .btn{font-size:13px}
  .closing-cta{text-align:center; padding:58px 0 16px}
  .closing-cta h2{font-size:24px; margin-bottom:12px}
  .closing-cta p{font-size:14px; margin-bottom:22px}
  .page-toc{display:flex; flex-wrap:wrap; gap:8px; padding:18px 0}
  .page-toc a{padding:8px 12px; border-radius:8px; background:#fff; border:1px solid var(--c-border); font-size:13px; text-decoration:none}
  .job>.wrap{max-width:900px}
  .create-title{font-size:20px; margin:6px 0}
  .create-notice{font-size:12px; color:var(--c-text-sub); margin-bottom:16px; line-height:1.8}
  .nyan{width:112px}
  .nyan img{display:block}
  .nyan-row{align-items:center}
  .q-title{scroll-margin-top:calc(var(--header-h) + 20px)}
  .create__grid>*{min-width:0}
  .row2{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .row2 input,.adder input{min-width:0}
  .chip span,.ach .txt,.bubble,.coitem__h b{min-width:0; overflow-wrap:anywhere}
  .q-body .blank{max-width:100%; line-height:1.6}
  .q-body .outbox{min-height:240px; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px}
  .paper{overflow-wrap:anywhere}
  .tbl{display:block; max-width:100%; overflow-x:auto}
  .tbl th:first-child,.tbl td:first-child{white-space:normal; min-width:9em}
  .kv div{grid-template-columns:minmax(5em,7em) minmax(0,1fr)}
  .kv dd{overflow-wrap:anywhere}
  .pk-row.skip{z-index:auto}
  .picker__list{padding-bottom:16px}
  .picker__ft .btn{max-width:54%; white-space:normal}
  @media(min-width:600px){
    .home-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
    .home-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  }
  @media(min-width:900px){
    .home .hero{grid-template-columns:1.12fr 1fr; gap:20px; padding:54px 0 40px}
    .reassurance{grid-template-columns:.9fr 1.2fr; padding:34px; align-items:center}
    .home-section{padding-top:64px}
    .home-section.reassurance{padding-top:34px}
    body.has-sticky{padding-bottom:0}
    body[data-view="p"] .nyan-row{display:flex}
  }
  @media(max-width:899px){
    .hd__nav a:not(.hd__cta){display:none}
    .home .hero__visual{max-width:340px; justify-self:center}
    .home .hero__cta .btn{width:100%}
    .hero__secondary{text-align:center}
    .nav{position:sticky; bottom:0}
    .tabs{position:sticky; top:var(--header-h); z-index:10}
    .home .hero__copy{width:100%}
  }
  @media(max-width:380px){
    .btn--lg{font-size:14px; padding:15px 18px}
    .logo__t{font-size:15px}
    .hd__in{gap:8px}
    .logo{gap:6px}
    .hd__nav a.hd__cta{padding:8px 10px}
    .home .hero h1{font-size:25px}
    .nyan{width:82px}
    .q-body,.q-head,.nav{padding-left:14px; padding-right:14px}
  }
}
.review-link { display:block; width:100%; margin-top:10px; text-align:left; white-space:normal; }
.nav-help { flex-basis:100%; margin:0 0 8px; font-size:14px; }
#continueDraft { grid-column:1 / -1; }
.writing-guide { max-width:850px; font-size:16px; }
.writing-guide .writing-answer { margin:16px 0; padding:14px 16px; border-left:4px solid var(--c-primary-dark); background:var(--c-accent-soft); font-size:1.05rem; line-height:1.8; overflow-wrap:anywhere; }
.writing-guide section { margin:36px 0; scroll-margin-top:90px; }
.writing-guide p { line-height:1.95; overflow-wrap:anywhere; }
.writing-guide h2 { margin:0 0 16px; }
.guide-table { max-width:100%; overflow-x:auto; margin:20px 0; }
.guide-table:focus-visible { outline:3px solid var(--c-primary-dark); outline-offset:3px; }
.guide-table table { width:100%; min-width:300px; border-collapse:collapse; line-height:1.8; overflow-wrap:anywhere; }
.guide-table caption { text-align:left; font-weight:bold; padding:8px 0; }
.guide-table th,.guide-table td { padding:12px; border:1px solid var(--c-border); text-align:left; vertical-align:top; }
.guide-table th { background:var(--c-accent-soft); }
.guide-table th:first-child { width:35%; }
.guide-faq details { border-bottom:1px solid var(--c-border); padding:14px 0; }
.guide-faq summary { cursor:pointer; font-weight:bold; line-height:1.8; }
.guide-faq summary:focus-visible { outline:3px solid var(--c-primary-dark); outline-offset:3px; }
.writing-examples { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; }
.writing-examples figure { margin:0; }
.job-editorial { max-width:850px; margin-inline:auto; }
.job-editorial p { line-height:1.9; overflow-wrap:anywhere; }
.job-editorial h3 { font-size:1.1rem; line-height:1.7; }
.job-editorial__sample { background:#fff; border:1px solid #dcc8c2; padding:clamp(16px,4vw,36px); margin:24px 0 12px; box-shadow:0 5px 20px #573c3010; }
.job-editorial__sample-title { text-align:center; font-size:1.3rem; letter-spacing:.3em; font-weight:bold; }
.job-editorial__sample dt { font-weight:bold; border-bottom:1px solid #dcc8c2; padding-bottom:8px; margin-top:22px; }
.job-editorial__sample dd { margin:10px 0 0; line-height:1.85; overflow-wrap:anywhere; }
.job-editorial__table { overflow-x:auto; margin:20px 0; }
.job-editorial__table:focus-visible { outline:3px solid var(--c-primary-dark); outline-offset:3px; }
.job-editorial table { border-collapse:collapse; width:100%; min-width:480px; font-size:.95rem; }
.job-editorial th,.job-editorial td { border:1px solid #dcc8c2; padding:12px; text-align:left; vertical-align:top; }
.job-editorial thead th { background:var(--c-accent-soft); }
.job-editorial .btn { margin:6px 0; white-space:normal; }
