/* [consolidated from style.css] */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap'); :root{--aqua:#18b8ae;--aqua-dark:#0e9991;--navy:#192836;--muted:#7a8894;--border:#e7edf0;--bg:#f6f9fa;--radius:18px;--shadow:0 14px 40px rgba(30,56,65,.035)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:14px/1.6 'Noto Sans KR',system-ui,-apple-system,sans-serif;color:var(--navy);background:#fff}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}a{text-decoration:none;color:inherit}.site-head{background:#fff;border-bottom:1px solid #e8edef;position:sticky;top:0;z-index:20}.head-inner{height:78px;max-width:1230px;margin:auto;padding:0 24px;display:flex;align-items:center;gap:50px}.brand{display:flex;align-items:center;gap:12px;min-width:210px}.brand-emblem{font-weight:800;font-size:24px;background:var(--navy);color:#fff;width:44px;height:44px;display:grid;place-items:center;border-radius:14px;position:relative}.brand-emblem span{position:absolute;width:9px;height:9px;border-radius:50%;background:#40d5c6;right:8px;top:8px}.brand strong{display:block;font-size:19px;letter-spacing:-.7px}.brand small{font-size:9px;color:#96a4aa;letter-spacing:2px;font-weight:700}.topnav{display:flex;gap:34px;align-self:stretch}.topnav a{font-weight:700;display:flex;align-items:center;position:relative;color:#77848b}.topnav a.active{color:var(--aqua-dark)}.topnav a.active:after{content:'';position:absolute;bottom:0;height:3px;background:var(--aqua);width:100%;left:0;border-radius:3px}.header-cta{margin-left:auto;color:#389d98;border:1px solid #c9ece8;background:#f7fffd;padding:9px 13px;border-radius:999px;font-size:11px;font-weight:700}.page-bg{background:linear-gradient(180deg,#f9fbfb 0,#fff 400px)}.page-shell{max-width:1230px;margin:0 auto;padding:55px 24px 100px}.titlebar{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px;gap:16px}.eyebrow{font-weight:800;letter-spacing:1.8px;font-size:11px;color:var(--aqua-dark);margin:0 0 7px}.titlebar h1{font-size:35px;letter-spacing:-1.8px;line-height:1.3;margin:0}.subtitle{font-size:13px;color:#8996a0;margin:11px 0 0}.status{color:#6a7a80;background:#fff;border:1px solid var(--border);border-radius:999px;padding:10px 15px;font-size:11px;font-weight:700;white-space:nowrap}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--aqua);margin-right:7px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:22px;align-items:start}.main-column{display:flex;flex-direction:column;gap:22px}.sheet{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:29px 31px}.section-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:25px}.step{font-size:20px;color:var(--aqua);font-weight:800;line-height:1.5}.section-head h2{font-size:20px;line-height:1.4;letter-spacing:-.8px;margin:0}.section-head p{color:#8b989f;font-size:12px;margin:4px 0}.tab-switch{display:flex;background:#f4f6f7;padding:5px;border-radius:12px;width:250px;margin-bottom:17px}.tab{border:0;background:transparent;border-radius:9px;padding:10px 19px;flex:1;color:#8a959e;font-size:12px;font-weight:800}.tab.selected{background:#263540;color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.07)}.vehicle-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.vehicle{border:1px solid #e9edef;background:linear-gradient(160deg,#fbfcfd,#f5f8f9);border-radius:12px;min-height:158px;text-align:center;position:relative;padding:14px 8px 13px;color:#67757e;transition:all .2s;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.vehicle:hover{border-color:#64cec5;transform:translateY(-2px)}.vehicle.chosen{border-color:var(--aqua);background:linear-gradient(145deg,#48d9bb,#14b9b3);color:white;box-shadow:0 7px 16px rgba(24,184,174,.16)}.vehicle-type{display:inline-block;position:absolute;top:9px;left:9px;border-radius:5px;padding:2px 7px;color:#fff;background:#9facb2;font-size:10px;font-weight:800}.chosen .vehicle-type{background:#126f69}.vehicle-icon{display:flex;align-items:flex-end;justify-content:center;font-size:43px;height:82px;padding-top:22px;margin-bottom:8px;line-height:1;filter:grayscale(55%);opacity:.83}.chosen .vehicle-icon{filter:none;opacity:1}.vehicle strong{display:block;font-size:12px;line-height:1.35;margin-top:2px}.vehicle small{display:block;font-size:9px;line-height:1.45;margin-top:6px;opacity:.8}.divider-line{margin:24px 0 18px;border-top:1px solid var(--border)}.field-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.subhead{font-size:12px;display:block;font-weight:800;margin-bottom:9px}.hint{color:#a0adb5;font-weight:500;font-size:10px}.quiet{font-size:11px;color:#a0adb5}.quiet strong{color:var(--aqua-dark)}.item-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.item{background:#f8fafb;border:1px solid #eff2f4;border-radius:12px;text-align:center;padding:10px 7px}.item>span{font-size:34px;display:block;line-height:54px}.item>strong{font-size:11px;display:block}.counter{display:flex;justify-content:space-between;align-items:center;background:#fff;margin-top:10px;border-radius:7px;overflow:hidden;border:1px solid var(--border)}.counter button{background:#fff;border:0;color:var(--aqua-dark);width:26px;height:28px;font-weight:800;font-size:17px}.counter b{font-size:11px}.two-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.three-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.three-cols input{min-width:0}input,select,textarea{width:100%;border:1px solid #e2e9ed;border-radius:9px;background:#fff;padding:12px 13px;outline:none;color:#273944;transition:border .15s;min-height:44px}textarea{resize:vertical;min-height:81px}input:focus,select:focus,textarea:focus{border-color:var(--aqua);box-shadow:0 0 0 3px rgba(24,184,174,.09)}input::placeholder,textarea::placeholder{color:#abb4ba;font-size:11px}.form-card{padding:22px;border:1px solid #e6edef;border-radius:13px;background:#fff}.form-card+.address-cards{margin-top:13px}.mini-title{font-size:13px;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:17px}.mini-icon{font-size:10px;font-weight:800;background:#dff7f4;color:var(--aqua-dark);border-radius:7px;padding:5px 7px}.tag{margin-left:auto;font-size:10px;border-radius:6px;padding:3px 7px;background:#f2f5f7;color:#71818d}.form-field{margin-bottom:11px}.form-field:last-child{margin-bottom:0}.form-field label,.reservation label{font-size:11px;font-weight:800;display:block;margin-bottom:6px}.form-field label em{color:#9aa9b1;font-size:10px;font-style:normal;font-weight:500}.address-search{display:flex;gap:6px}.address-search input{background:#fafbfc;min-width:0}.address-search button{background:var(--navy);border:0;border-radius:8px;color:#fff;white-space:nowrap;font-size:10px;font-weight:800;padding:0 13px}.address-cards{margin-top:14px;gap:12px}.address-card{padding:18px}.address-card .three-cols{margin-bottom:11px}.notice{color:#809198;background:#f6fbfa;padding:12px;border-radius:9px;font-size:11px;margin:15px 0 0}.notice span{font-weight:800;color:var(--aqua-dark);padding-right:6px}.choice-row{display:flex;gap:8px}.choice{flex:1;background:#f5f7f8;color:#7b8891;border:1px solid #f0f2f4;padding:12px;border-radius:9px;font-weight:700}.choice.chosen{background:#edfcf9;color:#129e97;border:1px solid #58cdbf}.reservation{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;align-items:end;padding-top:14px}.reservation label{grid-row:1}.hidden{display:none}.field-help{font-size:10px;color:#919ea7;margin:8px 0}.quote-display{border-radius:16px;background:linear-gradient(115deg,#102f36,#19525b);color:#fff;padding:27px 30px}.quote-label{display:flex;justify-content:space-between;gap:8px;align-items:center}.pill{background:rgba(56,220,195,.15);border:1px solid rgba(56,220,195,.3);color:#9bf2e8;border-radius:99px;padding:6px 10px;font-size:11px;font-weight:800}.quote-label .quiet{color:#a5c8ca}.quote-range{font-size:31px;font-weight:800;letter-spacing:-1px;margin:18px 0 12px}.quote-range span{font-size:22px;color:#7bd0c8;padding:0 5px}.quote-breakdown{border-top:1px solid rgba(255,255,255,.15);padding-top:14px;display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#abc4c7}.quote-breakdown strong{color:#fff;font-size:15px}.quote-explain{font-size:10px;color:#9ab7b9;margin-top:10px;line-height:1.8}.quote-actions{display:grid;grid-template-columns:1.4fr 1fr;gap:10px;margin-top:14px}.primary,.secondary{padding:15px;border:0;border-radius:10px;font-weight:800;font-size:13px}.primary{background:var(--aqua);color:#fff;box-shadow:0 5px 10px rgba(24,184,174,.12)}.primary:hover{background:var(--aqua-dark)}.secondary{border:1px solid #cfe2e3;background:#fff;color:#477379}.primary span{font-size:16px;margin-right:6px}.feedback{font-size:11px;color:#80969a;margin:13px 0 0}.feedback.error{color:#c14e55}.side-column{position:sticky;top:102px;display:flex;flex-direction:column;gap:16px}.side-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow)}.side-kicker{color:var(--aqua-dark);font-size:10px;font-weight:800;letter-spacing:1.5px}.side-card h3{margin:5px 0 21px;font-size:17px;letter-spacing:-.5px}.summary-vehicle{display:flex;gap:13px;align-items:center;background:#f3fbf9;border-radius:10px;padding:11px;margin-bottom:19px}.icon-panel{width:49px;height:49px;background:#dff7f4;display:grid;place-items:center;border-radius:10px;font-size:30px}.summary-vehicle strong{display:block;font-size:13px}.summary-vehicle small{color:#84989e;font-size:11px}.summary-list{display:flex;flex-direction:column;gap:16px}.summary-list div{display:flex;flex-direction:column;gap:2px}.summary-list span{font-size:10px;color:#98a6ac}.summary-list b{font-size:12px;word-break:keep-all}.side-price{background:#f3faf9;border-radius:10px;padding:15px;margin:22px 0 10px}.side-price small{display:block;color:#689793;font-size:10px}.side-price strong{display:block;font-size:14px;color:#138f89;margin-top:3px;word-break:keep-all}.side-tip{font-size:10px;color:#a2aeb2;line-height:1.9}.help-card{border-radius:16px;background:#192d35;color:#fff;padding:23px}.help-icon{font-size:19px;color:#71e6d5;margin-bottom:8px}.help-card strong{font-size:13px}.help-card p{color:#a6bdc3;font-size:11px;margin:8px 0 0;line-height:1.8}.footer{background:#122126;color:#d4e1e3;padding:30px max(24px,calc((100% - 1182px)/2));display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:10px}.footer strong{display:block;color:white;font-size:16px}.footer span{color:#8ba4aa}.footer p{margin:0;color:#94a5aa}dialog{width:min(580px,calc(100% - 24px));border:1px solid #dae6e7;border-radius:16px;padding:0;box-shadow:0 25px 90px rgba(3,22,28,.2)}dialog::backdrop{background:rgba(6,27,35,.5);backdrop-filter:blur(3px)}.dialog-inner{padding:24px}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.dialog-head h2{font-size:18px;margin:0}.dialog-head button{background:#f2f7f6;border:0;border-radius:7px;padding:7px 10px}.preview-row{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid #f0f3f4;padding:11px 0;font-size:12px}.preview-row span{color:#8a969a;white-space:nowrap}.preview-row strong{text-align:right;white-space:pre-wrap;overflow-wrap:anywhere}.preview-note{font-size:11px;color:#b45f4d;background:#fff9f6;padding:10px;border-radius:8px}.dialog-inner>.primary{width:100%}@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr)}.side-column{position:static;display:grid;grid-template-columns:1fr 1fr}.vehicle-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.header-cta{display:none}}@media(max-width:650px){.head-inner{height:62px;gap:15px;padding:0 15px}.brand{min-width:auto}.brand-emblem{width:34px;height:34px;font-size:18px;border-radius:10px}.brand strong{font-size:15px}.brand small{font-size:8px}.topnav{margin-left:auto;gap:13px}.topnav a{font-size:10px}.topnav a:nth-child(2){display:none}.page-shell{padding:28px 12px 60px}.titlebar{align-items:flex-start;flex-direction:column;margin-bottom:20px}.titlebar h1{font-size:25px}.status{font-size:10px}.sheet{padding:20px 14px}.section-head{margin-bottom:20px}.section-head h2{font-size:18px}.vehicle-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.vehicle{min-height:132px;padding:13px 7px 11px}.vehicle-icon{height:68px;font-size:35px;padding-top:15px;margin-bottom:7px}.item-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.two-cols,.address-cards{grid-template-columns:1fr}.three-cols{grid-template-columns:repeat(3,minmax(0,1fr))}.form-card{padding:15px}.address-card{padding:15px}.three-cols input{padding:10px 6px;font-size:12px}.quote-range{font-size:22px}.quote-display{padding:20px 16px}.quote-actions{grid-template-columns:1fr}.side-column{grid-template-columns:1fr}.footer{display:block;padding:25px 18px}.footer p{margin-top:13px}.reservation{grid-template-columns:1fr}.reservation label{grid-row:auto}} /* 2차 운임 비주얼: MIN / 인성 조회 중심 / MAX */ .quote-three{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,1.55fr) minmax(0,1fr);gap:11px;align-items:center;margin:21px 0 18px} .quote-bound{text-align:center;border:1px solid rgba(255,255,255,.13);border-radius:11px;padding:19px 8px;background:rgba(255,255,255,.045);min-width:0} .quote-bound small,.quote-middle small{display:block;font-size:10px;color:#b1cdd0;letter-spacing:-.2px;font-weight:600} .quote-bound strong{display:block;font-size:19px;font-weight:800;letter-spacing:-.75px;margin-top:6px;white-space:nowrap} .quote-middle{border-radius:14px;padding:19px 8px;text-align:center;background:linear-gradient(130deg,#42dec9,#1cbeb1);color:#092e33;box-shadow:0 12px 32px rgba(3,21,25,.16);min-width:0} .quote-middle small{color:#0c5457;font-weight:800} .quote-middle strong{display:block;font-size:clamp(23px,2.6vw,35px);font-weight:900;letter-spacing:-1.5px;margin:8px 0;white-space:nowrap} .quote-middle span{display:block;color:#0e6365;font-size:10px;font-weight:700} .submit-panel{margin-top:20px;border:1px solid #cfe6e4;background:linear-gradient(135deg,#f8fffd,#f3fafb);border-radius:15px;padding:22px} .submit-panel strong{font-size:15px}.submit-panel p{margin:7px 0 14px;font-size:11px;color:#71868a} .consent-row{font-size:12px;display:flex;align-items:center;gap:9px;margin:10px 0 14px;font-weight:700}.consent-row input{width:17px;min-height:17px;height:17px;accent-color:#11a79e} .submit-panel .primary{width:100%;font-size:14px}.submit-panel .submit-help{margin:10px 0 0;font-size:11px;color:#788d91} @media(max-width:650px){.quote-three{gap:5px;grid-template-columns:minmax(0,1fr) minmax(120px,1.5fr) minmax(0,1fr)}.quote-bound{padding:13px 2px}.quote-bound small,.quote-middle small{font-size:8px}.quote-bound strong{font-size:clamp(10px,3vw,14px);letter-spacing:-.3px}.quote-middle{padding:13px 4px}.quote-middle strong{font-size:clamp(16px,4.7vw,24px);letter-spacing:-.8px}.quote-middle span{font-size:8px}.submit-panel{padding:16px}} /* 인성 공식 주소검색 전용 모달. 퀵서비스/화물운송 공통 */ .address-dialog{width:min(680px,calc(100% - 24px));max-height:min(90vh,850px);overflow:auto} .address-dialog-inner{padding:26px} .address-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:10px} .address-dialog-header h2{font-size:21px;line-height:1.4;margin:3px 0 0;color:#192836} .address-close{border:0;background:#f1f6f7;color:#536870;border-radius:10px;font-size:16px;min-width:38px;min-height:38px} .address-help{color:#72848d;font-size:12px;line-height:1.75;margin:10px 0 20px} .address-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px} .address-form-grid label{font-size:12px;color:#3b5360;font-weight:750;display:block} .address-form-grid input{margin-top:6px;font-weight:500} .address-submit{width:100%;margin-top:15px} .address-result-state{font-size:12px;color:#63858b;background:#f2fbf9;border-radius:10px;padding:11px 13px;margin:17px 0 9px;line-height:1.6} .address-result-state.error{color:#bb464d;background:#fff3f3} .address-result-list{display:flex;flex-direction:column;gap:8px;max-height:310px;overflow-y:auto} .address-result{width:100%;border:1px solid #e1eaec;border-radius:11px;background:#fff;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:13px 15px;color:#243846} .address-result:hover,.address-result:focus-visible{border-color:#18b8ae;background:#f2fbf9;outline:none} .address-result strong{font-size:13px;font-weight:750;overflow-wrap:anywhere} .address-result small{font-size:11px;color:#87969d;overflow-wrap:anywhere} .address-card input[readonly]{background:#f3faf9;color:#455c62;cursor:default} .address-card input[readonly]::placeholder{color:#96a5aa} .address-search button{min-width:90px} @media(max-width:650px){.address-dialog-inner{padding:17px}.address-dialog-header h2{font-size:18px}.address-form-grid{gap:9px}.address-form-grid input{padding:10px 9px;font-size:12px}.address-help{font-size:11px}.address-result-list{max-height:40vh}} /* 단일 입력형 인성 주소검색: 검색창 클릭 → 팝업 → 검색/결과 선택 */ .address-search-trigger{position:relative;gap:0;border:1px solid #e2e9ed;border-radius:9px;overflow:hidden;transition:border-color .2s,box-shadow .2s} .address-search-trigger:focus-within{border-color:var(--aqua);box-shadow:0 0 0 3px rgba(24,184,174,.09)} .address-search-trigger input[readonly]{background:#fff;border:0!important;border-radius:0;box-shadow:none!important;cursor:pointer;flex:1;min-width:0;padding-right:3px;white-space:nowrap;text-overflow:ellipsis} .address-search-trigger button{width:50px;min-width:50px;min-height:44px;border:0;border-radius:0;background:#fff;color:#179e98;display:grid;place-items:center;padding:0} .address-search-trigger:hover input,.address-search-trigger:hover button{background:#f1faf9} .address-search-trigger button:focus-visible{outline:2px solid var(--aqua);outline-offset:-3px} .address-dialog{width:min(610px,calc(100% - 22px));max-height:min(88vh,790px);max-height:min(88dvh,790px);border:1px solid #dcebe9;border-radius:20px} .address-dialog-inner{padding:28px} .address-dialog-header{align-items:center} .address-help{margin:8px 0 18px} .address-onebox-form{margin-top:6px} .address-onebox{display:flex;align-items:center;gap:9px;border:2px solid #17b8ac;background:#fff;border-radius:12px;padding:5px 5px 5px 15px;box-shadow:0 4px 16px rgba(16,129,126,.08)} .address-onebox svg{flex:0 0 auto;color:#17a89e} .address-onebox:focus-within{box-shadow:0 0 0 4px rgba(24,184,174,.13)} .address-onebox input{width:100%;min-width:0;border:0!important;box-shadow:none!important;font-size:16px;background:transparent;min-height:43px;padding:6px 0;outline:0} .address-onebox input::placeholder{font-size:13px} .address-onebox-button{flex:0 0 auto;min-width:75px;min-height:43px;border:0;border-radius:8px;background:var(--aqua);color:#fff;font-weight:800} .address-onebox-button:hover{background:var(--aqua-dark)} .address-onebox-button:disabled{opacity:.6} .address-example{font-size:11px;color:#84949a;margin:11px 0 16px;line-height:1.65} .address-result-state{margin:0 0 12px;padding:12px} .address-result-list{max-height:320px} .address-result{padding:14px 16px;gap:5px} .address-result:active{background:#e8f8f5} .address-source-note{font-size:10px;color:#8b989c;text-align:center;margin:14px 0 0} .address-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} @media(max-width:650px){ .address-dialog-inner{padding:19px 16px 17px} .address-dialog-header h2{font-size:19px} .address-onebox{gap:7px;padding-left:11px} .address-onebox-button{min-width:62px} .address-example{font-size:10px} .address-result-list{max-height:41dvh} } /* 도로명 → 읍면동 2단계 확인: 기존 주소검색 패널에만 적용 */ .address-road-reset{display:inline-block;margin-left:12px;margin-top:6px;padding:5px 9px;border:1px solid #64c9c2;border-radius:7px;background:#f5fffd;color:#148d85;font-size:12px;font-weight:700;vertical-align:middle} .address-road-reset:hover,.address-road-reset:focus-visible{background:#e5f8f4;outline:2px solid #b0e5df;outline-offset:2px} /* V6: 도로명 선택 상태와 자동운임 안내 */ .address-completion-note{margin:6px 0 12px;font-size:11px;color:#228c80;line-height:1.6;word-break:keep-all} .address-completion-note.pending{color:#bc6a30} @media(max-width:650px){.address-completion-note{font-size:11px;margin:6px 0 12px}} /* V7: 건물번호 입력 및 정확한 도로명-지번주소 보완 검색 */ .address-building-box{margin:14px 0 6px;padding:15px;border:1px solid #cee9e5;border-radius:12px;background:#f7fcfb} .address-building-box.hidden,.address-postcode.hidden,.address-fallback.hidden{display:none!important} .address-building-box label{display:block;font-size:13px;font-weight:800;margin-bottom:9px} .address-building-row{display:flex;gap:9px} .address-building-row input{min-width:0;flex:1} .address-building-row button{white-space:nowrap;border:0;border-radius:9px;background:#18b8ae;color:#fff;padding:0 14px;font-weight:800} .address-building-box p{font-size:11px;color:#688388;margin:9px 0 0;line-height:1.6} .address-postcode{min-height:430px;width:100%;margin-top:14px;border:1px solid #dce7e9;border-radius:12px;overflow:hidden;background:#fff} .address-fallback{border:1px solid #c7dedf;background:#fff;color:#376e71;padding:12px 14px;border-radius:9px;font-size:12px;font-weight:700;margin-top:12px;width:100%;text-align:center} @media(max-width:650px){.address-postcode{min-height:450px}.address-building-row button{padding:0 10px;font-size:12px}} /* V8: usable building-level address search and truck type selectors */ .truck-shape-field{margin-top:15px;display:grid;grid-template-columns:90px minmax(140px,260px) 1fr;align-items:center;gap:12px;font-size:12px} .truck-shape-field label{font-weight:800}.truck-shape-field select{min-width:0}.truck-shape-field p{color:#7c8f96;font-size:11px;line-height:1.5;margin:0} .address-search-tools{display:flex;gap:8px;margin:12px 0}.address-search-tools button{border:1px solid #bbe4e0;background:#ebfbf8;color:#176a68;padding:10px 13px;border-radius:9px;font-weight:800;font-size:12px} .address-search-tools .address-tool-primary{background:#15ada5;color:white;border-color:#15ada5} .address-postcode{min-height:430px;height:460px;overflow:auto;border:1px solid #d8e6e9;border-radius:11px;margin:8px 0 15px} .distance-diagnostic{background:#fbfdfd;border:1px solid #e0ebec;border-radius:13px;padding:18px;margin-top:20px} .distance-diagnostic h3{font-size:14px;margin:0 0 6px}.distance-diagnostic p{color:#71828b;font-size:11px;line-height:1.7;margin:6px 0} .distance-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:13px 0}.distance-controls label{font-size:11px;font-weight:800}.distance-controls input{width:140px;min-height:38px;padding:8px} .distance-controls button{border:1px solid #badbd8;border-radius:8px;padding:9px 10px;background:#e7f7f5;color:#176a68;font-size:11px;font-weight:800} @media(max-width:650px){.truck-shape-field{grid-template-columns:1fr 1fr}.truck-shape-field p{grid-column:1/-1}.address-search-tools{flex-wrap:wrap}.address-postcode{min-height:380px;height:410px}.distance-controls input{max-width:100px}} /* Fix CSS specificity: hidden postcode panel must never leave a blank rectangle */ .truck-shape-field.hidden,.address-postcode.hidden,.address-building-box.hidden,.address-fallback.hidden{display:none!important} .vehicle-code-check{background:#f2faf9;border:1px solid #b9e3df;border-radius:8px;color:#176f6b;padding:8px 10px;font-size:11px;font-weight:700;white-space:nowrap} .vehicle-code-status{grid-column:1/-1;color:#6c8b8d;font-size:11px;overflow-wrap:anywhere} .truck-shape-field{grid-template-columns:90px minmax(140px,240px) 1fr auto} @media(max-width:800px){.truck-shape-field{grid-template-columns:1fr 1fr}.truck-shape-field p{grid-column:1/-1}.truck-shape-field .vehicle-code-check{grid-column:1/-1;justify-self:start}} /* V9 경로·요금 상태 안내. 기존 디자인과 독립 사용 유지. */ .route-overview{border:1px solid #cceae7;border-radius:12px;background:#f5fffd;padding:14px 16px;display:flex;flex-direction:column;gap:4px;margin:12px 0} .route-overview>span{font-size:11px;color:#579995;font-weight:800}.route-overview>strong{font-size:21px;color:#15434a;font-weight:800;line-height:1.5} .route-overview>small{font-size:11px;color:#69868b;line-height:1.7;overflow-wrap:anywhere} .route-unit-confirm{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:10px 0 14px} .route-unit-confirm.hidden{display:none!important}.route-unit-confirm span{flex-basis:100%;font-size:11px;color:#586b73} .route-unit-confirm button{border:1px solid #a7dcd7;border-radius:8px;background:#eafffb;color:#176b65;padding:9px 13px;font-size:12px;font-weight:800} .route-note{font-size:10px;color:#869da4;line-height:1.8;margin-top:9px} /* V11 · 주소검색 팝업 재정리. 기존 접수폼 레이아웃에는 영향 없음. */ .address-dialog{ padding:0!important; width:min(660px,calc(100vw - 24px)); max-height:min(90dvh,820px);overflow:hidden;border:1px solid #e1eae9; border-radius:22px;box-shadow:0 24px 85px rgba(15,38,48,.27) } .address-dialog-inner{padding:0!important;display:flex;flex-direction:column;max-height:min(90dvh,820px);overflow:hidden} .address-dialog-top{flex:0 0 auto;padding:23px 26px 15px;background:#fff;border-bottom:1px solid #ebf1f1} .address-dialog-header{margin:0 0 8px;gap:12px} .address-dialog-header h2{font-size:22px;margin-top:0;letter-spacing:-.65px} .address-dialog-header .eyebrow{font-size:9px;letter-spacing:1.5px;margin-bottom:3px} .address-close{background:#f1f5f6;border-radius:12px;min-width:42px;min-height:42px;font-size:18px} .address-help{margin:0 0 15px;color:#71828b;font-size:12px;line-height:1.6;word-break:keep-all} .address-onebox{background:#fff;border:1.5px solid #22b7ac;border-radius:12px;padding:4px 5px 4px 13px;box-shadow:0 3px 12px rgba(5,65,65,.06)} .address-onebox input{font-size:15px;min-height:44px} .address-onebox input::placeholder{font-size:12px} .address-onebox-button{background:#14afa6;min-height:43px;min-width:76px;border-radius:9px} .address-search-tools{margin:11px 0 4px;display:flex;gap:8px} .address-search-tools button{padding:9px 12px;font-size:11px;border-radius:9px;min-height:36px} .address-search-tools .address-tool-primary{background:#e8f8f5;color:#087b73;border-color:#b8e6df} .address-search-tools .address-tool-secondary{background:#fff;color:#677b82;border-color:#e1e9eb} .address-example{margin:7px 0 0;color:#97a6aa;font-size:10px} .address-dialog-content{padding:18px 26px 22px;min-height:120px;max-height:50dvh;overflow-y:auto;overscroll-behavior:contain;background:#fbfdfd} .address-result-state{background:#eef8f6;color:#497b7a;font-size:12px;border-radius:10px;margin:0 0 12px;padding:11px 13px;line-height:1.6;overflow-wrap:anywhere} .address-result-list{max-height:none;overflow:visible;gap:9px} .address-result{background:#fff;border:1px solid #e2ebea;border-radius:11px;padding:15px 16px;gap:5px;box-shadow:0 2px 7px rgba(25,50,55,.025);transition:border-color .18s,background .18s} .address-result strong{font-size:14px;line-height:1.45;word-break:keep-all} .address-result small{font-size:11px;line-height:1.5} .address-postcode{min-height:300px;height:340px;margin:12px 0;border-radius:10px;background:#fff} .address-building-box{background:#fff} .address-source-note{font-size:10px;text-align:left;color:#829599;line-height:1.6;margin:13px 0 0} @media(max-width:650px){ .address-dialog{width:calc(100vw - 12px);max-height:94dvh;border-radius:18px} .address-dialog-inner{max-height:94dvh} .address-dialog-top{padding:18px 16px 13px} .address-dialog-header h2{font-size:20px} .address-help{font-size:11px;margin-bottom:11px} .address-dialog-content{padding:14px 14px 20px;max-height:51dvh} .address-onebox{padding-left:10px;gap:7px} .address-onebox input{font-size:14px} .address-onebox-button{min-width:62px;min-height:42px} .address-search-tools{display:grid;grid-template-columns:1.2fr 1fr} .address-search-tools button{white-space:normal;line-height:1.35;padding:10px 7px} .address-result{padding:13px 12px} .address-postcode{height:340px;min-height:300px} } /* V14: 인성 단일 주소검색. 외부 우편번호 iframe 없음. */ .address-dialog{width:min(640px,calc(100vw - 20px));max-height:min(90dvh,840px);overflow:auto} .address-dialog-inner{padding:27px 28px!important;overflow:auto;overscroll-behavior:contain} .address-dialog .address-result-list{display:flex;max-height:42dvh;overflow-y:auto;gap:9px} .address-dialog .address-result{display:flex;flex-direction:column;text-align:left;width:100%;background:#fff;border:1px solid #dfeae9;border-radius:12px;padding:16px;gap:6px} .address-dialog .address-result strong{font-size:14px;line-height:1.45} .address-dialog .address-result small{font-size:11px;line-height:1.5;color:#758992} .address-dialog .address-result:hover,.address-dialog .address-result:focus-visible{background:#f0faf8;border-color:#14aea6} .address-road-confirm{background:#f0faf8;border:1px solid #bfe5de;border-radius:13px;padding:16px;margin:15px 0 12px;color:#234b51} .address-road-confirm.hidden{display:none!important} .address-road-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px} .address-road-label{font-size:11px;color:#3f8580;font-weight:700} .address-reset-btn{border:1px solid #bce3dd;background:white;border-radius:7px;font-size:11px;padding:7px 10px;color:#318781} .address-road-confirm>strong{display:block;font-size:14px;overflow-wrap:anywhere} .address-road-fields{margin-top:12px;max-width:210px} .address-road-fields label{font-size:12px;font-weight:700;display:block} .address-road-fields input{margin-top:5px;background:white} .address-road-confirm p{font-size:11px;line-height:1.65;color:#53767a;margin:12px 0} .address-confirm-label{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700;line-height:1.5} .address-confirm-label input{flex:none;width:18px;height:18px;min-height:18px;accent-color:#139e97} .address-dialog .address-result-state{margin:14px 0 12px} .address-dialog .address-help{margin-bottom:12px} .address-dialog .address-source-note{font-size:11px;color:#748991;line-height:1.7;margin:14px 0 0} @media(max-width:650px){ .address-dialog{width:calc(100vw - 12px);max-height:92dvh} .address-dialog-inner{padding:20px 16px!important} .address-dialog .address-result-list{max-height:40dvh} .address-road-confirm{padding:13px} .address-dialog .address-result{padding:13px} .address-road-fields{max-width:100%} } .address-dialog #insungAddressSearch{background-color:#14afa6!important;color:#fff!important;border:0!important;min-width:68px!important;border-radius:9px!important} .address-dialog #insungAddressSearch:disabled{background-color:#91cfc8!important} /* V18: keep detailed navigation diagnostics readable on narrow screens. */ #routeDistanceDetail{white-space:pre-line;overflow-wrap:anywhere;line-height:1.75} /* V20: 인성 검증 좌표 지도, 인성 공식 API 유사주소 안내. 기존 폼 테마 유지. */ .address-dialog .address-result.is-suggestion{border-left:3px solid #16a89e;background:#f8fffd} .address-dialog .address-result.is-suggestion small{color:#4b8480} .insung-map-panel{margin-top:16px;border:1px solid #dbeae8;border-radius:15px;overflow:hidden;background:#fbfefd} .insung-map-head{padding:17px 19px;display:flex;justify-content:space-between;align-items:center;gap:10px} .insung-map-overline{display:block;color:#179c94;letter-spacing:1.3px;font-size:9px;font-weight:800} .insung-map-head h3{font-size:15px;margin:3px 0 2px;letter-spacing:-.4px} .insung-map-head p{margin:0;color:#748d8d;font-size:11px} .insung-map-pill{font-size:10px;font-weight:800;color:#288782;background:#ecfaf7;border-radius:40px;padding:7px 11px;white-space:nowrap} .insung-map{height:280px;min-height:280px;background:#edf4f3;position:relative;z-index:0} .insung-map-status{font-size:11px;color:#327b79;padding:12px 17px 4px;margin:0;line-height:1.6} .insung-map-caution{font-size:10px;line-height:1.65;color:#8a9ca0;padding:0 17px 14px;margin:5px 0 0} .insung-map .leaflet-container{font-family:inherit} .insung-map .leaflet-tooltip{font-family:inherit;font-weight:700;font-size:12px} @media(max-width:650px){.insung-map-head{padding:13px}.insung-map-head h3{font-size:14px}.insung-map-head p{font-size:10px}.insung-map-pill{font-size:9px;padding:6px}.insung-map{height:235px;min-height:235px}.insung-map-status,.insung-map-caution{padding-left:12px;padding-right:12px}} .insung-map-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;background:linear-gradient(135deg,#f0f9f7,#e9f3f2);color:#66918b;text-align:center;padding:12px;pointer-events:none} .insung-map-placeholder span{font-size:36px;line-height:1.3;color:#2eada1} .insung-map-placeholder strong{font-size:12px;color:#3c746e} .insung-map-placeholder small{font-size:10px;color:#86a4a0} /* V28 OK-style single-column refresh */ body{background:#f7f8f9;color:#21313b} .site-head{position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid #eceff1;box-shadow:0 2px 18px rgba(18,40,48,.04)} .head-inner{max-width:1140px;height:74px;gap:26px} .brand{min-width:auto;gap:14px} .brand-emblem{width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#243145,#1a2431)} .brand strong{font-size:17px} .brand small{font-size:9px;letter-spacing:1.7px} .topnav{gap:28px;flex:1;justify-content:center} .topnav a{font-size:14px;font-weight:700;color:#61737a} .topnav a.active,.topnav a:hover{color:#15a8a0} .topnav a.active:after{bottom:10px;height:2px;background:#22c2b4} .header-cta{margin-left:0} .header-login{padding:7px 14px;border-color:#bfe9e3;background:#fff;color:#4f9d97} .page-bg{background:#f7f8f9} .page-shell{max-width:1140px;padding:22px 20px 80px} .order-hero{margin-bottom:18px;padding:8px 2px 2px} .order-hero h1{font-size:28px;letter-spacing:-1.2px} .order-hero .subtitle{font-size:13px;max-width:620px} .layout{display:block} .main-column{gap:18px} .side-column{display:none} .sheet{border-radius:26px;padding:28px 26px;border:1px solid #e8eded;box-shadow:0 10px 30px rgba(18,37,43,.04)} .section-head{margin-bottom:18px;align-items:flex-start} .step{font-size:34px;line-height:1;color:#22c1b5;letter-spacing:-1px;min-width:36px} .section-head h2{font-size:34px;letter-spacing:-1.3px;line-height:1.15} .section-head p{font-size:13px;color:#7f8f95;margin-top:6px} .tab-switch{width:190px;padding:4px;border-radius:999px;background:#eff1f3;margin:8px 0 18px} .tab{padding:11px 10px;border-radius:999px;font-size:13px;font-weight:800} .tab.selected{background:#15181c;color:#fff;box-shadow:none} .vehicle-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px} .vehicle{min-height:176px;border-radius:18px;padding:16px 12px;background:linear-gradient(180deg,#fafbfc,#f3f4f6);border-color:#eceef0} .vehicle:hover{transform:none;border-color:#8edfd6} .vehicle.chosen{background:linear-gradient(160deg,#36d1bc,#12b9b0);box-shadow:0 12px 28px rgba(18,185,176,.18)} .vehicle-type{top:12px;left:12px;border-radius:999px;padding:4px 9px;background:rgba(0,0,0,.22);font-size:10px} .vehicle-icon{height:86px;padding-top:28px;font-size:44px} .vehicle strong{font-size:14px} .vehicle small{font-size:10px;opacity:.92} .truck-shape-field{margin-top:14px;padding:16px 18px;border:1px solid #e7eded;border-radius:18px;background:#fcfdfd;grid-template-columns:100px minmax(160px,230px) 1fr auto} .divider-line{margin:24px 0 16px} .field-top{margin-bottom:14px} .subhead{font-size:15px} .hint{font-size:11px} .quiet{font-size:12px} .item-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px} .item{padding:12px 10px;border-radius:16px;background:#f9fafb;border:1px solid #edf0f2} .item>span{font-size:40px;line-height:60px} .item>strong{font-size:13px} .counter{margin-top:12px;border-radius:10px} .counter button{width:32px;height:32px} .form-card,.address-card{padding:24px;border-radius:22px;border-color:#eaeeee;background:#fff} .mini-title{font-size:17px;margin-bottom:18px} .mini-icon{padding:6px 9px;border-radius:999px} .tag{border-radius:999px;padding:5px 10px} .form-field label,.reservation label{font-size:12px;margin-bottom:7px} input,select,textarea{min-height:48px;border-radius:14px;border-color:#e5ebee;background:#fff;padding:13px 14px} textarea{min-height:110px} .address-search{gap:8px} .address-search input{background:#fff} .address-search button{background:#fff;border:1px solid #dbe8ea;color:#5d7278;min-width:48px;padding:0 12px} .address-completion-note{font-size:11px;color:#7f9399;margin:10px 2px 12px} .notice{margin-top:14px;border-radius:16px;background:#f5fbfa;padding:14px 16px} .address-cards{margin-top:14px;align-items:start} .choice-row{max-width:340px} .choice{border-radius:14px;background:#f4f6f7;border-color:#eceeef;font-weight:800;color:#7d8991} .choice.chosen{background:#fff;border-color:#28c3b7;color:#14a9a1;box-shadow:inset 0 0 0 1px #28c3b7} .reservation{margin-top:10px;padding-top:10px} #address-section .two-cols{gap:16px} #quote-section .two-cols{gap:18px} .quote-display{border-radius:24px;padding:24px 26px;background:linear-gradient(135deg,#10363e 0%,#12444f 40%,#15535d 100%)} .quote-label{margin-bottom:14px} .pill{background:rgba(44,233,210,.12);border-color:rgba(44,233,210,.24);color:#b1fff1} .quote-three{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:12px;align-items:stretch} .quote-bound,.quote-middle{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);border-radius:18px;padding:20px 18px;text-align:center;display:flex;flex-direction:column;justify-content:center} .quote-bound small,.quote-middle small{display:block;font-size:12px;color:#b5d5d7;margin-bottom:10px} .quote-bound strong{font-size:24px;line-height:1.2} .quote-middle strong{font-size:42px;line-height:1.1;letter-spacing:-1.4px} .quote-middle span{display:block;margin-top:10px;font-size:12px;color:#83d7d0} .quote-actions{grid-template-columns:1.15fr .85fr;margin-top:16px} .primary,.secondary{border-radius:14px;min-height:54px} .secondary{background:#fff;border-color:#dce8ea} .distance-diagnostic{margin-top:18px;border-radius:22px;padding:20px} .route-overview{border-radius:18px;padding:18px} .route-overview>strong{font-size:26px} .distance-controls input{min-height:42px} .submit-panel{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;margin-top:18px;padding:18px 20px;border:1px solid #e8eeee;border-radius:20px;background:#fbfcfc} .submit-panel .consent-row{justify-self:end} .submit-help{grid-column:1/-1;margin:0;font-size:11px;color:#819196} .footer{background:#13191f;color:#fff;padding:44px 20px;margin-top:18px} .footer>div,.footer p{max-width:1140px;margin-left:auto;margin-right:auto} .footer strong{font-size:30px;display:block;margin-bottom:6px} .footer span{color:#90a4ad} .footer p{color:#b6c0c5;margin-top:12px;font-size:12px} @media (max-width:1080px){ .page-shell{padding:18px 16px 70px} .vehicle-grid,.item-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .quote-three{grid-template-columns:1fr} .submit-panel{grid-template-columns:1fr} .submit-panel .consent-row{justify-self:start} } @media (max-width:760px){ .head-inner{height:68px;padding:0 14px;gap:10px} .topnav{display:none} .header-login{font-size:11px;padding:6px 10px} .order-hero{padding-top:6px;margin-bottom:12px} .order-hero h1{font-size:22px} .order-hero .subtitle{font-size:12px} .sheet{padding:22px 16px;border-radius:20px} .section-head{gap:10px;margin-bottom:16px} .step{font-size:26px} .section-head h2{font-size:18px;line-height:1.25} .section-head p{font-size:12px} .vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .two-cols,.three-cols,.address-cards{grid-template-columns:1fr} .truck-shape-field{grid-template-columns:1fr;gap:10px;padding:14px} .quote-display{padding:20px 16px;border-radius:20px} .quote-middle strong{font-size:34px} .quote-bound strong{font-size:22px} .quote-actions{grid-template-columns:1fr} .footer{padding:34px 16px 42px} .footer strong{font-size:26px} } /* V29: 주소검색 팝업 내부 지도 및 정확한 건물주소 UI. 본문에는 지도를 표시하지 않습니다. */ .insung-map-panel[hidden],.ia-postcode-shell[hidden]{display:none!important} .address-dialog .ia-choice-tools{display:flex;flex-direction:column;gap:6px;margin:12px 0 14px} .address-dialog .ia-postcode-start{border:1px solid #bde3de;background:#e9f8f5;color:#087d76;border-radius:11px;padding:12px 15px;font-weight:800;font-size:12px;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:8px} .address-dialog .ia-postcode-start span{font-size:10px;color:#68918d;font-weight:600} .address-dialog .ia-choice-tools p{font-size:10px;color:#8a9a9f;margin:0 1px;line-height:1.5} .address-dialog .ia-postcode-shell{border:1px solid #dce9ea;border-radius:12px;background:#fff;padding:10px;margin:10px 0} .address-dialog .ia-postcode-head{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:4px 4px 10px} .address-dialog .ia-postcode-head strong{font-size:13px} .address-dialog .ia-postcode-head button{border:1px solid #d2e8e6;background:#f4faf9;color:#237d77;border-radius:8px;padding:8px 10px;font-size:11px;font-weight:700} .address-dialog .ia-postcode-embed{width:100%;height:420px;min-height:320px} .address-dialog .ia-postcode-note{font-size:10px;color:#899ba1;line-height:1.6;margin:8px 4px 0} .address-dialog .ia-map-panel{margin:13px 0 6px;border-radius:12px;overflow:hidden} .address-dialog .ia-map-panel .insung-map-head{padding:12px 14px} .address-dialog .ia-map-panel .insung-map-head h3{font-size:13px} .address-dialog .ia-map-panel .insung-map-head p{font-size:10px} .address-dialog .ia-map-panel .insung-map{height:220px;min-height:220px} .address-dialog .ia-map-panel .insung-map-status{padding:9px 13px 2px;line-height:1.5;font-size:10px} .address-dialog .ia-map-panel .insung-map-caution{padding:0 13px 12px;margin-top:4px;font-size:9px} .address-dialog .ia-result-row{display:flex;gap:8px;align-items:stretch} .address-dialog .ia-result-row>.address-result{flex:1;min-width:0} .address-dialog .ia-location-btn{flex:0 0 auto;align-self:stretch;border:1px solid #c5e8e4;background:#f4fbf9;color:#208780;font-size:11px;font-weight:800;padding:8px 10px;border-radius:10px;min-width:85px} .address-dialog .ia-location-btn:hover,.address-dialog .ia-location-btn:focus-visible{background:#e6f7f3} @media(max-width:650px){ .address-dialog .ia-choice-tools{margin:9px 0 11px} .address-dialog .ia-postcode-start{display:block;line-height:1.5;font-size:11px} .address-dialog .ia-postcode-start span{display:block} .address-dialog .ia-postcode-embed{height:345px;min-height:300px} .address-dialog .address-result-list{max-height:23dvh} .address-dialog .ia-map-panel .insung-map{height:175px;min-height:175px} .address-dialog .ia-map-panel .insung-map-head{padding:10px 11px} .address-dialog .ia-map-panel .insung-map-head p{font-size:9px} .address-dialog .ia-result-row{gap:5px} .address-dialog .ia-result-row>.address-result{padding:10px!important} .address-dialog .ia-location-btn{min-width:69px;padding:6px;font-size:10px} } /* 2026-11-01: 독자적인 블루 운임 카드 + 카카오 주소검색 */ #quote-section .quote-display{position:relative;overflow:hidden;background:linear-gradient(118deg,#0758e6 0%,#146cff 57%,#3d8eff 100%);border-radius:22px;box-shadow:0 15px 40px rgba(13,87,218,.2);isolation:isolate} #quote-section .quote-display:before{content:"";position:absolute;inset:-60% -20%;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.09) 45%,transparent 64%);animation:quoteShimmer 8s ease-in-out infinite;z-index:-1;pointer-events:none} #quote-section .quote-display:after{content:"";position:absolute;right:-100px;top:-150px;width:360px;height:360px;background:radial-gradient(circle,rgba(211,233,255,.19),transparent 70%);pointer-events:none;z-index:-1} #quote-section .quote-three{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:14px;align-items:center;margin:22px 0} #quote-section .quote-bound,#quote-section .quote-middle{background:transparent;border:0;box-shadow:none;color:#fff;text-align:center} #quote-section .quote-bound{padding:16px 5px} #quote-section .quote-middle{padding:18px 3px} #quote-section .quote-bound strong{display:block;font-size:clamp(20px,2.7vw,33px);letter-spacing:-1px;white-space:nowrap;color:#fff;font-weight:900} #quote-section .quote-middle strong{display:block;font-size:clamp(30px,4.5vw,58px);font-weight:900;letter-spacing:-2px;color:#fff;line-height:1.22;white-space:nowrap;font-variant-numeric:tabular-nums} #quote-section .quote-middle small,#quote-section .quote-bound small{font-size:12px;color:#dbeaff;font-weight:700} #quote-section .quote-middle span{font-size:11px;color:#c7e0ff} #quote-section .quote-explain{color:#d8eaff;font-size:11px} #quote-section .quote-label .pill{color:#fff;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3)} #quote-section .quote-label .quiet{color:#d8eaff} .animated-quote-progress{height:7px;width:100%;border-radius:30px;overflow:hidden;background:rgba(255,255,255,.28);margin-top:18px} .animated-quote-progress-fill{height:100%;width:0;background:linear-gradient(90deg,#99fbff,#fff);box-shadow:0 0 14px rgba(255,255,255,.65);border-radius:30px;transition:width 1.1s cubic-bezier(.2,.8,.2,1)} .animated-quote-labels{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#e3f1ff;margin-top:7px} .animated-route-caption{font-size:12px;color:#e1efff;margin:14px 0 4px;text-align:center;font-weight:700;overflow-wrap:anywhere} #quote-section .quote-display.q-success{animation:quoteReveal .6s ease-out both} @keyframes quoteReveal{0%{transform:translateY(5px);filter:brightness(1.15)}100%{transform:translateY(0);filter:brightness(1)}} @keyframes quoteShimmer{0%,35%{transform:translateX(-65%)}70%,100%{transform:translateX(65%)}} .kl-dialog{width:min(720px,calc(100vw - 24px));max-height:min(94dvh,900px);padding:0;border-radius:23px;overflow:hidden;background:#fff;border:1px solid #dce5ee;box-shadow:0 26px 100px rgba(8,33,63,.25)} .kl-head{padding:22px 24px 17px;border-bottom:1px solid #edf1f5;display:flex;justify-content:space-between;align-items:center;gap:12px} .kl-head p{font-size:10px;letter-spacing:1.5px;font-weight:900;color:#149f99;margin:0 0 6px} .kl-head h2{font-size:22px;margin:0;letter-spacing:-.7px} #klClose{width:42px;height:42px;border-radius:13px;border:0;background:#eff3f5;font-size:20px;color:#415760} .kl-body{padding:14px 24px 23px;overflow:auto;max-height:calc(94dvh - 100px)} .kl-help{font-size:12px;color:#748893;line-height:1.6;margin:0 0 12px} .kl-postcode{height:450px;border:1px solid #e4eaee;border-radius:13px;overflow:hidden;background:#f8fafb} .kl-address-result{margin-top:14px;padding:15px;border-radius:15px;background:#f4fafb;border:1px solid #dbecea} .kl-address-result[hidden]{display:none!important} .kl-address-result strong{display:block;font-size:14px;color:#173f4b} .kl-address-result small{display:block;font-size:11px;color:#64848d;margin:6px 0 12px} .kl-map{height:218px;border-radius:10px;background:#e6f2f1;overflow:hidden;margin-bottom:13px} .kl-apply,.kl-retry{border:1px solid #cce8e3;border-radius:9px;padding:10px 14px;font-weight:800;font-size:12px} .kl-apply{background:#13b6a9;color:#fff;border-color:#13b6a9} .kl-retry{background:#fff;color:#397c7b;margin-left:7px} .kl-error{color:#bd4646;font-size:12px;line-height:1.6;margin:8px 0 0;white-space:pre-line} @media(max-width:650px){#quote-section .quote-display{padding:19px 13px;border-radius:18px}#quote-section .quote-three{grid-template-columns:1fr 1.4fr 1fr;gap:3px;margin:15px 0 13px}#quote-section .quote-bound{padding:7px 0}#quote-section .quote-bound small,#quote-section .quote-middle small{font-size:9px}#quote-section .quote-bound strong{font-size:clamp(13px,3.7vw,20px);letter-spacing:-.5px}#quote-section .quote-middle strong{font-size:clamp(19px,6vw,32px);letter-spacing:-1px}#quote-section .quote-middle span{font-size:9px}.animated-route-caption{font-size:10px}.kl-dialog{width:calc(100vw - 10px);max-height:95dvh;border-radius:15px}.kl-head{padding:15px}.kl-head h2{font-size:19px}.kl-body{padding:12px;max-height:calc(95dvh - 76px)}.kl-postcode{height:min(60dvh,430px)}.kl-map{height:160px}} @media(prefers-reduced-motion:reduce){#quote-section .quote-display:before{animation:none}#quote-section .quote-display.q-success{animation:none}.animated-quote-progress-fill{transition:none}} /* V31 · 밝은 운송 접수 UI + 실제 인성 운임을 강조하는 독자적인 배차형 블루 카드 */ #quote-section .dispatch-route-strip{display:flex;justify-content:space-between;align-items:center;gap:15px;border:1px solid #bdd7ff;background:linear-gradient(115deg,#f1f6ff,#e9f1ff);border-radius:17px;padding:17px 20px;margin:2px 0 15px} #quote-section .dispatch-route-points{display:flex;align-items:center;gap:11px;flex:1;min-width:0;font-size:13px;color:#163355;font-weight:800} #quote-section .dispatch-route-points span[id]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:40%;display:inline-block} #quote-section .dispatch-pin{width:10px;height:10px;flex:none;border:3px solid #fff;box-shadow:0 0 0 3px #287df6;border-radius:50%;background:#116bf3} #quote-section .dispatch-pin-end{box-shadow:0 0 0 3px #f8a41a;background:#f8a41a} #quote-section .dispatch-route-arrow{flex:none;font-size:21px;color:#8499b6;font-weight:500} #quote-section .dispatch-selected-vehicle{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid #d4e2f8;padding:10px 13px;border-radius:12px;white-space:nowrap;font-size:13px} #quote-section .dispatch-selected-vehicle span{color:#7e91aa;font-size:11px;font-weight:700} #quote-section .dispatch-selected-vehicle strong{color:#0864e9;font-size:14px} #quote-section .dispatch-blue-quote{background:linear-gradient(110deg,#0862ef 0%,#176df6 48%,#3d88fb 100%);border:1px solid rgba(255,255,255,.18);box-shadow:0 20px 43px rgba(9,88,220,.22);padding:32px 36px 23px;border-radius:20px} #quote-section .dispatch-blue-quote:after{width:460px;height:460px;right:-120px;top:-250px;background:radial-gradient(circle,rgba(219,242,255,.17),transparent 72%)} #quote-section .dispatch-blue-quote .quote-label{margin-bottom:5px} #quote-section .dispatch-blue-quote .quote-label .pill{font-size:11px;letter-spacing:.4px;border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.11)} #quote-section .dispatch-quote-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:25px;align-items:center;margin:16px 0 24px} #quote-section .dispatch-quote-range{display:flex;flex-direction:column;gap:12px;justify-content:center;padding:16px 10px 16px 0;min-width:0} #quote-section .dispatch-price-overline{font-size:12px;color:#d7eaff;letter-spacing:.3px;font-weight:800} #quote-section .dispatch-quote-endpoints{display:flex;align-items:baseline;flex-wrap:wrap;gap:7px;color:#fff;font-variant-numeric:tabular-nums} #quote-section .dispatch-quote-endpoints span[id]{font-size:clamp(20px,3vw,35px);font-weight:900;letter-spacing:-1.2px;line-height:1.3;white-space:nowrap} #quote-section .dispatch-quote-endpoints .dispatch-tilde{font-size:19px;color:#d5e9ff} #quote-section .dispatch-range-caption{font-size:11px;color:#cbdfff} #quote-section .dispatch-quote-total{border-left:1px solid rgba(255,255,255,.25);padding:12px 6px 12px 26px;text-align:left} #quote-section .dispatch-quote-total small{font-size:13px;color:#dbeaff;letter-spacing:.2px;margin-bottom:7px} #quote-section .dispatch-quote-total strong{font-size:clamp(36px,5.8vw,65px);letter-spacing:-2.5px;white-space:nowrap;text-align:left;line-height:1.23} #quote-section .dispatch-quote-total span{font-size:11px;color:#dceaff;text-align:left} #quote-section .animated-quote-progress{margin-top:15px;height:8px;background:rgba(255,255,255,.22)} #quote-section .animated-quote-progress-fill{background:linear-gradient(90deg,#d3eaff,#fff)} #quote-section .animated-quote-labels{color:#e7f2ff;margin-top:8px} #quote-section .animated-route-caption{border-top:1px solid rgba(255,255,255,.13);padding-top:15px;margin-top:17px;font-size:12px;letter-spacing:.1px} #quote-section .dispatch-blue-quote .quote-explain{color:#d7e9ff;font-size:10px;text-align:center;margin-top:8px} /* 주소선택과 좌표 지도는 하나의 카카오 팝업에서 함께 표시합니다. */ .kl-dialog{width:min(1060px,calc(100vw - 24px));max-height:min(95dvh,930px);border-radius:23px} .kl-head{padding:20px 26px} .kl-head h2{font-size:23px} .kl-body{padding:18px 24px 22px;max-height:calc(95dvh - 85px)} .kl-search-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:14px;align-items:stretch} .kl-search-column{min-width:0;display:flex;flex-direction:column;gap:12px} .kl-postcode{height:470px;min-height:330px;transition:height .24s ease;background:#fff} .kl-postcode.kl-postcode-chosen{height:300px;min-height:230px} .kl-address-result{margin-top:0;padding:15px 16px;display:block} .kl-address-result[hidden]{display:none!important} .kl-address-result strong{font-size:13px;line-height:1.5} .kl-address-result small{font-size:11px;margin:6px 0 10px;line-height:1.6} .kl-result-actions{display:flex;align-items:center;gap:9px} .kl-result-actions button{margin:0;flex:1;min-height:42px} .kl-location-column{display:flex;flex-direction:column;min-width:0;border:1px solid #e5ecf1;border-radius:15px;background:#f9fcff;padding:13px;min-height:315px} .kl-map-heading{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:5px 3px 13px} .kl-map-heading>div{display:flex;flex-direction:column;gap:3px} .kl-map-heading span:first-child{font-size:9px;letter-spacing:1.3px;color:#399d96;font-weight:800} .kl-map-heading strong{font-size:15px;letter-spacing:-.5px;color:#28404e} .kl-map-badge{border-radius:999px;padding:5px 8px;background:#eaf6f4;color:#168b81;font-size:10px;font-weight:800;white-space:nowrap} .kl-map-stage{position:relative;flex:1;min-height:330px;overflow:hidden;border-radius:12px;background:linear-gradient(140deg,#e9f5f2,#dfedf2)} .kl-map-stage .kl-map{width:100%;height:100%;min-height:330px;border-radius:0;margin:0} .kl-map-placeholder{position:absolute;inset:0;z-index:400;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:15px;color:#7794a3;text-align:center;background:linear-gradient(145deg,#eff9f6,#e6eff5);pointer-events:none} .kl-map-placeholder[hidden]{display:none!important} .kl-map-placeholder>span{font-size:40px;color:#2fb7a9;line-height:1.2;margin-bottom:5px} .kl-map-placeholder strong{font-size:12px;color:#3e6976} .kl-map-placeholder small{font-size:10px;margin-top:5px} .kl-map-hint{margin:9px 3px 0;color:#748b9a;font-size:10px;line-height:1.6;overflow-wrap:anywhere} .kl-error{margin-top:10px} @media(max-width:800px){ #quote-section .dispatch-route-strip{align-items:flex-start;flex-direction:column;padding:13px} #quote-section .dispatch-route-points{width:100%;gap:8px} #quote-section .dispatch-selected-vehicle{align-self:flex-start;padding:6px 11px} #quote-section .dispatch-blue-quote{padding:22px 18px 19px} #quote-section .dispatch-quote-grid{gap:10px} #quote-section .dispatch-quote-endpoints span[id]{font-size:clamp(18px,3.5vw,27px)} #quote-section .dispatch-quote-total{padding-left:14px} #quote-section .dispatch-quote-total strong{font-size:clamp(26px,4.6vw,45px)} .kl-dialog{width:calc(100vw - 14px)} .kl-search-layout{grid-template-columns:1fr} .kl-location-column{min-height:240px} .kl-map-stage,.kl-map-stage .kl-map{min-height:230px;height:230px} .kl-postcode{height:340px;min-height:290px} .kl-postcode.kl-postcode-chosen{height:250px;min-height:220px} } @media(max-width:480px){ #quote-section .dispatch-route-points{font-size:11px;gap:5px} #quote-section .dispatch-route-points span[id]{max-width:42%} #quote-section .dispatch-blue-quote{padding:20px 13px 16px} #quote-section .dispatch-quote-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:5px;margin:14px 0 15px} #quote-section .dispatch-quote-range{padding:8px 3px 8px 0;gap:5px} #quote-section .dispatch-price-overline,#quote-section .dispatch-quote-total small{font-size:10px} #quote-section .dispatch-quote-endpoints{gap:3px} #quote-section .dispatch-quote-endpoints span[id]{font-size:clamp(13px,4.1vw,19px);letter-spacing:-.6px} #quote-section .dispatch-quote-endpoints .dispatch-tilde{font-size:11px} #quote-section .dispatch-range-caption{font-size:9px} #quote-section .dispatch-quote-total{padding:8px 0 8px 11px} #quote-section .dispatch-quote-total strong{font-size:clamp(24px,6.4vw,35px);letter-spacing:-1px} #quote-section .dispatch-quote-total span{font-size:9px} .kl-head{padding:15px 13px} .kl-head h2{font-size:20px} .kl-body{padding:11px;max-height:calc(95dvh - 74px)} .kl-help{font-size:11px;margin-bottom:10px} .kl-location-column{padding:10px} .kl-map-stage,.kl-map-stage .kl-map{height:205px;min-height:205px} .kl-map-heading strong{font-size:13px} .kl-postcode{height:min(49dvh,375px);min-height:260px} .kl-postcode.kl-postcode-chosen{height:230px;min-height:220px} } @media(prefers-reduced-motion:reduce){.kl-postcode{transition:none}} @media(max-width:480px){ #quote-section .dispatch-blue-quote .quote-label{flex-direction:column;align-items:flex-start;gap:8px} #quote-section .dispatch-blue-quote .quote-label .pill{white-space:nowrap;font-size:10px;letter-spacing:0} #quote-section .dispatch-blue-quote .quote-label .quiet{font-size:10px} } /* V32 | 수호천사퀵물류 전용 우주 일러스트 아이콘 18종 인성 요금조회, 주소검색, 선택 이벤트에는 관여하지 않습니다. */ .vehicle-grid .vehicle { overflow:hidden; min-height:198px; isolation:isolate; border:1px solid #dce4f7; background:linear-gradient(150deg,#ffffff 0%,#f3f7ff 66%,#e8eeff 100%); box-shadow:0 4px 12px rgba(50,71,135,.045); } .vehicle-grid .vehicle::before { content:'';position:absolute;inset:0;z-index:-1;pointer-events:none; background-image:radial-gradient(circle at 85% 22%,rgba(127,113,255,.20) 0 2px,transparent 3px), radial-gradient(circle at 19% 30%,rgba(56,198,223,.26) 0 1.5px,transparent 3px), radial-gradient(circle at 72% 64%,rgba(255,216,121,.18) 0 1.5px,transparent 3px); } .vehicle-grid .vehicle.chosen { color:#fff;border-color:#5cfbe4; background:linear-gradient(135deg,#122f65 0%,#176aa3 54%,#13b9b2 100%); box-shadow:0 9px 25px rgba(28,133,203,.19),inset 0 0 0 1px rgba(227,255,251,.3); } .vehicle-grid .vehicle.chosen::before {opacity:.95} .vehicle-grid .vehicle:hover {transform:translateY(-2px);box-shadow:0 12px 26px rgba(78,93,164,.13)} .vehicle-grid .vehicle:focus-visible,.item-grid .counter button:focus-visible{ outline:3px solid #695bff;outline-offset:2px; } .vehicle-grid .vehicle-type {z-index:3;background:#3e5097;color:#fff} .vehicle-grid .vehicle.chosen .vehicle-type {background:rgba(10,26,61,.73)} .vehicle-grid .vehicle-icon { display:flex;align-items:center;justify-content:center; width:100%;height:112px;min-height:112px; margin:18px 0 3px;padding:0; filter:none;opacity:1;overflow:visible; } .vehicle-grid .vehicle-icon img.space-vehicle-art { width:min(100%,210px);height:112px;object-fit:contain; filter:drop-shadow(0 7px 7px rgba(53,53,116,.08)); transition:transform .35s cubic-bezier(.2,.65,.2,1);pointer-events:none; } .vehicle-grid .vehicle:hover .space-vehicle-art {transform:translateY(-4px) scale(1.035)} .vehicle-grid .vehicle.chosen .space-vehicle-art{animation:spaceIconHover 3.4s ease-in-out infinite alternate} .vehicle-grid .vehicle strong {font-size:13px;position:relative;z-index:2} .vehicle-grid .vehicle small {font-size:10px;position:relative;z-index:2} .item-grid .item { background:linear-gradient(160deg,#fff,#f4f7ff);border:1px solid #e0e7f7; border-radius:17px;transition:transform .22s ease,box-shadow .22s ease; } .item-grid .item:hover {transform:translateY(-2px);box-shadow:0 9px 20px rgba(78,93,164,.085)} .item-grid .item>span {display:flex;align-items:center;justify-content:center;height:102px;line-height:normal} .item-grid .space-item-art {display:block;width:min(100%,195px);height:104px;object-fit:contain;pointer-events:none} .item-grid .item>strong {font-size:13px} .icon-panel{width:56px;height:52px;overflow:hidden} .icon-panel .space-vehicle-art {width:100%;height:100%;object-fit:contain} @keyframes spaceIconHover {0%{transform:translateY(0)}100%{transform:translateY(-4px)}} @media(max-width:700px) { .vehicle-grid .vehicle{min-height:158px;padding:12px 7px} .vehicle-grid .vehicle-icon{height:84px;min-height:84px;margin:12px 0 0} .vehicle-grid .vehicle-icon img.space-vehicle-art{height:86px;width:min(100%,166px)} .vehicle-grid .vehicle strong{font-size:12px} .vehicle-grid .vehicle small{font-size:9px;line-height:1.35} .item-grid .item>span{height:83px} .item-grid .space-item-art{height:84px;width:100%} } @media(prefers-reduced-motion:reduce) { .vehicle-grid .vehicle.chosen .space-vehicle-art{animation:none} .vehicle-grid .vehicle:hover .space-vehicle-art{transform:none} } /* [consolidated from space-theme.css] */ /* V33: 수호천사퀵물류 Galaxy Order — layout/theme layer only. The existing address, fare and order JS/PHP is intentionally untouched. */ :root{--space-ink:#e7f1ff;--space-soft:#b8c9f7;--space-cyan:#58f6fa;--space-violet:#bc8bff;--space-stroke:rgba(168,192,255,.37);--space-panel:rgba(20,36,112,.78)} html{scroll-padding-top:80px} body{color:var(--space-ink);background:#090e39;overflow-x:hidden} .page-bg{min-height:100vh;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse 70% 30% at 96% 12%,rgba(57,115,238,.54),transparent 77%),radial-gradient(ellipse 95% 38% at 8% 54%,rgba(80,62,203,.42),transparent 72%),radial-gradient(ellipse 55% 22% at 88% 91%,rgba(64,64,176,.42),transparent 85%),linear-gradient(160deg,#08113c,#141c62 44%,#0d174c 82%,#080f35)} .page-bg:before{content:"";position:absolute;inset:0;z-index:-1;background:url('space-art/starfield.svg') repeat;opacity:.83;pointer-events:none} .page-bg:after{content:"";position:absolute;z-index:-1;width:min(56vw,740px);height:min(56vw,740px);right:-15%;top:30%;border-radius:50%;background:radial-gradient(circle at 34% 30%,rgba(69,225,255,.15),rgba(120,80,230,.17) 42%,transparent 72%);filter:blur(6px);pointer-events:none} .site-head{background:rgba(8,16,64,.94);border-bottom:1px solid rgba(136,182,255,.28);box-shadow:0 9px 30px rgba(3,8,43,.25);backdrop-filter:blur(19px);-webkit-backdrop-filter:blur(19px)} .head-inner{max-width:1510px;height:77px} .brand strong{color:#fff;font-size:19px;text-shadow:0 2px 18px #356bfa65} .brand small{color:#b6caff;letter-spacing:2px} .brand-emblem{width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 30% 23%,#7bfaff,#265ccb 53%,#191d6f);border:1px solid #a2c2ff;box-shadow:0 0 16px #27eaff78,0 0 0 5px #345db530} .brand-emblem:before{content:"";position:absolute;inset:12px -9px;z-index:-1;border:2px solid #e1bd79;border-radius:50%;transform:rotate(-28deg)} .brand-emblem span{background:#fff5a0} .topnav a{color:#cbd7fb;font-size:13px} .topnav a.active,.topnav a:hover{color:#8ffcff;text-shadow:0 0 12px #5ffcff} .topnav a.active:after{background:#41e6ee;box-shadow:0 0 13px #3cf5fb} .header-cta.header-login{border-color:rgba(151,222,255,.48);background:rgba(29,72,140,.42);color:#d5eaff;font-size:10px} .page-shell{max-width:1510px;padding:27px 22px 90px} .space-hero{position:relative;display:flex;overflow:hidden;min-height:212px;align-items:center;justify-content:space-between;gap:28px;margin:0 0 18px;border:1px solid rgba(134,166,249,.46);border-radius:28px;background:radial-gradient(ellipse at 78% 105%,rgba(53,135,255,.52),transparent 52%),linear-gradient(110deg,rgba(8,19,77,.98),rgba(25,49,124,.85) 59%,rgba(52,59,160,.88));box-shadow:0 16px 36px rgba(3,8,43,.3),inset 0 1px 0 rgba(255,255,255,.12)} .space-hero:before{content:"";position:absolute;inset:0;background:url('space-art/starfield.svg') center/900px repeat;opacity:.62;pointer-events:none} .space-hero-copy{position:relative;z-index:2;padding:25px 35px;max-width:770px;min-width:0} .space-hero .eyebrow{color:#98f6ff;font-size:10px;letter-spacing:2px} .space-hero h1{color:#fff;margin:4px 0 7px;font-size:clamp(25px,3.1vw,43px);line-height:1.22;text-shadow:0 5px 20px rgba(0,9,40,.52)} .space-hero h1 em{font-style:normal;background:linear-gradient(100deg,#8cfaff,#aeaeff,#fff);color:transparent;background-clip:text;-webkit-background-clip:text} .space-hero-rocket{font-size:.7em;color:#f9dc93;margin-right:4px} .space-hero .subtitle{color:#d5e7ff;font-size:12px;max-width:590px;margin:0} .space-hero-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px} .space-hero-badges > span{color:#d7faff;border:1px solid #8ee4ff3a;background:#3d87d525;border-radius:999px;font-size:10px;padding:4px 11px} .space-hero .status{margin-top:12px;display:inline-flex;align-items:center;gap:4px;border:1px solid rgba(109,239,227,.4);background:#0b464c88;color:#b6fff5;font-size:10px;padding:5px 11px} .space-hero .status-dot{background:#5bffce;box-shadow:0 0 12px #42ffb5} .space-hero-mascot{position:absolute;pointer-events:none;right:20px;bottom:-96px;width:min(40%,460px);height:auto;z-index:1;filter:drop-shadow(0 0 25px #4e89d95e)} /* Actual two-column page composition matching mockup. */ .layout.cosmic-dashboard{display:grid!important;grid-template-columns:minmax(0,1.82fr) minmax(360px,1fr)!important;gap:16px!important;align-items:start} .cosmic-left,.cosmic-right{display:flex!important;flex-direction:column;min-width:0;gap:16px} .layout.cosmic-dashboard>.side-column{display:none!important} .cosmic-dashboard .sheet{position:relative;margin:0!important;padding:22px 22px 25px;border:1px solid var(--space-stroke);border-radius:23px;background:linear-gradient(135deg,rgba(28,47,123,.94),rgba(24,36,96,.91) 55%,rgba(32,37,115,.96));box-shadow:0 13px 36px rgba(2,6,41,.24),inset 0 1px 0 rgba(255,255,255,.1);color:var(--space-ink);min-width:0} .cosmic-dashboard .sheet:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(100deg,rgba(117,171,255,.075),transparent 45%,rgba(160,113,255,.04));z-index:0} .cosmic-dashboard .sheet>*{position:relative;z-index:1} .cosmic-dashboard .section-head{gap:10px;align-items:center;margin-bottom:15px} .cosmic-dashboard .section-head .step{border:1px solid #70effd;background:linear-gradient(140deg,#1289dd,#1b3a9c);box-shadow:0 0 13px rgba(73,231,255,.33);color:white;min-width:40px;min-height:36px;display:grid;place-items:center;border-radius:11px;padding:5px 7px;font-size:20px;line-height:1} .cosmic-dashboard .section-head h2{font-size:21px;letter-spacing:-.7px;color:#fff;text-shadow:0 2px 10px #0c144faa} .cosmic-dashboard .section-head p{font-size:11px;color:#c0cff5;line-height:1.6} .cosmic-dashboard .subhead{color:#eaf1ff} .cosmic-dashboard .hint,.cosmic-dashboard .field-help,.cosmic-dashboard .quiet{color:#a7c1f0} .cosmic-dashboard .quiet strong{color:#6cf9f4} .cosmic-dashboard .divider-line{border-color:rgba(173,201,255,.19);margin:18px 0 15px} .cosmic-dashboard .tab-switch{background:#132355a8;border:1px solid rgba(147,177,240,.24);width:min(100%,280px);padding:3px;border-radius:999px} .cosmic-dashboard .tab{color:#cfddff;border-radius:999px;padding:10px 13px} .cosmic-dashboard .tab.selected{background:linear-gradient(105deg,#00b6e5,#2149d0,#8853ed);color:#fff;box-shadow:0 0 13px #51dfff8c} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px} .cosmic-dashboard .vehicle-grid .vehicle{background:linear-gradient(150deg,rgba(49,67,148,.83),rgba(34,44,103,.91));border:1px solid rgba(176,206,255,.36);border-radius:15px;min-height:152px;padding:10px 5px;color:#f7faff;box-shadow:inset 0 1px 0 #ffffff20;transition:transform .22s,box-shadow .22s,border-color .22s} .cosmic-dashboard .vehicle-grid .vehicle.chosen{border-color:#5ffff0;background:linear-gradient(165deg,#139bac,#0a428e 70%,#1d2770);box-shadow:0 0 0 2px #6bffff77,0 0 27px #29e7f67a,inset 0 0 30px #13f5e026} .cosmic-dashboard .vehicle-grid .vehicle:before{background:radial-gradient(circle,rgba(96,132,255,.30),rgba(136,101,255,.06) 60%,transparent 72%);border-radius:50%;opacity:1} .cosmic-dashboard .vehicle-grid .vehicle.chosen:before{background:radial-gradient(circle,#80cfff52,transparent 72%)} .cosmic-dashboard .vehicle-grid .vehicle-type{font-size:10px;padding:2px 7px;border-radius:99px;background:#5263aa;color:white} .cosmic-dashboard .vehicle-grid .vehicle.chosen .vehicle-type{background:#0b2e73;color:white} .cosmic-dashboard .vehicle-grid .vehicle-icon{height:77px;min-height:77px;margin:10px 0 2px;padding:0;filter:none;opacity:1} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{width:100%;max-width:139px;height:100%;object-fit:contain;filter:drop-shadow(0 5px 5px #030b386e)} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:12px;color:#fff;line-height:1.3} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:9px;line-height:1.4;color:#c9d5ff} .cosmic-dashboard .truck-shape-field{background:#192b6e8c;border-color:#8aaaf13d;grid-template-columns:75px minmax(120px,160px) 1fr;gap:10px;padding:13px 14px;margin:13px 0} .cosmic-dashboard .truck-shape-field label{color:#f1f6ff} .cosmic-dashboard .truck-shape-field p{color:#bdc9ec;font-size:10px} .cosmic-dashboard .vehicle-code-check{grid-column:3;justify-self:end;padding:8px 10px;background:#21468da1;border:1px solid #64cbff86;color:#c3faff} .cosmic-dashboard .vehicle-code-status{grid-column:1/-1;color:#bdd3ff} .cosmic-dashboard .field-top .subhead{font-size:15px} .cosmic-dashboard .item-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px} .cosmic-dashboard .item-grid .item{background:linear-gradient(140deg,#2a428ca0,#293172c4);border:1px solid #acbff64a;border-radius:15px;color:white;min-width:0;padding:10px 7px} .cosmic-dashboard .item-grid .item>span{height:76px;line-height:normal;display:grid;place-items:center} .cosmic-dashboard .item-grid .space-item-art{height:77px;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 8px #080a3666)} .cosmic-dashboard .item-grid .item>strong{color:#fff;font-size:12px} .cosmic-dashboard .counter{background:#1a2a6999;border-color:#ffffff21;border-radius:99px;max-width:115px;margin:8px auto 0} .cosmic-dashboard .counter b{color:#fff} .cosmic-dashboard .counter button{border-radius:50%;background:#3c4d9c;color:#e5eefe} .cosmic-dashboard .counter button:hover{background:#0cc9d5;color:#fff} .cosmic-dashboard input,.cosmic-dashboard textarea,.cosmic-dashboard select{background:#eef3ff;color:#15245a;border:1px solid #b9c9f1;border-radius:11px;min-height:42px;padding:10px 12px;font-size:12px} .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{color:#7886ae;font-size:11px} .cosmic-dashboard input:focus,.cosmic-dashboard textarea:focus,.cosmic-dashboard select:focus{border-color:#29dff9;box-shadow:0 0 0 3px #50e9ff3a} .cosmic-dashboard .form-card{background:linear-gradient(135deg,#263c87b3,#1e3178ac);border-color:#a0b9f945;border-radius:16px;padding:16px} .cosmic-dashboard .mini-title,.cosmic-dashboard .form-field label,.cosmic-dashboard .reservation label{color:#ecf5ff} .cosmic-dashboard .mini-title{font-size:13px} .cosmic-dashboard .mini-icon{background:linear-gradient(120deg,#13c5ec,#6573dc);color:#fff} .cosmic-dashboard .tag{background:#474da09e;color:#d8dcff} .cosmic-dashboard .address-completion-note{color:#a9caff} .cosmic-dashboard .address-search button{background:linear-gradient(130deg,#286ad9,#594cdc);color:#fff;border:1px solid #88b6ff;border-radius:10px} .cosmic-dashboard .address-search input{background:#f1f5ff} .cosmic-dashboard .notice{background:#183267b3;border:1px solid #8fa8f140;color:#c1d7ff;border-radius:12px} .cosmic-dashboard .insung-map-panel{display:none!important} /* the legacy large map stays only inside the old search dialog if needed */ .cosmic-dashboard .choice-row{max-width:none} .cosmic-dashboard .choice{background:#24346ca1;color:#d4e5ff;border:1px solid #a2c0ff5e;border-radius:12px;font-size:12px;padding:12px 9px} .cosmic-dashboard .choice.chosen{background:linear-gradient(100deg,#1577ce,#0ccfd0);border-color:#74f8f8;color:#fff;box-shadow:0 0 19px #0cbdf84d} .cosmic-dashboard .reservation{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .cosmic-dashboard .reservation label{grid-row:auto} .cosmic-dashboard .reservation input{width:100%;min-width:0} .cosmic-dashboard .cosmic-payment-pills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:10px} .cosmic-dashboard .cosmic-pay{min-height:39px;border:1px solid #93b1f76e;background:#263c8799;color:#d8e5ff;border-radius:10px;font-size:11px;font-weight:800;padding:6px 5px} .cosmic-dashboard .cosmic-pay.is-active{border-color:#6dfefe;background:linear-gradient(125deg,#0d759d,#1676bb,#5147c1);color:#fff;box-shadow:0 0 16px #4becfb70} .cosmic-dashboard #payment{display:block} .cosmic-dashboard .field-help{font-size:10px;line-height:1.5} .cosmic-dashboard .cosmic-live-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0} .cosmic-dashboard .cosmic-live-facts div{border:1px solid #728ddd5a;border-radius:10px;background:#10255ba1;padding:10px;min-width:0} .cosmic-dashboard .cosmic-live-facts span{color:#a4bee9;display:block;font-size:10px} .cosmic-dashboard .cosmic-live-facts strong{color:#f1f8ff;display:block;overflow-wrap:anywhere;font-size:11px;margin-top:4px} .cosmic-dashboard .dispatch-route-strip{border:1px solid #6a9afa7d;background:#0d286da1;color:#ecf5ff;border-radius:12px;padding:13px;flex-wrap:wrap;box-shadow:inset 0 1px 0 #ffffff20} .cosmic-dashboard .dispatch-route-points{gap:6px} .cosmic-dashboard #dispatchStart,.cosmic-dashboard #dispatchEnd{overflow-wrap:anywhere;color:#d9eaff} .cosmic-dashboard .dispatch-selected-vehicle{color:#daf5ff} .cosmic-dashboard #quote-section .quote-display{position:relative;overflow:hidden;isolation:isolate;padding:22px 17px 18px;border:1px solid #7b8bfa;border-radius:18px;background:radial-gradient(ellipse at 100% 30%,#7351d65b,transparent 55%),linear-gradient(145deg,#101d59,#20317e 62%,#30257c);box-shadow:0 9px 30px #050b4180,inset 0 0 25px #6ca3ff1c;color:#fff} .cosmic-dashboard #quote-section .quote-display:before{content:"";position:absolute;inset:0;z-index:-1;background:url('space-art/starfield.svg') repeat;opacity:.6;pointer-events:none;animation:none} .cosmic-dashboard #quote-section .quote-display:after{content:"";width:250px;height:250px;position:absolute;right:-125px;bottom:-170px;background:radial-gradient(circle at 30% 30%,#84acff,#614dcc 50%,#1b155b 80%);border-radius:50%;opacity:.72;z-index:-1;top:auto;pointer-events:none} .cosmic-dashboard .quote-label{align-items:start} .cosmic-dashboard .quote-label .pill{background:#284b9e7e;border:1px solid #67c5fa;color:#b5fbff;font-size:10px} .cosmic-dashboard #quote-section .quote-label .quiet{font-size:9px;color:#b6ccf3} .cosmic-dashboard #quote-section .quote-three{display:flex;flex-direction:column;gap:10px;align-items:stretch;margin:16px 0 12px} .cosmic-dashboard #quote-section .dispatch-quote-grid .dispatch-quote-range{order:2;min-width:0;width:100%;padding:10px 12px;border:1px solid #9abfff4a;border-radius:12px;background:#233c86ad} .cosmic-dashboard #quote-section .dispatch-quote-range small{color:#c6d6ff} .cosmic-dashboard #quote-section .dispatch-quote-endpoints{color:#fff;display:flex;gap:6px;align-items:center;flex-wrap:wrap} .cosmic-dashboard #quote-section .dispatch-quote-total{order:1;display:flex;flex-direction:column;align-items:start;text-align:left;border:0;background:transparent;padding:4px 4px 12px} .cosmic-dashboard #quote-section .dispatch-quote-total small{font-size:11px;color:#b3e9ff} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:clamp(29px,3.2vw,49px);color:#fff;text-shadow:0 0 25px #27e2ffa4;line-height:1.2} .cosmic-dashboard #quote-section .dispatch-quote-total span{color:#b6e5ff;font-size:10px} .cosmic-dashboard #quote-section .animated-quote-progress{height:8px;background:#203d83;border-radius:99px} .cosmic-dashboard #quote-section .animated-quote-progress-fill{background:linear-gradient(90deg,#1ae7f3,#76a9ff,#cf83ff);box-shadow:0 0 12px #56eafb} .cosmic-dashboard #quote-section .animated-quote-labels,.cosmic-dashboard #quote-section .animated-route-caption,.cosmic-dashboard #quote-section .quote-explain{color:#cfdbfb;font-size:10px} .cosmic-dashboard #quote-section .quote-explain{border-top:1px solid #afc2ff3a;margin-top:10px;padding-top:10px} .cosmic-dashboard .quote-actions{grid-template-columns:1fr 1fr;gap:9px} .cosmic-dashboard .primary,.cosmic-dashboard .secondary{border-radius:12px;min-height:46px;font-size:12px} .cosmic-dashboard .primary{background:linear-gradient(105deg,#03d9f1,#277bff 46%,#8d51e1);border:1px solid #b4f9ff;box-shadow:0 0 20px #36c9fb67;color:#fff;text-shadow:0 1px 3px #1c2b7899} .cosmic-dashboard .primary:not(:disabled):hover{background:linear-gradient(110deg,#47f0ed,#347aff 48%,#c387ff);filter:brightness(1.07)} .cosmic-dashboard .secondary{background:#203879a6;border:1px solid #98bafa;color:#dbebff} .cosmic-dashboard .distance-diagnostic{background:#172b6fa8;border-color:#94b5fa5c;color:#dae9ff;border-radius:15px} .cosmic-dashboard .distance-diagnostic p{color:#bcd1f1} .cosmic-dashboard .submit-panel{display:flex;flex-direction:column;align-items:stretch;gap:9px;padding:15px;background:linear-gradient(155deg,#1f3681a8,#253274a8);border:1px solid #94b2ff65;border-radius:15px} .cosmic-dashboard .submit-panel strong{color:#fff;font-size:14px} .cosmic-dashboard .submit-panel p{font-size:10px;color:#c1d1fa} .cosmic-dashboard .submit-panel label{color:#e5edff;font-size:10px} .cosmic-dashboard .submit-panel input[type=checkbox]{width:17px;height:17px;min-height:17px;vertical-align:middle;accent-color:#12d6f3} .cosmic-dashboard #registerButton{font-size:15px;min-height:54px} .cosmic-dashboard #registerButton:disabled{opacity:.55;box-shadow:none} .cosmic-dashboard .submit-panel .submit-help{color:#b6c8ee} .cosmic-dashboard .feedback{color:#bcd8ff;line-height:1.65} .cosmic-dashboard .feedback.error{color:#ffb3b9} .cosmic-dashboard .field-help{color:#adbee5} .cosmic-dashboard #payment{display:block} .cosmic-dashboard .address-cards{gap:9px;margin:12px 0} .cosmic-dashboard .address-cards>.address-card{min-width:0} .cosmic-dashboard .address-card .three-cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px} .cosmic-dashboard .address-card .three-cols input{min-width:0;padding:8px 6px;font-size:11px} .cosmic-dashboard .address-card .three-cols label{font-size:10px} .cosmic-dashboard .form-field label{font-size:11px} .cosmic-dashboard .form-field label em{color:#c1ceee} .footer{background:#071135;color:#d7e3ff;border-top:1px solid #8daaff40} .footer strong{color:#fff} .footer span,.footer p{color:#a8bde8} /* Keep important dialogs LIGHT so Kakao postcode search, map markers and contrast remain readable. */ #kakaoLiveDialog,#insungAddressDialog,#previewDialog{color:#1d2a43;background:#fff} #kakaoLiveDialog input,#kakaoLiveDialog select,#kakaoLiveDialog textarea,#insungAddressDialog input,#previewDialog input{color:#152b4f} #kakaoLiveDialog .kl-map-placeholder{color:#465572} /* Respect hidden states. */ .cosmic-dashboard .hidden,.cosmic-dashboard [hidden],#kakaoLiveDialog [hidden],#insungAddressDialog [hidden]{display:none!important} /* Restrict glows to interactive state and honor user's reduced-motion preference. */ @keyframes cosmosFloat{0%{transform:translateY(0)}100%{transform:translateY(-8px)}} @keyframes cosmosTwinkle{0%,100%{opacity:.62}50%{opacity:1}} .space-hero-mascot{animation:cosmosFloat 5s ease-in-out infinite alternate} @media(min-width:1400px){.cosmic-dashboard .vehicle-grid .vehicle{min-height:163px}.cosmic-dashboard .vehicle-grid .vehicle-icon{height:86px;min-height:86px}} @media(max-width:1200px){ .layout.cosmic-dashboard{grid-template-columns:minmax(0,1.6fr) minmax(315px,1fr)!important} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .cosmic-dashboard .item-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .cosmic-dashboard .truck-shape-field{grid-template-columns:1fr 1fr} .cosmic-dashboard .truck-shape-field p,.cosmic-dashboard .vehicle-code-check{grid-column:1/-1;justify-self:start} .cosmic-dashboard .address-cards{grid-template-columns:1fr} } @media(max-width:980px){ .layout.cosmic-dashboard{display:flex!important;flex-direction:column;gap:14px!important} .cosmic-left,.cosmic-right{width:100%} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(5,minmax(0,1fr))} .cosmic-dashboard .item-grid{grid-template-columns:repeat(5,minmax(0,1fr))} .cosmic-dashboard .address-cards{grid-template-columns:repeat(2,minmax(0,1fr))} .space-hero-mascot{width:43%;right:-20px} } @media(max-width:650px){ .head-inner{height:64px;padding:0 12px} .head-inner .brand strong{font-size:14px} .head-inner .brand small{font-size:8px;letter-spacing:.8px} .head-inner .brand-emblem{height:37px;width:37px} .head-inner .header-cta{display:none!important} .head-inner .topnav{display:flex;gap:11px} .head-inner .topnav a{font-size:10px} .head-inner .topnav a:nth-child(2),.head-inner .topnav a:nth-child(4){display:none} .page-shell{padding:12px 9px 55px} .space-hero{min-height:154px;margin-bottom:13px;border-radius:17px} .space-hero-copy{padding:14px 13px;max-width:88%} .space-hero .eyebrow{font-size:8px;letter-spacing:.8px} .space-hero h1{font-size:clamp(19px,5.5vw,29px);line-height:1.3} .space-hero .subtitle{font-size:10px;line-height:1.6;width:80%} .space-hero-badges{gap:4px;margin-top:8px} .space-hero-badges > span{font-size:8px;padding:3px 5px} .space-hero .status{font-size:9px;margin-top:7px} .space-hero-mascot{width:57%;right:-62px;bottom:-40px;opacity:.78;filter:drop-shadow(0 0 10px #3c7bee88)} .cosmic-dashboard .sheet{padding:14px 11px 17px;border-radius:16px} .cosmic-dashboard .section-head{gap:9px;margin-bottom:12px} .cosmic-dashboard .section-head .step{min-width:32px;min-height:32px;font-size:15px;border-radius:8px} .cosmic-dashboard .section-head h2{font-size:17px} .cosmic-dashboard .section-head p{font-size:10px} .cosmic-dashboard .tab-switch{width:min(230px,100%);margin-bottom:12px} .cosmic-dashboard .tab{font-size:11px;padding:8px} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .cosmic-dashboard .vehicle-grid .vehicle{min-height:141px;padding:7px 4px} .cosmic-dashboard .vehicle-grid .vehicle-icon{height:69px;min-height:69px;margin:9px 0 3px} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:11px} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:9px} .cosmic-dashboard .item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} .cosmic-dashboard .item-grid .item>span{height:65px} .cosmic-dashboard .item-grid .space-item-art{height:63px} .cosmic-dashboard .form-card{padding:11px;border-radius:12px} .cosmic-dashboard .address-cards{grid-template-columns:1fr} .cosmic-dashboard .two-cols{grid-template-columns:1fr} .cosmic-dashboard .address-card .three-cols{grid-template-columns:repeat(3,minmax(0,1fr))} .cosmic-dashboard .truck-shape-field{grid-template-columns:1fr 1fr;gap:6px;padding:10px} .cosmic-dashboard .truck-shape-field p{grid-column:1/-1} .cosmic-dashboard .vehicle-code-check{grid-column:1/-1} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:34px} .cosmic-dashboard #quote-section .quote-three{display:flex;flex-direction:column} .cosmic-dashboard .cosmic-live-facts{grid-template-columns:1fr 1fr} .cosmic-dashboard .quote-actions{grid-template-columns:1fr 1fr;gap:7px} .cosmic-dashboard .quote-actions button{padding:10px 5px;font-size:11px} .cosmic-dashboard .reservation{grid-template-columns:1fr 1fr} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr))} } @media(max-width:350px){.cosmic-dashboard .quote-actions{grid-template-columns:1fr}.space-hero-badges > span:nth-child(3){display:none}} @media(prefers-reduced-motion:reduce){.space-hero-mascot,.cosmic-dashboard .vehicle-grid .vehicle.chosen .space-vehicle-art{animation:none!important;transition:none!important}} /* ===================================================================== V34 · CINEMATIC SPACE — original artwork kept, ambient motion enhanced Presentation-only layer. No payment, geocoding, fare or order logic. ===================================================================== */ :root{ --cosmos-deep:#070e33; --cosmos-border:rgba(161,218,255,.48); --cosmos-white:#f3f9ff; --cosmos-aura:#60e9f5; } .page-bg{background: radial-gradient(ellipse 76% 36% at 88% 2%,rgba(27,97,203,.42),transparent 77%), radial-gradient(ellipse 65% 38% at 3% 42%,rgba(83,49,193,.34),transparent 76%), radial-gradient(ellipse 53% 40% at 104% 88%,rgba(21,116,169,.26),transparent 85%), linear-gradient(162deg,#070e31 0%,#111d58 44%,#151653 67%,#080e31 100%); } /* fixed cinematic backdrop remains under actual forms/dialogs */ .cosmos-sky-layer{ position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none; contain:layout style paint;isolation:isolate; } .page-bg>.page-shell{position:relative;z-index:1} .cosmos-starlight{position:absolute;inset:-8%;opacity:.62; background-image:url('space-art/starfield.svg');background-size:760px 760px; animation:cosmosStarDrift 95s linear infinite alternate; } .cosmos-starlight:after{content:"";position:absolute;inset:0;opacity:.55; background-image:radial-gradient(2px 2px at 12% 18%,#dbfaff 45%,transparent 85%), radial-gradient(2px 2px at 76% 25%,#f4e8ff 38%,transparent 87%), radial-gradient(3px 3px at 46% 63%,#a9faff 28%,transparent 83%), radial-gradient(2px 2px at 87% 73%,#c4b5ff 35%,transparent 88%), radial-gradient(2px 2px at 21% 84%,#f4ffff 30%,transparent 90%); background-size:510px 430px;animation:cosmosStellarFlicker 8s ease-in-out infinite alternate; } .cosmos-nebula{position:absolute;width:min(88vw,1120px);aspect-ratio:1;filter:blur(32px);opacity:.55;border-radius:50%;will-change:transform;transform:translate3d(0,0,0)} .cosmos-nebula-a{left:-29vw;top:6%;background:radial-gradient(circle,#2e5be755 0%,#573cd144 30%,transparent 70%);animation:cosmosNebulaA 32s ease-in-out infinite alternate} .cosmos-nebula-b{right:-25vw;bottom:-13%;background:radial-gradient(circle,#1594c944 0%,#5147bd3c 40%,transparent 72%);animation:cosmosNebulaB 36s ease-in-out infinite alternate} .cosmos-orbit-glow{position:absolute;right:-25vw;top:16vh;width:65vw;max-width:1000px;aspect-ratio:1;opacity:.32;border:1px solid rgba(126,166,255,.3);border-radius:50%;box-shadow:0 0 70px #5296f73b,inset 0 0 70px #a479ff20;transform:rotate(-24deg)} .cosmos-orbit-glow:before{content:"";position:absolute;inset:14%;border-radius:50%;border:1px dashed #b2d9ff45;animation:cosmosRotate 95s linear infinite} .cosmos-meteor-field{position:absolute;inset:0;overflow:hidden} .cosmos-meteor{position:absolute;display:block;left:108%;top:var(--start-y,20%);width:clamp(110px,12vw,195px);height:2px;opacity:0; transform:translate3d(0,0,0) rotate(-28deg);transform-origin:right center; background:linear-gradient(90deg,transparent 0%,#45a5ff16 14%,#69dfff 67%,#f7ffff 100%); box-shadow:0 0 9px #59dfff80,0 0 20px #5cafff44; animation:cosmosMeteorFly var(--period,14s) linear infinite; animation-delay:var(--delay,0s);will-change:transform,opacity; } .cosmos-meteor:after{content:"";position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:#f5ffff;box-shadow:0 0 8px 2px #b7ffff,0 0 19px 6px #6ec8ff73} .cosmos-meteor:nth-child(1){--start-y:13%;--period:17s;--delay:-6s} .cosmos-meteor:nth-child(2){--start-y:37%;--period:23s;--delay:-19s;width:128px} .cosmos-meteor:nth-child(3){--start-y:61%;--period:20s;--delay:-12s;width:160px} .cosmos-meteor:nth-child(4){--start-y:81%;--period:27s;--delay:-2s;width:106px} @keyframes cosmosMeteorFly{ 0%,6%{opacity:0;transform:translate3d(0,0,0) rotate(-28deg)} 8%{opacity:.92} 15%{opacity:1} 24%,100%{opacity:0;transform:translate3d(-123vw,54vh,0) rotate(-28deg)} } @keyframes cosmosStarDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(24px,-20px,0)}} @keyframes cosmosStellarFlicker{from{opacity:.18}to{opacity:.65}} @keyframes cosmosNebulaA{from{transform:translate3d(-4%,0,0) scale(.95)}to{transform:translate3d(11%,-4%,0) scale(1.13)}} @keyframes cosmosNebulaB{from{transform:translate3d(5%,0,0) scale(.93)}to{transform:translate3d(-10%,-7%,0) scale(1.08)}} @keyframes cosmosRotate{to{transform:rotate(360deg)}} /* Premium hero: moving light from the left, atmospheric rings and planets */ .space-hero{isolation:isolate;border-color:rgba(168,212,255,.64);background: radial-gradient(ellipse 60% 100% at 87% 102%,rgba(83,121,250,.48),transparent 78%), radial-gradient(ellipse 58% 130% at -10% 16%,rgba(29,133,221,.21),transparent 80%), linear-gradient(115deg,rgba(8,17,66,.97),rgba(18,38,106,.9) 59%,rgba(60,49,142,.89)); box-shadow:0 20px 50px #040a3d6b,0 0 0 1px #88f5ff15,inset 0 1px 0 #fff4; } .space-hero:after{content:"";position:absolute;z-index:0;inset:-80% auto -80% -70%;width:52%;pointer-events:none; background:linear-gradient(100deg,transparent 8%,rgba(120,233,255,.02) 25%,rgba(172,232,255,.22) 49%,rgba(239,249,255,.06) 63%,transparent 90%); transform:translateX(-20%) rotate(17deg);animation:cosmosLightSweep 14s ease-in-out infinite; } .space-hero-beam{position:absolute;z-index:1;right:7%;top:27%;width:39%;height:1px;pointer-events:none;opacity:.7;transform:rotate(-14deg); background:linear-gradient(90deg,transparent,#9bf9ffb9,transparent); box-shadow:0 0 15px #55eaff77;animation:cosmosBeamPulse 6s ease-in-out infinite alternate; } .space-hero-orbit{position:absolute;z-index:1;right:6.5%;top:7%;width:300px;height:130px;border:1px solid rgba(171,214,255,.33);border-radius:50%;pointer-events:none;transform:rotate(-21deg); box-shadow:0 0 27px #448bff2b;animation:cosmosHeroOrbit 15s ease-in-out infinite alternate; } .space-hero-orbit:after{content:"";position:absolute;top:31%;left:4%;width:5px;height:5px;background:#dcffff;border-radius:50%;box-shadow:0 0 8px 2px #7af7ff} .space-hero-mascot{filter:drop-shadow(0 0 25px #75abf68b) drop-shadow(0 12px 26px #0713467d); animation:cosmosHeroFloat 7s ease-in-out infinite alternate; } .space-hero h1{font-weight:800;letter-spacing:-1.6px;text-shadow:0 3px 24px #040a40,0 0 22px #9fa9f845} .space-hero h1 em{background:linear-gradient(100deg,#68fff6 0%,#e4faff 34%,#a7a2ff 70%,#fbebff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 10px #4db7ff40)} .space-hero-spark{display:inline-block;color:#a5ffff;text-shadow:0 0 13px #91fff7;animation:cosmosSpark 4s ease-in-out infinite alternate} .space-hero .space-hero-badges > span{box-shadow:inset 0 1px 0 #f4ffff13;backdrop-filter:blur(6px);border-color:#9aefff5f} @keyframes cosmosLightSweep{0%,21%{transform:translateX(-20%) rotate(17deg);opacity:0}31%,52%{opacity:.6}71%,100%{transform:translateX(370%) rotate(17deg);opacity:0}} @keyframes cosmosBeamPulse{from{opacity:.15;transform:rotate(-14deg) translateX(-8px)}to{opacity:.78;transform:rotate(-14deg) translateX(20px)}} @keyframes cosmosHeroOrbit{from{opacity:.3;transform:rotate(-21deg) translateY(0)}to{opacity:.75;transform:rotate(-25deg) translateY(5px)}} @keyframes cosmosHeroFloat{from{transform:translate3d(0,4px,0)}to{transform:translate3d(0,-9px,0)}} @keyframes cosmosSpark{from{opacity:.5;transform:scale(.93)}to{opacity:1;transform:scale(1.14)}} /* Inset edges, living light, and carefully constrained interactive effects */ .cosmic-dashboard .sheet{border-color:rgba(169,208,255,.51);box-shadow:0 20px 48px #03083c66,inset 0 1px 0 rgba(255,255,255,.17);transition:border-color .3s ease,box-shadow .3s ease} .cosmic-dashboard .sheet:hover{border-color:rgba(180,234,255,.7);box-shadow:0 24px 51px #040a3866,0 0 28px #3772c923,inset 0 1px 0 #ffffff32} .cosmic-dashboard .sheet:before{background: linear-gradient(110deg,rgba(123,200,255,.12),transparent 32%,rgba(206,140,255,.05) 73%), radial-gradient(ellipse at 0% 0%,rgba(111,176,255,.1),transparent 53%); animation:cosmosPanelBreath 12s ease-in-out infinite alternate; } @keyframes cosmosPanelBreath{0%{opacity:.48}100%{opacity:1}} .cosmic-dashboard .vehicle-grid .vehicle{box-shadow:inset 0 1px 0 #ffffff30,0 4px 12px #050b3a2c;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease} .cosmic-dashboard .vehicle-grid .vehicle:hover{transform:translateY(-3px);box-shadow:inset 0 1px 0 #fff3,0 14px 21px #07124267,0 0 18px #54ddff4b} .cosmic-dashboard .vehicle-grid .vehicle.chosen{box-shadow:0 0 0 2px #9bffff88,0 0 20px #17e9ff8f,0 0 42px #19d3ef4a,inset 0 0 27px #4affeb28;animation:cosmosChosenGlow 4.8s ease-in-out infinite alternate} .cosmic-dashboard .vehicle-grid .vehicle.chosen .space-vehicle-art{animation:cosmosVehicleFloat 3.9s ease-in-out infinite alternate} @keyframes cosmosChosenGlow{from{box-shadow:0 0 0 2px #9bffff66,0 0 18px #17e9ff5a,inset 0 0 23px #4affeb1c}to{box-shadow:0 0 0 2px #aaffff9a,0 0 24px #3cfffbb0,0 0 41px #1ed5ff54,inset 0 0 34px #4affeb3f}} @keyframes cosmosVehicleFloat{from{transform:translateY(0)}to{transform:translateY(-5px)}} .cosmic-dashboard .item-grid .item{transition:border-color .25s,background .25s,box-shadow .25s,transform .25s} .cosmic-dashboard .item-grid .item:hover{border-color:#9adbf5;background:linear-gradient(150deg,#3856a9ad,#303b9ad5);box-shadow:0 0 23px #497aff3d;transform:translateY(-2px)} .cosmic-dashboard .item-grid .item .space-item-art{transition:transform .26s ease} .cosmic-dashboard .item-grid .item:hover .space-item-art{transform:translateY(-3px) scale(1.045)} .cosmic-dashboard .section-head .step{box-shadow:0 0 15px #45eafa80,inset 0 1px 0 #faffff7a} .cosmic-dashboard .tab.selected,.cosmic-dashboard .cosmic-pay.is-active{position:relative;box-shadow:0 0 21px #2dbafa65,0 0 10px #89fff655,inset 0 1px 0 #fff6} .cosmic-dashboard .primary{background:linear-gradient(105deg,#06d3e9,#2c7dff 48%,#a767ff);background-size:200% 100%;border-color:#b4f7ff;box-shadow:0 0 16px #40e8ff63,inset 0 1px 0 #ffffff80;transition:background-position .7s,transform .24s,box-shadow .24s} .cosmic-dashboard .primary:not(:disabled):hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 0 29px #5ee1ff91,0 6px 17px #071c6570} .cosmic-dashboard .primary:focus-visible,.cosmic-dashboard button:focus-visible{outline:2px solid #aeffff;outline-offset:3px} /* Fare panel aurora: behind text, unobtrusive, zero fictitious amounts */ .cosmic-dashboard #quote-section .quote-display{box-shadow:0 0 0 1px #a8e9ff80,0 10px 34px #050b5180,0 0 33px #3e85fb4d,inset 0 1px 0 #ffffff38} .cosmic-dashboard #quote-section .quote-display:before{background:url('space-art/starfield.svg') center/650px repeat;opacity:.66;animation:cosmosQuoteStars 55s linear infinite alternate} .cosmic-dashboard #quote-section .quote-display:after{animation:cosmosQuotePlanet 10s ease-in-out infinite alternate} .cosmic-dashboard #quote-section .dispatch-quote-total strong{color:#f5ffff;text-shadow:0 0 12px #d4fbffb5,0 0 24px #3fd6ffac,0 0 40px #6e8afa67} .cosmic-dashboard #quote-section .animated-quote-progress-fill{box-shadow:0 0 10px #7cfcff,0 0 19px #79bfff80;background-size:200% 100%;animation:cosmosProgressSheen 6s linear infinite} @keyframes cosmosQuoteStars{from{background-position:0 0}to{background-position:35px 18px}} @keyframes cosmosQuotePlanet{from{transform:translate3d(0,5px,0) scale(.96)}to{transform:translate3d(-8px,-9px,0) scale(1.05)}} @keyframes cosmosProgressSheen{from{background-position:0% 50%}to{background-position:200% 50%}} /* Compact technical fallback is intentionally hidden by default; errors remain visible. */ .cosmic-dashboard .feedback.error{font-weight:700;background:#6b224d6b;border:1px solid #ffa7c366;border-radius:12px;padding:10px 12px} .cosmic-dashboard .submit-panel{box-shadow:inset 0 1px 0 #fff2} #kakaoLiveDialog,#insungAddressDialog,#previewDialog{box-shadow:0 25px 95px #050c35b3} @media(max-width:980px){ .cosmos-nebula{opacity:.42;filter:blur(25px)} .space-hero-orbit{right:-6%;width:220px} .cosmic-dashboard .sheet:before{animation-duration:19s} } @media(max-width:650px){ .cosmos-starlight{opacity:.48;background-size:620px 620px} .cosmos-meteor:nth-child(n+3){display:none} .cosmos-meteor{width:100px;height:1.5px;box-shadow:0 0 8px #7df4ff8a} .cosmos-meteor:nth-child(1){--period:19s;--delay:-8s} .cosmos-meteor:nth-child(2){--period:25s;--delay:-17s} .cosmos-nebula{opacity:.26;filter:blur(20px)} .space-hero:after{width:43%;animation-duration:19s;opacity:.3} .space-hero-orbit{right:-4%;top:16%;width:130px;height:70px;opacity:.42} .space-hero-beam{width:36%;right:0;top:43%;opacity:.35} .space-hero-mascot{animation-duration:8s} .cosmic-dashboard .vehicle-grid .vehicle.chosen{animation-duration:7s} .cosmic-dashboard #quote-section .quote-display:before{animation-duration:90s} .cosmic-dashboard #quote-section .quote-display:after{animation-duration:15s} .cosmic-dashboard .primary{box-shadow:0 0 13px #54e4ff61} } @media(prefers-reduced-motion:reduce){ .cosmos-sky-layer *,.space-hero:after,.space-hero-beam,.space-hero-orbit,.space-hero-spark,.space-hero-mascot, .cosmic-dashboard .sheet:before,.cosmic-dashboard .vehicle-grid .vehicle.chosen, .cosmic-dashboard .vehicle-grid .vehicle.chosen .space-vehicle-art, .cosmic-dashboard #quote-section .quote-display:before,.cosmic-dashboard #quote-section .quote-display:after, .cosmic-dashboard #quote-section .animated-quote-progress-fill{animation:none!important;transition:none!important} .cosmos-meteor{display:none!important} } /* V34 finishing details: route legibility and astronaut placement */ .cosmic-dashboard #quote-section .dispatch-route-strip{ background:linear-gradient(125deg,rgba(11,36,93,.96),rgba(24,55,125,.92)); border:1px solid rgba(124,206,253,.6);color:#eaf8ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 5px 17px rgba(4,13,48,.25); } .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-route-points, .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-route-arrow, .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle, .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle span{color:#d8edff} .cosmic-dashboard #quote-section .dispatch-route-strip #dispatchStart, .cosmic-dashboard #quote-section .dispatch-route-strip #dispatchEnd{color:#f5fbff} .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle strong{ color:#e1ffff;background:rgba(41,114,206,.25);border-color:rgba(129,230,249,.3)} .space-hero{min-height:228px} .space-hero-mascot{bottom:-55px;width:min(39%,465px)} @media(max-width:650px){.space-hero{min-height:165px}.space-hero-mascot{bottom:-27px;width:54%;right:-48px;opacity:.76}} /* V35 refinements: brand logo, 5t visuals, quote card cleanup, method image buttons */ .brand-logo-image{width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(103,204,255,.45));flex:none} .brand-emblem{display:none !important} .head-inner .brand{gap:14px;min-width:260px} .head-inner .brand strong{font-size:21px;letter-spacing:-.6px} .head-inner .brand small{font-size:10px;letter-spacing:2.2px;color:#bbcbff} .footer-brand{display:flex;align-items:center;gap:12px} .footer-brand-logo{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 0 14px rgba(97,205,255,.35));border-radius:50%} .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle{background:linear-gradient(135deg,rgba(105,146,255,.24),rgba(89,244,217,.18));border:1px solid rgba(144,198,255,.52);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 12px 28px rgba(8,21,66,.22);padding:11px 16px} .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle strong{color:#f9fdff;text-shadow:0 0 16px rgba(111,240,255,.34)} .cosmic-dashboard #quote-section .dispatch-route-strip .dispatch-selected-vehicle span{color:#bed8ff} .space-method-select{position:absolute !important;left:-9999px !important;width:1px !important;height:1px !important;opacity:0 !important;pointer-events:none !important} .cosmic-method-wrap{position:relative} .space-method-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:2px} .space-method-card{border:1px solid rgba(137,172,255,.28);border-radius:18px;padding:10px 10px 11px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(79,112,229,.08));color:#d6e4ff;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;min-height:170px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:.22s ease} .space-method-card img{width:78px;height:78px;object-fit:contain;margin:4px 0 8px;filter:drop-shadow(0 10px 16px rgba(8,19,55,.28))} .space-method-card strong{font-size:13px;line-height:1.35;color:#fff} .space-method-card small{display:block;margin-top:6px;font-size:11px;line-height:1.45;color:#a4bbe6} .space-method-card:hover{transform:translateY(-2px);border-color:rgba(150,229,255,.55);box-shadow:0 16px 26px rgba(7,17,61,.18),0 0 0 1px rgba(112,251,255,.15) inset} .space-method-card.is-active{background:radial-gradient(circle at 20% 20%,rgba(116,246,255,.33),transparent 35%),linear-gradient(180deg,rgba(90,213,255,.2),rgba(87,106,252,.16));border-color:rgba(123,239,255,.95);box-shadow:0 0 0 1px rgba(123,239,255,.3) inset,0 0 22px rgba(69,193,255,.28),0 18px 36px rgba(7,17,61,.24)} .space-method-card.is-active strong{color:#f7fdff} .space-method-card.is-active small{color:#d7edff} @media (max-width:1000px){ .head-inner .brand{min-width:unset} .space-method-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:650px){ .brand-logo-image{width:44px;height:44px} .head-inner .brand{gap:10px} .head-inner .brand strong{font-size:15px} .head-inner .brand small{font-size:8px;letter-spacing:1.1px} .footer-brand-logo{width:44px;height:44px} .space-method-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .space-method-card{min-height:148px;border-radius:16px;padding:9px 8px 10px} .space-method-card img{width:64px;height:64px;margin-bottom:7px} .space-method-card strong{font-size:12px} .space-method-card small{font-size:10px} } /* V35 accessibility pass — increase legibility without changing the galaxy effects or layout architecture. */ body{font-size:14px;line-height:1.65;-webkit-font-smoothing:antialiased} .topnav a{font-size:14px;font-weight:700} .space-hero .eyebrow{font-size:11px;letter-spacing:1.5px} .space-hero .subtitle{font-size:14px;line-height:1.7;color:#f1f7ff} .space-hero-badges > span,.space-hero .status{font-size:12px;font-weight:700} .cosmic-dashboard .section-head h2{font-size:23px} .cosmic-dashboard .section-head p{font-size:14px;line-height:1.65;color:#e1edff} .cosmic-dashboard .subhead,.cosmic-dashboard .field-top .subhead{font-size:15px;font-weight:800} .cosmic-dashboard .hint,.cosmic-dashboard .field-help,.cosmic-dashboard .quiet{color:#d9e8ff} .cosmic-dashboard .tab{font-size:14px;font-weight:800} .cosmic-dashboard .vehicle-grid .vehicle-type{font-size:12px;font-weight:800} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:14px;line-height:1.38;word-break:keep-all} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:12px;line-height:1.45;color:#e3eaff;word-break:keep-all} .cosmic-dashboard .truck-shape-field label{font-size:14px;font-weight:800} .cosmic-dashboard .truck-shape-field p{font-size:12px;line-height:1.6;color:#e6edff} .cosmic-dashboard .vehicle-code-check,.cosmic-dashboard .vehicle-code-status{font-size:12px} .cosmic-dashboard .item-grid .item>strong{font-size:14px;line-height:1.45} .cosmic-dashboard .counter button,.cosmic-dashboard .counter b{font-size:14px} .cosmic-dashboard .mini-title{font-size:16px;font-weight:800} .cosmic-dashboard .form-field label,.cosmic-dashboard .reservation label{font-size:14px;line-height:1.6;font-weight:700} .cosmic-dashboard .address-card .three-cols label{font-size:12px} .cosmic-dashboard input,.cosmic-dashboard textarea,.cosmic-dashboard select{font-size:14px;line-height:1.45;min-height:44px} .cosmic-dashboard .address-card .three-cols input{font-size:13px} .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{font-size:13px;color:#5b6a88;opacity:1} .cosmic-dashboard .address-completion-note,.cosmic-dashboard .notice{font-size:13px;line-height:1.65;color:#e2efff} .cosmic-dashboard .choice{font-size:14px;font-weight:800} .cosmic-dashboard .cosmic-pay{font-size:13px;min-height:43px;line-height:1.4} .cosmic-dashboard .field-help{font-size:13px;line-height:1.6;color:#e0edff} .cosmic-dashboard .cosmic-live-facts span{font-size:12px;color:#d9e9ff} .cosmic-dashboard .cosmic-live-facts strong{font-size:14px;line-height:1.5;color:#fff} .cosmic-dashboard #quote-section .quote-label .pill{font-size:12px} .cosmic-dashboard #quote-section .quote-label .quiet{font-size:12px;color:#e8f4ff} .cosmic-dashboard #quote-section .dispatch-quote-total small{font-size:14px} .cosmic-dashboard #quote-section .dispatch-quote-total span{font-size:13px;line-height:1.6} .cosmic-dashboard #quote-section .dispatch-quote-range small{font-size:12px} .cosmic-dashboard #quote-section .animated-quote-labels, .cosmic-dashboard #quote-section .animated-route-caption, .cosmic-dashboard #quote-section .quote-explain{font-size:13px;line-height:1.65;color:#e8f2ff} .cosmic-dashboard #quote-section .quote-explain strong{color:#91f7ff;font-weight:800} .cosmic-dashboard .primary,.cosmic-dashboard .secondary{font-size:14px;line-height:1.45} .cosmic-dashboard .distance-diagnostic p,.cosmic-dashboard .submit-panel p, .cosmic-dashboard .submit-panel label,.cosmic-dashboard .feedback, .cosmic-dashboard .submit-panel .submit-help{font-size:13px;line-height:1.65;color:#e0edff} .space-method-card strong{font-size:14px;line-height:1.45} .space-method-card small{font-size:12px;line-height:1.55;color:#d4e3ff} .footer,.footer p,.footer span{font-size:13px;line-height:1.6} /* Readability also matters inside address/map/search dialogs (without modifying their operation). */ #insungAddressDialog,#kakaoLiveDialog,#previewDialog{font-size:14px;line-height:1.6} #insungAddressDialog input,#kakaoLiveDialog input,#previewDialog input{font-size:14px} @media(max-width:650px){ .space-hero .subtitle{font-size:13px} .space-hero .eyebrow{font-size:10px} .cosmic-dashboard .section-head h2{font-size:21px} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:12px} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:11px} .cosmic-dashboard .vehicle-grid .vehicle-type{font-size:11px} .cosmic-dashboard .address-card .three-cols input{font-size:12px} .space-method-card strong{font-size:13px} .space-method-card small{font-size:11px} .cosmic-dashboard .cosmic-pay{font-size:12px} } /* [consolidated from space-v36.css] */ /* ======================================================================= V36 | GALAXY ORDER, premium responsive visual refinement Display layer only: no address, quote, payment or order business logic. Loaded after existing V35 styles to keep upgrades isolated and reversible. ======================================================================= */ :root{ --v36-glow:#65eaf5; --v36-lilac:#b5a2ff; --v36-ink:#f7faff; --v36-secondary:#d4e2fa; --v36-surface:rgba(23,34,91,.94); --v36-outline:rgba(157,190,253,.33); --v36-line:rgba(176,208,255,.15); --v36-shadow:0 22px 50px rgba(2,8,38,.27); } html{scroll-behavior:smooth;scroll-padding-top:94px} body{font-family: 'Pretendard Variable',Pretendard,'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',system-ui,sans-serif;line-height:1.65;letter-spacing:-.015em;text-rendering:optimizeLegibility} body,button,input,select,textarea{font-family:inherit} button,input,select,textarea{-webkit-tap-highlight-color:transparent} button{touch-action:manipulation} .site-head{background:rgba(7,13,43,.91);border-bottom:1px solid rgba(139,186,255,.21);box-shadow:0 12px 32px #03082337} .site-head .head-inner{max-width:1460px;padding-inline:clamp(18px,2.8vw,32px);min-height:80px} .head-inner .brand{min-width:0} .head-inner .brand strong{font-weight:850;letter-spacing:-.045em} .head-inner .brand small{font-size:10px;font-weight:650;letter-spacing:.14em} .head-inner .topnav{gap:clamp(12px,2.1vw,31px)} .head-inner .topnav a{padding:11px 1px;font-size:13px;font-weight:750;white-space:nowrap} .head-inner .header-cta.header-login{border-radius:999px;padding:9px 15px;font-size:10px;font-weight:800;letter-spacing:.1em} .page-shell{max-width:1460px;padding:clamp(15px,2.3vw,30px) clamp(13px,2.2vw,28px) 100px} /* Hero: deeper layered lighting and intentional text spacing */ .space-hero{min-height:244px;margin-bottom:16px;border-radius:25px;border:1px solid rgba(150,203,255,.47);background: radial-gradient(ellipse at 81% 110%,rgba(98,99,234,.57) 0%,transparent 50%), radial-gradient(ellipse at 77% 20%,rgba(36,149,232,.2),transparent 47%), linear-gradient(114deg,#09133f 8%,#152769 57%,#25236b 100%);box-shadow:var(--v36-shadow),inset 0 1px 0 #ffffff29} .space-hero:after{content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;background:linear-gradient(108deg,transparent 28%,rgba(111,212,255,.045),transparent 66%)} .space-hero-copy{padding:clamp(24px,3.1vw,44px);max-width:74%} .space-hero .eyebrow{font-size:11px;font-weight:850;letter-spacing:.18em;color:#a2f6ff} .space-hero h1{font-weight:900;font-size:clamp(30px,3.15vw,49px);letter-spacing:-.055em;line-height:1.25;margin:8px 0 11px} .space-hero h1 em{background:linear-gradient(100deg,#a2fbff 0%,#d1d0ff 75%,#fff 100%);background-clip:text;-webkit-background-clip:text} .space-hero .subtitle{max-width:615px;font-size:14px;font-weight:550;line-height:1.8;color:#ebf3ff} .space-hero-badges{gap:8px;margin-top:18px} .space-hero-badges > span{padding:6px 11px;font-size:11px;font-weight:750;background:rgba(65,106,196,.2);border:1px solid rgba(151,213,255,.28)} .space-hero .status{margin-top:14px;padding:7px 13px;font-size:11px;font-weight:750;border-color:rgba(118,239,233,.45)} .space-hero-mascot{right:8px;bottom:-61px;width:min(38%,465px);filter:drop-shadow(0 14px 32px rgba(27,132,248,.37))} /* Four-step orientation guide: pure navigation, no effect on form state */ .journey-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px} .journey-step{position:relative;display:flex;gap:12px;align-items:center;min-width:0;text-decoration:none;color:var(--v36-secondary);padding:13px 17px;border:1px solid rgba(157,195,255,.27);border-radius:15px;background:linear-gradient(128deg,rgba(28,48,111,.8),rgba(15,29,79,.81));box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:border-color .2s,background .2s,transform .2s} .journey-step:after{content:"";position:absolute;left:17px;bottom:-1px;width:0;height:2px;border-radius:999px;background:linear-gradient(90deg,#44e6ea,#9e96ff);transition:width .2s} .journey-step:hover{border-color:rgba(120,236,251,.68);transform:translateY(-2px)} .journey-step.is-current{background:linear-gradient(125deg,rgba(34,91,153,.83),rgba(37,43,113,.85));border-color:rgba(94,234,252,.73);color:white;box-shadow:0 0 25px rgba(32,149,212,.15),inset 0 1px 0 #ffffff1c} .journey-step.is-current:after{width:calc(100% - 34px)} .journey-number{flex:none;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(116,147,231,.16);border:1px solid rgba(181,212,255,.31);font-size:13px;font-weight:850;color:#bbdeff;letter-spacing:.03em} .journey-step.is-current .journey-number{background:linear-gradient(135deg,#1ab2df,#4566d7);border-color:#87f5ff;color:white;box-shadow:0 0 17px rgba(61,204,249,.26)} .journey-text{display:block;min-width:0} .journey-text strong{display:block;font-size:14px;font-weight:850;line-height:1.35;color:#fff;white-space:nowrap} .journey-text small{display:block;margin-top:3px;font-size:11px;font-weight:550;color:#b7cbea;white-space:nowrap} /* Desktop layout and panel chrome */ .layout.cosmic-dashboard{grid-template-columns:minmax(0,1.75fr) minmax(350px,.99fr)!important;gap:18px!important} .cosmic-left,.cosmic-right{gap:18px} .cosmic-dashboard .sheet{padding:clamp(20px,2.25vw,30px);border-radius:22px;border:1px solid rgba(154,193,255,.35);background: linear-gradient(135deg,rgba(91,111,205,.09),transparent 38%), linear-gradient(153deg,rgba(29,47,112,.95),rgba(23,34,91,.97) 57%,rgba(29,33,90,.96));box-shadow:var(--v36-shadow),inset 0 1px 0 rgba(255,255,255,.115)} .cosmic-dashboard .sheet:before{background:linear-gradient(115deg,rgba(117,194,255,.06),transparent 48%,rgba(157,113,255,.035))} .cosmic-dashboard .section-head{display:flex;align-items:center;gap:13px;margin-bottom:22px;padding-bottom:17px;border-bottom:1px solid rgba(180,215,255,.13)} .cosmic-dashboard .section-head .step{min-width:43px;width:43px;min-height:43px;height:43px;border-radius:13px;font-size:18px;font-weight:900;border:1px solid rgba(129,244,255,.75);background:linear-gradient(135deg,#0b95c5,#343fba);box-shadow:0 5px 19px rgba(19,153,226,.22)} .cosmic-dashboard .section-head h2{font-size:clamp(21px,1.75vw,25px);font-weight:900;letter-spacing:-.055em;line-height:1.35;margin:0 0 3px} .cosmic-dashboard .section-head p{font-size:13px;line-height:1.65;color:#cedef9;word-break:keep-all} .cosmic-dashboard .subhead,.cosmic-dashboard .field-top .subhead{display:block;color:#f7faff;font-size:14px;font-weight:850;letter-spacing:-.025em} .cosmic-dashboard .hint,.cosmic-dashboard .quiet{font-size:12px;font-weight:550;color:#d0dff9} .cosmic-dashboard .divider-line{margin:24px 0 22px;border-color:rgba(190,211,255,.16)} /* Vehicle selector: readable captions, clear selection, consistent graphics */ .cosmic-dashboard .tab-switch{width:min(100%,320px);padding:5px;margin-bottom:19px;background:#101d52a8;border:1px solid #91b8ff3c} .cosmic-dashboard .tab{min-height:40px;font-size:14px;font-weight:850} .cosmic-dashboard .vehicle-grid{gap:11px} .cosmic-dashboard .vehicle-grid .vehicle{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;min-height:176px;overflow:hidden;border-radius:17px;padding:12px 8px 14px;border:1px solid rgba(173,205,255,.32);background:linear-gradient(160deg,rgba(49,65,134,.86),rgba(26,41,98,.92));transition:transform .2s,border-color .2s,box-shadow .2s,background .2s} .cosmic-dashboard .vehicle-grid .vehicle:before{content:"";position:absolute;inset:19% -10% 18%;background:radial-gradient(ellipse,rgba(130,159,255,.2),transparent 67%);z-index:-1} .cosmic-dashboard .vehicle-grid .vehicle:hover{transform:translateY(-3px);border-color:rgba(142,234,255,.77);box-shadow:0 12px 25px #030e3e49,inset 0 1px 0 #ffffff1a} .cosmic-dashboard .vehicle-grid .vehicle.chosen{background:linear-gradient(153deg,rgba(22,128,167,.85),rgba(23,64,129,.94) 72%);border-color:#70f1ef;box-shadow:0 0 0 1px rgba(96,240,244,.45),0 0 26px rgba(49,190,229,.23),inset 0 1px 0 #ffffff35} .cosmic-dashboard .vehicle-grid .vehicle.chosen:after{content:"✓";position:absolute;top:10px;right:9px;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#7bf4ee;color:#073b59;font-size:13px;font-weight:900;box-shadow:0 2px 7px #07204766} .cosmic-dashboard .vehicle-grid .vehicle-type{align-self:flex-start;margin-bottom:5px;max-width:calc(100% - 22px);font-size:11px;line-height:1.35;padding:4px 9px;border:1px solid rgba(203,221,255,.15);background:rgba(114,136,207,.22);color:#e4f2ff;font-weight:800} .cosmic-dashboard .vehicle-grid .vehicle-icon{margin:0 0 7px;height:83px;min-height:83px;width:100%;display:flex;align-items:center;justify-content:center} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{max-width:142px;width:100%;height:100%;object-fit:contain} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:13px;font-weight:850;line-height:1.35;letter-spacing:-.03em} .cosmic-dashboard .vehicle-grid .vehicle small{margin-top:4px;font-size:11px;line-height:1.4;color:#dce7ff;font-weight:550} .cosmic-dashboard .truck-shape-field{padding:15px;border-radius:15px;gap:10px;background:rgba(9,23,65,.36);border:1px solid rgba(150,189,249,.26)} .cosmic-dashboard .truck-shape-field label{font-size:13px} .cosmic-dashboard .truck-shape-field p{font-size:12px;line-height:1.65;color:#d5e5ff} .cosmic-dashboard .vehicle-code-check{border-radius:10px;min-height:40px;font-weight:750} /* Countable packages */ .cosmic-dashboard .item-grid{gap:11px} .cosmic-dashboard .item-grid .item{padding:12px 7px 11px;border-radius:16px;background:linear-gradient(156deg,rgba(52,69,146,.76),rgba(28,42,96,.9));border:1px solid rgba(179,207,255,.3)} .cosmic-dashboard .item-grid .item>span{height:82px} .cosmic-dashboard .item-grid .space-item-art{height:79px;object-fit:contain} .cosmic-dashboard .item-grid .item>strong{font-size:13px;font-weight:800} .cosmic-dashboard .counter{min-height:33px;border-color:rgba(173,216,255,.19);margin-top:10px} .cosmic-dashboard .counter button{min-width:30px;min-height:30px} .cosmic-dashboard .counter b{font-weight:800;font-variant-numeric:tabular-nums} /* Data-entry cards; preserve input IDs and all event bindings */ .cosmic-dashboard .form-card{border-radius:17px;padding:19px;background:linear-gradient(140deg,rgba(37,57,131,.76),rgba(25,42,99,.83));border:1px solid rgba(160,196,255,.29);box-shadow:inset 0 1px 0 #ffffff14} .cosmic-dashboard .address-cards{gap:13px;margin:14px 0 17px} .cosmic-dashboard .address-card{min-width:0} .cosmic-dashboard .mini-title{font-size:15px;font-weight:850;letter-spacing:-.025em;margin-bottom:16px} .cosmic-dashboard .mini-icon{background:linear-gradient(135deg,#1e9ada,#4c57c4);border:1px solid #76e7ff54;color:#fff;border-radius:9px;font-size:11px} .cosmic-dashboard .form-field label,.cosmic-dashboard .reservation label{font-size:13px;font-weight:750;color:#e9f3ff;margin-bottom:6px} .cosmic-dashboard .form-field{min-width:0} .cosmic-dashboard input,.cosmic-dashboard textarea,.cosmic-dashboard select{width:100%;min-width:0;min-height:47px;border-radius:10px;border:1px solid #d2def3;background:#f5f7ff;color:#132347;font-size:15px;font-weight:550;padding:11px 12px;box-shadow:0 2px 0 #050d290a} .cosmic-dashboard input:read-only:not([type="checkbox"]){background:#e8efff} .cosmic-dashboard textarea{min-height:92px;resize:vertical} .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{color:#667592;font-size:13px;font-weight:450} .cosmic-dashboard input:focus,.cosmic-dashboard select:focus,.cosmic-dashboard textarea:focus{border-color:#56d4ed;outline:2px solid #65edff7c;outline-offset:1px;background:#fff} .cosmic-dashboard .address-search{display:flex;min-width:0} .cosmic-dashboard .address-search input{cursor:pointer;text-overflow:ellipsis} .cosmic-dashboard .address-search button{flex:0 0 49px;min-height:47px;border-radius:0 10px 10px 0} .cosmic-dashboard .address-completion-note,.cosmic-dashboard .notice{font-size:12px;line-height:1.7;color:#d8eaff} .cosmic-dashboard .address-card .three-cols{gap:7px} .cosmic-dashboard .address-card .three-cols label{font-size:11px} .cosmic-dashboard .address-card .three-cols input{padding:9px 7px;font-size:12px;text-overflow:ellipsis} .space-method-grid{gap:9px;margin-top:4px} .space-method-card{min-width:0;min-height:142px;border-radius:15px;padding:10px 7px;background:linear-gradient(165deg,rgba(57,79,151,.63),rgba(25,38,95,.85));border:1px solid rgba(172,210,255,.33)} .space-method-card img{width:71px;height:68px;margin:1px 0 8px} .space-method-card strong{font-size:13px;font-weight:800;color:#fff} .space-method-card small{font-size:11px;color:#d5e4ff;line-height:1.45} .space-method-card.is-active{border-color:#68f4eb;background:linear-gradient(160deg,rgba(25,130,173,.43),rgba(36,67,145,.75));box-shadow:0 0 0 1px #68ecec5c,inset 0 1px 0 #ffffff2a,0 0 22px #3fe0f82a} .space-method-card.is-active:after{content:"✓";position:absolute;top:8px;right:8px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:#76f1ef;color:#093453;font-size:12px;font-weight:900} .space-method-card{position:relative} /* Schedule and payment become coherent compact actions */ .cosmic-dashboard .choice-row{gap:9px} .cosmic-dashboard .choice{min-height:46px;border-radius:11px;border:1px solid #8ba7ec73;font-size:13px;font-weight:800} .cosmic-dashboard .cosmic-payment-pills{gap:8px;margin-top:5px} .cosmic-dashboard .cosmic-pay{font-size:13px;min-height:45px;border-radius:11px;border-color:rgba(171,210,255,.3);background:rgba(54,72,148,.56);color:#e0edff;font-weight:750;word-break:keep-all} .cosmic-dashboard .cosmic-pay.is-active{border-color:#69f3ea;background:linear-gradient(125deg,#118eb4,#3a54c0);color:#fff;box-shadow:0 0 0 1px #68f9f046,0 5px 15px #07234c42} /* Native payment select remains in DOM for existing logic, visible button group is the UI. */ .cosmic-dashboard #payment{position:absolute!important;width:1px!important;height:1px!important;min-height:1px!important;margin:0!important;padding:0!important;opacity:0!important;overflow:hidden!important;clip-path:inset(50%)!important;pointer-events:none!important} .cosmic-dashboard .field-help{margin-top:11px;font-size:12px;line-height:1.7;color:#d7e5ff} .cosmic-dashboard .reservation{margin-top:13px} /* Quote and submission: make the amount the unmistakable hierarchy */ .cosmic-dashboard #quote-section .dispatch-route-strip{border-radius:14px;padding:13px;background:linear-gradient(130deg,#0c2b63,#183978);border-color:#88d6f684} .cosmic-dashboard #quote-section .dispatch-route-points{min-width:0;line-height:1.6;overflow-wrap:anywhere} .cosmic-dashboard #quote-section .dispatch-route-strip #dispatchStart, .cosmic-dashboard #quote-section .dispatch-route-strip #dispatchEnd{font-size:12px;font-weight:750;word-break:keep-all} .cosmic-dashboard #quote-section .dispatch-selected-vehicle{border-radius:10px;min-width:0} .cosmic-dashboard .cosmic-live-facts{gap:8px;margin-top:12px} .cosmic-dashboard .cosmic-live-facts>div{border-radius:11px;padding:11px;background:rgba(10,27,73,.46);border:1px solid rgba(142,183,248,.21);min-width:0} .cosmic-dashboard .cosmic-live-facts span{display:block;color:#bed6ff;font-size:11px;font-weight:700} .cosmic-dashboard .cosmic-live-facts strong{display:block;color:#fff;font-size:13px;font-weight:800;line-height:1.5;overflow-wrap:anywhere} .cosmic-dashboard #quote-section .quote-display{margin-top:12px;padding:20px;border-radius:18px;border:1px solid rgba(143,213,255,.62);background:radial-gradient(ellipse at 95% 0%,rgba(66,115,251,.35),transparent 63%),linear-gradient(146deg,#0d2261,#20367f 59%,#29246a);box-shadow:0 14px 30px #050c3e67,inset 0 1px 0 #ffffff23} .cosmic-dashboard #quote-section .quote-label{gap:9px;flex-wrap:wrap} .cosmic-dashboard #quote-section .quote-label .pill{font-size:11px;font-weight:800;padding:6px 10px} .cosmic-dashboard #quote-section .quote-label .quiet{font-size:11px;color:#daedff} .cosmic-dashboard #quote-section .dispatch-quote-total{padding:8px 2px 13px} .cosmic-dashboard #quote-section .dispatch-quote-total small{color:#b6eafc;font-size:12px;font-weight:750} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:clamp(32px,3vw,47px);line-height:1.35;letter-spacing:-.055em;overflow-wrap:anywhere;font-weight:900;font-variant-numeric:tabular-nums} .cosmic-dashboard #quote-section .dispatch-quote-total span{font-size:12px;color:#d6edff} .cosmic-dashboard #quote-section .dispatch-quote-range{background:rgba(31,61,135,.62);border:1px solid rgba(147,188,250,.38);border-radius:12px;padding:12px 13px} .cosmic-dashboard #quote-section .dispatch-quote-endpoints{font-size:clamp(15px,1.55vw,22px);font-weight:850;letter-spacing:-.04em;line-height:1.4} .cosmic-dashboard #quote-section .dispatch-quote-range small{font-size:11px;color:#d0e4ff} .cosmic-dashboard #quote-section .animated-quote-labels, .cosmic-dashboard #quote-section .animated-route-caption, .cosmic-dashboard #quote-section .quote-explain{font-size:12px;color:#dfedff;line-height:1.7} .cosmic-dashboard #quote-section .quote-explain{padding-top:13px;margin-top:14px} .cosmic-dashboard .quote-actions{gap:9px;margin-top:13px} .cosmic-dashboard .primary,.cosmic-dashboard .secondary{border-radius:12px;min-height:49px;font-size:13px;font-weight:850;line-height:1.5;word-break:keep-all;transition:filter .18s,transform .18s,box-shadow .18s} .cosmic-dashboard .primary{background:linear-gradient(110deg,#04b8cf,#2879d8 53%,#6155ca);border:1px solid #a0f8fb;box-shadow:0 8px 20px #046aa952,inset 0 1px 0 #ffffff35} .cosmic-dashboard .secondary{background:rgba(40,60,135,.68);border:1px solid #9fbff6a4;color:#eff7ff} .cosmic-dashboard .primary:not(:disabled):hover,.cosmic-dashboard .secondary:hover{transform:translateY(-1px);filter:brightness(1.12)} .cosmic-dashboard .submit-panel{margin-top:12px;border-radius:15px;border:1px solid rgba(144,197,255,.37);padding:19px;background:linear-gradient(135deg,rgba(29,56,125,.79),rgba(26,38,97,.89))} .cosmic-dashboard .submit-panel strong{font-size:15px;font-weight:850;color:#fff} .cosmic-dashboard .submit-panel p,.cosmic-dashboard .submit-panel label{font-size:12px;color:#e0ebff;line-height:1.7} .cosmic-dashboard .submit-panel .consent-row{display:flex;gap:9px;align-items:flex-start;cursor:pointer} .cosmic-dashboard .submit-panel input[type=checkbox]{margin:3px 0 0;flex:0 0 18px;width:18px;min-height:18px;height:18px;accent-color:#48e2e5} .cosmic-dashboard #registerButton{min-height:54px;font-size:15px} .cosmic-dashboard .feedback{font-size:12px;line-height:1.7;color:#dcecff} /* Accessibility; do not touch focus-management code of existing dialogs */ .journey-step:focus-visible,.cosmic-dashboard button:focus-visible,.topnav a:focus-visible, .space-method-card:focus-visible{outline:3px solid #a0f9ff;outline-offset:3px} #insungAddressDialog,#kakaoLiveDialog,#previewDialog{max-width:calc(100vw - 20px);box-shadow:0 28px 80px #020b25a8} #insungAddressDialog .address-dialog-inner,#kakaoLiveDialog .kl-body,#previewDialog .dialog-inner{overscroll-behavior:contain} /* Big tablet, landscape tablet and short desktops */ @media(max-width:1300px) and (min-width:981px){ .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .cosmic-dashboard .item-grid{grid-template-columns:repeat(5,minmax(0,1fr))} .cosmic-dashboard .address-cards{grid-template-columns:1fr} .space-method-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(2,minmax(0,1fr))} .journey-step{padding:13px 10px;gap:8px} .journey-text small{font-size:10px} } @media(max-width:1100px){ .head-inner .header-cta{display:none!important} .journey-step{padding:12px 11px;gap:9px} .journey-number{width:34px;height:34px} .journey-text strong{font-size:13px} .journey-text small{font-size:10px} } @media(max-width:980px){ .layout.cosmic-dashboard{display:flex!important;flex-direction:column;gap:16px!important} .cosmic-left,.cosmic-right{width:100%;gap:16px} .cosmic-dashboard .sheet{padding:clamp(18px,3vw,27px)} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(5,minmax(0,1fr))} .cosmic-dashboard .address-cards{grid-template-columns:repeat(2,minmax(0,1fr))} .space-method-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(5,minmax(0,1fr))} .space-hero-copy{max-width:75%} } @media(max-width:760px){ .site-head .head-inner{gap:12px;min-height:68px;height:68px;padding-inline:14px} .brand-logo-image{width:49px;height:49px} .head-inner .brand{gap:9px} .head-inner .brand strong{font-size:16px} .head-inner .brand small{font-size:8px;letter-spacing:.05em} .head-inner .topnav{margin-left:auto;gap:12px} .head-inner .topnav a{font-size:11px;padding:10px 0} .head-inner .topnav a:nth-child(2),.head-inner .topnav a:nth-child(4){display:none} .page-shell{padding:13px 12px 65px} .space-hero{min-height:218px;border-radius:20px} .space-hero-copy{max-width:83%;padding:20px 21px} .space-hero .eyebrow{font-size:9px;letter-spacing:.1em} .space-hero h1{font-size:clamp(25px,5.8vw,36px);line-height:1.28;margin:7px 0} .space-hero .subtitle{font-size:12px;line-height:1.65;max-width:440px} .space-hero-mascot{width:41%;bottom:-24px;right:-30px;opacity:.75} .space-hero-badges{gap:5px;margin-top:12px} .space-hero-badges > span{padding:4px 7px;font-size:10px} .space-hero .status{font-size:10px;padding:4px 9px;margin-top:10px} .journey-progress{gap:7px;margin-bottom:15px;grid-template-columns:repeat(4,minmax(0,1fr))} .journey-step{display:flex;flex-direction:column;align-items:center;text-align:center;padding:11px 4px 10px;gap:6px;border-radius:12px} .journey-step:after{left:12px} .journey-step.is-current:after{width:calc(100% - 24px)} .journey-number{width:30px;height:30px;border-radius:10px;font-size:11px} .journey-text strong{font-size:11px} .journey-text small{display:none} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .cosmic-dashboard .item-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .cosmic-dashboard .address-cards{grid-template-columns:1fr} .space-method-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr))} } @media(max-width:520px){ html{scroll-padding-top:74px} .site-head .head-inner{height:62px;min-height:62px;padding-inline:11px} .brand-logo-image{width:42px;height:42px} .head-inner .brand strong{font-size:14px;white-space:nowrap} .head-inner .brand small{font-size:7px;letter-spacing:.035em} .head-inner .topnav{gap:9px} .head-inner .topnav a{font-size:10px} .page-shell{padding:11px 9px 52px} .space-hero{min-height:225px;margin-bottom:11px;border-radius:17px} .space-hero-copy{padding:18px 14px;max-width:94%;align-self:flex-start} .space-hero h1{font-size:clamp(23px,6.1vw,29px);max-width:93%} .space-hero .eyebrow{font-size:8px} .space-hero .subtitle{font-size:12px;max-width:76%;line-height:1.6} .space-hero-badges{margin-top:12px;max-width:91%} .space-hero-badges > span{font-size:9px;padding:4px 6px} .space-hero-mascot{width:60%;max-width:none;right:-63px;bottom:-27px;opacity:.72;filter:drop-shadow(0 0 10px #286acb80)} .space-hero .status{font-size:10px} .journey-progress{gap:5px;margin-bottom:11px} .journey-step{padding:9px 2px 8px;border-radius:10px} .journey-number{width:26px;height:26px;font-size:10px;border-radius:8px} .journey-text strong{font-size:10px;letter-spacing:-.045em} .layout.cosmic-dashboard{gap:12px!important} .cosmic-left,.cosmic-right{gap:12px} .cosmic-dashboard .sheet{padding:18px 13px 20px;border-radius:16px} .cosmic-dashboard .section-head{padding-bottom:13px;margin-bottom:16px;gap:10px;align-items:flex-start} .cosmic-dashboard .section-head .step{height:37px;width:37px;min-width:37px;min-height:37px;font-size:16px;border-radius:11px} .cosmic-dashboard .section-head h2{font-size:20px} .cosmic-dashboard .section-head p{font-size:12px;line-height:1.6} .cosmic-dashboard .tab-switch{width:100%;max-width:none;margin-bottom:13px} .cosmic-dashboard .tab{font-size:13px;min-height:40px} .cosmic-dashboard .vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .cosmic-dashboard .vehicle-grid .vehicle{min-height:166px;padding:10px 8px 12px;border-radius:13px} .cosmic-dashboard .vehicle-grid .vehicle-type{font-size:11px} .cosmic-dashboard .vehicle-grid .vehicle-icon{height:85px;min-height:85px;margin:0 0 5px} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{max-width:160px} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:13px} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:11px} .cosmic-dashboard .item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .cosmic-dashboard .item-grid .item>span{height:77px} .cosmic-dashboard .truck-shape-field{grid-template-columns:minmax(0,1fr);padding:12px;gap:7px} .cosmic-dashboard .truck-shape-field label,.cosmic-dashboard .truck-shape-field select, .cosmic-dashboard .truck-shape-field p,.cosmic-dashboard .vehicle-code-check{grid-column:1/-1;justify-self:stretch} .cosmic-dashboard .truck-shape-field p{font-size:12px} .cosmic-dashboard .form-card{padding:14px;border-radius:13px} .cosmic-dashboard .form-field label{font-size:13px} .cosmic-dashboard input,.cosmic-dashboard select,.cosmic-dashboard textarea{min-height:48px;font-size:16px} .cosmic-dashboard .address-card .three-cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px} .cosmic-dashboard .address-card .three-cols input{font-size:12px;min-height:44px;padding:8px 6px} .space-method-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .space-method-card{min-height:135px;border-radius:13px} .space-method-card img{width:69px;height:65px;margin:2px 0 6px} .space-method-card strong{font-size:13px} .space-method-card small{font-size:11px} .cosmic-dashboard .two-cols{grid-template-columns:1fr} .cosmic-dashboard .address-cards{grid-template-columns:1fr} .cosmic-dashboard .choice-row .choice{font-size:13px;min-height:47px} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .cosmic-dashboard .cosmic-pay{min-height:46px;font-size:13px} .cosmic-dashboard .cosmic-live-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} .cosmic-dashboard .cosmic-live-facts>div{padding:10px} .cosmic-dashboard #quote-section .dispatch-route-strip{padding:10px} .cosmic-dashboard #quote-section .dispatch-route-points{font-size:12px} .cosmic-dashboard #quote-section .quote-display{padding:16px 13px;border-radius:14px} .cosmic-dashboard #quote-section .quote-label .pill{font-size:10px} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:clamp(29px,8vw,39px)} .cosmic-dashboard #quote-section .dispatch-quote-endpoints{font-size:16px} .cosmic-dashboard .quote-actions{grid-template-columns:1fr;gap:9px} .cosmic-dashboard .quote-actions button{font-size:14px;min-height:49px} .cosmic-dashboard .submit-panel{padding:14px} .cosmic-dashboard #registerButton{min-height:54px;font-size:14px} .footer{padding:22px 15px} #insungAddressDialog,#kakaoLiveDialog,#previewDialog{max-width:calc(100vw - 10px);width:calc(100vw - 10px);border-radius:15px} } @media(max-width:365px){ .head-inner .brand small{display:none} .head-inner .topnav a{font-size:9px} .space-hero .subtitle{max-width:82%} .space-hero-badges > span:nth-child(3){display:none} .cosmic-dashboard .sheet{padding:16px 11px} .journey-text strong{font-size:9px} .cosmic-dashboard .address-card .three-cols label{font-size:10px} } @media(hover:none){.cosmic-dashboard .vehicle-grid .vehicle:hover,.space-method-card:hover,.journey-step:hover{transform:none}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey-step,.cosmic-dashboard .vehicle-grid .vehicle,.cosmic-dashboard .primary,.cosmic-dashboard .secondary{transition:none!important}} /* V36 fine-tune: retain address-region values for lookup/order while hiding redundant rows. */ .cosmic-dashboard .address-card .insung-region-fields[hidden]{display:none!important} /* Percentage range labels are internal calculation info, not customer-facing copy. */ .cosmic-dashboard #quote-section #rangeNote[hidden]{display:none!important} /* V36 fare panel refinement (2026-11-01): remove duplicate min/max bar visually. Keep the hidden elements/IDs for the existing fare scripts; do not change API logic. */ .cosmic-dashboard #quote-section .animated-quote-progress[hidden], .cosmic-dashboard #quote-section .animated-quote-labels[hidden]{display:none!important} /* Expected range remains a compact, secondary reference under the primary fare. */ .cosmic-dashboard #quote-section .dispatch-quote-grid .dispatch-quote-range{ padding:9px 11px;gap:4px;border-color:rgba(152,190,245,.25); background:rgba(22,46,105,.37);border-radius:10px } .cosmic-dashboard #quote-section .dispatch-quote-range .dispatch-price-overline{ font-size:10px;font-weight:700;line-height:1.4;color:#b9d5f7;letter-spacing:0 } .cosmic-dashboard #quote-section .dispatch-quote-endpoints{gap:5px;line-height:1.45} .cosmic-dashboard #quote-section .dispatch-quote-endpoints span[id]{ font-size:13px;font-weight:750;letter-spacing:-.02em;line-height:1.45 } .cosmic-dashboard #quote-section .dispatch-quote-endpoints .dispatch-tilde{ font-size:11px;color:#b2cbea } .cosmic-dashboard #quote-section .dispatch-quote-range .dispatch-range-caption{ font-size:10px;line-height:1.5;color:#c1d7f5;font-weight:500 } .cosmic-dashboard #quote-section .animated-route-caption{margin-top:10px;padding-top:11px} @media(max-width:520px){ .cosmic-dashboard #quote-section .dispatch-quote-grid .dispatch-quote-range{padding:8px 10px;gap:3px} .cosmic-dashboard #quote-section .dispatch-quote-endpoints span[id]{font-size:12px} .cosmic-dashboard #quote-section .dispatch-quote-range .dispatch-price-overline{font-size:10px} .cosmic-dashboard #quote-section .dispatch-quote-range .dispatch-range-caption{font-size:10px} } /* V39: show estimated fare details only after a confirmed API fare response. */ .cosmic-dashboard #quote-section .dispatch-quote-grid #expectedFareRange[hidden]{display:none!important} /* Empty/loading/error guidance remains legible on narrow screens; resolved fare retains its large font. */ .cosmic-dashboard #quote-section .quote-display[data-fare-state="empty"] .dispatch-quote-total strong, .cosmic-dashboard #quote-section .quote-display[data-fare-state="loading"] .dispatch-quote-total strong, .cosmic-dashboard #quote-section .quote-display[data-fare-state="error"] .dispatch-quote-total strong{ font-size:clamp(20px,2.5vw,26px);letter-spacing:-.025em;line-height:1.5; font-weight:750;text-shadow:none } .cosmic-dashboard .side-price #sidePrice[data-fare-state="empty"], .cosmic-dashboard .side-price #sidePrice[data-fare-state="loading"], .cosmic-dashboard .side-price #sidePrice[data-fare-state="error"]{ font-size:clamp(15px,1.6vw,18px);line-height:1.5;letter-spacing:-.02em } /* V44 — 관리자 1톤 직접접수용 정식 주소/운임 검증 단계 */ .direct-official-check{padding:15px;margin:12px 0;border:1px solid rgba(125,227,255,.43);background:rgba(11,37,83,.48);border-radius:15px;color:#f3faff} .direct-official-check>strong{display:block;font-size:15px;font-weight:800;letter-spacing:-.015em} .direct-official-check>p{margin:7px 0 12px;font-size:13px;line-height:1.65;color:#dcefff} .direct-official-check b{color:#fff} .direct-official-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .direct-official-actions button{border:1px solid rgba(105,214,255,.5);border-radius:11px;background:linear-gradient(135deg,#0e6694,#284da1);color:#fff;font-weight:750;line-height:1.35;min-height:45px;padding:11px 12px;cursor:pointer;font-size:13px;text-align:center} .direct-official-actions button:last-child{grid-column:1/-1;background:linear-gradient(135deg,#1d7b8b,#264da2)} .direct-official-actions button:hover:not(:disabled){filter:brightness(1.1)} .direct-official-actions button:focus-visible{outline:3px solid #f8ed99;outline-offset:2px} .direct-official-actions button:disabled{opacity:.47;cursor:not-allowed} .direct-official-check .direct-official-state{background:rgba(4,19,50,.4);padding:9px 10px;border-radius:9px;color:#ffd8b0;font-size:12px;margin:10px 0 0} .direct-official-check .direct-official-state[data-ready="true"]{color:#aeffdc} @media(max-width:420px){.direct-official-actions{grid-template-columns:1fr}.direct-official-actions button:last-child{grid-column:auto}.direct-official-check{padding:12px}.direct-official-check>p{font-size:12px}} /* V45 official Insung integrated address and phone field */ .isf-label-action{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:6px} .isf-label-action label{margin:0!important} .isf-field-required{color:#e0f7ff;font-size:.76rem;font-weight:700;margin-left:4px} .isf-copy-phone{min-height:36px;padding:7px 12px;border-radius:12px;background:rgba(20,180,230,.14);border:1px solid rgba(108,220,255,.5);color:#effbff;font-weight:700;font-size:.79rem;cursor:pointer} .isf-copy-phone:hover,.isf-copy-phone:focus-visible{background:rgba(20,180,230,.28);outline-offset:2px} .isf-field-note{display:block;margin-top:6px;color:#d7e9ff;font-size:.76rem;line-height:1.5} @media(max-width:480px){.isf-label-action{align-items:center}.isf-copy-phone{padding:6px 10px;font-size:.78rem}} /* V48 · premium phase 1: item inventory, auto memo and six payment choices. Keep existing starfield, meteors, route and quote interactions untouched. */ .cosmic-dashboard #vehicle-title+.field-top{margin-top:8px} .cosmic-dashboard .field-top{gap:12px;align-items:center} .cosmic-dashboard .field-top .subhead{font-size:clamp(15px,1.3vw,17px);font-weight:850;color:#f7fbff;letter-spacing:-.02em} .cosmic-dashboard .field-top .hint{display:inline-block;color:#c4d8fc;font-size:11px;line-height:1.5;font-weight:550;margin-left:7px} .cosmic-dashboard .item-quantity-summary{flex:0 0 auto;padding:8px 12px;border-radius:99px;font-size:12px;font-weight:700;color:#d5eeff;background:rgba(22,65,127,.55);border:1px solid rgba(137,222,255,.38)} .cosmic-dashboard .item-quantity-summary strong{color:#8ffbf0;font-weight:900;font-size:15px;font-variant-numeric:tabular-nums} .cosmic-dashboard #cargoItems.item-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch;margin-top:12px} .cosmic-dashboard #cargoItems .item{min-width:0;position:relative;isolation:isolate;padding:8px 9px 11px;overflow:hidden;border:1px solid rgba(166,202,255,.31);border-radius:18px;background:linear-gradient(155deg,rgba(48,70,149,.87),rgba(21,40,105,.94));box-shadow:0 7px 20px #060d3329,inset 0 1px 0 rgba(255,255,255,.09);transition:border-color .22s,box-shadow .22s,transform .22s,background .22s} .cosmic-dashboard #cargoItems .item:before{position:absolute;content:'';top:-70px;left:-30px;width:120px;height:130px;pointer-events:none;background:radial-gradient(circle,rgba(117,209,255,.15),transparent 70%);z-index:-1} .cosmic-dashboard #cargoItems .item[data-selected="true"]{border-color:#67f3ec;background:linear-gradient(155deg,rgba(27,109,158,.91),rgba(30,48,124,.98));box-shadow:0 0 0 1px #69f7ef48,0 8px 24px #04c9de35,inset 0 1px 0 #ffffff28} .cosmic-dashboard #cargoItems .item[data-selected="true"]:after{content:'✓';position:absolute;right:9px;top:9px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#084257;font-size:13px;font-weight:950;background:#8affec;z-index:3} .cosmic-dashboard #cargoItems .item-main{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;min-width:0;background:transparent;color:#fff;border:0;padding:2px 3px 0;cursor:pointer;font:inherit} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{display:grid;place-items:center;width:100%;height:94px;min-height:94px;overflow:hidden;border-radius:12px;background:radial-gradient(ellipse at 50% 50%,rgba(191,211,255,.12),transparent 77%)} .cosmic-dashboard #cargoItems .item-main .space-item-art{display:block;object-fit:contain;width:100%;height:91px;max-width:196px;filter:drop-shadow(0 8px 10px #050d3655);transition:transform .22s} .cosmic-dashboard #cargoItems .item-main strong{font-size:14px;font-weight:850;letter-spacing:-.025em;color:#fff;line-height:1.5} .cosmic-dashboard #cargoItems .item-main small{font-size:10px;line-height:1.5;color:#bad5f8;font-weight:600;white-space:nowrap} .cosmic-dashboard #cargoItems .item:hover{transform:translateY(-2px);border-color:#a8e2ff} .cosmic-dashboard #cargoItems .item:hover .space-item-art{transform:scale(1.045)} .cosmic-dashboard #cargoItems .counter{display:flex;align-items:center;justify-content:space-between;max-width:140px;min-height:37px;margin:10px auto 0;border:1px solid rgba(157,215,255,.29);border-radius:99px;background:rgba(8,27,77,.68);overflow:hidden} .cosmic-dashboard #cargoItems .counter button{border:0;background:rgba(91,114,210,.48);color:#fff;min-width:35px;height:36px;min-height:36px;border-radius:50%;font-size:21px;font-weight:700;cursor:pointer;touch-action:manipulation;transition:background .18s} .cosmic-dashboard #cargoItems .counter button:hover{background:#12a7be;color:#fff} .cosmic-dashboard #cargoItems .counter b{font-size:15px;line-height:1;font-weight:900;color:#fff;font-variant-numeric:tabular-nums} .cosmic-dashboard #cargoItems button:focus-visible,.cosmic-dashboard .cosmic-pay:focus-visible{outline:3px solid #f4e6a7;outline-offset:2px} .cosmic-dashboard .memo-auto-tag{display:inline-block;vertical-align:middle;font-size:9px;letter-spacing:.07em;font-weight:850;color:#a4fff6;padding:4px 6px;border-radius:6px;border:1px solid #61cfd06a;background:rgba(12,104,114,.3);margin-left:5px} .cosmic-dashboard .cargo-note-hint{font-size:11px;line-height:1.65;color:#c4defb;margin:0 0 8px} .cosmic-dashboard #cargoNote{border:1px solid rgba(100,192,240,.48);background:linear-gradient(135deg,#f5faff,#edf3ff);min-height:115px;line-height:1.65;padding:13px 14px;font-size:14px;color:#162b50} .cosmic-dashboard #cargoNote:focus{border-color:#58d4ec;box-shadow:0 0 0 3px #66e4ef26} .cosmic-dashboard .memo-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:7px;min-height:22px;font-size:11px;color:#cde7ff} .cosmic-dashboard #memoSyncStatus{max-width:82%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#b1f4ed} .cosmic-dashboard #memoSyncStatus.is-alert{color:#ffcd9b;white-space:normal} .cosmic-dashboard #memoCharacters{color:#e1eeff;font-variant-numeric:tabular-nums;white-space:nowrap} .cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px} .cosmic-dashboard .cosmic-pay{position:relative;display:flex;justify-content:center;align-items:center;gap:5px;min-width:0;min-height:50px;border-radius:13px;font-size:13px;font-weight:850;letter-spacing:-.01em;background:linear-gradient(155deg,rgba(42,69,146,.85),rgba(25,42,96,.9));border:1px solid rgba(164,205,255,.35);color:#e3f0ff;box-shadow:inset 0 1px 0 #ffffff12;cursor:pointer;transition:background .2s,box-shadow .2s,transform .2s,border-color .2s} .cosmic-dashboard .cosmic-pay.is-active{border-color:#62f9ec;color:#fff;background:linear-gradient(128deg,#0b92b2,#2868bf 63%,#5c4cbd);box-shadow:0 0 0 1px rgba(97,249,236,.35),0 9px 19px rgba(4,147,198,.3),inset 0 1px 0 #ffffff2b} .cosmic-dashboard .cosmic-pay:not(.is-active):hover{transform:translateY(-1px);background:linear-gradient(150deg,rgba(57,91,183,.96),rgba(33,61,137,.96));border-color:#9ad7fc} @media (max-width:1300px) and (min-width:981px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr))}} @media (max-width:980px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr))}} @media (max-width:760px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(3,minmax(0,1fr))}} @media (max-width:520px){.cosmic-dashboard #cargoItems.item-grid{gap:9px}.cosmic-dashboard #cargoItems .item{padding:7px 6px 10px;border-radius:15px}.cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:79px;min-height:79px}.cosmic-dashboard #cargoItems .item-main .space-item-art{height:79px}.cosmic-dashboard #cargoItems .item-main strong{font-size:13px}.cosmic-dashboard #cargoItems .counter{max-width:128px}.cosmic-dashboard #cargoItems .counter button{min-width:35px}.cosmic-dashboard .cosmic-payment-pills{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmic-dashboard .cosmic-pay{min-height:48px}.cosmic-dashboard .field-top .hint{display:block;margin:3px 0 0;font-size:10px}} @media (hover:none){.cosmic-dashboard #cargoItems .item:hover{transform:none}.cosmic-dashboard .cosmic-pay:not(.is-active):hover{transform:none}} @media (prefers-reduced-motion:reduce){.cosmic-dashboard #cargoItems .item,.cosmic-dashboard #cargoItems .item-main .space-item-art,.cosmic-dashboard .cosmic-pay{transition:none}} /* V49 – Space Cargo 2: 10 adorable illustrated icons and nonstandard pallet editor */ .cosmic-dashboard .cargo-collection-head{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:124px;overflow:hidden;padding:17px 18px;margin-top:14px;border:1px solid rgba(117,228,255,.29);border-radius:20px;background:radial-gradient(ellipse at 93% 0%,rgba(132,111,247,.28),transparent 60%),linear-gradient(130deg,rgba(19,47,112,.87),rgba(34,45,117,.88));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 25px rgba(3,9,43,.15)} .cosmic-dashboard .cargo-collection-head:before{position:absolute;z-index:-1;content:'✦';top:10px;right:185px;font-size:21px;color:#b5f9ff;opacity:.65;filter:drop-shadow(0 0 9px #7de8ff)} .cosmic-dashboard .cargo-collection-heading{flex:1;min-width:0;position:relative;z-index:1} .cosmic-dashboard .cargo-kicker{display:flex;align-items:center;flex-wrap:wrap;gap:9px;color:#8cf4ff;font-size:10px;font-weight:900;letter-spacing:.14em;margin:0 0 11px} .cosmic-dashboard .cargo-kicker span{border:1px solid rgba(144,243,255,.35);background:#6de1ff1b;color:#d7f9ff;letter-spacing:.06em;padding:4px 7px;border-radius:7px} .cosmic-dashboard .cargo-collection-head .field-top{margin:0 0 7px} .cosmic-dashboard .cargo-collection-head .subhead{color:#fff;font-size:clamp(17px,1.5vw,21px)} .cosmic-dashboard .cargo-collection-sub{font-size:12px;line-height:1.65;color:#c7defc;margin:0;max-width:640px} .cosmic-dashboard .cargo-collection-sub strong{color:#aafcf6;font-weight:750} .cosmic-dashboard .cargo-collection-mascot{flex:none;width:108px;height:112px;object-fit:contain;margin:-14px 4px -14px 0;filter:drop-shadow(0 9px 14px rgba(46,137,228,.27));animation:isfMascotFloat 5s ease-in-out infinite} @keyframes isfMascotFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}} .cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-top:12px} .cosmic-dashboard #cargoItems .item{border-radius:18px;padding:9px 8px 12px;background:radial-gradient(ellipse at 50% 8%,rgba(105,133,246,.25),transparent 63%),linear-gradient(150deg,rgba(42,69,148,.88),rgba(19,35,91,.97));border:1px solid rgba(151,209,255,.32);box-shadow:inset 0 1px 0 #ffffff23,0 10px 22px #040b303b;transition:transform .22s,border-color .22s,box-shadow .22s} .cosmic-dashboard #cargoItems .item:before{top:-80px;left:calc(50% - 80px);width:160px;height:160px;background:radial-gradient(circle,rgba(125,204,255,.21),transparent 74%)} .cosmic-dashboard #cargoItems .item:hover{transform:translateY(-4px);border-color:rgba(173,244,255,.85);box-shadow:inset 0 1px 0 #ffffff36,0 14px 28px #09133f70} .cosmic-dashboard #cargoItems .item[data-selected=true]{border-color:#7effe2;box-shadow:0 0 0 1px #a0fff854,0 0 24px #1ddcde44,inset 0 1px 0 #ffffff40;background:radial-gradient(ellipse at top,rgba(43,174,196,.31),transparent 70%),linear-gradient(145deg,#205d9e,#27296c)} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:104px;min-height:104px;background:radial-gradient(ellipse at center,rgba(162,214,254,.13),transparent 78%)} .cosmic-dashboard #cargoItems .item-main .space-item-art{height:102px;width:100%;max-width:210px;object-fit:contain;filter:drop-shadow(0 7px 12px #020b3466)} .cosmic-dashboard #cargoItems .item-main strong{font-size:14px;line-height:1.42;font-weight:900;word-break:keep-all} .cosmic-dashboard #cargoItems .item-main small{font-size:10.5px;white-space:normal;line-height:1.6;min-height:17px;color:#d0e5ff} .cosmic-dashboard #cargoItems .counter{margin-top:9px;max-width:138px;background:#0b2054a9;border-color:#85caff4d;min-height:39px} .cosmic-dashboard #cargoItems .counter button{min-width:38px;height:38px;min-height:38px;background:linear-gradient(120deg,#3553ac,#3a7ed0);border-radius:100px} .cosmic-dashboard #cargoItems .counter button:active{transform:scale(.95)} .cosmic-dashboard #cargoItems .counter b{font-size:16px} .cosmic-dashboard .pallet-dim-panel{margin:13px 0 3px;padding:19px 20px;border:1px solid rgba(155,156,255,.65);border-radius:18px;background:radial-gradient(ellipse at 90% -20%,rgba(140,110,245,.24),transparent 72%),linear-gradient(140deg,rgba(30,48,125,.92),rgba(33,39,99,.98));box-shadow:inset 0 1px 0 #ffffff2c,0 8px 24px #070e3744} .cosmic-dashboard .pallet-dim-panel.hidden{display:none!important} .cosmic-dashboard .pallet-dim-title{display:flex;align-items:center;gap:12px;margin-bottom:15px} .cosmic-dashboard .pallet-dim-graphic{flex:none;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(140deg,#8e6cff44,#4dc9ec44);font-size:25px;border:1px solid #c5bcff55} .cosmic-dashboard .pallet-dim-title>div{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px} .cosmic-dashboard .pallet-dim-title strong{color:#fff;font-size:15px;font-weight:850} .cosmic-dashboard .pallet-dim-title small{color:#cedeff;line-height:1.5;font-size:11px} .cosmic-dashboard .pallet-dim-required{font-size:10px;color:#fff5df;background:#a163cc65;border:1px solid #c4b6ff55;padding:5px 9px;border-radius:99px;white-space:nowrap} .cosmic-dashboard .pallet-dim-fields{display:flex;align-items:end;gap:13px;max-width:570px} .cosmic-dashboard .pallet-dim-fields label{min-width:0;flex:1;font-size:12px;color:#f4f9ff;font-weight:750} .cosmic-dashboard .pallet-dim-fields label span{font-size:10px;color:#b2c9f5} .cosmic-dashboard .pallet-dim-fields input{display:block;box-sizing:border-box;width:100%;height:47px;min-width:0;margin-top:7px;text-align:center;border-radius:11px;border:1px solid #b0beff77;background:#f7faff;color:#1c355e;font-size:16px;font-weight:850} .cosmic-dashboard .pallet-dim-fields input:focus{outline:2px solid #93fff0;outline-offset:2px} .cosmic-dashboard .pallet-dim-times{font-size:21px;color:#a6d7ff;margin-bottom:10px;font-weight:700;flex:none} .cosmic-dashboard .pallet-dim-status{font-size:11px;line-height:1.55;color:#e8dfff;margin:12px 0 0} .cosmic-dashboard .pallet-dim-panel.is-complete{border-color:#5eead4bb} .cosmic-dashboard .pallet-dim-panel.is-complete .pallet-dim-status{color:#9dffee} @media(max-width:1360px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(5,minmax(0,1fr))}} @media(max-width:1120px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.cosmic-dashboard #cargoItems.item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmic-dashboard .cargo-collection-mascot{width:92px;height:96px}.cosmic-dashboard .cargo-collection-head{padding:15px}} @media(max-width:400px){.cosmic-dashboard #cargoItems.item-grid{gap:9px}.cosmic-dashboard .cargo-collection-head{padding:13px}.cosmic-dashboard .cargo-collection-mascot{width:70px;height:79px;margin-right:0}.cosmic-dashboard .cargo-collection-head .field-top{align-items:start;gap:5px}.cosmic-dashboard .cargo-collection-head .subhead{font-size:16px}.cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:82px;min-height:82px}.cosmic-dashboard #cargoItems .item-main .space-item-art{height:81px}.cosmic-dashboard #cargoItems .item-main strong{font-size:12.5px}.cosmic-dashboard .pallet-dim-panel{padding:13px}.cosmic-dashboard .pallet-dim-fields{gap:5px}.cosmic-dashboard .pallet-dim-fields input{height:44px}.cosmic-dashboard .pallet-dim-times{font-size:16px;margin-bottom:10px}} @media(prefers-reduced-motion:reduce){.cosmic-dashboard .cargo-collection-mascot{animation:none}} /* V50: mobile unified-address search is address-list only; keep the desktop map unchanged. */ @media (max-width:767px) { #insungAddressDialog #insungMapPanel, #insungAddressDialog .ia-location-btn { display:none!important; } #insungAddressDialog .ia-result-row { gap:0; } #insungAddressDialog .ia-result-row > .address-result { flex:1 1 100%;min-width:0;width:100%; } #insungAddressDialog .address-result-list { max-height:min(46dvh,420px);overflow-y:auto; } } /* [consolidated from space-v51.css] */ /* V51: visual-only premium vehicle artwork integration. API and quote algorithms unchanged. */ :root{--v51-ice:#8bf7ff;--v51-ink:#eaf6ff;--v51-lav:#bb9bff} .space-hero{overflow:hidden;isolation:isolate;border-color:rgba(139,218,255,.46);background-image:radial-gradient(ellipse at 78% 40%,rgba(85,65,172,.45),transparent 44%),radial-gradient(ellipse at 17% 40%,rgba(46,143,235,.22),transparent 47%),linear-gradient(118deg,#101b4d 0%,#18265e 58%,#30266a 100%)} .space-hero-mascot{right:clamp(6px,3vw,43px);bottom:-58px;width:clamp(170px,29%,332px);max-height:292px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 17px 22px rgba(3,8,35,.4)) drop-shadow(0 0 25px rgba(101,205,255,.24));z-index:2} .space-hero-copy{position:relative;z-index:3;max-width:71%} .space-hero:before{content:"";position:absolute;width:43%;height:145%;border:1px solid rgba(138,219,255,.12);border-radius:50%;right:-2%;top:-37%;transform:rotate(23deg);pointer-events:none} .v51-vehicle-guide{position:relative;display:flex;align-items:center;gap:12px;max-width:100%;border:1px solid rgba(144,216,255,.35);border-radius:16px;background:linear-gradient(100deg,rgba(35,99,164,.32),rgba(51,42,140,.21));padding:7px 16px 7px 9px;margin:10px 0 16px;color:#e9f7ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.07)} .v51-vehicle-guide img{display:block;flex:none;width:65px;height:70px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(16,27,93,.45));animation:v51GuideBob 5s ease-in-out infinite} .v51-vehicle-guide div{flex:1;min-width:0}.v51-vehicle-guide strong{display:block;font-weight:900;font-size:15px;letter-spacing:-.025em;color:#fff} .v51-vehicle-guide p{margin:4px 0 0;font-size:12px;line-height:1.65;color:#e2eeff;word-break:keep-all} .v51-guide-orbit{font-size:28px;color:#a7f7ff;text-shadow:0 0 17px rgba(103,245,255,.64);margin:0 9px} .cosmic-dashboard .vehicle-grid .vehicle{min-height:197px;border-radius:18px;padding:12px 8px 13px;gap:0;overflow:hidden;background:linear-gradient(156deg,rgba(58,82,159,.88),rgba(21,33,83,.96));border:1px solid rgba(190,220,255,.37);box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 7px 14px rgba(0,8,39,.18)} .cosmic-dashboard .vehicle-grid .vehicle:before{inset:22% -2% 25%;border-radius:50%;background:radial-gradient(ellipse,rgba(80,168,253,.24),transparent 69%)} .cosmic-dashboard .vehicle-grid .vehicle-icon{position:relative;flex:none;height:96px;min-height:96px;margin:5px 0 2px;padding:0;z-index:1;overflow:visible} .cosmic-dashboard .vehicle-grid .vehicle-icon:before{content:"";position:absolute;inset:auto 14% 3px;height:15px;border-radius:50%;background:rgba(66,222,255,.24);filter:blur(8px)} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{position:relative;z-index:1;display:block;width:100%;max-width:175px;height:100%;object-fit:contain;filter:drop-shadow(0 6px 5px rgba(4,15,41,.5));transition:transform .25s ease} .cosmic-dashboard .vehicle-grid .vehicle:hover .space-vehicle-art{transform:translateY(-3px) scale(1.045)} .cosmic-dashboard .vehicle-grid .vehicle.chosen .space-vehicle-art{filter:drop-shadow(0 10px 9px rgba(0,14,37,.64)) drop-shadow(0 0 13px rgba(73,229,255,.3))} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:13px;font-weight:900;line-height:1.3;min-height:18px;position:relative;z-index:1} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:10.5px;color:#dbe8ff;line-height:1.45} .cosmic-dashboard .vehicle-grid .vehicle-type{font-size:11px;color:#f1faff;border-color:rgba(177,235,255,.31);background:rgba(62,111,197,.38)} .cosmic-dashboard .vehicle-grid .vehicle.chosen{background:linear-gradient(144deg,rgba(19,120,168,.96),rgba(34,48,119,.96));border-color:#85f4ff;box-shadow:0 0 0 1px rgba(112,240,255,.46),0 0 26px rgba(79,177,255,.26),inset 0 1px 0 rgba(255,255,255,.2)} .v51-wheel-note{margin:10px 0 14px;font-size:11px;line-height:1.6;color:#cedaff} .v51-help-card{position:relative;min-height:132px;display:flex;align-items:center;gap:12px;padding:16px 18px;overflow:hidden;border:1px solid rgba(132,215,255,.28);border-radius:20px;background:linear-gradient(122deg,rgba(29,70,146,.67),rgba(51,35,125,.75));color:#fff} .v51-help-card .v51-help-planet{width:67px;height:77px;object-fit:contain;flex:none;filter:drop-shadow(0 7px 12px #08184e66);animation:v51GuideBob 5.5s ease-in-out infinite} .v51-help-card .v51-help-content{position:relative;z-index:1;flex:1;min-width:0}.v51-help-card .v51-help-content strong{font-size:13px;font-weight:900;color:#e9faff}.v51-help-card .v51-help-content p{margin:7px 0 0;font-size:11px;line-height:1.65;color:#dbe8ff} .v51-help-card .v51-help-package{position:absolute;right:-22px;bottom:-34px;width:90px;opacity:.3;transform:rotate(-16deg)} .cosmic-dashboard .summary-vehicle .icon-panel{overflow:visible;min-height:78px}.cosmic-dashboard .summary-vehicle .icon-panel .space-vehicle-art{width:100%;height:80px;max-width:154px;object-fit:contain;filter:drop-shadow(0 5px 10px #091347aa)} @keyframes v51GuideBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @media(min-width:1400px){.cosmic-dashboard .vehicle-grid .vehicle{min-height:204px}.cosmic-dashboard .vehicle-grid .vehicle-icon{height:103px;min-height:103px}} @media(max-width:1050px){.cosmic-dashboard .vehicle-grid .vehicle{min-height:185px}.cosmic-dashboard .vehicle-grid .vehicle-icon{height:91px;min-height:91px}.space-hero-mascot{width:31%}} @media(max-width:760px){.space-hero-copy{max-width:75%}.space-hero-mascot{right:-20px;bottom:-20px;width:41%;max-height:210px}.cosmic-dashboard .vehicle-grid .vehicle{min-height:177px;padding:9px 5px 12px}.cosmic-dashboard .vehicle-grid .vehicle-icon{height:85px;min-height:85px}.v51-vehicle-guide img{width:58px;height:64px}.v51-guide-orbit{margin:0 3px}.v51-wheel-note{font-size:10px}} @media(max-width:520px){.space-hero-copy{max-width:100%;padding-right:23px}.space-hero h1{max-width:76%}.space-hero .subtitle{max-width:69%}.space-hero-mascot{right:-43px;bottom:-6px;width:48%;max-height:180px;opacity:.88}.v51-vehicle-guide{padding:6px 9px 6px 4px;gap:6px}.v51-vehicle-guide strong{font-size:12.5px}.v51-vehicle-guide p{font-size:10.5px}.v51-vehicle-guide img{width:49px;height:58px}.v51-guide-orbit{display:none}.cosmic-dashboard .vehicle-grid .vehicle{min-height:176px;padding:9px 5px 12px}.cosmic-dashboard .vehicle-grid .vehicle-icon{height:83px;min-height:83px;margin:0 0 2px}.cosmic-dashboard .vehicle-grid .vehicle strong{font-size:12px}.cosmic-dashboard .vehicle-grid .vehicle small{font-size:10px}.v51-help-card{padding:13px 12px}.v51-help-card .v51-help-planet{width:50px;height:55px}} @media(max-width:340px){.cosmic-dashboard .vehicle-grid .vehicle-icon{height:75px;min-height:75px}.space-hero-mascot{opacity:.64}.cosmic-dashboard .vehicle-grid .vehicle{min-height:171px}.v51-vehicle-guide p{font-size:10px}} @media(prefers-reduced-motion:reduce){.v51-vehicle-guide img,.v51-help-planet{animation:none!important}.cosmic-dashboard .vehicle-grid .vehicle:hover .space-vehicle-art{transform:none}} /* V52 — transparent 3D illustrations, no axle badge; mobile/desktop loading-method cards */ .cosmic-dashboard .vehicle-grid .vehicle-icon{margin:8px 0 8px} .cosmic-dashboard .vehicle-grid .vehicle{justify-content:flex-start} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{max-width:185px} .cosmic-dashboard .space-method-card{overflow:hidden;position:relative;min-height:159px;border-radius:17px;isolation:isolate;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease} .cosmic-dashboard .space-method-card::before{content:"";position:absolute;inset:3px;border-radius:14px;background:radial-gradient(ellipse at 50% 34%,rgba(92,165,250,.18),transparent 71%);pointer-events:none;z-index:-1} .cosmic-dashboard .space-method-card img{display:block;width:min(100%,112px);height:93px;min-height:93px;object-fit:contain;margin:0 auto 6px;filter:drop-shadow(0 8px 9px rgba(3,10,38,.38));transition:transform .2s ease} .cosmic-dashboard .space-method-card:hover img{transform:translateY(-3px) scale(1.035)} .cosmic-dashboard .space-method-card.is-active img{filter:drop-shadow(0 8px 9px rgba(3,10,38,.38)) drop-shadow(0 0 11px rgba(90,237,255,.24))} .cosmic-dashboard .space-method-card strong{font-weight:900;letter-spacing:-.025em} @media(max-width:760px){.cosmic-dashboard .space-method-card{min-height:152px}.cosmic-dashboard .space-method-card img{width:min(100%,103px);height:87px;min-height:87px}} @media(max-width:390px){.cosmic-dashboard .space-method-card{padding:8px 5px;min-height:147px}.cosmic-dashboard .space-method-card img{height:79px;min-height:79px}} @media(prefers-reduced-motion:reduce){.cosmic-dashboard .space-method-card img{transition:none!important}} /* [consolidated from space-v54.css] */ /* V54: visual integration only. Original API, calculations, submission JS unchanged. */ .cosmic-dashboard .vehicle-grid .vehicle .vehicle-icon {display:flex;align-items:end;justify-content:center;overflow:visible;height:100px;min-height:100px;padding:1px 1px 3px;} .cosmic-dashboard .vehicle-grid .vehicle .vehicle-icon img.space-vehicle-art {display:block;object-fit:contain;object-position:center bottom;width:100%;height:100%;max-width:186px;filter:drop-shadow(0 8px 8px rgba(0,12,51,.52));transition:transform .24s ease,filter .24s ease;} .cosmic-dashboard .vehicle-grid .vehicle:focus-visible {outline:2px solid #94f6ff;outline-offset:3px;} .cosmic-dashboard .vehicle-grid .vehicle:hover img.space-vehicle-art {transform:translateY(-3px) scale(1.045);} .cosmic-dashboard .vehicle-grid .vehicle.chosen img.space-vehicle-art {filter:drop-shadow(0 10px 9px rgba(0,14,51,.65)) drop-shadow(0 0 10px rgba(80,235,255,.35));} /* Relative image footprint increases across truck categories without affecting real vehicle selections. */ .cosmic-dashboard .vehicle-grid .vehicle[data-etc="1t"] img.space-vehicle-art{max-width:122px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="1.4t"] img.space-vehicle-art{max-width:129px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="2.5t"] img.space-vehicle-art{max-width:139px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="3.5t"] img.space-vehicle-art{max-width:146px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="5t"] img.space-vehicle-art{max-width:153px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="8t"] img.space-vehicle-art{max-width:162px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="11t"] img.space-vehicle-art{max-width:165px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="14t"] img.space-vehicle-art{max-width:173px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="18t"] img.space-vehicle-art{max-width:179px;} .cosmic-dashboard .vehicle-grid .vehicle[data-etc="25t"] img.space-vehicle-art{max-width:186px;} .cosmic-dashboard .vehicle-grid .vehicle[data-kind="1"] img.space-vehicle-art{max-width:93px;} .cosmic-dashboard .vehicle-grid .vehicle[data-kind="2"] img.space-vehicle-art{max-width:109px;} .cosmic-dashboard .vehicle-grid .vehicle[data-kind="5"] img.space-vehicle-art{max-width:104px;} .cosmic-dashboard .space-method-card{min-width:0;overflow:hidden;} .cosmic-dashboard .space-method-card img{width:100%;max-width:101px;height:75px;object-fit:contain;object-position:center;filter:drop-shadow(0 5px 7px rgba(0,10,54,.48));} .cosmic-dashboard .space-method-card:hover img{transform:translateY(-2px);} .cosmic-dashboard .space-method-card.is-active img{filter:drop-shadow(0 3px 9px rgba(65,240,255,.5));} /* Do not display decorative axle-count notes. Vehicle name 5톤플축 stays unchanged. */ .cosmic-dashboard .vehicle-axle-label,.cosmic-dashboard .axle-info,.cosmic-dashboard .axle-guide{display:none!important;} @media (max-width:760px){ .cosmic-dashboard .vehicle-grid .vehicle .vehicle-icon{height:85px;min-height:85px;} .cosmic-dashboard .space-method-card img{height:66px;max-width:92px;} } @media (max-width:380px){ .cosmic-dashboard .vehicle-grid .vehicle .vehicle-icon{height:74px;min-height:74px;} .cosmic-dashboard .space-method-card img{height:57px;max-width:80px;} } @media(prefers-reduced-motion:reduce){.cosmic-dashboard .vehicle-grid .vehicle img.space-vehicle-art{transition:none!important;}} /* [consolidated from space-v56.css] */ /* V56 / PREMIUM ORDER / 5 UX PASSES. * Presentation and accessibility only. No API fields, quotes, addresses or submission rules changed. */ :root{--v56-line:rgba(161,214,255,.42);--v56-mist:#dceaff;--v56-aqua:#8cf4ff;--v56-gold:#ffe9ab;--v56-focus:#9af8ff} html{scroll-behavior:smooth;scroll-padding-top:103px} body{font-size:15px;line-height:1.62;letter-spacing:-.015em} /* 1. Brand, hero and step guidance */ .site-head{border-bottom-color:rgba(143,224,255,.34)} .head-inner{max-width:1530px} .site-head .topnav a{font-weight:800;letter-spacing:-.025em} .page-shell{max-width:1530px} .space-hero{border:1px solid rgba(133,219,255,.6);background-image:radial-gradient(ellipse at 83% 61%,rgba(137,98,255,.35),transparent 52%),radial-gradient(ellipse at 20% 13%,rgba(57,204,245,.23),transparent 60%),linear-gradient(113deg,#0a1646,#1c2b78 60%,#3a2879);box-shadow:0 24px 65px rgba(0,5,38,.37),inset 0 1px 0 rgba(247,252,255,.23)} .space-hero .eyebrow{font-size:11px;color:#a2f6ff;font-weight:800;letter-spacing:1.9px} .space-hero h1{font-weight:900;letter-spacing:-.05em;line-height:1.26} .space-hero h1 em{background-image:linear-gradient(105deg,#90faff 4%,#d4d2ff 52%,#ffe9b0);-webkit-background-clip:text;background-clip:text} .space-hero .subtitle{font-weight:650;color:#e6f2ff;line-height:1.7;max-width:595px} .space-hero-badges > span{font-size:12px;color:#eefcff;border-color:rgba(146,235,255,.37);background:rgba(43,118,199,.29);font-weight:750} .space-hero .status{font-size:12px;color:#dcfff8} .journey-progress.journey-premium{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 20px;scroll-margin-top:100px} .journey-premium .journey-step{position:relative;min-width:0;min-height:76px;display:flex;align-items:center;gap:10px;border-radius:17px;border:1px solid rgba(148,193,255,.31);background:linear-gradient(139deg,rgba(33,57,136,.89),rgba(18,31,90,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 7px 15px rgba(0,9,48,.18);text-decoration:none;padding:10px 12px;transition:transform .18s,border-color .18s,box-shadow .18s} .journey-premium .journey-step:hover{border-color:rgba(130,239,255,.8);transform:translateY(-2px)} .journey-premium .journey-step.is-current{border-color:#8bedff;background:linear-gradient(135deg,rgba(20,138,191,.8),rgba(46,58,156,.83));box-shadow:0 0 0 1px rgba(118,240,255,.25),0 8px 28px rgba(20,160,248,.19)} .journey-premium .journey-number{background:rgba(99,136,220,.32);border:1px solid rgba(190,220,255,.45);color:#f4fcff;min-width:36px;min-height:36px;display:grid;place-items:center;border-radius:12px;font-size:14px;font-weight:900} .journey-premium .journey-step.is-current .journey-number{color:#10274f;background:linear-gradient(135deg,#acfaff,#d2e2ff);border-color:#fff;box-shadow:0 0 17px rgba(76,242,255,.5)} .journey-premium .journey-text{min-width:0;display:flex;flex-direction:column;gap:2px} .journey-premium .journey-text strong{font-size:14px;font-weight:900;color:#fff;line-height:1.25;word-break:keep-all} .journey-premium .journey-text small{font-size:11px;color:#c9dbff;line-height:1.3} /* 2. Vehicle / cargo: clean cards, clear state & controls */ .cosmic-dashboard .sheet{border-color:rgba(156,203,255,.44);border-radius:24px;box-shadow:0 18px 44px rgba(2,9,43,.28),inset 0 1px 0 rgba(255,255,255,.12)} .cosmic-dashboard .section-head h2{font-size:clamp(20px,1.8vw,25px);font-weight:900;letter-spacing:-.035em} .cosmic-dashboard .section-head p{color:#dceaff;font-weight:600;line-height:1.55} .cosmic-dashboard .section-head .step{border-radius:12px;min-width:42px;min-height:40px;background:linear-gradient(142deg,#15b5d7,#3158d6);box-shadow:0 0 0 2px rgba(61,207,251,.16),0 4px 15px rgba(7,150,240,.31)} .cosmic-dashboard .vehicle-grid{gap:11px} .cosmic-dashboard .vehicle-grid .vehicle{border-color:rgba(161,210,255,.35);border-radius:18px;background:linear-gradient(151deg,rgba(47,79,158,.88),rgba(21,35,90,.95));box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 10px 20px rgba(0,8,50,.24);min-width:0} .cosmic-dashboard .vehicle-grid .vehicle:hover{border-color:#9cecff;box-shadow:0 12px 22px rgba(0,8,47,.3),0 0 0 1px rgba(101,236,255,.24)} .cosmic-dashboard .vehicle-grid .vehicle.chosen{border-color:#99f9ff;background:linear-gradient(152deg,rgba(28,122,175,.95),rgba(35,47,120,.95));box-shadow:0 0 0 2px rgba(81,230,255,.26),0 0 25px rgba(48,179,245,.28),inset 0 1px 0 rgba(255,255,255,.24)} .cosmic-dashboard .vehicle-grid .vehicle.chosen::after{content:'✓';position:absolute;right:8px;top:8px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;font-size:11px;font-weight:900;color:#102d56;background:linear-gradient(145deg,#c2fffc,#b0d0ff);box-shadow:0 0 14px rgba(112,244,255,.55);pointer-events:none} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:14px;font-weight:900;letter-spacing:-.025em;color:#fff} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:11px;color:#d4e2ff;line-height:1.5} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{object-fit:contain;object-position:center center} .cosmic-dashboard .tab-switch{min-height:48px} .cosmic-dashboard .tab{min-height:42px} .cosmic-dashboard .item-grid{gap:10px} .cosmic-dashboard .item-grid .item{border-color:rgba(172,208,255,.36);border-radius:18px;background:linear-gradient(160deg,rgba(49,69,147,.78),rgba(29,40,101,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.12);transition:border-color .2s,box-shadow .2s,transform .2s} .cosmic-dashboard .item-grid .item[data-selected="true"]{border-color:#a5f3ff;box-shadow:0 0 0 1px rgba(115,237,255,.3),0 0 23px rgba(83,171,248,.18);transform:translateY(-1px)} .cosmic-dashboard .counter{margin-top:10px} .cosmic-dashboard .counter button{min-width:34px;min-height:34px;display:grid;place-items:center} .cosmic-dashboard .counter b{min-width:15px;font-variant-numeric:tabular-nums} .cosmic-dashboard .cargo-collection-sub{color:#dde9ff} .cosmic-dashboard .v51-vehicle-guide{border-color:rgba(137,224,255,.45);background:linear-gradient(114deg,rgba(14,95,168,.35),rgba(75,61,165,.22));border-radius:17px} .cosmic-dashboard .v51-vehicle-guide p{color:#dcecff;font-size:12px} .v56-operator-action{display:none!important} /* 3. Address, details, date, payment: large touch targets and better contrast */ .cosmic-dashboard .form-card{border-radius:18px;border-color:rgba(158,203,255,.4)} .cosmic-dashboard .form-field label,.cosmic-dashboard label.subhead{color:#f3f8ff;font-weight:850} .cosmic-dashboard input,.cosmic-dashboard select,.cosmic-dashboard textarea{border-radius:12px;border-color:#b9ccee;background:#f6f9ff;color:#13265c;font-size:15px;min-height:48px;padding:12px 14px;line-height:1.4} .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{font-size:13px;color:#7486ad;opacity:1} .cosmic-dashboard input:focus-visible,.cosmic-dashboard select:focus-visible,.cosmic-dashboard textarea:focus-visible{outline:3px solid rgba(99,240,255,.68);outline-offset:1px;box-shadow:0 0 0 4px rgba(49,126,230,.19)} .cosmic-dashboard .space-method-card{border-radius:17px;border-color:rgba(164,207,255,.4)} .cosmic-dashboard .space-method-card.is-active{border-color:#8df5ff;box-shadow:0 0 0 1px rgba(164,254,255,.39),0 0 18px rgba(80,199,250,.25)} .cosmic-dashboard .space-method-card strong{font-size:13px;color:#fff} .cosmic-dashboard .space-method-card small{color:#d0defb;font-size:11px} .cosmic-dashboard .cosmic-payment-pills{gap:9px} .cosmic-dashboard .cosmic-pay{min-height:46px;border-radius:12px;font-weight:850;letter-spacing:-.02em} .cosmic-dashboard .cosmic-pay.is-active{border-color:#a7f6ff;color:#fff} .cosmic-dashboard .address-completion-note{font-size:12px;line-height:1.55;color:#cfe5ff} /* 4. Fare, summary, action: emphasize only the actual quote; keep unverified fares hidden */ .cosmic-dashboard #quote-section .quote-display{border-radius:21px;box-shadow:0 14px 38px rgba(0,9,43,.35),0 0 0 1px rgba(125,214,255,.28),inset 0 1px 0 rgba(255,255,255,.19)} .cosmic-dashboard #quote-section .quote-label .pill{font-weight:900;letter-spacing:.05em} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:clamp(31px,3.1vw,46px);letter-spacing:-.05em;font-variant-numeric:tabular-nums;line-height:1.25;overflow-wrap:anywhere} .cosmic-dashboard #quote-section .dispatch-quote-range{border-radius:14px} .cosmic-dashboard #quote-section #expectedFareRange[hidden]{display:none!important} .cosmic-dashboard #quote-section .quote-explain{font-size:12px;line-height:1.75;color:#dfebff} .cosmic-dashboard #quote-section .quote-actions{gap:10px} .cosmic-dashboard #quote-section .quote-actions button{min-height:53px;font-size:14px;font-weight:850;border-radius:14px} .cosmic-dashboard #quote-section #registerButton{min-height:56px;border-radius:15px;font-size:16px;font-weight:900;letter-spacing:-.015em} .cosmic-dashboard .submit-panel{border:1px solid rgba(159,210,255,.35);border-radius:18px;background:linear-gradient(155deg,rgba(21,58,128,.75),rgba(32,40,111,.76));padding:17px} .cosmic-dashboard .submit-panel strong{font-weight:900} .cosmic-dashboard .submit-panel p,.cosmic-dashboard .submit-panel .submit-help{line-height:1.75;color:#d7e7ff} .cosmic-dashboard .submit-panel .consent-row{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.65;color:#f1f8ff} .cosmic-dashboard .submit-panel .consent-row input{width:20px;height:20px;min-height:20px;flex:none;accent-color:#4cd5e8;margin-top:1px} .cosmic-dashboard .feedback{font-weight:700;line-height:1.6} .cosmic-dashboard .summary-list b,.cosmic-dashboard .summary-list span{line-height:1.6} .cosmic-dashboard #sidePrice{font-variant-numeric:tabular-nums;overflow-wrap:anywhere} /* 5. Mobile, a11y and performance */ a:focus-visible,button:focus-visible,.journey-step:focus-visible{outline:3px solid var(--v56-focus)!important;outline-offset:3px!important} #vehicle-title,#cargoTitle,#address-section,#schedule-title,#quote-section{scroll-margin-top:110px} @media(max-width:1100px){.journey-premium .journey-text strong{font-size:12px}.journey-premium .journey-step{gap:6px;padding:9px 8px}.journey-premium .journey-number{min-width:30px;min-height:30px;font-size:12px}.journey-premium .journey-text small{font-size:10px}} @media(max-width:800px){ .journey-progress.journey-premium{display:flex;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#83a8eb #17235a;gap:8px;padding:2px 2px 9px;grid-template-columns:none} .journey-premium .journey-step{flex:0 0 142px;min-height:63px;scroll-snap-align:start;padding:9px 10px} .journey-premium .journey-text strong{font-size:12px} .cosmic-dashboard .sheet{padding:18px 15px 21px;border-radius:19px} .cosmic-dashboard .vehicle-grid .vehicle{min-width:0} .cosmic-dashboard .section-head h2{font-size:21px} } @media(max-width:650px){ html{scroll-padding-top:83px} .space-hero{border-radius:22px;min-height:182px} .space-hero .eyebrow{font-size:10px;letter-spacing:1.25px} .space-hero .subtitle{font-size:12px;line-height:1.65;max-width:69%} .journey-premium .journey-step{flex-basis:136px} .cosmic-dashboard .sheet{padding:16px 12px 20px} .cosmic-dashboard .vehicle-grid{gap:10px} .cosmic-dashboard .vehicle-grid .vehicle{padding:10px 6px 13px;border-radius:16px} .cosmic-dashboard .vehicle-grid .vehicle strong{font-size:13px} .cosmic-dashboard .vehicle-grid .vehicle small{font-size:11px} .cosmic-dashboard .item-grid{gap:9px} .cosmic-dashboard .form-card{padding:15px 13px} .cosmic-dashboard input,.cosmic-dashboard select,.cosmic-dashboard textarea{font-size:16px;min-height:48px} /* prevent mobile zoom */ .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{font-size:13px} .cosmic-dashboard #quote-section .quote-display{padding:17px 12px} .cosmic-dashboard #quote-section .dispatch-quote-total strong{font-size:clamp(26px,7.9vw,40px)} .cosmic-dashboard .submit-panel{padding:15px 12px} .cosmic-dashboard .cosmic-payment-pills{gap:7px} .cosmic-dashboard .cosmic-pay{min-height:48px;font-size:13px} .cosmic-dashboard .v51-vehicle-guide p{font-size:11px} } @media(max-width:370px){.journey-premium .journey-step{flex-basis:128px}.cosmic-dashboard .vehicle-grid{gap:7px}.cosmic-dashboard .vehicle-grid .vehicle{padding:9px 4px}.cosmic-dashboard .vehicle-grid .vehicle small{font-size:10px}.cosmic-dashboard .space-method-card strong{font-size:12px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey-premium .journey-step,.cosmic-dashboard .item-grid .item{transition:none!important;transform:none!important}} /* V57: six illustrated payment cards (presentation only; preserve data-space-pay codes). */ .cosmic-dashboard .cosmic-payment-pills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .cosmic-dashboard .cosmic-pay.pay-art-card{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:118px;padding:10px 5px 9px;border-radius:17px;border:1.5px solid rgba(171,196,255,.43);background:linear-gradient(165deg,#344a92 0%,#1c285f 90%);box-shadow:inset 0 1px 0 #ffffff3b,0 7px 14px #080d3440;color:#f6faff;transition:transform .18s,box-shadow .18s,border-color .18s} .cosmic-dashboard .cosmic-pay.pay-art-card:hover{transform:translateY(-2px);border-color:#a1f1ff;box-shadow:0 8px 20px #080d3477,0 0 13px #5cd6ff4d} .cosmic-dashboard .cosmic-pay.pay-art-card img.pay-art-icon{display:block;width:min(76%,77px);height:68px;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 4px #03082468);pointer-events:none} .cosmic-dashboard .cosmic-pay.pay-art-card strong{display:block;font-size:14px;line-height:1.25;font-weight:900;white-space:nowrap;color:#f9fbff} .cosmic-dashboard .cosmic-pay.pay-art-card .pay-art-check{display:none;position:absolute;right:-6px;top:-7px;width:27px;height:27px;border-radius:50%;align-items:center;justify-content:center;color:#fff;background:linear-gradient(140deg,#e671ff,#743ff8);border:2px solid #f8d8ff;box-shadow:0 0 12px #d854ff} .cosmic-dashboard .cosmic-pay.pay-art-card.is-active{border:2px solid #ee97ff;color:#fff;background:linear-gradient(150deg,#464297,#271d65);box-shadow:0 0 0 1px #f3c6ff8a,0 0 19px #ca59ffb3,inset 0 1px 0 #ffffff66} .cosmic-dashboard .cosmic-pay.pay-art-card.is-active .pay-art-check{display:flex} @media(max-width:420px){.cosmic-dashboard .cosmic-payment-pills{gap:7px}.cosmic-dashboard .cosmic-pay.pay-art-card{min-height:101px;padding:8px 2px}.cosmic-dashboard .cosmic-pay.pay-art-card img.pay-art-icon{height:58px;width:min(77%,67px)}.cosmic-dashboard .cosmic-pay.pay-art-card strong{font-size:13px}} /* V58 — Mobile typography: prevent a single Korean syllable wrapping onto its own line. Scope: text presentation only; form validation, API values and event handlers unchanged. */ @media (max-width: 767px) { .space-hero .subtitle, .cosmic-dashboard .section-head p, .cosmic-dashboard .cargo-collection-sub, .cosmic-dashboard .notice, .cosmic-dashboard .field-help, .cosmic-dashboard .submit-panel p, .cosmic-dashboard .submit-panel .consent-row, .cosmic-dashboard .route-note, .cosmic-dashboard .quote-explain, .cosmic-dashboard .vehicle-grid .vehicle small, .cosmic-dashboard .space-method-card small, .cosmic-dashboard .v51-help-card p { word-break: keep-all; overflow-wrap: normal; text-wrap: pretty; } .journey-premium .journey-text strong, .cosmic-dashboard .vehicle-grid .vehicle strong, .cosmic-dashboard .space-method-card strong, .cosmic-dashboard .pay-art-card strong { white-space: nowrap; word-break: keep-all; } } /* V59: keep the mobile hero headline on ONE line without cropping the final syllable. V58 word-break alone could not solve it: the headline was capped at 93% of an already narrow hero-copy block. Expand the title's own layout width and scale its font smoothly with the device width. The mascot stays behind text. */ @media (max-width: 650px) { .space-hero .space-hero-copy { box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; } .space-hero h1 { display: block; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; white-space: nowrap; word-break: keep-all; overflow-wrap: normal; text-wrap: nowrap; font-size: clamp(16px, 5.7vw, 31px); letter-spacing: -0.055em; line-height: 1.3; } .space-hero h1 em { white-space: nowrap; } } /* V60 — premium mobile journey / non-invasive live snapshot. */ .v60-order-glance{display:none} @media(max-width:800px){ /* overflow:hidden on .page-bg would turn it into a scroll container, preventing sticky. */ @supports (overflow:clip) { .page-bg{overflow:clip} } /* Keep the five-step journey visible without covering the site header. */ .journey-progress.journey-premium{ position:sticky;top:var(--v60-header-height,68px);z-index:19; margin:0 -8px 14px;padding:9px 8px 12px; background:linear-gradient(180deg,rgba(9,16,53,.96),rgba(18,26,71,.92)); border:1px solid rgba(120,186,255,.22);border-radius:16px; -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px); box-shadow:0 11px 25px rgba(0,5,32,.24); scroll-padding-inline:12px; scrollbar-width:none; } .journey-progress.journey-premium::-webkit-scrollbar{display:none} .journey-premium .journey-step{flex:0 0 120px;min-height:56px;padding:8px 9px;border-radius:13px;gap:7px} .journey-premium .journey-number{min-width:29px;min-height:29px;border-radius:10px;font-size:11px} .journey-premium .journey-text strong{font-size:12px;letter-spacing:-.04em;white-space:nowrap} .journey-premium .journey-text small{font-size:10px;white-space:nowrap} /* Existing desktop summary appears below the form on mobile. Show a small, read-only mirror near the progress steps so users can verify choices. */ .v60-order-glance{display:grid;gap:11px;margin:0 0 17px;padding:14px 15px 13px; background:linear-gradient(130deg,rgba(26,75,153,.88),rgba(27,36,101,.92)); border:1px solid rgba(140,217,255,.5);border-radius:18px; box-shadow:0 10px 25px rgba(0,8,50,.22),inset 0 1px 0 rgba(255,255,255,.13)} .v60-glance-caption{display:flex;align-items:center;gap:7px;color:#f4faff;font-size:13px;line-height:1.45} .v60-glance-caption strong{font-weight:900;letter-spacing:-.025em} .v60-glance-star{color:#a9faff;filter:drop-shadow(0 0 5px #48d9ff)} .v60-glance-caption-sub{font-size:10px;color:#b9d9f9;font-weight:600;margin-left:auto;white-space:nowrap} .v60-glance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} .v60-glance-stat{min-width:0;padding:10px 9px;background:rgba(11,26,78,.62); border:1px solid rgba(137,188,249,.35);border-radius:11px} .v60-glance-stat span{display:block;color:#b8cffa;font-size:10px;font-weight:700;line-height:1.25} .v60-glance-stat strong{display:block;color:#fff;font-size:clamp(11px,3.3vw,14px); font-weight:900;line-height:1.4;margin-top:4px;word-break:keep-all;overflow-wrap:anywhere} .v60-glance-stat.is-ready strong{color:#a6ffe9} .v60-glance-jump{justify-self:end;display:inline-flex;align-items:center;gap:8px; min-height:35px;padding:5px 12px;border-radius:999px; border:1px solid rgba(128,245,255,.55);background:rgba(40,133,193,.22); color:#d7faff;font-size:11px;font-weight:900;letter-spacing:-.02em} .v60-glance-jump:focus-visible{outline:3px solid #a9faff;outline-offset:2px} .v60-glance-jump span{font-size:15px} /* Accurate offsets: sticky header + sticky journey area. */ #vehicle-title,#cargoTitle,#address-section,#schedule-title,#quote-section{scroll-margin-top:calc(var(--v60-header-height,68px) + 96px)} .cosmic-dashboard .space-method-card{min-width:0} .cosmic-dashboard .space-method-card img{max-width:100%;object-fit:contain} } @media(max-width:380px){ .journey-progress.journey-premium{margin-left:-5px;margin-right:-5px;padding:7px 6px 10px} .journey-premium .journey-step{flex-basis:112px;gap:6px} .journey-premium .journey-number{min-width:27px;min-height:27px} .v60-order-glance{padding:12px 10px} .v60-glance-caption-sub{font-size:9px} .v60-glance-stat{padding:9px 6px} } @media(prefers-reduced-motion:reduce){ .journey-progress.journey-premium{scroll-behavior:auto} } /* V61 · Premium vehicle / route cards: presentation-only. */ .cosmic-dashboard .v61-vehicle-guide{ position:relative;isolation:isolate;overflow:hidden;min-height:104px; display:flex;align-items:center;gap:15px; padding:12px 25px 12px 12px; border:1px solid rgba(153,239,255,.68);border-radius:20px; background:radial-gradient(ellipse at 100% 0%,rgba(167,105,255,.3),transparent 62%), linear-gradient(120deg,rgba(29,139,188,.38),rgba(43,52,132,.45)); box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 12px 28px rgba(2,14,70,.18); } .cosmic-dashboard .v61-vehicle-guide::after{ content:'';position:absolute;inset:0;pointer-events:none;z-index:-1; background:linear-gradient(110deg,transparent 22%,rgba(144,220,255,.065) 40%,transparent 58%); } .cosmic-dashboard .v61-vehicle-guide>img{flex:0 0 76px;width:76px;height:91px;object-fit:contain; filter:drop-shadow(0 9px 11px rgba(2,5,43,.25))} .v61-guide-copy{display:flex;flex-direction:column;gap:3px;min-width:0;padding:3px 0} .v61-guide-kicker{font-size:10px;font-weight:900;letter-spacing:.12em;color:#a5f4ff} .cosmic-dashboard .v61-guide-copy>strong{display:block;color:#fff;font-weight:900; font-size:clamp(15px,1.5vw,19px);letter-spacing:-.03em;line-height:1.45;word-break:keep-all} .cosmic-dashboard .v61-guide-copy>p{margin:1px 0 0;font-size:12px;line-height:1.58;color:#deebff;word-break:keep-all} .cosmic-dashboard .vehicle-grid .vehicle{ isolation:isolate;overflow:visible;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; } .cosmic-dashboard .vehicle-grid .vehicle::before{ content:'';position:absolute;inset:1px;border-radius:inherit;pointer-events:none;z-index:-1; background:radial-gradient(circle at 50% 0%,rgba(114,210,255,.16),transparent 72%); } .cosmic-dashboard .vehicle-grid .vehicle-icon{overflow:visible} .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art{ max-width:100%;filter:drop-shadow(0 9px 9px rgba(1,7,33,.33)); transition:transform .24s ease,filter .24s ease; } @media(hover:hover) and (pointer:fine){ .cosmic-dashboard .vehicle-grid .vehicle:hover .vehicle-icon img.space-vehicle-art{ transform:translateY(-4px) scale(1.045);filter:drop-shadow(0 11px 13px rgba(27,139,219,.4)); } } .cosmic-dashboard .vehicle-grid .vehicle.chosen .vehicle-icon img.space-vehicle-art{ filter:drop-shadow(0 8px 14px rgba(104,233,255,.33)); } .cosmic-dashboard .vehicle-grid .vehicle:focus-visible, .cosmic-dashboard .tab:focus-visible, .cosmic-dashboard .space-method-card:focus-visible{outline:3px solid #a4f6ff;outline-offset:3px} .v61-route-status{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center;column-gap:12px;row-gap:9px;margin:0 0 18px;padding:15px; border-radius:20px;border:1px solid rgba(154,211,255,.5); background:radial-gradient(ellipse at 60% 0%,rgba(103,86,228,.21),transparent 58%), linear-gradient(125deg,rgba(28,65,137,.84),rgba(20,32,91,.9)); box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 25px rgba(3,12,53,.17)} .v61-route-point{min-width:0;display:flex;align-items:center;gap:11px;padding:9px 11px; border-radius:13px;background:rgba(10,27,73,.35);border:1px solid rgba(126,172,238,.31); transition:border-color .18s ease,background .18s ease} .v61-route-point-icon{flex:0 0 31px;width:31px;height:31px;border-radius:11px; display:grid;place-items:center;color:#ddedff;font-size:18px;font-weight:900; background:linear-gradient(145deg,#315da3,#34428b)} .v61-route-point-copy{min-width:0;display:flex;flex-direction:column;gap:2px} .v61-route-point-copy small{color:#bcd7fb;font-size:11px;line-height:1.2;font-weight:750} .v61-route-point-copy strong{font-size:13px;line-height:1.3;font-weight:900;color:#f7fbff;white-space:nowrap} .v61-route-point.is-ready{border-color:rgba(138,255,218,.68);background:rgba(16,117,133,.22)} .v61-route-point.is-ready .v61-route-point-icon{color:#0b4852;background:linear-gradient(145deg,#9effea,#a8e9ff)} .v61-route-point.is-ready .v61-route-point-copy strong{color:#b1fff0} .v61-route-connector{display:flex;align-items:center;gap:4px;color:#99ecff;font-size:15px} .v61-route-connector span{height:1px;width:14px;background:rgba(137,209,255,.57)} .v61-route-note{grid-column:1/-1;margin:0;text-align:center;color:#d0e4ff;font-size:12px;line-height:1.5;font-weight:650;word-break:keep-all} .cosmic-dashboard .v61-address-card{border:1px solid rgba(156,197,255,.45);border-radius:19px; background:linear-gradient(145deg,rgba(52,72,143,.3),rgba(28,43,101,.22)); transition:border-color .2s ease,box-shadow .2s ease} .cosmic-dashboard .v61-address-card.is-address-ready{border-color:rgba(132,244,212,.64); box-shadow:0 0 0 1px rgba(118,255,229,.13),inset 0 1px 0 rgba(255,255,255,.08)} .cosmic-dashboard .v61-address-card .mini-title{font-weight:900} .cosmic-dashboard .v61-address-card .address-search-trigger{border-radius:13px;overflow:hidden; box-shadow:0 5px 14px rgba(3,12,49,.14)} .cosmic-dashboard .v61-address-card .address-search-trigger input[readonly]{cursor:pointer} .cosmic-dashboard .v61-address-card .address-search-trigger:focus-within{ outline:2px solid rgba(115,244,254,.8);outline-offset:2px} .cosmic-dashboard .v61-address-card .address-search-trigger button{ min-width:48px;min-height:46px;border-radius:0 12px 12px 0; background:linear-gradient(140deg,#119cbd,#5366dc);color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.25)} .cosmic-dashboard .v61-address-card .address-search-trigger button:hover{ background:linear-gradient(140deg,#17bed4,#6b6afa)} .cosmic-dashboard .v61-address-card .address-completion-note{line-height:1.6} @media(max-width:800px){ .cosmic-dashboard .v61-vehicle-guide{min-height:98px;padding:11px 13px 11px 9px;gap:11px} .cosmic-dashboard .v61-vehicle-guide>img{flex-basis:68px;width:68px;height:84px} .cosmic-dashboard .v61-guide-copy>strong{font-size:15px} .cosmic-dashboard .v61-guide-copy>p{font-size:11px} .v61-route-status{padding:10px;column-gap:7px;margin-bottom:15px} .v61-route-point{padding:8px 7px;gap:7px} .v61-route-point-icon{flex-basis:26px;width:26px;height:29px;border-radius:9px;font-size:15px} .v61-route-point-copy small{font-size:10px} .v61-route-point-copy strong{font-size:11px} .v61-route-connector{gap:3px;font-size:12px} .v61-route-connector span{width:7px} .v61-route-note{font-size:11px} } @media(max-width:365px){ .v61-route-point-icon{display:none} .v61-route-status{column-gap:5px} .v61-route-point{justify-content:center} .v61-route-note{font-size:10px} .cosmic-dashboard .v61-vehicle-guide>img{width:58px;flex-basis:58px;height:77px} .v61-guide-kicker{font-size:9px} } @media(prefers-reduced-motion:reduce){ .cosmic-dashboard .vehicle-grid .vehicle-icon img.space-vehicle-art, .cosmic-dashboard .vehicle-grid .vehicle{transition:none!important;transform:none!important} } /* [consolidated from space-v62.css] */ /* V62 · premium confirmation card; no changes to quote, address, API or order controls. */ .v62-receipt[hidden], .v62-side-receipt-link[hidden], .v62-receipt-fact[hidden]{display:none!important} .v62-receipt{margin:22px 0 4px;padding:0;overflow:hidden;border:1px solid rgba(145,236,255,.62);border-radius:23px;background:linear-gradient(155deg,rgba(19,68,137,.98),rgba(32,37,102,.97) 60%,rgba(53,34,116,.96));box-shadow:0 0 0 1px rgba(86,209,255,.16),0 20px 42px rgba(1,8,37,.34),inset 0 1px 0 rgba(255,255,255,.19);color:#f8fcff;scroll-margin-top:calc(var(--v60-header-height, 68px) + 20px)} .v62-receipt-top{display:flex;align-items:center;gap:15px;padding:23px 23px 19px;background:radial-gradient(circle at 92% 9%,rgba(173,92,254,.22),transparent 48%);border-bottom:1px solid rgba(158,218,255,.2)} .v62-receipt-emblem{display:grid;flex:0 0 53px;height:53px;place-items:center;background:linear-gradient(145deg,#5ffff1,#4a93fb);border:2px solid #b7fbff;border-radius:17px;box-shadow:0 0 20px rgba(41,222,250,.37);color:#12336b;font-size:29px;font-weight:950} .v62-receipt.is-pending .v62-receipt-emblem{background:linear-gradient(145deg,#ffe5a5,#f5b76b);border-color:#fff0c6;box-shadow:0 0 20px rgba(251,186,108,.3)} .v62-receipt-heading{min-width:0;flex:1} .v62-receipt-overline{margin:0 0 5px!important;color:#b3d9fa!important;font-size:10px!important;letter-spacing:.13em;font-weight:850} .v62-receipt h3{font-size:clamp(18px,2vw,23px);line-height:1.35;margin:0!important;color:#fff;font-weight:900;letter-spacing:-.04em;overflow-wrap:break-word} .v62-receipt h3:focus{outline:none} .v62-receipt-heading > p:last-child{font-size:12px;color:#e0ebff;line-height:1.6;margin:5px 0 0} .v62-receipt-status{border:1px solid rgba(159,242,247,.55);border-radius:30px;padding:7px 11px;white-space:nowrap;font-size:12px;font-weight:900;color:#b4fff7;background:rgba(40,190,191,.17)} .v62-receipt.is-pending .v62-receipt-status{color:#fff0bc;border-color:rgba(255,212,149,.6);background:rgba(249,180,84,.17)} .v62-receipt-content{padding:20px 23px 10px} .v62-receipt-primary{display:flex;flex-direction:column;gap:6px;padding:17px 18px;border-radius:16px;background:rgba(4,26,75,.5);border:1px solid rgba(155,226,255,.38)} .v62-receipt-primary span,.v62-receipt-fact span{font-size:11px;color:#c4dcff;font-weight:700} .v62-receipt-primary strong{font-size:clamp(19px,3vw,28px);font-variant-numeric:tabular-nums;letter-spacing:.015em;color:#fff;overflow-wrap:anywhere;user-select:text} .v62-receipt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:11px} .v62-receipt-fact{display:flex;flex-direction:column;gap:7px;min-width:0;padding:13px 15px;border-radius:13px;background:rgba(81,118,200,.18);border:1px solid rgba(164,208,249,.18)} .v62-receipt-fact strong{font-size:15px;font-weight:850;line-height:1.4;color:#fff;overflow-wrap:anywhere;user-select:text} .v62-receipt-notice{margin:14px 1px 6px;font-size:12px;line-height:1.8;color:#e5f0ff} .v62-receipt-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 23px} .v62-receipt-actions button{min-height:49px;display:flex;justify-content:center;align-items:center;gap:8px;border-radius:13px;cursor:pointer;font-weight:850;font-size:13px;letter-spacing:-.01em;transition:transform .15s,box-shadow .15s} .v62-receipt-actions button:hover{transform:translateY(-1px)} .v62-receipt-actions button:focus-visible{outline:3px solid #72f5ff;outline-offset:3px} .v62-receipt-copy{border:1px solid #8ef3ff;color:#072e5d;background:linear-gradient(120deg,#97f8ff,#80bbff);box-shadow:0 6px 15px rgba(27,175,232,.25)} .v62-receipt-print{border:1px solid rgba(174,211,255,.6);color:#f4faff;background:rgba(103,124,210,.21)} .v62-receipt-footnote{margin:15px 23px 4px;font-size:11px;color:#cee0fb;line-height:1.65} .v62-receipt-copy-feedback{margin:0 23px 20px;min-height:15px;font-size:12px;color:#a6f6ff} .v62-side-receipt-link{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;padding:12px;border:1px solid rgba(126,240,255,.48);border-radius:12px;background:rgba(45,143,179,.19);color:#dffaff!important;font-size:12px;font-weight:850;text-decoration:none} .v62-side-receipt-link:focus-visible{outline:3px solid #7ffaff;outline-offset:3px} @media(max-width:600px){ .v62-receipt{margin-top:16px;border-radius:19px} .v62-receipt-top{padding:17px 14px 15px;flex-wrap:wrap;gap:10px} .v62-receipt-emblem{flex-basis:43px;height:43px;font-size:22px;border-radius:12px} .v62-receipt-heading{flex:1 1 calc(100% - 60px)} .v62-receipt-status{margin-left:53px;padding:6px 10px} .v62-receipt-content{padding:14px 13px 6px} .v62-receipt-primary{padding:14px} .v62-receipt-grid{grid-template-columns:1fr;gap:8px} .v62-receipt-fact{padding:10px 13px} .v62-receipt-actions{margin:9px 13px;gap:8px} .v62-receipt-actions button{min-height:48px;font-size:12px} .v62-receipt-footnote{margin:14px 13px 4px} .v62-receipt-copy-feedback{margin:0 13px 16px} } @media(max-width:340px){.v62-receipt-actions{grid-template-columns:1fr}} @media(prefers-reduced-motion:reduce){.v62-receipt-actions button{transition:none}} @media print{ @page{margin:18mm} body.v62-printing .site-head, body.v62-printing .page-shell > :not(.cosmic-dashboard), body.v62-printing .cosmic-left, body.v62-printing .cosmic-right > :not(#quote-section), body.v62-printing .side-column, body.v62-printing #quote-section > :not(#v62Receipt), body.v62-printing .cosmos-sky-layer, body.v62-printing footer{display:none!important} body.v62-printing .page-bg, body.v62-printing .layout, body.v62-printing .main-column, body.v62-printing #quote-section{display:block!important;position:static!important;max-width:none!important;margin:0!important;padding:0!important;background:white!important;border:0!important;box-shadow:none!important;color:#152544!important} body.v62-printing #v62Receipt{display:block!important;margin:0!important;padding:0!important;break-inside:avoid;background:white!important;box-shadow:none!important;border:1px solid #b7c5db!important;color:#152544!important} body.v62-printing #v62Receipt *{text-shadow:none!important;box-shadow:none!important} body.v62-printing #v62Receipt :is(h3,strong,span,p){color:#152544!important} body.v62-printing #v62Receipt .v62-receipt-actions, body.v62-printing #v62CopyFeedback{display:none!important} } /* [consolidated from space-v63.css] */ /* V63 · final step polish. Purely visual: no quote/register control changes. */ .v63-final-review{position:relative;margin:18px 0 16px;overflow:hidden;color:#fff;border:1px solid rgba(119,218,255,.47);border-radius:21px;background:linear-gradient(142deg,rgba(17,57,119,.95),rgba(22,39,98,.96) 53%,rgba(47,33,112,.95));box-shadow:0 14px 30px rgba(4,13,55,.25),inset 0 1px 0 rgba(255,255,255,.13);scroll-margin-top:calc(var(--v60-header-height, 70px) + 16px)} .v63-final-review::before{content:"";position:absolute;top:-87px;right:-40px;width:220px;height:220px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(145,96,255,.24),transparent 70%)} .v63-final-head{display:flex;align-items:center;gap:12px;padding:20px 20px 15px;border-bottom:1px solid rgba(167,213,255,.17)} .v63-final-symbol{width:43px;height:43px;flex:none;border-radius:14px;display:grid;place-items:center;font-size:25px;font-weight:900;color:#073c68;background:linear-gradient(145deg,#b4faff,#58c8fc);box-shadow:0 0 20px rgba(67,225,250,.28)} .v63-final-heading{flex:1;min-width:0} .v63-final-eyebrow{display:block;font-size:10px;letter-spacing:.09em;font-weight:850;color:#a8daff;margin-bottom:4px} .v63-final-heading h3{margin:0;color:#fff;font-size:clamp(17px,2vw,21px);line-height:1.35;font-weight:900;letter-spacing:-.03em} .v63-final-heading p{margin:5px 0 0;color:#cde2ff;font-size:12px;line-height:1.5} .v63-final-state{flex:none;max-width:112px;border:1px solid rgba(146,222,255,.32);border-radius:99px;padding:6px 9px;background:rgba(87,138,211,.18);color:#e4f4ff;font-size:11px;font-weight:850;text-align:center;line-height:1.4} .v63-final-state.is-ready{border-color:rgba(97,240,211,.58);background:rgba(36,173,160,.2);color:#affff1} .v63-final-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:16px 18px 12px} .v63-final-row{display:flex;align-items:center;min-width:0;gap:10px;padding:13px 12px;border-radius:14px;border:1px solid rgba(160,200,255,.17);background:rgba(87,117,196,.12)} .v63-final-row-icon{font-size:19px;width:29px;text-align:center;flex:none} .v63-final-content{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px} .v63-final-label{font-size:11px;font-weight:760;color:#bad4f5} .v63-final-content strong,.v63-final-content small{display:block;min-width:0;overflow-wrap:anywhere;word-break:keep-all} .v63-final-content strong{font-size:13px;line-height:1.45;font-weight:900;color:#fff} .v63-final-content small{font-size:11px;line-height:1.55;color:#e0eaff} .v63-final-fare strong{color:#b6fbff;font-size:16px;font-variant-numeric:tabular-nums} .v63-final-edit{flex:none;align-self:center;min-width:40px;min-height:38px;display:grid;place-items:center;padding:0 7px;border:1px solid rgba(156,226,255,.55);border-radius:10px;background:rgba(89,164,224,.15);text-decoration:none!important;font-weight:850;font-size:12px;color:#d5faff!important;transition:background .18s,border-color .18s} .v63-final-edit:hover{background:rgba(89,190,224,.35);border-color:#8df3ff} .v63-final-edit:focus-visible,.v63-final-detail:focus-visible{outline:3px solid #7af0ff;outline-offset:3px} .v63-final-tools{padding:0 20px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px} .v63-final-tools p{margin:0!important;flex:1;font-size:11px;color:#cbdffc;line-height:1.6} .v63-final-detail{min-height:43px;flex:none;border:1px solid rgba(180,231,255,.53);border-radius:12px;padding:10px 13px;white-space:nowrap;background:rgba(117,141,218,.22);color:#fff;font-size:12px;font-weight:900;cursor:pointer} .v63-final-detail:hover{background:rgba(139,161,249,.31)} .cosmic-dashboard .submit-panel{box-shadow:0 11px 29px rgba(7,19,72,.21),inset 0 1px 0 rgba(255,255,255,.12)} .cosmic-dashboard .submit-panel:has(#confirmLive:checked){border-color:rgba(116,248,231,.7);box-shadow:0 0 0 1px rgba(96,229,212,.14),0 11px 29px rgba(7,19,72,.24)} .cosmic-dashboard #registerButton:not(:disabled){box-shadow:0 12px 28px rgba(67,176,241,.23),0 0 20px rgba(61,218,253,.16)} @media(max-width:760px){.v63-final-rows{grid-template-columns:1fr;gap:8px;padding:13px 13px 12px}.v63-final-head{padding:16px 13px 14px;gap:9px}.v63-final-tools{padding:0 13px 15px;flex-direction:column;align-items:stretch;gap:9px}.v63-final-detail{width:100%;white-space:normal}.v63-final-row{padding:10px 11px}.v63-final-review{border-radius:18px;margin-top:15px}.v63-final-heading p{font-size:11px}} @media(max-width:360px){.v63-final-head{flex-wrap:wrap}.v63-final-state{margin-left:51px}.v63-final-row-icon{width:25px;font-size:17px}} @media(prefers-reduced-motion:reduce){.v63-final-edit{transition:none}} /* [consolidated from space-v64.css] */ /* V64 · form layout refinement; all API, order and address element IDs are kept. */ /* Keep the progress nodes for legacy read-only snapshot sync, but remove their visual row. */ .journey-progress.journey-premium { display:none !important; } /* Legible, restrained emphasis instead of a translucent gradient on the headline. */ .space-hero h1 .isf-hero-keyword { display:inline-block; margin-left:.18em; font-style:normal; font-weight:900; letter-spacing:-.055em; color:#d5faff !important; -webkit-text-fill-color:#d5faff !important; background:none !important; -webkit-background-clip:initial !important; background-clip:initial !important; filter:none !important; text-shadow:0 2px 12px rgba(2,18,57,.68); border-bottom:3px solid rgba(101,240,242,.84); padding-bottom:1px; } .space-hero .isf-hero-status { display:inline-flex; margin:0 0 11px; border-color:rgba(151,249,220,.66); background:rgba(13,88,98,.69); font-size:12px; font-weight:850; box-shadow:inset 0 1px 0 rgba(255,255,255,.14); } .space-hero .isf-hero-subtitle { max-width:620px; } .space-hero .isf-hero-subtitle span {display:block;} .space-hero .isf-hero-subtitle span+span {margin-top:3px;} /* 4:6 name + phone pairs in all three contact sections, including narrow mobiles. */ .cosmic-dashboard .isf-identity-row { display:grid; grid-template-columns:minmax(0,4fr) minmax(0,6fr); align-items:start; column-gap:10px; width:100%; min-width:0; margin-bottom:11px; } .cosmic-dashboard .isf-identity-row > .form-field {min-width:0;margin-bottom:0;} .cosmic-dashboard .isf-identity-row input {box-sizing:border-box;min-width:0;width:100%;} .cosmic-dashboard .isf-identity-row label {font-size:clamp(11px,1.07vw,13px);white-space:nowrap;letter-spacing:-.04em;} .cosmic-dashboard .isf-identity-row .isf-field-required {font-size:10px;} .cosmic-dashboard .truck-shape-field #truckBodyType {min-width:0;width:100%;} .cosmic-dashboard .truck-shape-field #vehicleCatalogStatus { font-size:12px;line-height:1.6;color:#bceeff; } /* Quote continues to update automatically after valid address selection; no duplicate action row. */ .cosmic-dashboard #quote-section .quote-actions {display:none !important;} @media (max-width:760px) { .space-hero .isf-hero-status {font-size:10px;padding:5px 10px;margin-bottom:9px;} .space-hero h1 .isf-hero-keyword {border-bottom-width:2px;} .space-hero .isf-hero-subtitle {max-width:80%;} .cosmic-dashboard .isf-identity-row {grid-template-columns:minmax(0,4fr) minmax(0,6fr);column-gap:8px;} .cosmic-dashboard .isf-identity-row label {font-size:11px;} .cosmic-dashboard .isf-identity-row input {font-size:13px;min-height:47px;padding:10px 9px;} } @media (max-width:380px) { .space-hero .isf-hero-subtitle {max-width:77%;} .cosmic-dashboard .isf-identity-row {column-gap:7px;} .cosmic-dashboard .isf-identity-row label {font-size:10px;} .cosmic-dashboard .isf-identity-row input {font-size:12px;padding:9px 7px;} .cosmic-dashboard .isf-identity-row .isf-field-required {font-size:9px;} } /* [consolidated from space-v65.css] */ /* V65 · layout, confirmation and full-width sticky fare dock. No hidden legacy controls removed. */ :root{--isf-dock-height:92px} body{padding-bottom:calc(var(--isf-dock-height) + env(safe-area-inset-bottom,0px))} .space-hero .space-hero-badges{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px} .space-hero .space-hero-badges > span, .space-hero .space-hero-badges > .isf-hero-status{display:inline-flex!important;align-items:center;justify-content:center;gap:6px;line-height:1.35;white-space:nowrap;min-height:31px;box-sizing:border-box;margin:0;border-radius:999px;font-size:12px;padding:5px 12px;font-weight:800} .space-hero .space-hero-badges > .isf-hero-status{background:rgba(11,100,105,.68);color:#e0fffa;border:1px solid rgba(140,255,226,.66);box-shadow:0 0 12px rgba(15,237,206,.17)} .space-hero .space-hero-badges .status-dot{flex:none} /* 3 equal fields in one row; the memo now owns the complete width below cargo items. */ .cosmic-dashboard .isf-three-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end;min-width:0} .cosmic-dashboard .isf-three-fields .form-field{min-width:0;margin:0} .cosmic-dashboard .isf-three-fields :is(input,select){width:100%;min-width:0;height:48px;box-sizing:border-box} .cosmic-dashboard .isf-three-fields label{display:block;white-space:nowrap;letter-spacing:-.045em;font-size:clamp(11px,1vw,13px)} .cosmic-dashboard .isf-cargo-memo-full{margin-top:20px;width:100%;min-width:0} .cosmic-dashboard .isf-cargo-memo-full >div{min-width:0} .cosmic-dashboard .isf-cargo-memo-full textarea{width:100%;box-sizing:border-box} /* The actual Insung result and its +25% reference shown side-by-side. */ .cosmic-dashboard #quote-section .dispatch-quote-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:center} .cosmic-dashboard .dispatch-quote-grid>.dispatch-quote-total, .cosmic-dashboard .dispatch-quote-grid>.dispatch-quote-range{min-width:0;width:100%;margin:0;text-align:left} .cosmic-dashboard #expectedFareRange:not([hidden]){display:flex;flex-direction:column;gap:5px;padding:13px 15px;border-radius:14px;border:1px solid rgba(143,231,248,.43);background:rgba(21,56,116,.65)} .cosmic-dashboard #expectedFareRange[hidden]{display:none!important} .cosmic-dashboard #expectedFareRange .dispatch-quote-endpoints{display:flex;flex-wrap:wrap;align-items:center;gap:5px;font-size:clamp(13px,1.2vw,17px);font-weight:850;color:#fff} .cosmic-dashboard #expectedFareRange .dispatch-price-overline{font-size:12px;letter-spacing:0;color:#9ef5ff;font-weight:900} .cosmic-dashboard #expectedFareRange .dispatch-range-caption{font-size:11px;color:#e7f0ff;line-height:1.5} /* Full viewport-wide dock remains visible during scrolling. */ .isf-fare-dock{position:fixed;left:0;right:0;bottom:0;z-index:40;min-height:var(--isf-dock-height);background:linear-gradient(110deg,rgba(8,23,66,.98),rgba(26,41,107,.98) 62%,rgba(37,41,106,.98));border-top:1px solid rgba(150,238,255,.65);box-shadow:0 -11px 35px rgba(4,10,43,.38);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);color:white;padding-bottom:env(safe-area-inset-bottom,0px)} .isf-fare-dock-inner{max-width:1530px;margin:auto;min-height:var(--isf-dock-height);padding:12px 24px;display:flex;align-items:center;gap:25px;justify-content:space-between} .isf-fare-dock-label{display:flex;flex-direction:column;flex:0 0 auto;min-width:130px;position:relative;padding-left:19px} .isf-fare-dock-dot{position:absolute;left:0;top:6px;width:9px;height:9px;border-radius:50%;background:#8afce5;box-shadow:0 0 10px #41f5e5} .isf-fare-dock-label strong{font-size:15px;font-weight:900;color:#e2fbff} .isf-fare-dock-label small{font-size:11px;color:#c8ddfa;font-weight:650} .isf-fare-dock-price{display:flex;align-items:center;justify-content:center;gap:12px;flex:1 1 auto;min-width:0;font-variant-numeric:tabular-nums} .isf-fare-dock-price>span:first-child{font-size:clamp(18px,2.2vw,29px);font-weight:900;letter-spacing:-.035em;white-space:nowrap} .isf-fare-dock-plus{display:inline-flex;gap:7px;align-items:center;color:#9ff5ef;font-weight:800;font-size:14px;white-space:nowrap} .isf-fare-dock-plus[hidden]{display:none!important} .isf-fare-dock-plus b{font-size:clamp(17px,1.8vw,24px);color:#bdfdff} .isf-fare-dock-note{flex:0 1 285px;max-width:285px;padding-left:15px;border-left:1px solid rgba(161,218,255,.35);font-size:12px;font-weight:650;color:#d4eaff;line-height:1.55} /* Final dialog: never sends until second explicit consent and click. */ .isf-final-dialog{color:#122347;border:1px solid #88c8f2;background:#f8fbff;border-radius:22px;padding:0;width:min(680px,calc(100vw - 26px));max-height:min(89dvh,850px);box-shadow:0 25px 90px rgba(0,7,37,.65);overflow:hidden} .isf-final-dialog::backdrop{background:rgba(1,7,30,.78);backdrop-filter:blur(6px)} .isf-final-shell{display:flex;flex-direction:column;max-height:min(89dvh,850px)} .isf-final-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:21px 23px 17px;color:#e7faff;background:linear-gradient(120deg,#102b68,#2949a1)} .isf-final-head span{font-size:10px;letter-spacing:1.3px;color:#94dfee;font-weight:850} .isf-final-head h2{font-size:23px;margin:5px 0 3px;line-height:1.25;letter-spacing:-.05em;color:#fff} .isf-final-head p{font-size:12px;line-height:1.5;color:#dbedff;margin:0} .isf-final-head button{border:1px solid #88aed4;border-radius:10px;background:#ffffff19;color:#fff;min-width:38px;min-height:38px} .isf-final-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px 22px 17px} .isf-final-content{display:grid;gap:0} .isf-final-row{display:grid;grid-template-columns:minmax(0,35%) minmax(0,65%);gap:12px;padding:9px 2px;border-bottom:1px solid #dfebf4;line-height:1.55;align-items:start} .isf-final-row span{font-weight:750;font-size:12px;color:#60718e} .isf-final-row strong{font-size:13px;color:#16264a;font-weight:780;overflow-wrap:anywhere;white-space:pre-wrap} .isf-final-privacy{margin:18px 0 0;padding:17px;border:1px solid #bdd5e7;border-radius:15px;background:#eef6ff} .isf-final-privacy>strong{display:block;font-size:15px;color:#193a65;margin-bottom:7px} .isf-final-privacy p{font-size:12px;line-height:1.6;color:#405373;margin:5px 0} .isf-final-agree{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px;border-radius:11px;border:1px solid #96bbdf;background:white;cursor:pointer;font-size:13px;font-weight:800;color:#1d3666;line-height:1.5} .isf-final-agree input{flex:none;width:20px;height:20px;accent-color:#1a69c4;cursor:pointer;margin:0} .isf-final-agree b{color:#aa395b} .isf-final-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:11px;padding:13px 22px 18px;border-top:1px solid #deebf3;background:#fff} .isf-final-actions button{border:1px solid #98b9d3;border-radius:12px;min-height:49px;font-size:14px;font-weight:900;padding:10px} .isf-final-actions button:first-child{background:#f3f7fb;color:#24426a} .isf-final-actions .primary{border-color:#1578ce;background:linear-gradient(115deg,#1486d5,#1f4bb0);color:#fff} .isf-final-actions button:disabled{opacity:.5;cursor:not-allowed} @media(max-width:760px){ :root{--isf-dock-height:103px} .space-hero .space-hero-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:min(100%,330px)} .space-hero .space-hero-badges > span,.space-hero .space-hero-badges > .isf-hero-status{min-width:0;min-height:31px;padding:5px 6px;font-size:10px;justify-content:center;text-align:center;white-space:nowrap} .space-hero .space-hero-badges > .isf-hero-status{font-size:10px;margin:0} .cosmic-dashboard .isf-three-fields{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px} .cosmic-dashboard .isf-three-fields label{font-size:11px} .cosmic-dashboard .isf-three-fields :is(input,select){min-height:46px;font-size:12px;padding:9px 7px} .cosmic-dashboard .isf-three-fields input::placeholder{font-size:11px} .cosmic-dashboard #quote-section .dispatch-quote-grid{grid-template-columns:1fr;gap:13px} .isf-fare-dock-inner{min-height:var(--isf-dock-height);padding:9px 13px;gap:4px 9px;display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center} .isf-fare-dock-label{min-width:0;padding-left:15px} .isf-fare-dock-label strong{font-size:13px} .isf-fare-dock-label small{font-size:9px} .isf-fare-dock-price{flex-wrap:wrap;justify-content:flex-end;gap:3px 8px} .isf-fare-dock-price>span:first-child{font-size:clamp(16px,4.5vw,23px)} .isf-fare-dock-plus{font-size:11px} .isf-fare-dock-plus b{font-size:clamp(14px,4vw,19px)} .isf-fare-dock-note{grid-column:1 / -1;max-width:none;border:0;border-top:1px solid rgba(177,224,255,.25);text-align:center;padding:6px 0 0;font-size:11px;line-height:1.3} .isf-final-head{padding:18px 15px 14px} .isf-final-head h2{font-size:20px} .isf-final-scroll{padding:10px 13px 12px} .isf-final-row{grid-template-columns:minmax(0,34%) minmax(0,66%);gap:8px} .isf-final-actions{padding:11px 13px 15px;gap:8px} .isf-final-actions button{font-size:13px} .isf-final-privacy{padding:12px} } @media(max-width:380px){ .space-hero .space-hero-badges{width:min(100%,270px);gap:5px} .space-hero .space-hero-badges > span,.space-hero .space-hero-badges > .isf-hero-status{font-size:9px;padding:4px 3px} .cosmic-dashboard .isf-three-fields{gap:5px} .cosmic-dashboard .isf-three-fields :is(input,select){font-size:11px;padding:8px 5px} .cosmic-dashboard .isf-three-fields label{font-size:10px} .isf-fare-dock-inner{grid-template-columns:93px minmax(0,1fr);padding-left:9px;padding-right:9px} .isf-fare-dock-price{gap:3px 5px} .isf-fare-dock-price>span:first-child{font-size:15px} .isf-fare-dock-plus b{font-size:14px} } @media print{body{padding-bottom:0}.isf-fare-dock{display:none!important}.isf-final-dialog{display:none!important}} /* [consolidated from space-v66.css] */ /* V66 · visible form flow: 01 vehicle, 02 address, 03 schedule. Legacy quote helpers remain in the DOM for automatic API/fare calculations only. */ .layout.cosmic-dashboard{grid-template-columns:minmax(0,1fr)!important} .layout.cosmic-dashboard .cosmic-left{width:100%;min-width:0} .layout.cosmic-dashboard .cosmic-right{display:none!important} .cosmic-dashboard .isf-internal-quote{display:none!important} .cosmic-dashboard .isf-order-readiness{padding-top:19px;padding-bottom:19px} .isf-ready-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:7px 12px;margin-bottom:15px;color:#fff} .isf-ready-heading strong{font-size:17px;font-weight:900;letter-spacing:-.04em} .isf-ready-heading span{font-size:12px;color:#d2e8ff} .cosmic-dashboard .isf-order-readiness .submit-panel{margin:0;padding:14px 17px;border-radius:15px} .cosmic-dashboard .isf-order-readiness .submit-panel .consent-row{font-size:14px;font-weight:850} .cosmic-dashboard .isf-order-readiness .submit-help{margin:8px 0 0;line-height:1.6;font-size:12px} .cosmic-dashboard .isf-order-readiness .feedback{padding:10px 13px;border-radius:11px;background:rgba(27,66,136,.54);border:1px solid rgba(160,205,255,.25);color:#d8f3ff;font-size:12px;margin-top:14px;overflow-wrap:anywhere} .cosmic-dashboard .isf-order-readiness .feedback.error{border-color:rgba(255,151,163,.75);background:rgba(133,23,56,.5);color:#fff2f2} .cosmic-dashboard .isf-order-readiness .v62-receipt:not([hidden]){margin-top:15px} /* Dock is the sole entry point to final review; it preserves the V65 double-check dialog. */ /* Floating translucent fare dock refinement (V66.2) */ :root{--isf-dock-height:105px} .isf-fare-dock{position:fixed;left:50%;bottom:max(14px, env(safe-area-inset-bottom,0px) + 10px);transform:translateX(-50%);z-index:40;width:min(calc(100% - 24px),1480px);min-height:var(--isf-dock-height);padding:0;border-radius:24px;background:linear-gradient(112deg,rgba(7,22,64,.78),rgba(24,39,100,.74) 58%,rgba(36,40,109,.7));border:1px solid rgba(160,235,255,.58);box-shadow:0 20px 44px rgba(3,9,38,.38),0 8px 22px rgba(40,182,255,.12),inset 0 1px 0 rgba(255,255,255,.1);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);color:#fff;overflow:hidden;animation:isfDockFloat 4.8s ease-in-out infinite} .isf-fare-dock::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 16% 18%,rgba(152,255,232,.16),transparent 25%),radial-gradient(circle at 82% 30%,rgba(120,187,255,.16),transparent 26%);pointer-events:none} @keyframes isfDockFloat{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-5px)}} .isf-fare-dock-inner{position:relative;z-index:1;max-width:none;margin:0 auto} .isf-fare-dock-label strong{font-size:15px;font-weight:900;color:#ecfdff} .isf-fare-dock-label small{font-size:11px;color:#cfe4ff;font-weight:700} .isf-fare-dock-dot{display:inline-block;width:9px;height:9px;border-radius:999px;background:#8afce5;box-shadow:0 0 11px rgba(88,245,235,.95),0 0 24px rgba(88,245,235,.45);margin-right:8px;vertical-align:middle} .isf-fare-dock-price{display:flex;align-items:center;font-variant-numeric:tabular-nums} .isf-fare-dock-price>span:first-child{font-size:clamp(19px,2.4vw,31px);font-weight:950;letter-spacing:-.038em;color:#f5feff;text-shadow:0 0 10px rgba(122,236,255,.46),0 0 24px rgba(60,190,255,.34),0 0 42px rgba(101,116,255,.16)} .isf-fare-dock-plus{display:inline-flex;gap:7px;align-items:center;color:#9ff5ef;font-weight:800;font-size:14px;white-space:nowrap} .isf-fare-dock-plus[hidden]{display:none!important} .isf-fare-dock-plus b{font-size:clamp(17px,1.8vw,24px);color:#cbffff;text-shadow:0 0 12px rgba(129,245,255,.4),0 0 28px rgba(91,209,255,.24)} .isf-fare-dock-note{font-weight:650;color:#d7ebff;line-height:1.55;border-left:1px solid rgba(177,224,255,.22)} .isf-fare-dock-inner{display:grid;grid-template-columns:minmax(110px,.9fr) minmax(0,2.3fr) minmax(140px,1.2fr) minmax(165px,1fr);gap:13px;min-height:var(--isf-dock-height);padding:11px 24px} .isf-fare-dock-label{min-width:0} .isf-fare-dock-price{justify-content:center;flex-wrap:wrap;gap:3px 9px;min-width:0} .isf-fare-dock-price>span:first-child{white-space:normal;overflow-wrap:anywhere;line-height:1.24} .isf-fare-dock-note{max-width:none;min-width:0;font-size:12px;padding-left:12px} .isf-fare-dock-action{min-width:0;width:100%} .isf-fare-dock-action #registerButton{min-height:53px;width:100%;border-radius:14px;padding:12px 13px;font-size:16px;letter-spacing:-.025em;font-weight:950;color:#071d4e;background:linear-gradient(115deg,#81ffe2,#89dcff 68%,#b5baff);border:1px solid #bdffff;box-shadow:0 5px 20px rgba(39,214,254,.22);white-space:normal;overflow-wrap:anywhere;line-height:1.35;transition:filter .18s,transform .18s,opacity .18s} .isf-fare-dock-action #registerButton:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-1px)} .isf-fare-dock-action #registerButton:disabled{cursor:not-allowed;opacity:.55;filter:grayscale(.22);box-shadow:none} .isf-fare-dock-action #registerButton:focus-visible{outline:3px solid #fff;outline-offset:3px} @media(max-width:760px){ :root{--isf-dock-height:166px} .isf-fare-dock{width:min(calc(100% - 16px),760px);bottom:max(10px, env(safe-area-inset-bottom,0px) + 6px);border-radius:20px;animation-duration:5.2s} .layout.cosmic-dashboard{display:flex!important;flex-direction:column} .layout.cosmic-dashboard .cosmic-right{display:none!important} .isf-fare-dock-inner{grid-template-columns:minmax(80px,1fr) minmax(0,2fr);grid-template-areas:"label price" "note note" "action action";gap:4px 8px;padding:9px 13px;min-height:var(--isf-dock-height)} .isf-fare-dock-label{grid-area:label} .isf-fare-dock-price{grid-area:price;justify-content:flex-end} .isf-fare-dock-price>span:first-child{font-size:clamp(15px,4.2vw,22px)} .isf-fare-dock-note{grid-area:note;max-width:none;text-align:left;font-size:11px;line-height:1.3;padding:4px 0 0;border-left:0;border-top:1px solid rgba(177,224,255,.2)} .isf-fare-dock-action{grid-area:action} .isf-fare-dock-action #registerButton{width:100%;min-height:48px;font-size:16px;padding:8px 11px;border-radius:12px} .isf-ready-heading{margin-bottom:12px} .isf-ready-heading strong{font-size:16px} .cosmic-dashboard .isf-order-readiness .submit-panel{padding:13px} } @media(max-width:380px){ :root{--isf-dock-height:174px} .isf-fare-dock{width:min(calc(100% - 12px),380px);border-radius:18px} .isf-fare-dock-inner{padding:8px 10px;gap:4px 6px} .isf-fare-dock-price{gap:2px 5px} .isf-fare-dock-price>span:first-child{font-size:14px} .isf-fare-dock-plus{font-size:10px} .isf-fare-dock-plus b{font-size:13px} .isf-fare-dock-action #registerButton{font-size:15px} } @media print{.isf-fare-dock{display:none!important}} /* V62 receipt-printing contract: receipt moved out of the removed step-04 panel. */ @media print{ body.v62-printing .layout.cosmic-dashboard .cosmic-left{display:block!important} body.v62-printing .layout.cosmic-dashboard .cosmic-right{display:none!important} body.v62-printing .cosmic-left > :not(.isf-order-readiness){display:none!important} body.v62-printing .cosmic-left > .isf-order-readiness{display:block!important;background:#fff!important;border:0!important;padding:0!important;margin:0!important;box-shadow:none!important} body.v62-printing .isf-order-readiness > :not(#v62Receipt){display:none!important} body.v62-printing .isf-order-readiness #v62Receipt{display:block!important} } /* Exceptional case: upstream distance lacks a unit; keep explicit unit confirmation accessible. */ .cosmic-dashboard .isf-order-readiness #routeUnitConfirm:not(.hidden){display:flex;padding:13px 16px;margin:12px 0 0;border-radius:12px;border:1px solid rgba(140,226,244,.8);background:rgba(9,67,101,.7)} .cosmic-dashboard .isf-order-readiness #routeUnitConfirm span{color:#f0faff;font-weight:850;font-size:13px} .cosmic-dashboard .isf-order-readiness #routeUnitConfirm button{min-height:42px;padding:8px 13px} /* [consolidated from space-v67.css] */ /* V67 · Address lookup: supplementary postcode results are always verified by Insung. */ .ia-smart-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap} .ia-smart-choice p{flex:1 1 210px;margin:0;color:#61788b;line-height:1.5;font-size:12px} .ia-postcode-open{appearance:none;cursor:pointer;border:1px solid #13a99f;background:linear-gradient(130deg,#eafcf9,#e5f7ff);color:#086b71;border-radius:12px;padding:10px 14px;font-size:13px;font-weight:850;min-height:41px;box-shadow:0 5px 16px rgba(7,147,147,.1)} .ia-postcode-open:hover{filter:brightness(.98);box-shadow:0 6px 20px rgba(7,147,147,.18)} .ia-postcode-open:focus-visible,.ia-postcode-panel-head button:focus-visible{outline:3px solid #13b1b1;outline-offset:3px} .ia-postcode-panel{border:1px solid #b6d6df;border-radius:16px;padding:12px;background:#f6fbff;margin:13px 0;box-shadow:0 7px 22px rgba(10,49,77,.1)} .ia-postcode-panel[hidden]{display:none!important} .ia-postcode-panel-head{display:flex;gap:8px;align-items:center;justify-content:space-between;color:#123752;font-size:14px;font-weight:850} .ia-postcode-panel-head button{cursor:pointer;background:#e4f1f5;border:1px solid #c1d9df;color:#1c5a6c;border-radius:9px;padding:7px 11px;min-height:36px;font-size:12px;font-weight:700} .ia-postcode-panel>p{font-size:11px;color:#486477;line-height:1.5;margin:8px 0} .ia-postcode-embed{width:100%;height:390px;overflow:hidden;position:relative;border-radius:10px;background:#fff;border:1px solid #d7e6ef} @media(max-width:600px){.ia-postcode-open{width:100%;font-size:13px}.ia-postcode-panel{padding:9px}.ia-postcode-embed{height:min(410px,55vh)}.ia-smart-choice{gap:7px}} @media print{.ia-postcode-open,.ia-postcode-panel{display:none!important}} /* Older popup CSS forces flex-direction:column; keep the hint compact, not 210px tall. */ .address-dialog .ia-choice-tools.ia-smart-choice{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:11px 0 12px} .address-dialog .ia-choice-tools.ia-smart-choice p{flex:none;margin:0;min-width:0;line-height:1.55;font-size:11px;color:#597680} @media(max-width:600px){.address-dialog .ia-choice-tools.ia-smart-choice{grid-template-columns:minmax(0,1fr);gap:8px}} /* [consolidated from space-v68.css] */ /* V68 · Floating fare range and modal-only confirmation. */ /* The main page no longer shows a pre-submission confirmation panel. Errors, manual route-unit checks, and genuine server-confirmed receipts remain visible. */ .cosmic-dashboard .isf-order-readiness{display:none!important} .cosmic-dashboard .isf-order-readiness:is(.isf-status-show,:has(#v62Receipt:not([hidden])),:has(#routeUnitConfirm:not(.hidden))){display:block!important} .cosmic-dashboard .isf-order-readiness > #registerHelp[hidden]{display:none!important} /* Align the maximum of the existing fare range to the retrieved amount. Keep the range itself unchanged (1.25 * API quoted fare); remove only the label. */ .isf-fare-dock-price{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(19px,2.4vw,31px);font-weight:950;letter-spacing:-.038em;line-height:1.24;color:#f5feff;text-shadow:0 0 10px rgba(122,236,255,.46),0 0 24px rgba(60,190,255,.34),0 0 42px rgba(101,116,255,.16)} .isf-fare-dock-price .isf-fare-dock-plus{display:inline-flex;align-items:center;gap:7px;color:#c8faff;font-size:clamp(19px,2.4vw,31px);font-weight:950;letter-spacing:-.038em;line-height:1.24;white-space:nowrap} .isf-fare-dock-price .isf-fare-dock-plus[hidden]{display:none!important} .isf-fare-dock-price .isf-fare-dock-plus b{white-space:nowrap} .isf-final-dialog .isf-final-head h2{letter-spacing:-.04em} .isf-final-dialog #isfFinalSubmit:disabled{opacity:.47} .isf-final-dialog #isfFinalSubmit:not(:disabled){box-shadow:0 8px 22px rgba(24,104,209,.22)} .isf-floating-notice{position:fixed;left:50%;bottom:calc(var(--isf-dock-height,105px) + 34px);z-index:41;transform:translateX(-50%);width:min(690px,calc(100% - 32px));padding:12px 17px;border:1px solid #ffc7cf;border-radius:14px;background:rgba(255,246,247,.98);box-shadow:0 12px 35px rgba(10,19,42,.26);color:#8d1831;font-size:13px;font-weight:800;line-height:1.55;overflow-wrap:anywhere} .isf-floating-notice[hidden]{display:none!important} @media(max-width:760px){ .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus b, .isf-fare-dock-price .isf-fare-dock-plus{font-size:clamp(15px,4vw,21px);line-height:1.28} .isf-floating-notice{bottom:calc(var(--isf-dock-height,166px) + 24px);font-size:12px;padding:10px 13px} } @media(max-width:450px){ .isf-fare-dock-inner{grid-template-columns:minmax(0,1fr);grid-template-areas:"label" "price" "note" "action";gap:6px;padding:11px 13px 12px} .isf-fare-dock-label{grid-area:label;display:flex;flex-direction:row;align-items:center;gap:5px;min-width:0} .isf-fare-dock-label .isf-fare-dock-dot{margin:0 3px 0 0;position:static;flex:none} .isf-fare-dock-label small{margin-left:auto;white-space:nowrap} .isf-fare-dock-price{grid-area:price;justify-content:center;gap:7px;min-width:0;padding:2px 0 3px} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus b, .isf-fare-dock-price .isf-fare-dock-plus{font-size:clamp(17px,5.25vw,21px);overflow-wrap:normal;white-space:nowrap} .isf-fare-dock-note{grid-area:note;padding:5px 0 0;text-align:center;font-size:11px} .isf-fare-dock-action{grid-area:action} .isf-fare-dock-action #registerButton{min-height:47px} } @media(max-width:340px){ .isf-fare-dock-price{gap:4px} .isf-fare-dock-price .isf-fare-dock-plus{gap:4px} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus b, .isf-fare-dock-price .isf-fare-dock-plus{font-size:16px} } @media(prefers-reduced-motion:reduce){.isf-fare-dock{animation:none!important;transform:translateX(-50%)!important}} @media print{.isf-floating-notice{display:none!important}} .isf-final-direct-warning{margin:0;padding:10px 20px;background:#fff7e6;color:#7e440c;font-size:12px;line-height:1.5;font-weight:800;border-bottom:1px solid #efd5a5} /* [consolidated from space-v69.css] */ /* V69 · Address field polish, schedule/payment redesign, branded fare dock */ .cosmic-dashboard .address-search-trigger{ background:linear-gradient(135deg,rgba(242,247,255,.96),rgba(228,239,255,.96)); border:1px solid rgba(136,187,255,.42); border-radius:14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 22px rgba(31,84,171,.10); } .cosmic-dashboard .address-search-trigger input[readonly]{ background:transparent!important; color:#2d4679; padding-left:14px; } .cosmic-dashboard .address-search-trigger input[readonly]::placeholder{color:#7d93bf} .cosmic-dashboard .address-search-trigger button{ width:58px;min-width:58px;min-height:46px; background:linear-gradient(135deg,#2f90eb,#4560da 78%); color:#eef8ff;border-left:1px solid rgba(163,204,255,.5); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); } .cosmic-dashboard .address-search-trigger:hover input[readonly], .cosmic-dashboard .address-search-trigger:hover button{background-image:linear-gradient(135deg,#38a1f7,#526ce6 78%)} .cosmic-dashboard .address-search-trigger:hover input[readonly]{background:transparent!important} .cosmic-dashboard .address-completion-note{color:#c8ddff;font-weight:650} .isf-schedule-sheet{ background:linear-gradient(180deg,rgba(28,42,112,.95),rgba(29,42,109,.92)); } .isf-schedule-sheet .section-head{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid rgba(153,191,255,.18)} .isf-schedule-grid{grid-template-columns:minmax(320px,.9fr) minmax(380px,1.1fr);gap:16px;align-items:stretch} .isf-schedule-panel{ background:linear-gradient(160deg,rgba(30,47,126,.72),rgba(35,55,141,.52)); border:1px solid rgba(149,187,255,.26); border-radius:22px; padding:18px 18px 16px; box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 34px rgba(6,13,48,.14); } .isf-schedule-panel .subhead{display:flex;align-items:center;justify-content:space-between;font-size:15px;margin-bottom:12px} .isf-schedule-panel .subhead::after{content:"";display:block;width:46px;height:1px;background:linear-gradient(90deg,rgba(95,219,255,.95),transparent)} .isf-schedule-plan .choice-row{display:grid;grid-template-columns:1fr 1fr;gap:10px} .isf-schedule-plan .choice{ min-height:50px;border-radius:15px;font-size:15px;font-weight:900; background:rgba(226,240,255,.06);border:1px solid rgba(151,193,255,.26);color:#d2e4ff; } .isf-schedule-plan .choice.chosen{ background:linear-gradient(135deg,#1e8be3,#24d4d0); border-color:rgba(130,247,255,.78); color:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.06),0 12px 28px rgba(38,164,255,.24),0 0 26px rgba(78,245,248,.15); } .isf-schedule-plan .reservation{ margin-top:12px;padding-top:14px;border-top:1px solid rgba(160,193,255,.18);gap:10px 12px; } .isf-schedule-plan .reservation input{ background:rgba(237,244,255,.96);border:1px solid rgba(167,199,255,.45);border-radius:14px;color:#20355f; } .isf-schedule-pay .cosmic-payment-pills{gap:10px;margin:2px 0 0} .isf-schedule-pay .pay-art-card{ min-height:118px;border-radius:18px;background:linear-gradient(180deg,rgba(69,90,182,.56),rgba(48,73,161,.54)); border:1px solid rgba(153,182,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.06); } .isf-schedule-pay .pay-art-card strong{font-size:16px} .isf-schedule-pay .pay-art-card.is-active, .isf-schedule-pay .pay-art-card[aria-pressed="true"]{ border-color:#f09aff;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 0 3px rgba(226,137,255,.14),0 18px 34px rgba(160,61,236,.24),0 0 28px rgba(224,137,255,.23); background:linear-gradient(180deg,rgba(105,74,190,.74),rgba(74,49,172,.66)); } .isf-schedule-pay .field-help{margin-top:14px;color:#cfe1ff;font-size:12px;line-height:1.55} .isf-fare-dock{width:min(calc(100% - 26px),1500px)} .isf-fare-dock-inner{ grid-template-columns:minmax(185px,1.1fr) minmax(150px,.9fr) minmax(0,2fr) minmax(190px,1.15fr) minmax(170px,.95fr); gap:14px;align-items:center;padding:14px 20px; } .isf-fare-dock-brand{display:flex;align-items:center;gap:12px;min-width:0} .isf-fare-dock-brand-logo{width:56px;height:56px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(109,218,255,.42));border-radius:50%;flex:none} .isf-fare-dock-brand-copy{display:flex;flex-direction:column;min-width:0} .isf-fare-dock-brand-copy strong{font-size:17px;line-height:1.18;letter-spacing:-.03em;color:#f7fcff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .isf-fare-dock-brand-kicker{font-size:10px;letter-spacing:.18em;color:#9bd6ff;font-weight:800;margin-bottom:3px} .isf-fare-dock-label{display:flex;flex-direction:column;justify-content:center;padding-left:12px} .isf-fare-dock-label strong{font-size:15px;white-space:nowrap} .isf-fare-dock-note{padding-left:14px} @media(max-width:1100px){ .isf-schedule-grid{grid-template-columns:1fr} .isf-fare-dock-inner{grid-template-columns:minmax(170px,1fr) minmax(0,1.2fr) minmax(0,1.5fr) minmax(170px,1fr);grid-template-areas:"brand label price action" "brand note note action"} .isf-fare-dock-brand{grid-area:brand} .isf-fare-dock-label{grid-area:label} .isf-fare-dock-price{grid-area:price} .isf-fare-dock-note{grid-area:note} .isf-fare-dock-action{grid-area:action} } @media(max-width:760px){ .isf-schedule-panel{padding:16px 14px} .isf-schedule-panel .subhead{font-size:14px} .isf-schedule-pay .pay-art-card{min-height:108px} .isf-schedule-pay .pay-art-card strong{font-size:15px} .isf-fare-dock-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"brand label" "price price" "note note" "action action";gap:8px 10px;padding:12px 14px} .isf-fare-dock-brand-logo{width:46px;height:46px} .isf-fare-dock-brand-copy strong{font-size:15px;white-space:normal} .isf-fare-dock-label{padding-left:0;align-items:flex-end;text-align:right} .isf-fare-dock-note{padding-left:0;text-align:center;border-left:0;border-top:1px solid rgba(177,224,255,.18);padding-top:7px} } @media(max-width:450px){ .isf-schedule-plan .choice-row{grid-template-columns:1fr} .isf-schedule-pay .cosmic-payment-pills{grid-template-columns:repeat(2,minmax(0,1fr))} .isf-schedule-pay .pay-art-card{min-height:100px} .isf-fare-dock-brand{gap:9px} .isf-fare-dock-label small{font-size:10px} } /* [consolidated from space-v71.css] */ /* V71: 길어진 차량명 가독성, 인성 법정동+건물번호 재조회 UI. */ .cosmic-dashboard .truck-shape-field { grid-template-columns: minmax(94px,110px) minmax(310px,480px) minmax(125px,1fr); gap:12px 16px; align-items:center; } .cosmic-dashboard .truck-shape-field #truckBodyType { width:100%;max-width:480px;min-height:50px; font-size:15px;font-weight:750; padding:10px 40px 10px 16px; text-overflow:ellipsis; } .cosmic-dashboard .truck-shape-field > p {grid-column:2 / -1;font-size:11px} .cosmic-dashboard .truck-shape-field .vehicle-code-check {justify-self:start;white-space:nowrap} .cosmic-dashboard .truck-shape-field #vehicleCatalogStatus:not(:empty){grid-column:2 / -1} .cosmic-dashboard .truck-shape-field #vehicleCatalogStatus:empty{display:none} .ia-legal-dong-lookup { margin:12px 0;padding:16px;border-radius:14px; border:1px solid rgba(57,152,192,.27);background:#eff7ff; color:#233d62;display:grid;gap:8px; } .ia-legal-dong-lookup>strong{font-size:14px;color:#173b68} .ia-legal-dong-lookup>p{font-size:12px;line-height:1.6;margin:0;color:#506984} .ia-legal-dong-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(115px,.7fr) auto;gap:8px} .ia-legal-dong-row select,.ia-legal-dong-row input{ width:100%;min-width:0;min-height:45px;padding:9px 12px; background:#fff;color:#22385a;border:1px solid #c6d9ee;border-radius:9px;font-size:13px; } .ia-legal-dong-row button{min-height:45px;border:0;border-radius:9px;padding:9px 14px;background:#147fd1;color:#fff;font-weight:900;white-space:nowrap} .ia-legal-dong-row button:hover{background:#0763ae} .ia-legal-dong-row button:focus-visible{outline:3px solid #63c6f9;outline-offset:2px} @media(max-width:900px){ .cosmic-dashboard .truck-shape-field{grid-template-columns:minmax(94px,115px) minmax(0,1fr);gap:9px} .cosmic-dashboard .truck-shape-field #truckBodyType{max-width:none} .cosmic-dashboard .truck-shape-field .vehicle-code-check{grid-column:2;justify-self:start} .cosmic-dashboard .truck-shape-field > p{grid-column:2} } @media(max-width:560px){ .cosmic-dashboard .truck-shape-field{grid-template-columns:minmax(0,1fr);gap:8px} .cosmic-dashboard .truck-shape-field label, .cosmic-dashboard .truck-shape-field #truckBodyType, .cosmic-dashboard .truck-shape-field > p, .cosmic-dashboard .truck-shape-field .vehicle-code-check, .cosmic-dashboard .truck-shape-field #vehicleCatalogStatus:not(:empty){grid-column:1} .ia-legal-dong-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .ia-legal-dong-row select{grid-column:1 / -1} .ia-legal-dong-row button{padding:9px 6px;font-size:12px} } /* Keep the detailed-vehicle action next to the wider select on desktop. */ @media(min-width:901px){ .cosmic-dashboard .truck-shape-field .vehicle-code-check{grid-column:3;grid-row:1} .cosmic-dashboard .truck-shape-field > p{grid-column:2 / -1;grid-row:2} .cosmic-dashboard .truck-shape-field #vehicleCatalogStatus:not(:empty){grid-column:2 / -1;grid-row:3} } /* V72: 추가 정보가 필요한 경우에만 법정동 재검색 창을 펼칩니다. */ .ia-legal-dong-help{margin:12px 0;border:1px solid #d5e4f4;background:#f4f9ff;border-radius:13px;color:#244c7b;overflow:hidden} .ia-legal-dong-help>summary{cursor:pointer;list-style-position:inside;padding:13px 16px;font-size:13px;font-weight:850;line-height:1.5} .ia-legal-dong-help>summary:focus-visible{outline:3px solid #48b2f0;outline-offset:-3px} .ia-legal-dong-help .ia-legal-dong-lookup{margin:0;border:0;border-top:1px solid #d5e4f4;border-radius:0} /* [consolidated from space-v73.css] */ /* V73: explain exactly why the estimate request cannot be submitted. Actual order and address validation remains unchanged. */ .isf-fare-dock-action{display:flex;flex-direction:column;align-items:stretch;gap:5px} .isf-dock-readiness{margin:0;color:#f0d6d6;font-size:10.5px;font-weight:650;line-height:1.32;max-height:3.96em;overflow:auto;overflow-wrap:anywhere} .isf-dock-readiness[data-ready="true"]{color:#a4ffeb} .isf-fare-dock-action #registerButton:disabled{opacity:.56} @media(max-width:760px){.isf-dock-readiness{font-size:10px;max-height:3.96em;text-align:center}} @media print{.isf-dock-readiness{display:none!important}} /* V73.1 compact mobile floating fare card. No changes to order validation. */ @media (max-width:760px){ :root{--isf-dock-height:172px} .isf-fare-dock{ width:calc(100% - 16px); min-height:0; bottom:max(8px,env(safe-area-inset-bottom,0px) + 6px); padding:0; border-radius:19px; } .isf-fare-dock-inner{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-areas:none; align-items:center; gap:5px 7px; min-height:0; padding:9px 11px 10px; } .isf-fare-dock-brand{grid-area:auto;grid-column:1 / 8;grid-row:1;gap:7px;min-width:0} .isf-fare-dock-brand-logo{width:33px;height:33px;flex:none} .isf-fare-dock-brand-copy{gap:0;min-width:0} .isf-fare-dock-brand-kicker{font-size:8px;letter-spacing:.11em;line-height:1.2;margin-bottom:1px} .isf-fare-dock-brand-copy strong{font-size:13px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .isf-fare-dock-label{grid-area:auto;grid-column:8 / -1;grid-row:1;min-width:0;min-height:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;text-align:right;gap:1px} .isf-fare-dock-label .isf-fare-dock-dot{display:none} .isf-fare-dock-label strong{font-size:12px;line-height:1.22;white-space:nowrap} .isf-fare-dock-label small{font-size:9px;line-height:1.25;white-space:nowrap;margin:0} .isf-fare-dock-price{grid-area:auto;grid-column:1 / 9;grid-row:2;min-width:0;min-height:40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;align-content:center;gap:0 5px;padding:0;text-align:left} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(14px,3.85vw,18px);line-height:1.25;white-space:nowrap;overflow-wrap:normal} .isf-fare-dock-price .isf-fare-dock-plus{gap:4px} .isf-fare-dock-action{grid-area:auto;grid-column:9 / -1;grid-row:2;display:flex;align-items:stretch;justify-content:center;min-width:0;width:100%;gap:0} .isf-fare-dock-action #registerButton{min-height:42px;font-size:13.5px;line-height:1.15;white-space:nowrap;padding:7px 4px;border-radius:11px} .isf-fare-dock-note{grid-area:auto;grid-column:1 / 6;grid-row:3;min-width:0;max-width:none;margin:0;padding:0;border:0;text-align:left;font-size:10px;line-height:1.35} .isf-dock-readiness{grid-area:auto;grid-column:6 / -1;grid-row:3;align-self:center;margin:0;min-width:0;font-size:10px;line-height:1.35;max-height:none;overflow:visible;overflow-wrap:anywhere;text-align:right} .isf-floating-notice{bottom:calc(var(--isf-dock-height) + 12px)} } @media(max-width:380px){ :root{--isf-dock-height:184px} .isf-fare-dock{width:calc(100% - 12px);border-radius:17px} .isf-fare-dock-inner{gap:5px 5px;padding:8px 9px 9px} .isf-fare-dock-brand-logo{width:29px;height:29px} .isf-fare-dock-brand-copy strong{font-size:12px} .isf-fare-dock-brand-kicker{font-size:7.5px} .isf-fare-dock-label strong{font-size:11px} .isf-fare-dock-label small{font-size:8.5px} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(13px,4vw,15px)} .isf-fare-dock-action #registerButton{font-size:12.5px;min-height:40px} .isf-fare-dock-note,.isf-dock-readiness{font-size:9.5px;line-height:1.35} } @media(max-width:330px){ .isf-fare-dock-note{grid-column:1 / -1;grid-row:3;text-align:center} .isf-dock-readiness{grid-column:1 / -1;grid-row:4;text-align:center} } /* Final small-screen readability: both notice lines own full width. */ @media(max-width:760px){ .isf-fare-dock-note{grid-column:1 / -1;grid-row:3;text-align:center;font-size:10.5px} .isf-dock-readiness{grid-column:1 / -1;grid-row:4;text-align:center;font-size:10.5px} } @media(max-width:380px){ .isf-fare-dock-note,.isf-dock-readiness{font-size:10px} } /* Desktop/tablet: keep the new status line aligned, not as an extra stray grid item. */ @media(min-width:1101px){ .isf-fare-dock-inner{grid-template-areas:"brand label price note action" "ready ready ready ready ready";row-gap:3px} .isf-fare-dock-brand{grid-area:brand} .isf-fare-dock-label{grid-area:label} .isf-fare-dock-price{grid-area:price} .isf-fare-dock-note{grid-area:note} .isf-fare-dock-action{grid-area:action} .isf-dock-readiness{grid-area:ready;text-align:center;min-height:13px;font-size:10.5px;line-height:1.3} } @media(min-width:761px) and (max-width:1100px){ .isf-fare-dock-inner{grid-template-areas:"brand label price action" "brand note note action" "ready ready ready ready";row-gap:4px} .isf-dock-readiness{grid-area:ready;text-align:center;font-size:10.5px;line-height:1.3} } /* [consolidated from space-v76.css] */ /* V76 · Compact mobile hero badges and clean confirmed-request dialog. */ @media (max-width:760px){ .space-hero .space-hero-badges{ display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr)); width:min(100%,270px);max-width:100%;gap:5px;margin-top:11px; } .space-hero .space-hero-badges > span, .space-hero .space-hero-badges > .isf-hero-status{ display:inline-flex!important;min-width:0;min-height:24px; padding:3px 6px;font-size:9px;line-height:1.25;gap:4px; border-radius:999px;white-space:nowrap;text-align:center;justify-content:center; } .space-hero .space-hero-badges .status-dot{width:5px;height:5px;margin-right:2px} } @media (max-width:380px){ .space-hero .space-hero-badges{width:min(100%,238px);gap:4px} .space-hero .space-hero-badges > span, .space-hero .space-hero-badges > .isf-hero-status{min-height:23px;padding:3px 4px;font-size:8px} } .isf-success-dialog{ position:fixed;inset:0;margin:auto;padding:0; width:min(390px,calc(100vw - 34px));max-height:min(85dvh,480px); border:1px solid rgba(154,221,255,.7);border-radius:23px; background:linear-gradient(150deg,#faffff 0%,#eff7ff 100%); color:#102c59;box-shadow:0 24px 80px rgba(0,11,43,.55); } .isf-success-dialog::backdrop{background:rgba(4,12,38,.72);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)} .isf-success-card{display:flex;flex-direction:column;align-items:center;gap:0;text-align:center;padding:29px 24px 24px} .isf-success-emblem{ display:grid;place-items:center;width:65px;height:65px;border-radius:50%; background:linear-gradient(145deg,#13c6bc,#1678e8);color:#fff; font-size:38px;font-weight:900;box-shadow:0 8px 27px rgba(23,172,227,.28); } .isf-success-card h2{margin:18px 0 24px;font-size:23px;line-height:1.5;letter-spacing:-.05em;font-weight:900;color:#133568;word-break:keep-all} .isf-success-done{min-height:48px;width:100%;border:0;border-radius:13px; background:linear-gradient(115deg,#148ddc,#2458b6);color:#fff; font-size:15px;font-weight:900;box-shadow:0 7px 19px rgba(25,105,199,.24)} .isf-success-done:focus-visible{outline:3px solid #65d9e8;outline-offset:3px} @media(max-width:420px){ .isf-success-card{padding:25px 19px 20px} .isf-success-emblem{width:57px;height:57px;font-size:32px} .isf-success-card h2{font-size:21px} } @media(prefers-reduced-motion:reduce){.isf-success-dialog,.isf-success-dialog *{animation:none!important;transition:none!important}} @media print{.isf-success-dialog{display:none!important}} /* [consolidated from space-v88.css] */ /* V88 · Delivery memo quick-pick chips. No changes to order or quote styles. */ .isf-memo-shortcuts{margin:12px 0 10px;padding:13px 14px 12px;border:1px solid rgba(126,188,255,.28);border-radius:15px;background:linear-gradient(130deg,rgba(39,62,139,.33),rgba(19,45,104,.22))} .isf-memo-shortcuts-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 11px;margin-bottom:10px} .isf-memo-shortcuts-heading strong{font-size:13px;letter-spacing:-.03em;color:#f3fbff;font-weight:850} .isf-memo-shortcuts-heading span{font-size:11px;color:#c2d9fa;word-break:keep-all} .isf-memo-chip-grid{display:flex;flex-wrap:wrap;gap:7px} .isf-memo-chip-grid .isf-memo-chip{flex:0 1 auto;min-height:36px;max-width:100%;padding:8px 12px;border:1px solid rgba(153,201,255,.38);border-radius:999px;background:rgba(66,97,173,.36);color:#e9f5ff;font-size:12px;font-weight:750;line-height:1.4;word-break:keep-all;white-space:normal;text-align:center;box-shadow:inset 0 1px rgba(255,255,255,.06);transition:background .16s,border-color .16s,box-shadow .16s,color .16s} .isf-memo-chip-grid .isf-memo-chip:hover{background:rgba(79,141,211,.53);border-color:rgba(148,225,255,.72)} .isf-memo-chip-grid .isf-memo-chip.is-selected{background:linear-gradient(120deg,rgba(18,161,177,.54),rgba(30,111,202,.56));border-color:#7beada;color:white;box-shadow:0 0 0 1px rgba(56,222,222,.12),0 6px 15px rgba(0,37,91,.19)} .isf-memo-chip-grid .isf-memo-chip:focus-visible{outline:3px solid #8df8ec;outline-offset:2px} .isf-memo-quick-feedback{min-height:0;margin:6px 0 0;color:#c7eff8;font-size:11px;line-height:1.45} .isf-memo-quick-feedback:empty{display:none} @media(max-width:760px){ .isf-memo-shortcuts{padding:11px 10px} .isf-memo-shortcuts-heading{gap:2px 8px} .isf-memo-chip-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:7px; } .isf-memo-chip-grid .isf-memo-chip{ display:flex;align-items:center;justify-content:center; width:100%;min-width:0;max-width:none;min-height:40px; box-sizing:border-box;padding:7px 8px; font-size:11px;line-height:1.45;text-align:center; white-space:normal;word-break:keep-all;overflow-wrap:normal; } .isf-memo-chip-grid .isf-memo-chip-wide{grid-column:1 / -1} } @media(max-width:370px){.isf-memo-chip-grid .isf-memo-chip{font-size:10.5px;padding:7px 6px;min-height:38px}} @media(prefers-reduced-motion:reduce){.isf-memo-chip-grid .isf-memo-chip{transition:none}} /* [consolidated from space-v93.css] */ /* V93 · Fix the hairline scrollbar under the fixed fare dock. */ .isf-fare-dock .isf-dock-readiness, .isf-fare-dock #isfDockReadiness{ display:block;min-width:0;min-height:0;height:auto!important; max-height:none!important;overflow:visible!important;overflow-x:visible!important;overflow-y:visible!important; scrollbar-width:none;white-space:normal;overflow-wrap:anywhere;line-height:1.35; } .isf-fare-dock #isfDockReadiness[hidden]{display:none!important} .isf-fare-dock-inner{min-width:0;min-height:0} .isf-fare-dock-inner>*{min-width:0} @media(min-width:761px) and (max-width:1100px){ .isf-fare-dock{width:min(calc(100vw - 22px),1060px);min-height:0} .isf-fare-dock-inner{ display:grid!important; grid-template-columns:minmax(130px,1fr) minmax(0,2.1fr) minmax(135px,.85fr)!important; grid-template-rows:auto auto auto; grid-template-areas:"brand price action" "label note action" "ready ready ready"!important; gap:4px 12px;min-height:0;padding:10px 16px; } .isf-fare-dock-brand{grid-area:brand;gap:8px} .isf-fare-dock-brand-logo{width:38px;height:38px} .isf-fare-dock-brand-copy strong{font-size:13px} .isf-fare-dock-brand-kicker{font-size:8px} .isf-fare-dock-label{grid-area:label;padding:0;align-items:flex-start;text-align:left} .isf-fare-dock-label strong{font-size:11px;white-space:normal} .isf-fare-dock-label small{font-size:9px} .isf-fare-dock-price{grid-area:price;justify-content:center;flex-wrap:wrap;gap:3px 6px} .isf-fare-dock-price>span:first-child,.isf-fare-dock-price .isf-fare-dock-plus,.isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(16px,2.2vw,23px);line-height:1.22} .isf-fare-dock-note{grid-area:note;font-size:10px;line-height:1.35;border:0;padding:0;text-align:center} .isf-fare-dock-action{grid-area:action;justify-content:center} .isf-fare-dock-action #registerButton{min-height:46px;font-size:15px} .isf-fare-dock .isf-dock-readiness{grid-area:ready!important;margin:0!important;font-size:10.5px;text-align:center} } @media(max-width:760px){ .isf-fare-dock .isf-dock-readiness{margin:0!important;max-height:none!important;overflow:visible!important} } @media print{.isf-fare-dock{display:none!important}} /* [consolidated from space-v94.css] */ /* V94 · sharpen the floating fare dock for much stronger readability. */ .isf-fare-dock{ background:linear-gradient(108deg, rgba(9,28,81,.96), rgba(17,42,113,.95) 56%, rgba(24,43,118,.96))!important; border:1px solid rgba(177,231,255,.82)!important; box-shadow:0 16px 34px rgba(3,10,34,.42), 0 4px 10px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.12)!important; backdrop-filter:blur(8px) saturate(1.02)!important; -webkit-backdrop-filter:blur(8px) saturate(1.02)!important; animation:none!important; } .isf-fare-dock::before{opacity:.34!important} .isf-fare-dock-inner{ position:relative; z-index:1; align-items:center; } .isf-fare-dock-brand{gap:12px!important} .isf-fare-dock-brand-logo{ filter:drop-shadow(0 1px 3px rgba(0,0,0,.25)); } .isf-fare-dock-brand-copy strong{ color:#ffffff!important; font-size:15px!important; font-weight:900!important; letter-spacing:-.02em; text-shadow:0 1px 1px rgba(0,0,0,.26)!important; } .isf-fare-dock-brand-kicker{ color:#c7e7ff!important; font-size:11px!important; font-weight:800!important; letter-spacing:.14em!important; } .isf-fare-dock-label{ gap:4px!important; } .isf-fare-dock-label strong{ color:#ffffff!important; font-size:16px!important; font-weight:900!important; letter-spacing:-.015em; text-shadow:0 1px 1px rgba(0,0,0,.28)!important; } .isf-fare-dock-label small{ color:#d8ebff!important; font-size:12px!important; font-weight:800!important; text-shadow:none!important; } .isf-fare-dock-dot{ width:10px!important;height:10px!important; background:#8ff8cf!important; box-shadow:0 0 0 3px rgba(143,248,207,.15), 0 0 12px rgba(143,248,207,.55)!important; } .isf-fare-dock-price{ gap:4px 10px!important; } .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{ color:#ffffff!important; font-weight:950!important; letter-spacing:-.03em!important; text-shadow:0 1px 1px rgba(0,0,0,.34)!important; } .isf-fare-dock-price>span:first-child{ font-size:clamp(24px, 2.2vw, 36px)!important; line-height:1.12!important; } .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{ font-size:clamp(24px, 2.2vw, 36px)!important; line-height:1.12!important; } .isf-fare-dock-note{ color:#f1f7ff!important; font-size:14px!important; font-weight:800!important; line-height:1.45!important; border-left:1px solid rgba(196,228,255,.32)!important; padding-left:18px!important; text-shadow:0 1px 1px rgba(0,0,0,.22)!important; } .isf-fare-dock-action #registerButton{ min-height:54px!important; font-size:17px!important; font-weight:900!important; color:#0b255e!important; background:linear-gradient(118deg,#8ef9df,#91ddff 66%,#bbc2ff)!important; border:1px solid rgba(255,255,255,.82)!important; box-shadow:0 6px 18px rgba(24,193,255,.22)!important; } .isf-fare-dock-action #registerButton:disabled{ opacity:.68!important; color:#27406b!important; background:linear-gradient(118deg,#9fd8de,#a6cae2 66%,#bcc0e3)!important; box-shadow:none!important; } .isf-fare-dock .isf-dock-readiness, .isf-fare-dock #isfDockReadiness{ color:#eef8ff!important; font-size:12px!important; font-weight:800!important; line-height:1.45!important; text-shadow:none!important; } .isf-fare-dock .isf-dock-readiness[data-ready="true"]{color:#c8ffe8!important} @media (max-width:1100px){ .isf-fare-dock{ backdrop-filter:blur(6px) saturate(1.01)!important; -webkit-backdrop-filter:blur(6px) saturate(1.01)!important; } .isf-fare-dock-brand-copy strong{font-size:14px!important} .isf-fare-dock-brand-kicker{font-size:10px!important} .isf-fare-dock-label strong{font-size:15px!important} .isf-fare-dock-label small{font-size:11px!important} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(22px, 2.7vw, 30px)!important} .isf-fare-dock-note{font-size:13px!important;padding-left:14px!important} .isf-fare-dock .isf-dock-readiness, .isf-fare-dock #isfDockReadiness{font-size:11.5px!important} } @media (max-width:760px){ .isf-fare-dock{ border-radius:20px!important; background:linear-gradient(108deg, rgba(10,29,85,.97), rgba(18,43,116,.97) 58%, rgba(26,46,124,.97))!important; } .isf-fare-dock-inner{gap:7px 10px!important;padding:11px 12px 12px!important} .isf-fare-dock-brand-copy strong{font-size:13px!important} .isf-fare-dock-brand-kicker{font-size:9.5px!important} .isf-fare-dock-label strong{font-size:14px!important} .isf-fare-dock-label small{font-size:11px!important} .isf-fare-dock-price{padding:1px 0 2px!important} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(21px, 5.7vw, 25px)!important;line-height:1.14!important} .isf-fare-dock-note{font-size:12px!important;line-height:1.4!important;padding:5px 0 0!important;border-left:0!important;border-top:1px solid rgba(196,228,255,.24)!important;text-align:center!important} .isf-fare-dock-action #registerButton{min-height:48px!important;font-size:16px!important} .isf-fare-dock .isf-dock-readiness, .isf-fare-dock #isfDockReadiness{font-size:11.5px!important;line-height:1.4!important;text-align:center!important} } @media (max-width:380px){ .isf-fare-dock-brand-copy strong{font-size:12.5px!important} .isf-fare-dock-label strong{font-size:13px!important} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(18px, 5.9vw, 22px)!important} .isf-fare-dock-note{font-size:11.5px!important} .isf-fare-dock-action #registerButton{font-size:15px!important} } /* [consolidated from space-v95.css] */ /* V95 · Address search: prevent nested scrollbars and clipped result cards. The dialog is the sole vertical scroll container when its contents exceed the available viewport height. Search/API/order logic is unchanged. */ #insungAddressDialog.address-dialog { max-height: min(90dvh, 860px); overflow-y: auto !important; overflow-x: hidden !important; overscroll-behavior: contain; scrollbar-gutter: auto; } #insungAddressDialog .address-dialog-inner { display: block !important; height: auto !important; max-height: none !important; min-height: 0; overflow: visible !important; } #insungAddressDialog #insungAddressResults.address-result-list { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; flex: none; } #insungAddressDialog .ia-result-row { display: flex; width: 100%; height: auto; min-height: 0; flex: 0 0 auto; align-items: stretch; overflow: visible; } #insungAddressDialog .ia-result-row > .address-result { flex: 1 1 0%; width: auto; min-width: 0; height: auto !important; min-height: 76px; overflow: visible !important; } #insungAddressDialog .ia-result-row > .address-result strong, #insungAddressDialog .ia-result-row > .address-result small { display: block; max-width: 100%; overflow-wrap: anywhere; white-space: normal; } #insungAddressDialog .ia-result-row > .ia-location-btn { flex: 0 0 104px; width: 104px; min-height: 76px; display: flex; align-items: center; justify-content: center; text-align: center; white-space: normal; line-height: 1.5; } @media (max-width: 767px) { #insungAddressDialog.address-dialog { max-height: 92dvh; } #insungAddressDialog .ia-result-row > .address-result { min-height: 68px; } /* Preserve existing mobile policy: list-only, no map button. */ #insungAddressDialog .ia-result-row > .ia-location-btn { display: none !important; } } /* [consolidated from space-v104.css] */ /* V104: Insung-only autocomplete; full-address results still use the modal's single scroll. */ #insungAddressDialog .ia-smart-suggestions[hidden]{display:none!important} #insungAddressDialog .ia-smart-suggestions{display:flex;flex-direction:column;gap:4px;margin-top:9px;padding:9px;background:#f4faff;border:1px solid #cae1f4;border-radius:14px;box-shadow:0 10px 25px rgba(13,52,94,.08)} #insungAddressDialog .ia-smart-suggest-caption{margin:2px 6px 5px;font-size:11px;font-weight:750;color:#3e6684} #insungAddressDialog .ia-smart-option{display:grid;grid-template-columns:50px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;min-height:45px;padding:8px 10px;text-align:left;border:1px solid transparent;border-radius:10px;background:#fff;color:#153656;cursor:pointer} #insungAddressDialog .ia-smart-option strong{font-size:13.5px;font-weight:800;line-height:1.35;overflow-wrap:anywhere} #insungAddressDialog .ia-smart-option:hover,#insungAddressDialog .ia-smart-option:focus-visible,#insungAddressDialog .ia-smart-option[aria-selected="true"]{background:#e8f9fb;border-color:#57bebc;outline:none} #insungAddressDialog .ia-smart-type{display:block;white-space:nowrap;font-size:10px;font-weight:850;color:#067b8b;background:#e0f6f8;border-radius:6px;padding:5px 3px;text-align:center} #insungAddressDialog .ia-smart-next{font-size:11px;font-weight:800;color:#41708b;white-space:nowrap} #insungAddressDialog #ia_keyword:focus-visible{outline:2px solid #18b6b0;outline-offset:-2px} @media(max-width:520px){ #insungAddressDialog .ia-smart-suggestions{padding:6px;margin-top:7px} #insungAddressDialog .ia-smart-option{grid-template-columns:44px minmax(0,1fr);gap:7px;padding:7px;min-height:42px} #insungAddressDialog .ia-smart-option strong{font-size:12.5px} #insungAddressDialog .ia-smart-next{display:none} } /* V105: cargo card art visibility fix – keep item illustrations fully visible without clipping */ .cosmic-dashboard #cargoItems .item{ padding-top:10px; } .cosmic-dashboard #cargoItems .item-main{ gap:2px; } .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ display:flex; align-items:center; justify-content:center; height:118px; min-height:118px; padding:8px 10px 4px; overflow:visible; background:radial-gradient(ellipse at center,rgba(162,214,254,.16),transparent 80%); } .cosmic-dashboard #cargoItems .item-main .space-item-art{ width:auto; height:auto; max-width:100%; max-height:106px; object-fit:contain; object-position:center center; transform-origin:center center; image-rendering:auto; } /* slightly different optical sizing for wider item illustrations */ .cosmic-dashboard #cargoItems .item[data-item="규격 파렛트"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="비규격 파렛트"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="건축자재"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="이삿짐"] .space-item-art{ max-width:94%; max-height:100px; } @media (max-width:980px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ height:110px; min-height:110px; padding:7px 8px 2px; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ max-height:96px; } } @media (max-width:520px){ .cosmic-dashboard #cargoItems .item{ padding-top:8px; } .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ height:92px; min-height:92px; padding:5px 6px 1px; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ max-height:82px; } .cosmic-dashboard #cargoItems .item[data-item="규격 파렛트"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="비규격 파렛트"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="건축자재"] .space-item-art, .cosmic-dashboard #cargoItems .item[data-item="이삿짐"] .space-item-art{ max-width:96%; max-height:78px; } } @media (max-width:400px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ height:88px; min-height:88px; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ max-height:76px; } } /* [consolidated from space-v106.css] */ /* V106: use newly cleaned transparent cargo images, avoiding backgrounds baked into old WEBP assets. */ .cosmic-dashboard #cargoItems .item{overflow:hidden} .cosmic-dashboard #cargoItems .item-main{width:100%;min-width:0;padding:2px 1px 0;gap:3px;} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ display:flex;align-items:center;justify-content:center; width:100%;height:116px;min-height:116px; padding:4px 6px;margin:0 auto 1px; overflow:visible;border-radius:12px; background:transparent; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ display:block;width:100%;height:100%;max-width:100%;max-height:100%; object-fit:contain;object-position:center center; filter:drop-shadow(0 4px 5px rgba(3,13,46,.25)); transform:scale(1);transition:transform .2s ease; } @media (hover:hover){ .cosmic-dashboard #cargoItems .item:hover .space-item-art{transform:scale(1.035)} } @media (max-width:900px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:108px;min-height:108px;padding:3px 4px} } @media (max-width:520px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:96px;min-height:96px;padding:2px 3px} .cosmic-dashboard #cargoItems .item-main .space-item-art{width:100%;height:100%;} } @media (max-width:380px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:88px;min-height:88px} } /* [consolidated from space-v107.css] */ /* V107: ten freshly redrawn illustrations; consistent transparent-safe sizing. */ .cosmic-dashboard #cargoItems .item{ overflow:hidden; } .cosmic-dashboard #cargoItems .item-main{ align-items:center; padding:0 3px; gap:2px; } .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ width:100%; height:130px; min-height:130px; padding:0; margin:0 auto 2px; border-radius:12px; overflow:visible; background:none; display:grid; place-items:center; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ display:block; box-sizing:border-box; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 5px 5px rgba(0,10,37,.22)); transform:none; image-rendering:auto; } @media (hover:hover){ .cosmic-dashboard #cargoItems .item:hover .space-item-art{transform:scale(1.025)} } @media (max-width:980px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:115px;min-height:115px} } @media (max-width:760px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:106px;min-height:106px} } @media (max-width:520px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:99px;min-height:99px} } @media (max-width:380px){ .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:89px;min-height:89px} } @media (prefers-reduced-motion:reduce){ .cosmic-dashboard #cargoItems .item-main .space-item-art{transition:none} } /* [consolidated from space-v108.css] */ /* V108: fix cargo card layout, normalize icon scale, and keep bottom dock from crowding cards. */ .cosmic-dashboard #cargoItems{ align-items:stretch; padding-bottom:24px; } .cosmic-dashboard #cargoItems .item{ display:flex; flex-direction:column; min-height:324px; } .cosmic-dashboard #cargoItems .item-main{ width:100%; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; padding:18px 14px 6px; gap:8px; } .cosmic-dashboard #cargoItems .item-main .item-art-wrap{ width:100%; height:148px; min-height:148px; margin:0; padding:0 8px; display:flex; align-items:flex-end; justify-content:center; overflow:visible; } .cosmic-dashboard #cargoItems .item-main .space-item-art{ width:100%; height:100%; object-fit:contain; object-position:center bottom; transform:none !important; filter:drop-shadow(0 8px 10px rgba(4,18,58,.24)); } .cosmic-dashboard #cargoItems .item-main strong{ display:block; width:100%; margin:2px 0 0; font-size:15px; line-height:1.22; letter-spacing:-.02em; } .cosmic-dashboard #cargoItems .item-main small{ display:block; width:100%; min-height:32px; margin:0; font-size:11.5px; line-height:1.35; opacity:.92; } .cosmic-dashboard #cargoItems .counter{ margin-top:auto; padding:8px 14px 14px; } /* Per-item scaling to visually normalize wide/short vs tall icons */ .cosmic-dashboard #cargoItems .item[data-item="규격 파렛트"] .space-item-art{transform:scale(1.42) translateY(4px) !important;} .cosmic-dashboard #cargoItems .item[data-item="비규격 파렛트"] .space-item-art{transform:scale(1.30) translateY(4px) !important;} .cosmic-dashboard #cargoItems .item[data-item="박스"] .space-item-art{transform:scale(1.10) translateY(2px) !important;} .cosmic-dashboard #cargoItems .item[data-item="가구"] .space-item-art{transform:scale(1.18) translateY(3px) !important;} .cosmic-dashboard #cargoItems .item[data-item="가전"] .space-item-art{transform:scale(1.05) translateY(2px) !important;} .cosmic-dashboard #cargoItems .item[data-item="기계·장비"] .space-item-art{transform:scale(.90) translateY(0) !important;} .cosmic-dashboard #cargoItems .item[data-item="건축자재"] .space-item-art{transform:scale(1.26) translateY(4px) !important;} .cosmic-dashboard #cargoItems .item[data-item="서류"] .space-item-art{transform:scale(1.10) translateY(3px) !important;} .cosmic-dashboard #cargoItems .item[data-item="기타"] .space-item-art{transform:scale(1.05) translateY(2px) !important;} .cosmic-dashboard #cargoItems .item[data-item="이삿짐"] .space-item-art{transform:scale(1.24) translateY(4px) !important;} /* The floating fare dock is already reserved by body padding (V65). Keep only a modest section-to-footer gap. */ .page-shell{padding-bottom:28px;} @media (max-width:1100px){ .cosmic-dashboard #cargoItems .item{min-height:304px;} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:136px;min-height:136px;} } @media (max-width:760px){ .cosmic-dashboard #cargoItems{padding-bottom:14px;} .cosmic-dashboard #cargoItems .item{min-height:262px;} .cosmic-dashboard #cargoItems .item-main{padding:14px 10px 4px;gap:7px;} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:108px;min-height:108px;padding:0 4px;} .cosmic-dashboard #cargoItems .item-main strong{font-size:14px;} .cosmic-dashboard #cargoItems .item-main small{font-size:10.8px;min-height:29px;} .cosmic-dashboard #cargoItems .counter{padding:6px 10px 12px;} .page-shell{padding-bottom:20px;} } @media (max-width:420px){ .cosmic-dashboard #cargoItems .item{min-height:248px;} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{height:96px;min-height:96px;} .cosmic-dashboard #cargoItems .item-main strong{font-size:13.5px;} .cosmic-dashboard #cargoItems .item-main small{font-size:10.2px;min-height:26px;} } /* [consolidated from space-v109.css] */ /* V109 — Suho Angel brand-aligned dark cinematic logistics palette. Reference: https://yongdalweb.dothome.co.kr/ (Guardian Logistics brand-film, holographic navigation and future logistics). Pure presentation patch. Preserve original DOM, controls, address API, fare logic and form behaviour. */ :root{ --sg-void:#050b19; --sg-deep:#07142b; --sg-ink:#0c1c36; --sg-panel:#12274b; --sg-card:#182f55; --sg-highlight:#203c66; --sg-blue:#377dbd; --sg-cyan:#60e8f0; --sg-aqua:#18c6d3; --sg-white:#f7fbff; --sg-muted:#c6d9eb; --sg-border:rgba(135,185,223,.42); --sg-soft-border:rgba(135,185,223,.27); --sg-shadow:0 12px 28px rgba(0,5,19,.24); --space-ink:#eef7ff; --space-soft:#c5daf0; --space-cyan:#60e8f0; --space-violet:#8baeed; --space-stroke:rgba(135,185,223,.34); --space-panel:rgba(17,38,76,.96); --aqua:#19cad7; --aqua-dark:#0b8599; --navy:#0c1c36; --bg:#07142b; --border:rgba(130,180,222,.34); } /* Site-level brand treatment: deep midnight blue, limited glows, clean type. */ html{scroll-behavior:smooth} body{background:var(--sg-void)!important;color:var(--sg-white)!important} .page-bg{ background: radial-gradient(ellipse 65% 28% at 85% 1%,rgba(45,100,159,.31),transparent 72%), radial-gradient(ellipse 78% 45% at 2% 57%,rgba(15,89,124,.19),transparent 78%), linear-gradient(165deg,#060f23 0%,#101f3d 48%,#07152c 100%)!important; color:var(--sg-white)!important; } .page-bg::before{opacity:.28!important} .page-bg::after{opacity:.32!important;filter:blur(15px)!important} .cosmos-nebula,.cosmos-orbit-glow{opacity:.3!important} .cosmos-starlight{opacity:.52!important} .cosmos-meteor-field{opacity:.45!important} .site-head{ background:rgba(5,13,29,.97)!important; border-bottom:1px solid rgba(122,179,220,.37)!important; box-shadow:0 8px 22px rgba(1,5,19,.34)!important; backdrop-filter:blur(12px)!important; -webkit-backdrop-filter:blur(12px)!important; } .site-head .brand strong{color:#fff!important;text-shadow:none!important;font-weight:900!important} .site-head .brand small{color:#bad7e9!important} .site-head .topnav a{color:#d4e2f3!important;text-shadow:none!important} .site-head .topnav a:hover,.site-head .topnav a.active{color:#8ef8fc!important;text-shadow:none!important} .site-head .topnav a.active::after{ background:var(--sg-cyan)!important; box-shadow:0 0 8px rgba(86,219,236,.44)!important; } .site-head .header-cta{ background:rgba(27,64,111,.57)!important; border:1px solid rgba(144,201,237,.52)!important; color:#e5f5ff!important; box-shadow:none!important; } /* Opening section: same brand atmosphere as the cinematic homepage. */ .space-hero,.titlebar.order-hero{ background: radial-gradient(ellipse at 88% 75%,rgba(50,117,164,.32),transparent 62%), linear-gradient(118deg,#08162e 0%,#132b53 60%,#162f55 100%)!important; border:1px solid rgba(113,188,227,.47)!important; box-shadow:0 15px 35px rgba(1,6,22,.29),inset 0 1px 0 rgba(230,250,255,.1)!important; color:#fff!important; } .space-hero::before{opacity:.24!important} .space-hero-beam,.space-hero-orbit{opacity:.4!important} .space-hero .eyebrow,.space-hero .space-hero-spark{color:#9cebf6!important;text-shadow:none!important} .space-hero h1{color:#fff!important;text-shadow:0 2px 2px rgba(0,0,0,.16)!important} .space-hero h1 em,.space-hero h1 .isf-hero-keyword{ background:linear-gradient(100deg,#affdff,#72c9ff 70%,#d0dcff)!important; background-clip:text!important; -webkit-background-clip:text!important; -webkit-text-fill-color:transparent!important; text-shadow:none!important; } .space-hero .subtitle,.space-hero .subtitle span{color:#e2edf9!important;text-shadow:none!important} .space-hero-badges > span,.space-hero .status,.space-hero .isf-hero-status{ background:rgba(28,84,119,.39)!important; border:1px solid rgba(129,209,230,.36)!important; color:#e3f5ff!important; box-shadow:none!important; } .space-hero .status-dot{background:#7ff5c7!important;box-shadow:0 0 9px rgba(75,238,187,.52)!important} .space-hero-mascot{filter:drop-shadow(0 14px 23px rgba(0,0,0,.26))!important} /* Step nav + summary dashboard */ .journey-progress,.journey-premium, .v60-order-glance{ background:linear-gradient(135deg,rgba(14,34,65,.98),rgba(23,49,86,.97))!important; border:1px solid var(--sg-soft-border)!important; box-shadow:var(--sg-shadow)!important; color:#f3f9ff!important; } .journey-progress .journey-step{color:#e3f0fc!important;text-shadow:none!important} .journey-progress .journey-text strong{color:#fff!important;text-shadow:none!important} .journey-progress .journey-text small{color:#b5d0e7!important} .journey-progress .journey-step.is-current, .journey-progress .journey-step[aria-current="step"]{ background:rgba(34,111,148,.39)!important; border-color:rgba(106,230,237,.67)!important; box-shadow:inset 0 0 0 1px rgba(99,222,232,.16)!important; } .journey-progress .journey-number, .cosmic-dashboard .section-head .step{ background:linear-gradient(145deg,#1878ad,#164b8b)!important; border:1px solid #69d9f2!important; color:#fff!important; box-shadow:0 2px 10px rgba(33,170,203,.24)!important; text-shadow:none!important; } .v60-order-glance .v60-glance-stat{ background:rgba(29,66,108,.66)!important; border-color:var(--sg-soft-border)!important; color:#fff!important; box-shadow:none!important; } .v60-order-glance strong,.v60-order-glance a{color:#fff!important;text-shadow:none!important} .v60-order-glance span{color:#c4dbef!important} .v60-order-glance .v60-glance-star{color:var(--sg-cyan)!important} /* Section cards: translucent dark blue, legible silver text, no heavy purple fog. */ .cosmic-dashboard .sheet,.cosmic-dashboard .form-card, .cosmic-dashboard .address-card,.cosmic-dashboard .space-method-card, .cosmic-dashboard .cargo-collection-head,.cosmic-dashboard .pallet-dim-panel, .cosmic-dashboard .submit-panel{ background:linear-gradient(150deg,rgba(27,52,94,.97),rgba(14,31,65,.97) 64%,rgba(20,43,79,.97))!important; border:1px solid var(--sg-border)!important; box-shadow:var(--sg-shadow),inset 0 1px 0 rgba(238,252,255,.075)!important; color:#f4f9ff!important; } .cosmic-dashboard .sheet::before{opacity:.38!important} .cosmic-dashboard .cargo-collection-head::before{opacity:.28!important} .cosmic-dashboard .sheet .section-head h2, .cosmic-dashboard .sheet .subhead, .cosmic-dashboard .field-top .subhead, .cosmic-dashboard .mini-title, .cosmic-dashboard .form-field label, .cosmic-dashboard .reservation label, .cosmic-dashboard .pallet-dim-title strong, .cosmic-dashboard .submit-panel strong, .cosmic-dashboard .cargo-collection-head .subhead{ color:#f7fbff!important;text-shadow:none!important; } .cosmic-dashboard .section-head p,.cosmic-dashboard .hint, .cosmic-dashboard .quiet,.cosmic-dashboard .field-help, .cosmic-dashboard .cargo-collection-sub, .cosmic-dashboard .pallet-dim-title small,.cosmic-dashboard .cargo-note-hint, .cosmic-dashboard .address-completion-note,.cosmic-dashboard .cargo-kicker{ color:#c6d9eb!important;text-shadow:none!important; } .cosmic-dashboard .cargo-collection-sub strong{color:#9ff7ee!important} .cosmic-dashboard .cargo-kicker span,.cosmic-dashboard .memo-auto-tag{ background:rgba(20,108,130,.32)!important; border:1px solid rgba(92,211,219,.4)!important; color:#b5fcf7!important; } .cosmic-dashboard .divider-line{border-color:rgba(163,203,237,.23)!important} .cosmic-dashboard .truck-shape-field,.cosmic-dashboard .notice, .cosmic-dashboard .pallet-dim-fields,.cosmic-dashboard .cosmic-live-facts>div, .cosmic-dashboard .dispatch-route-strip, .cosmic-dashboard #quote-section .dispatch-route-strip{ background:rgba(8,28,60,.57)!important; border:1px solid var(--sg-soft-border)!important; color:#e7f3ff!important; box-shadow:none!important; } .cosmic-dashboard .truck-shape-field label, .cosmic-dashboard .truck-shape-field p, .cosmic-dashboard .vehicle-code-status, .cosmic-dashboard .notice,.cosmic-dashboard .notice span{color:#d8ecfa!important} /* Vehicle cards and tabs */ .cosmic-dashboard .tab-switch,.cosmic-dashboard .cosmic-vehicle-modes{ background:rgba(7,23,50,.66)!important; border:1px solid var(--sg-soft-border)!important; box-shadow:none!important; } .cosmic-dashboard .tab{color:#d4e8f8!important} .cosmic-dashboard .tab.selected{ background:linear-gradient(115deg,#1564a0,#1195a8)!important; color:#fff!important;box-shadow:none!important; } .cosmic-dashboard .vehicle-grid .vehicle{ background:linear-gradient(145deg,#223d6c,#15294e)!important; border:1px solid rgba(144,193,230,.39)!important; color:#fff!important; box-shadow:0 6px 15px rgba(0,9,34,.17)!important; } .cosmic-dashboard .vehicle-grid .vehicle::before{opacity:.22!important} .cosmic-dashboard .vehicle-grid .vehicle.chosen{ background:linear-gradient(145deg,#1d607b,#164465 65%,#1a3463)!important; border:2px solid #72dfe7!important; box-shadow:0 0 0 2px rgba(80,213,224,.14)!important; } .cosmic-dashboard .vehicle-grid .vehicle strong, .cosmic-dashboard .vehicle-grid .vehicle.chosen strong{color:#fff!important;text-shadow:none!important} .cosmic-dashboard .vehicle-grid .vehicle small, .cosmic-dashboard .vehicle-grid .vehicle.chosen small{color:#c9ddf1!important} /* Inventory: keep v108 geometry / 10 new illustrations, replace only palette. */ .cosmic-dashboard #cargoItems .item{ background:linear-gradient(146deg,#254578 0%,#172d57 76%,#112448)!important; border:1px solid rgba(139,188,233,.4)!important; color:#fff!important; box-shadow:0 7px 16px rgba(0,8,35,.19),inset 0 1px 0 rgba(255,255,255,.07)!important; } .cosmic-dashboard #cargoItems .item::before{opacity:.22!important} .cosmic-dashboard #cargoItems .item[data-selected="true"]{ background:linear-gradient(150deg,#1d597a,#184367 67%,#16355d)!important; border-color:#73f0eb!important; box-shadow:0 0 0 2px rgba(110,235,234,.12)!important; } .cosmic-dashboard #cargoItems .item[data-selected="true"]::after{ background:#79f2e6!important;color:#093343!important; } .cosmic-dashboard #cargoItems .item-main, .cosmic-dashboard #cargoItems .item-main strong{color:#fff!important;text-shadow:none!important} .cosmic-dashboard #cargoItems .item-main small{color:#cedff4!important} .cosmic-dashboard #cargoItems .item-main .item-art-wrap{background:none!important} .cosmic-dashboard #cargoItems .counter{ background:rgba(4,18,44,.77)!important; border:1px solid rgba(133,190,225,.43)!important; box-shadow:none!important; } .cosmic-dashboard #cargoItems .counter b{color:#fff!important} .cosmic-dashboard #cargoItems .counter button{ background:linear-gradient(135deg,#2462ab,#287cbd)!important; color:#fff!important;box-shadow:none!important; } .cosmic-dashboard #cargoItems .counter button:hover{background:#139bb3!important;color:#fff!important} /* Customer text fields are purposefully light, for contrast and input precision. */ .cosmic-dashboard input,.cosmic-dashboard textarea, .cosmic-dashboard select,.cosmic-dashboard #cargoNote{ background:#f4f8fe!important; color:#122a45!important; border:1px solid #b8cbe2!important; box-shadow:none!important; } .cosmic-dashboard input::placeholder,.cosmic-dashboard textarea::placeholder{color:#7187a3!important} .cosmic-dashboard input:focus,.cosmic-dashboard textarea:focus,.cosmic-dashboard select:focus{ border-color:#17b9cb!important; outline:none!important; box-shadow:0 0 0 3px rgba(55,201,216,.20)!important; } .cosmic-dashboard .memo-foot,.cosmic-dashboard #memoCharacters, .cosmic-dashboard #memoSyncStatus{color:#c5e2f5!important} /* Handling / departure / payment selections */ .cosmic-dashboard .choice,.cosmic-dashboard .cosmic-pay{ background:linear-gradient(148deg,#253f73,#192f59)!important; color:#e9f5ff!important; border:1px solid rgba(157,200,236,.40)!important; box-shadow:none!important; } .cosmic-dashboard .choice.chosen,.cosmic-dashboard .cosmic-pay.is-active{ background:linear-gradient(150deg,#166e93,#144c80)!important; color:#fff!important; border:2px solid #83ecee!important; box-shadow:0 0 0 2px rgba(98,228,235,.13)!important; } .cosmic-dashboard .choice-row .choice:hover, .cosmic-dashboard .cosmic-pay:hover{border-color:#86dfee!important} /* Fare output: remove milky glow / lower contrast. */ .cosmic-dashboard #quote-section .quote-display, .cosmic-dashboard #quote-section .dispatch-quote-grid, .cosmic-dashboard .side-price{ background:linear-gradient(140deg,#0b1f3c,#153258)!important; border:1px solid rgba(134,199,235,.42)!important; color:#fff!important; box-shadow:0 8px 20px rgba(0,7,29,.19)!important; } .cosmic-dashboard #quote-section .quote-display .quiet, .cosmic-dashboard #quote-section .quote-display small, .cosmic-dashboard #quote-section .quote-display p, .cosmic-dashboard #quote-section .quote-display span{color:#d4e9f8!important} .cosmic-dashboard #quote-section .quote-display strong, .cosmic-dashboard #quote-section .quote-display .dispatch-quote-total strong, .cosmic-dashboard #quote-section .quote-display .dispatch-quote-endpoints{color:#fff!important;text-shadow:none!important} .cosmic-dashboard .primary, .cosmic-dashboard button.primary, .cosmic-dashboard #registerButton{ background:linear-gradient(115deg,#23bfd0,#2698dc)!important; border:1px solid #7bd9ee!important; color:#062744!important; box-shadow:0 4px 12px rgba(9,123,172,.15)!important; text-shadow:none!important; font-weight:850!important; } .cosmic-dashboard .secondary{ background:rgba(25,56,99,.93)!important; border:1px solid rgba(151,201,239,.45)!important; color:#e5f5ff!important; box-shadow:none!important; } .cosmic-dashboard button.primary:disabled, .cosmic-dashboard #registerButton:disabled{ background:linear-gradient(115deg,#8daec7,#91aace)!important; color:#24405a!important; border-color:#9db6ce!important; opacity:.8!important; } /* Floating bottom fare summary: opaque, crisp, seamless with the parent brand. */ .isf-fare-dock{ background:linear-gradient(112deg,#091b35,#112d54 65%,#193760)!important; border:1px solid rgba(143,205,236,.71)!important; box-shadow:0 15px 36px rgba(1,7,27,.38),inset 0 1px 0 rgba(255,255,255,.11)!important; backdrop-filter:blur(5px)!important; -webkit-backdrop-filter:blur(5px)!important; animation:none!important; } .isf-fare-dock::before{opacity:.11!important} .isf-fare-dock .isf-fare-dock-brand-copy strong, .isf-fare-dock .isf-fare-dock-label strong, .isf-fare-dock .isf-fare-dock-price span, .isf-fare-dock .isf-fare-dock-price b{ color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.22)!important; } .isf-fare-dock .isf-fare-dock-brand-kicker, .isf-fare-dock .isf-fare-dock-label small, .isf-fare-dock .isf-fare-dock-note, .isf-fare-dock .isf-dock-readiness{color:#e2f1ff!important;text-shadow:none!important} .isf-fare-dock .isf-fare-dock-dot{ background:#75f7c6!important;box-shadow:0 0 0 3px rgba(79,233,187,.12)!important; } .isf-fare-dock .isf-fare-dock-price span:first-child, .isf-fare-dock .isf-fare-dock-price b{font-weight:950!important;letter-spacing:-.035em!important} .isf-fare-dock .isf-fare-dock-action #registerButton{ background:linear-gradient(120deg,#65eff0,#7ec3fb)!important; border:1px solid #a9f8ff!important; color:#072a49!important; box-shadow:none!important; } .isf-fare-dock .isf-fare-dock-action #registerButton:disabled{ background:linear-gradient(120deg,#9fb9ca,#96aecd)!important; border-color:#b2c5d4!important; color:#2a4562!important; opacity:.83!important; } /* Footer and address modal remain readable and independently styled. */ #footerArea,footer,.page-shell footer{color:#c9deef!important;border-color:var(--sg-soft-border)!important} #insungAddressDialog .ia-smart-option:hover, #insungAddressDialog .ia-smart-option:focus-visible{ background:#e9f9fc!important;border-color:#31bac9!important; } #insungAddressDialog .ia-smart-type{color:#087c91!important;background:#dff5fa!important} #insungAddressDialog #ia_keyword:focus-visible{outline-color:#1dbfce!important} .cosmic-dashboard button:focus-visible,.cosmic-dashboard a:focus-visible, .journey-progress a:focus-visible,#insungAddressDialog button:focus-visible{ outline:3px solid #92f0f1!important;outline-offset:3px!important; } @media(max-width:760px){ .site-head{background:rgba(5,13,29,.98)!important} .space-hero{background:linear-gradient(128deg,#08172f,#16375c)!important} .cosmic-dashboard .sheet{background:linear-gradient(140deg,#1c3764,#102448)!important} .isf-fare-dock{background:linear-gradient(110deg,#09203d,#17345b)!important} } @media(prefers-reduced-motion:reduce){ .space-hero-mascot,.isf-fare-dock{animation:none!important} } /* V110 — hide duplicate vehicle name captions under vehicle artwork. Preserve tonnage badges, descriptions, selection handlers, and dynamic vehicle modes. Keep in the DOM for existing JavaScript/accessibility fallback. */ .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > strong { display: none !important; } /* V111 — balance vehicle cards after V110 hides the duplicated vehicle title. Only visual layout is changed; selection and all data attributes are preserved. */ .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle { display: grid !important; grid-template-columns: minmax(0, 1fr); grid-template-rows: 106px minmax(26px, auto); align-content: center; justify-items: center; align-items: center; column-gap: 0; row-gap: 9px; padding: 23px 10px 17px; text-align: center; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > strong { display: none !important; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > .vehicle-icon { display: flex; grid-row: 1; grid-column: 1; align-self: center; justify-content: center; align-items: center; margin: 0 !important; padding: 0 !important; width: 100%; height: 106px; min-height: 0; overflow: visible; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle .vehicle-icon > .space-vehicle-art { width: 100%; max-width: 170px; height: 100%; object-fit: contain; object-position: center center; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > small { display: flex; grid-row: 2; grid-column: 1; justify-content: center; align-items: center; align-self: center; width: 100%; min-height: 26px; margin: 0 !important; padding: 0; text-align: center; line-height: 1.35; white-space: normal; word-break: keep-all; } @media (max-width: 760px) { .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle { grid-template-rows: 80px minmax(28px, auto); row-gap: 5px; padding: 17px 7px 13px; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > .vehicle-icon { height: 80px; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle .vehicle-icon > .space-vehicle-art { max-width: 137px; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > small { min-height: 28px; font-size: 11px; } } @media (max-width: 380px) { .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle { grid-template-rows: 72px minmax(28px, auto); row-gap: 4px; padding: 15px 6px 11px; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > .vehicle-icon { height: 72px; } .cosmic-dashboard #vehicleGrid.vehicle-grid .vehicle > small { font-size: 10px; } } /* V112 refined in V116: consistent two-column badges, icon/text without nested pill styles. */ .space-hero .space-hero-badges{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:12px 14px!important; width:min(100%,560px); max-width:100%; margin-top:18px; } .space-hero .space-hero-badges > .hero-chip{ display:flex!important; align-items:center!important; justify-content:center!important; gap:10px; width:100%; height:auto; min-height:48px; margin:0!important; padding:9px 12px!important; border:1px solid rgba(125,211,237,.42)!important; border-radius:999px!important; background:linear-gradient(110deg,rgba(28,78,116,.56),rgba(26,86,125,.4))!important; box-shadow:inset 0 1px 0 rgba(214,246,255,.1)!important; color:#eafaff!important; font-size:clamp(12px,1.15vw,15px)!important; font-weight:800!important; line-height:1.25!important; letter-spacing:-.025em; text-align:center!important; box-sizing:border-box; } .space-hero .space-hero-badges > .hero-chip > .badge-icon, .space-hero .space-hero-badges > .hero-chip > .badge-text{ display:inline-flex!important; align-items:center; justify-content:center; width:auto; min-width:0; min-height:0; margin:0!important; padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; font:inherit!important; line-height:1.25!important; color:inherit!important; text-shadow:none!important; white-space:nowrap; } .space-hero .space-hero-badges > .hero-chip > .badge-icon{ flex:0 0 18px; font-size:18px!important; color:#7de7f5!important; } .space-hero .space-hero-badges > .hero-chip > .badge-text{flex:0 1 auto;} .space-hero .space-hero-badges .status-dot{display:none!important;} @media (max-width:760px){ .space-hero .space-hero-badges{ width:min(100%,330px); gap:8px!important; margin-top:13px; } .space-hero .space-hero-badges > .hero-chip{ min-height:41px; padding:7px 5px!important; gap:5px; font-size:clamp(10px,2.8vw,12px)!important; } .space-hero .space-hero-badges > .hero-chip > .badge-icon{ flex:0 0 14px; font-size:14px!important; } } @media (max-width:380px){ .space-hero .space-hero-badges{width:min(100%,300px);} .space-hero .space-hero-badges > .hero-chip{ font-size:10px!important; min-height:40px; padding:6px 4px!important; gap:4px; } } /* [consolidated from vehicle-collapse-v113.css] */ /* V113 — Hide other vehicles only after the customer explicitly chooses a vehicle. */ #vehicleOptionsPanel[hidden], #vehicleCollapsedSummary[hidden] { display:none !important; } #vehicleCollapsedSummary.v113-vehicle-summary{ position:relative; display:flex; align-items:center; gap:18px; width:100%; min-height:112px; margin:18px 0 17px; padding:12px 24px; border:1px solid rgba(113,211,236,.55); border-radius:19px; background:linear-gradient(110deg,rgba(18,54,97,.94),rgba(26,68,107,.93)); box-shadow:0 12px 26px rgba(4,16,41,.18),inset 0 1px 0 rgba(232,250,255,.1); color:#f6fbff; text-align:left; cursor:pointer; transition:border-color .2s,background .2s,box-shadow .2s; font-family:inherit; } #vehicleCollapsedSummary:hover{ background:linear-gradient(110deg,rgba(19,68,108,.97),rgba(25,84,116,.95)); border-color:#83e5f3; box-shadow:0 12px 25px rgba(4,25,57,.27); } #vehicleCollapsedSummary:focus-visible{ outline:3px solid #9effe5; outline-offset:3px; } .v113-summary-thumb{ display:flex; align-items:center; justify-content:center; flex:0 0 115px; height:83px; min-width:0; border-radius:13px; background:rgba(7,24,58,.22); } .v113-summary-thumb img{ display:block; max-width:100%; max-height:80px; width:100%; height:100%; object-fit:contain; object-position:center; } .v113-summary-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:7px} .v113-summary-label{color:#c7e6fa;font-size:13px;font-weight:750;line-height:1.25} .v113-summary-label strong{color:#fff;font-size:19px;font-weight:900;margin-left:9px;letter-spacing:-.025em} .v113-summary-caption{color:#b7f3f5;font-size:14px;font-weight:800;line-height:1.45;word-break:keep-all} .v113-summary-chevron{ display:flex; align-items:center; justify-content:center; flex:0 0 36px; width:36px; height:36px; padding:0; border:1px solid rgba(152,232,255,.36); border-radius:50%; background:rgba(51,118,156,.23); line-height:0; box-sizing:border-box; } .v113-summary-chevron svg{ display:block; flex:0 0 17px; width:17px; height:17px; overflow:visible; fill:none; stroke:#eaf8ff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; shape-rendering:geometricPrecision; } @media(max-width:760px){ #vehicleCollapsedSummary.v113-vehicle-summary{min-height:92px;margin:13px 0;padding:10px 12px;gap:10px;border-radius:16px} .v113-summary-thumb{flex-basis:72px;height:65px} .v113-summary-thumb img{max-height:65px} .v113-summary-copy{gap:4px} .v113-summary-label{font-size:11px} .v113-summary-label strong{font-size:16px;margin-left:5px} .v113-summary-caption{font-size:12px} .v113-summary-chevron{flex-basis:28px;width:28px;height:28px} .v113-summary-chevron svg{flex-basis:14px;width:14px;height:14px} } @media(max-width:350px){ .v113-summary-thumb{flex-basis:58px} .v113-summary-label strong{font-size:14px} .v113-summary-caption{font-size:11px} } @media(prefers-reduced-motion:reduce){#vehicleCollapsedSummary{transition:none}} /* V122 · horizontal reflection only: keep the astronaut on the right, but reverse its facing. */ .space-hero .space-hero-mascot{transform:scaleX(-1)!important;transform-origin:center center!important} /* V122 · slightly larger four-pill hero with aligned heading edge and mirrored mascot. Retains the V121 compact fare dock and connection indicator. Existing classes/IDs are preserved; no external CSS or JS is introduced. */ /* V121 · compact four-pill hero and two-row mobile fare dock. Existing classes/IDs are preserved; no external CSS or JS is introduced. */ .space-hero .space-hero-badges{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; align-items:stretch; width:min(100%,516px)!important; max-width:516px!important; margin-top:12px!important; } .space-hero .space-hero-badges > .hero-chip{ display:flex!important; width:100%!important; height:34px!important; min-height:34px!important; padding:4px 7px!important; gap:5px!important; align-items:center!important; justify-content:center!important; flex-wrap:nowrap!important; white-space:nowrap!important; font-size:11px!important; line-height:1.2!important; border-radius:999px!important; margin:0!important; box-sizing:border-box!important; } .space-hero .space-hero-badges > .hero-chip > .badge-icon{ flex:0 0 12px!important; width:12px!important; font-size:12px!important; line-height:1!important; } .space-hero .space-hero-badges > .hero-chip > .badge-text{ flex:0 1 auto!important; white-space:nowrap!important; line-height:1.2!important; } .isf-fare-dock .isf-dock-connection{ display:inline-flex; align-items:center; align-self:flex-start; gap:5px; margin-top:3px; font-size:10px; font-weight:800; line-height:1.2; color:#ffb2ae!important; white-space:nowrap; } .isf-fare-dock .isf-dock-connection i{ display:block; width:7px; height:7px; border-radius:50%; flex:0 0 7px; background:#ff5d63; box-shadow:0 0 0 2px rgba(255,80,90,.13),0 0 7px rgba(255,80,90,.65); } .isf-fare-dock .isf-dock-connection.is-connected{color:#8df9d4!important} .isf-fare-dock .isf-dock-connection.is-connected i{ background:#39ec9f; box-shadow:0 0 0 2px rgba(57,236,159,.13),0 0 7px rgba(57,236,159,.65); } /* The detailed reasons remain accessible to screen readers and the submit button tooltip, but must not occupy any space in the compact floating order dock. */ .isf-fare-dock #isfDockReadiness{ position:absolute!important; width:1px!important; height:1px!important; min-width:0!important; min-height:0!important; padding:0!important; margin:-1px!important; border:0!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; clip-path:inset(50%)!important; white-space:nowrap!important; } @media (max-width:760px){ :root{--isf-dock-height:96px} .space-hero .space-hero-copy{position:relative;z-index:3} .space-hero .space-hero-badges{ width:min(79%,253px)!important; max-width:min(79%,253px)!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:6px!important; margin-top:12px!important; } .space-hero .space-hero-badges > .hero-chip{ height:35px!important; min-height:35px!important; padding:4px 5px!important; gap:4px!important; font-size:10.3px!important; letter-spacing:-.055em!important; } .space-hero .space-hero-badges > .hero-chip > .badge-icon{ flex:0 0 11px!important; width:11px!important; font-size:12px!important; } .space-hero .space-hero-badges > .hero-chip > .badge-text{font-size:inherit!important} .isf-fare-dock{ width:calc(100% - 16px)!important; min-height:0!important; bottom:max(8px,env(safe-area-inset-bottom,0px) + 6px)!important; border-radius:17px!important; } .isf-fare-dock-inner{ display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(108px,.85fr)!important; grid-template-rows:32px 41px!important; grid-template-areas:"brand label label" "price price action"!important; gap:4px 7px!important; min-height:0!important; padding:7px 10px 8px!important; align-items:center!important; } .isf-fare-dock .isf-fare-dock-brand{ grid-area:brand!important; grid-column:auto!important; grid-row:auto!important; min-width:0!important; gap:6px!important; align-items:center!important; } .isf-fare-dock .isf-fare-dock-brand-logo{width:30px!important;height:30px!important} .isf-fare-dock .isf-fare-dock-brand-copy{min-width:0!important} .isf-fare-dock .isf-fare-dock-brand-kicker{display:none!important} .isf-fare-dock .isf-fare-dock-brand-copy strong{ font-size:11px!important; line-height:1.12!important; white-space:nowrap!important; text-overflow:ellipsis!important; overflow:hidden!important; } .isf-fare-dock .isf-dock-connection{font-size:9px!important;margin-top:3px!important} .isf-fare-dock .isf-fare-dock-label{ grid-area:label!important; grid-column:auto!important; grid-row:auto!important; display:flex!important; align-items:flex-end!important; justify-content:center!important; text-align:right!important; padding:0!important; min-width:0!important; } .isf-fare-dock .isf-fare-dock-label strong{font-size:12px!important;white-space:nowrap!important} .isf-fare-dock .isf-fare-dock-label small{display:none!important} .isf-fare-dock .isf-fare-dock-price{ grid-area:price!important; grid-column:auto!important; grid-row:auto!important; display:flex!important; min-height:0!important; justify-content:flex-start!important; align-content:center!important; align-items:center!important; text-align:left!important; flex-wrap:wrap!important; gap:2px 4px!important; padding:0!important; } .isf-fare-dock .isf-fare-dock-price > span:first-child, .isf-fare-dock .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock .isf-fare-dock-price .isf-fare-dock-plus b{ font-size:clamp(14px,3.8vw,18px)!important; line-height:1.16!important; } .isf-fare-dock .isf-fare-dock-action{ grid-area:action!important; grid-column:auto!important; grid-row:auto!important; display:flex!important; min-width:0!important; width:100%!important; align-items:stretch!important; justify-content:center!important; } .isf-fare-dock .isf-fare-dock-action #registerButton{ min-height:39px!important; height:39px!important; padding:6px 8px!important; border-radius:11px!important; font-size:13px!important; white-space:nowrap!important; } .isf-fare-dock .isf-fare-dock-note{display:none!important} .isf-floating-notice{bottom:calc(var(--isf-dock-height) + 12px)!important} } @media (max-width:370px){ .space-hero .space-hero-badges{width:min(78%,234px)!important;max-width:min(78%,234px)!important} .space-hero .space-hero-badges > .hero-chip{font-size:9.2px!important;padding:3px 3px!important;gap:3px!important} .space-hero .space-hero-badges > .hero-chip > .badge-icon{flex-basis:10px!important;width:10px!important;font-size:11px!important} .isf-fare-dock-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(100px,.85fr)!important;padding:7px 8px 8px!important} .isf-fare-dock .isf-fare-dock-brand-logo{width:27px!important;height:27px!important} .isf-fare-dock .isf-fare-dock-price > span:first-child{font-size:13px!important} } @media print{.isf-fare-dock .isf-dock-connection{display:none!important}} /* V123 — nonstandard pallet focus. Other items are visually folded only; no existing quantity, memo, API or dispatch behavior is changed. */ .cosmic-dashboard #cargoItems.is-pallet-focused.item-grid{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; align-items:stretch; gap:12px!important; } .cosmic-dashboard #cargoItems.is-pallet-focused > .item[data-item="비규격 파렛트"]{ order:0; grid-column:1/2; max-width:300px; width:100%; justify-self:start; } .cosmic-dashboard #cargoItems.is-pallet-focused > .pallet-dim-panel{ order:1; grid-column:1/-1; margin:0!important; } .cosmic-dashboard #cargoItems.is-pallet-focused > .cargo-more-toggle{ order:2; grid-column:1/-1; } .cosmic-dashboard #cargoItems.is-pallet-focused > .item:not([data-item="비규격 파렛트"]){ order:3; display:none!important; } .cosmic-dashboard #cargoItems.is-pallet-focused.is-pallet-expanded > .item:not([data-item="비규격 파렛트"]){ display:flex!important; } .cosmic-dashboard #cargoItems .pallet-dim-panel.hidden{display:none!important} .cosmic-dashboard #cargoItems .cargo-more-toggle[hidden]{display:none!important} .cosmic-dashboard #cargoItems .cargo-more-toggle{ display:flex;align-items:center;text-align:left;gap:12px; box-sizing:border-box;width:100%;min-height:64px;padding:12px 18px; border:1px solid rgba(129,218,236,.55);border-radius:15px; background:linear-gradient(110deg,rgba(22,89,129,.56),rgba(17,48,96,.88)); color:#eafaff;box-shadow:inset 0 1px 0 rgba(255,255,255,.1); font-family:inherit;cursor:pointer; } .cosmic-dashboard #cargoItems .cargo-more-toggle:hover{border-color:#9feaf7;background:rgba(39,112,145,.65)} .cosmic-dashboard #cargoItems .cargo-more-toggle:focus-visible{outline:3px solid #86eaff;outline-offset:3px} .cosmic-dashboard #cargoItems .cargo-more-toggle-symbol{ display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:11px; background:rgba(88,219,232,.17);font-size:23px;font-weight:800;color:#78f6f0; } .cosmic-dashboard #cargoItems .cargo-more-toggle-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:1px} .cosmic-dashboard #cargoItems .cargo-more-toggle-copy strong{font-size:14px;font-weight:900;color:#fff;line-height:1.4} .cosmic-dashboard #cargoItems .cargo-more-toggle-copy small{font-size:11px;font-weight:700;color:#b5dce9} .cosmic-dashboard #cargoItems .cargo-more-toggle-chevron{font-size:25px;color:#91eaf3;line-height:1;transform:rotate(0);transition:transform .18s} .cosmic-dashboard #cargoItems .cargo-more-toggle[aria-expanded="true"] .cargo-more-toggle-chevron{transform:rotate(180deg)} /* Prominent, readable size entry, immediately after the selected pallet. */ .cosmic-dashboard #cargoItems .pallet-dim-panel{ border:2px solid rgba(108,237,222,.9)!important; background:linear-gradient(145deg,#14385e,#10234d 85%)!important; box-shadow:0 0 0 3px rgba(44,203,215,.07),0 12px 28px rgba(0,10,37,.26)!important; padding:18px 20px!important; } .cosmic-dashboard #cargoItems .pallet-dim-required{ color:#052d3f;background:#99fff0;border-color:#b8fffb;font-weight:900; } .cosmic-dashboard #cargoItems .pallet-dim-fields input{ height:58px;min-height:58px;background:#fff!important; border:2px solid rgba(113,220,227,.86)!important;color:#112e51!important; font-size:20px;font-weight:900;border-radius:12px; } .cosmic-dashboard #cargoItems .pallet-dim-fields input::placeholder{color:#7d94a4;font-size:14px;font-weight:650} .cosmic-dashboard #cargoItems .pallet-dim-fields label{font-size:14px;color:#fff;font-weight:850} @media(max-width:760px){ .cosmic-dashboard #cargoItems.is-pallet-focused.item-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important} .cosmic-dashboard #cargoItems.is-pallet-focused > .item[data-item="비규격 파렛트"]{ grid-column:1/-1;justify-self:center;max-width:min(100%,280px); } .cosmic-dashboard #cargoItems .pallet-dim-panel{padding:15px 13px!important} .cosmic-dashboard #cargoItems .pallet-dim-fields{gap:7px} .cosmic-dashboard #cargoItems .pallet-dim-fields input{height:52px;min-height:52px;font-size:18px} .cosmic-dashboard #cargoItems .cargo-more-toggle{min-height:59px;padding:10px 12px} } @media(max-width:360px){ .cosmic-dashboard #cargoItems .pallet-dim-title{gap:7px} .cosmic-dashboard #cargoItems .pallet-dim-title strong{font-size:13px} .cosmic-dashboard #cargoItems .pallet-dim-required{font-size:9px;padding:4px 6px} } /* V124 · Galaxy theme for the Insung address-search dialog. Presentation only: address lookup, suggestions, verification and order logic are unchanged. */ #insungAddressDialog.address-dialog{ color:#edf7ff!important; background: radial-gradient(ellipse at 88% 8%,rgba(73,147,255,.22),transparent 34%), radial-gradient(ellipse at 8% 100%,rgba(33,201,226,.13),transparent 42%), linear-gradient(145deg,#08162f 0%,#10284b 54%,#142f5a 100%)!important; border:1px solid rgba(126,207,255,.72)!important; border-radius:23px!important; box-shadow:0 28px 90px rgba(0,5,25,.72),0 0 0 1px rgba(122,218,255,.12),0 0 34px rgba(40,157,255,.2),inset 0 1px 0 rgba(239,250,255,.14)!important; scrollbar-color:rgba(101,202,245,.62) rgba(5,18,39,.55); } #insungAddressDialog::backdrop{ background:rgba(2,8,24,.76)!important; -webkit-backdrop-filter:blur(7px) saturate(.82); backdrop-filter:blur(7px) saturate(.82); } #insungAddressDialog .address-dialog-inner{ color:#edf7ff!important; background:transparent!important; } #insungAddressDialog .address-dialog-header h2{ color:#f5fbff!important; text-shadow:0 2px 15px rgba(69,174,255,.2); } #insungAddressDialog .address-dialog-header .eyebrow{ color:#76e9f3!important; letter-spacing:.16em!important; text-shadow:0 0 12px rgba(76,226,255,.3); } #insungAddressDialog .address-close{ color:#dff7ff!important; background:linear-gradient(145deg,rgba(65,110,158,.42),rgba(22,48,84,.86))!important; border:1px solid rgba(135,213,255,.42)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 14px rgba(0,0,0,.18); } #insungAddressDialog .address-close:hover{ color:#fff!important; border-color:#8cefff!important; box-shadow:0 0 18px rgba(67,212,255,.22); } #insungAddressDialog .address-help{ color:#bfd2e9!important; } #insungAddressDialog .address-onebox{ background:rgba(4,16,37,.82)!important; border:1.5px solid rgba(91,222,239,.86)!important; border-radius:15px!important; box-shadow:0 0 0 3px rgba(71,206,241,.09),0 8px 24px rgba(0,5,24,.26),inset 0 1px 0 rgba(255,255,255,.08)!important; } #insungAddressDialog .address-onebox:focus-within{ border-color:#8cf5ff!important; box-shadow:0 0 0 4px rgba(75,221,255,.15),0 0 22px rgba(47,194,255,.18),inset 0 1px 0 rgba(255,255,255,.1)!important; } #insungAddressDialog .address-onebox>svg{color:#71eaff!important} #insungAddressDialog #ia_keyword{ color:#f5fbff!important; background:transparent!important; caret-color:#7df5ff; -webkit-text-fill-color:#f5fbff!important; } #insungAddressDialog #ia_keyword::placeholder{ color:#8fa9c6!important; opacity:1; } #insungAddressDialog #ia_keyword:focus-visible{ outline:2px solid rgba(106,232,255,.62)!important; outline-offset:2px!important; } #insungAddressDialog #insungAddressSearch{ color:#06213e!important; background:linear-gradient(115deg,#70f5e5 0%,#62d9f4 48%,#83baff 100%)!important; border:1px solid rgba(190,255,255,.9)!important; border-radius:11px!important; box-shadow:0 5px 17px rgba(43,202,242,.2),inset 0 1px 0 rgba(255,255,255,.5)!important; font-weight:900!important; } #insungAddressDialog #insungAddressSearch:hover:not(:disabled){ filter:brightness(1.08); box-shadow:0 0 22px rgba(79,222,255,.35)!important; } #insungAddressDialog #insungAddressSearch:disabled{ color:#526e89!important; background:linear-gradient(120deg,#7898b3,#7896b8)!important; border-color:#9ab9d1!important; } #insungAddressDialog .ia-choice-tools.ia-smart-choice p{ color:#b4c9e4!important; } #insungAddressDialog .ia-postcode-open{ color:#dffaff!important; background:linear-gradient(115deg,rgba(26,81,126,.82),rgba(32,91,145,.72))!important; border:1px solid rgba(103,218,245,.72)!important; border-radius:12px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 5px 18px rgba(0,9,33,.2)!important; } #insungAddressDialog .ia-postcode-open:hover{ background:linear-gradient(115deg,rgba(34,111,157,.92),rgba(43,113,173,.86))!important; border-color:#8af0ff!important; box-shadow:0 0 20px rgba(57,195,255,.2)!important; } #insungAddressDialog .ia-postcode-panel{ color:#dceeff!important; background:rgba(7,22,47,.92)!important; border:1px solid rgba(108,194,239,.55)!important; box-shadow:0 10px 28px rgba(0,5,25,.28),inset 0 1px 0 rgba(255,255,255,.08)!important; } #insungAddressDialog .ia-postcode-panel-head{color:#effaff!important} #insungAddressDialog .ia-postcode-panel-head button{ color:#dffaff!important; background:rgba(47,99,146,.45)!important; border:1px solid rgba(125,211,246,.48)!important; } #insungAddressDialog .ia-postcode-panel>p{color:#b8cce4!important} #insungAddressDialog .ia-postcode-embed{ background:#f7fbff!important; border:1px solid rgba(128,207,245,.58)!important; } #insungAddressDialog .address-result-state{ color:#c9e9f7!important; background:linear-gradient(110deg,rgba(24,69,105,.72),rgba(20,59,94,.76))!important; border:1px solid rgba(91,188,225,.32)!important; } #insungAddressDialog .address-result-state.error{ color:#ffd9df!important; background:rgba(105,30,56,.52)!important; border-color:rgba(255,126,157,.48)!important; } #insungAddressDialog .address-result, #insungAddressDialog .ia-result-row>.address-result{ color:#edf7ff!important; background:linear-gradient(110deg,rgba(17,48,83,.96),rgba(21,57,98,.94))!important; border:1px solid rgba(110,181,226,.38)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 5px 15px rgba(0,5,24,.16)!important; } #insungAddressDialog .address-result strong{color:#f2f9ff!important} #insungAddressDialog .address-result small{color:#a9c3df!important} #insungAddressDialog .address-result:hover, #insungAddressDialog .address-result:focus-visible, #insungAddressDialog .address-result:active{ background:linear-gradient(110deg,rgba(25,83,126,.98),rgba(28,91,137,.96))!important; border-color:#75e8f5!important; outline:none; box-shadow:0 0 0 2px rgba(81,211,242,.12),0 0 18px rgba(56,174,244,.16)!important; } #insungAddressDialog .address-result.is-suggestion{ border-left:3px solid #66edf0!important; background:linear-gradient(110deg,rgba(22,75,112,.98),rgba(24,68,111,.96))!important; } #insungAddressDialog .address-result.is-suggestion small{color:#bce8f3!important} #insungAddressDialog .ia-smart-suggestions{ background:rgba(5,19,42,.94)!important; border:1px solid rgba(101,201,239,.5)!important; box-shadow:0 12px 28px rgba(0,5,25,.35)!important; } #insungAddressDialog .ia-smart-suggest-caption{color:#9cecf5!important} #insungAddressDialog .ia-smart-option{ color:#edf8ff!important; background:linear-gradient(110deg,rgba(19,48,82,.98),rgba(22,61,102,.96))!important; border-color:rgba(109,183,225,.22)!important; } #insungAddressDialog .ia-smart-option strong{color:#f3faff!important} #insungAddressDialog .ia-smart-type{ color:#052d4b!important; background:linear-gradient(120deg,#75f0e8,#80cfff)!important; } #insungAddressDialog .ia-smart-next{color:#a9e6f5!important} #insungAddressDialog .ia-smart-option:hover, #insungAddressDialog .ia-smart-option:focus-visible, #insungAddressDialog .ia-smart-option[aria-selected="true"]{ color:#fff!important; background:linear-gradient(110deg,rgba(29,91,137,.98),rgba(36,92,151,.98))!important; border-color:#79e9f4!important; } #insungAddressDialog .address-source-note{color:#91aac7!important} #insungAddressDialog .address-road-confirm{ color:#e5f6ff!important; background:rgba(17,62,91,.72)!important; border-color:rgba(93,212,224,.5)!important; } #insungAddressDialog .address-road-label, #insungAddressDialog .address-road-confirm p{color:#b5d9e8!important} #insungAddressDialog .address-reset-btn{ color:#dffaff!important;background:rgba(34,91,132,.65)!important;border-color:rgba(116,208,233,.5)!important; } #insungAddressDialog .address-road-fields input{color:#f5fbff!important;background:rgba(4,20,43,.78)!important;border-color:rgba(104,189,229,.5)!important} #insungAddressDialog .address-confirm-label{color:#eaf7ff!important} #insungAddressDialog .insung-map-panel{ background:rgba(8,27,54,.92)!important; border-color:rgba(106,190,231,.42)!important; } #insungAddressDialog .insung-map-head h3{color:#f2faff!important} #insungAddressDialog .insung-map-head p, #insungAddressDialog .insung-map-caution{color:#a8bfd9!important} #insungAddressDialog .insung-map-overline{color:#7deaf4!important} #insungAddressDialog .insung-map-pill{ color:#bdf7ff!important;background:rgba(37,105,143,.45)!important;border:1px solid rgba(103,217,240,.36)!important; } #insungAddressDialog .insung-map-status{color:#c4e4f4!important} #insungAddressDialog .insung-map-placeholder{ background:radial-gradient(circle at 50% 35%,rgba(53,129,184,.22),transparent 45%),linear-gradient(135deg,#102b4c,#091a34)!important; } #insungAddressDialog .insung-map-placeholder strong{color:#dff7ff!important} #insungAddressDialog .insung-map-placeholder small{color:#9ebbd6!important} #insungAddressDialog button:focus-visible{outline-color:#8af2ff!important} @media(max-width:650px){ #insungAddressDialog.address-dialog{border-radius:19px!important} #insungAddressDialog .address-dialog-header h2{font-size:19px} #insungAddressDialog .address-help{color:#bfd2e9!important} #insungAddressDialog .ia-choice-tools.ia-smart-choice p{font-size:10.5px} } @media(prefers-reduced-motion:no-preference){ #insungAddressDialog .address-onebox, #insungAddressDialog .ia-postcode-open, #insungAddressDialog .address-result{transition:border-color .18s,background .18s,box-shadow .18s} } /* V128: 개인정보 동의 체크박스 수직 정렬 및 세로 여백 축소 */ .isf-final-privacy .isf-final-agree{ display:flex; align-items:center; gap:10px; margin-top:8px; padding:8px 11px; min-height:48px; line-height:1.35; box-sizing:border-box; } .isf-final-privacy .isf-final-agree input{ flex:0 0 20px; width:20px; height:20px; align-self:center; margin:0; } .isf-final-privacy .isf-final-agree > span{ min-width:0; display:block; } @media(max-width:650px){ .isf-final-privacy .isf-final-agree{ gap:9px; padding:7px 10px; min-height:44px; } } /* V129: address search input — remove nested focus ring/native search circle */ #insungAddressDialog #ia_keyword{ appearance:none!important; -webkit-appearance:none!important; border:0!important; border-radius:0!important; outline:none!important; outline-offset:0!important; box-shadow:none!important; font-size:16px!important; line-height:1.4!important; letter-spacing:-.01em!important; padding-left:2px!important; padding-right:2px!important; } #insungAddressDialog #ia_keyword:focus, #insungAddressDialog #ia_keyword:focus-visible, #insungAddressDialog #ia_keyword:active{ outline:none!important; box-shadow:none!important; border:0!important; } #insungAddressDialog #ia_keyword::-webkit-search-decoration, #insungAddressDialog #ia_keyword::-webkit-search-cancel-button, #insungAddressDialog #ia_keyword::-webkit-search-results-button, #insungAddressDialog #ia_keyword::-webkit-search-results-decoration{ -webkit-appearance:none!important; display:none!important; } #insungAddressDialog #ia_keyword::placeholder{ color:rgba(143,169,198,.48)!important; opacity:1!important; -webkit-text-fill-color:rgba(143,169,198,.48)!important; font-size:14px!important; font-weight:500!important; } @media(max-width:650px){ #insungAddressDialog #ia_keyword{font-size:15.5px!important} #insungAddressDialog #ia_keyword::placeholder{font-size:13.5px!important} } /* V130: floating fare dock visual polish */ .isf-fare-dock{ border:1px solid rgba(146,223,255,.76)!important; background:linear-gradient(118deg,rgba(8,22,64,.96),rgba(20,45,111,.95) 56%,rgba(29,55,128,.94))!important; box-shadow:0 18px 38px rgba(2,8,33,.42),0 8px 18px rgba(25,173,255,.10),inset 0 1px 0 rgba(255,255,255,.12)!important; } .isf-fare-dock::after{ content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(255,255,255,.07),transparent 24%,transparent 76%,rgba(133,226,255,.05)); } .isf-fare-dock-inner{ position:relative; z-index:1; grid-template-columns:minmax(185px,1.12fr) minmax(120px,.8fr) minmax(0,1.08fr) minmax(152px,.82fr)!important; grid-template-areas:"brand label price action" "brand note note action"!important; gap:10px 16px!important; padding:13px 18px!important; } .isf-fare-dock-brand{grid-area:brand!important;align-items:center!important;gap:10px!important} .isf-fare-dock-brand-logo{width:42px!important;height:42px!important;box-shadow:0 0 0 1px rgba(173,238,255,.18)} .isf-fare-dock-brand-copy{justify-content:center!important} .isf-fare-dock-brand-copy strong{font-size:14px!important;line-height:1.16!important;white-space:nowrap!important} .isf-fare-dock-brand-kicker{display:none!important} .isf-fare-dock .isf-dock-connection{ margin-top:4px!important; gap:6px!important; font-size:10px!important; padding:2px 8px!important; border-radius:999px!important; background:rgba(255,255,255,.06)!important; width:max-content!important; } .isf-fare-dock .isf-dock-connection i{width:8px!important;height:8px!important;flex-basis:8px!important} .isf-fare-dock-label{ grid-area:label!important; align-items:flex-end!important; justify-content:center!important; text-align:right!important; gap:2px!important; padding-left:0!important; } .isf-fare-dock-label .isf-fare-dock-dot{display:none!important} .isf-fare-dock-label strong{font-size:13px!important;line-height:1.18!important;color:#dff5ff!important} .isf-fare-dock-label small{font-size:10px!important;line-height:1.2!important;color:#9fd7f1!important} .isf-fare-dock-price{ grid-area:price!important; justify-content:flex-end!important; align-items:flex-end!important; align-content:center!important; gap:2px 6px!important; text-align:right!important; } .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{ font-size:clamp(19px,2vw,29px)!important; line-height:1.08!important; letter-spacing:-.04em!important; } .isf-fare-dock-note{ grid-area:note!important; padding:0!important; border:0!important; font-size:11px!important; color:#cfe4ff!important; text-align:right!important; line-height:1.3!important; } .isf-fare-dock-action{grid-area:action!important;display:flex!important;align-items:center!important;justify-content:stretch!important} .isf-fare-dock-action #registerButton{ min-height:44px!important; height:44px!important; border-radius:12px!important; font-size:15px!important; font-weight:900!important; box-shadow:0 8px 18px rgba(70,214,255,.18)!important; } @media (max-width:760px){ .isf-fare-dock{border-radius:18px!important} .isf-fare-dock-inner{ grid-template-columns:minmax(0,1fr) auto!important; grid-template-areas:"brand label" "brand price" "action action"!important; gap:5px 10px!important; padding:10px 11px 11px!important; } .isf-fare-dock-brand{align-items:flex-start!important;gap:8px!important} .isf-fare-dock-brand-logo{width:34px!important;height:34px!important} .isf-fare-dock-brand-copy strong{font-size:12.5px!important;line-height:1.18!important} .isf-fare-dock .isf-dock-connection{font-size:9px!important;padding:2px 7px!important} .isf-fare-dock-label{align-items:flex-end!important;text-align:right!important} .isf-fare-dock-label strong{font-size:11px!important} .isf-fare-dock-label small{display:none!important} .isf-fare-dock-price{justify-content:flex-end!important;gap:0 4px!important} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(16px,4.8vw,22px)!important;line-height:1.1!important} .isf-fare-dock-note{display:none!important} .isf-fare-dock-action{margin-top:2px!important} .isf-fare-dock-action #registerButton{width:100%!important;min-height:43px!important;height:43px!important;font-size:15px!important} } @media (max-width:380px){ .isf-fare-dock-inner{padding:9px 10px 10px!important;gap:4px 8px!important} .isf-fare-dock-brand-logo{width:31px!important;height:31px!important} .isf-fare-dock-brand-copy strong{font-size:12px!important} .isf-fare-dock-price>span:first-child, .isf-fare-dock-price .isf-fare-dock-plus, .isf-fare-dock-price .isf-fare-dock-plus b{font-size:clamp(15px,4.6vw,19px)!important} } /* V136 · 출발지 정확한 주소 필수 안내 (우주형 팝업) */ .isf-origin-precise-dialog{ width:min(420px,calc(100vw - 28px));max-width:calc(100vw - 28px); padding:0;border:1px solid rgba(125,220,248,.7);border-radius:19px; background:linear-gradient(145deg,#102b53,#071a37);color:#ecf9ff; box-shadow:0 25px 75px rgba(0,5,25,.65),0 0 28px rgba(64,200,246,.15); } .isf-origin-precise-dialog::backdrop{background:rgba(1,8,25,.73);backdrop-filter:blur(6px)} .isf-origin-precise-card{padding:27px 23px 22px;text-align:center} .isf-origin-precise-icon{display:grid;place-items:center;margin:0 auto 12px;width:42px;height:42px; border-radius:50%;border:1px solid rgba(255,216,117,.7);color:#ffe1a0;background:rgba(255,195,65,.1); font-size:25px;font-weight:900} .isf-origin-precise-card h2{margin:0 0 10px;font-size:21px;color:#fff} .isf-origin-precise-card p{margin:0 0 10px;font-size:16px;font-weight:850;line-height:1.5;color:#ffe2b5;word-break:keep-all} .isf-origin-precise-card small{display:block;font-size:12px;line-height:1.7;color:#accce2;word-break:keep-all} .isf-origin-precise-card button{width:100%;min-height:44px;margin-top:18px;border:1px solid #adf2ff;border-radius:12px; background:linear-gradient(110deg,#75f0e4,#8cc7ff);color:#0b2850;font-size:14px;font-weight:900} @media(max-width:450px){.isf-origin-precise-card{padding:22px 18px 18px}.isf-origin-precise-card h2{font-size:19px}} /* V137 · Returning-member portal + original checkout link */ .site-head .isf-member-entry{white-space:nowrap} .topnav .isf-member-nav{color:#8dece9!important} .isf-member-reuse-banner{margin:0 0 18px;border:1px solid rgba(108,213,255,.54);border-radius:17px;background:linear-gradient(115deg,#112851,#163967);color:#e9faff;padding:18px;box-shadow:0 14px 30px rgba(0,0,0,.17)} .isf-member-reuse-banner[hidden]{display:none!important} .isf-member-reuse-banner strong{font-size:18px} .isf-member-reuse-banner p{margin:5px 0 12px;font-size:12px;color:#c5ddf3} .isf-member-reuse-addr{display:flex;align-items:center;gap:10px;justify-content:space-between;border-top:1px solid rgba(186,233,255,.16);padding:9px 0;font-size:12px} .isf-member-reuse-addr span{overflow-wrap:anywhere} .isf-member-reuse-addr button{flex:none;padding:8px 10px;border:1px solid #68d9ee;background:rgba(89,196,234,.13);color:#d6faff;border-radius:9px;font-weight:800} @media(max-width:760px){.topnav a:not(:first-child):not(.isf-member-nav){display:none!important}.topnav .isf-member-nav{display:flex!important}.isf-member-reuse-addr{align-items:flex-start;flex-direction:column}.site-head .isf-member-entry{display:none}} /* V155: member portal styles are maintained below (no separate patch stylesheet). */ /* V154: postcode multi-building results inside the existing address dialog. The official Kakao embedded iframe owns its own road/parcel result list. */ #insungAddressDialog .ia-postcode-panel{ padding:14px!important;border-radius:16px!important; background:#fff!important;color:#17324a!important; border:1px solid #d8e4ed!important;box-shadow:0 16px 32px rgba(0,14,33,.23)!important; } #insungAddressDialog .ia-postcode-panel-head strong{font-size:15px;color:#183650!important} #insungAddressDialog .ia-postcode-panel-head button{ color:#31516b!important;background:#edf4f8!important; border:1px solid #d0e0e9!important } #insungAddressDialog .ia-postcode-panel>p{ margin:9px 0 12px!important;color:#61778a!important; font-size:12px!important;line-height:1.65!important; } #insungAddressDialog .ia-postcode-embed{ height:min(610px,60dvh)!important;min-height:350px!important; overflow:hidden!important;background:#fff!important; border:1px solid #e2eaf1!important;border-radius:12px!important; } @media(max-width:600px){ #insungAddressDialog .ia-postcode-panel{padding:10px!important} #insungAddressDialog .ia-postcode-embed{height:min(570px,56dvh)!important;min-height:350px!important} #insungAddressDialog .ia-postcode-panel-head strong{font-size:13px} } /* ----------------------------------------------------------------------- V155 / Premium Customer Portal - white enterprise B2B interface Intentionally scoped to body.isf-member-page. No new CSS or JS asset. Insung lookup, permissions, form endpoints, and index UI are unchanged. ----------------------------------------------------------------------- */ body.isf-member-page{ --mp-ink:#172f4b;--mp-soft:#60738b;--mp-navy:#152e4c;--mp-blue:#237bb9; --mp-line:#e2e9f1;--mp-paper:#ffffff;--mp-canvas:#f4f7fb; margin:0;min-height:100vh;padding:0!important;overflow-x:hidden; background:var(--mp-canvas)!important;background-image:none!important; color:var(--mp-ink)!important;color-scheme:light; font:400 15px/1.65 'Pretendard Variable',Pretendard,'Noto Sans KR','Apple SD Gothic Neo',system-ui,sans-serif; -webkit-font-smoothing:antialiased;word-break:keep-all; } body.isf-member-page::before,body.isf-member-page::after{content:none!important;display:none!important} body.isf-member-page *,body.isf-member-page *::before,body.isf-member-page *::after{box-sizing:border-box} body.isf-member-page .isf-member-wrap{width:min(1100px,calc(100% - 40px));max-width:1100px;min-height:100vh;margin:0 auto;padding:24px 0 36px;background:transparent!important;background-image:none!important} body.isf-member-page a{color:inherit;text-decoration:none} body.isf-member-page button,body.isf-member-page input,body.isf-member-page select{font:inherit} body.isf-member-page button:focus-visible,body.isf-member-page a:focus-visible,body.isf-member-page input:focus-visible,body.isf-member-page summary:focus-visible{outline:3px solid #69b5eb;outline-offset:3px} body.isf-member-page .isf-member-head{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:86px;padding:15px 22px;border:1px solid var(--mp-line);border-radius:20px;background:#fff;box-shadow:0 9px 25px rgba(17,48,81,.035)} body.isf-member-page .isf-member-brand{display:flex;gap:14px;align-items:center;min-width:0} body.isf-member-page .isf-member-brand img{width:52px;height:52px;flex:0 0 52px;object-fit:cover;border-radius:50%;box-shadow:0 3px 10px rgba(26,60,100,.15)} body.isf-member-page .isf-member-brand span{display:block;min-width:0} body.isf-member-page .isf-member-brand strong{display:block;font-size:19px;line-height:1.35;color:var(--mp-ink);font-weight:850;letter-spacing:-.035em} body.isf-member-page .isf-member-brand small{display:block;margin-top:3px;font-size:10px;line-height:1.35;letter-spacing:.115em;color:#798aa0;font-weight:800} body.isf-member-page .isf-member-head nav{display:flex;align-items:center;gap:15px;flex-shrink:0} body.isf-member-page .isf-member-head nav form{margin:0} body.isf-member-page .isf-member-head-identity{color:#71839a;font-size:13px;font-weight:700} body.isf-member-page .isf-member-logout,body.isf-member-page .isf-member-head-link{display:inline-flex;align-items:center;justify-content:center;min-height:41px;padding:9px 14px;background:#f6f8fb;color:#294664;border:1px solid #dbe5ee;border-radius:11px;font-size:13px;font-weight:800;white-space:nowrap;cursor:pointer} body.isf-member-page .isf-member-logout:hover,body.isf-member-page .isf-member-head-link:hover{background:#eaf2f9} body.isf-member-page main{display:block;margin:18px 0 0} body.isf-member-page .isf-member-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:26px;padding:33px 38px;border-radius:23px;min-width:0;overflow:hidden} body.isf-member-page .isf-member-hero-logged{background:linear-gradient(108deg,#132a46 0%,#193e66 75%,#245481 100%);color:#fff;box-shadow:0 16px 33px rgba(18,52,90,.13)} body.isf-member-page .isf-member-hero-logged::after{content:'';position:absolute;right:-110px;top:-120px;width:385px;height:385px;border:1px solid rgba(255,255,255,.13);border-radius:50%;box-shadow:0 0 0 64px rgba(255,255,255,.032),0 0 0 130px rgba(255,255,255,.02);pointer-events:none} body.isf-member-page .isf-member-hero-guest{background:#fff;border:1px solid var(--mp-line);box-shadow:0 7px 28px rgba(18,48,82,.035)} body.isf-member-page .isf-member-hero-content{position:relative;z-index:1;min-width:0} body.isf-member-page .isf-member-eyebrow{display:inline-flex;align-items:center;gap:9px;letter-spacing:.145em;font-size:11px;line-height:1.6;font-weight:800;color:#abc7e0} body.isf-member-page .isf-member-hero-guest .isf-member-eyebrow{color:#557d9e} body.isf-member-page .isf-member-hero-dot{width:7px;height:7px;border-radius:50%;background:#78d0f0;box-shadow:0 0 0 5px rgba(120,208,240,.12)} body.isf-member-page .isf-member-hero h1{margin:10px 0 9px;color:#fff;font-size:clamp(25px,3.5vw,35px);font-weight:850;line-height:1.33;letter-spacing:-.055em} body.isf-member-page .isf-member-hero-guest h1{color:var(--mp-ink)} body.isf-member-page .isf-member-hero p{margin:0;max-width:610px;color:#d9e5f1;font-size:15px;line-height:1.75} body.isf-member-page .isf-member-hero-guest p{color:var(--mp-soft)} body.isf-member-page .isf-member-hero-cta{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:11px;flex:0 0 auto;min-height:53px;padding:12px 20px;border-radius:12px;background:#fff;color:#183957;font-weight:850;font-size:15px;white-space:nowrap;box-shadow:0 10px 20px rgba(0,0,0,.095);transition:transform .18s,box-shadow .18s} body.isf-member-page .isf-member-hero-cta:hover{transform:translateY(-2px);box-shadow:0 13px 20px rgba(0,0,0,.14)} body.isf-member-page .isf-member-cta-plus{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#e6f2fb;color:#2279b7;font-weight:900;font-size:19px;line-height:1} body.isf-member-page .isf-member-guest-symbol{display:grid;place-items:center;flex:0 0 90px;width:90px;height:90px;border-radius:24px;background:#eaf2fa;color:#3474a6;font-size:40px;font-weight:600} body.isf-member-page .isf-mobile-only{display:none} body.isf-member-page .isf-member-panel{margin:18px 0 0;padding:27px 29px;border:1px solid var(--mp-line);border-radius:22px;background:#fff!important;background-image:none!important;color:var(--mp-ink);box-shadow:0 7px 25px rgba(20,54,89,.035)} body.isf-member-page .isf-member-sectionhead{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 18px;margin-bottom:18px} body.isf-member-page .isf-member-kicker{display:block;margin-bottom:5px;font-size:11px;line-height:1.5;color:#4d83ab;font-weight:850;letter-spacing:.14em} body.isf-member-page .isf-member-panel h2{margin:0 0 5px;font-size:24px;line-height:1.38;letter-spacing:-.045em;color:var(--mp-ink);font-weight:850} body.isf-member-page .isf-member-panel p{margin:0;color:var(--mp-soft);font-size:14px;line-height:1.7} body.isf-member-page .isf-member-auth{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px;align-items:start} body.isf-member-page .isf-member-auth .isf-member-panel{margin:0;height:100%} body.isf-member-page .isf-member-auth form{display:grid;gap:15px;margin-top:23px} body.isf-member-page .isf-member-auth label{display:grid;gap:8px;min-width:0;color:#2d4864;font-size:14px;font-weight:750} body.isf-member-page input[type="tel"],body.isf-member-page input[type="password"],body.isf-member-page input[name="name"],body.isf-member-page input[type="date"],body.isf-member-page input[type="month"]{ display:block;width:100%;min-width:0;min-height:48px;padding:11px 13px;border:1px solid #d3dee9;border-radius:11px;background:#fff;color:#192f49;font-size:15px;line-height:1.4;box-shadow:none} body.isf-member-page input::placeholder{color:#97a6b6;font-size:14px} body.isf-member-page input:focus{border-color:#2a83bf;box-shadow:0 0 0 3px rgba(36,126,190,.13);outline:0} body.isf-member-page .isf-member-primary,body.isf-member-page .isf-member-secondary{ display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:49px;padding:11px 17px;border-radius:11px;border:1px solid #237dbd;background:linear-gradient(105deg,#1d68a3,#2688c8);color:#fff!important;box-shadow:0 7px 14px rgba(36,116,178,.13);font-weight:850;font-size:15px;text-decoration:none;cursor:pointer} body.isf-member-page .isf-member-secondary{background:#eef6fc;border-color:#c6ddea;color:#21658f!important;box-shadow:none} body.isf-member-page .isf-member-primary:hover{background:#185c98} body.isf-member-page .isf-member-secondary:hover{background:#e3f0fa} body.isf-member-page .isf-member-auth button span{margin-left:auto;font-size:18px} body.isf-member-page .isf-member-privacy{grid-template-columns:20px minmax(0,1fr)!important;align-items:start;gap:10px!important;color:#5f7288!important;font-size:12px!important;font-weight:500!important;line-height:1.6} body.isf-member-page .isf-member-privacy input{width:18px;height:18px;min-height:18px;margin:3px 0 0;padding:0;accent-color:#287eb7} body.isf-member-page .isf-member-help{margin-top:15px!important;padding-top:15px;border-top:1px solid #e8edf4;color:#7b8ca0!important;font-size:12px!important} body.isf-member-page .isf-member-alert,body.isf-member-page .isf-member-success,body.isf-member-page .isf-member-empty{margin:16px 0 0;padding:17px 18px;border:1px solid #dce5ef;border-radius:13px;background:#f7f9fc;color:#526c83;font-size:14px;line-height:1.75} body.isf-member-page .isf-member-alert{border-color:#eec9c9;background:#fff5f5;color:#a63232} body.isf-member-page .isf-member-success{border-color:#b7e6d1;background:#f2fbf7;color:#216b4b} body.isf-member-page .isf-member-pending{flex:0 0 auto;display:inline-flex;padding:7px 12px;border-radius:99px;border:1px solid #f0dba9;background:#fff9eb;color:#95621b;font-weight:800;font-size:12px} body.isf-member-page .isf-member-live-label{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;border:1px solid #d9e9ef;border-radius:99px;padding:7px 12px;background:#f2f9fc;color:#2e718e;font-size:12px;font-weight:800} body.isf-member-page .isf-member-live-label span{width:7px;height:7px;background:#29a5a2;border-radius:50%} body.isf-member-page .isf-live-pills{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:6px 0 13px} body.isf-member-page .isf-live-pills a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:45px;padding:10px 7px;border:1px solid #d9e4ed;border-radius:11px;background:#f5f8fb;color:#526d85;font-size:14px;line-height:1.45;font-weight:800;white-space:nowrap;transition:background .15s,border-color .15s} body.isf-member-page .isf-live-pills a:hover{border-color:#95bad7;background:#ebf4fb} body.isf-member-page .isf-live-pills a[aria-current=page]{background:#247cb9;border-color:#247cb9;color:#fff;box-shadow:0 5px 11px rgba(36,124,185,.13)} body.isf-member-page .isf-live-advanced{margin:0 0 15px;border:1px solid #e2eaf1;border-radius:12px;background:#fff;overflow:hidden} body.isf-member-page .isf-live-advanced>summary{list-style:none;display:flex;align-items:center;gap:9px;padding:11px 14px;color:#3b6687;font-weight:750;font-size:13px;cursor:pointer;min-height:42px} body.isf-member-page .isf-live-advanced>summary::-webkit-details-marker{display:none} body.isf-member-page .isf-live-advanced-chevron{margin-left:auto;transition:transform .2s;font-size:16px} body.isf-member-page .isf-live-advanced[open] .isf-live-advanced-chevron{transform:rotate(180deg)} body.isf-member-page .isf-live-custom{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto;align-items:end;gap:12px;padding:16px;border-top:1px solid #e8edf3;margin:0} body.isf-member-page .isf-live-custom label,body.isf-member-page .isf-member-month label{display:grid;gap:6px;min-width:0;margin:0;color:#47617a;font-size:13px;font-weight:750} body.isf-member-page .isf-live-custom button,body.isf-member-page .isf-member-month button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 19px;border:0;border-radius:11px;background:#247cb9;color:#fff;font-weight:800;font-size:14px;white-space:nowrap;cursor:pointer} body.isf-member-page .isf-member-month{display:flex;flex-wrap:wrap;align-items:end;gap:10px;margin:15px 0} body.isf-member-page .isf-member-month label{max-width:260px;flex:1 1 210px} body.isf-member-page .isf-member-resultbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px 23px;margin:18px 0 18px;padding:13px 17px;background:#f3f7fb;border-radius:11px;border:1px solid #e5ecf4;color:#728399;font-size:13px;line-height:1.65} body.isf-member-page .isf-member-resultbar strong{margin-left:6px;font-weight:850;color:#294965} body.isf-member-page .isf-member-orders{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;margin:13px 0 0} body.isf-member-page .isf-order-row{min-width:0;border:1px solid #dfe7ee;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 3px 12px rgba(22,55,91,.025);transition:border-color .15s,box-shadow .15s} body.isf-member-page .isf-order-row:hover{border-color:#bbd2e5;box-shadow:0 8px 18px rgba(23,70,108,.055)} body.isf-member-page .isf-order-row[open]{border-color:#9bc5e4} body.isf-member-page .isf-order-row>summary{list-style:none;display:grid;grid-template-columns:148px minmax(150px,1fr) minmax(90px,132px) minmax(124px,165px) 82px;gap:14px;align-items:center;min-height:98px;padding:18px 20px;cursor:pointer} body.isf-member-page .isf-order-row>summary::-webkit-details-marker{display:none} body.isf-member-page .isf-order-summary-meta{display:flex;flex-direction:column;gap:3px;min-width:0} body.isf-member-page .isf-order-summary-meta time{color:#718398;font-weight:650;font-size:12px;line-height:1.5;font-variant-numeric:tabular-nums} body.isf-member-page .isf-order-summary-meta strong{color:#213c59;font-weight:850;font-size:17px;font-variant-numeric:tabular-nums;line-height:1.35} body.isf-member-page .isf-order-summary-route{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-end;gap:16px;min-width:0;max-width:100%} body.isf-member-page .isf-order-place{display:flex;flex:0 1 auto;width:max-content;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:0;max-width:calc(50% - 28px);gap:5px} body.isf-member-page .isf-order-summary-route .isf-order-place:first-child{align-items:flex-start;text-align:left} body.isf-member-page .isf-order-summary-route .isf-order-place:first-child strong{text-align:left} body.isf-member-page .isf-order-place small{color:#8494a6;font-size:11px;font-weight:750;line-height:1.4} body.isf-member-page .isf-order-place strong{display:block;min-width:0;max-width:100%;white-space:normal;word-break:keep-all;overflow-wrap:anywhere;color:#1c3854;font-size:17px;font-weight:850;letter-spacing:-.035em;line-height:1.45} body.isf-member-page .isf-order-route-arrow{display:inline-flex;flex:0 0 22px;justify-content:center;align-items:center;align-self:flex-end;min-width:22px;color:#2c83bb;font-size:20px;font-weight:850;line-height:1;transform:none;padding:0 0 4px} body.isf-member-page .isf-order-summary-car{display:inline-flex;align-items:center;justify-self:start;min-width:0;max-width:100%;border:1px solid #dbe8f1;padding:7px 9px;border-radius:9px;background:#f3f8fc;color:#385b7a;font-size:13px;font-weight:750;line-height:1.5;overflow-wrap:anywhere} body.isf-member-page .isf-order-summary-price{display:flex;flex-direction:column;align-items:flex-end;min-width:0;gap:3px;white-space:nowrap} body.isf-member-page .isf-order-summary-price small{color:#8496a7;font-size:11px;line-height:1.5} body.isf-member-page .isf-order-summary-price strong{color:#176fae;font-weight:850;font-size:23px;letter-spacing:-.045em;line-height:1.3;font-variant-numeric:tabular-nums} body.isf-member-page .isf-order-summary-toggle{display:inline-flex;align-items:center;justify-self:end;justify-content:center;gap:4px;min-height:34px;padding:6px 9px;border:1px solid #e3eaf2;background:#f4f7fb;border-radius:9px;color:#3b5872;font-size:11.5px;font-weight:800;white-space:nowrap;transition:background .18s,border-color .18s} body.isf-member-page .isf-order-summary-toggle span{display:inline-block;transition:transform .2s;font-size:13px} body.isf-member-page .isf-order-row[open] .isf-order-summary-toggle{background:#e3f1fb;color:#1a6d9f} body.isf-member-page .isf-order-row[open] .isf-order-summary-toggle span{transform:rotate(180deg)} body.isf-member-page .isf-order-detail{padding:20px;border-top:1px solid #e5edf4;background:#fafcfe} body.isf-member-page .isf-order-detail-heading{display:flex;justify-content:space-between;gap:10px;margin-bottom:12px;align-items:center} body.isf-member-page .isf-order-detail-heading strong{font-size:15px;color:#193956;font-weight:850} body.isf-member-page .isf-order-detail-heading span{font-size:12px;color:#8b9aac} body.isf-member-page .isf-order-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0} body.isf-member-page .isf-order-detail-grid>div{min-width:0;padding:12px 14px;border:1px solid #e6edf3;border-radius:9px;background:#fff} body.isf-member-page .isf-order-detail-grid dt{margin:0 0 5px;color:#8796a6;font-size:12px;font-weight:750} body.isf-member-page .isf-order-detail-grid dd{margin:0;color:#26425e;font-size:14px;font-weight:650;overflow-wrap:anywhere;word-break:break-word;line-height:1.65} body.isf-member-page .isf-order-detail-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:15px;padding-top:15px;border-top:1px solid #e2eaf1} body.isf-member-page .isf-order-detail-actions p{flex:1 1 240px;min-width:0;color:#61788e;font-size:12px;line-height:1.6} body.isf-member-page .isf-order-detail-actions form:has(.isf-order-rebook-card){flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:center;gap:13px} body.isf-member-page .isf-order-rebook-card{width:100%;border:1px solid #d7e5f1;border-radius:16px;padding:17px 19px;background:linear-gradient(125deg,#f5faff,#fff);display:grid;gap:13px} body.isf-member-page .isf-order-rebook-title{display:flex;gap:12px;align-items:center;color:#193d5a} body.isf-member-page .isf-order-rebook-mark{width:37px;height:37px;display:grid;place-items:center;flex:none;border-radius:11px;background:#e7f1f9;color:#286e9b;font-size:20px} body.isf-member-page .isf-order-rebook-title div{display:grid;gap:4px} body.isf-member-page .isf-order-rebook-title strong{font-size:16px;font-weight:850;letter-spacing:-.035em} body.isf-member-page .isf-order-rebook-title small{font-size:12px;line-height:1.55;color:#6e8396} body.isf-member-page .isf-order-rebook-quick{display:flex;flex-wrap:wrap;gap:8px} body.isf-member-page .isf-order-rebook-quick button{width:auto!important;border:1px solid #cddfeb;border-radius:999px;padding:8px 15px;min-height:36px;background:#fff;color:#245776;font-weight:750;font-size:13px;cursor:pointer} body.isf-member-page .isf-order-rebook-quick button:hover,body.isf-member-page .isf-order-rebook-quick button:focus-visible{border-color:#77a9d0;background:#eaf4fc} body.isf-member-page .isf-order-rebook-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} body.isf-member-page .isf-order-rebook-inputs label{display:grid;gap:7px;min-width:0;color:#3c607b;font-weight:800;font-size:13px} body.isf-member-page .isf-order-rebook-inputs input{width:100%;min-width:0;min-height:52px;padding:11px 14px;border:1px solid #cbddea;border-radius:12px;background:#fff;color:#173d59;font-size:16px;letter-spacing:0;box-shadow:0 2px 7px rgba(24,70,100,.025);color-scheme:light} body.isf-member-page .isf-order-rebook-inputs input:focus{border-color:#367eb4;outline:3px solid rgba(47,119,175,.15)} @media(max-width:480px){body.isf-member-page .isf-order-rebook-card{padding:15px 13px}body.isf-member-page .isf-order-rebook-inputs{grid-template-columns:minmax(0,1fr)}body.isf-member-page .isf-order-rebook-title strong{font-size:15px}} body.isf-member-page .isf-order-detail-actions form{margin:0} body.isf-member-page .isf-order-detail-actions button{min-height:43px;padding:10px 16px;background:#246fa6;color:#fff;border:0;border-radius:10px;font-size:13px;font-weight:800;cursor:pointer} body.isf-member-page .isf-order-lock{display:inline-flex;align-items:center;min-height:41px;padding:9px 13px;border-radius:9px;background:#ebf0f5;color:#5c7288;font-size:12px;font-weight:750} body.isf-member-page .isf-live-pages{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin:20px 0 5px} body.isf-member-page .isf-live-pages a{display:inline-flex;min-height:41px;align-items:center;padding:8px 14px;border-radius:10px;border:1px solid #d5e5f1;background:#f7faff;color:#2d6e9e;font-size:13px;font-weight:800} body.isf-member-page .isf-live-pages span{color:#7b8ea1;font-size:13px} body.isf-member-page .isf-member-hint{margin-top:17px!important;padding:11px 0 0;border-top:1px solid #e8eef4;color:#8796a5!important;font-size:12px!important;line-height:1.7} body.isf-member-page .isf-member-reorder-help{margin-top:17px;border:1px solid #e3ebf2;border-radius:14px;background:#fff;overflow:hidden} body.isf-member-page .isf-member-reorder-help>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;cursor:pointer;list-style:none;color:#476680;font-size:14px;font-weight:750} body.isf-member-page .isf-member-reorder-help>summary::-webkit-details-marker{display:none} body.isf-member-page .isf-member-reorder-help>summary span{transition:transform .2s} body.isf-member-page .isf-member-reorder-help[open]>summary span{transform:rotate(180deg)} body.isf-member-page .isf-member-reorder-help p{margin:0;padding:0 20px 18px;font-size:13px;line-height:1.8;color:#60778a} body.isf-member-page .isf-member-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;border-top:1px solid #dee7f0;margin-top:27px;padding:21px 5px 0;color:#95a2b2;font-size:12px} body.isf-member-page .isf-member-footer span:first-child{font-weight:750;color:#6e859c} @media (max-width:1020px){ body.isf-member-page .isf-order-row>summary{grid-template-columns:130px minmax(0,1fr) minmax(75px,120px) minmax(115px,155px);gap:10px} body.isf-member-page .isf-order-summary-toggle{grid-column:4;justify-self:end;grid-row:2} body.isf-member-page .isf-order-summary-price{grid-column:4;grid-row:1} body.isf-member-page .isf-order-summary-car{grid-column:3;grid-row:1} } @media (max-width:760px){ body.isf-member-page{font-size:15px} body.isf-member-page .isf-member-wrap{width:calc(100% - 24px);padding:12px 0 28px} body.isf-member-page .isf-member-head{min-height:77px;padding:12px 14px;border-radius:16px;gap:8px} body.isf-member-page .isf-member-brand{gap:10px} body.isf-member-page .isf-member-brand img{width:43px;height:43px;flex-basis:43px} body.isf-member-page .isf-member-brand strong{font-size:16px} body.isf-member-page .isf-member-brand small{font-size:9px;letter-spacing:.045em} body.isf-member-page .isf-member-head-identity{display:none} body.isf-member-page .isf-member-logout,body.isf-member-page .isf-member-head-link{min-height:38px;font-size:12px;padding:8px 10px} body.isf-member-page main{margin-top:13px} body.isf-member-page .isf-member-hero{padding:26px 23px;border-radius:18px;flex-wrap:wrap;gap:19px} body.isf-member-page .isf-member-hero h1{font-size:26px;line-height:1.38;margin:9px 0 8px} body.isf-member-page .isf-member-hero p{font-size:14px;line-height:1.7} body.isf-member-page .isf-member-hero-cta{width:100%;min-height:49px;justify-content:center} body.isf-member-page .isf-member-eyebrow{font-size:10px;letter-spacing:.08em} body.isf-member-page .isf-member-guest-symbol{display:none} body.isf-member-page .isf-member-panel{padding:20px 17px;margin-top:13px;border-radius:18px} body.isf-member-page .isf-member-panel h2{font-size:21px} body.isf-member-page .isf-member-panel p{font-size:13px} body.isf-member-page .isf-member-auth{grid-template-columns:minmax(0,1fr);gap:13px;margin-top:13px} body.isf-member-page .isf-live-pills{gap:8px;margin:2px 0 12px} body.isf-member-page .isf-live-pills a{min-height:43px;padding:8px 4px;font-size:12px} body.isf-member-page .isf-member-resultbar{gap:5px 14px;padding:11px 12px;font-size:12px} body.isf-member-page .isf-order-row>summary{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto;gap:15px 10px;padding:17px 16px;min-height:0} body.isf-member-page .isf-order-summary-meta{grid-column:1;grid-row:1;display:flex;flex-wrap:wrap;flex-direction:row;align-items:baseline;gap:7px} body.isf-member-page .isf-order-summary-meta time{font-size:12px} body.isf-member-page .isf-order-summary-meta strong{font-size:14px} body.isf-member-page .isf-order-summary-toggle{grid-column:2;grid-row:1;justify-self:end;font-size:11px;min-height:32px;padding:5px 8px} body.isf-member-page .isf-order-summary-route{grid-column:1/-1;grid-row:2;gap:12px;padding:2px 0 5px;align-items:flex-end} body.isf-member-page .isf-order-place strong{font-size:19px;line-height:1.42} body.isf-member-page .isf-order-place small{font-size:11px} body.isf-member-page .isf-order-route-arrow{flex-basis:22px;min-width:22px;font-size:20px;line-height:1;transform:none;padding-bottom:5px} body.isf-member-page .isf-order-summary-car{grid-column:1;grid-row:3;font-size:12px} body.isf-member-page .isf-order-summary-price{grid-column:2;grid-row:3;justify-self:end} body.isf-member-page .isf-order-summary-price strong{font-size:24px;line-height:1.22} body.isf-member-page .isf-order-summary-price small{font-size:11px} body.isf-member-page .isf-order-detail{padding:16px 13px} body.isf-member-page .isf-order-detail-grid{grid-template-columns:minmax(0,1fr)} body.isf-member-page .isf-order-detail-actions{align-items:stretch} body.isf-member-page .isf-order-detail-actions form,body.isf-member-page .isf-order-detail-actions button{width:100%} body.isf-member-page .isf-member-footer{font-size:11px} } @media (max-width:480px){ body.isf-member-page .isf-member-hero{padding:24px 19px} body.isf-member-page .isf-member-hero h1{font-size:25px} body.isf-member-page .isf-mobile-only{display:inline} body.isf-member-page .isf-desktop-only{display:none} body.isf-member-page .isf-member-brand small{max-width:180px} body.isf-member-page .isf-member-panel{padding:19px 15px} body.isf-member-page .isf-live-custom{grid-template-columns:minmax(0,1fr);gap:11px;padding:12px} body.isf-member-page .isf-live-custom button{width:100%} body.isf-member-page .isf-live-pills a{font-size:11px;letter-spacing:-.04em} body.isf-member-page .isf-member-resultbar{flex-direction:column;align-items:flex-start;gap:2px} body.isf-member-page .isf-order-place strong{font-size:17.5px;line-height:1.45} } @media (prefers-reduced-motion:reduce){ body.isf-member-page *,body.isf-member-page *::before,body.isf-member-page *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important} } @media (max-width:350px){ body.isf-member-page .isf-live-pills{grid-template-columns:repeat(2,minmax(0,1fr))} body.isf-member-page .isf-live-pills a{font-size:13px} } /* V159 · enterprise member greeting; deliberately scoped to the signed-in hero. */ body.isf-member-page .isf-member-hero-logged .isf-member-premium-title{ display:flex;flex-direction:column;align-items:flex-start;gap:5px; margin:17px 0 14px;line-height:1.23;letter-spacing:-.045em } body.isf-member-page .isf-member-customer-line{ display:flex;align-items:baseline;flex-wrap:wrap;column-gap:13px;row-gap:6px; max-width:100%;min-width:0 } body.isf-member-page .isf-member-customer-name{ color:#fff;font-size:clamp(29px,3.5vw,39px);font-weight:900; letter-spacing:-.06em;overflow-wrap:anywhere;word-break:keep-all; text-shadow:0 2px 18px rgba(8,25,44,.28),0 1px 0 rgba(255,255,255,.08); background:linear-gradient(180deg,#fffaf0 0%,#fff 28%,#f6deb0 62%,#f3c979 100%); -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent } body.isf-member-page .isf-member-customer-tag{ display:inline-flex;align-items:center;flex:none;padding:5px 10px 6px; border:1px solid rgba(255,255,255,.28);border-radius:999px; background:rgba(255,255,255,.08);color:#ffffff; box-shadow:inset 0 1px 0 rgba(255,255,255,.12); font-size:clamp(13px,1.7vw,15px);font-weight:800; letter-spacing:-.015em;line-height:1.3;white-space:nowrap } body.isf-member-page .isf-member-greeting{ display:block;color:#e8f1fa;font-size:clamp(26px,3.2vw,34px); font-weight:760;letter-spacing:-.053em } body.isf-member-page .isf-member-greeting-dot{color:#e9c98d} @media(max-width:760px){ body.isf-member-page .isf-member-hero-logged .isf-member-premium-title{margin:14px 0 13px;gap:7px} body.isf-member-page .isf-member-customer-name{font-size:clamp(25px,7vw,32px)} body.isf-member-page .isf-member-customer-tag{font-size:12px;padding:5px 8px} body.isf-member-page .isf-member-greeting{font-size:clamp(25px,6.4vw,29px)} } @media(max-width:350px){ body.isf-member-page .isf-member-customer-line{column-gap:9px} body.isf-member-page .isf-member-customer-name{font-size:25px} } /* V161 · Company member read-only live statistics. Existing form and admin CSS untouched. */ body.isf-member-page .isf-member-stats-link-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:17px 0 4px} body.isf-member-page .isf-member-stats-link{display:inline-flex;align-items:center;gap:11px;padding:10px 16px;min-height:43px;border-radius:10px;background:#173a5d;color:#fff;font-size:13px;font-weight:850;letter-spacing:-.02em;box-shadow:0 6px 14px rgba(16,61,100,.08)} body.isf-member-page .isf-member-stats-link:hover{background:#225684} body.isf-member-page .isf-member-stats-link-row>span{color:#7d8da0;font-size:12px} body.isf-stats-page .isf-stats-hero{background:linear-gradient(112deg,#162f4d,#25547c);padding:36px 38px;border-radius:22px;color:#fff} body.isf-stats-page .isf-stats-hero .isf-member-kicker{color:#b5cfe5;letter-spacing:.14em;font-size:11px} body.isf-stats-page .isf-stats-hero h1{font-size:clamp(24px,3.2vw,34px);line-height:1.4;color:#fff;margin:8px 0;font-weight:850;letter-spacing:-.055em} body.isf-stats-page .isf-stats-hero p{font-size:14px;line-height:1.8;color:#dae6f1;max-width:680px;margin:0} body.isf-stats-page .isf-stats-control{margin-top:16px} body.isf-stats-page .isf-stats-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-top:18px;padding-top:15px;border-top:1px solid #e2ebf2} body.isf-stats-page .isf-stats-range{display:flex;flex-wrap:wrap;gap:5px 10px;align-items:center;color:#7a8ea2;font-size:13px} body.isf-stats-page .isf-stats-range strong{color:#253f5e;font-weight:850;font-variant-numeric:tabular-nums} body.isf-stats-page #isf-stats-load{width:auto;padding:11px 19px;margin:0;min-height:44px;cursor:pointer} body.isf-stats-page button:disabled{opacity:.58;cursor:wait} body.isf-stats-page .isf-stats-results{margin-top:16px} body.isf-stats-page .isf-stats-progress{padding:14px 16px;border-radius:11px;background:#f2f7fb;border:1px solid #e0ebf4;color:#3c617e;font-size:13px;line-height:1.75;margin:16px 0} body.isf-stats-page .isf-stats-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:15px 0 22px} body.isf-stats-page .isf-stats-kpis>div{display:flex;flex-direction:column;gap:7px;padding:22px;border:1px solid #e1eaf1;border-radius:14px;background:#fff;min-width:0} body.isf-stats-page .isf-stats-kpis span{font-size:13px;color:#697e92;font-weight:750} body.isf-stats-page .isf-stats-kpis strong{font-size:clamp(21px,2.7vw,28px);font-variant-numeric:tabular-nums;letter-spacing:-.045em;color:#1b527d;word-break:break-word;font-weight:850;line-height:1.3} body.isf-stats-page .isf-stats-kpis small{font-size:11px;color:#8494a4;line-height:1.5} body.isf-stats-page .isf-stats-panels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:15px} body.isf-stats-page .isf-stats-block{border:1px solid #e0eaf2;padding:22px;border-radius:14px;min-width:0;background:#fff} body.isf-stats-page .isf-stats-block h3{font-size:17px;font-weight:850;color:#223f5c;letter-spacing:-.035em;margin:0 0 5px} body.isf-stats-page .isf-stats-block>p{font-size:12px;color:#7c8b9d;line-height:1.6;margin:0 0 18px} body.isf-stats-page .isf-stats-bars{display:grid;gap:15px} body.isf-stats-page .isf-stats-placeholder{font-size:13px;color:#8798ab;line-height:1.7} body.isf-stats-page .isf-stats-bar-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:12px;line-height:1.5;margin-bottom:7px} body.isf-stats-page .isf-stats-bar-head strong{font-weight:800;color:#2d4965;overflow-wrap:anywhere} body.isf-stats-page .isf-stats-bar-head span{color:#7e91a3;text-align:right;white-space:nowrap} body.isf-stats-page .isf-stats-meter{height:8px;background:#edf3f8;border-radius:20px;overflow:hidden} body.isf-stats-page .isf-stats-meter>span{display:block;height:100%;background:linear-gradient(90deg,#237db7,#48a1d4);border-radius:20px} body.isf-stats-page .isf-stats-foot{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding-top:16px;margin-top:18px;border-top:1px solid #e6ecf2} body.isf-stats-page .isf-stats-foot p{flex:1 1 200px;line-height:1.75;font-size:12px;color:#71869a;margin:0} body.isf-stats-page .isf-stats-back{display:inline-flex;align-items:center;justify-content:center;border:1px solid #ccdfec;background:#f2f8fc;border-radius:10px;color:#2b6691;padding:10px 15px;min-height:40px;font-size:13px;font-weight:800;cursor:pointer} body.isf-stats-page .isf-stats-back[hidden]{display:none} @media(max-width:760px){ body.isf-stats-page .isf-stats-hero{padding:27px 22px;border-radius:18px} body.isf-stats-page .isf-stats-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} body.isf-stats-page .isf-stats-kpis>div{padding:16px;gap:5px} body.isf-stats-page .isf-stats-kpis>div:nth-child(2){grid-column:2;grid-row:1} body.isf-stats-page .isf-stats-kpis>div:nth-child(3){grid-column:1/-1} body.isf-stats-page .isf-stats-kpis strong{font-size:clamp(18px,4.4vw,25px)} body.isf-stats-page .isf-stats-panels{grid-template-columns:minmax(0,1fr)} body.isf-stats-page .isf-stats-block{padding:16px} body.isf-stats-page .isf-stats-actions{align-items:stretch} body.isf-stats-page .isf-stats-actions #isf-stats-load{width:100%} body.isf-member-page .isf-member-stats-link-row{align-items:flex-start;gap:7px} } /* V162 - member-only vehicle verification and export actions. */ body.isf-member-page .isf-member-export-link{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:43px;padding:10px 16px;border:1px solid #cddde9;border-radius:10px;background:#fff;color:#1d4b70;font-size:13px;font-weight:800;text-decoration:none} body.isf-member-page .isf-member-export-link:hover{background:#f0f7fc;border-color:#95b5ce} body.isf-member-page .isf-vehicle-verify{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;padding:12px 0 0;margin-top:4px;border-top:1px solid #e9eff5} body.isf-member-page .isf-vehicle-check{cursor:pointer;border:1px solid #b8d2e5;color:#164e7c;background:#f2f8fc;min-height:39px;border-radius:9px;padding:8px 13px;font-size:12px;font-weight:800} body.isf-member-page .isf-vehicle-check:disabled{opacity:.75;cursor:default} body.isf-member-page .isf-vehicle-message{font-size:12px;color:#61788e;line-height:1.6} /* V163: read-only order status refresh, integrated into the existing member CSS. */ body.isf-member-page .isf-delivery-verify{display:flex;align-items:center;flex-wrap:wrap;gap:9px 14px;padding:12px 0 4px;margin:8px 0 0;border-top:1px solid #e7eef5} body.isf-member-page .isf-delivery-check{min-height:39px;cursor:pointer;border:1px solid #accfe6;border-radius:9px;padding:8px 13px;background:#eef7fd;color:#164a72;font-size:12px;font-weight:800;line-height:1.5} body.isf-member-page .isf-delivery-check:hover{border-color:#6ba6d2;background:#e6f3fc} body.isf-member-page .isf-delivery-check:focus-visible{outline:3px solid #79b5de;outline-offset:3px} body.isf-member-page .isf-delivery-check:disabled{opacity:.7;cursor:wait} body.isf-member-page .isf-delivery-message{font-size:12px;color:#60788d;line-height:1.7;overflow-wrap:anywhere} @media(max-width:410px){body.isf-member-page .isf-delivery-check{width:100%}} body.isf-member-page .isf-export-layout{display:grid;gap:17px} body.isf-member-page .isf-export-status{margin:8px 0;padding:13px 15px;background:#f3f8fc;border:1px solid #dcebf4;border-radius:11px;color:#385e7e;font-size:14px;line-height:1.7} body.isf-member-page .isf-export-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center} body.isf-member-page .isf-export-controls button{min-height:45px;padding:10px 16px;border-radius:10px;border:1px solid #1c557e;background:#17456e;color:white;font-size:14px;font-weight:800;cursor:pointer} body.isf-member-page .isf-export-controls button:disabled{opacity:.55;cursor:not-allowed} body.isf-member-page .isf-export-controls button.isf-export-download{background:#fff;color:#17456e;border-color:#b0cadb} body.isf-member-page .isf-export-note{font-size:13px;color:#5e7388;line-height:1.8} @media(max-width:540px){body.isf-member-page .isf-member-export-link{width:100%}body.isf-member-page .isf-export-controls button{width:100%}} /* V165: customer export verification details (integrated; no extra stylesheet) */ body.isf-member-page .isf-export-controls button.isf-export-cancel{background:#fff;border-color:#c2d0dc;color:#506c82} body.isf-member-page .isf-export-controls button[hidden]{display:none} body.isf-member-page .isf-export-coverage{background:#fff9ed;border:1px solid #ead7b4;border-left:4px solid #c49148;border-radius:10px;padding:14px 16px;margin:0;font-size:13px;line-height:1.8;color:#735326} body.isf-member-page .isf-export-coverage[hidden]{display:none} body.isf-member-page .isf-export-month-report{border:1px solid #e2ebf3;background:#fff;border-radius:14px;padding:17px;margin-top:2px} body.isf-member-page .isf-export-month-report[hidden]{display:none} body.isf-member-page .isf-export-month-report h3{font-size:16px;line-height:1.4;letter-spacing:-.02em;color:#203d59;margin:0 0 13px;font-weight:850} body.isf-member-page .isf-export-months{display:grid;gap:8px} body.isf-member-page .isf-export-month-line{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;background:#f4f7fb;border:1px solid #e7edf3;font-size:13px;color:#506b84} body.isf-member-page .isf-export-month-line strong{font-size:15px;font-weight:850;color:#1c527c;white-space:nowrap} body.isf-member-page .isf-export-month-line small{font-size:11px;font-weight:750;color:#547992;white-space:nowrap} body.isf-member-page .isf-export-month-line .isf-export-month-unknown{color:#916a34} @media(max-width:540px){body.isf-member-page .isf-export-month-line{grid-template-columns:minmax(0,1fr) auto;gap:5px 8px}body.isf-member-page .isf-export-month-line small{grid-column:1/-1}} /* V166: customer-only read-only printable order lookup confirmation (not an official POD). */ body.isf-member-page .isf-receipt-request{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;padding:10px 0 12px;margin:0;border-bottom:1px solid #e6edf4} body.isf-member-page .isf-receipt-open{min-height:41px;background:#17466c;border:1px solid #17466c;color:#fff;font-family:inherit;font-size:13px;font-weight:800;line-height:1.5;padding:9px 15px;border-radius:10px;cursor:pointer} body.isf-member-page .isf-receipt-open:hover{background:#235d89} body.isf-member-page .isf-receipt-open:focus-visible{outline:3px solid #80bce7;outline-offset:3px} body.isf-member-page .isf-receipt-caption{font-size:12px;line-height:1.6;color:#7a8b9d} @media(max-width:410px){body.isf-member-page .isf-receipt-open{width:100%}} body.isf-receipt-page{margin:0;min-width:0;background:#edf3f8;color:#1b334b;font-family:system-ui,-apple-system,'Malgun Gothic',sans-serif;font-size:14px;line-height:1.65} body.isf-receipt-page *{box-sizing:border-box} body.isf-receipt-page .isf-receipt-sheet{max-width:800px;margin:35px auto 100px;padding:38px 44px;background:#fff;box-shadow:0 12px 50px rgba(20,54,82,.11);border:1px solid #dce7ef;border-radius:18px} body.isf-receipt-page .isf-receipt-header{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-bottom:25px;border-bottom:1px solid #e0e8ef} body.isf-receipt-page .isf-receipt-brand{display:flex;align-items:center;gap:12px;min-width:0} body.isf-receipt-page .isf-receipt-brand strong{font-size:18px;letter-spacing:-.035em;overflow-wrap:anywhere} body.isf-receipt-page .isf-receipt-emblem{font-size:10px;letter-spacing:.09em;font-weight:900;color:white;background:#173c61;padding:11px 9px;border-radius:9px} body.isf-receipt-page .isf-receipt-header p{font-size:12px;color:#7d8d9c;text-align:right;margin:0} body.isf-receipt-page .isf-receipt-heading{padding:30px 0} body.isf-receipt-page .isf-receipt-kicker{font-size:11px;font-weight:800;letter-spacing:.14em;color:#3281b0;margin:0 0 7px} body.isf-receipt-page .isf-receipt-heading h1{font-size:clamp(28px,4vw,35px);font-weight:850;letter-spacing:-.055em;color:#162f4c;line-height:1.3;margin:0 0 7px} body.isf-receipt-page .isf-receipt-heading>p:not(.isf-receipt-kicker){color:#60768a;margin:0 0 15px} body.isf-receipt-page .isf-receipt-label{display:inline-block;border:1px solid #d9e3ed;color:#4e6b82;font-size:12px;font-weight:750;padding:5px 11px;background:#f3f7fa;border-radius:20px} body.isf-receipt-page .isf-receipt-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:#173b60;border-radius:14px;padding:22px;gap:20px 25px;color:#fff} body.isf-receipt-page .isf-receipt-summary>div{display:grid;gap:3px;min-width:0} body.isf-receipt-page .isf-receipt-summary span{font-size:12px;color:#bacfe0} body.isf-receipt-page .isf-receipt-summary strong{font-size:16px;font-weight:800;overflow-wrap:anywhere;color:white;line-height:1.4} body.isf-receipt-page .isf-receipt-panel{margin:25px 0;border:1px solid #dfe8f0;border-radius:14px;padding:22px} body.isf-receipt-page h2{font-size:19px;letter-spacing:-.035em;font-weight:850;color:#183751;margin:0 0 15px} body.isf-receipt-page .isf-receipt-grid{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px} body.isf-receipt-page .isf-receipt-grid>div{min-width:0;background:#f4f8fb;border-radius:9px;padding:13px 15px;border:1px solid #e7eef3} body.isf-receipt-page .isf-receipt-grid dt{color:#77899a;font-size:12px;font-weight:750;margin-bottom:6px} body.isf-receipt-page .isf-receipt-grid dd{margin:0;color:#233e57;font-weight:750;font-size:15px;line-height:1.65;overflow-wrap:anywhere} body.isf-receipt-page .isf-receipt-grid .isf-receipt-wide{grid-column:1/-1} body.isf-receipt-page .isf-receipt-grid .isf-receipt-price{font-size:19px;color:#2274a9} body.isf-receipt-page .isf-receipt-disclaimer{background:#f6f8fb;border:1px solid #dce5ec;border-left:3px solid #81a5c2;border-radius:11px;padding:19px 21px} body.isf-receipt-page .isf-receipt-disclaimer h2{font-size:16px;margin-bottom:10px} body.isf-receipt-page .isf-receipt-disclaimer p{font-size:12px;color:#586d7e;margin:8px 0;line-height:1.8} body.isf-receipt-page .isf-receipt-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;border-top:1px solid #e1e9f0;margin-top:28px;padding-top:15px;font-size:12px;color:#8192a0} body.isf-receipt-page .isf-receipt-toolbar{position:fixed;bottom:0;left:0;right:0;background:rgba(245,249,252,.97);padding:14px 18px;display:flex;justify-content:center;gap:11px;box-shadow:0 -5px 20px rgba(20,51,78,.07)} body.isf-receipt-page .isf-receipt-toolbar button{font-family:inherit;font-size:14px;font-weight:750;line-height:1.5;background:#173d63;color:white;padding:11px 20px;min-height:44px;border:1px solid #173d63;border-radius:10px;cursor:pointer} body.isf-receipt-page .isf-receipt-toolbar button+button{background:#fff;color:#234b6a;border-color:#ccdce6} body.isf-receipt-page .isf-receipt-toolbar button:focus-visible{outline:3px solid #72b5e2;outline-offset:2px} @media(max-width:620px){body.isf-receipt-page .isf-receipt-sheet{margin:10px 9px 100px;padding:22px 17px;border-radius:12px}body.isf-receipt-page .isf-receipt-header{align-items:flex-start;flex-direction:column;padding-bottom:17px}body.isf-receipt-page .isf-receipt-header p{text-align:left}body.isf-receipt-page .isf-receipt-summary{grid-template-columns:1fr;gap:16px;padding:18px}body.isf-receipt-page .isf-receipt-grid{grid-template-columns:1fr}body.isf-receipt-page .isf-receipt-panel{padding:16px}body.isf-receipt-page .isf-receipt-footer{font-size:11px}body.isf-receipt-page .isf-receipt-toolbar button{flex:1}} @media print{ @page{size:A4;margin:13mm} body.isf-receipt-page{background:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact} body.isf-receipt-page .isf-receipt-sheet{box-shadow:none;border:0;border-radius:0;max-width:none;margin:0;padding:0} body.isf-receipt-page .isf-receipt-toolbar{display:none!important} body.isf-receipt-page .isf-receipt-panel,body.isf-receipt-page .isf-receipt-disclaimer{break-inside:avoid} } body.isf-receipt-page .isf-receipt-error{max-width:560px;margin:9vh auto;padding:26px;border:1px solid #d8e4ed;background:#fff;border-radius:16px;color:#213b57} body.isf-receipt-page .isf-receipt-error h1{font-size:23px;letter-spacing:-.03em;color:#193856} body.isf-receipt-page .isf-receipt-error p{font-size:15px;line-height:1.8;overflow-wrap:anywhere} body.isf-receipt-page .isf-receipt-toolbar{align-items:center;flex-wrap:wrap} body.isf-receipt-page .isf-receipt-toolbar>span{color:#637f93;font-size:12px;line-height:1.5} /* V182: single-purpose corporate login + independent signup page. Keep all order cards and member data views untouched. */ body.isf-member-page .isf-member-auth.isf-member-auth--single{ grid-template-columns:minmax(0,1fr);max-width:600px;margin:20px auto 0;gap:0; } body.isf-member-page .isf-member-auth--single .isf-member-panel{ height:auto;padding:29px 31px; } body.isf-member-page .isf-member-auth--single .isf-member-sectionhead{margin-bottom:5px} body.isf-member-page .isf-member-auth--single .isf-member-primary{width:100%;justify-content:space-between} body.isf-member-page .isf-member-join{ display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:11px 16px; margin-top:24px;padding-top:19px;border-top:1px solid #e7edf4; } body.isf-member-page .isf-member-join>span{font-size:13px;line-height:1.55;color:#687d91;font-weight:600} body.isf-member-page .isf-member-join-link{ display:inline-flex;align-items:center;justify-content:center;gap:10px; padding:10px 14px;min-height:41px;background:#edf5fb;color:#205e8b; border:1px solid #cfe0ed;border-radius:10px;font-size:13px;font-weight:850; text-decoration:none;transition:background .16s,border-color .16s; } body.isf-member-page .isf-member-join-link:hover{background:#dfedf8;border-color:#9dbfd9} body.isf-member-page .isf-member-join-link:focus-visible{outline:3px solid #5d9ccc;outline-offset:3px} body.isf-member-page .isf-member-back-link{display:inline-block;margin-top:17px;color:#226a9f;font-weight:800} body.isf-member-signup-page .isf-member-hero-guest{padding-top:28px;padding-bottom:28px} body.isf-member-signup-page .isf-member-privacy span{display:block} @media(max-width:620px){ body.isf-member-page .isf-member-auth.isf-member-auth--single{margin-top:13px} body.isf-member-page .isf-member-auth--single .isf-member-panel{padding:23px 18px} body.isf-member-page .isf-member-join{flex-direction:column;align-items:stretch;margin-top:20px} body.isf-member-page .isf-member-join-link{width:100%} } /* V186 · 승인된 다중 거래처 코드 전환 (기존 로그인 디자인 유지) */ .isf-member-company-selector{margin-bottom:18px} .isf-company-select-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap} .isf-company-select-form label{display:grid;gap:8px;flex:1;min-width:210px;font-size:13px;font-weight:800;color:#425b76} .isf-company-select-form select{width:100%;min-height:48px;padding:12px 14px;border-radius:10px;border:1px solid #ccdae8;background:#f8fbfe;color:#204766;font-size:15px;font-weight:750} .isf-company-select-form button{width:auto;min-width:175px} @media(max-width:600px){.isf-company-select-form{display:grid}.isf-company-select-form label{min-width:0}.isf-company-select-form button{width:100%}} /* Member order re-request: premium accessible date/time modal and immediate queue submission */ body.isf-member-page .isf-pickup-field{position:relative;cursor:pointer} body.isf-member-page .isf-pickup-field input{pointer-events:none;cursor:pointer;padding-right:45px;background:#fff;font-size:17px;font-weight:800;box-shadow:0 4px 12px rgba(23,69,104,.04)} body.isf-member-page .isf-pickup-field:focus-within input,body.isf-member-page .isf-pickup-field:hover input{border-color:#2b79ae;box-shadow:0 0 0 3px rgba(43,121,174,.1)} body.isf-member-page .isf-pickup-field-icon{position:absolute;right:15px;bottom:15px;font-size:21px;color:#277aaa;pointer-events:none} body.isf-member-page .isf-rebook-vehicle,body.isf-member-page .isf-rebook-company{width:100%;display:grid;gap:8px;font-size:13px;font-weight:800;color:#254d68} body.isf-member-page .isf-rebook-vehicle select,body.isf-member-page .isf-rebook-company select{width:100%;min-height:48px;padding:11px 15px;background:#fff;color:#173d59;border:1px solid #ccdfed;border-radius:12px;font-size:15px} body.isf-member-page .isf-rebook-send{min-height:48px;border-radius:12px;padding:11px 22px;font-size:15px;background:#246f9f;color:#fff;font-weight:850;border:0;cursor:pointer} .isf-pickup-dialog{border:1px solid #dbe8f3;border-radius:22px;padding:0;width:min(440px,calc(100vw - 30px));max-height:min(640px,85vh);background:#fff;color:#1a3e5c;box-shadow:0 24px 85px rgba(8,34,59,.25)} .isf-pickup-dialog::backdrop{background:rgba(5,26,47,.55);backdrop-filter:blur(5px)} .isf-pickup-dialog-head{display:flex;align-items:center;justify-content:space-between;padding:24px 25px 17px;background:linear-gradient(120deg,#f3f9ff,#fff)} .isf-pickup-dialog-head small{font-size:10px;letter-spacing:2px;color:#4d89b1;font-weight:800}.isf-pickup-dialog-head h3{font-size:22px;margin:3px 0 0}.isf-pickup-close{border:0;border-radius:50%;background:#e8f1f8;width:37px;height:37px;color:#1e5275} .isf-picker-content{padding:12px 25px 22px}.isf-calendar-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;font-size:18px}.isf-calendar-nav button{background:#eef5fa;border:0;border-radius:11px;width:38px;height:38px;font-size:27px;color:#246e9d}.isf-calendar-nav button:disabled{opacity:.3} .isf-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.isf-calendar-week{text-align:center;padding:8px 0;color:#8197a9;font-size:12px;font-weight:750}.isf-calendar-grid button{aspect-ratio:1;border:0;border-radius:11px;background:#f3f7fa;color:#23455f;font-size:15px;font-weight:700}.isf-calendar-grid button.today{box-shadow:inset 0 0 0 2px #67a5cc}.isf-calendar-grid button.selected,.isf-time-grid button.selected{background:#237eae;color:#fff}.isf-calendar-grid button:disabled{opacity:.25;cursor:not-allowed} .isf-time-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;max-height:335px;overflow:auto;scrollbar-width:thin}.isf-time-grid button{padding:13px 3px;border-radius:10px;border:1px solid #e1e9f1;background:#f5f9fc;color:#235174;font-weight:800;font-size:14px} .isf-pickup-dialog-footer{display:grid;grid-template-columns:1fr 2fr;gap:10px;padding:15px 25px 24px;border-top:1px solid #ecf2f6}.isf-pickup-dialog-footer button{border:0;border-radius:11px;padding:14px;font-size:14px;font-weight:850}.isf-pickup-cancel{background:#eef3f7;color:#436179}.isf-pickup-apply{background:#206f9f;color:white} .isf-request-sent-toast{position:fixed;z-index:99999;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;gap:14px;text-align:center;width:min(400px,calc(100% - 30px));border:1px solid #d8e6f1;border-radius:20px;padding:28px;background:#fff;box-shadow:0 0 0 100vmax rgba(5,24,39,.52),0 20px 70px rgba(12,46,70,.2);color:#1f5374}.isf-request-sent-toast strong{font-size:21px}.isf-request-sent-toast span{font-size:13px;color:#718b9d}.isf-request-sent-toast button{margin-top:6px;border:0;border-radius:11px;padding:12px;background:#257aa8;color:#fff;font-weight:800} /* === 7차 · 고객 접수 및 기업고객 포털 디자인 통합 (2026-11-09) === 기존 PHP/JS 연결을 유지하는 표현 계층 전용. 필드명/선택 값/네트워크 요청 변경 없음. */ body.isf-customer-v7{ --isf7-ink:#183550;--isf7-muted:#5f768b;--isf7-line:#d9e5ed; --isf7-blue:#1b608c;--isf7-blue-dark:#16476a;--isf7-soft:#f5f9fd; --isf7-shadow:0 12px 36px rgba(24,63,100,.065); -webkit-font-smoothing:antialiased; } body.isf-customer-v7 :is(button,a,input,select,textarea):focus-visible{ outline:3px solid #7db7dc;outline-offset:3px; } /* 일반 접수: 밝고 차분한 물류 고객센터 */ body.isf-customer-v7:not(.isf-member-page){background:#f5f8fc;color:var(--isf7-ink)} body.isf-customer-v7:not(.isf-member-page) .page-bg{ background:linear-gradient(180deg,#f0f6fb 0%,#f8fbfe 550px,#f5f8fc 100%); min-height:100vh; } body.isf-customer-v7:not(.isf-member-page) .cosmos-sky-layer{ opacity:.17;pointer-events:none; } body.isf-customer-v7:not(.isf-member-page) .site-head{ background:rgba(255,255,255,.97);border-bottom:1px solid var(--isf7-line); box-shadow:0 4px 22px rgba(30,68,101,.045); } body.isf-customer-v7:not(.isf-member-page) .head-inner{max-width:1320px;gap:25px} body.isf-customer-v7:not(.isf-member-page) .topnav{gap:clamp(12px,2vw,26px)} body.isf-customer-v7:not(.isf-member-page) .topnav a{font-size:13px;color:#536f85} body.isf-customer-v7:not(.isf-member-page) .topnav a.active{color:var(--isf7-blue-dark)} body.isf-customer-v7:not(.isf-member-page) .topnav a.active:after{background:var(--isf7-blue)} body.isf-customer-v7:not(.isf-member-page) .header-cta{ color:#16496b;border:1px solid #c5dce9;background:#f0f7fc; font-size:12px;font-weight:800;white-space:nowrap; } body.isf-customer-v7:not(.isf-member-page) .page-shell{max-width:1320px;padding-top:30px} body.isf-customer-v7:not(.isf-member-page) .order-hero{ border:1px solid #cfdfeb;border-radius:24px; background:linear-gradient(118deg,#fff 0%,#f3f9fe 65%,#eaf4fb 100%); box-shadow:var(--isf7-shadow);padding:28px 32px; color:var(--isf7-ink);min-height:206px; } body.isf-customer-v7:not(.isf-member-page) .space-hero-copy{z-index:1;position:relative} body.isf-customer-v7:not(.isf-member-page) .space-hero-copy :is(h1,h1 em){color:#173d5c} body.isf-customer-v7:not(.isf-member-page) .space-hero-copy h1{font-weight:900;letter-spacing:-.055em} body.isf-customer-v7:not(.isf-member-page) .space-hero-copy h1 em{color:#246d98;font-style:normal} body.isf-customer-v7:not(.isf-member-page) .space-hero-copy .eyebrow{color:#2d7398} body.isf-customer-v7:not(.isf-member-page) .isf-hero-subtitle{color:#536e81;font-size:14px;line-height:1.8} body.isf-customer-v7:not(.isf-member-page) .hero-chip{ border:1px solid #d3e4ef;background:#fff;color:#2e607d; box-shadow:0 2px 8px rgba(27,83,121,.035); } body.isf-customer-v7:not(.isf-member-page) .space-hero-mascot{ max-height:195px;width:auto;object-fit:contain;filter:drop-shadow(0 8px 13px rgba(14,62,99,.10)); } body.isf-customer-v7:not(.isf-member-page) .journey-progress{ border:1px solid #d6e3ed;border-radius:18px;background:#fff; padding:10px;box-shadow:0 5px 22px rgba(17,57,91,.04); } body.isf-customer-v7:not(.isf-member-page) .journey-step{ min-width:0;border-radius:11px; } body.isf-customer-v7:not(.isf-member-page) .journey-step.is-current{ background:#edf6fc;border-color:#b3d6ea;color:#174d72; } body.isf-customer-v7:not(.isf-member-page) .journey-step:focus-visible{outline-offset:0} body.isf-customer-v7:not(.isf-member-page) .layout{gap:18px} body.isf-customer-v7:not(.isf-member-page) .main-column{gap:18px} body.isf-customer-v7:not(.isf-member-page) .sheet{ border:1px solid var(--isf7-line);border-radius:20px; box-shadow:var(--isf7-shadow);background:#fff; } body.isf-customer-v7:not(.isf-member-page) .section-head{margin-bottom:22px;gap:14px} body.isf-customer-v7:not(.isf-member-page) .section-head h2{ font-size:clamp(19px,2vw,23px);font-weight:900;letter-spacing:-.045em;color:var(--isf7-ink); } body.isf-customer-v7:not(.isf-member-page) .section-head p{ font-size:13px;color:var(--isf7-muted);line-height:1.7; } body.isf-customer-v7:not(.isf-member-page) .section-head .step{ display:grid;place-items:center;flex:none;min-width:40px;height:40px; padding:0 8px;font-size:14px;color:#fff;background:#245b82;border-radius:12px; } body.isf-customer-v7:not(.isf-member-page) .tab-switch{ background:#edf3f8;border:1px solid #dce7ef; } body.isf-customer-v7:not(.isf-member-page) .tab.selected{ background:var(--isf7-blue-dark);color:#fff; } body.isf-customer-v7:not(.isf-member-page) .vehicle{ border-color:#d9e6ef;background:#fbfdff;border-radius:14px; box-shadow:0 3px 10px rgba(23,70,105,.025); } body.isf-customer-v7:not(.isf-member-page) .vehicle:hover{ border-color:#75add0;box-shadow:0 7px 18px rgba(23,95,141,.09); } body.isf-customer-v7:not(.isf-member-page) .vehicle.chosen{ border:2px solid #216c9b;color:#153f5d; background:linear-gradient(155deg,#f1f9fe,#dfeff9); box-shadow:0 0 0 2px rgba(47,119,163,.10),0 6px 18px rgba(27,96,140,.10); } body.isf-customer-v7:not(.isf-member-page) .vehicle.chosen .vehicle-type{ background:#1a5a84;color:#fff; } body.isf-customer-v7:not(.isf-member-page) .vehicle.chosen :is(strong,small){color:#1b4c6c} body.isf-customer-v7:not(.isf-member-page) .item{ border:1px solid #dfe8f0;background:#f8fbfe;border-radius:13px; } body.isf-customer-v7:not(.isf-member-page) .item[data-selected="true"]{ border-color:#2e7ba8;background:#edf7fc;box-shadow:inset 0 0 0 1px #2e7ba8; } body.isf-customer-v7:not(.isf-member-page) .counter{ border:1px solid #d6e4ed;border-radius:9px; } body.isf-customer-v7:not(.isf-member-page) .counter button{color:#215e85;min-width:32px;min-height:34px} body.isf-customer-v7:not(.isf-member-page) :is(.form-card,.isf-schedule-panel){ border-color:#dce7ef;border-radius:15px;background:#fbfdff; } body.isf-customer-v7:not(.isf-member-page) .mini-title{color:#244f6c;font-weight:850} body.isf-customer-v7:not(.isf-member-page) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){ background:#fff;border-color:#cbdce8;color:#193a54;min-height:46px; } body.isf-customer-v7:not(.isf-member-page) :is(input,select,textarea)::placeholder{color:#869aab;opacity:1} body.isf-customer-v7:not(.isf-member-page) .form-field label{font-size:13px;color:#345b77;font-weight:800} body.isf-customer-v7:not(.isf-member-page) :is(.address-search,.address-search-trigger){min-width:0} body.isf-customer-v7:not(.isf-member-page) .address-completion-note{color:#5c7386;font-size:12px;line-height:1.65} body.isf-customer-v7:not(.isf-member-page) .space-method-card{ border-radius:13px;border-color:#d8e5ee;background:#fff; } body.isf-customer-v7:not(.isf-member-page) .space-method-card.is-active{ border-color:#327ca9;background:#eef7fc;box-shadow:0 0 0 1px #327ca9; } body.isf-customer-v7:not(.isf-member-page) .choice.chosen, body.isf-customer-v7:not(.isf-member-page) .cosmic-pay.is-active{ border-color:#327ca9;background:#ecf7fc;color:#164d70; } body.isf-customer-v7:not(.isf-member-page) .isf-memo-chip{ background:#f6fafc;border:1px solid #d8e5ee;color:#285b7e; } body.isf-customer-v7:not(.isf-member-page) .isf-memo-chip:hover{ background:#e7f3fb;border-color:#80b7d5; } body.isf-customer-v7:not(.isf-member-page) :is(.notice,.field-help,.cargo-note-hint){line-height:1.75} body.isf-customer-v7:not(.isf-member-page) .sheet :is(button,input,select,textarea){scroll-margin-top:110px} body.isf-customer-v7:not(.isf-member-page) .sheet [hidden], body.isf-customer-v7:not(.isf-member-page) .page-shell [hidden]{display:none!important} /* 기업고객: 로그인·조회·회원가입을 같은 밝은 브랜드 시스템에 포함 */ body.isf-member-page.isf-customer-v7{--mp-line:#d9e5ee;--mp-ink:#1c3d58;background:#f5f8fc} body.isf-member-page.isf-customer-v7 .isf-member-hero{ border-radius:20px;box-shadow:var(--isf7-shadow); } body.isf-member-page.isf-customer-v7 .isf-member-hero-guest{ background:linear-gradient(115deg,#fff,#eef6fc);border-color:#d6e4ef; } body.isf-member-page.isf-customer-v7 .isf-member-hero-logged{ background:linear-gradient(108deg,#123c5c,#246389);color:white; } body.isf-member-page.isf-customer-v7 .isf-member-panel{ border:1px solid #dbe7ef;border-radius:18px; box-shadow:var(--isf7-shadow);background:#fff; } body.isf-member-page.isf-customer-v7 .isf-member-sectionhead h2{color:#183b57} body.isf-member-page.isf-customer-v7 .isf-member-panel :is(input,select,textarea){ border:1px solid #c8dce9;background:#fff;min-height:48px;color:#183a55; } body.isf-member-page.isf-customer-v7 .isf-member-primary{ background:#1b597f;border:1px solid #1b597f;color:#fff;border-radius:11px; font-size:14px;min-height:48px; } body.isf-member-page.isf-customer-v7 .isf-member-primary:hover{background:#104365} body.isf-member-page.isf-customer-v7 .isf-member-join-link{ background:#edf6fb;border-color:#c4dce9;color:#164c71;border-radius:10px; } body.isf-member-page.isf-customer-v7 .isf-member-hero-cta{ background:#fff;color:#184766;border:1px solid rgba(255,255,255,.8); border-radius:12px;box-shadow:0 7px 24px rgba(5,26,45,.12); } body.isf-member-page.isf-customer-v7 .isf-member-auth--single .isf-member-panel{padding:32px} @media(max-width:780px){ body.isf-customer-v7:not(.isf-member-page) .head-inner{gap:12px} body.isf-customer-v7:not(.isf-member-page) .page-shell{padding:18px 14px 70px} body.isf-customer-v7:not(.isf-member-page) .order-hero{padding:24px 22px;min-height:0} body.isf-customer-v7:not(.isf-member-page) .space-hero-mascot{max-height:145px} body.isf-customer-v7:not(.isf-member-page) .journey-progress{padding:7px} } @media(max-width:620px){ body.isf-customer-v7:not(.isf-member-page) .page-shell{padding:14px 12px 58px} body.isf-customer-v7:not(.isf-member-page) .order-hero{padding:20px 17px;border-radius:18px} body.isf-customer-v7:not(.isf-member-page) .space-hero-copy h1{font-size:clamp(22px,6vw,29px);line-height:1.36} body.isf-customer-v7:not(.isf-member-page) .isf-hero-subtitle{font-size:13px} body.isf-customer-v7:not(.isf-member-page) .space-hero-mascot{max-height:110px;opacity:.55} body.isf-customer-v7:not(.isf-member-page) .hero-chip{font-size:11px} body.isf-customer-v7:not(.isf-member-page) .journey-progress{gap:4px} body.isf-customer-v7:not(.isf-member-page) .journey-step{padding:7px 5px;min-height:46px} body.isf-customer-v7:not(.isf-member-page) .journey-step .journey-text small{display:none} body.isf-customer-v7:not(.isf-member-page) .journey-step .journey-text strong{font-size:11px;white-space:normal;word-break:keep-all} body.isf-customer-v7:not(.isf-member-page) .sheet{padding:20px 15px;border-radius:16px} body.isf-customer-v7:not(.isf-member-page) .section-head .step{min-width:34px;height:34px;font-size:12px;border-radius:10px} body.isf-customer-v7:not(.isf-member-page) .section-head{gap:10px} body.isf-customer-v7:not(.isf-member-page) .section-head p{font-size:12px} body.isf-customer-v7:not(.isf-member-page) .item-grid{gap:7px} body.isf-customer-v7:not(.isf-member-page) .vehicle-grid{gap:8px} body.isf-customer-v7:not(.isf-member-page) .counter button{min-width:30px;min-height:34px} body.isf-customer-v7:not(.isf-member-page) .form-field label{font-size:12px} body.isf-customer-v7:not(.isf-member-page) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){font-size:16px} body.isf-member-page.isf-customer-v7 .isf-member-auth--single .isf-member-panel{padding:23px 18px} } @media(prefers-reduced-motion:reduce){ body.isf-customer-v7 *,body.isf-customer-v7 *::before,body.isf-customer-v7 *::after{ scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important; } } /* V7 luminance correction: V109's legacy dark-mode declarations carry !important; override only the public customer form with the same scoped, explicit priority. */ body.isf-customer-v7:not(.isf-member-page){background:#f5f8fc!important;color:#193d57!important} body.isf-customer-v7:not(.isf-member-page) .page-bg{ background:linear-gradient(180deg,#edf5fb 0%,#f9fbfd 420px,#f5f8fc 100%)!important; color:#193d57!important; } body.isf-customer-v7:not(.isf-member-page) .page-bg::before, body.isf-customer-v7:not(.isf-member-page) .page-bg::after{opacity:.07!important} body.isf-customer-v7:not(.isf-member-page) .site-head{ background:rgba(255,255,255,.98)!important; border-bottom:1px solid #d8e5ee!important; box-shadow:0 5px 23px rgba(29,65,96,.07)!important; } body.isf-customer-v7:not(.isf-member-page) .site-head .brand strong{color:#173b57!important} body.isf-customer-v7:not(.isf-member-page) .site-head .brand small{color:#52768f!important} body.isf-customer-v7:not(.isf-member-page) .site-head .topnav a{color:#486a82!important} body.isf-customer-v7:not(.isf-member-page) .site-head .topnav a.active, body.isf-customer-v7:not(.isf-member-page) .site-head .topnav a:hover{color:#195d86!important} body.isf-customer-v7:not(.isf-member-page) .site-head .topnav a.active::after{background:#287aa7!important;box-shadow:none!important} body.isf-customer-v7:not(.isf-member-page) .site-head .header-cta{ background:#eef7fc!important;border:1px solid #c6ddeb!important;color:#184d72!important; } body.isf-customer-v7:not(.isf-member-page) .space-hero, body.isf-customer-v7:not(.isf-member-page) .titlebar.order-hero{ background:linear-gradient(117deg,#fff,#f2f9fd 68%,#e6f3fb)!important; border:1px solid #ccdeeb!important; box-shadow:0 12px 35px rgba(23,72,108,.07)!important;color:#173b57!important; } body.isf-customer-v7:not(.isf-member-page) .space-hero::before, body.isf-customer-v7:not(.isf-member-page) :is(.space-hero-beam,.space-hero-orbit){opacity:.1!important} body.isf-customer-v7:not(.isf-member-page) .space-hero h1{ color:#183d5a!important;text-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .space-hero h1 em, body.isf-customer-v7:not(.isf-member-page) .space-hero h1 .isf-hero-keyword{ color:#216b96!important;background:none!important;-webkit-text-fill-color:#216b96!important;text-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .space-hero :is(.eyebrow,.space-hero-spark){color:#26789e!important} body.isf-customer-v7:not(.isf-member-page) .space-hero .subtitle, body.isf-customer-v7:not(.isf-member-page) .space-hero .subtitle span{color:#4c6a80!important} body.isf-customer-v7:not(.isf-member-page) .space-hero :is(.hero-chip,.status,.isf-hero-status){ color:#245877!important;background:#fff!important;border:1px solid #d3e4ed!important;box-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .space-hero-mascot{filter:drop-shadow(0 6px 12px rgba(24,80,120,.1))!important} body.isf-customer-v7:not(.isf-member-page) :is(.journey-progress,.journey-premium){ background:#fff!important;border:1px solid #d5e4ed!important; box-shadow:0 5px 23px rgba(22,65,100,.04)!important;color:#244763!important; } body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-step{color:#40627b!important} body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-text strong{color:#214e6d!important} body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-text small{color:#6b8398!important} body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-step.is-current, body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-step[aria-current="step"]{ background:#edf6fc!important;border-color:#b5d8e9!important;box-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .journey-progress .journey-number, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .section-head .step{ background:#23658f!important;border:1px solid #23658f!important;color:#fff!important;box-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.sheet,.form-card,.address-card,.space-method-card,.cargo-collection-head,.pallet-dim-panel,.submit-panel){ background:#fff!important;border:1px solid #d9e6ef!important; box-shadow:0 7px 25px rgba(21,69,105,.055)!important;color:#183e5b!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .sheet::before, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .cargo-collection-head::before{opacity:.05!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .sheet :is(.section-head h2,.subhead,.mini-title,.form-field label,.reservation label), body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .field-top .subhead, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .cargo-collection-head .subhead, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .pallet-dim-title strong{ color:#193f5c!important;text-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.section-head p,.hint,.quiet,.field-help,.cargo-collection-sub,.cargo-note-hint,.address-completion-note,.cargo-kicker,.memo-foot,.memo-foot span){ color:#58758c!important;text-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.cargo-kicker span,.memo-auto-tag){ color:#236a91!important;background:#eaf5fb!important;border-color:#c7e0ec!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.truck-shape-field,.notice,.pallet-dim-fields,.dispatch-route-strip,.cosmic-live-facts>div){ background:#f3f9fd!important;border:1px solid #d5e6f0!important;color:#375e79!important; box-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.truck-shape-field label,.truck-shape-field p,.vehicle-code-status,.notice,.notice span){color:#3e6882!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.tab-switch,.cosmic-vehicle-modes){ background:#edf5fa!important;border:1px solid #d3e4ef!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .tab{color:#476c86!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .tab.selected{ background:#195d86!important;color:#fff!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .vehicle-grid .vehicle{ background:#f8fbfe!important;border:1px solid #d8e7f0!important; color:#194463!important;box-shadow:0 2px 9px rgba(25,71,109,.025)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .vehicle-grid .vehicle.chosen{ background:#e7f5fc!important;border:2px solid #2c80ac!important; box-shadow:0 0 0 2px rgba(43,127,172,.08)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .vehicle-grid .vehicle :is(strong,small){color:#234d69!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .item{ background:#f8fbfe!important;border:1px solid #d6e5ee!important; color:#193f5c!important;box-shadow:0 2px 10px rgba(22,65,99,.025)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .item[data-selected="true"]{ background:#eaf6fc!important;border:2px solid #3180ad!important; box-shadow:0 0 0 1px rgba(40,129,172,.1)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .item-main, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .item-main strong{color:#1b4562!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .item-main small{color:#5b788e!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .counter{ background:#fff!important;border:1px solid #d4e4ee!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .counter b{color:#183f60!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #cargoItems .counter button{ background:#eaf5fb!important;color:#1b5981!important;box-shadow:none!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(input,textarea,select,#cargoNote){ background:#fff!important;border:1px solid #bfd4e2!important;color:#1b425e!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(input,textarea,select):focus{ border-color:#347fa9!important;box-shadow:0 0 0 3px rgba(52,127,169,.13)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard :is(.choice,.cosmic-pay){ background:#f8fbfe!important;border:1px solid #d1e4ef!important;color:#235473!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .choice.chosen, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .cosmic-pay.is-active{ background:#e8f6fc!important;border:2px solid #3984ac!important;color:#184f71!important; box-shadow:0 0 0 1px rgba(56,130,171,.11)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .primary, body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard #registerButton{ background:#1f628c!important;color:white!important;border:1px solid #1f628c!important; box-shadow:0 5px 16px rgba(30,96,139,.14)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .secondary{ background:#eff6fb!important;border:1px solid #bad6e5!important;color:#1e597d!important; } body.isf-customer-v7:not(.isf-member-page) :is(#footerArea,footer,.page-shell footer){ color:#55758b!important;border-color:#d8e6ef!important; } @media(max-width:760px){ body.isf-customer-v7:not(.isf-member-page) .site-head{background:rgba(255,255,255,.98)!important} body.isf-customer-v7:not(.isf-member-page) .space-hero{background:linear-gradient(115deg,#fff,#eaf5fc)!important} body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .sheet{background:#fff!important} } /* Final narrow-screen polish: prevent the decorative mascot from peeking outside the hero. */ @media(max-width:620px){ body.isf-customer-v7:not(.isf-member-page) .space-hero-mascot{display:none!important} } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .v61-vehicle-guide{ background:linear-gradient(120deg,#1d557b,#234e78 75%,#345889)!important; border:1px solid #8cb8d3!important; box-shadow:0 8px 22px rgba(19,67,102,.12)!important; } body.isf-customer-v7:not(.isf-member-page) .cosmic-dashboard .v61-vehicle-guide :is(.v61-guide-kicker,.v61-guide-copy>strong,.v61-guide-copy>p){color:#fff!important} /* V216 · source marker for verified website orders in the corporate history. */ body.isf-member-page .isf-order-source{display:inline-flex;align-self:flex-start;width:max-content;max-width:100%;padding:3px 8px;border:1px solid #dbe7f2;background:#f5f8fc;border-radius:7px;color:#62768e;font-size:11px;font-weight:800;line-height:1.4;white-space:nowrap} body.isf-member-page .isf-order-source-web{border-color:#91d1d7;background:#eaf8f6;color:#0e746d} body.isf-member-page .isf-order-row:has(.isf-order-source-web){border-color:#b6dcd9} /* V22: verified business account scope, displayed only after member sign-in. */ .isf-company-order-choice{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid #c8ddef;border-radius:16px;padding:16px 20px;margin:16px 0;color:#142f4d;box-shadow:0 6px 20px rgba(18,57,89,.045)} .isf-company-order-choice label{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:15px} .isf-company-order-choice select{min-width:210px;max-width:100%;font:inherit;border:1px solid #b6d1e5;border-radius:10px;padding:10px 36px 10px 12px;background:#f8fbff;color:#17375a} .isf-company-order-choice p{margin:0;color:#547187;font-size:13px;line-height:1.6} @media(max-width:600px){.isf-company-order-choice{display:block;padding:14px}.isf-company-order-choice label{display:block}.isf-company-order-choice select{display:block;width:100%;margin-top:8px}.isf-company-order-choice p{margin-top:10px}} /* V23: member history uses the same two clear origin markers as the admin order board. */ body.isf-member-page .isf-order-source-web{background:#e5f5ff;border-color:#9bcfed;color:#075e94} body.isf-member-page .isf-order-source-insung{background:#fff1df;border-color:#efc68b;color:#965009} /* V25: order numbers toggle completed-order detail; no change to Insung order codes. */ body.isf-member-page .isf-order-clickable-serial{display:inline-flex;gap:5px;align-items:center;width:max-content;max-width:100%;color:#176ba5;background:#eef6fc;border:1px solid #c9dfed;border-radius:7px;padding:4px 7px;font-size:11.5px;font-weight:800;line-height:1.45;overflow-wrap:anywhere} body.isf-member-page .isf-order-row[open] .isf-order-clickable-serial{color:#164c76;background:#daeafa} body.isf-member-page .isf-order-row>summary:focus-visible{outline:3px solid #327bac;outline-offset:-3px;border-radius:14px} body.isf-member-page .isf-rebook-safety{display:block;flex:1 0 100%;font-size:12px;line-height:1.6;color:#627b90} @media(max-width:760px){body.isf-member-page .isf-order-clickable-serial{font-size:11px}} /* Scoped premium galaxy finish for corporate member portal ONLY (index.php untouched). */ body.isf-member-page{ --mp-canvas:#081426;--mp-ink:#19334d;--mp-soft:#617991; --mp-line:#cbdbe9;--mp-paper:#f8fbff; background-color:#081426!important; background-image:radial-gradient(ellipse 850px 560px at 92% 8%,rgba(44,116,181,.27),transparent 72%),radial-gradient(ellipse 680px 490px at 3% 58%,rgba(25,117,163,.11),transparent 75%),linear-gradient(180deg,#071225 0%,#0c213b 47%,#081427 100%)!important; } body.isf-member-page .isf-member-head{ background:linear-gradient(118deg,rgba(7,21,39,.98),rgba(17,43,76,.96)); border-color:rgba(101,171,217,.36); box-shadow:0 14px 38px rgba(0,5,20,.27),inset 0 1px 0 rgba(255,255,255,.045); } body.isf-member-page .isf-member-brand strong{color:#f0f8ff} body.isf-member-page .isf-member-brand small, body.isf-member-page .isf-member-head-identity{color:#a5c3da} body.isf-member-page .isf-member-logout,body.isf-member-page .isf-member-head-link{ color:#e1f5ff;background:#163252;border-color:#4c7799; } body.isf-member-page .isf-member-logout:hover,body.isf-member-page .isf-member-head-link:hover{background:#214669} body.isf-member-page .isf-member-hero-logged{ background:radial-gradient(circle at 85% 15%,rgba(48,173,209,.19),transparent 32%),linear-gradient(112deg,#0a1c37,#163657 60%,#184875); border:1px solid rgba(92,193,231,.40);box-shadow:0 22px 52px rgba(0,7,26,.28); } body.isf-member-page .isf-member-eyebrow,body.isf-member-page .isf-member-kicker{color:#63d0f0} body.isf-member-page .isf-member-hero-logged .isf-member-eyebrow{color:#8de1fb} body.isf-member-page .isf-member-hero-logged .isf-member-customer-tag{ display:inline-flex;align-items:center;gap:5px; background:rgba(13,49,80,.76);border:1px solid rgba(111,208,238,.56); color:#ecfaff;box-shadow:0 3px 15px rgba(4,19,40,.22);padding:6px 12px; } body.isf-member-page .isf-member-heart{color:#ffc5dc;font-size:12px;line-height:1;text-shadow:0 0 8px rgba(255,133,174,.54)} body.isf-member-page .isf-member-panel{ background:linear-gradient(160deg,#fff 0%,#f0f7fc 100%); border-color:#bbd4e9;box-shadow:0 13px 32px rgba(0,7,25,.2); } body.isf-member-page .isf-member-panel h2{color:#183854} body.isf-member-page .isf-member-kicker{color:#247da5} body.isf-member-page .isf-live-pills a[aria-current="page"]{ color:#f4fcff;background:linear-gradient(115deg,#12578e,#1685a8);border-color:#5bcae5; box-shadow:0 6px 14px rgba(12,81,142,.18); } body.isf-member-page .isf-member-stats-link{ background:linear-gradient(125deg,#0b3154,#195a80);border-color:#347ea8;color:#f0faff; } body.isf-member-page .isf-member-stats-link:hover{background:linear-gradient(125deg,#12476a,#1c7291)} body.isf-member-page .isf-member-primary{background:linear-gradient(110deg,#12618e,#178fb1);border-color:#278aad} body.isf-member-page .isf-member-footer{color:#9eb6ce} body.isf-member-page .isf-stats-hero{background:linear-gradient(120deg,#0d2846,#19547d);border:1px solid rgba(107,202,239,.38)} body.isf-member-page .isf-stats-hero .isf-member-kicker{color:#9be9ff} @media(max-width:760px){body.isf-member-page .isf-member-hero-logged .isf-member-customer-tag{gap:3px;padding:5px 9px}} /* Source count is part of the company analytics report, not the customer intake UI. */ body.isf-stats-page .isf-stats-source-counts{margin:4px 0 21px;padding:12px 17px;border:1px solid #afd5e5;border-radius:12px;background:linear-gradient(110deg,#e7f5fc,#f4faff);color:#245c7c;font-size:14px;font-weight:800} /* Corporate member portal: shared header navigation only. Main intake styles untouched. */ body.isf-member-page .isf-member-head nav{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;min-width:0} body.isf-member-page .isf-portal-menu-item{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:7px 10px;border:1px solid transparent;border-radius:10px;color:#b8d8ec;font-size:12.5px;font-weight:800;white-space:nowrap;line-height:1.45;text-decoration:none;transition:background-color .18s,border-color .18s} body.isf-member-page .isf-portal-menu-item:hover{background:rgba(91,180,222,.13);color:#fff} body.isf-member-page .isf-portal-menu-item[aria-current="page"]{background:rgba(42,154,204,.19);border-color:rgba(102,217,244,.47);color:#a9efff} body.isf-member-page .isf-member-logout{min-height:38px;padding:7px 11px} @media(max-width:1050px){body.isf-member-page .isf-member-head{flex-wrap:wrap}body.isf-member-page .isf-member-head nav{width:100%;justify-content:flex-start;border-top:1px solid rgba(103,175,210,.18);padding-top:9px}} @media(max-width:600px){body.isf-member-page .isf-member-head nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}body.isf-member-page .isf-portal-menu-item{white-space:normal;text-align:center;min-height:39px;font-size:12px}body.isf-member-page .isf-member-head nav form{grid-column:1/-1}body.isf-member-page .isf-member-head nav form button{width:100%}}