
:root {
  --ink:#27231e; --muted:#665d4f; --subtle:#80745e; --brand:#ffc83d; --brand-dark:#f6b526;
  --brand-light:#fff4c9; --line:#eee4cd; --bg:#fffdf7; --paper:#ffffff;
  --warning:#8a4f00; --warning-bg:#fff4df; --error:#b53a2f;
  --shadow:0 10px 28px rgba(242,173,32,.09); --rad:18px;
  font-synthesis:none;
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 system-ui,-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;letter-spacing:-.3px}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #ffb18a;outline-offset:3px}
button{border:none;background:transparent;color:inherit}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(29px,3vw,41px);line-height:1.3;letter-spacing:-1.6px}
h2{font-size:clamp(22px,2.2vw,29px);line-height:1.43;letter-spacing:-.9px}
h3{font-size:19px;line-height:1.4}
p{line-height:1.78}
.site-header{background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.header-inner{max-width:1200px;margin:auto;min-height:76px;padding:10px 28px;display:flex;gap:25px;align-items:center}
.brand{display:flex;align-items:center;gap:10px;white-space:nowrap;flex-shrink:0;padding:0;text-align:left}
.brand-icon{width:40px;height:40px;border-radius:12px;background:var(--brand);display:grid;place-items:center;color:#fff;font-weight:900;font-size:25px;position:relative;line-height:1}
.brand-dot{position:absolute;width:5px;height:5px;border-radius:50%;background:#e5f4ec;right:7px;top:7px}
.brand-name{font-weight:900;letter-spacing:-1px;font-size:21px;line-height:1.08}
.brand-en{display:block;font-size:10px;letter-spacing:.65px;font-weight:750;color:#9a7c6d;margin-top:5px}
.main-nav{display:flex;align-items:center;gap:2px;margin:auto}
.nav-btn{padding:11px 13px;border-radius:999px;font-weight:700;color:#6b5c52;white-space:nowrap;font-size:14px}
.nav-btn:hover,.nav-btn.active{background:var(--brand-light);color:var(--brand)}
.account-btn{border:1px solid #ffd7c4;background:#fff;color:var(--brand);padding:10px 14px;border-radius:999px;white-space:nowrap;font-weight:800;font-size:13px;box-shadow:0 6px 18px rgba(242,173,32,.09)}
.account-btn:hover{background:var(--brand-light)}
.menu-toggle{display:none;font-size:23px}
.page-container{max-width:1110px;min-height:calc(100vh - 168px);margin:auto;padding:44px 30px 70px}
.footer{border-top:1px solid var(--line);background:#fff;color:#677870}
.footer-inner{max-width:1200px;margin:auto;padding:23px 28px;display:flex;flex-wrap:wrap;gap:9px 20px;font-size:12px}
.footer-link{font-size:12px;text-decoration:underline;color:var(--brand);padding:0}
.kicker{color:var(--brand);font-size:13px;letter-spacing:.2px;font-weight:800;margin-bottom:13px}
.page-heading{margin:0 0 30px}
.page-heading p{color:var(--muted);margin-top:9px;max-width:700px}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:7px;background:#fff;color:var(--ink);border:1px solid #ccd9ce;border-radius:11px;font-weight:780;padding:12px 18px;line-height:1.35;min-height:46px;text-align:center}
.btn:hover{background:#f3f8f4;text-decoration:none}
.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn.primary:hover{background:var(--brand-dark);color:#fff}
.btn.tertiary{border:0;color:var(--brand);padding-left:3px;padding-right:3px;background:transparent}
.btn.secondary{background:var(--brand-light);border-color:#d2e9da;color:var(--brand)}
.btn.small{font-size:13px;min-height:38px;padding:8px 13px}
.btn.full{width:100%}
.btn.wide{min-width:180px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--rad);box-shadow:var(--shadow)}
.hero{background:linear-gradient(135deg,#fff5ef,#fffdfb);border:1px solid #ffe1d2;border-radius:24px;padding:50px 46px;display:grid;grid-template-columns:1fr 260px;gap:24px;align-items:center;box-shadow:0 18px 40px rgba(242,173,32,.09)}
.hero h1{max-width:630px}
.hero h1 strong{color:var(--brand)}
.hero p{max-width:530px;color:#435e50;margin-top:17px;font-size:16px}
.hero-image{width:100%;max-height:255px;object-fit:contain}
.hero-actions{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.section-heading{font-size:20px;margin:32px 0 16px;font-weight:800}
.route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.route-tile{padding:24px;background:#fff;border:1px solid #dfe8e1;border-radius:15px;text-align:left;min-height:175px;display:flex;flex-direction:column;align-items:flex-start;gap:9px;box-shadow:var(--shadow);width:100%}
.route-tile:hover{border-color:#ffb591;background:#fff8f4;transform:translateY(-2px)}
.route-emoji{font-size:26px;line-height:1.15}
.route-tile strong{font-size:18px;letter-spacing:-.4px}
.route-tile span:not(.route-emoji){color:var(--muted);font-size:13px;line-height:1.7}
.route-tile .tile-cta{margin-top:auto;font-weight:800;color:var(--brand)}
.soft-note{margin-top:20px;background:#fff4ee;padding:14px 18px;border-radius:14px;color:#6f5d52;font-size:13px;border:1px solid #ffe0d1}
/* Progress: one task, one focused checklist */
.guide-shell{max-width:800px;margin:0 auto}
.guide-heading{margin-bottom:24px}
.guide-heading .back{padding:0;color:var(--brand);font-weight:700;margin-bottom:14px;font-size:13px}
.guide-heading h1{font-size:31px}
.guide-heading p{color:var(--muted);font-size:14px;margin-top:7px}
.progress-meta{display:flex;justify-content:space-between;align-items:center;color:#3f6655;font-size:13px;font-weight:800;margin-bottom:10px}
.progress-track{height:7px;background:#e0eae3;border-radius:8px;overflow:hidden}
.progress-fill{height:100%;background:var(--brand);border-radius:8px;transition:width .22s}
.step-card{margin-top:23px;padding:32px 34px}
.step-chip{display:inline-flex;background:var(--brand-light);color:var(--brand);font-weight:850;border-radius:7px;padding:5px 11px;font-size:12px}
.step-title{font-size:clamp(24px,2.7vw,32px);letter-spacing:-1.1px;margin-top:16px}
.step-lead{margin-top:12px;color:#3c5548;font-size:17px;font-weight:650}
.step-action{background:#fff4ee;border-left:4px solid var(--brand);border-radius:12px;padding:17px 19px;margin-top:23px;color:#4b3326}
.step-action strong{display:block;font-size:13px;margin-bottom:5px;color:#235a45}
.step-action p{font-size:15px;font-weight:650}
.checklist-section{margin-top:30px}
.checklist-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}
.checklist-heading h3{font-size:19px}
.checklist-count{font-size:13px;color:var(--muted);font-weight:750}
.checklist{display:flex;flex-direction:column;gap:10px}
.check-row{display:flex;align-items:flex-start;gap:14px;padding:17px 16px;min-height:64px;border:1px solid #d7e3da;border-radius:11px;cursor:pointer;background:#fff;color:#263b2f;font-weight:620;line-height:1.6}
.check-row:hover{background:#fff8f4}
.check-row:has(input:checked){background:#fff3ec;border-color:#ffc8ac}
.check-row input{appearance:none;width:22px;height:22px;flex:0 0 22px;border:2px solid #d1a48f;background:#fff;border-radius:7px;margin:2px 0 0;position:relative;cursor:pointer}
.check-row input:checked{background:var(--brand);border-color:var(--brand)}
.check-row input:checked:after{content:'✓';position:absolute;inset:-2px;display:grid;place-items:center;color:white;font-weight:850}
.check-row span{min-width:0}
.step-extras{margin-top:25px;border-top:1px solid #e5ece6;padding-top:17px}
.step-extras details{border-bottom:1px solid #edf0ed;padding:12px 0}
.step-extras summary{cursor:pointer;font-weight:730;color:#3c5044;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px}
.step-extras summary::-webkit-details-marker{display:none}
.step-extras summary::after{content:'＋';font-size:18px;color:var(--brand)}
.step-extras details[open] summary::after{content:'−'}
.detail-body{font-size:14px;color:var(--muted);padding:12px 2px 5px;line-height:1.83}
.info-footnote{font-size:12px;color:var(--subtle);margin-top:16px}
.source-row{margin-top:13px;color:#445e51;font-size:13px;display:flex;align-items:center;flex-wrap:wrap;gap:7px}
.source-row a{font-weight:780;text-decoration:underline}
.guide-controls{margin-top:24px;display:flex;justify-content:space-between;gap:14px}
.guide-controls .btn.primary{min-width:230px}
.guide-controls .btn[disabled]{background:#bdcac0;color:#fff;border-color:#bdcac0}
.step-navigation{border-top:1px solid var(--line);margin-top:23px;padding-top:20px}
.step-navigation details summary{cursor:pointer;color:var(--muted);font-size:13px;font-weight:750}
.step-nav-list{display:flex;flex-direction:column;gap:7px;margin-top:13px}
.step-nav-list button{text-align:left;padding:9px 11px;border-radius:8px;font-size:13px;color:#597166;background:#f4f7f4}
.step-nav-list button.current{color:var(--brand);background:var(--brand-light);font-weight:800}
.step-nav-list button:disabled{opacity:.65}
/* Secondary pages */
.mypage-banner{background:#fff;border:1px solid var(--line);padding:23px 25px;border-radius:15px;margin-bottom:21px}
.mypage-banner h2{font-size:21px}
.mypage-banner p{margin-top:7px;color:var(--muted);font-size:13px}
.project-list,.feed-list{display:grid;gap:13px}
.project-item{padding:22px;display:flex;gap:18px;justify-content:space-between;align-items:center}
.project-item h3{font-size:18px;margin-bottom:5px}
.project-item p{font-size:13px;color:var(--muted)}
.project-item .project-right{text-align:right;min-width:160px}
.project-tag{font-size:12px;font-weight:800;color:var(--brand);background:var(--brand-light);border-radius:8px;padding:4px 8px;display:inline-block;margin-bottom:7px}
.project-bar{height:6px;width:150px;max-width:100%;background:#e7eee7;border-radius:9px;overflow:hidden;margin:8px 0 10px auto}
.project-bar span{display:block;height:100%;background:var(--brand)}
.skeleton-empty{text-align:center;padding:65px 22px;background:#fff;border:1px dashed #cbdcd0;border-radius:16px}
.skeleton-empty h3{margin-bottom:10px}
.skeleton-empty p{color:var(--muted);font-size:14px;margin-bottom:18px}
.story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.story-card{overflow:hidden;padding:0;text-align:left;background:#fff;border:1px solid var(--line);border-radius:15px;width:100%;display:block}
.story-card:hover,.provider-card:hover{border-color:#8cbba0}
.story-card img{width:100%;height:170px;object-fit:cover;display:block;background:#e5eee6}
.story-body{padding:18px}
.story-body strong{display:block;font-size:16px;line-height:1.48;margin:7px 0}
.story-body p{font-size:12px;color:var(--muted)}
.pill{display:inline-block;background:#eff5ef;color:#35664b;font-size:12px;font-weight:800;border-radius:999px;padding:4px 9px}
.inline-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 22px}
.filter-row{display:flex;flex-wrap:wrap;gap:7px}
.filter{border:1px solid #d6e3d9;border-radius:999px;font-size:13px;color:#456455;background:#fff;padding:7px 13px}
.filter.active{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:0 8px 20px rgba(242,173,32,.16)}
.provider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.provider-card{padding:22px}
.provider-card h3{margin:8px 0}
.provider-card p{font-size:13px;color:var(--muted)}
.feed-entry{padding:20px;display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:left;width:100%}
.feed-entry h3{font-size:17px;margin:8px 0 4px}
.feed-entry p{font-size:13px;color:var(--muted)}
/* modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(18,37,26,.54);display:flex;justify-content:center;align-items:center;padding:18px;z-index:60}
.modal{width:min(560px,100%);max-height:90vh;overflow-y:auto;background:#fff;color:var(--ink);border-radius:17px;box-shadow:0 24px 70px rgba(5,22,13,.28);padding:27px}
.modal.wide{width:min(720px,100%)}
.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:22px}
.modal-header h2{font-size:23px}
.close{color:#455b4e;font-size:23px;line-height:1;padding:5px;border-radius:8px}
.close:hover{background:#eef5ef}
.modal-desc{color:var(--muted);font-size:14px;margin-bottom:17px}
.modal-section{display:flex;flex-direction:column;gap:14px}
.modal-section>p{color:var(--muted);font-size:14px}
.choice{display:flex;gap:12px;align-items:center;width:100%;border:1px solid #d7e4d9;background:#fff;border-radius:12px;padding:16px;text-align:left}
.choice:hover{border-color:#87b79b;background:#f6faf7}
.choice strong{font-size:16px;display:block}
.choice small{font-size:12px;color:var(--muted);display:block;margin-top:3px}
.choice-icon{flex:0 0 40px;height:40px;border-radius:10px;display:grid;place-items:center;background:#eaf5ef;color:var(--brand);font-weight:900;font-size:18px}
.field{display:grid;gap:6px}
.field label{font-size:13px;font-weight:800;color:#344f3e}
.input,.select,.textarea{border:1px solid #bfcfc3;border-radius:10px;background:#fff;color:#172824;width:100%;padding:11px 13px;min-height:44px}
.textarea{min-height:120px;resize:vertical}
.form-note{padding:13px 15px;border-radius:9px;color:#5b625a;background:#f1f5f0;font-size:12px;line-height:1.8}
.form-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:6px}
.comment{border-top:1px solid var(--line);margin-top:12px;padding-top:11px;font-size:13px}
.comment small{color:var(--muted)}
.comment p{margin-top:4px}
.story-detail-img{width:100%;height:225px;object-fit:cover;border-radius:12px;margin-bottom:14px;background:#e7efe8}

.login-backdrop{background:rgba(12,10,8,.76);backdrop-filter:blur(6px)}
.login-modal{background:#0f0f10;color:#fff;border-radius:28px;max-width:540px;padding:0;border:1px solid rgba(255,255,255,.06);overflow:hidden}
.login-modal .modal-header{display:none}
.login-shell{padding:26px 24px 28px}
.login-top{display:grid;gap:10px;margin-bottom:18px}
.login-back{justify-self:start;background:transparent;color:#ff7c45;font-weight:900;padding:2px 0}
.login-kicker{display:inline-flex;width:max-content;background:#ff6b2c;color:#fff;padding:7px 12px;border-radius:999px;font-size:12px;font-weight:900}
.login-top h2{font-size:42px;line-height:1.1;color:#fff}
.login-top p{color:#cfc7c2;font-size:14px;line-height:1.7}
.social-login-group{display:grid;gap:12px}
.social-btn{width:100%;min-height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:16px;font-weight:850;border:1px solid transparent}
.social-icon{font-size:20px;line-height:1}
.social-btn.kakao{background:#ffe812;color:#111}
.social-btn.google{background:#181818;color:#fff;border-color:#303030}
.social-btn.naver{background:#03c75a;color:#fff}
.social-btn.apple{background:#0a0a0a;color:#fff;border-color:#333}
.login-divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:#9d948d;font-size:13px}
.login-divider::before,.login-divider::after{content:'';height:1px;flex:1;background:#2e2a26}
.login-form{display:grid;gap:14px}
.login-form .field label{color:#d0cbc8;font-size:13px;font-weight:700}
.login-input{background:#252525;border-color:#2d2d2d;color:#fff;border-radius:14px;min-height:52px}
.login-input::placeholder{color:#8f8f8f}
.login-note{background:#1b1b1c;color:#bdb8b4;border:1px solid #2a2a2c}
.login-submit{min-height:56px;border-radius:15px;font-size:18px;box-shadow:0 10px 25px rgba(242,173,32,.22)}
.login-links{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:4px}
.linkish{color:#d8d2ce;font-size:13px;padding:0}
.divider-line{width:1px;height:12px;background:#3a3531}

.toast{background:#2b211c;color:#fff;padding:13px 17px;border-radius:14px;position:fixed;right:24px;bottom:24px;z-index:90;max-width:min(420px,calc(100vw - 48px));box-shadow:0 10px 35px #15271a33;transform:translateY(12px);opacity:0;pointer-events:none;transition:.18s;font-size:13px}
.toast.show{transform:translateY(0);opacity:1}
.flag{display:inline-block;color:var(--warning);background:var(--warning-bg);padding:7px 11px;border-radius:7px;font-size:12px;font-weight:800}
@media(max-width:870px){
 .header-inner{gap:10px;padding:12px 20px;flex-wrap:wrap;min-height:69px}
 .menu-toggle{display:block;margin-left:auto}
 .main-nav{order:4;width:100%;display:none;margin:0;flex-direction:column;align-items:stretch;border-top:1px solid var(--line);padding-top:10px}
 .main-nav.open{display:flex}
 .nav-btn{text-align:left;width:100%}
 .header-account{margin-left:5px}
 .account-btn{font-size:12px;padding:9px 11px}
 .page-container{padding:30px 20px 55px}
 .hero{grid-template-columns:1fr 175px;padding:35px 30px}
 .route-grid{grid-template-columns:1fr 1fr}
 .story-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
 .header-inner{padding:11px 16px}
 .brand-icon{height:36px;width:36px;font-size:22px}
 .brand-name{font-size:18px}
 .brand-en{font-size:9px}
 .account-btn{font-size:11px;padding:7px 8px;min-height:38px}
 .page-container{padding:25px 16px 45px}
 .hero{grid-template-columns:1fr;padding:30px 24px}
 .hero-image{display:none}
 .hero p{font-size:14px}
 .route-grid,.story-grid,.provider-grid{grid-template-columns:1fr}
 .route-tile{min-height:145px;padding:20px}
 .step-card{padding:25px 20px}
 .guide-heading h1{font-size:25px}
 .check-row{padding:15px 12px}
 .guide-controls{flex-direction:column-reverse}
 .guide-controls .btn{width:100%}
 .project-item{flex-direction:column;align-items:stretch}
 .project-item .project-right{text-align:left}
 .project-bar{margin:8px 0 10px}
 .modal{padding:21px}
 .form-actions .btn{flex:1 1 auto}
 .footer-inner{padding:20px 16px}
}


/* 독립큐 v4 — 노란빛이 강한 망고/허니 오렌지 테마 */
a,.footer-link,.kicker,.step-chip,.project-tag,.choice-icon,.tile-cta,.account-btn,
.guide-heading .back,.btn.tertiary,.btn.secondary{color:#8c5600}
.brand-icon{background:#ffc83d;color:#30220c;box-shadow:0 5px 14px rgba(247,177,20,.19)}
.brand-dot{background:#fff9dc}
.brand-en{color:#9b7b3d}
.nav-btn:hover,.nav-btn.active{background:#fff3c5;color:#704600}
.account-btn{color:#704600;border-color:#eed6a2;background:#fffdf7}
.account-btn:hover{background:#fff6d7}
.btn{border-color:#e8dcc3}
.btn:hover{background:#fff7df}
.btn.primary{background:#ffc83d;color:#30220c;border-color:#ffc83d;box-shadow:0 8px 20px rgba(240,171,29,.16)}
.btn.primary:hover{background:#f6b526;color:#30220c;border-color:#f6b526}
.btn.secondary{background:#fff5d0;border-color:#f0dfaa}
.hero{background:linear-gradient(110deg,#fff4c7 0%,#fff9e8 60%,#ffffff 100%);border-color:#f6dfaa;box-shadow:0 14px 32px rgba(203,150,31,.07)}
.hero h1 strong{color:#955e00}
.hero p{color:#594c39}
.route-tile{border-color:#eee5d2;transition:transform .15s,border-color .15s,background .15s}
.route-tile:hover{border-color:#e9c66b;background:#fffdf4}
.route-tile .tile-cta{color:#805000}
.soft-note{background:#fff8e2;border-color:#f4e3ba;color:#6a5d42}
.progress-meta{color:#6b5630}
.progress-track,.project-bar{background:#f4ecd7}
.step-chip,.project-tag{background:#fff2c0;color:#805000}
.step-lead{color:#504435}
.step-action{background:#fff8e5;border-left-color:#edb127;color:#473821}
.step-action strong{color:#8d5900}
.check-row{border-color:#eadfc5;color:#383022}
.check-row:hover{background:#fffcf2}
.check-row:has(input:checked){background:#fff8dc;border-color:#efd27e}
.check-row input{border-color:#cbb780}
.check-row input:checked{background:#ffc83d;border-color:#dba62e}
.check-row input:checked:after{color:#332609}
.step-extras summary{color:#504638}
.source-row{color:#60533d}
.guide-controls .btn[disabled]{background:#e8e4d9;color:#7d766c;border-color:#e8e4d9}
.step-nav-list button{background:#fcf7e8;color:#776344}
.step-nav-list button.current{color:#7d5100}
.story-card:hover,.provider-card:hover{border-color:#eac671}
.pill{background:#fff5ce;color:#79520b}
.filter{border-color:#e8daba;color:#71604b}
.filter.active{color:#322300;background:#ffc83d;border-color:#ffc83d}
.modal-backdrop{background:rgba(39,29,14,.48)}
.choice{border-color:#eadfc5}
.choice:hover{border-color:#eac86f;background:#fffaf0}
.choice-icon{background:#fff2ca;color:#8f5f06}
.close:hover{background:#fff7e1}
.field label{color:#51412e}
.input,.select,.textarea{border-color:#d9ccb0;color:#2b251f}
.form-note{background:#fff8e7;color:#615742}
.toast{background:#30271b}
.login-backdrop{background:rgba(17,15,10,.76)}
.login-back{color:#ffd159}
.login-kicker{background:#ffc83d;color:#30220c}
.login-note{background:#1b1b1c;color:#bdb8b4;border-color:#2a2a2c}
.login-input{background:#252525;border-color:#383431;color:#fff}
.login-submit{color:#30220c!important}
:focus-visible{outline-color:#e3ad3b}

/* 체크리스트 도움말: 가시성을 우선하고 초기 화면은 간결하게 유지합니다. */
.check-item{border:1px solid #eadfd1;border-radius:14px;background:#fff;overflow:hidden;transition:border-color .16s}
.check-item:has(input:checked){border-color:#e7c15f;background:#fffaf0}
.check-item .check-row{border:0;border-radius:0;margin:0;min-height:60px;background:transparent}
.check-item:has(input:checked) .check-row{background:transparent;border:0}
.check-item .howto-link{display:flex;align-items:center;gap:7px;min-height:37px;width:100%;padding:2px 18px 12px 52px;color:#805100;font-size:13px;font-weight:800;text-align:left}
.check-item .howto-link:hover{text-decoration:underline;color:#654000}
.howto-link .howto-arrow{margin-left:2px;font-size:17px}
/* v7 — 한 화면에 담기는 간결한 체크리스트 도움말 */
.howto-modal{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:20px 24px;overflow:auto;border-radius:22px}
.howto-modal .modal-header{margin-bottom:9px;align-items:center}
.howto-modal .modal-header h2{font-size:19px}
.howto-modal .close{font-size:23px}
.howto-page{display:grid;gap:11px}
.howto-task-label{font-size:11px;color:#926200;font-weight:850}
.howto-task-title{font-size:21px;line-height:1.35;letter-spacing:-.6px;overflow-wrap:anywhere;margin:0}
.howto-top{display:grid;gap:7px}
.howto-action{background:#fff9ed;border:1px solid #f0dcae;border-radius:14px;padding:12px 14px;display:grid;gap:10px}
.howto-action-head{display:flex;gap:10px;align-items:flex-start}
.howto-action-icon{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;background:#ffe49c;border-radius:9px;font-size:17px}
.howto-action-head strong{display:block;font-size:13px;color:#493016;margin-bottom:2px}
.howto-action-head p{margin:0;font-size:13px;line-height:1.55;color:#5c4d3e}
.howto-action a{color:#925a00;font-weight:900;text-decoration:underline;text-underline-offset:3px}
.howto-mini-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.howto-mini-step{background:#fff;border:1px solid #f0e3cc;border-radius:11px;padding:9px 10px;display:flex;gap:7px;align-items:flex-start}
.howto-mini-num{display:grid;place-items:center;flex:0 0 21px;width:21px;height:21px;border-radius:50%;background:#ffe4a0;color:#543a08;font-weight:900;font-size:11px}
.howto-mini-step p{font-size:12px;line-height:1.48;color:#463d32;margin:0}
.howto-visual{display:grid;gap:7px}
.howto-visual h4{font-size:13px;margin:0;color:#2d2519;display:flex;align-items:center;gap:6px}
.howto-visual small{font-size:11px;color:#827260;font-weight:500}
.howto-diagram{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:7px}
.howto-diagram-cell{border:1px solid #ecdcb9;background:#fffefb;padding:9px 10px;border-radius:10px;display:grid;gap:3px;min-width:0}
.howto-diagram-cell .dicon{font-size:14px;line-height:1.3}
.howto-diagram-cell strong{font-size:12px;color:#6f4a10;line-height:1.3}
.howto-diagram-cell span{font-size:11px;color:#50463b;line-height:1.45;overflow-wrap:anywhere}
.howto-caution{display:flex;align-items:flex-start;gap:8px;background:#fff8e8;border:1px solid #f2dfb2;border-radius:10px;padding:9px 11px}
.howto-caution strong{font-size:12px;color:#875200;white-space:nowrap}
.howto-caution p{font-size:12px;color:#52473c;line-height:1.5;margin:0}
.howto-disclaimer{color:#777064;font-size:10.5px;line-height:1.45}
.howto-return{min-height:43px;padding:10px 16px;border-radius:11px;font-size:14px}
@media(max-width:640px){.howto-modal{width:calc(100vw - 20px);padding:16px;max-height:calc(100dvh - 20px)}.howto-page{gap:10px}.howto-task-title{font-size:18px}.howto-mini-steps{grid-template-columns:1fr}.howto-diagram{grid-template-columns:repeat(2,minmax(0,1fr))}.howto-caution{display:grid;gap:3px}.check-item .howto-link{padding-left:48px}}
@media(max-height:650px) and (min-width:641px){.howto-modal{padding:14px 20px}.howto-page{gap:8px}.howto-action{padding:9px 11px;gap:7px}.howto-mini-step{padding:6px 8px}.howto-diagram-cell{padding:6px 8px}.howto-modal .modal-header{margin-bottom:6px}}


/* v8: 한 줄 체크리스트 + 스크롤 없는 데스크톱 단계 화면 */
.page-container:has(.compact-step){padding-top:13px;padding-bottom:12px;min-height:0}
body:has(.compact-step) .footer{display:none}
.compact-step{max-width:1000px;width:100%}
.compact-step .guide-heading{margin:0 0 8px}
.compact-step .guide-topline{display:flex;align-items:center;gap:13px;min-height:32px;margin-bottom:7px;font-size:12px;color:#6e604d}
.compact-step .guide-heading .back{margin:0;font-weight:800;color:#845400;white-space:nowrap}
.compact-step .guide-route-name{border-left:1px solid #e8d8b9;padding-left:13px;font-weight:700}
.compact-step .guide-step-counter{margin-left:auto;font-weight:850;color:#815600;white-space:nowrap}
.compact-step .progress-track{height:5px;background:#f4e9ce}
.compact-step .step-card{margin-top:11px;padding:20px 24px 14px}
.compact-step .step-top{display:flex;gap:14px;align-items:center;justify-content:space-between}
.compact-step .step-title-wrap{display:flex;align-items:center;gap:12px;min-width:0}
.compact-step .step-chip{flex-shrink:0;padding:4px 9px;font-size:11px}
.compact-step .step-title{font-size:clamp(19px,2.2vw,24px);margin:0;letter-spacing:-.7px;line-height:1.4}
.compact-step .step-lead{margin:0;font-size:12px;line-height:1.45;color:#796b58;text-align:right;max-width:330px;flex:0 1 38%}
.compact-step .step-action{margin-top:13px;padding:10px 14px;display:flex;align-items:center;gap:15px;border-radius:10px}
.compact-step .step-action strong{font-size:12px;color:#855400;margin:0;flex:0 0 auto;white-space:nowrap}
.compact-step .step-action p{font-size:13px;line-height:1.5;color:#50412d;flex:1}
.compact-step .checklist-section{margin-top:16px}
.compact-step .checklist-heading{margin-bottom:9px}
.compact-step .checklist-heading h2{font-size:17px;letter-spacing:-.4px}
.compact-step .checklist{gap:8px}
.compact-step .check-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border:1px solid #eadfc9;border-radius:12px;min-height:61px;overflow:hidden}
.compact-step .check-item .check-row{padding:11px 15px;min-height:59px;display:flex;align-items:center;gap:12px;flex:1 1 auto;font-size:14px;line-height:1.5;color:#312b24;min-width:0}
.compact-step .check-item .check-row input{flex:0 0 21px;width:21px;height:21px;margin:0;border-radius:6px}
.compact-step .check-item .check-row span{overflow-wrap:break-word}
.compact-step .check-item .howto-link{padding:0 15px;margin:9px 9px 9px 0;min-height:39px;width:175px;max-width:100%;justify-content:center;align-self:center;gap:6px;text-align:center;white-space:nowrap;border:1px solid #f1d78e;border-radius:9px;background:#fff9e9;color:#805100;font-size:12px;font-weight:850;transition:background .15s}
.compact-step .check-item .howto-link:hover{background:#fff0c7;text-decoration:none}
.compact-step .check-item .howto-link:focus-visible{outline-offset:1px}
.compact-step .howto-link .howto-arrow{margin-left:0;font-size:16px}
.compact-step .howto-short{display:none}
.compact-step .guide-controls{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.compact-step .guide-controls .btn{min-height:43px;padding:9px 16px}
.compact-step .guide-controls .btn.primary{min-width:210px}
.compact-step .step-extras{margin-top:15px;border-top:1px solid #f0e7d6;padding-top:11px;display:grid;grid-template-columns:1fr 1fr;gap:9px}
.compact-step .step-extras details{border:1px solid #f0e7d6;background:#fffbf4;border-radius:9px;padding:7px 11px;min-width:0}
.compact-step .step-extras summary{font-size:12px;line-height:1.4;color:#776044}
.compact-step .step-extras summary::after{font-size:13px}
.compact-step .step-extras .detail-body{padding:10px 0 0;font-size:12px;line-height:1.55}
.compact-step .step-evidence{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 13px;margin-top:10px;font-size:11px;line-height:1.4;color:#756c5a}
.compact-step .step-evidence a{color:#805100;font-weight:800;text-decoration:underline;text-underline-offset:2px}
.compact-step .step-navigation{margin-top:9px;padding:7px 0 0;border-top:1px solid #f4eddf}
.compact-step .step-navigation details summary{font-size:11px;color:#80745d;line-height:1.4}
.compact-step .step-nav-list{margin-top:9px}
@media(max-width:700px){
  .page-container:has(.compact-step){padding:13px 14px 10px}
  .compact-step .step-card{padding:16px 13px}
  .compact-step .step-top{display:block}
  .compact-step .step-title-wrap{align-items:start;gap:9px}
  .compact-step .step-lead{margin-top:5px;text-align:left;max-width:none}
  .compact-step .step-action{display:block;padding:10px 12px}
  .compact-step .step-action p{margin-top:3px}
  .compact-step .check-item .check-row{padding:11px 9px;gap:8px;font-size:13px;line-height:1.5;min-height:61px}
  .compact-step .check-item .howto-link{width:99px;margin:7px 7px 7px 0;padding:6px 5px;font-size:11px;min-height:39px;gap:3px}
  .compact-step .howto-long{display:none}
  .compact-step .howto-short{display:inline}
  .compact-step .step-extras{grid-template-columns:1fr}
  .compact-step .guide-controls{flex-direction:row}
  .compact-step .guide-controls .btn{width:auto;flex:1;min-width:0;font-size:12px;padding:8px 8px}
  .compact-step .guide-controls .btn.primary{min-width:0;flex:1.4}
  .compact-step .guide-route-name{font-size:11px}
}
@media(max-width:390px){
  .compact-step .step-title{font-size:19px}
  .compact-step .check-item .howto-link{width:86px}
  .compact-step .howto-link .howto-arrow{display:none}
}
@media(max-height:760px) and (min-width:701px){
  .compact-step .step-card{padding-top:15px;padding-bottom:10px}
  .compact-step .check-item{min-height:55px}
  .compact-step .check-item .check-row{min-height:53px;padding-top:8px;padding-bottom:8px}
  .compact-step .checklist-section{margin-top:12px}
  .compact-step .step-extras{margin-top:10px;padding-top:8px}
  .compact-step .guide-controls{margin-top:10px}
  .compact-step .step-action{margin-top:10px}
  .compact-step .step-evidence{margin-top:7px}
  .compact-step .step-navigation{margin-top:6px;padding-top:5px}
}

.howto-action a{font-weight:850;color:#875300;text-decoration:underline;text-underline-offset:3px}
.howto-action .link-hint{font-size:11px;color:#6b5a45}

/* 실제 서비스 상태 및 실제 계정 로그인 */
.service-status{max-width:1080px;margin:0 auto 16px;padding:13px 18px;border:1px solid #f0d190;background:#fff5d5;border-radius:12px;font-size:13px;color:#5f4709}
.login-form{display:grid;gap:13px}.login-form .field label{font-weight:750}
.oauth-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:4px 0 10px}
.oauth-btn{min-height:47px;border:1px solid #dfd5c6;border-radius:12px;font-weight:800;background:#fff;color:#282119}
.oauth-btn:disabled{background:#f2f0ed;color:#99918a;border-color:#e6e3dd;opacity:1}
.oauth-btn.kakao:not(:disabled){background:#ffeb00;border-color:#ffeb00;color:#16130e}
.oauth-btn.naver:not(:disabled){background:#03c75a;border-color:#03c75a;color:#fff}
.oauth-btn.google:not(:disabled){background:#fff;border-color:#ddd;color:#333}
.login-hint{font-size:12px;color:#655d53;line-height:1.7}
.login-tabs{display:flex;gap:8px;margin-bottom:17px}
.login-tabs button{border:1px solid #e9dfca;border-radius:999px;padding:9px 17px;font-weight:800}
.login-tabs button.active{background:#ffe9a4;border-color:#efc963}
.story-thumb{width:100%;height:170px;display:grid;place-items:center;background:#fff4cf;font-size:57px}
.story-thumb img{width:100%;height:100%;object-fit:cover}
.report-link{font-size:12px;text-decoration:underline;color:#6f5841}
@media(max-width:560px){.oauth-grid{grid-template-columns:1fr 1fr}}

/* 독립 이야기 상세 화면: 사진과 내용을 완전히 분리하여 모든 사진에서 가독성 확보 */
.story-card .story-thumb{overflow:hidden;min-height:0}
.story-card .story-thumb img{display:block;width:100%;height:100%;object-fit:cover;min-height:0}
.story-detail-modal{background:#fff;max-width:900px}
.story-detail{display:flex;flex-direction:column;gap:14px;min-width:0}
.story-detail-photo{display:flex;justify-content:center;align-items:center;position:relative;width:100%;height:clamp(290px,46vh,470px);overflow:hidden;border-radius:14px;background:#f8f5ef;border:1px solid #eee6d5;padding:0;cursor:zoom-in}
.story-detail-photo img{display:block;width:100%;height:100%;max-height:100%;max-width:100%;object-fit:contain;min-height:0;min-width:0}
.story-photo-zoom-label{position:absolute;right:13px;bottom:13px;border-radius:999px;background:rgba(28,24,18,.89);color:#fff;padding:9px 14px;font-size:13px;font-weight:800;box-shadow:0 2px 14px rgba(0,0,0,.2)}
.story-detail-photo:hover .story-photo-zoom-label{background:#1f1c17}
.story-detail-photo:focus-visible{outline:3px solid #e2a400;outline-offset:3px}
.story-detail-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:5px;background:#fff;border:1px solid #efe7d9;border-radius:14px;padding:20px 22px;color:#25211b}
.story-detail-content .pill{color:#7c5300;background:#fff1c7}
.story-detail-title{font-size:clamp(21px,2vw,27px);line-height:1.4;letter-spacing:-.7px;color:#24201b;margin:5px 0 1px;overflow-wrap:anywhere}
.story-detail-author{color:#756c60;font-size:13px}
.story-detail-body{width:100%;margin-top:10px;color:#312b24;font-size:15px;line-height:1.8;overflow-wrap:anywhere;word-break:break-word}
.story-detail-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;width:100%;margin-top:15px;padding-top:13px;border-top:1px solid #f0e7d8}
.story-detail-actions .report-link{color:#635548;padding:8px}
.story-detail-comments{background:#fff;border:1px solid #efe7d9;border-radius:14px;padding:19px 22px;color:#27231e;min-width:0}
.story-detail-comments h3{font-size:18px;margin-bottom:12px}
.story-detail-comment{padding:12px 0;border-top:1px solid #f1ede5}
.story-detail-comment small{color:#777064;font-size:12px}
.story-detail-comment p{color:#2f2a25;font-size:14px;margin:4px 0 8px;overflow-wrap:anywhere}
.story-detail-comment .report-link{color:#766a5d}
.story-detail-no-comments{font-size:13px;color:#817566;margin:5px 0 13px}
.story-detail-comment-form{display:grid;grid-template-columns:1fr auto;gap:9px;margin-top:15px;padding-top:15px;border-top:1px solid #f1ede5}
.story-detail-comment-form label{grid-column:1/-1;font-size:13px;font-weight:800;color:#3e352d}
.story-detail-comment-form .input{min-width:0}
.story-detail-comment-form .btn.primary{color:#2b2109;min-height:44px}
@media(max-width:560px){
 .story-detail-modal{padding:15px}
 .story-detail{gap:10px}
 .story-detail-photo{height:clamp(220px,38vh,360px);border-radius:12px}
 .story-detail-content,.story-detail-comments{padding:15px 16px;border-radius:12px}
 .story-detail-body{font-size:14px}
 .story-detail-comment-form{grid-template-columns:1fr}
 .story-detail-comment-form .btn{width:100%}
}


/* 독립 이야기: 현대적인 사진 선택 버튼과 안전한 제한 안내 */
.story-photo-picker{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fffaf0;border:1px dashed #e4bf62;border-radius:14px;padding:14px}
.story-photo-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip-path:inset(50%)}
.story-photo-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border-radius:11px;padding:11px 16px;min-height:45px;background:#ffc83d;color:#2c2318;font-size:14px;font-weight:850;white-space:nowrap}
.story-photo-button:hover{background:#f6b526}
.story-photo-input:focus-visible+.story-photo-button{outline:3px solid #d69200;outline-offset:3px}
.story-photo-button span{font-size:20px;font-weight:500;line-height:1}
.story-photo-fileinfo{display:grid;gap:2px;min-width:0;flex:1}
.story-photo-filename{font-size:13px;overflow-wrap:anywhere;color:#3b3329}
.story-photo-size{font-size:12px;color:#756b5e}
.story-photo-policy,.story-photo-privacy{font-size:12px;color:#776b5c;margin:0;line-height:1.65}
.story-photo-privacy{color:#74511c}

/* 저장된 사진 확대 보기: 다른 사진/본문을 가리지 않는 별도 전체화면 레이어 */
#photo-viewer-root{position:fixed;inset:0;z-index:150}
.photo-viewer-backdrop{position:absolute;inset:0;background:rgba(14,13,12,.94);display:flex;align-items:center;justify-content:center;padding:12px}
.photo-viewer{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:0}
.photo-viewer-toolbar{width:100%;max-width:1500px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:5px 0 15px;color:#fff;font-size:14px;font-weight:850}
.photo-viewer-toolbar small{font-weight:500;color:#c9c4bb;font-size:12px;margin-left:10px}
.photo-viewer-close{border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:9px 14px;background:#fff;color:#28221c;font-weight:800;white-space:nowrap}
.photo-viewer-close:hover{background:#ffe4aa}
.photo-viewer img{display:block;max-width:min(1500px,100%);max-height:calc(100dvh - 94px);width:auto;height:auto;object-fit:contain;box-shadow:0 8px 45px rgba(0,0,0,.24)}
@media(max-width:560px){
 .story-photo-picker{align-items:stretch;gap:10px}
 .story-photo-button{width:100%}
 .story-photo-fileinfo{width:100%}
 .story-photo-zoom-label{font-size:12px;padding:8px 11px}
 .photo-viewer-toolbar small{display:block;margin-left:0}
}

/* 독립큐 커뮤니티: 댓글 답글, 작성자/관리자 삭제, 마이페이지 내 댓글 */
.text-danger{color:#a53f28;background:transparent;border:0;font-weight:750;font-size:13px;padding:5px 8px;min-height:34px;cursor:pointer;border-radius:8px}
.text-danger:hover{background:#fff0eb;text-decoration:underline}
.btn-danger{background:#bc442b!important;border:1px solid #bc442b!important;color:#fff!important}
.btn-danger:hover{background:#92331f!important}
.provider-action-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:10px}
.comment-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px}
.small-action{background:transparent;color:#8a5700;font-size:13px;font-weight:800;padding:5px 8px;border:0;border-radius:8px;cursor:pointer}
.small-action:hover{background:#fff3d6}
.thread-group{padding:8px 0;border-bottom:1px solid #f0e4d4}
.thread-comment{padding:12px 14px;border-radius:12px;background:#fff;color:#2c271f;overflow-wrap:anywhere}
.thread-comment-head{display:flex;align-items:center;gap:8px;font-size:13px;color:#574334}
.thread-comment p{margin-top:5px;white-space:normal;font-size:14px;line-height:1.65}
.thread-reply{margin:6px 0 4px 26px;background:#fff8eb;border-left:3px solid #f8c853}
.reply-label{font-size:11px;color:#8b6b35;background:#fff1c8;padding:2px 7px;border-radius:999px}
.thread-comment-deleted{background:#f6f4f0;color:#79746c}
.thread-comment-deleted p{font-style:italic;color:#77716a}
.comment-target{outline:3px solid #f4ba38;outline-offset:2px;background:#fff3d9}
.my-comments-section{margin-top:32px}
.my-comment-list{display:grid;gap:10px;margin-top:12px}
.my-comment-card{background:#fff;border:1px solid #eadbc7;border-radius:16px;padding:17px 19px;display:grid;gap:8px;box-shadow:0 4px 16px #88631f0b}
.my-comment-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#806c56;font-size:12px}
.my-comment-card strong{font-size:15px;color:#342719;overflow-wrap:anywhere}
.my-comment-card p{font-size:14px;color:#675b4e;overflow-wrap:anywhere;line-height:1.6}
.my-comment-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:3px}
.removed-post-note{color:#9d5849;font-size:12px}
.my-comments-empty{color:#827366;background:#fff8e8;border-radius:12px;padding:15px 17px;font-size:13px}
@media(max-width:600px){.thread-reply{margin-left:13px}.my-comment-card{padding:15px}.comment-actions{gap:6px}}

/* v3: 프로필, 마이페이지 활동 기록 접기/더보기, 업체 사진 */
.profile-banner{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:22px 24px}
.profile-banner-info{flex:1;min-width:200px}
.profile-banner h2{font-size:21px;color:#30261d}
.profile-banner-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:12px}
.avatar-mini,.avatar-main,.avatar-preview{display:inline-grid;place-items:center;flex:0 0 auto;object-fit:cover;border-radius:50%;background:#ffebaa;border:1px solid #eed996;color:#705016;font-weight:900;vertical-align:middle}
.avatar-mini{width:27px;height:27px;font-size:13px}
.avatar-main{width:76px;height:76px;font-size:30px}
.avatar-preview{width:66px;height:66px;font-size:27px}
.avatar-default{font-family:system-ui,sans-serif}
.story-author-line{display:flex;align-items:center;gap:8px;min-height:28px}
.profile-edit-head{display:flex;align-items:center;gap:15px;background:#fff9e9;border:1px solid #f2e3c1;border-radius:14px;padding:12px}
.profile-edit-head strong{display:block;font-size:15px;color:#30261d}
.profile-edit-head .form-note{margin-top:4px}
.profile-remove{font-size:13px;color:#7b4a2b;display:flex;align-items:center;gap:8px;cursor:pointer}
.profile-remove input{width:17px;height:17px;accent-color:#d59808}
.thread-comment-head .avatar-mini{width:24px;height:24px}
.my-helps-section{margin-top:32px}
.my-help-card{background:#fff;border:1px solid #eadbc7;border-radius:16px;padding:16px 19px;display:grid;gap:10px;box-shadow:0 4px 16px #88631f0b}
.my-help-card strong{overflow-wrap:anywhere;color:#342719;font-size:15px}
.my-help-status{font-size:12px;color:#8a5d25;background:#fff8e8;padding:3px 8px;border-radius:99px}
.history-more,.history-collapse{margin-top:13px;margin-right:8px}
.history-count{font-size:12px;color:#877566}
.history-collapse{border-color:#e7dbca;color:#7d6550}
.provider-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px 0 15px}
.provider-photo{display:block;aspect-ratio:4/3;min-width:0;border-radius:9px;overflow:hidden;border:1px solid #e7d8b5;background:#fff7e5;cursor:zoom-in;padding:0}
.provider-photo:first-child:last-child{grid-column:1/-1;aspect-ratio:16/9}
.provider-photo img{display:block;width:100%;height:100%;object-fit:cover}
.provider-photo:hover{outline:2px solid #e3b136}
.provider-pending-note{background:#fff7e3;border-radius:9px;padding:8px 10px;margin:10px 0;color:#785525!important;font-size:12px!important}
@media(max-width:600px){.profile-banner{padding:17px;gap:13px}.avatar-main{width:61px;height:61px}.my-help-card{padding:15px}.provider-photo-grid{gap:5px}}

/* 독립큐 커뮤니티 개선: 왼쪽 마이페이지, 회원 공개 프로필, 공간공유 편집기 */
.mypage-layout{display:grid;grid-template-columns:235px minmax(0,1fr);gap:22px;align-items:start}
.mypage-sidebar{background:#fff;border:1px solid #e9ddc6;border-radius:20px;padding:18px;position:sticky;top:95px;box-shadow:0 8px 22px #8c68130c}
.sidebar-member{display:flex;align-items:center;gap:12px;min-width:0;padding:0 3px 15px;border-bottom:1px solid #efe6d6}
.sidebar-member-info{min-width:0;flex:1}.sidebar-member-info strong{display:block;font-size:13px;overflow-wrap:anywhere;line-height:1.5}.sidebar-member-info small{font-size:11px;color:#8c806d}
.avatar-button{border:0;padding:0;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:50%;cursor:zoom-in}.avatar-button:disabled{cursor:default;opacity:1}
.mypage-sidebar nav{display:grid;gap:4px;margin:16px 0}
.mypage-nav-item{display:flex;align-items:center;gap:12px;border-radius:10px;text-align:left;padding:12px 13px;color:#675848;font-weight:730;font-size:13px;width:100%}
.mypage-nav-item span{width:18px;text-align:center;font-size:16px}.mypage-nav-item:hover{background:#fff6e0}.mypage-nav-item.active{background:#ffe7a1;color:#4a3210}
.sidebar-account-actions{display:flex;gap:7px;flex-wrap:wrap;padding-top:14px;border-top:1px solid #efe6d6}.sidebar-account-actions .btn{flex:1;padding:8px 9px;font-size:12px}
.mypage-main{min-width:0;background:#fff;border:1px solid #e9ddc6;border-radius:20px;padding:22px 24px;min-height:380px}
.mypage-main .section-heading{margin:0 0 12px;font-size:19px}.mypage-main .my-comments-section,.mypage-main .my-helps-section{margin:0}
.mypage-main .project-item{min-width:0}.mypage-main .project-list{margin-top:16px}
.my-following-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.following-card{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #eee1cb;border-radius:12px;padding:12px;background:#fff;min-width:0}
.following-card strong{overflow-wrap:anywhere;font-size:13px;flex:1;min-width:0}.following-card span:last-child{font-size:11px;color:#8a6b27}
.profile-editor{display:flex;align-items:center;flex-direction:column;gap:10px;background:#fffaf0;border:1px solid #f2dfb5;border-radius:17px;padding:19px}
.profile-editor-photo{position:relative;width:130px;height:130px}.avatar-editor{width:130px;height:130px;font-size:56px}
.profile-editor-zoom{width:130px;height:130px;border:0;padding:0;border-radius:50%;overflow:hidden;cursor:zoom-in}.profile-editor-zoom:disabled{cursor:default;opacity:1}
.profile-camera{position:absolute;bottom:1px;right:0;width:37px;height:37px;background:#ffcb44;border:3px solid #fff;border-radius:50%;display:grid;place-items:center;cursor:pointer;font-size:16px}
.profile-editor .form-note{padding:0;background:transparent;text-align:center;max-width:100%;overflow-wrap:anywhere}
.profile-editor-buttons{display:flex;gap:9px;align-items:center;flex-wrap:wrap;justify-content:center}.profile-editor-buttons label{cursor:pointer}
.profile-delete-btn{border-color:#f0cfc6;color:#ac4435}.profile-remove-status{font-size:12px;color:#875b27;text-align:center}
.member-link{display:inline;padding:2px 0;font-size:inherit;font-weight:750;cursor:pointer;text-align:left;color:#625141;overflow-wrap:anywhere}.member-link:hover{text-decoration:underline;color:#a46f00}
.story-card-open{padding:0;width:100%;display:block;text-align:left}.story-card-open:hover .story-body strong{text-decoration:underline}
.story-card-member{display:flex;align-items:center;gap:7px;padding:0 17px 15px;color:#71695f;font-size:12px}
.member-public-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px;align-items:start}
.member-public-sidebar{display:flex;align-items:center;flex-direction:column;gap:18px;padding:25px 20px;background:#fff;border:1px solid #eee0c4;border-radius:18px;text-align:center}
.member-public-sidebar h2{font-size:20px;overflow-wrap:anywhere}.avatar-public{width:110px;height:110px;font-size:44px}
.member-stats{display:flex;width:100%;justify-content:center;gap:25px}.member-stats span{display:grid;font-size:12px;color:#7b7266}.member-stats strong{font-size:20px;color:#3d3127}
.member-public-posts{min-width:0}.member-public-posts .section-heading{margin:0 0 12px}
.member-post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.member-post-tile{border-radius:14px;text-align:left;display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid #eee0c4;overflow:hidden;padding:0 0 14px;min-width:0}
.member-post-tile strong{font-size:14px;padding:0 12px;overflow-wrap:anywhere}.member-post-tile .pill{margin:0 12px;align-self:flex-start}.member-post-tile:hover{border-color:#d5a92a}
.member-post-image{aspect-ratio:4/3;background:#fff0c7;display:grid;place-items:center;font-size:32px;overflow:hidden;width:100%}.member-post-image img{width:100%;height:100%;object-fit:cover}
.story-space-help{font-size:13px;color:#635744}.story-space-fields[hidden],.story-standard-fields[hidden]{display:none!important}
.story-blocks{display:grid;gap:11px}.story-block{border:1px solid #e5d5b6;background:#fffdf8;border-radius:14px;padding:13px;display:grid;gap:10px;min-width:0}
.story-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.story-block-head strong{font-size:13px;color:#5b4a34}
.story-block-head>div{display:flex;gap:5px}.story-block-tool{width:32px;height:32px;display:grid;place-items:center;border:1px solid #e9dabc;background:#fff;border-radius:8px;font-weight:750}.story-block-tool:hover{background:#ffedd0}
/* 공간공유 선택 사진을 게시 전 바로 확인할 수 있는 미리보기 */
.space-image-preview[hidden]{display:none!important}
.space-image-preview{display:grid;gap:7px;max-width:100%;min-width:0;padding:8px;background:#f7f2e8;border:1px solid #e8d9bb;border-radius:12px}
.space-image-preview-img{display:block;max-width:100%;width:100%;max-height:360px;height:auto;object-fit:contain;border-radius:8px}
.space-image-preview-note{text-align:center;font-size:12px;color:#685f52}
.story-block .textarea{min-height:100px}.space-image-file{font-size:12px;color:#8b765f;overflow-wrap:anywhere}
.story-block-actions{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}
.space-article-text{white-space:normal;margin:0 0 18px;line-height:1.85;overflow-wrap:anywhere}.space-article-image{width:100%;padding:0;margin:4px 0 20px;background:#f9f5ea;border:1px solid #efe4cf;border-radius:12px;overflow:hidden;cursor:zoom-in;display:block}
.space-article-image img{display:block;width:100%;height:auto;max-height:560px;object-fit:contain}
.saved-active{background:#ffefba!important;border-color:#e9c36d!important;color:#785311!important}
@media(max-width:820px){.mypage-layout{grid-template-columns:190px minmax(0,1fr);gap:12px}.mypage-sidebar{padding:10px}.mypage-main{padding:16px}.member-public-layout{grid-template-columns:210px minmax(0,1fr);gap:12px}}
@media(max-width:620px){.mypage-layout,.member-public-layout{grid-template-columns:1fr}.mypage-sidebar{position:static}.mypage-sidebar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}.mypage-nav-item{padding:9px;font-size:12px}.sidebar-account-actions{justify-content:flex-start}.member-public-sidebar{padding:18px;gap:10px}.my-following-list{grid-template-columns:1fr}.member-post-grid{gap:9px}.member-post-tile strong{font-size:12px}.mypage-main{min-height:200px}}
.help-feed-card{padding:0;overflow:hidden}.help-feed-card .feed-entry{box-shadow:none;min-height:85px}.help-feed-card .feed-entry:hover{background:#fffaf0}.help-feed-member{padding:0 20px 14px;font-size:12px;color:#796f60}

/* 독립 이야기 피드 수정: 작성자 한 줄, 이미지, 통계, 제목 순서 */
.story-feed-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.story-feed-card{display:flex;flex-direction:column;min-width:0;width:100%;padding:17px;background:#fff;border-radius:18px;overflow:hidden}
.story-card-header{display:flex;align-items:center;gap:10px;width:100%;min-width:0;margin:0 0 13px}
.story-feed-avatar{flex:0 0 42px;width:42px;height:42px;padding:0;border:0;background:none;border-radius:50%;cursor:pointer;overflow:hidden}
.story-feed-avatar .avatar-mini{width:42px;height:42px;font-size:18px;display:grid;place-items:center}
.story-card-identity{flex:1 1 0;min-width:0;max-width:100%;overflow:hidden}
.story-card-person-line{display:flex;align-items:baseline;gap:4px;min-width:0;width:100%;max-width:100%;white-space:nowrap}
.story-card-person-line .member-link{display:block;flex:0 1 auto;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;font-size:14px;font-weight:800;color:#28231c}
.story-card-follow{flex:0 0 auto;color:#139cf1;font-size:13px;font-weight:700;white-space:nowrap;padding:0;line-height:1.3}
.story-card-excerpt{color:#81786a;display:block;max-width:100%;font-size:12px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:3px 0 0}
.story-card-image{display:grid;place-items:center;position:relative;width:100%;aspect-ratio:1/1;min-width:0;min-height:0;padding:0;border:0;border-radius:12px;overflow:hidden;background:#fff7df;font-size:44px;cursor:pointer}
.story-card-image img{display:block;width:100%;height:100%;object-fit:cover;min-width:0;min-height:0}
.story-card-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:center;margin:12px 0 8px}
.story-stat{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:35px;padding:5px 3px;color:#3a322b;cursor:pointer;font-size:13px;white-space:nowrap}
.story-stat svg{width:21px;height:21px;flex:0 0 21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.story-stat.is-active{color:#d4860d}
.story-stat.is-active svg{fill:#fff1c9}
.story-stat span{font-variant-numeric:tabular-nums}
.story-card-title{display:block;text-align:left;width:100%;min-width:0;padding:5px 1px 2px;background:transparent;border:0;color:#28221c;cursor:pointer;line-height:1.5;overflow-wrap:anywhere}
.story-card-title strong{font-size:15px;font-weight:800}
.story-card-title:hover strong{text-decoration:underline}
.story-edited{font-weight:500;color:#8c8274;font-size:.84em;white-space:nowrap}
.story-detail-title .story-edited{font-size:.7em;font-weight:500}
.story-edit-original-photo{display:grid;justify-items:start;gap:9px;margin:9px 0;padding:12px;border:1px solid #efe0bf;border-radius:12px;background:#fffaf1}
.story-edit-original-photo img{display:block;max-width:min(100%,290px);max-height:230px;object-fit:contain;border-radius:9px}
@media(max-width:680px){.story-feed-grid{grid-template-columns:1fr;gap:15px}.story-feed-card{padding:15px}.story-card-image{aspect-ratio:1/1}.story-card-header{gap:9px}}
@media(min-width:681px) and (max-width:960px){.story-feed-grid{gap:13px}.story-feed-card{padding:13px}}


/* v3: 독립 이야기 카드 약 1/4 면적. 목록을 작게, 상세 열람은 읽기 편한 크기로 유지. */
.story-feed-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start}
.story-feed-card{padding:11px;border-radius:13px}
.story-card-header{gap:7px;margin-bottom:8px;min-height:31px}
.story-feed-avatar{flex-basis:31px;width:31px;height:31px}
.story-feed-avatar .avatar-mini{width:31px;height:31px;font-size:13px}
.story-card-person-line .member-link{font-size:12px;min-width:0}
.story-card-follow{font-size:11px;letter-spacing:-.5px}
.story-card-image{border-radius:9px;aspect-ratio:1/1;font-size:28px}
.story-card-stats{margin:6px 0 4px;gap:2px}
.story-stat{font-size:11px;gap:3px;min-height:28px;padding:3px 0}
.story-stat svg{width:16px;height:16px;flex-basis:16px}
.story-card-title{padding:3px 0 0;line-height:1.35}
.story-card-title strong{font-size:13px}
.story-card-excerpt{margin:4px 0 0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;max-width:100%;white-space:normal;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;word-break:break-word;font-size:11px;line-height:1.45;color:#80776b}
@media(max-width:960px){.story-feed-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(max-width:680px){.story-feed-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.story-feed-card{padding:9px;border-radius:12px}.story-card-header{gap:6px;margin-bottom:6px}.story-card-person-line .member-link{font-size:11px}.story-card-follow{font-size:10px}.story-stat{font-size:10px;gap:2px;min-height:26px}.story-stat svg{width:15px;height:15px;flex-basis:15px}.story-card-title strong{font-size:12px}.story-card-excerpt{font-size:10px}}
@media(max-width:360px){.story-feed-grid{gap:8px}.story-feed-card{padding:7px}.story-feed-avatar,.story-feed-avatar .avatar-mini{width:27px;height:27px;flex-basis:27px}.story-card-person-line .member-link{font-size:10px}.story-card-follow{font-size:9px}.story-stat{font-size:9px;gap:1px}.story-stat svg{width:13px;height:13px;flex-basis:13px}}


/* v4: 회원명은 한 줄 말줄임, 팔로우 버튼은 항상 오른쪽 끝에 고정 */
.story-card-identity{min-width:0;flex:1 1 0;overflow:hidden}
.story-card-person-line{display:flex;align-items:center;justify-content:space-between;gap:5px;width:100%;min-width:0;white-space:nowrap}
.story-card-person-line .member-link{flex:1 1 auto;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
.story-card-follow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin-left:auto;padding:4px 6px;border-radius:7px;background:#eef7ff;color:#077ac7;font-weight:800;white-space:nowrap;line-height:1.35;cursor:pointer}
.story-card-follow:hover{background:#dcefff;color:#006eab}
.story-detail-author-follow{display:flex;align-items:center;justify-content:space-between;gap:9px;min-width:0}
.story-detail-author-name{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 auto;overflow:hidden}
.story-detail-author-name .member-link{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal}
.story-detail-author-follow .story-card-follow{font-size:12px;padding:6px 10px}
@media(max-width:680px){.story-card-person-line{gap:3px}.story-card-follow{font-size:10px;letter-spacing:-.3px;padding:4px 5px}}
@media(max-width:360px){.story-card-follow{font-size:9px;padding:3px 4px}}

/* v5: 사용자 신고·팔로우·회원별 작은 카드·화면 버전 선택 */
.story-card-person-line{align-items:center!important;width:100%;min-width:0}
.story-card-person-line .member-link{flex:1 1 auto;min-width:0;max-width:calc(100% - 70px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.story-card-follow{flex:0 0 auto!important;margin-left:auto;min-width:fit-content;max-width:85px}
.story-card-photo-wrap{position:relative;min-width:0}
.story-card-report{position:absolute;top:7px;right:7px;background:rgba(255,255,255,.9);border:1px solid #e9e0cc;box-shadow:0 1px 8px #00000019;border-radius:7px;padding:4px 8px;font-size:10px;font-weight:800;color:#655b50;z-index:1}
.story-card-report:hover{background:#fff3d2;color:#815003}
.story-toolbar-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.moderation-hide-choice{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.5}
.moderation-hide-choice input{width:18px;height:18px;flex:none;accent-color:#e7a515}
.member-public-sidebar h2{max-width:100%;overflow-wrap:anywhere}
.member-category-filters{margin-bottom:15px}
.member-category-filters .filter{font-size:12px;padding:7px 12px;white-space:nowrap}
.member-category-filters .filter span{color:inherit;opacity:.76;font-variant-numeric:tabular-nums}
.member-category-section{margin:16px 0 24px}
.member-category-heading{font-size:16px;margin:0 0 10px;font-weight:800;color:#453321}
.member-category-heading span{font-size:13px;color:#927f60;font-weight:600}
.member-post-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.member-post-tile{gap:5px;padding:0 0 9px;border-radius:11px}
.member-post-image{aspect-ratio:1/1;font-size:23px}
.member-post-tile strong{font-size:11px;line-height:1.4;margin:0;padding:0 8px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere;word-break:break-word}
.member-hidden-reset{font-size:12px;text-decoration:underline;color:#88640b;margin-top:8px}
.footer-display-mode{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.footer-display-mode>span{font-weight:700;color:#615340;margin-right:3px}
.footer-display-mode button{border:1px solid #e2d6bd;border-radius:999px;padding:5px 12px;background:#fff;font-size:12px;min-height:32px;color:#776d5d;white-space:nowrap}
.footer-display-mode button.active{background:#ffc83d;border-color:#e8b128;color:#30230f;font-weight:850}
@media(max-width:960px){.member-post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){.member-post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.member-category-filters .filter{font-size:11px;padding:6px 10px}.story-card-report{font-size:9px;top:5px;right:5px;padding:3px 5px}.footer-display-mode{width:100%;margin-left:0}}

/* 데스크톱에서 모바일 미리보기 모드: 페이지 폭뿐 아니라 주요 배치도 모바일 2열 구조로 전환 */
body.view-force-mobile{width:min(100%,430px);margin:0 auto;min-height:100vh;box-shadow:0 0 0 1px #efe2c9}
body.view-force-mobile .header-inner{padding:11px 16px;flex-wrap:wrap;gap:9px}
body.view-force-mobile .menu-toggle{display:block;margin-left:auto}
body.view-force-mobile .main-nav{order:4;width:100%;display:none;margin:0;flex-direction:column;align-items:stretch;border-top:1px solid var(--line);padding-top:10px}
body.view-force-mobile .main-nav.open{display:flex}
body.view-force-mobile .nav-btn{text-align:left;width:100%}
body.view-force-mobile .header-account{margin-left:5px}
body.view-force-mobile .account-btn{font-size:11px;padding:7px 8px}
body.view-force-mobile .page-container{padding:25px 16px 45px}
body.view-force-mobile .hero{grid-template-columns:1fr;padding:30px 24px}
body.view-force-mobile .hero-image{display:none}
body.view-force-mobile .route-grid,body.view-force-mobile .provider-grid{grid-template-columns:1fr}
body.view-force-mobile .story-feed-grid,body.view-force-mobile .member-post-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body.view-force-mobile .story-feed-card{padding:9px;border-radius:12px}
body.view-force-mobile .story-card-header{gap:6px;margin-bottom:6px}
body.view-force-mobile .story-card-person-line .member-link{font-size:11px}
body.view-force-mobile .story-card-follow{font-size:10px}
body.view-force-mobile .story-stat{font-size:10px;gap:2px;min-height:26px}
body.view-force-mobile .story-stat svg{width:15px;height:15px;flex-basis:15px}
body.view-force-mobile .story-card-title strong{font-size:12px}
body.view-force-mobile .story-card-excerpt{font-size:10px}
body.view-force-mobile .mypage-layout,body.view-force-mobile .member-public-layout{grid-template-columns:1fr}
body.view-force-mobile .mypage-sidebar{position:static}
body.view-force-mobile .mypage-sidebar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
body.view-force-mobile .member-public-sidebar{padding:18px;gap:10px}
body.view-force-mobile .footer-inner{padding:20px 16px}
body.view-force-mobile .footer-display-mode{width:100%;margin-left:0}
body.view-force-mobile .page-heading h1{font-size:26px}
body.view-force-mobile .footer{display:block}


/* 휴대전화에서 PC 보기 시 PC 1200px 레이아웃을 화면 폭에 맞춰 축소(CSS zoom) */
body.physical-mobile.view-force-desktop{width:1200px;max-width:none;margin:0;overflow-x:hidden}
body.physical-mobile.view-force-desktop .header-inner{max-width:1200px;padding:10px 28px;gap:25px;flex-wrap:nowrap;min-height:76px}
body.physical-mobile.view-force-desktop .menu-toggle{display:none}
body.physical-mobile.view-force-desktop .main-nav{display:flex!important;position:static;order:initial;width:auto;margin:auto;flex-direction:row;align-items:center;border:0;padding:0}
body.physical-mobile.view-force-desktop .nav-btn{text-align:center;width:auto}
body.physical-mobile.view-force-desktop .account-btn{font-size:13px;padding:10px 14px}
body.physical-mobile.view-force-desktop .page-container{max-width:1110px;padding:44px 30px 70px}
body.physical-mobile.view-force-desktop .hero{grid-template-columns:1fr 260px;padding:50px 46px}
body.physical-mobile.view-force-desktop .hero-image{display:block}
body.physical-mobile.view-force-desktop .route-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
body.physical-mobile.view-force-desktop .provider-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
body.physical-mobile.view-force-desktop .story-feed-grid,body.physical-mobile.view-force-desktop .member-post-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
body.physical-mobile.view-force-desktop .story-feed-card{padding:11px}
body.physical-mobile.view-force-desktop .story-card-header{gap:7px;margin-bottom:8px}
body.physical-mobile.view-force-desktop .story-card-person-line .member-link{font-size:12px}
body.physical-mobile.view-force-desktop .story-card-follow{font-size:11px}
body.physical-mobile.view-force-desktop .story-stat{font-size:11px;min-height:28px}
body.physical-mobile.view-force-desktop .story-card-title strong{font-size:13px}
body.physical-mobile.view-force-desktop .story-card-excerpt{font-size:11px}
body.physical-mobile.view-force-desktop .mypage-layout{grid-template-columns:225px minmax(0,1fr)}
body.physical-mobile.view-force-desktop .member-public-layout{grid-template-columns:260px minmax(0,1fr)}
body.physical-mobile.view-force-desktop .mypage-sidebar nav{display:flex;flex-direction:column}
body.physical-mobile.view-force-desktop .footer-inner{padding:23px 28px}
body.physical-mobile.view-force-desktop .footer-display-mode{width:auto;margin-left:auto}
body.physical-mobile.view-force-desktop .footer{display:block}


/* 독립큐 v6: 모바일 가독성과 모든 주요 메뉴의 상시 노출 */
.nav-icon,.nav-caption-mobile,.nav-home{display:none}
.compact-site-nav .site-header{background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid #ecdcbf}
.compact-site-nav .header-inner{
 display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
 gap:0 8px;min-height:0;padding:9px 14px 0;max-width:100%;
}
.compact-site-nav .brand{grid-column:1;grid-row:1;min-width:0;gap:9px;justify-self:start}
.compact-site-nav .brand-icon{height:35px;width:35px;border-radius:10px;font-size:22px}
.compact-site-nav .brand-name{font-size:18px;line-height:1.05;letter-spacing:-.7px}
.compact-site-nav .brand-en{font-size:8px;margin-top:3px;letter-spacing:.4px}
.compact-site-nav .header-account{grid-column:2;grid-row:1;margin:0;min-width:0;justify-self:end}
.compact-site-nav .account-btn{font-size:12px;padding:8px 10px;min-height:37px;border-radius:10px;box-shadow:none}
.compact-site-nav .menu-toggle{display:none!important}
.compact-site-nav .main-nav,
.compact-site-nav .main-nav.open{
 display:grid!important;grid-column:1/-1;grid-row:2;order:initial;
 grid-template-columns:repeat(5,minmax(0,1fr));width:100%;min-width:0;
 position:static;margin:9px 0 0;padding:0;border:0;
 flex-direction:initial;align-items:stretch;gap:0;
}
.compact-site-nav .nav-home{display:flex}
.compact-site-nav .nav-btn{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 width:auto;min-width:0;min-height:62px;padding:8px 2px 7px;
 border-radius:0;border-bottom:3px solid transparent;
 color:#75634b;background:transparent;font-size:11px;
 font-weight:680;line-height:1.22;letter-spacing:-.4px;text-align:center;white-space:normal;
}
.compact-site-nav .nav-btn:hover{background:#fff9ec}
.compact-site-nav .nav-btn.active{
 background:linear-gradient(0deg,#fff6da 0%,#fffdf7 74%);
 color:#77500a;border-bottom-color:#ffbe2f;
}
.compact-site-nav .nav-icon{display:block;width:20px;height:20px;flex:0 0 20px;margin:0 0 5px}
.compact-site-nav .nav-caption-desktop{display:none}
.compact-site-nav .nav-caption-mobile{display:block;font-size:11px;white-space:nowrap;text-align:center}
.compact-site-nav .page-container{padding:23px 15px 48px}
.compact-site-nav .page-heading{margin-bottom:22px;text-align:left}
.compact-site-nav .page-heading h1{font-size:25px;line-height:1.3;letter-spacing:-.9px;overflow-wrap:break-word}
.compact-site-nav .page-heading p:not(.kicker){font-size:14px;line-height:1.65;margin-top:7px}
.compact-site-nav .page-heading .kicker{font-size:12px;margin-bottom:6px}
.compact-site-nav .section-heading{font-size:19px;line-height:1.38;margin:25px 0 13px;letter-spacing:-.5px}
.compact-site-nav .inline-toolbar{align-items:stretch;gap:12px;margin-bottom:17px}
.compact-site-nav .filter-row{gap:7px;min-width:0;align-items:center}
.compact-site-nav .filter{min-height:36px;font-size:12.5px;line-height:1.2;padding:8px 11px;white-space:nowrap}
.compact-site-nav .story-toolbar-actions{width:100%;justify-content:flex-start}
.compact-site-nav .story-toolbar-actions .btn{min-height:40px;font-size:13px}
.compact-site-nav .story-feed-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.compact-site-nav .story-feed-card{padding:10px;border-radius:13px}
.compact-site-nav .story-card-header{gap:6px;margin-bottom:8px}
.compact-site-nav .story-card-person-line .member-link{font-size:12px;letter-spacing:-.4px}
.compact-site-nav .story-card-follow{font-size:10.5px;padding:4px 5px}
.compact-site-nav .story-card-title strong{font-size:13.5px;line-height:1.4;letter-spacing:-.3px}
.compact-site-nav .story-card-excerpt{font-size:11.5px;line-height:1.5;margin-top:5px}
.compact-site-nav .story-stat{font-size:11px;min-height:30px;gap:4px}
.compact-site-nav .story-stat svg{width:16px;height:16px;flex-basis:16px}
.compact-site-nav .story-card-stats{gap:1px;margin:8px 0 6px}
.compact-site-nav .route-tile{padding:18px;min-height:135px;gap:7px}
.compact-site-nav .route-tile strong{font-size:16px}
.compact-site-nav .route-tile span:not(.route-emoji){font-size:13px;line-height:1.5}
.compact-site-nav .mypage-nav-item{font-size:13px;line-height:1.4}
.compact-site-nav .member-category-filters .filter{font-size:12px;padding:7px 10px}
.compact-site-nav .member-post-tile strong{font-size:12px;line-height:1.5}
.compact-site-nav .footer-inner{padding:20px 15px}
.compact-site-nav .footer-display-mode{width:100%;margin-left:0}
@media(max-width:355px){
 .compact-site-nav .header-inner{padding-left:10px;padding-right:10px}
 .compact-site-nav .nav-caption-mobile{font-size:10px}
 .compact-site-nav .nav-icon{width:18px;height:18px}
 .compact-site-nav .page-container{padding-left:11px;padding-right:11px}
 .compact-site-nav .story-feed-grid{gap:8px}
 .compact-site-nav .story-feed-card{padding:8px}
 .compact-site-nav .story-card-person-line .member-link{font-size:11px}
 .compact-site-nav .story-card-follow{font-size:9.5px}
 .compact-site-nav .story-stat{font-size:10px;gap:2px}
 .compact-site-nav .story-stat svg{width:14px;height:14px;flex-basis:14px}
}


/* 독립큐 v7 — youthful editorial refresh. Existing interaction and PC/phone mode stay intact. */
:root{
 --ink:#202323; --muted:#5e6461; --subtle:#7c827d;
 --bg:#f9faf8; --paper:#ffffff; --line:#e8ebe5;
 --brand:#ffca34; --brand-dark:#efb721; --brand-light:#fff5d5;
 --shadow:0 7px 24px rgba(39,42,33,.045); --rad:17px;
}
body{background:var(--bg);color:var(--ink);letter-spacing:-.35px}
h1,h2,h3{letter-spacing:-.044em;word-break:keep-all;overflow-wrap:break-word}
.site-header{background:rgba(255,255,255,.965);border-bottom:1px solid #eceeea;box-shadow:0 2px 18px rgba(22,27,21,.025)}
.header-inner{min-height:69px;gap:16px;padding:9px 27px}
.brand{gap:10px}
.brand-icon{width:39px;height:39px;border-radius:13px;background:linear-gradient(145deg,#ffd953,#ffbc23);color:#262a24;box-shadow:0 4px 11px rgba(214,150,28,.13)}
.brand-name{font-size:21px;font-weight:900;letter-spacing:-1.1px}
.brand-en{font-size:9px;letter-spacing:1.1px;color:#8b8274;margin-top:3px}
.main-nav{gap:4px}
.nav-btn{padding:10px 14px;border-radius:11px;color:#60665f;font-weight:750;font-size:13px;transition:background .14s,color .14s;letter-spacing:-.03em}
.nav-btn:hover{color:#232520;background:#f7f8f3}
.nav-btn.active{color:#242719;background:#fff1c1}
.account-btn{background:#fff;border:1px solid #e9e3d6;border-radius:11px;padding:9px 15px;color:#3b4039;font-size:12px;box-shadow:none;min-height:39px}
.account-btn:hover{background:#fff5db;color:#29281e}
.page-container{padding-top:35px}
.kicker{font-weight:850;letter-spacing:0;color:#8b610b}
.btn{border-radius:12px;border-color:#e1e5de;transition:transform .15s,background .15s,border-color .15s}
.btn.primary{border-color:#ffca34;background:#ffca34;color:#262720;box-shadow:0 6px 18px rgba(242,183,44,.18)}
.btn.primary:hover{border-color:#f4bc27;background:#f4bc27;color:#262720;transform:translateY(-1px)}
.card{border-color:#e8ebe5;box-shadow:0 5px 24px rgba(25,33,25,.035)}
.hero{
 position:relative;isolation:isolate;overflow:hidden;
 grid-template-columns:minmax(0,1fr) 240px;gap:22px;min-height:320px;
 padding:38px 43px;border:1px solid #f0dea3;border-radius:27px;
 background:radial-gradient(circle at 95% 2%,rgba(255,255,255,.95) 0 11%,transparent 35%),
   linear-gradient(115deg,#fff0b4 0%,#fff7da 52%,#fffdf4 100%);
 box-shadow:0 9px 32px rgba(110,94,33,.065);
}
.hero::before{content:'';position:absolute;width:360px;height:360px;right:-108px;top:-185px;border-radius:50%;background:radial-gradient(circle,#ffe28b,rgba(255,255,255,.04) 72%);z-index:-1;pointer-events:none}
.hero-copy{min-width:0;position:relative;z-index:1}
.hero .kicker{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:12.5px;color:#75510a;font-weight:850}
.hero-kicker-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#242821;box-shadow:0 0 0 4px rgba(255,255,255,.65)}
.hero h1{max-width:none;font-size:clamp(32px,3.7vw,47px);line-height:1.18;font-weight:900;letter-spacing:-.064em;word-break:keep-all}
.hero h1 span,.hero h1 strong{display:block;white-space:nowrap}
.hero h1 strong{color:#976600;font-weight:900}
.hero p:not(.kicker){max-width:560px;font-size:15px;color:#59503d;line-height:1.6;margin-top:16px;word-break:keep-all}
.hero-actions{gap:9px;margin-top:25px}
.hero-actions .btn{min-height:44px;padding:11px 20px;font-size:14px;font-weight:850}
.hero-actions .btn.primary{min-width:0}
.hero-image{width:100%;max-height:244px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(115,80,22,.09))}
.section-heading{margin:30px 0 15px;font-size:21px;font-weight:870;letter-spacing:-.05em}
.route-grid{gap:13px}
.route-tile{padding:23px;min-height:162px;border:1px solid #e8ebe4;background:#fff;border-radius:18px;box-shadow:0 5px 22px rgba(34,40,31,.035);gap:8px}
.route-tile:hover{background:#fffdf7;border-color:#ebcf77;box-shadow:0 10px 26px rgba(43,38,22,.07)}
.route-tile strong{font-size:18px;letter-spacing:-.045em}
.route-tile span:not(.route-emoji){line-height:1.55}
.route-tile .tile-cta{font-size:12px;font-weight:850}
.soft-note{border-radius:13px;color:#72664e;background:#fffaf0;border-color:#f4e6c6}
.page-heading h1{font-weight:880;line-height:1.23}
.page-heading p{line-height:1.6}
.filter{border-radius:999px}
.story-feed-card{border-radius:15px;box-shadow:0 4px 14px rgba(29,34,27,.035)}

/* Compact nav: a low-profile text-only tab bar, all five menus visible without a hamburger. */
body.compact-site-nav .site-header{background:rgba(255,255,255,.98);border-bottom:1px solid #ecece7;box-shadow:0 3px 14px rgba(25,30,19,.025)}
body.compact-site-nav .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px;padding:7px 14px 0;min-height:0}
body.compact-site-nav .brand{grid-column:1;grid-row:1;gap:8px}
body.compact-site-nav .brand-icon{width:33px;height:33px;border-radius:11px;font-size:21px}
body.compact-site-nav .brand-name{font-size:18px;line-height:1;letter-spacing:-.85px}
body.compact-site-nav .brand-en{font-size:8px;margin-top:3px;letter-spacing:.65px}
body.compact-site-nav .header-account{grid-column:2;grid-row:1;margin:0}
body.compact-site-nav .account-btn{font-size:11px;min-height:33px;border-radius:10px;padding:6px 10px;box-shadow:none}
body.compact-site-nav .main-nav,body.compact-site-nav .main-nav.open{
 display:grid!important;grid-column:1/-1;grid-row:2;position:static;
 grid-template-columns:repeat(5,minmax(0,1fr));gap:0;width:100%;min-width:0;
 margin:5px 0 0;padding:0;border:0;align-items:stretch;overflow:visible;
}
body.compact-site-nav .nav-btn{min-height:41px;display:flex;align-items:center;justify-content:center;flex-direction:row;
 width:auto;min-width:0;padding:8px 2px 9px;white-space:nowrap;letter-spacing:-.04em;
 border-radius:0;border-bottom:2px solid transparent;background:transparent!important;color:#6f746d;
 font-size:clamp(10px,2.9vw,12px);font-weight:700;line-height:1.2;}
body.compact-site-nav .nav-btn:hover{color:#242720}
body.compact-site-nav .nav-btn.active{color:#1b211c;border-bottom-color:#f3b815;font-weight:850}
body.compact-site-nav .nav-icon{display:none!important}
body.compact-site-nav .nav-caption-desktop{display:none!important}
body.compact-site-nav .nav-caption-mobile{display:block;font-size:inherit;white-space:nowrap;letter-spacing:inherit;line-height:inherit}
body.compact-site-nav .page-container{padding:18px 14px 42px}
body.compact-site-nav .page-heading{margin-bottom:20px}
body.compact-site-nav .page-heading h1{font-size:clamp(22px,6vw,28px);line-height:1.25}
body.compact-site-nav .page-heading p:not(.kicker){font-size:13px;line-height:1.55;margin-top:7px}
body.compact-site-nav .section-heading{font-size:18px;line-height:1.3;margin:24px 0 12px}
body.compact-site-nav .hero{
 min-height:0;grid-template-columns:minmax(0,1fr);padding:25px 20px 24px;
 gap:0;border-radius:21px;box-shadow:0 8px 23px rgba(113,97,32,.04);
}
body.compact-site-nav .hero::before{width:250px;height:250px;top:-125px;right:-140px}
body.compact-site-nav .hero .kicker{font-size:11px;margin-bottom:12px;gap:7px}
body.compact-site-nav .hero-kicker-dot{width:6px;height:6px;flex-basis:6px;box-shadow:0 0 0 3px rgba(255,255,255,.6)}
body.compact-site-nav .hero h1{font-size:clamp(27px,7.4vw,34px);line-height:1.22;letter-spacing:-.06em;max-width:100%}
body.compact-site-nav .hero h1 span,body.compact-site-nav .hero h1 strong{white-space:nowrap}
body.compact-site-nav .hero p:not(.kicker){font-size:13px;line-height:1.55;margin-top:13px;letter-spacing:-.035em}
body.compact-site-nav .hero-image{display:none}
body.compact-site-nav .hero-actions{margin-top:19px;gap:8px;flex-direction:row;align-items:center}
body.compact-site-nav .hero-actions .btn{min-height:42px;padding:11px 14px;font-size:13px;width:auto}
body.compact-site-nav .route-grid{grid-template-columns:1fr 1fr;gap:10px}
body.compact-site-nav .route-tile{min-height:0;padding:16px 14px;border-radius:15px;gap:5px}
body.compact-site-nav .route-emoji{font-size:24px}
body.compact-site-nav .route-tile strong{font-size:14px}
body.compact-site-nav .route-tile span:not(.route-emoji){font-size:11px;line-height:1.5}
body.compact-site-nav .route-tile .tile-cta{font-size:11px}
body.compact-site-nav .soft-note{font-size:12px;padding:11px 13px;margin-top:14px;line-height:1.55}
body.compact-site-nav .story-card-excerpt{font-size:11px}
body.compact-site-nav .footer-inner{padding:17px 14px}
@media(max-width:355px){
 body.compact-site-nav .header-inner{padding:7px 10px 0}
 body.compact-site-nav .page-container{padding:15px 10px 35px}
 body.compact-site-nav .hero{padding:22px 16px}
 body.compact-site-nav .hero h1{font-size:clamp(25px,7.3vw,28px)}
 body.compact-site-nav .hero p:not(.kicker){font-size:12px}
 body.compact-site-nav .nav-btn{font-size:10px}
 body.compact-site-nav .route-grid{gap:8px}
 body.compact-site-nav .route-tile{padding:13px 11px}
}
/* Maintain desktop layout when user requests PC view on an actual phone. */
body.physical-mobile.view-force-desktop .header-inner{min-height:69px;padding:9px 27px;gap:16px}
body.physical-mobile.view-force-desktop .page-container{padding:35px 30px 65px}
body.physical-mobile.view-force-desktop .hero{grid-template-columns:minmax(0,1fr) 240px;padding:38px 43px}

/* v7 final: mobile cards occupy one tight row per choice, rather than large stacks. */
body.compact-site-nav .route-grid{grid-template-columns:1fr;gap:9px}
body.compact-site-nav .route-tile{
 display:grid;grid-template-columns:34px minmax(0,1fr) 21px;
 grid-template-rows:auto auto;column-gap:10px;row-gap:2px;
 min-height:72px;padding:12px 14px;align-items:center;
}
body.compact-site-nav .route-tile .route-emoji{grid-column:1;grid-row:1/3;font-size:24px;line-height:1}
body.compact-site-nav .route-tile strong{grid-column:2;grid-row:1;font-size:14px;line-height:1.25}
body.compact-site-nav .route-tile>span:nth-of-type(2){grid-column:2;grid-row:2;font-size:11px;line-height:1.4;color:#787b73}
body.compact-site-nav .route-tile .tile-cta{grid-column:3;grid-row:1/3;align-self:center;justify-self:center;font-size:0;color:#3c3e33}
body.compact-site-nav .route-tile .tile-cta:after{content:'→';font-size:18px;line-height:1}
/* More-specific selector prevents older mobile caption rules from making this CTA vertical. */
body.compact-site-nav .route-tile span.tile-cta:not(.route-emoji){font-size:0!important;line-height:0!important;white-space:nowrap;overflow:hidden;width:21px;min-width:21px;margin:0}
body.compact-site-nav .route-tile span.tile-cta:not(.route-emoji)::after{content:'→';display:block;font-size:19px;line-height:1.2}

/* v8: 진행 과정: 카테고리 아이콘, 3개 상한, 안전한 삭제, 반응형 목록 */
.project-toolbar{margin-bottom:15px}
.project-total{font-size:13px;color:#8a6f3d;font-weight:700;margin-left:5px}
.project-limit-note{margin:6px 0 0;color:#776e60;font-size:12px;line-height:1.5}
.project-groups{display:grid;gap:17px;margin-top:15px}
.project-category{background:#fffdf8;border:1px solid #eee1c6;border-radius:17px;padding:17px 16px;min-width:0}
.project-category-header{display:flex;align-items:center;gap:11px;min-width:0;margin-bottom:12px}
.project-route-icon{width:44px;height:44px;min-width:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#99610a;background:#fff0b4}
.project-route-icon svg{width:25px;height:25px;display:block}
.project-route-move{color:#317064;background:#e3f5f0}
.project-route-office{color:#5e5aaa;background:#eeeafb}
.project-category-label{min-width:0;flex:1}
.project-category-label h3{font-size:16px;line-height:1.25;letter-spacing:-.03em;margin:0;color:#322d24}
.project-category-label span{color:#847b6c;font-size:12px}
.project-category-header .project-add{font-size:12px;min-height:34px;flex:0 0 auto;padding:7px 10px}
.project-category-header .project-add:disabled{opacity:.45;cursor:not-allowed}
.project-category .project-list{margin:0;gap:9px}
.project-category .project-item{border:1px solid #eee9df;border-radius:12px;padding:13px 14px;box-shadow:none;background:white;align-items:center;gap:12px}
.project-item-main{flex:1;min-width:0}
.project-item-main h4{font-size:14px;letter-spacing:-.03em;line-height:1.45;margin:2px 0 5px;overflow-wrap:anywhere}
.project-item-main p{font-size:11px;line-height:1.5;color:#888073}
.project-item-main .project-tag{font-size:10px;padding:3px 7px;margin-bottom:3px}
.project-complete{font-size:11px;color:#267a52;background:#e2f4e9;border-radius:5px;padding:2px 5px;white-space:nowrap}
.project-category .project-right{min-width:130px;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.project-category .project-right strong{font-size:12px;color:#6d5d47}
.project-category .project-bar{height:6px;margin:0;width:130px}
.project-category .project-actions{display:flex;align-items:center;gap:9px}
.project-category .project-actions .btn{padding:7px 9px;font-size:11px;min-height:31px}
.project-delete{padding:7px 5px;color:#ab5351;font-size:11px;font-weight:750;white-space:nowrap}
.project-delete:hover{text-decoration:underline;color:#8f2525}
.project-empty{font-size:12px;line-height:1.5;padding:13px 11px;background:#f9f7f1;border-radius:9px;color:#857866}
@media(max-width:700px){
 .project-category{padding:13px 11px;border-radius:13px}
 .project-route-icon{width:38px;height:38px;min-width:38px;border-radius:10px}
 .project-route-icon svg{width:22px;height:22px}
 .project-category-label h3{font-size:14px}
 .project-category-header{gap:8px}
 .project-category .project-item{display:flex;flex-direction:column;align-items:stretch;gap:10px}
 .project-category .project-right{align-items:stretch;min-width:0;gap:8px}
 .project-category .project-bar{width:100%}
 .project-category .project-actions{justify-content:space-between}
}
body.view-force-mobile .project-category .project-item{flex-direction:column;align-items:stretch}
body.view-force-mobile .project-category .project-right{align-items:stretch;min-width:0}
body.view-force-mobile .project-category .project-bar{width:100%}
body.view-force-mobile .project-category .project-actions{justify-content:space-between}


/* v9: 홈 준비 선택과 중복되는 안내 메뉴 제거 후 주요 메뉴 4개로 정리 */
body.compact-site-nav .main-nav,
body.compact-site-nav .main-nav.open { grid-template-columns:repeat(4,minmax(0,1fr)); }

/* v9: 나의 진행 과정 — 카테고리마다 아이콘 + 이름 + 색상으로 구별 */
.project-category{--route-ink:#98621c;--route-tint:#fff4d6;--route-outline:#f0d79b;--route-strong:#bd851e}
.project-category-first{--route-ink:#98621c;--route-tint:#fff3d7;--route-outline:#eecf91;--route-strong:#bb7d10}
.project-category-move{--route-ink:#146b64;--route-tint:#e5f5f0;--route-outline:#a8ddd0;--route-strong:#1b907d}
.project-category-office{--route-ink:#514d9b;--route-tint:#eeebfc;--route-outline:#c9c3ed;--route-strong:#7169ba}
.project-category.project-category-first,
.project-category.project-category-move,
.project-category.project-category-office{
 border-color:var(--route-outline);
 background:linear-gradient(180deg,var(--route-tint) 0, #fffdfa 93px);
}
.project-category .project-category-header{
 border-bottom:1px solid var(--route-outline);padding-bottom:12px;
}
.project-category .project-route-icon{
 background:var(--route-tint);color:var(--route-ink);border:1px solid var(--route-outline);
}
.project-category .project-category-label h3{color:var(--route-ink)}
.project-category .project-item{border-left:3px solid var(--route-strong)}
.project-category .project-item-main .project-tag{background:var(--route-tint);color:var(--route-ink)}
.project-category .project-bar{background:var(--route-tint)}
.project-category .project-bar span{background:var(--route-strong)}
.project-category .project-add:not(:disabled){border-color:var(--route-outline);color:var(--route-ink);background:#fff}
.project-category .project-add:not(:disabled):hover{background:var(--route-tint)}

/* v9: 회원 프로필 공개글 — 후기(블루), 공간공유(코랄), 이사 팁(그린) */
.member-type-all{--member-ink:#595d65;--member-tint:#f1f2f3;--member-border:#d7dbe0;--member-strong:#7a8592}
.member-type-review{--member-ink:#2e5eaa;--member-tint:#eaf3ff;--member-border:#b7d4f9;--member-strong:#4888d4}
.member-type-space{--member-ink:#a25232;--member-tint:#fff0e6;--member-border:#edc3ab;--member-strong:#d47b4b}
.member-type-moving{--member-ink:#166b5c;--member-tint:#e4f4ee;--member-border:#a9d6c5;--member-strong:#2d967a}
.member-category-filters{gap:7px}
.member-category-filters .filter{
 display:inline-flex;align-items:center;justify-content:center;gap:5px;
 background:var(--member-tint);color:var(--member-ink);border:1px solid var(--member-border);
 border-radius:999px;min-width:0;min-height:35px;padding:7px 11px;font-weight:750;
}
.member-category-filters .filter.active{
 background:var(--member-ink);color:#fff;border-color:var(--member-ink);
 box-shadow:0 2px 7px rgba(0,0,0,.07);
}
.member-category-filters .filter svg{width:15px;height:15px;flex:0 0 15px}
.member-category-filters .member-filter-name{font-size:inherit;white-space:nowrap}
.member-category-filters .member-filter-count{font-size:11px;opacity:.7;font-variant-numeric:tabular-nums}
.member-category-section .member-category-heading{
 display:flex;align-items:center;gap:8px;color:var(--member-ink);
 padding:7px 10px;margin-bottom:11px;border-radius:10px;background:var(--member-tint);
 border-left:3px solid var(--member-strong);
}
.member-heading-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 22px;color:var(--member-ink)}
.member-heading-icon svg{height:19px;width:19px}
.member-category-heading .member-heading-count{font-size:12px;color:var(--member-ink);opacity:.75;font-weight:700}
.member-post-tile{position:relative;border-color:var(--member-border)}
.member-post-tile:hover{border-color:var(--member-strong)}
.member-post-image{position:relative}
.member-post-kind{
 position:absolute;z-index:1;top:7px;left:7px;display:inline-flex;align-items:center;gap:4px;
 padding:4px 7px;border:1px solid var(--member-border);background:var(--member-tint);
 color:var(--member-ink);border-radius:7px;font-size:10px;line-height:1.2;font-weight:850;
 box-shadow:0 1px 5px rgba(0,0,0,.08);max-width:calc(100% - 14px);
}
.member-post-kind svg{width:12px;height:12px;flex:0 0 12px}
.member-post-kind span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:680px){
 .member-category-filters{gap:5px}
 .member-category-filters .filter{min-height:33px;padding:6px 8px;font-size:11px;gap:3px}
 .member-category-filters .filter svg{width:13px;height:13px;flex-basis:13px}
 .member-category-filters .member-filter-count{font-size:10px}
 .member-post-kind{top:5px;left:5px;font-size:9px;padding:3px 5px;gap:3px}
 .member-post-kind svg{width:11px;height:11px;flex-basis:11px}
 .project-category .project-category-header{padding-bottom:10px}
}
body.view-force-mobile .member-category-filters .filter{padding:6px 8px;font-size:11px}

/* v10 ─ 활동 미리보기, 등급, 관리자 콘솔, PC 홈 메뉴 */
.main-nav .nav-home{display:inline-flex;align-items:center;justify-content:center}
.sidebar-member-info{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.sidebar-member-info strong{max-width:100%;overflow-wrap:anywhere}
.sidebar-member-info .edit-profile-link{border:0;background:transparent;padding:2px 0;color:#8b5d13;text-decoration:underline;text-underline-offset:3px;font-size:12px;font-weight:700;cursor:pointer}
.membership-badge{border:1px solid #e0d5bf;border-radius:100px;background:#f6f4ec;color:#756b5d;padding:3px 8px;font-size:11px;font-weight:750;max-width:100%;line-height:1.3}
.membership-운영자{background:#fff3c9;border-color:#f5ca52;color:#745005}
.membership-관리자{background:#e7eefb;border-color:#b6caed;color:#305a9c}
.membership-유료회원{background:#e8f4e8;border-color:#b4dabb;color:#22613a}
.staff-preview-panel{padding:12px 9px;border-radius:11px;background:#fff8e5;margin:12px 0;display:grid;gap:7px}
.staff-preview-panel label{font-weight:800;font-size:12px;color:#76520b}
.staff-preview-panel .select{max-width:100%;font-size:12px;padding:8px 5px}
.staff-preview-panel small{color:#817866;line-height:1.5;font-size:10px}
.my-activity-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:17px}
.my-activity-heading h2{margin:0;font-size:20px;line-height:1.3}
.my-activity-heading em{font-style:normal;color:#c28903}
.my-view-all{padding:5px 0;background:none;color:#9c6705;font-size:13px;white-space:nowrap;font-weight:800}
.my-activity-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;min-width:0}
.my-preview-mobile{display:none}
.my-activity-full{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;min-width:0}
.my-activity-tile{appearance:none;border:0;background:transparent;display:block;text-align:left;min-width:0;padding:0;overflow:hidden;color:#463e35;cursor:pointer}
.my-activity-tile:hover .my-activity-image{box-shadow:0 0 0 2px #e1b12e}
.my-activity-image{position:relative;display:flex;justify-content:center;align-items:center;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:10px;background:#eee9dd}
.my-activity-image img{width:100%;height:100%;object-fit:cover;display:block}
.my-activity-placeholder{font-size:28px;color:#987f55}
.my-activity-overflow{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.57);color:#fff;font-size:clamp(18px,2.7vw,38px);font-weight:850;letter-spacing:-.025em;text-shadow:0 2px 6px #0008}
.my-activity-title{display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;line-height:1.5;font-size:13px;overflow-wrap:anywhere}
.my-activity-meta{display:block;font-size:11px;color:#8c8578;margin-top:5px;line-height:1.3}
.my-activity-caption{display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:6px;font-size:12px;line-height:1.4;color:#686158}
.my-activity-note{color:#82786a;font-size:12px;margin-top:15px}
.my-admin-head{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:16px}
.my-admin-head h2{font-size:20px;margin:0 0 7px}
.my-admin-head p{font-size:12px;color:#83796b;line-height:1.5}
.admin-console{display:grid;gap:24px;min-width:0}
.admin-list-section h3,.admin-role-grant h3{font-size:16px;margin:0 0 10px}
.admin-list-section h3 small{font-size:11px;font-weight:400;color:#8d8272}
.admin-record-list{display:grid;gap:7px}
.admin-record{border:1px solid #e8dfd0;border-radius:10px;padding:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.admin-record-main{min-width:0;display:grid;gap:4px;font-size:12px}
.admin-record-main strong{font-size:12px;overflow-wrap:anywhere;max-width:42ch}
.admin-record-main small{font-size:10px;color:#817769}
.admin-record-actions{display:flex;flex-wrap:wrap;gap:5px;flex-shrink:0}
.admin-record-actions .btn{font-size:11px;padding:6px 8px}
.admin-status{width:max-content;border:1px solid #ddd5c9;border-radius:30px;padding:2px 7px;font-size:10px;color:#615847}
.admin-status-deleted,.admin-status-hidden{background:#fff0ea;color:#9c412f}
.admin-status-approved,.admin-status-published{background:#edf8ef;color:#2b6b40}
.admin-role-grant{border:1px solid #edd7ad;border-radius:12px;padding:14px;background:#fffaf0}
.admin-role-form{display:grid;grid-template-columns:minmax(0,1fr) 130px auto;gap:6px;margin:8px 0}
.admin-role-form .input,.admin-role-form .select{min-width:0;font-size:12px}
.admin-report-list{border:1px solid #e5dcca;border-radius:11px;padding:12px;min-width:0}
.admin-report-list summary{cursor:pointer;font-size:14px;font-weight:800}
.admin-report-line{display:flex;flex-wrap:wrap;align-items:center;gap:7px;border-top:1px solid #ede8df;padding:9px 0;margin-top:8px;font-size:11px;min-width:0}
.admin-report-line code{font-size:10px;overflow-wrap:anywhere}
@media(max-width:680px){
 .my-preview-desktop{display:none}
 .my-preview-mobile{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .my-activity-full{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .my-activity-heading h2{font-size:17px}
 .my-activity-image{border-radius:7px}
 .my-activity-overflow{font-size:24px}
 .admin-record{display:grid;gap:9px}
 .admin-record-actions{flex-wrap:wrap}
 .admin-role-form{grid-template-columns:minmax(0,1fr);gap:6px}
 .admin-role-form .btn{width:100%}
}
body.view-force-mobile .my-preview-desktop{display:none}
body.view-force-mobile .my-preview-mobile{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
body.view-force-mobile .my-activity-full{grid-template-columns:repeat(2,minmax(0,1fr))}
body.physical-mobile.view-force-desktop .my-preview-desktop{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
body.physical-mobile.view-force-desktop .my-preview-mobile{display:none}
body.physical-mobile.view-force-desktop .my-activity-full{grid-template-columns:repeat(3,minmax(0,1fr))}

/* v11: 회원 등급은 닉네임 위, 내 글·저장글 미리보기 제목은 사진 아래 */
.sidebar-member-info .membership-badge{order:0;align-self:flex-start}
.sidebar-member-info>strong{order:1;line-height:1.4}
.sidebar-member-info .edit-profile-link{order:2}
.my-activity-preview .my-activity-tile{display:flex;flex-direction:column;gap:0}
.my-activity-preview .my-activity-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;margin-top:7px;font-size:12px;line-height:1.4;overflow-wrap:anywhere;word-break:break-word}
.my-comments-section .my-comment-list{margin-top:14px}
/* 스크롤 중에도 게시글 상세창 닫기 버튼을 오른쪽 위에 고정 */
.story-detail-modal{--detail-modal-gutter:27px}
.story-detail-modal .modal-header{position:sticky;top:0;z-index:30;align-items:center;background:#fff;margin:calc(-1 * var(--detail-modal-gutter)) calc(-1 * var(--detail-modal-gutter)) 18px;padding:13px var(--detail-modal-gutter);border-bottom:1px solid #f0e5d6;border-radius:17px 17px 0 0;box-shadow:0 3px 12px rgba(36,27,12,.05)}
.story-detail-modal .modal-header h2{font-size:17px;line-height:1.3;margin:0}
.story-detail-modal .modal-header .close{
 flex:0 0 40px;
 display:flex;
 align-items:center;
 justify-content:center;
 position:relative;
 width:40px;
 height:40px;
 padding:0;
 line-height:0;
 font-size:0;
 background:#f7f4ed;
 border:1px solid #e6ddcf;
 border-radius:50%;
 color:#3b342b;
 cursor:pointer;
}
/* 글꼴의 × 글리프 기준선에 영향받지 않도록 중앙에 직접 십자 표시 */
.story-detail-modal .modal-header .close::before,
.story-detail-modal .modal-header .close::after{
 content:"";
 position:absolute;
 top:50%;
 left:50%;
 width:17px;
 height:2px;
 border-radius:2px;
 background:currentColor;
 pointer-events:none;
}
.story-detail-modal .modal-header .close::before{transform:translate(-50%,-50%) rotate(45deg)}
.story-detail-modal .modal-header .close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.story-detail-modal .modal-header .close:hover,.story-detail-modal .modal-header .close:focus-visible{background:#fbeab6;outline-color:#b8860b}
@media(max-width:560px){
 .story-detail-modal{--detail-modal-gutter:15px}
 .story-detail-modal .modal-header{padding:10px 15px;margin-bottom:15px}
 .story-detail-modal .modal-header .close{width:38px;height:38px;flex-basis:38px}
 .my-activity-preview .my-activity-title{font-size:11px;line-height:1.35;margin-top:5px}
}

/* v12: 프로필 사진의 저장 전 미리보기 및 계정 보안 메뉴 */
.profile-editor-zoom .avatar-editor{display:block;width:130px;height:130px;object-fit:cover;object-position:center;border-radius:50%}
.profile-editor-zoom .avatar-default{display:grid;place-items:center}
.profile-editor .profile-remove-status{min-height:18px;line-height:1.45}
.sidebar-account-actions [data-action="change-password"]{white-space:nowrap}
@media(max-width:390px){.sidebar-account-actions{flex-direction:column}.sidebar-account-actions .btn{width:100%}}


/* v14: 게시글 상세창 헤더는 최상단에 고정, 본문만 독립 스크롤 */
body:has(.story-detail-modal){overflow:hidden}
.story-detail-modal{
 display:flex;
 flex-direction:column;
 padding:0;
 max-height:calc(100dvh - 36px);
 overflow:hidden;
 overscroll-behavior:contain;
}
.story-detail-modal .modal-header{
 position:relative;
 top:auto;
 z-index:2;
 flex:0 0 auto;
 width:100%;
 margin:0;
 padding:15px 24px;
 border-radius:17px 17px 0 0;
 background:#fff;
 box-shadow:0 2px 12px rgba(36,27,12,.06);
}
.story-detail-modal .modal-header h2{
 flex:1 1 auto;
 min-width:0;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.story-detail-modal .modal-scroll-content{
 flex:1 1 auto;
 min-height:0;
 overflow-x:hidden;
 overflow-y:auto;
 overscroll-behavior:contain;
 scrollbar-gutter:stable;
 padding:18px 24px 24px;
}
@media(max-width:560px){
 .modal-backdrop:has(.story-detail-modal){padding:10px}
 .story-detail-modal{max-height:calc(100dvh - 20px)}
 .story-detail-modal .modal-header{padding:10px 15px;margin:0;border-radius:15px 15px 0 0}
 .story-detail-modal .modal-scroll-content{padding:12px 14px 18px;scrollbar-gutter:auto}
}


/* v15: 게시글 본문 스크롤과 분리된 하단 고정 닫기 버튼 */
.story-detail-modal .story-detail-footer{
 flex:0 0 auto;
 width:100%;
 padding:12px 24px calc(12px + env(safe-area-inset-bottom, 0px));
 background:#fff;
 border-top:1px solid #f0e5d6;
 box-shadow:0 -4px 12px rgba(36,27,12,.04);
 z-index:2;
}
.story-detail-modal .story-detail-bottom-close{
 display:block;
 width:100%;
 min-height:44px;
 border:1px solid var(--brand);
 border-radius:11px;
 background:var(--brand);
 color:#2b2109;
 font-size:15px;
 font-weight:750;
 cursor:pointer;
}
.story-detail-modal .story-detail-bottom-close:hover{
 background:var(--brand-dark);
 border-color:var(--brand-dark);
 color:#2b2109;
}
.story-detail-modal .story-detail-bottom-close:focus-visible{
 outline:3px solid #dba82b;
 outline-offset:2px;
}
@media(max-width:560px){
 .story-detail-modal .story-detail-footer{
  padding:9px 14px calc(9px + env(safe-area-inset-bottom, 0px));
 }
 .story-detail-modal .story-detail-bottom-close{min-height:42px;font-size:14px}
}


/* v17: Unified mango navigation and polished home. Existing route and auth logic stays untouched. */
:root { --dq-mango:#ffca34; --dq-mango-hover:#f5bb22; --dq-ink:#262820; }
/* Four primary tabs, equally recognizable in PC and mobile layouts. */
.main-nav {gap:7px; align-items:center}
.main-nav .nav-btn {
 position:relative; min-height:39px; padding:9px 15px;
 border:1px solid #edb927; border-radius:11px;
 background:var(--dq-mango); color:var(--dq-ink);
 font-weight:780; line-height:1.24; letter-spacing:-.025em;
 box-shadow:0 3px 10px rgba(174,116,7,.09);
 transition:background-color .15s,box-shadow .15s,transform .15s;
}
.main-nav .nav-btn:hover {background:var(--dq-mango-hover);color:var(--dq-ink);box-shadow:0 5px 13px rgba(174,116,7,.16);text-decoration:none}
.main-nav .nav-btn.active {background:var(--dq-mango);color:var(--dq-ink);font-weight:900;border-color:#b37a08;box-shadow:inset 0 -3px 0 #69470c,0 4px 13px rgba(174,116,7,.13)}
.main-nav .nav-btn:focus-visible {outline:2px solid #6e4b0c;outline-offset:2px}
/* Home hero gets visual hierarchy without a bulky static illustration. */
.hero {
 grid-template-columns:minmax(0,1fr) minmax(230px,350px);min-height:330px;gap:38px;
 padding:42px clamp(25px,4vw,50px);border:1px solid #f0dfad;border-radius:26px;
 background:radial-gradient(ellipse at 93% 0%,rgba(255,255,255,.87) 0 17%,transparent 49%),
 linear-gradient(125deg,#fff1bd 0%,#fff8e7 51%,#fffefb 100%);
 box-shadow:0 19px 45px rgba(101,75,15,.07);
}
.hero::before {width:290px;height:290px;top:-130px;right:-100px;opacity:.55}
.hero .kicker {letter-spacing:.02em;margin-bottom:17px}
.hero .hero-kicker-dot {background:#9d6d00;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
.hero h1 {font-size:clamp(34px,4vw,51px);line-height:1.16;letter-spacing:-.075em}
.hero h1 span,.hero h1 strong {display:block;white-space:normal}
.hero h1 strong {color:#a36b07}
.hero p:not(.kicker) {font-size:15px;line-height:1.7;margin-top:16px;color:#5d5546;max-width:530px}
.hero-subline {white-space:normal}
.hero-actions {margin-top:25px;align-items:center;gap:9px}
.hero-actions .btn {min-height:45px;border-radius:12px;font-weight:850;box-shadow:none}
.hero-actions .btn.primary {box-shadow:0 7px 18px rgba(175,121,17,.16)}
.hero-actions .btn:not(.primary) {border-color:#dfd2af;background:rgba(255,255,255,.8)}
.hero-progress-art {
 min-width:0;align-self:center;position:relative;display:grid;gap:10px;
 background:rgba(255,255,255,.89);border:1px solid #f2e5ca;border-radius:19px;
 padding:21px 20px 20px;box-shadow:0 14px 32px rgba(122,83,18,.09);
 transform:rotate(2deg);
}
.hero-progress-art::before {content:'';position:absolute;inset:-10px 10px 10px -10px;border-radius:19px;border:1px solid rgba(235,198,117,.44);z-index:-1;transform:rotate(-4deg)}
.hero-progress-top {display:flex;align-items:center;gap:6px;min-width:0}
.hero-progress-symbol {height:28px;width:28px;display:grid;place-items:center;background:var(--dq-mango);color:#412f05;border-radius:9px;font-size:21px;line-height:1}
.hero-progress-eyebrow {font-size:9px;font-weight:850;letter-spacing:.09em;color:#8b8066;flex:1}
.hero-progress-chip {font-size:8px;font-weight:900;letter-spacing:.04em;color:#86621b;background:#fff4d0;border-radius:100px;padding:5px 7px;white-space:nowrap}
.hero-progress-title {font-size:19px;font-weight:900;letter-spacing:-.065em;margin:6px 0 7px}
.hero-progress-item {display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid #eee8db;background:#fff;border-radius:11px;color:#4f514e;font-weight:700;font-size:12px;line-height:1.3}
.hero-progress-index {display:inline-grid;place-items:center;flex:0 0 27px;width:27px;height:27px;border-radius:8px;color:#8e650f;background:#fff5d7;font-size:11px;font-weight:900}
.hero-progress-item:nth-last-child(3) {border-color:#f3d888;background:#fffaf0}
.hero-progress-mark {margin-left:auto;display:grid;place-items:center;flex:0 0 23px;width:23px;height:23px;background:#ffcf43;color:#694000;border-radius:50%;font-weight:900;font-size:13px}
.hero-progress-line {margin-left:auto;flex:0 0 20px;width:20px;height:2px;background:#e6e1d6;border-radius:2px}
.home-section-intro {display:flex;justify-content:space-between;align-items:end;gap:12px;margin:31px 0 16px}
.home-section-eyebrow {color:#ab8016;font-size:10px;font-weight:900;letter-spacing:.13em;line-height:1.4;margin-bottom:4px}
.home-section-intro .section-heading {margin:0;font-size:clamp(21px,2.25vw,25px);line-height:1.36;letter-spacing:-.057em}
.home-section-desc {font-size:13px;line-height:1.5;color:#77776e;margin-top:6px}
.home-section-decoration {font-size:13px;color:#b6ac94;font-weight:850;letter-spacing:.07em;white-space:nowrap;padding-bottom:5px}
.route-grid {gap:14px}
.route-grid .route-tile {
 position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;
 min-height:175px;padding:22px 22px 20px;border-radius:18px;
 border:1px solid #e8e7df;background:#fff;box-shadow:0 8px 22px rgba(31,34,25,.035);
 transition:border-color .16s,background-color .16s,transform .16s,box-shadow .16s;
}
.route-grid .route-tile:hover,.route-grid .route-tile:focus-visible {transform:translateY(-3px);box-shadow:0 15px 26px rgba(31,34,25,.075);border-color:#e5be58;text-decoration:none}
.route-grid .route-emoji {display:grid;place-items:center;font-size:26px;width:50px;height:50px;border-radius:16px;margin-bottom:5px;background:#fff4d1}
.route-grid .route-move .route-emoji {background:#e8f6f1}
.route-grid .route-office .route-emoji {background:#f0edfa}
.route-grid .route-tile strong {font-size:19px;letter-spacing:-.055em;line-height:1.4}
.route-grid .route-tile>span:not(.route-emoji):not(.tile-cta) {font-size:13px;color:#76786e;line-height:1.5;margin-top:1px}
.route-grid .route-tile span.tile-cta:not(.route-emoji) {color:#8d6510;font-size:12px;font-weight:900;letter-spacing:-.02em;margin-top:auto;padding-top:14px}
.soft-note {border:1px solid #f1e3c0;background:#fffaf0;border-radius:13px;color:#776b54;padding:13px 16px;line-height:1.6;font-size:12px}
/* On phones keep the four yellow menu buttons in one *short* row. */
body.compact-site-nav .header-inner {padding:7px 12px 0}
body.compact-site-nav .main-nav,body.compact-site-nav .main-nav.open {
 display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;
 margin:8px 0 8px;min-height:0;align-items:stretch;
}
body.compact-site-nav .main-nav .nav-btn {
 min-width:0;min-height:37px;height:37px;display:flex;flex-direction:row;align-items:center;justify-content:center;
 padding:6px 1px;border:1px solid #edb927;border-radius:9px;
 background:var(--dq-mango)!important;color:var(--dq-ink);
 font-size:clamp(10px,2.8vw,12px);font-weight:800;line-height:1.1;white-space:nowrap;
 box-shadow:0 2px 6px rgba(146,103,14,.06);
}
body.compact-site-nav .main-nav .nav-btn.active {border-color:#ae7708;box-shadow:inset 0 -3px 0 #775116,0 2px 7px rgba(146,103,14,.08);font-weight:950}
body.compact-site-nav .main-nav .nav-btn:hover {background:var(--dq-mango-hover)!important}
body.compact-site-nav .main-nav .nav-icon {display:none!important}
body.compact-site-nav .main-nav .nav-caption-mobile {display:block;white-space:nowrap;font-size:inherit}
body.compact-site-nav .hero {padding:26px 21px 23px;gap:0;grid-template-columns:minmax(0,1fr);min-height:0;border-radius:20px}
body.compact-site-nav .hero h1 {font-size:clamp(27px,7.4vw,35px);line-height:1.2;letter-spacing:-.065em}
body.compact-site-nav .hero .kicker {font-size:11px;margin-bottom:12px}
body.compact-site-nav .hero p:not(.kicker) {font-size:13px;line-height:1.55;margin-top:12px}
body.compact-site-nav .hero-actions {margin-top:20px;gap:7px}
body.compact-site-nav .hero-actions .btn {min-height:42px;font-size:13px}
body.compact-site-nav .hero-progress-art {display:none}
body.compact-site-nav .home-section-intro {margin:24px 0 13px}
body.compact-site-nav .home-section-intro .section-heading {font-size:20px}
body.compact-site-nav .home-section-desc {font-size:12px;margin-top:5px}
body.compact-site-nav .home-section-decoration {font-size:11px}
body.compact-site-nav .route-grid {display:grid;grid-template-columns:1fr;gap:9px}
body.compact-site-nav .route-grid .route-tile {
 display:grid;grid-template-columns:44px minmax(0,1fr) 21px;
 grid-template-rows:auto auto;column-gap:11px;row-gap:2px;
 min-height:80px;padding:11px 14px;border-radius:14px;align-items:center;
}
body.compact-site-nav .route-grid .route-emoji {grid-column:1;grid-row:1/3;width:41px;height:41px;font-size:23px;border-radius:12px;margin:0}
body.compact-site-nav .route-grid .route-tile strong {grid-column:2;grid-row:1;font-size:14px;line-height:1.25}
body.compact-site-nav .route-grid .route-tile>span:not(.route-emoji):not(.tile-cta) {grid-column:2;grid-row:2;font-size:11px;margin:0;line-height:1.35}
body.compact-site-nav .route-grid .route-tile span.tile-cta:not(.route-emoji) {grid-column:3;grid-row:1/3;width:21px;min-width:21px;padding:0;margin:0;font-size:0!important;color:#776128}
body.compact-site-nav .route-grid .route-tile span.tile-cta:not(.route-emoji)::after {content:'→';font-size:19px;line-height:1.2}
@media(max-width:355px) {
 body.compact-site-nav .header-inner {padding-left:9px;padding-right:9px}
 body.compact-site-nav .main-nav,body.compact-site-nav .main-nav.open {gap:4px}
 body.compact-site-nav .main-nav .nav-btn {font-size:10px;padding-left:0;padding-right:0}
 body.compact-site-nav .hero {padding:23px 16px 20px}
 body.compact-site-nav .hero h1 {font-size:clamp(25px,7.4vw,28px)}
 body.compact-site-nav .hero-actions .btn {padding-left:11px;padding-right:11px}
 body.compact-site-nav .route-grid .route-tile {padding:10px 11px}
}
/* Explicit PC mode on a phone retains the PC hero layout when zoomed out. */
body.physical-mobile.view-force-desktop .hero {grid-template-columns:minmax(0,1fr) minmax(230px,350px);min-height:330px;padding:42px clamp(25px,4vw,50px)}


/* v18: cleaner active-only nav + more refined home hero */
.main-nav{gap:8px}
.main-nav .nav-btn{
 position:relative;min-height:40px;padding:10px 15px;
 border:1px solid transparent;border-radius:10px;
 background:transparent;color:#645a49;
 font-weight:780;line-height:1.24;letter-spacing:-.02em;
 box-shadow:none;transition:background-color .16s,color .16s,border-color .16s,transform .16s;
}
.main-nav .nav-btn:hover{background:#fff7db;color:#6b4a08;box-shadow:none;text-decoration:none}
.main-nav .nav-btn.active{background:var(--dq-mango);color:#2d2618;font-weight:900;border-color:#edbf42;box-shadow:none}
.main-nav .nav-btn:focus-visible{outline:2px solid #6e4b0c;outline-offset:2px}

.hero{
 position:relative;overflow:hidden;
 grid-template-columns:minmax(0,1fr) minmax(280px,365px);min-height:345px;gap:42px;
 padding:44px clamp(26px,4vw,52px);border:1px solid #efe1bf;border-radius:28px;
 background:
 radial-gradient(circle at 14% 18%,rgba(255,208,69,.14),transparent 21%),
 radial-gradient(circle at 88% 15%,rgba(255,239,179,.78),transparent 26%),
 linear-gradient(135deg,#fff8e3 0%,#fffdf6 53%,#ffffff 100%);
 box-shadow:0 16px 38px rgba(92,74,19,.05);
}
.hero::before{content:'';position:absolute;right:-68px;top:-70px;width:235px;height:235px;border-radius:50%;background:radial-gradient(circle,rgba(255,210,78,.24) 0%,rgba(255,210,78,0) 70%);pointer-events:none}
.hero::after{content:'';position:absolute;left:34px;right:34px;bottom:28px;height:1px;background:linear-gradient(90deg,rgba(230,208,151,.42),rgba(230,208,151,0));pointer-events:none}
.hero-copy{position:relative;z-index:1}
.hero .kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;background:rgba(255,250,235,.96);border:1px solid #f1e4b8;color:#8d6708;letter-spacing:0;font-size:13px;font-weight:850;margin-bottom:18px}
.hero .hero-kicker-dot{background:#a07006;box-shadow:0 0 0 5px rgba(255,255,255,.92)}
.hero h1{font-size:clamp(35px,4.25vw,54px);line-height:1.1;letter-spacing:-.085em;max-width:575px}
.hero h1 strong{color:#a86f08}
.hero p:not(.kicker){font-size:16px;line-height:1.72;margin-top:18px;color:#5c5344;max-width:505px}
.hero-actions{margin-top:28px;gap:10px}
.hero-actions .btn{min-height:46px;border-radius:13px;font-weight:850;box-shadow:none}
.hero-actions .btn.primary{box-shadow:none}
.hero-actions .btn:not(.primary){background:rgba(255,255,255,.86);border-color:#e6d8b8}
.hero-progress-art{
 min-width:0;align-self:center;position:relative;display:grid;gap:11px;
 background:linear-gradient(180deg,#ffffff 0%,#fffdf8 100%);
 border:1px solid #efe1bf;border-radius:24px;padding:22px 21px 21px;
 box-shadow:0 14px 30px rgba(118,90,22,.08);
 transform:none;
}
.hero-progress-art::before{content:'';position:absolute;inset:12px -12px -12px 12px;border-radius:24px;border:1px solid rgba(235,198,117,.45);z-index:-1}
.hero-progress-art::after{content:'';position:absolute;right:18px;top:16px;width:76px;height:76px;border-radius:18px;background:linear-gradient(135deg,rgba(255,210,78,.24),rgba(255,255,255,0));opacity:.95;pointer-events:none}
.hero-progress-top{gap:8px}
.hero-progress-symbol{height:30px;width:30px;border-radius:10px;font-size:20px}
.hero-progress-eyebrow{font-size:10px;letter-spacing:.12em;color:#97876a}
.hero-progress-chip{font-size:9px;padding:5px 9px;background:#fff5d7;color:#88631d}
.hero-progress-title{font-size:22px;letter-spacing:-.072em;margin:8px 0 8px}
.hero-progress-item{gap:11px;padding:13px 14px;border:1px solid #eee4cf;background:#fff;border-radius:14px;color:#4f514e;font-weight:760;font-size:13px;line-height:1.35}
.hero-progress-item:nth-last-child(3){border-color:#edcf77;background:linear-gradient(90deg,#fff7df 0%,#fffdfa 100%)}
.hero-progress-index{flex:0 0 29px;width:29px;height:29px;border-radius:9px;font-size:11px}
.hero-progress-mark{flex:0 0 25px;width:25px;height:25px;font-size:14px}
.hero-progress-line{width:22px}

.home-section-intro{margin:34px 0 18px}
.home-section-eyebrow{font-size:11px;letter-spacing:.18em}
.home-section-intro .section-heading{font-size:clamp(22px,2.4vw,28px);letter-spacing:-.065em}
.home-section-desc{font-size:14px;color:#76715f}
.route-grid{gap:16px}
.route-grid .route-tile{padding:24px 23px 22px;border-radius:20px;border:1px solid #ebe6d9;background:linear-gradient(180deg,#ffffff 0%,#fffefa 100%);box-shadow:0 9px 24px rgba(33,36,28,.032)}
.route-grid .route-tile:hover,.route-grid .route-tile:focus-visible{transform:translateY(-3px);box-shadow:0 16px 28px rgba(33,36,28,.07);border-color:#e2c166;text-decoration:none}
.route-grid .route-emoji{width:54px;height:54px;border-radius:18px;font-size:28px}
.route-grid .route-tile strong{font-size:20px}
.route-grid .route-tile>span:not(.route-emoji):not(.tile-cta){font-size:13px;line-height:1.6;color:#746f61}
.route-grid .route-tile span.tile-cta:not(.route-emoji){padding-top:16px}

body.compact-site-nav .main-nav,body.compact-site-nav .main-nav.open{gap:5px}
body.compact-site-nav .main-nav .nav-btn{
 min-width:0;min-height:37px;height:37px;display:flex;align-items:center;justify-content:center;
 padding:6px 1px;border:1px solid transparent;border-radius:10px;
 background:transparent!important;color:#6c614e;
 font-size:clamp(10px,2.8vw,12px);font-weight:800;line-height:1.1;white-space:nowrap;
 box-shadow:none;
}
body.compact-site-nav .main-nav .nav-btn.active{background:var(--dq-mango)!important;border-color:#edbf42;color:#2d2618;box-shadow:none;font-weight:950}
body.compact-site-nav .main-nav .nav-btn:hover{background:#fff7dc!important}
body.compact-site-nav .hero{padding:25px 20px 22px;gap:0;grid-template-columns:minmax(0,1fr);min-height:0;border-radius:22px;box-shadow:0 12px 24px rgba(92,74,19,.04)}
body.compact-site-nav .hero::after{left:20px;right:20px;bottom:20px}
body.compact-site-nav .hero .kicker{font-size:10px;padding:7px 10px;margin-bottom:12px}
body.compact-site-nav .hero h1{font-size:clamp(28px,7.4vw,36px);line-height:1.16;letter-spacing:-.075em}
body.compact-site-nav .hero p:not(.kicker){font-size:13px;line-height:1.58;margin-top:12px;max-width:none}
body.compact-site-nav .hero-actions{margin-top:20px;gap:7px}
body.compact-site-nav .hero-actions .btn{min-height:42px;font-size:13px}
body.compact-site-nav .route-grid .route-tile{border-radius:16px;background:#fff;box-shadow:0 6px 16px rgba(33,36,28,.028)}
body.compact-site-nav .route-grid .route-tile:hover,body.compact-site-nav .route-grid .route-tile:focus-visible{box-shadow:0 10px 18px rgba(33,36,28,.05)}
@media(max-width:355px){
 body.compact-site-nav .hero{padding:22px 15px 19px}
 body.compact-site-nav .hero::after{left:15px;right:15px;bottom:18px}
}
