.journey-layout{background:linear-gradient(#e5eee4e8,#f8f1dfed),url('./assets/v16/own-writing-studio.webp') center/cover fixed;max-width:1640px}
.journey-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.journey-heading h1{margin:12px 0 0;font-size:clamp(27px,2.5vw,40px)}
.journey-progress{list-style:none;display:flex;gap:10px;margin:0;padding:0;flex-wrap:wrap}.journey-progress li{display:flex;gap:7px;align-items:center;font-size:13px;line-height:1.4;color:#3b5e56}.journey-progress li span{display:grid;place-items:center;width:28px;height:28px;border:1px solid #7a9784;border-radius:50%;background:#fff9ed;flex:none}.journey-progress [aria-current]{font-weight:800;color:#153e43}.journey-progress [aria-current] span{background:#ffce69;border:2px solid #233f3f}.journey-progress .done span{background:#216c71;color:white}
.journey-methods{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.8fr);gap:22px;align-items:stretch}.journey-method-tabs{display:grid;gap:11px;align-content:start}.journey-method-tabs .btn{justify-content:start;text-align:left;padding:10px 14px;min-height:91px;background:#fff9ed}.journey-method-tabs .btn.selected{background:#dceee4;color:#153e43;box-shadow:4px 4px #216c71}.journey-method-tabs img{width:66px;height:66px;object-fit:contain;flex:none}.journey-method-tabs span{display:grid;gap:5px}.journey-method-tabs small{font-size:12px;color:#3e665d}.journey-method-tabs strong{font-size:16px;line-height:1.5}
.journey-method-paper{position:relative;padding:25px clamp(20px,2.2vw,36px);border:2px solid #233f3f;border-radius:18px;box-shadow:4px 5px #233f3f;background:#fffbf0;min-width:0}.journey-paper-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:#41655e;margin-bottom:16px}.journey-paper-heading h2{margin:0}.journey-method-paper h2{font-size:clamp(23px,2.2vw,35px);margin-bottom:20px}.journey-beforeafter{display:grid;grid-template-columns:1fr 1.2fr;gap:14px}.journey-beforeafter>div{padding:18px;border:1.5px solid #8faaa0;border-radius:12px;background:#f6ede0}.journey-beforeafter>div+div{background:#e1efe5;border-color:#508b78}.journey-beforeafter b{font-size:13px}.journey-beforeafter p{font-size:19px;line-height:1.75;margin:12px 0 0}.journey-explain{font-size:17px;margin:18px 0}.journey-question{border-left:5px solid #216c71;border-radius:10px;padding:16px 20px;background:#fff0bf;margin:18px 0;font-size:15px;line-height:1.7}.journey-question p{margin:5px 0 8px;font-size:17px}.journey-question small{color:#4b645a}.journey-own blockquote{white-space:pre-wrap;margin:12px 0;padding:16px;background:#e7efe3;border-radius:10px}.journey-method-paper>.small{margin:15px 0 0}
.journey-empty{min-height:470px;padding:24px;display:flex;flex-direction:column;justify-content:center;align-items:start;isolation:isolate;position:relative;color:#fffdf1;border-radius:12px;overflow:hidden}.journey-empty:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#103e40ea,#103e4088),url('./assets/v16/own-writing-studio.webp') center/cover}.journey-empty h2{font-size:clamp(30px,3vw,46px);text-shadow:1px 2px #123e40}.journey-empty p{font-size:18px}.journey-empty .btn{color:#153e43}
.journey-two{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px}.journey-fields{background:#fffaf0}.journey-reference{display:flex;flex-direction:column;gap:20px;min-width:0}.journey-reference>.panel{flex:1}.journey-photo-note{padding:24px;min-height:210px;background:linear-gradient(90deg,#113f40ed,#113f4060),url('./assets/v16/own-writing-studio.webp') center 30%/cover;color:#fffef2;border:2px solid #233f3f;border-radius:16px;display:flex;flex-direction:column;justify-content:end}.journey-photo-note p{margin:0}.journey-examples>div{display:grid;grid-template-columns:85px minmax(0,1fr);gap:10px;padding:10px 0}.journey-examples dt{font-size:14px}.journey-examples dd{margin:0;font-size:15px}.journey-examples+.small{margin-bottom:0}
.journey-lead{font-size:17px}.journey-source-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.journey-source{padding:22px}.journey-source:nth-child(2){background:#edf2df}.journey-source:nth-child(3){background:#fff0d5}.journey-source legend{font-size:15px}.journey-source-kinds{display:flex;flex-direction:column;gap:9px}.journey-source-kinds .btn{font-size:14px;justify-content:start}.journey-source-guide{padding:20px 25px;border:2px solid #233f3f;border-radius:14px;background:#dcece7;box-shadow:3px 3px #233f3f;margin-top:22px;font-size:15px}.journey-source-guide p:last-child{margin-bottom:0}
.journey-outline{display:grid;gap:18px;min-width:0}.journey-outline-paper{display:grid;grid-template-columns:45px minmax(0,1fr);gap:16px;padding:20px;background:#fffaf0;border:2px solid #233f3f;border-radius:15px;box-shadow:4px 4px #233f3f}.journey-outline-paper>span{font-weight:800;font-size:16px;color:#216c71}.journey-outline-aside{background:#e0ece3}.journey-outline-aside h2{margin-top:15px}.journey-outline-aside .prewrap{font-size:15px}.journey-outline .field{margin:0}.journey-outline-paper:nth-child(2){background:#fff0c3}
.journey-mode .header-actions .btn{min-height:44px}.journey-mode .writer-notes{background:#e0ece3}.journey-mode .progress-copy{max-width:50%}.journey-mode .record-title{display:block;font-weight:500;font-size:12px}.journey-mode .writer-notes dd{white-space:pre-wrap}
@media(min-width:1280px){.journey-mode #app>.layout:not(.journey-layout){background:linear-gradient(#f0f3e9ed,#f6f0dfed),url('./assets/v16/own-writing-studio.webp') center/cover fixed}.journey-method-paper{min-height:560px}}
@media(max-width:1000px){.journey-heading{align-items:start;flex-direction:column;gap:16px}.journey-two{grid-template-columns:1fr 1fr}.journey-method-tabs img{width:52px;height:52px}.journey-methods{grid-template-columns:minmax(210px,.7fr) minmax(0,1.5fr)}.journey-source-grid{grid-template-columns:1fr}.journey-source{display:grid;grid-template-columns:1fr 1fr;gap:18px}.journey-source .journey-paper-heading{grid-column:1/-1;margin:0}.journey-source fieldset{grid-row:2/4;grid-column:2;margin:0}.journey-source .field{margin:0}.journey-beforeafter{grid-template-columns:1fr}}
@media(max-width:700px){.journey-methods,.journey-two{grid-template-columns:1fr}.journey-method-tabs{display:flex;gap:10px;overflow:auto;padding:3px 4px 9px;scroll-snap-type:x proximity}.journey-method-tabs .btn{flex:0 0 210px;scroll-snap-align:start;min-height:92px}.journey-methods{gap:14px}.journey-method-paper{padding:20px}.journey-empty{min-height:330px;padding:20px}.journey-beforeafter{grid-template-columns:1fr}.journey-beforeafter p{font-size:17px}.journey-progress li{font-size:12px;gap:4px}.journey-progress{gap:7px}.journey-photo-note{min-height:180px}.journey-source{display:block;padding:20px}.journey-source .field,.journey-source fieldset{margin-bottom:18px}.journey-source .journey-paper-heading{margin-bottom:16px}.journey-source-kinds .btn{justify-content:center}.journey-outline-paper{grid-template-columns:1fr;gap:10px}.journey-mode .bottom{flex-wrap:wrap;gap:12px}.journey-mode .progress-copy{order:-1;max-width:none;width:100%;text-align:left}.journey-mode .top{align-items:start;flex-direction:column;gap:10px}.journey-mode .header-actions{width:100%;gap:8px}.journey-mode .header-actions .btn{flex:1 1 80px;font-size:12px;min-height:44px}.journey-mode .bottom>.btn{flex:1 1 100px}.journey-method-paper h2{font-size:24px}}
.journey-outline{align-content:start}.journey-outline-paper{padding:16px}.journey-outline textarea{min-height:76px}.journey-memo-scroll{max-height:240px;overflow:auto;padding:3px;scrollbar-gutter:stable}.journey-memo-scroll:focus-visible{outline:3px solid #b84726;outline-offset:3px}
@media(min-width:1001px){.journey-method-paper{padding-block:20px}.journey-method-paper h2{margin-bottom:14px}.journey-beforeafter>div{padding:14px}.journey-beforeafter p{font-size:18px;line-height:1.6;margin-top:8px}.journey-explain{font-size:16px;line-height:1.6;margin:14px 0}.journey-method-paper .journey-question{margin:14px 0;padding:14px 18px}.journey-own{margin-top:10px;padding-top:6px}}
@media(max-width:700px){.journey-memo-scroll{max-height:none;overflow:visible}}
@media(prefers-reduced-motion:reduce){.journey-mode *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{.journey-heading,.journey-methods,.journey-two,.journey-source-grid{display:block}.journey-layout{background:white}.journey-method-tabs{display:none}}