/* public/r4/styles.css */ /* R4 implementation source: authored native typography, independent SVG elements, no screenshot underlays. */ :root{--paper:#fff4e4;--paper2:#fffaf3;--white:#fffdfb;--brown:#2e241e;--text:#705f51;--muted:#a18c77;--red:#c41029;--red2:#e22327;--redDark:#a51126;--gold:#d79c33;--goldLight:#f0c686;--border:#f1d8b5;--chip:#fbe9d1;--green:#21865e;--shadow:0 8px 22px rgba(107,72,37,.06);--sans:"Noto Sans SC","PingFang SC","Microsoft Yahei",sans-serif;--serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif} *{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:var(--sans);color:var(--brown)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #d7a84e;outline-offset:2px}button:disabled{opacity:.46;cursor:not-allowed}a{color:inherit;text-decoration:none}.studio{min-height:100vh;background:radial-gradient(at 20% 0,#fff9ed,#e9d7bd 90%);display:grid;grid-template-columns:310px 1fr;gap:22px;padding:20px}.studio-sidebar{align-self:start;background:#fffaf3;border:1px solid #e7cba4;border-radius:19px;padding:22px;box-shadow:var(--shadow)}.studio-brand{font-size:13px;font-weight:800;letter-spacing:.08em;color:var(--red)}.studio-brand span{font-weight:400;color:var(--muted);display:block;margin-top:5px}.studio-sidebar h1{font:700 23px/1.4 var(--serif);margin:18px 0 6px}.studio-sidebar p{color:#84705b;font-size:13px;line-height:1.7}.studio-group{padding:16px 0;border-top:1px solid #f0e2cc}.studio-group>b{display:block;margin-bottom:10px}#devNav{display:grid;grid-template-columns:1fr 1fr;gap:6px}#devNav button{background:#fff3e1;border:1px solid #ecd5b5;border-radius:9px;padding:9px 6px;color:#7d5d41;font-size:12px}#devNav button.selected{background:var(--red);color:white}.phone-stage{display:flex;justify-content:center;align-items:flex-start}.phone{width:420px;height:884px;position:relative;border:11px solid #151515;border-radius:45px;overflow:hidden;background:radial-gradient(circle at 82% 29%,#ffeed0 0,transparent 36%),radial-gradient(circle at 10% 85%,#fffdfa 0,transparent 28%),var(--paper);box-shadow:0 20px 58px #89755751;isolation:isolate}.phone:before{content:"";position:absolute;z-index:-1;width:250px;height:250px;border:1.5px solid #edb97873;border-radius:50%;right:-113px;top:108px;pointer-events:none}.phone:after{content:"";position:absolute;z-index:-1;width:300px;height:300px;border:1.3px solid #e4ab7380;border-radius:50%;left:-155px;bottom:-180px;pointer-events:none}.island{position:absolute;top:0;left:50%;transform:translateX(-50%);background:#151515;width:125px;height:13px;border-radius:0 0 11px 11px;z-index:20}.status{height:34px;display:flex;justify-content:space-between;align-items:center;padding:5px 30px 2px;font-weight:800;font-size:13px;color:#151515}.status-right{font-size:13px;letter-spacing:1px}#masthead{height:68px;display:flex;align-items:center;gap:10px;padding:5px 18px 5px;position:relative;z-index:3}.back-circle{width:28px;height:28px;border:1px solid var(--border);border-radius:50%;background:#fffdfa;display:grid;place-items:center;color:#5e4539;font-size:21px;flex:0 0 auto}.wordmark{display:flex;gap:8px;align-items:center;flex:1;min-width:0}.logo-box{width:30px;height:33px;border-radius:8px;background:linear-gradient(160deg,#e32926,#b60825);border:2px solid #efc77f;display:grid;place-items:center;color:#fff;font:800 24px/1 var(--serif);box-shadow:0 3px 8px #b82e2640}.brand-cn{font-weight:800;font-size:19px;line-height:1.05;color:#2e211b;white-space:nowrap}.brand-sub{margin-top:4px;color:#a08162;font-size:10px;letter-spacing:.23em;white-space:nowrap}.year-chip{padding:6px 10px;border:1px solid #dfa34f;border-radius:99px;color:#c3122b;font-weight:800;background:#fff3e6;font-size:12px;white-space:nowrap}.page{height:calc(100% - 102px);overflow-y:auto;overflow-x:hidden;scrollbar-width:none;padding:9px 18px 103px;position:relative}.page::-webkit-scrollbar{display:none}.page>.scene{position:relative}.scene:before{content:"";position:absolute;z-index:-1;top:10px;right:-23px;background:url("/public/r4/assets/motif.svg") center/cover no-repeat;width:200px;height:210px;opacity:.6;pointer-events:none}.scene>.flower{position:absolute;right:1px;top:0;color:#d58781;font-size:26px;line-height:1;opacity:.8;z-index:-1}.eyebrow{font-weight:800;color:#ab4126;font-size:12px;letter-spacing:.03em;margin:9px 0 12px}.title{font-family:var(--serif);font-weight:900;font-size:29px;line-height:1.28;letter-spacing:-.035em;margin:0 0 12px;color:#2e241e}.title em{font-style:normal;color:var(--red)}.title.tight{font-size:25px}.subtitle{font-size:13px;line-height:1.75;color:#786453;margin:0 0 16px}.small{font-size:11px;color:#a48b74}.muted{color:#9a816a}.strong{font-weight:800}.crimson{color:var(--red)}.gold{color:#ac7932}.center{text-align:center}.row{display:flex;gap:8px;align-items:center}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.stack{display:grid;gap:9px}.topspace{margin-top:14px}.section{margin-top:14px}.panel{background:#fffdfa;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:15px;margin-top:13px}.panel.noMargin{margin-top:0}.panelTitle{font-size:15px;font-weight:800;margin-bottom:9px}.panelNote{font-size:12px;color:#907561;line-height:1.55}.roundedSoft{background:#fff4e1;border:1px solid #eccb9b;border-radius:14px}.pill{border-radius:99px;padding:7px 11px;background:#f9ead6;border:0;color:#835e42;font-size:12px;white-space:nowrap}.pill.active,.chip.active{background:var(--red);color:white}.chip{border:1px solid #e6c599;background:#fff5e7;border-radius:99px;color:#805c40;padding:7px 12px;font-weight:700;font-size:12px}.pillRow{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.mainBtn{border:1px solid #fa6565;border-radius:99px;background:linear-gradient(180deg,#ef2028 0,#b80923 100%);color:white;font-weight:800;font-size:15px;min-height:47px;box-shadow:0 9px 20px #c51b2831;padding:10px 14px;width:100%;text-align:center}.outlineBtn{border:1px solid #dbad73;border-radius:99px;background:#fffaef;color:#a85a2b;font-weight:750;font-size:13px;min-height:40px;padding:10px 15px;width:100%}.ghostBtn{border:0;background:none;color:#987454;font-size:12px;min-height:29px}.sticky-action{position:absolute;left:15px;right:15px;bottom:8px;z-index:6;background:linear-gradient(0deg,#fff4e7 78%,#fff4e700);padding-top:15px;display:flex;flex-direction:column;gap:5px}.sticky-action .mainBtn{height:52px}.sticky-action .fineprint{font-size:10px;color:#a8917b;text-align:center;line-height:1.3}.picture{width:100%;display:block;border-radius:10px}.photoWall{display:grid;grid-template-columns:1fr 1fr;gap:8px}.houseCard{border:1px solid #ecd4af;background:#fffdfa;border-radius:15px;padding:5px 5px 8px;text-align:left;position:relative;box-shadow:var(--shadow);min-width:0}.houseCard.selected{border:2px solid var(--red);padding:4px 4px 7px}.houseCard img{width:100%;aspect-ratio:1.7/1;object-fit:cover;border-radius:10px;display:block;background:#f5e6cb}.houseCard strong{display:block;margin:7px 6px 3px;font-size:13px}.houseCard small{display:block;margin:0 6px;color:#ad9178;font-size:10px}.houseCheck{position:absolute;top:5px;right:5px;width:24px;height:24px;background:var(--red);border:2px solid #fff;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:15px}.countrySwitch{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#eee5db;padding:4px;border-radius:13px;margin-bottom:15px}.countrySwitch button{border:0;background:transparent;color:#aa9381;font-weight:800;font-size:13px;padding:9px 6px;border-radius:10px}.countrySwitch button.active{background:var(--red);color:white;box-shadow:0 3px 8px #c5142641}.uploadLine{border:1px dashed #dda96c;border-radius:15px;background:#fff8ee;padding:11px;display:flex;gap:12px;align-items:center;width:100%;color:inherit;text-align:left}.uploadLine img{width:33px;height:33px;flex:0 0 auto}.uploadLine strong{font-size:13px}.uploadLine small{display:block;font-size:11px;color:#987d65;margin-top:4px}.selectedFile{font-size:11px;color:#388061;word-break:break-all}.label{font-weight:800;font-size:14px;margin-bottom:9px}.subLabel{font-size:11px;color:#a58a72}.directionGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.directionGrid button{border:1px solid #e3b877;border-radius:25px;background:#fff4e3;color:#7c5b40;padding:10px 4px;font-size:13px;font-weight:700}.directionGrid button.active{color:white;background:var(--red);border-color:var(--red)}.planShell{background:#fffdfa;border:1px solid var(--border);border-radius:17px;padding:12px;margin:14px 0}.planFrame{background:#fff8f0;border:1px solid #eacb9f;border-radius:14px;padding:8px;position:relative;overflow:hidden}.planFrame>img{width:100%;display:block;aspect-ratio:840/584;object-fit:contain}.planFrame .overlay{position:absolute;left:8px;top:8px;right:8px;bottom:8px;pointer-events:none}.marker{position:absolute;transform:translate(-50%,-50%);border-radius:99px;color:white;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #4d32254a}.marker.gold{background:#c89124}.marker.red{background:var(--red)}.marker.green{background:var(--green)}.marker.circle{width:28px;height:28px}.marker.label{font-size:11px;padding:5px 8px;white-space:nowrap}.legend{display:flex;gap:8px;justify-content:space-around;padding:7px 0 0;color:#917a63;font-size:10px}.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px}.flag{border-radius:99px;background:#fcf0da;color:#b06f22;padding:5px 9px;font-size:11px;white-space:nowrap;font-weight:750}.reportHero{border-radius:15px;background:linear-gradient(110deg,#a60d26,#bd3031);color:#fff;padding:16px;margin:8px 0 12px;position:relative;overflow:hidden}.reportHero .k{font-size:12px;opacity:.85}.reportHero h2{font:800 23px/1.42 var(--serif);margin:5px 0}.reportHero p{font-size:11px;margin:0;opacity:.85}.reportHero:after{content:"☁";font:400 70px var(--serif);color:#fff3;position:absolute;right:5px;bottom:-28px}.tabs{display:flex;gap:7px;margin:5px 0 11px}.tabs button{border:0;padding:9px 13px;border-radius:99px;background:var(--chip);font-size:12px;color:#916b4b;white-space:nowrap}.tabs button.active{background:var(--red);color:#fff}.miniCard{display:flex;align-items:center;gap:10px;border:1px solid #efdabb;background:#fffefd;border-radius:13px;padding:12px;margin-top:8px;width:100%;text-align:left}.miniCard .ico{width:36px;height:36px;border-radius:11px;background:#fff0db;display:grid;place-items:center;flex:0 0 auto}.ico img{width:22px;height:22px}.miniCard strong{display:block;font-size:13px}.miniCard small{display:block;font-size:11px;color:#99826e;margin-top:3px;line-height:1.6}.miniCard .arrow{margin-left:auto;color:#b89b75}.numberBadge{width:27px;height:27px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;color:white;background:#c18b23;font-weight:800}.numberBadge.green{background:var(--green)}.numberBadge.red{background:var(--red)}.numberBadge.orange{background:#c46e30}.listCard{border:1px solid #eedac0;background:#fffdfa;border-radius:13px;margin-top:6px;padding:12px;display:flex;align-items:center;gap:12px;width:100%;text-align:left}.listCard strong{font-size:13px;display:block}.listCard p{font-size:11px;color:#927b66;margin:3px 0}.listCard .arrow{margin-left:auto;color:#c5a277}.listCard:focus{border-color:var(--red)}.roomNav{display:flex;gap:4px;overflow-x:auto;margin:5px 0 10px}.roomNav button{background:var(--chip);border:0;border-radius:99px;color:#8b6548;padding:8px 17px;white-space:nowrap;font-size:12px}.roomNav button.active{background:var(--red);color:white}.infoList{display:grid;gap:8px}.infoItem{display:flex;gap:11px;align-items:flex-start;padding:12px;border:1px solid #f0dcc3;background:white;border-radius:12px}.infoItem>img{width:32px;height:32px;padding:5px;background:#fff2df;border-radius:10px}.infoItem strong{font-size:13px}.infoItem p{margin:3px 0 0;color:#85705e;font-size:11px;line-height:1.6}.priceBox{border:1px solid #ebc696;background:#fff0d9;border-radius:15px;padding:13px;display:flex;gap:15px;align-items:center}.priceBox .amount{font:700 30px/1.18 var(--serif);color:var(--red);white-space:nowrap}.priceBox strong{font-size:14px}.priceBox p{font-size:11px;color:#9c7959;margin:4px 0 0}.payMethods{display:grid;gap:8px}.payMethods.triple{grid-template-columns:repeat(3,1fr)}.payMethods button{border:1px solid #e4cdb0;background:#fffefd;border-radius:11px;min-height:52px;color:#8b6e55;text-align:center;padding:8px 4px}.payMethods button.selected{border:2px solid var(--red);padding:7px 3px}.payMethods button strong{font-size:13px;display:block}.payMethods button small{font-size:10px;display:block;margin-top:3px}.checkline{display:flex;align-items:center;gap:8px;font-size:12px;margin-top:9px;color:#82705f}.checkline strong{color:#2e8a60}.priceLarge{font:800 35px/1 var(--serif);color:var(--red);margin:4px 0}.priceMini{font-size:12px;color:#a58a75}.stripe{border-top:1px solid #ead6bd;margin:10px 0}.benefit{display:flex;gap:10px;margin:7px 0}.benefit .greencheck{color:#15936f;font-weight:800;font-size:20px}.benefit strong{font-size:13px}.benefit small{color:#a18b74;display:block;font-size:11px;margin-top:3px}.progressTrack{height:7px;background:#f0e5d7;border-radius:20px;overflow:hidden}.progressTrack>span{height:100%;display:block;background:linear-gradient(90deg,#b58220,#e6b55e);border-radius:20px;transition:width .3s}.timeline{padding:8px 0 4px;display:grid;gap:14px}.timelineLine{display:flex;gap:14px;align-items:flex-start}.timelineLine i{width:22px;height:22px;flex:0 0 auto;border-radius:50%;border:2px solid #d3b89a;background:#fff;display:grid;place-items:center;color:#fff;font-style:normal}.timelineLine.done i{background:#168e61;border-color:#168e61}.timelineLine.active i{background:#d8a145;border-color:#d8a145}.timelineLine strong{font-size:13px}.timelineLine p{font-size:11px;line-height:1.6;color:#92806f;margin:3px 0}.iconLarge{width:145px;height:145px;border:9px solid #f9e4bb;border-radius:50%;display:grid;place-items:center;margin:38px auto 20px;background:#fff8ef}.iconLarge img{width:80px;height:80px}.stateTitle{text-align:center;font:900 33px/1.3 var(--serif)}.stateSubtitle{text-align:center;color:#90765f;font-size:17px;margin:9px 0 25px}.field{display:grid;gap:5px;margin-top:12px}.field label{font-size:12px;font-weight:800}.field input{border:1px solid #e7c99f;border-radius:10px;padding:9px;background:#fff;width:100%;font-size:13px}.editableHint{border:1px solid #edd0a6;border-radius:14px;background:#fff3df;color:#916f46;padding:10px 12px;margin:10px 0;font-size:12px}.checkItem{border:1px solid #ecd3b1;border-radius:12px;padding:11px;margin:8px 0;background:white}.checkItem label{display:flex;gap:9px;align-items:center;font-size:13px;font-weight:800}.checkItem input{accent-color:#bf1a31;width:18px;height:18px}.checkItem .desc{padding:9px 10px;background:#fff5e7;border-radius:9px;margin:10px 0 0;font-size:11px;color:#987d64;line-height:1.5}.linkText{color:#a0612d;text-align:center;text-decoration:underline;background:none;border:0;font-size:12px}.modal-root:empty{display:none}.modal-root{position:absolute;z-index:12;inset:0;background:#19100ca1;display:grid;place-items:center;padding:20px}.modalCard{width:100%;border-radius:20px;background:#fffaf1;padding:20px;border:1px solid #eaca99;box-shadow:0 10px 40px #2c211c4d}.modalCard h3{margin:0;font-family:var(--serif)}.modalCard p{color:#796451;font-size:12px;line-height:1.6}.modalClose{float:right;border:0;background:none;color:var(--red);font-size:22px}.upload-preview{max-height:80px;max-width:100%;object-fit:contain;display:block;margin:8px auto}.homeTitle{font-size:28px;line-height:1.2;text-align:center;margin:6px 0;color:#28201b}.homeTitle em{font-style:normal;color:#c40e27}.homePlan{position:relative;margin:7px 0 7px}.homePlan .planFrame{border:0;background:transparent;padding:0}.homePlan .planFrame img{filter:drop-shadow(0 7px 8px #ac774c33)}.homePlan .homeRibbon{position:absolute;z-index:2;background:#fffdf8;padding:5px 7px;border-radius:8px;font-size:10px;font-weight:800;box-shadow:0 1px 6px #0002}.homeRibbon.r{left:0;top:6%;color:#b70e29;border:1px solid #e54b42}.homeRibbon.g{right:0;top:19%;color:#1c895a;border:1px solid #69b899}.homeRibbon.b{right:0;bottom:8%;color:#2b68a9;border:1px solid #81b5df}.footFeatures{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.footFeatures div{display:flex;align-items:center;gap:5px;color:#805e47;font-size:10px}.footFeatures img{width:22px;height:22px}.decorRule{font-size:10px;text-align:center;background:#fff0d8;border:1px solid #e4c28c;border-radius:99px;padding:6px;color:#987047;margin-bottom:9px}.modalChoices{display:grid;gap:8px}.quietNote{font-size:10px;text-align:center;color:#ac9580;line-height:1.5}.toast{position:absolute;z-index:12;left:12%;right:12%;bottom:100px;background:#3c332d;color:#fff;border-radius:12px;padding:12px;text-align:center;font-size:12px}.fileInput{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none} @media(max-width:800px){.studio{display:block;padding:0;background:var(--paper)}.studio-sidebar{display:none}.phone-stage{display:block}.phone{border:none;width:100%;height:100dvh;max-width:none;border-radius:0;box-shadow:none}.island{display:none}.status{display:none}#masthead{height:67px}.page{height:calc(100% - 67px)}.sticky-action{bottom:env(safe-area-inset-bottom,0px)}} @media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}} /* R2: one-page per-floor correction and annotation. All new elements remain editable DOM/CSS. */ .choiceRow{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0}.choice{border:1px solid #e7c9a2;background:#fff7e9;color:#805d43;border-radius:12px;padding:9px 11px;flex:1 1 34%;font:650 12px var(--sans);cursor:pointer}.choice.selected{border:2px solid var(--red);color:var(--red);background:#fff3ed}.floorbar{display:flex;gap:7px;overflow-x:auto;margin:10px 0}.floorbar button{border:1px solid #e6bd87;padding:9px 15px;border-radius:99px;background:#fff7e9;color:#9b723d;white-space:nowrap;font-weight:700;font-size:12px}.floorbar button.active{background:var(--red);color:white;border-color:var(--red)}.inline-control{color:#bd2630;font-size:12px;text-decoration:underline;border:0;background:none;padding:4px}.floorPreview{height:210px;width:100%;background:linear-gradient(180deg,#fffdf7,#fcf1e2);border:1px solid #e6cda8;border-radius:15px;position:relative;overflow:hidden;cursor:crosshair;display:grid;place-items:center;touch-action:manipulation}.floorTransform{width:100%;height:100%;display:grid;place-items:center;transition:transform .22s}.floorTransform img{width:90%;height:90%;object-fit:contain}.annotationOverlay{position:absolute;inset:0;pointer-events:none}.annotationChip{position:absolute;transform:translate(-50%,-50%);font-size:11px;color:white;background:#be172c;box-shadow:0 2px 7px #5434;padding:4px 7px;border-radius:12px;white-space:nowrap}.annotationChip.door{background:#b47e18}.annotationChip.window{background:#258775}.floorCoverage{display:grid;gap:3px;padding:10px;border-radius:12px;background:#fff8e9;border:1px solid #eacfaa;margin:0 0 8px}.floorCoverage b{font-size:13px}.floorCoverage span{font-size:11px;color:#896c53;line-height:1.5}.sketchPair{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.sketchPair>div{min-width:0;border:1px solid #e7d1b2;border-radius:10px;padding:8px}.sketchPair strong{font-size:11px}.sketchPair img{width:100%;height:116px;object-fit:contain}.skeletonImage{display:grid;place-items:center;background:#f8efdf;height:116px;color:#9d845e;font-size:11px;text-align:center;padding:8px}.uploadThumb{display:flex;align-items:center;gap:10px;margin:10px 0;border:1px solid #eacdab;padding:8px;border-radius:12px;color:#8c7058;font-size:12px}.uploadThumb img{max-width:90px;max-height:72px;object-fit:contain}.checkline input{width:17px;height:17px;accent-color:var(--red)}.choice:focus-visible,.inline-control:focus-visible,.floorbar button:focus-visible{outline:2px solid var(--red);outline-offset:2px} .phone{overflow:clip}.floorTransform.turned{width:58%;height:88%} /* public/r4/r4-first-batch.css */ /* R4 first batch: route-scoped native layout; not visual or single-screen acceptance. */ .phone[data-route="home"],.phone[data-route="housing"]{--paper:#fff5e6;--red:#c31226;--brown:#30251f;background:radial-gradient(ellipse at 100% 8%,#ffedcf,transparent 65%),#fff7eb} .phone[data-route="home"] #masthead{gap:12px;padding:10px 18px;height:58px} .homeBrand{display:flex;align-items:center;gap:6px;font-size:15px;color:#30251f}.homeBrand .logo-box{width:26px;height:28px;font-size:21px} .homeYear{margin:auto;padding:5px 20px;border-radius:30px;background:linear-gradient(#db3026,#b70e21);border:1px solid #e8b65c;box-shadow:0 2px 5px #a6352433;color:#fff6d7;font:700 15px/1.4 var(--serif)} .homeMenu{width:44px;height:44px;border:0;border-radius:50%;background:#fffaf0;color:#5d4737;font-size:22px} .phone[data-route="home"] .page{height:calc(100% - 58px);padding:0 18px 24px} .phone[data-route="home"] .homeTitle{font-family:"STKaiti","KaiTi","Kaiti SC",var(--serif);font-size:clamp(29px,8.3vw,36px);line-height:1.22;font-weight:900;margin:8px -4px} .phone[data-route="home"] .homeTitle em:first-child{font-size:1.13em}.phone[data-route="home"] .homeTitle em{color:#bc1026} .phone[data-route="home"] .subtitle{font-size:13px!important;line-height:1.6;margin:8px 0 12px!important} .phone[data-route="home"] .homePlan{margin:8px -9px 12px} .phone[data-route="home"] .homeRibbon{font-size:12px;line-height:1.4;padding:6px 8px} .phone[data-route="home"] .decorRule{font-size:12px;padding:7px 4px;color:#73563a;background:#fff0d6} .phone[data-route="home"] .mainBtn{min-height:48px;font-size:16px} .phone[data-route="home"] .linkText{min-height:44px;font-size:13px} .homeHouseSection{margin-top:4px}.homeHouseLinks{display:grid;grid-template-columns:1fr 1fr;gap:7px} .homeHouseLink{display:flex;align-items:center;gap:6px;min-height:64px;min-width:0;padding:5px;border:1px solid #f2dfc5;border-radius:12px;background:#fffaf1;color:#30251f;text-align:left} .homeHouseLink img{width:62px;height:48px;object-fit:cover;border-radius:7px}.homeHouseLink strong{font-size:12px;line-height:1.4}.homeHouseLink>span{margin-left:auto} .phone[data-route="home"] .footFeatures{margin:12px 0;gap:7px}.phone[data-route="home"] .footFeatures div{font-size:11px;line-height:1.5}.phone[data-route="home"] .footFeatures img{width:28px;height:28px} .phone[data-route="housing"] .page{padding-top:0;padding-bottom:96px} .phone[data-route="housing"] .eyebrow{font-size:12px;margin:4px 0 8px} .phone[data-route="housing"] .title{font-size:27px;line-height:1.22;margin-bottom:8px} .phone[data-route="housing"] .subtitle{font-size:12px;line-height:1.5;margin-bottom:10px} .phone[data-route="housing"] .countrySwitch{margin-bottom:9px;padding:3px} .phone[data-route="housing"] .countrySwitch button{min-height:44px;padding:6px} .phone[data-route="housing"] .photoWall{gap:8px} .phone[data-route="housing"] .houseCard{border-radius:13px;padding:4px} .phone[data-route="housing"] .houseCard.selected{padding:3px} .phone[data-route="housing"] .houseCard img{height:68px;aspect-ratio:auto;object-fit:cover;border-radius:9px} .phone[data-route="housing"] .houseCard strong{font-size:13px;line-height:1.4;margin:5px 4px 2px} .phone[data-route="housing"] .houseCard small{font-size:11px;line-height:1.4;margin:0 4px 3px} .phone[data-route="housing"] .panel{padding:9px;margin-top:9px;border-radius:13px} .phone[data-route="housing"] .panel .row strong{font-size:13px} .phone[data-route="housing"] .choiceRow{margin:5px 0;gap:6px} .phone[data-route="housing"] .choice{min-height:44px;padding:7px 8px;border-radius:10px;font-size:12px} .phone[data-route="housing"] .topspace{margin-top:8px} .phone[data-route="housing"] .panelNote{font-size:12px;line-height:1.5;margin:7px 0} .phone[data-route="housing"] .quietNote{font-size:12px;line-height:1.5;text-align:left} .phone[data-route="housing"] .uploadLine{min-height:64px;padding:9px;gap:9px} .phone[data-route="housing"] .uploadLine strong{font-size:14px} .phone[data-route="housing"] .uploadLine small{font-size:12px;line-height:1.4} .phone[data-route="housing"] .label{font-size:13px;margin-bottom:5px} .phone[data-route="housing"] .floorbar{flex-wrap:wrap;overflow:visible;margin:5px 0;gap:5px} .phone[data-route="housing"] .floorbar button{min-width:44px;min-height:44px;padding:7px 10px;font-size:12px} .phone[data-route="housing"] .inline-control{min-height:44px;padding:7px;font-size:12px} .phone[data-route="housing"] .uploadThumb{padding:5px;margin:6px 0}.phone[data-route="housing"] .uploadThumb img{max-height:44px} .phone[data-route="housing"] .sticky-action .fineprint{font-size:11px;line-height:1.4} @media(min-width:801px){.phone[data-route="home"] .homeTitle{font-size:34px}.phone[data-route="home"] .page{height:calc(100% - 92px)}} /* public/r4/r4-demo-visual.css */ /* R4 home + housing visual layer | editable text & independent raster/SVG. Demo match is a visual design review, not measured browser acceptance. */ .phone[data-route="home"], .phone[data-route="housing"]{ --paper:#fff3e3;--brown:#251b16;--red:#c30b22; background:radial-gradient(ellipse at 75% 15%,#ffe6bb 0,transparent 53%), radial-gradient(ellipse at 5% 78%,#ffe0b8 0,transparent 44%),#fff4e3; } .phone[data-route="home"]::before,.phone[data-route="housing"]::before{ opacity:.8;z-index:0;pointer-events:none; } .phone[data-route="home"] #masthead{height:58px;padding:7px 16px;gap:7px;justify-content:space-between} .r4-brand{display:flex;align-items:center;gap:5px;font-size:15px;white-space:nowrap;color:#291a13;letter-spacing:-.04em} .r4-brand-seal{font:800 21px/1 "Noto Serif CJK SC","STSong",serif;color:#fff; background:linear-gradient(145deg,#ef352a,#b60821);width:28px;height:29px;border:1px solid #f3b761; border-radius:9px;display:grid;place-items:center;box-shadow:0 2px 5px #b42f253d} .r4-year{white-space:nowrap;border:1px solid #f3ae51;box-shadow:0 3px 8px #a43f2740; padding:6px 12px;border-radius:99px;background:linear-gradient(180deg,#e63b29,#b80824); color:#fff8e8;font:800 14px/1.2 "Noto Serif CJK SC","STSong",serif} .r4-dots{border:0;background:#fff9ec;border-radius:99px;width:42px;height:42px;color:#574133;font-size:20px;flex:0 0 auto} .phone[data-route="home"] .page{padding:0 16px 13px;overflow-y:auto; height:calc(100% - 92px)} .phone[data-route="home"] .sceneRoot{position:relative} .phone[data-route="home"] .sceneRoot:before{content:"";position:absolute;top:19px;left:-18px; width:80px;height:102px;background:radial-gradient(ellipse at bottom right,#e4aa72b7 0,transparent 64%);opacity:.43;pointer-events:none} .phone[data-route="home"] .sceneRoot:after{content:"✿";position:absolute;top:15px;right:-10px;color:#d9916c; font:32px/1 serif;opacity:.4;pointer-events:none} .r4-home-hero{position:relative;z-index:1} .r4-home-title{text-align:center;font-family:"Kaiti SC","STKaiti","AR PL KaitiM GB","Noto Serif CJK SC","Songti SC",serif; font-size:clamp(27px,7.4vw,34px);font-weight:900;line-height:1.13;letter-spacing:-.035em; color:#1d1715;margin:0 auto 6px;max-width:100%;text-shadow:0 1px #fff3dd} .r4-home-title span{display:block;white-space:nowrap} .r4-home-title em{font-style:normal;color:#b90620;font-weight:900} .r4-title-first em{font-size:1.15em;margin-right:.05em} .r4-title-second em{font-size:1.25em;margin-right:.045em} .r4-home-intro{font-family:"Noto Sans CJK SC","PingFang SC","Microsoft YaHei",sans-serif; text-align:center;line-height:1.5;font-size:11.5px;color:#58463c;margin:3px 0 3px} .r4-plan-art{position:relative;margin:0 -10px;overflow:visible;aspect-ratio:1.49/1;isolation:isolate} .r4-plan-art>img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0px 7px 7px #5f432647)} .r4-ping{position:absolute;z-index:4;border-radius:9px;box-shadow:0 2px 6px #50351e38; font-family:"Noto Sans CJK SC","Microsoft YaHei",sans-serif;letter-spacing:-.01em;white-space:nowrap} .r4-ping b{font-weight:900;display:block}.r4-ping small{display:block;font-size:8.5px;line-height:1.25;margin-top:2px} .r4-kitchen{left:1%;top:1%;font-size:10px;line-height:1.22;color:#be1729;background:#fff8f0;border:1.5px solid #e9534a;padding:5px 7px} .r4-health{right:5%;top:16%;color:#fff;background:linear-gradient(110deg,#42bb7b,#118b55);padding:6px 9px;font-size:12px;font-weight:900} .r4-wealth{left:3%;bottom:33%;color:#fff;background:linear-gradient(90deg,#ce942a,#a66e0b);padding:5px 9px;font-size:12px;font-weight:900} .r4-peach{right:1%;bottom:34%;color:#fff;background:linear-gradient(90deg,#f23e69,#c31243);padding:6px 9px;font-size:11px;font-weight:900} .r4-bedroom{right:0;bottom:8%;padding:5px 6px;background:#edf7ff;border:1.5px solid #307ac6;color:#1459a4;font-size:9.5px;line-height:1.2} .r4-locator{position:absolute;z-index:3;display:block;width:17px;height:17px;border:3px solid #fff; border-radius:50%;box-shadow:0 0 0 2px currentColor,0 0 0 8px color-mix(in srgb,currentColor 22%,transparent)} .r4-loc-red{color:#f32237;background:#f32237;left:36%;top:29%} .r4-loc-green{color:#20b66a;background:#20b66a;right:28%;top:35%} .r4-loc-gold{color:#d7ac23;background:#d7ac23;left:24%;bottom:29%} .r4-loc-pink{color:#f04d85;background:#f04d85;right:18%;bottom:31%} .r4-loc-blue{color:#2579d7;background:#2579d7;right:27%;bottom:22%} .r4-decor-rule{margin:4px 0 7px;padding:5px 3px;text-align:center;color:#684d36; background:linear-gradient(180deg,#fff7e7,#ffedcf);border:1px solid #e8c492; border-radius:99px;font-size:11px;line-height:1.25} .r4-decor-rule strong{color:#be0a24;font:900 17px/1 "Noto Serif CJK SC",serif} .r4-main-cta{display:flex;align-items:center;justify-content:center;gap:8px; border-color:#ff7562;min-height:47px;padding:8px 14px;font-size:15px; background:linear-gradient(#f0222b,#ba0020);box-shadow:0 5px 9px #c51b2833} .r4-main-cta span{font-size:25px;font-weight:400;line-height:.65} .r4-home-upload{display:flex;align-items:center;justify-content:center;gap:2px;margin:4px 0 7px; font-size:11px;line-height:1.4;color:#654936} .r4-home-upload button{background:none;border:0;color:#36251b;font-weight:700;padding:4px 6px;min-height:29px;font-size:11px} .r4-home-houses{position:relative;margin-top:1px} .r4-home-house-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px} .r4-home-house{display:flex;align-items:center;min-width:0;min-height:60px;gap:6px;padding:5px 7px 5px 5px; background:#fffdfa;border:1px solid #f2e1cd;border-radius:13px;text-align:left;box-shadow:0 3px 9px #9b734014} .r4-home-house img{width:67px;height:48px;min-width:67px;object-fit:cover;border-radius:8px;background:#f8e9d2} .r4-home-house b{font-size:11px;line-height:1.35;color:#2a2019;white-space:nowrap;letter-spacing:-.05em} .r4-home-house span{font-size:19px;color:#70513d;margin-left:auto} .r4-home-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0 0} .r4-home-benefits>div{min-width:0;display:flex;align-items:center;justify-content:center;gap:4px; color:#5f4734;font-size:9px;line-height:1.42} .r4-home-benefits img{width:31px;height:31px;border-radius:50%;background:#fff0d6;border:1px solid #eac487;padding:5px;flex-shrink:0} /* Housing selection — only selection/upload live here. Orientation/annotation remain existing subsequent pages, not concealed inside a clipped scroll area. */ .phone[data-route="housing"] .page{padding:2px 16px 98px;overflow-y:auto} .r4-housing-view{position:relative} .r4-housing-top{position:relative} .r4-step{color:#a42c21;font-size:11px;line-height:1.25;font-weight:850;letter-spacing:.05em;margin:1px 0 7px} .r4-housing-top h1{font:900 26px/1.18 "Noto Serif CJK SC","Source Han Serif SC","Songti SC",serif;letter-spacing:-.035em;margin:0;color:#241b16} .r4-housing-top em{font-style:normal;color:#bd0b23} .r4-housing-top>p:last-child{font-size:11px;line-height:1.45;color:#876d55;margin:6px 0 10px} .r4-region-switch{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:12px; background:#f1e7d9;gap:4px;margin:0 0 11px} .r4-region-switch button{border:0;min-height:42px;padding:5px 4px;font-size:13px;font-weight:750;border-radius:10px;background:transparent;color:#a48a77} .r4-region-switch button.active{background:linear-gradient(100deg,#db2329,#b9071e);color:white;box-shadow:0 2px 7px #bd2d3035} .r4-housing-caption,.r4-upload-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 7px} .r4-housing-caption b,.r4-upload-heading b{font-size:13px;color:#32231b} .r4-housing-caption span,.r4-upload-heading span{font-size:11px;color:#a68771} .r4-housing-grid{gap:8px} .r4-house-card{border-radius:15px;padding:6px 6px 8px;box-shadow:0 4px 11px #8d633b12;background:linear-gradient(#fffdfa,#fffaf6);border:1.5px solid #efd9b8} .r4-house-card.selected{border:2px solid #c30d28;padding:5.5px 5.5px 7.5px} .r4-house-card img{height:79px;width:100%;display:block;object-fit:cover;aspect-ratio:auto;border-radius:9px} .r4-house-card strong{font-size:12.5px;line-height:1.2;margin:7px 5px 3px;color:#241a15} .r4-house-card small{font-size:10px;line-height:1.25;margin:0 5px;color:#a8866b;min-height:12px} .r4-house-card .houseCheck{top:7px;right:7px;width:25px;height:25px;font-size:17px} .r4-floor-chooser{margin-top:11px;border:1px solid #f0dbc0;background:#fffaf2;padding:7px 10px;border-radius:13px} .r4-floor-line{display:flex;justify-content:space-between;align-items:center;gap:6px} .r4-floor-line>b{font-size:13px} .r4-floor-buttons{display:flex;gap:5px} .r4-floor-buttons button{min-width:77px;min-height:37px;border:1px solid #dfc8a7;border-radius:9px;background:#fff8ed;color:#885f40;padding:6px 9px;font-size:12px;font-weight:750} .r4-floor-buttons button.active{border-color:#c31225;background:#fff0ed;color:#bd0d21} .r4-floor-extra{margin:8px 0 1px;border-top:1px dashed #dfbf9b;padding-top:7px} .r4-floor-head{display:flex;align-items:center;justify-content:space-between;gap:4px} .r4-floor-head .floorbar{margin:0;display:flex;gap:4px;flex-wrap:nowrap;flex:1;overflow-x:auto} .r4-floor-head .floorbar button{min-height:37px;padding:6px 10px;font-size:11px} .r4-add-floor{min-height:37px;border:0;background:transparent;padding:6px 4px;color:#ba2430;text-align:right;font-size:11px;white-space:nowrap} .r4-sheet-buttons{display:flex;gap:5px;margin-top:7px} .r4-sheet-buttons button{flex:1;min-height:37px;border:1px solid #e5cda8;border-radius:9px;background:#fff9ee;color:#8c7257;font-size:11px;padding:4px} .r4-sheet-buttons button.active{color:#b9102a;border-color:#bf3544;background:#fff0ed} .r4-upload-section{margin-top:10px} .r4-upload-link{min-height:62px;display:flex;gap:9px;align-items:center; border:1px dashed #d9a15d;background:#fff7e8;padding:9px 11px;border-radius:12px;cursor:pointer} .r4-upload-link img{width:35px;height:35px;flex-shrink:0;border:1px solid #e6bc75;border-radius:10px;background:white;padding:6px} .r4-upload-link>span{flex:1;min-width:0;line-height:1.3} .r4-upload-link b{display:block;font-size:13px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap} .r4-upload-link small{display:block;font-size:10px;color:#a38567;margin-top:4px} .r4-upload-link i{font-style:normal;color:#bd1728;font-size:24px} .r4-upload-preview{margin-top:6px;display:flex;align-items:center;gap:9px;font-size:10px;color:#9b795f} .r4-upload-preview img{width:48px;height:42px;object-fit:contain} .r4-housing-hint{margin:8px 0 3px;font-size:10px;line-height:1.45;color:#ad9073} .phone[data-route="housing"] .sticky-action{left:15px;right:15px;bottom:6px;gap:4px} .phone[data-route="housing"] .sticky-action .mainBtn{height:48px;font-size:15px} .phone[data-route="housing"] .sticky-action .fineprint{font-size:10px} /* Responsive art direction for compact and wide phone sizes. */ @media (max-width:800px){ .phone[data-route="home"] .page{height:calc(100% - 58px)} .phone[data-route="housing"] .page{padding-bottom:105px} } @media(max-width:370px){ .r4-home-title{font-size:27px;letter-spacing:-.045em} .r4-home-intro{font-size:10.5px} .r4-plan-art{margin:0 -7px;aspect-ratio:1.55/1} .r4-ping{transform:scale(.88)}.r4-kitchen{transform-origin:top left}.r4-bedroom{transform-origin:bottom right} .r4-home-house{gap:4px;padding:4px}.r4-home-house img{width:56px;min-width:56px;height:45px} .r4-home-house b{font-size:10px} .r4-house-card img{height:67px} .r4-housing-top h1{font-size:24px} } @media(max-height:780px){ .r4-home-title{font-size:27px}.r4-home-intro{font-size:10.5px} .r4-plan-art{aspect-ratio:1.56/1} .r4-home-house{min-height:53px}.r4-home-house img{height:43px} .r4-housing-top>p:last-child{margin-bottom:6px} .r4-region-switch{margin-bottom:7px}.r4-house-card img{height:66px} } @media (prefers-reduced-motion:reduce){.r4-plan-art *{animation:none!important}} /* R4 home visual delta — photoreal residence + separate ornament + ink hierarchy. * Scope is HOME ONLY. Housing selections, photos, upload and routing unchanged. * The hero is separately replaceable webp. Text, pings and controls stay native DOM. */ .phone[data-route="home"]{ background-image:url("/public/r4/assets/home-paper-grain.png"), radial-gradient(ellipse at 90% 28%,rgba(244,196,132,.32),transparent 50%), radial-gradient(ellipse at 0% 71%,rgba(251,216,159,.19),transparent 42%), linear-gradient(180deg,#fff5e8,#fff1db 72%,#fff4e8); background-size:192px 192px,auto,auto,auto; background-repeat:repeat,no-repeat,no-repeat,no-repeat; } .phone[data-route="home"] .sceneRoot::before, .phone[data-route="home"] .sceneRoot::after{content:none!important} .r4-home-ornament{position:absolute;z-index:0;left:-16px;top:-58px; width:calc(100% + 32px);height:auto;max-width:none;pointer-events:none; user-select:none;opacity:.98} .phone[data-route="home"] .r4-home-houses{position:relative;z-index:1} /* calligraphic family: local editable font fallback, not a bundled unlicensed font */ .phone[data-route="home"] .r4-home-title{ font-family:"STKaiti","Kaiti SC","KaiTi","DFKai-SB","AR PL KaitiM GB","Noto Serif CJK SC",serif; line-height:1.10;letter-spacing:-.045em;font-weight:950; color:#18110f;text-shadow:.42px 0 currentColor,-.18px 0 currentColor; margin-top:1px;margin-bottom:5px; } .phone[data-route="home"] .r4-home-title em{color:#b5081d; text-shadow:.4px 0 currentColor, -.15px .2px currentColor} .phone[data-route="home"] .r4-title-first em{font-size:1.22em;letter-spacing:-.05em;display:inline-block;transform:rotate(-1deg)} .phone[data-route="home"] .r4-title-second em{font-size:1.39em;letter-spacing:-.05em;display:inline-block;transform:skew(-2.5deg)} /* ornate but still native, editable year text */ .phone[data-route="home"] .r4-year{ position:relative;border:1.5px solid #d79733; background:linear-gradient(180deg,#db361b 0%,#bf0e19 56%,#a60d21 100%); box-shadow:inset 0 0 0 1px #fcbe5e,0 3px 8px #a43f2740; padding-left:14px;padding-right:14px; } .phone[data-route="home"] .r4-year::before,.phone[data-route="home"] .r4-year::after{ content:"";position:absolute;top:50%;width:7px;height:7px;border:1px solid #e2ad5f; background:linear-gradient(135deg,#d52b1c,#a5101d);transform:translateY(-50%) rotate(45deg)} .phone[data-route="home"] .r4-year::before{left:-5px} .phone[data-route="home"] .r4-year::after{right:-5px} .phone[data-route="home"] .r4-plan-art{ background:radial-gradient(ellipse at 50% 58%,#f7d39a44 0%,transparent 72%); aspect-ratio:1.45/1;isolation:isolate;overflow:visible; } .phone[data-route="home"] .r4-plan-art .r4-floor-photo{ display:block;width:100%;height:100%;object-fit:fill; filter:drop-shadow(0 7px 6px rgba(89,55,34,.30)) saturate(1.06); } .phone[data-route="home"] .r4-plan-art::before{ content:"";position:absolute;inset:7% 3% 2%;pointer-events:none;z-index:-1; background:radial-gradient(ellipse at 52% 59%,rgba(207,160,80,.30),transparent 70%); filter:blur(14px) } .phone[data-route="home"] .r4-locator{ box-shadow:0 0 0 2px currentColor,0 0 0 8px color-mix(in srgb,currentColor 18%,transparent),0 0 18px currentColor; } .phone[data-route="home"] .r4-decor-rule{ background:linear-gradient(180deg,#fff8e8f5,#ffedd0f5); border-color:#dfb87f; } @media(max-width:375px){.phone[data-route="home"] .r4-home-title{font-size:27px}} /* public/r4/r4-owner-fixes.css */ /* R4 owner repair overlay: keeps approved photos, art and editable HTML. */ .phone:not([data-route="home"]){ --paper:#fff3e3;--brown:#261c16;--red:#c30b22; background-image:url("/public/r4/assets/home-paper-grain.png"), radial-gradient(ellipse at 83% 15%,rgba(245,195,125,.25),transparent 55%), radial-gradient(ellipse at 4% 84%,rgba(255,218,170,.18),transparent 47%), linear-gradient(180deg,#fff5e8,#fff1dc 74%,#fff5e8); background-repeat:repeat,no-repeat,no-repeat,no-repeat; background-size:192px 192px,auto,auto,auto; } .phone:not([data-route="home"]) .sceneRoot{position:relative;isolation:isolate} .phone:not([data-route="home"]) .sceneRoot::after{ content:"";position:absolute;top:3px;right:-16px;width:128px;height:168px; background:url("/public/r4/assets/home-heritage-decor.svg") right top/auto 330px no-repeat; opacity:.24;pointer-events:none;z-index:-1; } .phone:not([data-route="home"]) #masthead{height:64px} .phone:not([data-route="home"]) .page{height:calc(100% - 98px);padding:5px 14px 96px;overflow-x:hidden;overflow-y:auto} .phone:not([data-route="home"]) .sticky-action{left:14px;right:14px;bottom:6px;padding-top:8px} .phone:not([data-route="home"]) .sticky-action .fineprint{font-size:10px} .phone:not([data-route="home"]) .sticky-action .mainBtn{min-height:46px;height:auto} .phone[data-route="home"] .r4-dots{ box-sizing:border-box;flex:0 0 44px;width:44px;min-width:44px;height:44px;min-height:44px; padding:0;display:grid;place-items:center;overflow:hidden; font-size:0!important;line-height:1;letter-spacing:0!important; border:1px solid rgba(217,169,104,.5);position:relative;z-index:4; } .r4-dots::after{content:"•••";font-size:16px;font-weight:900;letter-spacing:2px;line-height:1;color:#5d4432} .r4-dots:focus-visible{outline:2px solid #b91828;outline-offset:3px} .phone .r4-step{font-size:11px;margin:0 0 4px;color:#b03a29;letter-spacing:.04em} .r4-fast-housing,.r4-fast-confirm,.r4-fast-direction,.r4-fast-processing,.r4-fast-addon{position:relative;z-index:1} .r4-fast-housing h1,.r4-fast-confirm h1,.r4-fast-direction h1, .r4-fast-processing h1,.r4-fast-addon h1{ margin:0;color:#291c15;font:900 24px/1.22 "Noto Serif CJK SC","Songti SC","STSong",serif;letter-spacing:-.025em } .r4-fast-housing h1 em,.r4-fast-confirm h1 em,.r4-fast-direction h1 em, .r4-fast-processing h1 em,.r4-fast-addon h1 em{color:#c30b22;font-style:normal} .r4-fast-description{color:#8d7059;font-size:12px;line-height:1.45;margin:5px 0 8px} .r4-fast-caption,.r4-fast-upload-line{display:flex;justify-content:space-between;align-items:center;gap:8px} .r4-fast-caption{margin:4px 0} .r4-fast-caption b,.r4-fast-upload-line b{font-size:12px} .r4-fast-caption small{font-size:11px;color:#9a7f68} .phone[data-route="housing"] .r4-region-switch{margin:0 0 6px;padding:3px} .phone[data-route="housing"] .r4-region-switch button{min-height:40px;font-size:12px} .phone[data-route="housing"] .r4-housing-grid{gap:6px} .phone[data-route="housing"] .r4-house-card{padding:4px;border-radius:12px} .phone[data-route="housing"] .r4-house-card.selected{padding:3px} .phone[data-route="housing"] .r4-house-card img{height:57px;border-radius:8px} .phone[data-route="housing"] .r4-house-card strong{font-size:12px;margin:5px 5px 2px} .phone[data-route="housing"] .r4-house-card small{font-size:10px;margin:0 5px 2px} .phone[data-route="housing"] .r4-house-card .houseCheck{width:24px;height:24px} .r4-setting-row{ display:flex;justify-content:space-between;align-items:center;gap:8px; width:100%;min-height:44px;margin:7px 0 5px;padding:8px 12px; background:#fffaf4;border:1px solid #eacda3;border-radius:12px; text-align:left;color:#5b4334;font-size:12px;font-weight:700 } .r4-setting-row b{color:#bb162b} .r4-fast-upload-line{margin:6px 0 4px} .r4-fast-upload-line label{display:flex;gap:6px;align-items:center;color:#8c715c;font-size:11px} .r4-fast-upload-line select{border:1px solid #dfbd91;border-radius:9px;background:#fffdf6;color:#604b3a; font-size:12px;min-height:38px;padding:5px 22px 5px 7px;max-width:105px} .r4-fast-file{display:flex;align-items:center;gap:10px;min-height:48px; border:1px dashed #d6a35d;border-radius:12px;background:#fff8ec;padding:5px 10px;cursor:pointer} .r4-fast-file img{width:30px;height:30px;background:white;border:1px solid #e8cda7;border-radius:8px;padding:5px} .r4-fast-file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:12px;font-weight:700} .r4-fast-file b{font-size:22px;color:#c31226} .r4-fast-photo-state{font-size:10.5px;line-height:1.4;margin:5px 0 0;color:#936f50} .r4-fast-sketch,.r4-independent-link{display:block;border:none;background:transparent;color:#bf1e32; min-height:40px;text-align:left;padding:6px 1px;font-size:12px} .r4-compact-floors .floorbar{margin:4px 0;display:flex;gap:4px;overflow-x:auto;min-height:42px} .r4-compact-floors .floorbar button{min-height:40px;padding:8px 15px;font-size:12px} .r4-fast-confirm .r4-mini-warning{margin:6px 0} .r4-mini-warning{font-size:11px;line-height:1.45;border-radius:9px;background:#fff3e8;border:1px solid #edd4b8;color:#9f553b;padding:5px 8px} .r4-small-preview{display:flex;align-items:center;gap:9px;margin:7px 0;padding:8px; background:#fffdfa;border:1px solid #efd5b1;border-radius:13px;min-height:89px} .r4-small-preview img{width:96px;height:72px;object-fit:contain;flex:0 0 auto;border-radius:6px;background:#f8eedc} .r4-small-preview>div{flex:1;min-width:0} .r4-small-preview strong{display:block;font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .r4-small-preview span,.r4-small-preview small{display:block;color:#99745b;line-height:1.45;font-size:10.5px;margin-top:2px} .r4-small-preview small{color:#c02938} .r4-status-line{display:flex;align-items:flex-start;gap:7px;color:#8c6d53;font-size:11px;line-height:1.5} .r4-status-line b{color:#ac1c30;flex:0 0 auto} .r4-verified-choice,.r4-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:7px 0} .r4-verified-choice button,.r4-quick-actions button, .r4-modal-buttons button{ background:#fffaf2;border:1px solid #e6c69d;border-radius:10px; min-height:44px;padding:7px;color:#79573f;font-size:12px;font-weight:700 } .r4-verified-choice button.active,.r4-modal-buttons button.picked{background:#c3102a;color:white;border-color:#c3102a} .r4-verified-choice button.active-secondary{background:#fff7e8;border-color:#d5a868} .r4-confirm-check{display:flex;align-items:center;gap:9px;background:#fffbf5;border:1px solid #eddbbe; border-radius:10px;min-height:44px;padding:6px 9px;font-size:12px;font-weight:700;color:#68472f} .r4-confirm-check input{width:19px;height:19px;accent-color:#c30b22;flex:0 0 auto} .r4-independent-link{width:100%;text-align:center;margin:2px 0 0} .r4-independent-link small{display:inline;font-size:10px;color:#988273} .r4-coverage{display:grid;gap:4px;background:#fff9ee;border:1px solid #e9d6b8; border-radius:12px;padding:8px 10px;margin:7px 0;font-size:11px;color:#79553c} .r4-coverage>b{font-size:12px} .r4-coverage>div{display:flex;justify-content:space-between;gap:8px} .r4-coverage strong{flex:0 0 auto;font-size:11px} .r4-coverage span{text-align:right} .r4-coverage small{color:#a17e61;font-size:10px;line-height:1.4} .r4-fast-direction .r4-compass-guide{display:flex;align-items:center;gap:12px;border:1px solid #ebd5b5; border-radius:14px;background:#fffaf3;margin:10px 0;padding:9px} .r4-compass-guide img{width:100px;height:100px;flex:0 0 auto} .r4-compass-guide b{font-size:13px} .r4-compass-guide p{margin:5px 0 0;color:#866c54;font-size:11.5px;line-height:1.5} .r4-direction-field{display:block;margin:10px 0 0} .r4-direction-field b{display:block;color:#3f2d21;font-size:13px;margin-bottom:5px} .r4-direction-field select{display:block;width:100%;min-height:46px; padding:9px 13px;background:#fffdfa;color:#78553c;border:1px solid #e5c39b;border-radius:11px;font-size:13px} .r4-direction-footnote{font-size:11px;line-height:1.55;color:#987459;margin:8px 0 0} .r4-fast-processing .r4-progress-card{display:grid;gap:9px;text-align:center; margin:13px 0 8px;background:#fff9f0;border-radius:16px;border:1px solid #e9d0aa;padding:15px} .r4-progress-card b{font-size:14px} .r4-demo-symbol{width:68px;height:68px;border:2px solid #e3bb79;border-radius:50%; display:grid;place-items:center;margin:auto;background:#c41029;color:white;font:900 32px "Noto Serif CJK SC",serif} .r4-fast-processing .progressTrack{margin:4px 0} .r4-fast-addon .priceBox{margin-top:12px;justify-content:space-between;flex-wrap:wrap} .r4-fast-addon .priceBox strong{font-size:14px;color:#b91028} .r4-fast-addon .priceBox span{font-size:11px;color:#8d7156} .r4-addon-art{height:158px;display:grid;place-items:center;background:#fffaf1;border:1px solid #ecd1ad;border-radius:13px;margin-top:11px} .r4-addon-art img{width:100%;height:100%;object-fit:contain} .r4-addon-steps{display:grid;gap:6px;margin-top:10px} .r4-addon-steps>div{padding:7px 9px;border:1px solid #edddc6;background:#fffdfa;border-radius:10px;display:flex;justify-content:space-between;gap:8px;font-size:12px} .r4-addon-steps b{white-space:nowrap;color:#ae1c32} .r4-addon-steps span{color:#80644e} .r4-demo-banner{padding:11px 13px;background:#fff2e5;border:2px solid #d59552; color:#7c3f2a;border-radius:13px;margin:6px 0 11px;display:grid;gap:5px;font-size:12px;line-height:1.5} .r4-demo-banner b{color:#c0152d;font-size:14px} .r4-secondary-footer{min-height:40px;border:0;background:transparent;color:#a14e35;font-size:12px} .r4-modal{max-height:calc(100% - 34px);overflow-y:auto} .r4-modal p{line-height:1.5} .r4-modal-buttons{display:flex;gap:6px;flex-wrap:wrap;margin:9px 0} .r4-modal-buttons button{flex:1 1 27%;min-width:70px} .r4-modal-label{display:block;font-size:12px;font-weight:700;margin-top:8px} .r4-modal-label input{width:100%;min-height:42px;margin-top:5px;border:1px solid #dcb98c;border-radius:8px;padding:9px} .r4-edit-stage{width:100%;height:232px;background:#fcf4e7;border:1px solid #e3c89f;border-radius:12px; display:grid;place-items:center;overflow:hidden;touch-action:manipulation;cursor:crosshair} .r4-edit-transform{width:210px;height:210px;display:grid;place-items:center;position:relative;transform-origin:50% 50%} .r4-edit-transform img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none} .r4-mark-layer{position:absolute;inset:0;pointer-events:none} .r4-human-mark{position:absolute;transform:translate(-50%,-50%);border-radius:99px; background:#b71834;color:white;padding:4px 6px;box-shadow:0 1px 6px #56332277; white-space:nowrap;font-size:10px;font-weight:700} .r4-human-mark.door{background:#c58c21} .r4-human-mark.window{background:#258973} @media(max-width:800px){ .phone:not([data-route="home"]) .page{height:calc(100% - 64px);padding-bottom:96px} .phone:not([data-route="home"]) #masthead{height:64px} .r4-modal{max-height:calc(100dvh - 36px)} } @media(max-height:765px){ .phone[data-route="housing"] .r4-house-card img{height:48px} .r4-fast-housing h1,.r4-fast-confirm h1{font-size:22px} .r4-fast-description{margin:3px 0 5px} .r4-fast-caption{margin:2px 0} .r4-setting-row{margin:5px 0 3px} .r4-fast-file{min-height:44px} .r4-fast-photo-state{margin-top:3px} .phone:not([data-route="home"]) .page{padding-bottom:91px} .r4-small-preview{min-height:76px;padding:5px;margin:5px 0} .r4-small-preview img{width:85px;height:64px} .r4-verified-choice,.r4-quick-actions{margin:4px 0} .r4-coverage{margin:4px 0;padding:6px 8px} .r4-compass-guide img{width:88px;height:88px} .r4-fast-direction .r4-compass-guide{margin:6px 0} .r4-direction-field{margin-top:7px} .r4-addon-art{height:120px} } @media(max-width:355px){ .r4-small-preview img{width:70px} .r4-fast-housing h1{font-size:21px} .r4-fast-housing .r4-house-card strong{font-size:11px} .r4-fast-direction .r4-compass-guide{gap:7px} .r4-compass-guide img{width:77px;height:77px} } /* public/r4/r4-compact-flow.css */ /* R4 concentrated layout V1 | frozen parent b3fe7b54 * No R4 assets, business engine, payment logic or mock guards replaced. * Required operations fit primary viewport at 360/390/430×844 and 390×700 by * moving low-frequency layer management into accessible sheets. * Browser acceptance remains PENDING, not claimed from authored CSS. */ .phone{--r4c-vpadding:14px;--r4c-red:#c10d28;--r4c-brown:#30221b;--r4c-border:#ecd3ac} .phone[data-route="home"] #masthead .r4-dots{ width:44px;min-width:44px;height:44px;min-height:44px;flex:0 0 44px; display:grid;place-items:center;padding:0;overflow:visible; background:#fff8ed;border:1px solid #ead5b4;border-radius:50%; cursor:pointer;position:relative;z-index:7;box-sizing:border-box; } .phone[data-route="home"] .r4-dots::after{content:none!important;display:none!important} .r4c-dots-visual{display:flex;align-items:center;justify-content:center;gap:5px;width:27px;height:22px;pointer-events:none} .r4c-dots-visual i{width:5px;height:5px;flex:0 0 5px;border-radius:50%;background:#604435;display:block} .phone[data-route="home"] .r4-dots:focus-visible{outline:2px solid var(--r4c-red);outline-offset:3px} /* Distinctly scoped operation screens. Home / unlock / report remain long-scroll exceptions. */ .phone[data-route="housing"] .page, .phone[data-route="confirm"] .page, .phone[data-route="orientation"] .page, .phone[data-route="processing"] .page, .phone[data-route="pay-status"] .page, .phone[data-route="addon"] .page, .phone[data-route="addon-pay"] .page, .phone[data-route="addon-result"] .page, .phone[data-route="error"] .page, .phone[data-route="report-error"] .page{ padding:4px var(--r4c-vpadding) 85px!important; height:calc(100% - 64px)!important; overflow-y:auto!important;overflow-x:hidden; scrollbar-width:none; } .phone[data-route="pay-status"] .page, .phone[data-route="addon"] .page, .phone[data-route="addon-pay"] .page{padding-bottom:130px!important} .phone[data-route="housing"] #masthead, .phone[data-route="confirm"] #masthead, .phone[data-route="orientation"] #masthead, .phone[data-route="processing"] #masthead, .phone[data-route="pay-status"] #masthead, .phone[data-route="addon"] #masthead, .phone[data-route="addon-pay"] #masthead, .phone[data-route="addon-result"] #masthead, .phone[data-route="error"] #masthead, .phone[data-route="report-error"] #masthead{height:64px} .phone .r4c-screen{position:relative;z-index:1;min-width:0;color:#35251d;font-family:var(--sans)} .r4c-screen button,.r4c-screen select,.r4c-sheet button,.r4c-sheet input{ font-family:var(--sans); } .r4c-screen button:focus-visible,.r4c-screen select:focus-visible, .r4c-sheet button:focus-visible,.r4c-sheet input:focus-visible{outline:2px solid #c10d28;outline-offset:2px} .r4c-top{margin:0 0 8px}.r4c-step{margin:0 0 3px;font-size:11.5px;line-height:1.45;font-weight:800;color:#ae3325;letter-spacing:.035em} .r4c-top h1{margin:0;font:900 23px/1.2 "Noto Serif CJK SC","Songti SC","STSong",serif;letter-spacing:-.025em;color:#271e19} .r4c-top h1 em{font-style:normal;color:#bc1028} .r4c-top>p:last-child{font-size:12px;line-height:1.45;color:#93765f;margin:4px 0 0} .r4c-screen .countrySwitch.r4-region-switch{margin:4px 0 8px;padding:3px;gap:3px} .r4c-screen .countrySwitch.r4-region-switch button{min-height:44px;padding:7px 4px;font-size:12px} .r4c-line-label,.r4c-file-label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:5px 0} .r4c-line-label strong,.r4c-file-label strong{font-size:12.5px;color:#34261d} .r4c-line-label span{font-size:11px;color:#9b8069} .r4c-file-label button{min-height:44px;padding:5px 8px;border:0;background:none;color:#ae2a34;font-size:12px;font-weight:700} .r4c-houses .photoWall.r4-housing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px} .r4c-houses .r4-house-card,.r4c-houses .houseCard{ display:flex;align-items:center;position:relative;min-width:0;min-height:70px;max-height:70px; padding:4px 7px 4px 4px;border-radius:12px;gap:6px; background:#fffcf5;border:1.5px solid #e9d5b8;box-shadow:0 2px 8px #9d76441a; } .r4c-houses .r4-house-card.selected,.r4c-houses .houseCard.selected{ border:2px solid var(--r4c-red);padding:3.5px 6.5px 3.5px 3.5px; } .r4c-houses .r4-house-card img,.r4c-houses .houseCard img{ width:65px!important;min-width:65px!important;height:59px!important; object-fit:cover;flex:0 0 65px;border-radius:8px } .r4c-houses .r4-house-card strong,.r4c-houses .houseCard strong{ font-size:12px!important;line-height:1.36;font-weight:850; margin:0!important;color:#2d231e;word-break:break-word } .r4c-houses .r4-house-card small,.r4c-houses .houseCard small{display:none} .r4c-houses .houseCheck{ top:4px;right:4px;width:20px;height:20px;font-size:12px;border:1.5px solid white } .r4c-summary-row{ display:flex;align-items:center;justify-content:space-between;gap:10px; padding:5px 10px;width:100%;min-height:48px;text-align:left; margin:8px 0 4px;background:#fffaf3;border:1px solid var(--r4c-border); border-radius:12px;color:#6c4e36 } .r4c-summary-row>span{min-width:0} .r4c-summary-row b{display:block;font-size:12.5px;color:#38271b} .r4c-summary-row small{display:block;margin-top:2px;font-size:10.5px;color:#936f57} .r4c-summary-row strong{font-size:12px;color:var(--r4c-red);white-space:nowrap} .r4c-coverage{font-weight:700} .r4c-floor-tabs{ display:flex;flex-wrap:nowrap;gap:5px;align-items:center;margin:4px 0; min-height:44px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#deb983 transparent } .r4c-floor-tabs button{ min-height:44px;min-width:60px;padding:8px 11px;border:1px solid #e5c598;border-radius:99px; background:#fffaf2;color:#936438;font-weight:700;font-size:12px;white-space:nowrap;flex-shrink:0 } .r4c-floor-tabs button.active{background:#c10d28;border-color:#c10d28;color:white} .r4c-file-label{margin:4px 0 1px} .r4c-file-pick{ display:flex;align-items:center;gap:9px;min-height:48px;padding:6px 10px; border:1px dashed #d6a569;border-radius:12px;background:#fff9ed;cursor:pointer } .r4c-file-pick img{width:30px;height:30px;padding:5px;background:#fff;border:1px solid #e8cba4;border-radius:8px;flex:0 0 30px} .r4c-file-pick span{flex:1;min-width:0;font-size:12.5px;font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .r4c-file-pick b{font-size:12px;color:var(--r4c-red);white-space:nowrap} .r4c-truth{font-size:11px;line-height:1.45;color:#92715c;margin:5px 0 0} .r4c-preview-card{background:#fffbf5;border:1px solid #ebd2ac;border-radius:14px;padding:7px;margin:5px 0} .r4c-preview-head,.r4c-preview-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:24px} .r4c-preview-head b{font-size:12px} .r4c-preview-head span{font-size:10.5px;color:#a26a3e;text-align:right} .r4c-preview-head span.done{color:#168a5e} .r4c-preview-foot{font-size:10.5px;color:#96785e} .r4c-preview-image{height:144px;position:relative;background:#f9eddc;border-radius:10px;display:grid;place-items:center;overflow:hidden} .r4c-preview-image>img{width:100%;height:100%;object-fit:contain;display:block} .r4c-demo-ribbon{position:absolute;bottom:0;left:0;right:0;text-align:center;background:#fff4e4e8;color:#a22b2c;font-size:11px;padding:4px} .r4c-yes-no,.r4c-two-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:7px 0} .r4c-yes-no button,.r4c-two-actions button{ min-height:44px;border:1px solid #e1c69d;border-radius:11px; background:#fffaf3;color:#815a42;padding:8px;font-size:12px;font-weight:750 } .r4c-yes-no button.active{background:#c10d28;border-color:#c10d28;color:white} .r4c-check{ display:flex;align-items:center;gap:8px;min-height:44px; background:#fffbf5;border:1px solid #ead1aa;border-radius:10px; padding:7px 10px;font-size:12px;color:#64492f;font-weight:750 } .r4c-check input{width:20px;height:20px;accent-color:#c10d28;flex:0 0 20px} .r4c-sample-link{display:block;width:100%;min-height:44px;border:0;background:transparent;color:#b51a2c;font-size:12px;font-weight:800;text-align:center;margin-top:1px} .r4c-sample-link span{color:#98795f;font-size:11px;font-weight:500} .r4c-mini-note{border:1px solid #eaceac;border-radius:11px;background:#fff7ec;color:#916c50;font-size:11.5px;line-height:1.5;padding:8px 10px;margin:8px 0} .r4c-compass-mini{display:flex;align-items:center;gap:10px;background:#fffbf5;border:1px solid var(--r4c-border);border-radius:13px;margin:6px 0 10px;padding:6px 8px;min-height:103px} .r4c-compass-mini img{width:96px;height:96px;flex:0 0 96px} .r4c-compass-mini b{font-size:12.5px;color:#382920} .r4c-compass-mini p{font-size:11.5px;color:#916d55;line-height:1.5;margin:4px 0 0} .r4c-selectline{display:grid;grid-template-columns:1fr;gap:5px;margin:9px 0} .r4c-selectline>b{font-size:12.5px} .r4c-selectline select{display:block;width:100%;min-height:44px;font-size:13px; border:1px solid #e0c59d;border-radius:11px;background:#fffcf7;color:#634c3c;padding:8px 12px} .r4c-caution{border-radius:11px;border:1px solid #e7d4b9;background:#fff7ea;color:#93785f;line-height:1.5; font-size:11.5px;padding:8px 10px;margin:10px 0} .r4c-processing-card{display:grid;justify-items:center;gap:10px;background:#fffaf2;border:1px solid var(--r4c-border); border-radius:15px;padding:16px 14px;margin:10px 0} .r4c-processing-card b{font-size:15px} .r4c-processing-card>span{font-size:12px;color:#8b6d56} .r4c-processing-card small{font-size:11px;color:#98755c} .r4c-processing-card .progressTrack{width:100%;height:8px} .r4c-demo-medallion{width:70px;height:70px;border:2px solid #dfae68;border-radius:50%;display:grid;place-items:center; background:#c10d28;color:white;font:900 31px "Noto Serif CJK SC","STSong",serif} .r4c-info-two{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:9px 0} .r4c-info-two>div{min-height:58px;padding:8px;background:#fffaf3;border:1px solid #e7d2b1;border-radius:11px} .r4c-info-two b{display:block;font-size:12px} .r4c-info-two span{font-size:11.5px;color:#896b50;margin-top:4px;display:block} .r4c-status-icon{height:84px;width:84px;margin:20px auto;background:#ffede5;color:#c11b31; border:2px solid #e9bc92;border-radius:50%;display:grid;place-items:center;font-size:40px;font-weight:900} .r4c-status-icon.good{background:#e4f5e8;color:#268b5b} .r4c-status-icon.pending{background:#fff1d9;color:#c1842b} .r4c-summary-card{display:grid;gap:0;background:#fffaf3;border:1px solid #e9d2b0;border-radius:13px;margin:13px 0} .r4c-summary-card>div{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:9px 12px;border-bottom:1px solid #f3e4cf} .r4c-summary-card>div:last-child{border:0} .r4c-summary-card span{font-size:12px;color:#91725a} .r4c-summary-card b{font-size:12.5px;text-align:right} .r4c-price{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 12px; min-height:60px;background:#fff3dd;border:1px solid #e4c592;border-radius:13px;margin:9px 0} .r4c-price b{display:block;font-size:14px} .r4c-price small{display:block;color:#956f52;font-size:11px;line-height:1.4;margin-top:3px} .r4c-price strong{font-size:20px;color:#be112a;white-space:nowrap} .r4c-layout-image{height:130px;border:1px solid #e6cda5;border-radius:13px;background:#fffaf0;display:grid;place-items:center; overflow:hidden;position:relative;margin:8px 0} .r4c-layout-image img{height:100%;width:100%;object-fit:contain} .r4c-layout-image span{position:absolute;right:5px;bottom:3px;background:#fff8eecb;color:#a06b4e;font-size:10px;padding:2px 5px} .r4c-feature-rows{display:grid;gap:5px;margin:10px 0} .r4c-feature-rows>div{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 9px; background:#fffdfa;border:1px solid #eedfc8;border-radius:10px;font-size:11.5px} .r4c-feature-rows b{color:#b11c2f;font-size:12px;white-space:nowrap} .r4c-feature-rows span{color:#806953;text-align:right} .r4c-task-list{display:grid;gap:5px;margin:9px 0} .r4c-task-row{display:flex;align-items:center;gap:8px;justify-content:space-between;min-height:54px; border:1px solid #e7ceae;border-radius:12px;background:#fffbf6;padding:4px 9px} .r4c-task-row label{display:flex;align-items:center;gap:7px;flex:1;min-width:0;min-height:44px;font-size:12px} .r4c-task-row input{width:20px;height:20px;flex-shrink:0;accent-color:#c10d28} .r4c-task-row button{min-width:48px;min-height:44px;white-space:nowrap;background:none;border:0;color:#be1b31;font-size:11.5px;padding:6px} .r4c-task-row b{font-weight:700} /* Global fixed action: visible and outside the information scroll, not overlapping it. */ .phone .sticky-action:has(>.r4c-primary){left:14px;right:14px;bottom:max(6px,env(safe-area-inset-bottom));gap:3px;padding-top:7px; background:linear-gradient(180deg,#fff3e500,#fff3e5 18%);z-index:6} .phone .sticky-action>.r4c-primary{min-height:48px;width:100%;padding:9px 12px;border-radius:99px; background:linear-gradient(180deg,#ef222c,#b60724);border:1px solid #eb645f;color:white;font-size:15px;font-weight:850;cursor:pointer} .phone .sticky-action>.r4c-primary:disabled{opacity:.58} .phone .sticky-action>.r4c-footer-secondary{width:100%;min-height:44px;border:0;background:#fff6e9;color:#a34d36;font-size:12px} .phone .sticky-action>.r4c-footer-caption{color:#a28974;line-height:1.35;font-size:10px;text-align:center;min-height:13px} /* Full-screen / bottom-sheet for infrequent actions. A sheet may scroll; required NORMAL operation page never relies on this internal overflow. */ .phone .modal-root[data-r4c-sheet="1"]{display:flex;align-items:flex-end;justify-content:center;inset:0;padding:0;z-index:30;overflow:hidden} .r4c-sheet-wrapper{width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center} .r4c-sheet{width:100%;height:auto;max-height:calc(min(700px,var(--r4c-visible-height,100dvh)) - 14px); border-radius:22px 22px 0 0;background:#fff5e7;border:1px solid #efcfab; box-shadow:0 -14px 38px #2b191c66;display:grid;grid-template-rows:50px minmax(0,1fr) auto; overflow:hidden} .r4c-sheet>header{display:flex;align-items:center;justify-content:space-between;padding:7px 14px;border-bottom:1px solid #eed8b8;gap:10px} .r4c-sheet>header h2{font-size:16px;line-height:1.4;font-weight:850;color:#30211b;margin:0} .r4c-sheet-close{min-height:44px;width:44px;flex:0 0 44px;border:1px solid #e4cda7;background:#fffaf3; border-radius:50%;font-size:25px;color:#8b5a43} .r4c-sheet-body{padding:10px 14px 14px;overflow-y:auto;min-height:0;max-height:calc(var(--r4c-visible-height,100dvh) - 130px);font-size:12px;color:#7b5e4b} .r4c-sheet-body h3{font-size:14px;color:#4d3427;margin:10px 0 6px} .r4c-sheet-body p{font-size:12px;line-height:1.55;margin:5px 0 10px} .r4c-sheet-note{font-size:11.5px;line-height:1.5;color:#8e745a;margin:5px 0 9px} .r4c-sheet footer{display:block;flex-shrink:0;background:#fff5e7;padding:9px 14px max(10px,env(safe-area-inset-bottom)); border-top:1px solid #e9d3af} .r4c-sheet footer .r4c-primary{height:48px;min-height:48px;width:100%;color:#fff; border:1px solid #eb645f;border-radius:99px;background:#c10d28;font-size:14px;font-weight:800} .r4c-control-line{min-height:50px;display:flex;align-items:center;justify-content:space-between;gap:9px;margin:6px 0} .r4c-control-line>b{font-size:12px;white-space:nowrap;color:#493124} .r4c-seg{display:flex;gap:6px;flex-wrap:wrap} .r4c-seg button,.r4c-manager-list button,.r4c-sheet-action{min-height:44px;border:1px solid #dfbb91;border-radius:11px; background:#fffcf8;color:#926649;font-size:12px;padding:7px 12px} .r4c-seg button.active,.r4c-manager-list button.active{background:#bf1128;color:white;border-color:#bf1128} .r4c-manager-list{display:grid;gap:6px;margin:9px 0} .r4c-manager-list button{width:100%;display:flex;gap:8px;justify-content:space-between;align-items:center;text-align:left} .r4c-manager-list b{font-size:12px;flex:0 0 40px} .r4c-manager-list span{font-size:11px;flex:1} .r4c-manager-list i{font-size:11px;font-style:normal;white-space:nowrap} .r4c-sheet-action{width:100%;text-align:center;margin:5px 0;color:#b31b30} /* Editor: header, canvas, controls and fixed "Done" all inside visible sheet. Canvas and buttons are NEVER clipped; keyboard reduces/scrolls body only. */ .r4c-sheet-editor{height:min(660px,calc(var(--r4c-visible-height,700px) - 12px))} .r4c-sheet-editor .r4c-edit-body{display:grid; grid-template-rows:auto minmax(144px,1fr) auto auto auto auto; gap:6px;padding:8px 12px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scroll-padding:8px 0 12px;scrollbar-width:thin;min-height:0} .r4c-editor-warning{margin:0;font-size:11.5px;line-height:1.35;color:#976f53} .r4c-edit-canvas{min-height:144px;min-width:0;overflow:hidden} .r4c-edit-canvas .r4-edit-stage{height:100%;min-height:144px} .r4c-edit-canvas .r4-edit-transform{width:min(95%,330px);height:100%;max-height:350px;aspect-ratio:1 / 1} .r4c-editor-tools,.r4c-editor-transform{display:flex;gap:5px} .r4c-editor-tools button,.r4c-editor-transform button{flex:1 1 0;min-width:0;min-height:44px;background:#fffaf4; border:1px solid #dfc49d;border-radius:10px;color:#855f43;font-size:11.5px;font-weight:750;padding:6px 2px} .r4c-editor-tools button.active{background:#c10d28;color:white;border-color:#c10d28} .r4c-editor-label{display:flex;align-items:center;gap:8px;color:#694d3d;font-size:12px} .r4c-editor-label input{width:100%;flex:1;min-width:0;min-height:44px;padding:7px;border:1px solid #dfc49d;border-radius:10px;background:#fffbf7;font-size:13px} .r4c-edit-clear{display:block;width:100%;min-height:44px;border:0;background:transparent;color:#a72635;font-size:11.5px;text-align:center} .phone.r4c-keyboard-open .r4c-sheet-editor .r4c-edit-body{overflow-y:auto;grid-template-rows:auto minmax(144px,auto) auto auto auto auto} .phone.r4c-keyboard-open .r4c-edit-canvas{min-height:144px;max-height:none;overflow:hidden} .phone.r4c-keyboard-open .modal-root[data-r4c-sheet="1"]{bottom:var(--r4c-keyboard-bottom,0px);height:var(--r4c-visible-height,100dvh)} .phone.r4c-keyboard-open .sticky-action:has(>.r4c-primary){bottom:calc(var(--r4c-keyboard-bottom,0px) + 6px)} @media(max-width:375px){ .phone{--r4c-vpadding:10px} .r4c-houses .r4-house-card img,.r4c-houses .houseCard img{width:53px!important;min-width:53px!important;flex-basis:53px} .r4c-houses .r4-house-card strong,.r4c-houses .houseCard strong{font-size:11.5px!important} .r4c-top h1{font-size:22px} .r4c-screen .countrySwitch.r4-region-switch button{font-size:11.5px} } @media(max-height:735px){ .r4c-sheet-editor .r4c-edit-body{gap:5px;padding-block:7px} .r4c-top{margin-bottom:5px} .r4c-top>p:last-child{margin-top:3px} .r4c-houses .r4-house-card,.r4c-houses .houseCard{min-height:66px;max-height:66px} .r4c-houses .r4-house-card img,.r4c-houses .houseCard img{height:56px!important} .r4c-preview-image{height:130px} .r4c-preview-card{padding:6px} .r4c-line-label{margin:3px 0} .r4c-summary-row{min-height:44px;margin:5px 0 3px} .r4c-file-label{margin:2px 0 1px} .r4c-yes-no,.r4c-two-actions{margin:5px 0} .r4c-compass-mini img{height:82px;width:82px;flex-basis:82px} .r4c-compass-mini{min-height:90px;margin:4px 0 8px} .r4c-layout-image{height:116px} .r4c-caution{padding:6px 9px;margin:7px 0} } @media(prefers-reduced-motion:reduce){.r4c-sheet *{animation:none!important;transition:none!important}} /* public/r4/r4-owner-0800.css */ /* Owner 08:00 targeted repair. Normal screen density preserved. */ .phone:not([data-route="home"]) #masthead{padding-left:12px;padding-right:12px;gap:7px} .phone:not([data-route="home"]) .back-circle{box-sizing:border-box;width:44px;min-width:44px;height:44px;min-height:44px;flex:0 0 44px;padding:0;border:1px solid #e9bd7f;border-radius:50%;display:grid;place-items:center;line-height:1} .phone .back-circle svg{display:block;width:20px;height:20px;pointer-events:none} .phone[data-route="home"] .r4-dots,.phone[data-route="home"] .homeMenu{display:none!important} .r4c-floor-check{width:100%;min-height:44px;margin:5px 0 4px;border:1px dashed #dab486;border-radius:12px;background:#fffbf3;color:#986349;font-size:12px;font-weight:650;padding:9px 10px;text-align:center} .r4c-floor-check:focus-visible{outline:2px solid #b80f2b;outline-offset:2px} /* PDF page selector uses the same compact scrollable sheet as existing manual editor. */ .r4c-sheet-pdf{height:min(640px,calc(var(--r4c-visible-height,700px) - 12px));max-width:100%} .r4c-pdf-body{overflow-y:auto;overflow-x:hidden;min-height:0;padding:10px 14px;display:grid;gap:9px;align-content:start;overscroll-behavior:contain} .r4c-pdf-body p{font-size:12px;color:#8c705b;line-height:1.55;margin:0} .r4c-pdf-map{display:grid;grid-template-columns:minmax(0,1fr) 126px;gap:7px;align-items:center} .r4c-pdf-map label{font-size:12px;font-weight:700;color:#513c2b} .r4c-pdf-map select{width:100%;min-width:0;min-height:44px;border:1px solid #d7b589;border-radius:9px;background:#fffef9;color:#513c2b;padding:6px 8px;font-size:12px} .r4c-pdf-preview{border:1px solid #e0c6a5;border-radius:10px;background:#fff;display:grid;place-items:center;overflow:hidden;min-height:110px;max-height:228px} .r4c-pdf-preview canvas{display:block;width:auto;height:auto;max-width:100%;max-height:226px;object-fit:contain} .r4c-pdf-error{color:#b11d31!important;min-height:20px;font-size:12px} .r4c-pdf-toolbar{display:flex;gap:6px;align-items:center;justify-content:space-between} .r4c-pdf-toolbar button,.r4c-pdf-toolbar select{min-width:44px;min-height:44px;border:1px solid #dbba8e;border-radius:10px;background:#fffefa;color:#754a37;padding:7px} .r4c-sheet-pdf footer{display:flex;gap:6px;align-items:center} .r4c-sheet-pdf footer button{flex:1;min-height:48px;border-radius:99px;background:#fff8eb;border:1px solid #e1bd8a;color:#93533c;font-weight:750} .r4c-sheet-pdf footer .r4c-primary{flex:2;background:#bc1028;color:white} @media(max-width:375px){.r4c-pdf-map{grid-template-columns:1fr 110px}.phone:not([data-route="home"]) #masthead{padding:5px 9px;gap:6px}} /* Owner selected B: original editable compass SVG; keep native wordmark. */ .phone img.r4-logo-B{display:block;object-fit:contain;flex-shrink:0;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0} /* public/r4/wealth-features/integration/e71-home-legal-footer.css */ /* Only the three text links at the end of e71 ORIGINAL homepage. */ .phone[data-route="home"] .cc-wealth-legal-foot{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0;padding:15px 7px 4px;margin:14px 0 4px;border-top:1px solid #ecd4b2;color:#a98a6c;font-family:var(--sans,"Noto Sans CJK SC",sans-serif)} .phone[data-route="home"] .cc-wealth-legal-foot a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:7px 4px;font-size:11px;color:#916b4c;text-decoration:underline;text-underline-offset:3px;white-space:nowrap} .phone[data-route="home"] .cc-wealth-legal-foot a:focus-visible{outline:2px solid #bd102b;outline-offset:2px} .phone[data-route="home"] .cc-wealth-legal-foot span{font-size:12px;color:#c5a47f} /* public/r4/r4-copy-review.css */ /* PRIVATE 10:16 owner literal-copy review: paper + vermillion/gold retained. Native HTML text; no image edits, no layout screenshot wallpaper, no hidden text. */ .phone .r4-home-title,.phone .r4c-top h1,.phone .reportHero h2, .phone .r4c-screen b,.phone .r4c-screen span,.phone .r4c-screen button, .phone .r4-home-house b,.phone .r4c-floor-check,.phone .r4-home-intro, .phone .r4c-sheet button,.phone .r4c-sheet p {white-space:normal;overflow-wrap:anywhere;text-overflow:clip} .phone .r4c-top h1{line-height:1.2;letter-spacing:-.025em} .phone .r4c-screen .r4c-primary,.phone .sticky-action .r4c-primary{min-height:48px;height:auto;line-height:1.28;padding-block:10px} .phone .r4c-screen .r4c-two-actions button,.phone .r4c-screen .r4c-yes-no button{min-height:44px;height:auto;line-height:1.3;padding:9px 6px} .phone .r4c-screen .r4c-file-pick{height:auto;min-height:52px;padding-block:8px} .phone .r4c-screen .r4c-task-row label,.phone .r4c-screen .r4c-task-row button{min-height:44px;height:auto;line-height:1.35} .phone .r4c-screen .r4c-task-row{align-items:stretch;min-height:52px} .phone .r4c-screen .r4c-task-list{min-height:0} .phone .r4c-sheet-editor .r4c-edit-body{overflow-y:auto} .phone .r4c-sheet .r4c-manager-list button{height:auto;min-height:44px;white-space:normal} .phone .r4c-sheet .r4c-seg button{min-height:44px;height:auto} .phone .r4c-processing-card{gap:7px;padding-block:12px} .phone .r4c-info-two>div{min-height:50px} .phone .r4-copy-payment-legends{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0} .phone .r4-copy-payment-legends span{border:1px solid #d9b079;border-radius:12px;background:#fff7e9;padding:5px;color:#a04c35;line-height:1.4} .phone .r4c-task-row label{flex:1 1 65%}.phone .r4c-task-row button{flex:0 0 28%;min-width:76px} .phone .r4c-sheet-pdf .r4c-pdf-toolbar button{min-height:44px;height:auto} @media(max-height:735px){ .phone .r4c-top{margin-bottom:3px}.phone .r4c-screen .r4c-top>p:last-child{line-height:1.35;margin-block:3px} .phone .r4c-screen .r4c-task-list{max-height:29vh;overflow:auto;overscroll-behavior:contain} .phone .r4c-processing-card .r4c-demo-medallion{width:50px;height:50px} } @media(max-width:375px){.phone .r4c-screen .r4c-file-pick span{font-size:12px}} @media(prefers-reduced-motion:reduce){.phone .r4c-screen *{transition:none!important}} /* Local patch02: unlock remains a long-scroll page; its scrollport ends above the measured sticky footer so summary/buttons can scroll fully into view. */ .phone[data-route="unlock"] .page{ max-height:var(--r4-copy-unlock-page-height,none); padding-bottom:16px;scroll-padding-bottom:16px; } .phone[data-route="unlock"] .sticky-action{ bottom:max(6px,env(safe-area-inset-bottom,0px)); } /* Local patch05: reclaim only inter-section whitespace on short multi-floor upload screens. Keep every text line, control size and footer safe area. */ @media(max-height:735px){ .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-top{margin-bottom:2px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4-region-switch{margin-block:2px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-line-label{margin-block:2px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-summary-row{margin-block:2px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-floor-tabs{margin-block:2px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-truth{margin-top:2px} } @media(max-height:735px) and (max-width:375px){ /* The footer caption legitimately occupies two lines at 360px. Recover wrapper whitespace instead; all44/48px controls retain their hit areas. */ .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4-region-switch{padding-block:0} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-line-label{margin-bottom:0} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-summary-row{margin-top:1px} .phone[data-route="housing"] .r4c-housing:has(>.r4c-floor-tabs) .r4c-truth{margin-top:1px} } /* public/r4/loadplan1-integration.css */ /* public/r4/approved/loadplan1/home5s1/app/batch1/batch1.css */ /* CP02 stage-1 source stylesheet. Native layout; 7-view/four-width visual QA intentionally deferred. */ #cp02-app{--b1-red:#A81612;--b1-ink:#3C1F17;--b1-gold:#D69A4C;--b1-paper:#FFF1DE;--b1-serif:'CW-Serif','Noto Serif CJK SC',serif;--b1-sans:'CW-Sans','Noto Sans CJK SC',sans-serif;width:min(100%,430px);margin:auto;isolation:isolate;color:var(--b1-ink);background:var(--b1-paper) url("/public/r4/approved/loadplan1/home5s1/app/assets/decor/paper-ui2-1e8a9d6fdb1d.webp") center top/100% auto} #cp02-app *{box-sizing:border-box}#cp02-app :where(h1,h2,h3,p,figure,blockquote){margin:0}#cp02-app img{max-width:100%}#cp02-app button{cursor:pointer}#cp02-app [hidden]{display:none!important} #cp02-app :focus-visible,.cp02-modal-root :focus-visible{outline:3px solid #1D62B0;outline-offset:3px} .cp02-hero{width:100%;position:relative;overflow:hidden}.cp02-hero>svg{display:block;width:100%;height:auto}.cp02-hero a{pointer-events:auto} .b1-panel{position:relative;isolation:isolate;overflow:hidden;padding:25px 14px 53px;min-width:0;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/decor/paper-ui2-1e8a9d6fdb1d.webp") center/100% auto;font-family:var(--b1-serif)} .b1-decor{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.b1-top-plum{position:absolute;right:0;top:0;width:38%}.b1-top-plum.b1-left-plum{left:0;right:auto;transform:scaleX(-1)}.b1-home_05 .b1-top-plum{left:auto;right:0;transform:none;width:28%} .b1-cloud-left{position:absolute;left:-1%;top:7%;width:24%;opacity:.8}.b1-cloud-right{position:absolute;right:0;top:21%;width:16%;transform:scaleX(-1)} .b1-brand{display:flex;align-items:center;flex-direction:column;font-size:20px;font-weight:700;line-height:1.25;color:#221610;margin:0 auto 23px}.b1-brand img{width:48px;height:48px;object-fit:contain} .b1-heading{text-align:center;position:relative;margin:12px 0 18px}.b1-heading h2{font:700 clamp(23px,6.3vw,32px)/1.3 var(--b1-serif);text-wrap:balance;color:#36100A}.b1-heading h2>span{display:block}.b1-heading .b1-red{color:var(--b1-red)} .b1-ribbon{font:700 clamp(18px,5vw,24px)/1.3 var(--b1-serif);color:#FFF0C9;margin:0 auto 17px!important;max-width:87%;padding:15px 14px;background:url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/home02/top-ornate-banner.svg") center/100% 100% no-repeat} .b1-underline{display:block;width:69%;height:12px;margin:4px auto 0}.b1-subheading{font:700 18px/1.5 var(--b1-serif);text-align:center;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/brush-wash.svg") center/100% 100% no-repeat;padding:8px;margin-bottom:15px!important} .b1-card{position:relative;isolation:isolate;min-width:0;background:rgba(255,249,237,.6);border-radius:18px;box-shadow:0 3px 5px #9D4C2419}.b1-card::before{content:'';position:absolute;inset:0;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/ornate-card.svg") center/100% 100% no-repeat;pointer-events:none;z-index:3} .b1-medal{font:700 21px/1 var(--b1-serif);color:#FFF5DB;background:url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/home02/number-medal-bg.svg") center/100% 100% no-repeat;display:grid;place-items:center;width:46px;height:46px;flex:none} .b1-pain-list,.b1-principle-list{display:grid;gap:12px}.b1-pain-card,.b1-principle-card{display:grid;grid-template-columns:34px minmax(0,1fr) 32%;grid-template-rows:auto 1fr;column-gap:8px;padding:14px 12px;align-items:center;min-height:143px} .b1-pain-card .b1-medal,.b1-principle-card .b1-medal{grid-column:1;grid-row:1;width:40px;height:40px;align-self:start;margin-left:-3px}.b1-pain-card h3,.b1-principle-card h3{grid-column:2;grid-row:1;color:var(--b1-red);font:700 clamp(16px,4.1vw,20px)/1.35 var(--b1-serif);padding:5px 0;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/brush-wash.svg") center/100% 100% no-repeat} .b1-pain-card p,.b1-principle-card p{grid-column:2;grid-row:2;font:500 13px/1.65 var(--b1-serif);padding:7px 1px 0;border-left:1px solid #E5B479;padding-left:7px;align-self:start;overflow-wrap:anywhere} .b1-pain-photo,.b1-principle-photo{grid-column:3;grid-row:1/3;width:100%;height:100%;min-height:107px;object-fit:cover;border-radius:5px} .b1-audience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.b1-audience-card{padding:6px 6px 16px;overflow:hidden}.b1-card-photo{display:block;width:100%;aspect-ratio:1.45;object-fit:cover;border-radius:12px 12px 2px 2px}.b1-audience-card h3{font:700 clamp(15px,4.1vw,20px)/1.35 var(--b1-serif);padding:7px 4px;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/brush-wash.svg") center/100% 100% no-repeat;color:var(--b1-red);text-align:center;min-height:65px}.b1-audience-card h3>span:not(:first-child){display:block}.b1-audience-card h3>span:first-child{float:left;font-size:20px;margin:2px}.b1-audience-card p{font:500 13px/1.65 var(--b1-serif);margin:3px 8px 0!important;padding-left:9px;border-left:1px solid #E2B175;overflow-wrap:anywhere} .b1-home_03{padding-top:20px}.b1-home_03 .b1-heading{margin-bottom:22px}.b1-home_03 h2 .b1-red{font-size:1.25em} .b1-home_04{padding-top:16px}.b1-home_04 .b1-brand{margin-bottom:14px}.b1-home_04 .b1-heading{margin-bottom:0}.b1-principle-compass{display:block;width:80%;height:auto;margin-left:-13px;margin-top:2px;margin-bottom:-5px;mask-image:linear-gradient(#000 85%,transparent)} .b1-principle-card{grid-template-columns:34px minmax(0,1fr) 37%}.b1-principle-card h3{font-size:18px}.b1-principle-card p{font-size:13px} .b1-home_05{padding-top:63px}.b1-home_05 .b1-heading h2{color:var(--b1-red);font-size:clamp(24px,7vw,34px)}.b1-home_05 .b1-heading{margin-bottom:43px}.b1-review-list{display:grid;gap:39px}.b1-review-card{padding:17px 17px 18px;min-height:177px}.b1-review-avatar{position:absolute;left:18px;top:-19px;width:97px;height:97px;object-fit:cover;border-radius:50%;border:2px solid #EAB778;z-index:2}.b1-review-scene{position:absolute;right:9px;top:13px;width:38%;height:84px;object-fit:cover;border-radius:0 14px 0 0;opacity:.8;mask-image:linear-gradient(90deg,transparent,#000 55%);z-index:0}.b1-review-card header{position:relative;z-index:1;margin-left:105px;min-height:72px}.b1-review-card h3{font:700 19px/1.35 var(--b1-serif);color:#532819}.b1-review-card small{font-size:12px}.b1-stars{color:#ECA600;font:700 22px/1.8 sans-serif;text-shadow:0 2px #BA7023}.b1-review-card blockquote{font:700 clamp(15px,4.1vw,19px)/1.65 var(--b1-serif);padding-top:10px;overflow-wrap:anywhere} .b1-action{display:flex;justify-content:center;align-items:center;gap:8px;position:relative;width:94%;min-height:64px;border:0;margin:25px auto 9px;padding:15px 24px;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/cta-assembled/cta-textless-with-source-glow.webp") center/100% 100% no-repeat;color:#FFF5E0;font:700 26px/1.2 var(--b1-serif)}.b1-action svg{width:14px;height:23px;flex:none}.b1-demo-note{font:400 11px/1.6 var(--b1-sans);color:#89684E;text-align:center;padding:6px 10px}.b1-mountains{position:absolute;left:0;right:0;bottom:0;height:51px;background:url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/decor/footer-home_02.webp") center bottom/100% auto no-repeat;pointer-events:none;z-index:-1} /* The protected original upload template is mounted in one existing modalRoot. */ .cp02-modal-root.cece-root{position:static;max-width:none;background:none;overflow:visible;margin:0;border:0}.cp02-modal-root .cece-dialog-backdrop{z-index:200;background:rgba(23,13,11,.92);padding:0;max-width:none}.cp02-modal-root .cece-dialog{width:min(90vw,390px);max-height:85vh;max-height:85dvh;border-radius:20px;background:#FFF4E5 url("/public/r4/approved/loadplan1/home5s1/app/assets/decor/paper-ui2-1e8a9d6fdb1d.webp") center/100% auto} .cp02-modal-root .cece-dialog-header{background:transparent;padding-top:20px}.cp02-modal-root .cece-dialog-header h2{color:#7E100C;font-size:31px}.cp02-modal-root .cece-direction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cp02-modal-root .cece-confirm-row{font-size:12px}.cp02-modal-root .cece-modal-footer{background:#FFF4E7;padding-top:13px}.cp02-modal-root .cece-source-picture{background:transparent}.cp02-modal-root .cece-source-demo{background:rgba(255,255,255,.25)} .cp02-modal-root .cece-modal-footer .cece-cta{border:0;border-radius:0;box-shadow:none;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/cta-assembled/cta-textless-with-source-glow.webp") center/100% 100% no-repeat;font-size:18px!important;min-height:62px;color:#FFF5E4!important}.cp02-modal-root .cece-modal-footer .cece-cta::after{display:none} /* Diagnostic order status/methods/permission gates are unchanged upstream markup. */ .b1-diagnostic .cece-root{background:#FFF1DD url("/public/r4/approved/loadplan1/home5s1/app/assets/decor/paper-ui2-1e8a9d6fdb1d.webp") center/100% auto;padding:16px 12px 22px;display:flex;flex-direction:column;overflow:visible}.b1-diagnostic .cece-brand{order:0}.b1-diagnostic .cece-section-head:first-of-type{order:1}.b1-diagnostic .cece-visual-time{order:2}.b1-diagnostic .cece-lock-figure{order:3;margin:13px 5px 15px;padding:12px 5px 5px;border:2px solid #E7B572;border-radius:14px;box-shadow:0 2px 8px #B86E3C33;background:#D9AD76;position:relative;overflow:visible}.b1-diagnostic .cece-lock-figure p{position:absolute;left:6%;right:6%;top:-12px;border-radius:25px;background:linear-gradient(#C92E19,#9D170D);border:2px solid #F2CB82;color:#FFF1D2;padding:4px 6px;font:700 18px/1.25 var(--b1-serif)} .b1-diagnostic .cece-lock-figure .cece-lock-icon{width:66px;height:80px}.b1-diagnostic .cece-lock-label{background:#A91B13;border:1px solid #F2BD60;border-radius:20px;padding:4px 12px;color:#FFF5E4} .b1-diagnostic .cece-section-head{order:4;margin:12px 0}.b1-diagnostic .cece-section-head h2{font-size:23px;color:#5B1810}.b1-diagnostic .cece-benefits{order:5;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.b1-diagnostic .cece-benefit-card{padding:7px 7px 10px;display:flex;flex-direction:column;align-items:center;border-radius:12px}.b1-diagnostic .b1-benefit-art{width:100%;max-width:none;height:auto;aspect-ratio:1.65;object-fit:contain;margin:0}.b1-diagnostic .cece-benefit-card h3{font-size:14px;line-height:1.35;text-align:center;margin:7px 0}.b1-diagnostic .cece-benefit-card p{font-size:12px;line-height:1.6;margin:0} .b1-diagnostic .cece-optional-note{order:6;text-align:center;margin:12px 0;font:600 13px/1.5 var(--b1-serif)}.b1-config-unresolved{display:block;font:400 11px/1.5 var(--b1-sans);color:#86624C;margin-top:4px}.b1-diagnostic .cece-price-box{order:7;border:2px solid #DDA65D;border-radius:13px;background:#FFF3E4;padding:10px;text-align:center}.b1-diagnostic .cece-price-box strong{font-size:53px;line-height:1.15;color:#B2120F}.b1-diagnostic .cece-price-reference{font-size:14px;text-decoration:line-through}.b1-diagnostic .cece-order-status{order:8;margin:9px 0;font:500 12px/1.5 var(--b1-sans)} .b1-diagnostic .cece-cta{order:9;margin:0 auto;border:0;border-radius:0;box-shadow:none;background:url("/public/r4/approved/loadplan1/home5s1/app/assets/cta-assembled/cta-textless-with-source-glow.webp") center/100% 100% no-repeat;font-size:19px!important;min-height:65px}.b1-diagnostic .cece-cta::after{display:none}.b1-diagnostic .cece-cta-hint{order:10;margin:6px 0 12px}.b1-diagnostic .cece-methods{order:11;border:2px solid #DDA65D;border-radius:13px;padding:8px 10px;margin-bottom:12px;background:#FFF1DF}.b1-diagnostic .cece-method-grid{display:flex;gap:9px}.b1-diagnostic .cece-method-grid label{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;border:1px solid #E7BC83;border-radius:12px;background:#FFF7EB}.b1-diagnostic .b1-channel-logo{max-width:98px;height:37px;object-fit:contain}.b1-diagnostic .cece-trust{order:12;font-size:11px}.b1-diagnostic .cece-legal{order:13}.b1-diagnostic .cece-demo-flag{order:14} .cp02-fixture-controls{max-width:750px;margin:0 auto 12px;padding:10px;font:13px/1.5 system-ui;background:#FFF8EB;color:#61432F;border:1px solid #D9B37E}.cp02-fixture-controls a{color:#7B231A;margin:0 5px}.cp02-fixture-controls output{display:block;overflow-wrap:anywhere}.cp02-fixture-controls[hidden]{display:none} @media(max-width:360px){.b1-panel{padding-left:10px;padding-right:10px}.b1-pain-card,.b1-principle-card{grid-template-columns:27px minmax(0,1fr) 30%;column-gap:6px;padding:12px 10px}.b1-pain-card .b1-medal,.b1-principle-card .b1-medal{width:32px;height:32px;font-size:17px}.b1-pain-card h3,.b1-principle-card h3{font-size:15px}.b1-pain-card p,.b1-principle-card p{font-size:12px}.b1-audience-grid{gap:8px}.b1-audience-card p{font-size:12px;margin-inline:5px!important;padding-left:6px}.b1-audience-card h3{font-size:15px;min-height:62px}.b1-review-card{padding-inline:12px}.b1-review-avatar{width:78px;height:78px;left:14px}.b1-review-card header{margin-left:88px}.b1-review-card h3{font-size:16px}.b1-review-card header small{font-size:11px}.b1-review-card blockquote{font-size:14px}.b1-diagnostic .cece-section-head h2{font-size:21px}.b1-diagnostic .cece-benefit-card{padding-inline:5px}.b1-diagnostic .cece-benefit-card h3{font-size:13px}.b1-diagnostic .cece-benefit-card p{font-size:11.5px}.b1-diagnostic .cece-cta{font-size:16px!important}.cp02-modal-root .cece-direction-grid label{padding:7px 5px}.cp02-modal-root .cece-direction-grid strong{font-size:12px}} @media(min-width:431px){#cp02-app{box-shadow:0 14px 42px #5F352425}.b1-panel{padding-inline:17px}} @media(prefers-reduced-motion:reduce){#cp02-app *,#cp02-app *::before,#cp02-app *::after,.cp02-modal-root *{animation:none!important;transition:none!important;scroll-behavior:auto!important}} .b1-review-left-plum{position:absolute;left:0;top:0;width:35%;height:auto;pointer-events:none} /* H02S1: only the frozen Home02 heading's missing warning and red first line. Existing card grid, all breakpoints, all other sections remain byte-for-byte above. */ .b1-home_02 .b1-heading h2{color:var(--b1-red)} .b1-home_02 .b1-home02-warning{display:inline-block;width:1em;height:1em;max-width:none;vertical-align:-.06em;margin-right:.12em;object-fit:contain} /* HOME5S1: Home05 speech icon replaces the erroneous club character only. */ .b1-home_05 .b1-review-speech{display:inline-block;width:1.2em;height:1.2em;vertical-align:-.22em;object-fit:contain} /* public/r4/approved/loadplan1/upload1/upload.css */ /* UPLOAD1. Every selector is scoped to .u1-upload; HOME5S1 receives no rule changes. */ .u1-upload{--u1-red:#b41212;--u1-ink:#321a12;--u1-gold:#c88635;--u1-paper:#fff4e5;position:fixed;inset:0;z-index:1200;display:grid;place-items:center;background:rgba(17,10,7,.88);padding:0;margin:0;color:var(--u1-ink);font-family:"CW-Serif","Noto Serif CJK SC","Noto Serif SC","Songti SC","SimSun",serif;line-height:1.35;isolation:isolate;overscroll-behavior:contain} .u1-upload *,.u1-upload *::before,.u1-upload *::after{box-sizing:border-box} .u1-upload[hidden],.u1-upload [hidden]{display:none!important} .u1-upload button,.u1-upload input,.u1-upload select{font:inherit;color:inherit} .u1-upload button,.u1-upload select,.u1-upload label.cece-source-pick{touch-action:manipulation} .u1-upload button{cursor:pointer} .u1-upload button:disabled,.u1-upload select:disabled{cursor:not-allowed} .u1-upload button:focus-visible,.u1-upload select:focus-visible,.u1-upload input:focus-visible,.u1-upload a:focus-visible,.u1-upload label.cece-source-pick:focus-visible{outline:3px solid #a6500d;outline-offset:3px} .u1-upload .u1-dialog{position:relative;display:flex;flex-direction:column;width:min(90vw,387px);max-height:85vh;max-height:85dvh;min-height:0;margin:0;border:2px solid #ca873b;border-radius:20px;background-color:#fff4e5;background-image:url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/decor/paper-seamless.webp");background-repeat:repeat;background-size:430px 430px;box-shadow:0 0 0 2px #ffe4b7,0 0 0 4px #bf7a2f,0 10px 35px #0009;overflow:hidden} .u1-upload .u1-dialog::after{content:"";position:absolute;inset:0;border:20px solid transparent;border-image:url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/ornate-card.svg") 40 / 20px / 0 stretch;pointer-events:none;z-index:5} .u1-upload .u1-header{position:relative;flex:0 0 auto;isolation:isolate;text-align:center;padding:19px 38px 12px;min-height:92px;overflow:hidden} .u1-upload .u1-header h2{margin:0;padding:0;font-size:clamp(27px,7.6vw,34px);font-weight:700;letter-spacing:1px;color:#230d09;line-height:1.15;white-space:nowrap;position:relative;z-index:1} .u1-upload .u1-header h2 em{font-style:normal;color:#a70008} .u1-upload .u1-header h2::after{content:"";display:block;width:115px;height:2px;background:#a90a12;margin:5px auto 0;transform:rotate(-1deg);border-radius:60%} .u1-upload .u1-header p{position:relative;z-index:1;margin:8px -22px 0;font-size:14px;font-weight:700;letter-spacing:1px} .u1-upload .u1-close{position:absolute;right:10px;top:10px;width:44px;height:44px;min-width:44px;min-height:44px;display:grid;place-items:center;padding:0;border:2px solid #ffd486;border-radius:50%;background:radial-gradient(ellipse at 36% 20%,#e23a23,#ad0707 65%);color:white;box-shadow:0 0 0 1px #bd681f,0 2px 5px #62200588;z-index:3;font:32px/1 Arial,sans-serif} .u1-upload .u1-cloud{position:absolute;pointer-events:none;z-index:0;width:68px;height:auto;opacity:.7} .u1-upload .u1-cloud-left{left:9px;top:35px} .u1-upload .u1-cloud-right{right:12px;top:53px;width:61px} .u1-upload .u1-plum{position:absolute;right:47px;top:1px;width:76px;height:auto;opacity:.9;pointer-events:none;z-index:0} .u1-upload .u1-body{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d2ab78 transparent;padding:4px 13px 5px;scroll-padding:12px} .u1-upload .u1-meta-row{display:flex;align-items:center;gap:6px;font-size:14px;min-width:0;margin:2px 0 10px} .u1-upload .u1-meta-label{white-space:nowrap;font-weight:700} .u1-upload .u1-region{display:flex;flex:0 0 auto;border:1px solid #c98a47;border-radius:12px;box-shadow:0 1px 2px #90571f33;background:#fff0dc} .u1-upload .u1-region button{border:0;background:transparent;border-radius:11px;min-width:41px;min-height:36px;padding:4px 6px;font-size:16px;font-weight:700} .u1-upload .u1-region button[aria-pressed=true],.u1-upload .u1-floor-tabs button[aria-selected=true]{background:linear-gradient(#e84420,#b10909 70%);color:#fff7e8;border-color:#ffd277;box-shadow:0 0 0 1px #d58c32,0 0 5px #e2782a} .u1-upload .u1-house{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;border-left:1px solid #c48946;padding-left:7px;font-weight:700} .u1-upload .u1-house>span{font-size:13px;white-space:nowrap} .u1-upload select{appearance:auto;max-width:100%;min-width:0;background-color:#fff2df;border:1px solid #d69d65;border-radius:11px;padding:6px 5px;min-height:36px;box-shadow:0 1px 2px #99603138;outline-offset:2px} .u1-upload .u1-house select{width:100%;font-size:13px;font-weight:600;padding-left:6px} .u1-upload .u1-floorbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 9px} .u1-upload .u1-floor-tabs{display:flex;gap:5px;flex-wrap:wrap} .u1-upload .u1-floor-tabs button{min-height:36px;min-width:67px;border:1px solid #ddaa7a;border-radius:12px;padding:4px 10px;background:#fff1dd;font-size:16px;font-weight:700;box-shadow:0 1px 2px #84501e3d} .u1-upload .u1-verified{display:inline-block;margin-left:3px;background:#e9f0cf;color:#347b21;font:9px/1.4 sans-serif;border-radius:8px;padding:1px 3px;vertical-align:middle} .u1-upload .u1-add-floor{min-height:34px;padding:3px 7px;border:1px solid #d7a273;border-radius:13px;background:#fff2df;color:#ae0b0b;font-size:12px;box-shadow:0 1px 2px #84501e35;margin-left:auto;white-space:nowrap} .u1-upload .u1-add-floor span{font-size:19px;vertical-align:-1px} .u1-upload .u1-floorbar>small{font-size:10px;white-space:nowrap} .u1-upload .u1-preview-card{margin:0 0 8px;border:1px solid #e7b67a;border-radius:11px;padding:8px 9px 7px;background:rgba(255,250,242,.45)} .u1-upload .u1-card-head{display:flex;align-items:center;justify-content:space-between;gap:5px;margin:0 0 8px} .u1-upload .u1-card-head h3{display:flex;align-items:center;gap:4px;font-size:14px;line-height:1.4;margin:0;white-space:nowrap;font-weight:700} .u1-upload em{font-style:normal;color:#ae0b0b} .u1-upload .u1-small-icon{width:19px;height:19px;object-fit:contain} .u1-upload label.cece-source-pick.u1-source-pick{display:inline-flex;align-items:center;gap:4px;cursor:pointer;color:#b10c0c;text-decoration:underline;text-underline-offset:3px;font-size:12px;font-weight:700;padding:3px 0;white-space:nowrap} .u1-upload .u1-source-pick>span{font:21px/1 sans-serif;text-decoration:none} .u1-upload .u1-source-pick[aria-disabled=true]{opacity:.55;cursor:not-allowed} .u1-upload .u1-source-figure{position:relative;margin:0} .u1-upload .u1-source-picture{display:grid;place-items:center;aspect-ratio:432/282;width:100%;padding:6px 30px;overflow:hidden} .u1-upload .u1-plan{display:block;max-width:100%;max-height:100%;width:100%;height:auto;object-fit:contain;transform-origin:center} .u1-upload .u1-source-picture--real{position:relative;padding:0} .u1-upload .u1-source-picture--real .u1-plan{position:absolute;left:50%;top:50%;max-width:none;max-height:none} .u1-upload .u1-source-figure figcaption{font:10px/1.45 "Noto Sans CJK SC","PingFang SC",sans-serif;text-align:center;color:#76533e;overflow-wrap:anywhere;margin:3px 0 0} .u1-upload .u1-demo-tag{display:inline-block;border:1px solid #dba36b;background:#fff3de;color:#985317;border-radius:8px;padding:1px 6px;font:10px/1.4 sans-serif} .u1-upload .u1-demo-figure>.u1-demo-tag{position:absolute;top:0;left:0} .u1-upload .u1-file-limits{font-size:10px;text-align:center;margin:7px -4px 0;white-space:normal;color:#493325} .u1-upload .u1-file-limits>span{font-family:Arial,sans-serif;font-size:13px} .u1-upload .u1-source-alert,.u1-upload .u1-source-empty{display:flex;flex-direction:column;justify-content:center;gap:6px;min-height:140px;margin:5px 0;text-align:center;padding:16px 10px;background:#fff7eb;border:1px dashed #d9aa75;border-radius:8px;font-size:13px;line-height:1.55} .u1-upload .u1-source-alert p,.u1-upload .u1-source-empty p{margin:0} .u1-upload .u1-source-alert strong{color:#9b1d12} .u1-upload .u1-source-alert button{align-self:center;padding:7px 11px;border:1px solid #bf7442;border-radius:9px;background:#fff0d9;color:#9d2513} .u1-upload .u1-direction-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 0} .u1-upload .u1-direction-card{display:flex;flex-direction:column;min-width:0;border:1px solid #e4b78a;border-radius:11px;padding:7px 8px 8px;background:#fff5e7} .u1-upload .u1-direction-card strong{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:3px;font-size:13px;line-height:1.4;min-height:36px;white-space:normal;color:#541d14} .u1-upload .u1-direction-title{min-width:0;overflow-wrap:anywhere;word-break:normal} .u1-upload .u1-direction-icon{width:22px;height:22px;object-fit:contain;flex:0 0 auto} .u1-upload .u1-help-mark{display:inline-flex;justify-content:center;align-items:center;width:12px;height:12px;flex:0 0 auto;border:1px solid #a45d20;border-radius:50%;font:10px/1 Arial,sans-serif;color:#a45d20} .u1-upload .u1-direction-card select{width:100%;font-size:16px;font-weight:700;margin:4px 0 5px;min-height:35px} .u1-upload .u1-direction-card small{font-size:11px;line-height:1.45;text-align:center} .u1-upload .u1-checks{display:flex;flex-direction:column;gap:4px;margin:5px 0 10px} .u1-upload .u1-check-row{display:flex;align-items:center;gap:7px;min-height:34px;padding:5px 9px;border:1px solid #dfab73;border-radius:9px;background:#fff7eb;font-weight:700;font-size:13px;line-height:1.2} .u1-upload .u1-check-row input{appearance:auto;margin:0;flex:0 0 auto;width:21px;height:21px;accent-color:#b81116} .u1-upload .u1-check-row span{display:block} .u1-upload .u1-check-row small{display:block;font-size:10px;font-weight:400;color:#8a7768;line-height:1.1;margin-top:2px} .u1-upload .u1-check-row:has(input:disabled){color:#796a5e} .u1-upload .u1-check-north{font-weight:400} .u1-upload .u1-rows{border:1px solid #e3b68b;border-radius:11px;padding:0 9px;background:#fff7ec;margin:0 0 9px} .u1-upload .u1-rows button{display:flex;justify-content:space-between;align-items:center;gap:6px;width:100%;padding:7px 2px;border:0;background:none;min-height:35px;text-align:left;font-size:13px} .u1-upload .u1-rows button+button{border-top:1px solid #ead3b8} .u1-upload .u1-rows button>span:first-child{display:flex;align-items:center;gap:5px;flex-wrap:wrap} .u1-upload .u1-rows button>span:last-child{font-size:23px;color:#834313;line-height:1} .u1-upload .u1-rows small{font-size:10px} .u1-upload .u1-row-icon{font-size:20px;color:#b10b0b;line-height:1} .u1-upload .u1-policies{display:flex;justify-content:center;gap:4px;align-items:stretch;margin:6px 0 9px} .u1-upload .u1-policies>span{border:1px solid #f0d1a5;background:#fce9d0;border-radius:13px;padding:3px 5px;font-size:9px;white-space:nowrap} .u1-upload .u1-policy-icon{display:inline-block;font-size:13px;color:#a95c13;vertical-align:-1px;margin-right:3px} .u1-upload .u1-legal{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;font-size:11px;line-height:1.7;margin:0 0 4px} .u1-upload .u1-legal a{color:#2f2018;text-decoration:none;padding:0 8px} .u1-upload .u1-legal a+a{border-left:1px solid #69523d} .u1-upload .u1-legal a:hover{text-decoration:underline} .u1-upload .u1-footer{flex:0 0 auto;position:relative;padding:7px 13px 12px;text-align:center;background-color:#fff4e5;background-image:url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/decor/paper-seamless.webp");background-size:430px 430px;z-index:2} .u1-upload .u1-footer-rule{height:8px;position:relative;margin:0 12px 2px;border-top:1px solid #d7a35d;top:4px;color:#c58a3c;font-size:15px;line-height:1} .u1-upload .u1-footer-rule>span{position:relative;top:-8px;background:#fff4e5;padding:0 4px} .u1-upload .u1-cta{position:relative;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;min-height:70px;margin:0;padding:14px 17px 10px;border:0;background:transparent url("/public/r4/approved/loadplan1/home5s1/app/assets/cta-assembled/cta-textless-with-source-glow.webp") no-repeat center/100% auto;color:#fff7dc;text-shadow:0 1px 1px #7e1509;font-size:clamp(17px,4.8vw,21px);font-weight:700;line-height:1.3;isolation:isolate} .u1-upload .u1-cta>span:first-child{position:relative;z-index:1} .u1-upload .u1-cta-chevron{font-size:32px;line-height:1} .u1-upload .u1-price{white-space:nowrap} .u1-upload .u1-cta:disabled{filter:saturate(.7);cursor:not-allowed} .u1-upload .u1-footer>small{display:block;margin:0;font-size:11px;line-height:1.3;color:#332218} .u1-upload .u1-back{display:inline-block;border:0;border-bottom:1px solid #bf683b;background:none;padding:4px 0;color:#992e1b;font-size:13px;margin:3px 0 12px} .u1-upload .u1-subview{font-size:14px;padding-top:4px;padding-bottom:12px;line-height:1.55} .u1-upload .u1-subview h3{margin:0 0 10px;font-size:19px;color:#711e14} .u1-upload .u1-subview h4{margin:13px 0 5px;font-size:14px} .u1-upload .u1-subview p{margin:7px 0 12px} .u1-upload .u1-subfield{display:flex;flex-direction:column;gap:5px;font-weight:700;margin:12px 0} .u1-upload .u1-subfield select{width:100%;font-size:16px;min-height:42px} .u1-upload .u1-pdf-preview{margin:9px 0;border:1px solid #d9b188;border-radius:10px;padding:9px;background:#fff9ef;text-align:center} .u1-upload .u1-pdf-preview img{display:block;width:100%;height:auto;max-height:210px;object-fit:contain;margin:6px auto} .u1-upload .u1-pdf-preview figcaption{font-size:11px;color:#76533e} .u1-upload .u1-subhint{font-size:12px;color:#77513a} .u1-upload .u1-floor-modes{display:flex;gap:8px} .u1-upload .u1-floor-modes button{flex:1;min-height:40px;border:1px solid #d5a06c;border-radius:10px;background:#fff1dc} .u1-upload .u1-floor-modes button[aria-pressed=true]{background:#b91c11;color:#fff5dc;border-color:#ad6b27} .u1-upload .u1-manager-row{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border:1px solid #e3bd91;border-radius:9px;margin:5px 0;background:#fff7eb} .u1-upload .u1-manager-row small{display:inline-block;margin-left:7px;font-size:11px;color:#80715a} .u1-upload .u1-manager-row button,.u1-upload .u1-add-wide{min-height:36px;padding:5px 12px;border:1px solid #d9a06b;border-radius:8px;background:#fff0da;color:#9a2614} .u1-upload .u1-shelved-list{list-style:none;padding:0;margin:0;border:1px dashed #d2b591;border-radius:9px} .u1-upload .u1-shelved-list li{display:flex;justify-content:space-between;padding:8px 10px} .u1-upload .u1-shelved-list small{font-size:11px;color:#7b6855} .u1-upload .u1-add-wide{display:block;width:100%;margin:12px 0 4px} .u1-upload .u1-recovery{border:1px solid #cf9554;border-radius:9px;background:#fff0d9;padding:9px 10px;font-size:12px;margin:9px 0} .u1-upload .u1-recovery p{margin:0 0 7px} .u1-upload .u1-recovery-actions{display:flex;flex-wrap:wrap;gap:6px} .u1-upload .u1-recovery button{min-height:36px;border:1px solid #b97435;border-radius:8px;background:#fffaf0;padding:5px 9px;color:#843018;font-weight:700} .u1-upload .u1-notice{border-left:3px solid #be791f;padding:6px 8px;background:#fff5db;margin:8px 0;font-size:12px} .u1-upload .u1-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important} @media(max-width:370px){.u1-upload .u1-header{padding-left:34px;padding-right:34px}.u1-upload .u1-header h2{font-size:27px}.u1-upload .u1-header p{font-size:12px}.u1-upload .u1-meta-row{gap:4px}.u1-upload .u1-house{gap:4px;padding-left:5px}.u1-upload .u1-house>span{font-size:11px}.u1-upload .u1-house select{font-size:11px}.u1-upload .u1-region button{min-width:33px;font-size:14px}.u1-upload .u1-direction-card{padding-left:5px;padding-right:5px}.u1-upload .u1-direction-card strong{font-size:11px}.u1-upload .u1-direction-card select{font-size:14px}.u1-upload .u1-direction-card small{font-size:10px}.u1-upload .u1-direction-icon{width:18px;height:18px}.u1-upload .u1-policies{gap:2px;flex-wrap:wrap}.u1-upload .u1-policies>span{font-size:8px}.u1-upload .u1-add-floor{margin-left:0}.u1-upload .u1-card-head h3{font-size:12px}.u1-upload .u1-source-pick{font-size:11px!important}.u1-upload .u1-cta{font-size:17px;min-height:62px}.u1-upload .u1-check-row{font-size:12px}} @media(max-height:570px){.u1-upload .u1-header{min-height:73px;padding-top:12px;padding-bottom:8px}.u1-upload .u1-header h2{font-size:28px}.u1-upload .u1-header p{margin-top:4px;font-size:12px}.u1-upload .u1-footer{padding-top:3px;padding-bottom:8px}.u1-upload .u1-cta{min-height:61px}.u1-upload .u1-close{top:8px}} @media(prefers-reduced-motion:reduce){.u1-upload *{scroll-behavior:auto!important}} @media print{.u1-upload{display:none!important}} .u1-upload figcaption{font-family:"CW-Sans","Noto Sans CJK SC","Noto Sans SC",sans-serif} /* public/r4/approved/loadplan1/diag1/diagnostic.css */ /* Scoped long-flow page. No host body/button/img reset and no hidden override. */ /* public/r4/approved/loadplan1/diag1/tokens.css */ /* DIAG1 tokens only. Four missing WOFF2 dependencies are inherited, not fabricated. * No @font-face URL is added here, so this standalone page has no broken font request. */ .d1-page { --d1-shell: 430px; --d1-paper: #fff0dc; --d1-ink: #35150e; --d1-red: #a20c09; --d1-cta-red: #c91a0c; --d1-gold: #d4913d; --d1-gold-light: #ffdda0; --d1-muted: #75513e; --d1-focus: #205ba5; --d1-serif: 'Noto Serif CJK SC', 'Songti SC', 'STSong', 'SimSun', serif; --d1-sans: 'Noto Sans CJK SC', 'PingFang SC', 'Microsoft YaHei', sans-serif; --d1-brush: 'Kaiti SC', 'STKaiti', 'KaiTi', var(--d1-serif); --d1-edge: clamp(14px, 4.7vw, 21px); --d1-gap: 6px; --d1-radius: 13px; --d1-h1-size: clamp(20px, 5.55vw, 25px); --d1-title-size: clamp(16px, 4.35vw, 20px); --d1-body-size: 13px; --d1-line: 1.55; --d1-price-size: clamp(40px, 12.8vw, 59px); color: var(--d1-ink); font-family: var(--d1-serif); font-size: var(--d1-body-size); line-height: var(--d1-line); } .d1-page { width: min(100%,var(--d1-shell)); margin-inline: auto; position: relative; isolation: isolate; padding: 10px var(--d1-edge) 22px; box-sizing: border-box; background: var(--d1-paper) url("/public/r4/approved/loadplan1/home5s1/app/assets/decor/paper-ui2-1e8a9d6fdb1d.webp") center top/100% auto repeat-y; } .d1-page *, .d1-page *::before, .d1-page *::after { box-sizing: border-box; } .d1-page h1,.d1-page h2,.d1-page h3,.d1-page p,.d1-page figure { margin: 0; } .d1-page button,.d1-page input { font: inherit; } .d1-page button { cursor: pointer; } .d1-page button:disabled { cursor: not-allowed; } .d1-page button:focus-visible,.d1-page a:focus-visible,.d1-page input:focus-visible { outline: 3px solid var(--d1-focus); outline-offset: 3px; } .d1-page img { max-width: 100%; } .d1-decor { position: absolute; pointer-events: none; z-index: -1; } .d1-plum { width: 34%; top: 0; right: 0; } .d1-cloud-left { width: 22%; top: 10px; left: 0; opacity: .85; } .d1-cloud-middle { width: 16%; top: 106px; right: 0; opacity: .72; } .d1-coral-left,.d1-coral-right { width: 35%; bottom: 0; opacity: .72; } .d1-coral-left { left: 0; }.d1-coral-right { right: 0; } .d1-brand { display: flex; align-items: center; justify-content: center; gap: 6px; position: relative; width: fit-content; margin: 0 auto 10px; font: 700 17px/1.2 var(--d1-serif); } .d1-brand img { width: 28px; height: 28px; object-fit: contain; } .d1-brand::before,.d1-brand::after { content: ''; position: absolute; top: 50%; width: 29px; height: 1px; background: linear-gradient(90deg,transparent,#be7426); } .d1-brand::before { right: calc(100% + 11px); }.d1-brand::after { left: calc(100% + 11px); transform: rotate(180deg); } .d1-heading { text-align: center; position: relative; padding-bottom: 11px; } .d1-heading h1 { font: 700 var(--d1-h1-size)/1.3 var(--d1-brush); letter-spacing: -.035em; overflow-wrap: anywhere; } .d1-heading em { color: var(--d1-red); font-style: normal; } .d1-title-lock { width: 18px; height: 24px; vertical-align: -3px; margin-right: 5px; object-fit: contain; } .d1-brush { display: block; width: 94%; height: 8px; margin: 3px auto 0; } .d1-timer { margin: 0 auto 15px; padding: 5px 17px; width: 66%; min-height: 33px; display: flex; justify-content: center; gap: 10px; align-items: center; background: url("/public/r4/approved/loadplan1/home5s1/app/assets/ui/product-plaque-gold-original.webp") center/100% 100% no-repeat; white-space: nowrap; } .d1-timer strong { color: var(--d1-red); font: 700 22px/1.1 Georgia,serif; } .d1-timer span { font-size: 13px; border-left: 1px solid #b47737; padding-left: 9px; } .d1-timer svg { width: 17px; height: 20px; color: #b91b0c; flex: none; } .d1-lock-card { position: relative; margin-top: 20px; border: 1px solid #f9c575; border-radius: 16px; background: radial-gradient(ellipse at center,#d4a05e 0%,#e7bf87 56%,#f9dab0 100%); box-shadow: 0 0 0 2px #fff1bc inset, 0 0 0 4px #d79541 inset, 0 5px 8px #a96a352d; padding: 15px 10px 9px; } .d1-lock-card::before { content: ''; position: absolute; pointer-events: none; inset: 3px; background: url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/ornate-card.svg") center/100% 100% no-repeat; border-radius: 14px; z-index: 3; } .d1-banner { position: relative; z-index: 4; margin: -36px 20px 3px!important; min-height: 38px; padding: 9px 8px 10px; background: url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/ui/button-ornate.svg") center/100% 100% no-repeat; color: #fff2ce; text-shadow: 0 1px 1px #610700; text-align: center; font: 700 clamp(14px,4vw,18px)/1.25 var(--d1-brush); } .d1-plan-stage { aspect-ratio: 604/358; width: 93%; position: relative; margin: 0 auto; min-height: 136px; } .d1-plan { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: contain; } .d1-plan--sample { object-fit: fill; opacity: .89; filter: sepia(.25) saturate(.88); } .d1-plan--host { object-fit: contain; opacity: .82; } .d1-room { position: absolute; z-index: 1; color: #341c0b; font: 400 clamp(9px,2.8vw,13px)/1 var(--d1-brush); transform: translate(-50%,-50%); } .d1-lock-body { position: absolute; width: 23%; height: 46%; object-fit: contain; left: 50%; top: 18%; transform: translateX(-50%); z-index: 2; filter: drop-shadow(0 0 5px #fff1ab); } .d1-lock-label { position: absolute; width: 44%; min-height: 31px; left: 50%; top: 65%; transform: translateX(-50%); padding: 3px 7px; background: url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/ui/button-ornate.svg") center/100% 100% no-repeat; color: #fff5dc; font: 700 clamp(17px,5vw,23px)/1.3 var(--d1-brush); text-align: center; z-index: 3; } .d1-plan-empty { position: absolute; inset: 8% 5%; display: grid; place-content: end center; gap: 3px; text-align: center; padding: 12px 6px; background: #fff1d6a8; border: 1px dashed #d6a76a; border-radius: 9px; color: #61422e; font: 400 12px/1.5 var(--d1-sans); } .d1-plan-empty small { font-size: 11px; } .d1-preview-note { text-align: center; color: #754626; font-size: 10px; margin-top: 7px!important; } .d1-benefit-heading { text-align: center; font: 700 var(--d1-title-size)/1.4 var(--d1-brush); margin: 11px -5px 8px!important; white-space: normal; letter-spacing: -.025em; } .d1-benefit-heading em { color: var(--d1-red); font-style: normal; } .d1-benefits { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--d1-gap); align-items: stretch; } .d1-benefit { position: relative; min-width: 0; padding: 1px 8px 9px; border: 1px solid #e2a354; border-radius: 11px; background: linear-gradient(140deg,#fff5dfb8,#ffebcf9e); box-shadow: 0 2px 4px #9c5e3428,inset 0 0 0 2px #fff8de; } .d1-benefit::before { position: absolute; content:''; inset: 0; border-radius: inherit; background: url("/public/r4/approved/loadplan1/home5s1/upstream/master/runtime/theme/assets/ui/card-border.svg") center/100% 100% no-repeat; pointer-events: none; } .d1-benefit-art { height: 48px; position: relative; margin: 0 -7px; } .d1-benefit-art img { width: 100%; height: 100%; display: block; object-fit: cover; mix-blend-mode: multiply; border-radius: 9px 9px 0 0; } .d1-scroll-label { position: absolute; font: 700 7px/1 var(--d1-brush); left: 44%; top: 15px; transform: rotate(12deg); color:#302012; } .d1-benefit h3 { margin: 4px -3px 6px; text-align: center; font: 700 clamp(12px,3.65vw,16px)/1.24 var(--d1-brush); color: var(--d1-red); } .d1-benefit h3 span { display: block; } .d1-separator { height: 1px; background: linear-gradient(90deg,transparent,#d6913f,transparent); position: relative; margin: 4px 0 8px; } .d1-separator::after { content: ''; width: 4px; height: 4px; position: absolute; left: 50%; top: -1.5px; transform: rotate(45deg); background: #c95c17; } .d1-benefit p { font-size: clamp(11px,3.05vw,13px); line-height: 1.47; text-align: left; overflow-wrap: anywhere; } .d1-addon { text-align: center; margin: 9px -5px 9px!important; font-size: clamp(10px,2.85vw,12px); line-height: 1.6; color: #542817; } .d1-addon::before,.d1-addon::after { content: '◇'; color: #c86820; margin: 0 8px; } .d1-price-box { position: relative; display: grid; grid-template-columns: 1fr 1.75fr 1fr; align-items: center; gap: 4px; min-height: 76px; padding: 7px 12px; border-radius: 13px; background: linear-gradient(135deg,#ffecd4bd,#fff8ebc7); box-shadow: 0 2px 5px #b0773f29; } .d1-price-box::before { content:''; position: absolute; inset: 0; background: url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/ornate-card.svg") center/100% 100% no-repeat; pointer-events: none; } .d1-reference { font-family: var(--d1-brush); text-align: center; border-right: 1px solid #a55329; padding-right: 5px; } .d1-reference span { display: block; font-size: clamp(12px,3.6vw,16px); } .d1-reference s { display: inline-block; position: relative; text-decoration: none; font: italic 700 clamp(16px,4.6vw,21px)/1.25 Georgia,serif; } .d1-reference s::after { content:''; position: absolute; top: 53%; height: 2px; background:#b31612; left:-3px; right:-4px; transform: rotate(-9deg); } .d1-price-main { text-align: center; min-width: 0; } .d1-price-main h2 { font: 700 clamp(17px,4.8vw,23px)/1.2 var(--d1-brush); } .d1-money { display: block; color: var(--d1-red); font: italic 700 var(--d1-price-size)/1.05 Georgia,'Times New Roman',serif; letter-spacing: -.075em; white-space: nowrap; } .d1-money--pending { font: 700 18px/1.45 var(--d1-serif); white-space: normal; letter-spacing: normal; } .d1-money-symbol { font-size: .66em; margin-right: .025em; } .d1-coffee { position: relative; min-height: 59px; background: url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/brush-wash.svg") left 15%/100% 65% no-repeat; } .d1-coffee span { display: block; width: 72%; text-align: center; font: 700 clamp(11px,3.15vw,14px)/1.35 var(--d1-brush); transform: rotate(-8deg); position: relative; z-index: 1; } .d1-coffee img { position: absolute; width: 45px; height: 52px; object-fit: contain; right: -6px; bottom: -3px; } .d1-price-box--server { grid-template-columns: 1fr; padding-block: 10px; } .d1-price-box--server .d1-money { font-size: 52px; } .d1-status { border: 1px solid #d9b27d; background:#fff8e9d9; border-radius: 9px; margin: 11px 0; padding: 10px 12px; font: 400 12px/1.6 var(--d1-sans); overflow-wrap: anywhere; } .d1-status h2 { color: var(--d1-red); font: 700 16px/1.4 var(--d1-serif); margin-bottom: 3px; } .d1-status--ready { border-color: #95a56e; background:#f7f8e9ed; }.d1-status--ready h2 { color:#486029; } .d1-status-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top: 7px; } .d1-secondary { padding: 7px 10px; min-height: 38px; border:1px solid #ba6c33; border-radius:6px; color:#7e2316; background:#fff9ed; } .d1-secondary:disabled { color: #816c5f; border-color:#d0bda5; } .d1-task-list { margin: 7px 0 0; padding: 0; list-style: none; } .d1-task-list li { display:flex; flex-wrap:wrap; gap:5px; justify-content: space-between; align-items:center; border-top:1px solid #e9d7be; padding:6px 0; } .d1-task-list span { max-width:100%; overflow-wrap:anywhere; } .d1-cta-wrap { margin-top: 11px; position: relative; padding: 3px 4px 0; } .d1-cta { border:0; position: relative; isolation:isolate; width:100%; min-height: 52px; padding: 13px 20px; border-radius: 28px; color:#fff8e3; background:transparent; text-align:center; font:700 clamp(16px,4.8vw,21px)/1.4 var(--d1-serif)!important; text-shadow:0 1px 2px #5f0700; } .d1-cta::before { content:''; position:absolute; inset:-24px -7px; z-index:-1; background:url("/public/r4/approved/loadplan1/home5s1/app/assets/cta-assembled/cta-textless-with-source-glow.webp") center/100% 100% no-repeat; pointer-events:none; } .d1-cta-line { display:inline; }.d1-cta-price { white-space:nowrap; } .d1-cta-arrow { margin-left:5px; font-family:var(--d1-sans); } .d1-cta:disabled::before { filter:saturate(.5); }.d1-cta:disabled { color:#fff7e3; } .d1-page[data-demo-only="true"] .d1-cta:disabled::before { filter:none; } .d1-cta-hint { text-align:center; margin: 8px -5px 6px!important; font-size:clamp(11px,3.05vw,13px); line-height:1.6; } .d1-methods { min-width:0; margin:9px 0 12px; padding:7px 10px; border:0; border-radius:13px; background:#fff3dfb8 url("/public/r4/approved/loadplan1/home5s1/app/assets/batch1/ornate-card.svg") center/100% 100% no-repeat; } .d1-method-row { display:flex; gap:8px; align-items:center; } .d1-method-title { flex:0 1 32%; font:400 clamp(13px,3.8vw,17px)/1.4 var(--d1-serif); text-align:center; padding-right:9px; border-right:1px solid #d4904c; } .d1-method-grid { flex:1; display:flex; gap:8px; min-width:0; } .d1-method { position:relative; flex:1; min-width:0; padding:3px 5px; min-height:40px; display:grid; place-items:center; border:1px solid #e8c5a2; border-radius:9px; background:linear-gradient(#fff9ee,#ffe9d5); box-shadow:0 2px 3px #93531e2c; cursor:pointer; } .d1-method img { display:block; width:100%; max-width:66px; height:33px; object-fit:contain; } .d1-method input { position:absolute; width:13px; height:13px; right:2px; bottom:2px; margin:0; accent-color:#ad160d; } .d1-method:has(input:checked) { border-color:#a22613; box-shadow:0 0 0 1px #a22613,0 2px 3px #93531e2c; } .d1-method:has(input:disabled) { cursor:default; } .d1-paynow { color:#5d2471; font:700 18px/1.2 var(--d1-sans); } .d1-method-empty { font-size:12px; color:#725745; } .d1-trust { display:grid; grid-template-columns:1fr 1.25fr 1.2fr; gap:0; border:1px solid #dda15a; border-radius:30px; padding:6px 6px; background:linear-gradient(#fff5dfc7,#ffdca875); box-shadow:0 0 0 1px #fffae6 inset; } .d1-trust span { display:flex; align-items:center; justify-content:center; gap:4px; white-space:nowrap; font-size:clamp(10px,2.8vw,12px); line-height:1.5; } .d1-trust span+span { border-left:1px solid #bd6e25; } .d1-trust svg { width:16px; height:16px; color:#b3640c; flex:none; } .d1-legal { text-align:center; margin-top:12px; font:400 11px/1.8 var(--d1-sans); }.d1-legal a { color:#6c4834; text-underline-offset:3px; } .d1-demo-note { margin:10px 0 0!important; text-align:center; color:#70492e; font:400 10px/1.5 var(--d1-sans); } .d1-action-message { margin-top:7px!important; padding:8px; border:1px solid #bf8b53; border-radius:7px; background:#fff7e7; font:400 12px/1.55 var(--d1-sans); } .d1-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; } @media(max-width:360px){ .d1-page { --d1-edge:14px; --d1-gap:5px; padding-top:10px; } .d1-heading h1 { font-size:20px; } .d1-timer { width:76%; }.d1-timer strong { font-size:20px; }.d1-timer span { font-size:12px; } .d1-banner { margin-inline:10px!important; padding-inline:6px; font-size:14px; } .d1-benefit { padding-inline:6px; }.d1-benefit-art { margin-inline:-5px; height:42px; } .d1-benefit p { line-height:1.5; }.d1-scroll-label { font-size:6px; top:13px; } .d1-price-box { padding-inline:10px; grid-template-columns:.9fr 1.7fr .9fr; }.d1-price-box--server { grid-template-columns:1fr; } .d1-coffee img { width:34px; height:44px; right:-5px; bottom:0; } .d1-cta { font-size:16px!important; min-height:62px; padding:11px 14px; }.d1-cta-line { display:block; } .d1-cta::before { inset:-27px -6px; }.d1-cta-hint { font-size:11px; } .d1-methods { padding-inline:8px; }.d1-method-row { gap:6px; }.d1-method-grid { gap:6px; }.d1-method-title { font-size:13px; } .d1-trust { padding-inline:4px; }.d1-trust span { font-size:9.5px; gap:3px; }.d1-trust svg { width:13px; height:14px; } } @media(prefers-reduced-motion:reduce){.d1-page *, .d1-page *::before, .d1-page *::after { scroll-behavior:auto; }} @media print{.d1-page .d1-cta-wrap,.d1-page .d1-methods,.d1-page .d1-status-actions,.d1-page .d1-demo-note{display:none}.d1-page{max-width:100%;box-shadow:none}} /* User feedback 2026-11-05: keep the existing artwork and price block. */ .d1-page { container-type:inline-size; } .d1-page .d1-banner { margin-inline:12px!important; padding-inline:16px; font-size:clamp(12px,3.4vw,15px); font-size:clamp(12px,4cqi,15px); line-height:1.35; white-space:nowrap; } .d1-page .d1-cta[data-owner-test="true"] { padding-inline:14px; font-size:clamp(14px,3.8vw,17px)!important; font-size:clamp(14px,4cqi,17px)!important; } @container(max-width:320px){ .d1-cta[data-owner-test="true"] { min-height:62px; padding-block:11px; } .d1-cta[data-owner-test="true"] .d1-cta-line { display:block; } } @media(max-width:360px){ .d1-page .d1-banner { font-size:12.5px; padding-inline:10px; } .d1-page .d1-cta[data-owner-test="true"] { font-size:14px!important; } } /* User-requested complete proportional source preview. */ .d1-plan-stage[style] { aspect-ratio:var(--d1-preview-ratio); min-height:0; } /* public/r4/approved/loadplan1/plan5s1/plan.css */ /* Five native sections, normal document flow. Artwork is independent media. All selectors are scoped to PLAN5S1; host hidden/inert/disabled rules are retained. */ /* public/r4/approved/loadplan1/plan5s1/tokens.css */ /* PLAN5S1 scoped tokens. Inherited 4 WOFF2 binaries remain absent. No remote font request or newly broken @font-face is introduced. */ .p5-page { --p5-shell: 430px; --p5-fluid-unit: min(1vw, 4.3px); --p5-paper: #fff0d9; --p5-paper-light: #fff6e5; --p5-ink: #581c0b; --p5-red: #aa0e05; --p5-red-bright: #df210c; --p5-gold: #d58a24; --p5-gold-light: #ffdc91; --p5-cream: #fff1c4; --p5-focus: #1f5d9b; --p5-serif: 'Noto Serif CJK SC', 'Songti SC', 'STSong', 'SimSun', serif; --p5-sans: 'Noto Sans CJK SC', 'PingFang SC', 'Microsoft YaHei', sans-serif; --p5-brush: 'Kaiti SC', 'STKaiti', 'KaiTi', var(--p5-serif); --p5-edge: clamp(11px, calc(var(--p5-fluid-unit) * 3.35), 14.4px); --p5-gap: clamp(9px, calc(var(--p5-fluid-unit) * 2.55), 11px); --p5-h1: clamp(25px, calc(var(--p5-fluid-unit) * 7.9), 34px); --p5-h2: clamp(23px, calc(var(--p5-fluid-unit) * 7.15), 30.75px); --p5-body: clamp(14px, calc(var(--p5-fluid-unit) * 3.9), 16.75px); --p5-small: clamp(12px, calc(var(--p5-fluid-unit) * 3.15), 13.5px); --p5-radius: 17px; --p5-shadow: 0 2px 5px #9b420b29, inset 0 0 0 1px #fff5d9; --p5-dock-height: 162px; color: var(--p5-ink); font: 600 var(--p5-body)/1.58 var(--p5-brush); } .p5-page { position:relative; isolation:isolate; width:min(100%,var(--p5-shell)); margin-inline:auto; box-sizing:border-box; background:var(--p5-paper) url("/public/r4/approved/loadplan1/plan5s1/assets/paper-tile.webp") center top/250px 92px repeat; } .p5-page *, .p5-page *::before, .p5-page *::after { box-sizing:border-box; } .p5-page h1,.p5-page h2,.p5-page h3,.p5-page p,.p5-page figure,.p5-page blockquote { margin:0; } .p5-page img { display:block; max-width:100%; } .p5-page button,.p5-page input { font:inherit; } .p5-page button { cursor:pointer; } .p5-page button:disabled { cursor:not-allowed; } .p5-page :is(button,a,input):focus-visible { outline:3px solid var(--p5-focus); outline-offset:4px; } .p5-page a { color:inherit; text-underline-offset:3px; } .p5-page p,.p5-page h1,.p5-page h2,.p5-page h3,.p5-page li,.p5-page button { overflow-wrap:anywhere; } .p5-page .p5-icon { display:inline-block; flex:none; width:24px; height:24px; vertical-align:middle; } .p5-page .p5-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; } .p5-page .p5-section { position:relative; padding:50px var(--p5-edge) 0; } .p5-page .p5-top-ornaments { position:absolute; inset:0 0 auto; height:104px; pointer-events:none; z-index:-1; } .p5-page .p5-plum { position:absolute; top:0; left:0; width:32%; height:auto; } .p5-page .p5-roof { position:absolute; top:0; right:0; width:30%; height:auto; } .p5-page .p5-section-heading { position:relative; z-index:1; text-align:center; color:var(--p5-red); } .p5-page .p5-section-heading h1,.p5-page .p5-section-heading h2 { font:900 var(--p5-h1)/1.24 var(--p5-brush); letter-spacing:-.055em; text-wrap:balance; } .p5-page .p5-section-heading span { display:block; } .p5-page .p5-brush { width:48%; height:10px; margin:2px auto 6px; } .p5-page .p5-brush img { width:100%; height:100%; object-fit:fill; } .p5-page .p5-plaque { position:relative; display:flex; align-items:center; justify-content:center; gap:8px; width:78%; min-height:33px; margin:8px auto 12px; padding:4px 10px; color:var(--p5-cream); border:2px solid var(--p5-gold); border-radius:28px; background:linear-gradient(155deg,#e62a15,#b20704 55%,#9d0603); box-shadow:inset 0 0 0 1px #ffcd6d,0 2px 4px #7d2c0550; text-align:center; font-size:clamp(18px,calc(var(--p5-fluid-unit) * 5.3),23px); font-weight:800; line-height:1.3; } .p5-page .p5-plaque h2,.p5-page .p5-plaque h3 { font:inherit; } .p5-page .p5-plaque--light { width:88%; background:linear-gradient(#fff8e9,#ffedcd); color:var(--p5-ink); } .p5-page .p5-plaque-cloud { position:absolute; top:50%; width:20%; height:auto; transform:translateY(-50%); pointer-events:none; } .p5-page .p5-plaque-cloud--left { right:101%; }.p5-page .p5-plaque-cloud--right { left:101%; transform:translateY(-50%) scaleX(-1); } .p5-page .p5-timer { width:66%; font-size:clamp(17px,calc(var(--p5-fluid-unit) * 5.05),21.7px); margin-top:7px; margin-bottom:10px; } .p5-page .p5-timer .p5-icon { width:23px; height:23px; } .p5-page .p5-countdown { color:#ffe029; font:800 1.17em/1.1 Georgia,serif; letter-spacing:.02em; } .p5-page .p5-timer--quiet { width:83%; font-size:var(--p5-body); } .p5-page .p5-lock-scene { position:relative; margin:5px calc(var(--p5-edge) * -1) 10px; min-width:0; } .p5-page .p5-lock-picture { width:100%; height:auto; object-fit:contain; } .p5-page .p5-lock-caption { position:absolute; z-index:1; left:22%; top:70%; width:56%; min-height:21%; margin:0; display:flex; align-items:center; justify-content:center; border:2px solid var(--p5-gold); border-radius:28px; background:linear-gradient(#d91c0a,#b50a04); box-shadow:0 2px 3px #6f30085c,inset 0 0 0 1px #ffdd87; color:var(--p5-cream); font-size:clamp(19px,calc(var(--p5-fluid-unit) * 5.7),24.5px); font-weight:800; text-align:center; line-height:1.35; padding:2px 8px; } .p5-page .p5-hero-quote { position:relative; margin:13px 2px 10px; padding-inline:8px; text-align:center; font-size:clamp(20px,calc(var(--p5-fluid-unit) * 5.75),24.7px); font-weight:800; line-height:1.45; } .p5-page .p5-hero-quote>span,.p5-page .p5-hero-quote>strong { display:block; } .p5-page .p5-hero-quote strong { color:var(--p5-red); font-weight:900; } .p5-page .p5-hero-quote::before,.p5-page .p5-advisor-quote::before { content:'“'; position:absolute; left:-2px; top:-12px; color:var(--p5-red); font:900 53px/1 Georgia,serif; } .p5-page .p5-hero-quote::after,.p5-page .p5-advisor-quote::after { content:'”'; position:absolute; right:-2px; bottom:-8px; color:var(--p5-red); font:900 53px/1 Georgia,serif; } .p5-page .p5-hero-quote .p5-brush { width:48%; margin-top:0; } .p5-page .p5-card { position:relative; border:1.5px solid var(--p5-gold); border-radius:var(--p5-radius); background:linear-gradient(115deg,#fff5e2e8,#ffefd3cc); box-shadow:var(--p5-shadow); } .p5-page .p5-card::before { content:''; position:absolute; inset:2.5px; border:1px solid #eaa448ba; border-radius:calc(var(--p5-radius) - 3px); pointer-events:none; } .p5-page .p5-custom-composition { position:relative; min-height:209px; margin:0 calc(var(--p5-edge) * -1); padding:2px var(--p5-edge) 6px 35%; } .p5-page .p5-custom-art { position:absolute; left:0; bottom:-13px; width:43%; height:116%; max-height:300px; object-fit:cover; object-position:left bottom; } .p5-page .p5-custom-copy { z-index:1; padding:11px 15px 15px; min-height:204px; } .p5-page .p5-custom-copy h2 { font-size:clamp(17px,calc(var(--p5-fluid-unit) * 5.1),22px); color:var(--p5-red); letter-spacing:-.045em; line-height:1.25; text-align:center; } .p5-page .p5-custom-copy .p5-brush { width:65%; height:7px; margin:1px auto 4px; } .p5-page .p5-custom-copy p { line-height:1.55; font-size:var(--p5-body); } .p5-page .p5-ending { position:relative; height:54px; margin:4px calc(var(--p5-edge) * -1) 0; overflow:hidden; pointer-events:none; } .p5-page .p5-mountain { width:100%; height:100%; object-fit:fill; opacity:.91; } .p5-page .p5-section--advisor { padding-top:53px; } .p5-page .p5-advisor-card { display:grid; grid-template-columns:52% 48%; min-height:300px; overflow:hidden; margin-top:10px; } .p5-page .p5-advisor-portrait { grid-column:1; grid-row:1; width:100%; height:100%; object-fit:cover; object-position:48% 45%; border-radius:15px 0 0 15px; } .p5-page .p5-advisor-copy { grid-column:2; grid-row:1; position:relative; min-width:0; padding:15px 9px 23px 0; } .p5-page .p5-red-wash { position:relative; padding:3px 8px; background:linear-gradient(110deg,#b91006,#c81b0d 70%,#a40e06); color:var(--p5-cream); border-radius:46% 12% 37% 15% / 17% 38% 22% 40%; text-align:center; font-weight:800; line-height:1.3; } .p5-page .p5-advisor-copy>.p5-red-wash { font-size:var(--p5-body); padding:3px 6px; } .p5-page .p5-advisor-copy h3 { font-size:clamp(25px,calc(var(--p5-fluid-unit) * 7.65),32.9px); line-height:1.22; color:var(--p5-red); white-space:normal; text-align:center; letter-spacing:-.06em; margin:5px -1px 1px; } .p5-page .p5-advisor-copy .p5-brush { width:83%; height:8px; margin-bottom:8px; } .p5-page .p5-credentials { list-style:none; padding:0; margin:0; display:grid; gap:6px; } .p5-page .p5-credentials li { display:flex; align-items:center; gap:5px; border:1px solid var(--p5-gold); border-radius:18px; padding:3px 6px; background:linear-gradient(#fff8e8,#ffebc5); box-shadow:inset 0 0 0 1px #fff7e7,0 1px 2px #a9591245; font-size:clamp(12px,calc(var(--p5-fluid-unit) * 3.5),15px); line-height:1.5; } .p5-page .p5-credentials .p5-icon { width:15px; height:15px; color:var(--p5-red); } .p5-page .p5-advisor-quote { margin-top:15px; padding:16px 22px 13px; font-size:clamp(18px,calc(var(--p5-fluid-unit) * 5.2),22.35px); line-height:1.53; } .p5-page .p5-advisor-quote::before { left:13px; top:7px; } .p5-page .p5-advisor-quote::after { right:10px; bottom:10px; } .p5-page .p5-advisor-quote p:first-child { text-indent:1.2em; } .p5-page .p5-advisor-quote strong { color:var(--p5-red); } .p5-page .p5-advisor-quote .p5-brush { width:36%; margin:0 9px 0 auto; } .p5-page .p5-advisor-pending { align-self:center; text-align:center; color:#795b41; font-size:18px; } .p5-page .p5-pending-note { font-family:var(--p5-sans); font-size:var(--p5-small); } .p5-page .p5-section--advisor .p5-ending { margin-top:17px; height:65px; } .p5-page .p5-section--approach { padding-top:37px; } .p5-page .p5-approach-heading h2 { font-size:clamp(28px,calc(var(--p5-fluid-unit) * 8.25),35.5px); line-height:1.16; } .p5-page .p5-approach-heading .p5-brush { margin-top:4px; width:47%; } .p5-page .p5-section--approach>.p5-plaque { width:78%; font-size:clamp(18px,calc(var(--p5-fluid-unit) * 5.5),23.6px); margin-top:8px; margin-bottom:12px; } .p5-page .p5-approach-list { display:grid; gap:9px; } .p5-page .p5-approach-card { display:grid; grid-template-columns:52% 48%; overflow:hidden; min-height:115px; } .p5-page .p5-approach-photo { width:100%; height:100%; min-height:115px; object-fit:cover; object-position:43% center; border-radius:15px 0 0 15px; } .p5-page .p5-approach-copy { position:relative; padding:13px 10px 13px 0; min-width:0; } .p5-page .p5-approach-copy h3 { font-size:clamp(17px,calc(var(--p5-fluid-unit) * 4.85),20.85px); letter-spacing:-.03em; margin-bottom:2px; } .p5-page .p5-approach-copy .p5-brush { width:86%; height:6px; margin:0 auto 2px; } .p5-page .p5-approach-copy p { font-size:var(--p5-body); line-height:1.43; padding-left:4px; } .p5-page .p5-approach-closing { text-align:center; margin-top:15px; } .p5-page .p5-approach-closing .p5-plaque { width:69%; margin-bottom:3px; font-size:clamp(25px,calc(var(--p5-fluid-unit) * 7.6),32.6px); color:var(--p5-red); padding:3px 8px; } .p5-page .p5-approach-closing>p { font-size:clamp(16px,calc(var(--p5-fluid-unit) * 4.6),19.75px); } .p5-page .p5-section--deliverables { padding-top:26px; } .p5-page .p5-report-heading h2 { font-size:clamp(24px,calc(var(--p5-fluid-unit) * 7.3),31.4px); line-height:1.27; } .p5-page .p5-report-heading h2 span:first-child { font-size:1.12em; margin-bottom:4px; } .p5-page .p5-report-subtitle { width:88%; min-height:29px; font-size:clamp(14px,calc(var(--p5-fluid-unit) * 4.1),17.6px); margin-top:4px; margin-bottom:13px; padding:3px 7px; } .p5-page .p5-deliverable-list { display:grid; gap:9px; } .p5-page .p5-deliverable { display:grid; grid-template-columns:41% 59%; overflow:hidden; } .p5-page .p5-deliverable-photo { width:100%; height:100%; min-height:90px; object-fit:cover; border-radius:15px 12px 12px 15px; } .p5-page .p5-deliverable-copy { padding:8px 11px 11px 10px; min-width:0; } .p5-page .p5-deliverable-copy h3 { display:flex; align-items:flex-start; gap:5px; color:var(--p5-red); font-size:clamp(18px,calc(var(--p5-fluid-unit) * 5.05),21.7px); line-height:1.32; margin:0 0 4px; letter-spacing:-.045em; } .p5-page .p5-medallion { display:inline-flex; align-items:center; justify-content:center; flex:none; width:23px; height:25px; color:var(--p5-cream); background:linear-gradient(#e62b11,#ab0c05); border:1px solid var(--p5-gold); border-radius:38%; box-shadow:0 1px 2px #71360d4a; } .p5-page .p5-medallion .p5-icon { width:16px; height:16px; } .p5-page .p5-deliverable-copy>p { padding-left:18px; font-size:clamp(12px,calc(var(--p5-fluid-unit) * 3.48),14.96px); line-height:1.55; } .p5-page .p5-deliverable-copy .p5-service-note { display:flex; align-items:center; gap:3px; padding:2px 5px; width:fit-content; margin:5px 0 0 13px; border:1px solid #efbb70; border-radius:6px; background:#ffdf9b65; font-size:clamp(11px,calc(var(--p5-fluid-unit) * 3.05),13.1px); } .p5-page .p5-service-note .p5-icon { width:17px; height:17px; color:#c65a08; } .p5-page .p5-report-price-composition { position:relative; display:grid; grid-template-columns:43% 57%; align-items:center; margin:11px -6px 0 calc(var(--p5-edge)*-1); } .p5-page .p5-report-price-composition>figure { position:relative; align-self:stretch; margin-right:-14px; } .p5-page .p5-report-small { width:100%; height:100%; object-fit:contain; object-position:center bottom; } .p5-page .p5-price-card { min-width:0; padding:11px 11px 20px; text-align:center; } .p5-page .p5-reference { font-size:clamp(14px,calc(var(--p5-fluid-unit) * 4.05),17.4px); line-height:1.25; white-space:normal; } .p5-page .p5-reference s { text-decoration-color:#b51a09; text-decoration-thickness:1.3px; text-decoration-skip-ink:none; } .p5-page .p5-reference>span { margin-right:3px; } .p5-page .p5-price-current>.p5-red-wash { width:77%; margin:8px auto 1px; font-size:clamp(17px,calc(var(--p5-fluid-unit) * 5.2),22.35px); } .p5-page .p5-money { display:block; position:relative; z-index:1; color:#b10a02; font:italic 900 clamp(38px,calc(var(--p5-fluid-unit) * 11.8),50.7px)/1.14 Georgia,'Times New Roman',serif; letter-spacing:-.06em; white-space:nowrap; text-shadow:1px 1px #ffefb3; } .p5-page .p5-money::before { content:''; position:absolute; inset:40% -2px 4%; z-index:-1; background:linear-gradient(125deg,#ffcd6a,#ffeeb4 45%,#ffd979); border-radius:45% 15% 40% 22%; transform:rotate(-1deg); } .p5-page .p5-money>span { font-size:.66em; margin-right:2px; } .p5-page .p5-money--pending { font:800 23px/1.65 var(--p5-brush); letter-spacing:0; white-space:normal; } .p5-page .p5-team-note { padding-top:8px; font-size:clamp(12px,calc(var(--p5-fluid-unit) * 3.6),15.45px); line-height:1.4; } .p5-page .p5-section--checkout { padding-top:18px; } .p5-page .p5-final-heading h2 { font-size:clamp(23px,calc(var(--p5-fluid-unit) * 6.85),29.45px); line-height:1.33; } .p5-page .p5-final-heading h2 span:first-child { font-size:1.28em; margin-bottom:4px; } .p5-page .p5-final-heading h2 span:last-child { letter-spacing:-.06em; } .p5-page .p5-report-hero { margin:0 calc(var(--p5-edge)*-1) -2px; } .p5-page .p5-report-hero>img { width:100%; height:auto; } .p5-page .p5-price-card--closing { display:grid; grid-template-columns:43% 57%; padding:9px 14px 14px; min-height:100px; } .p5-page .p5-price-card--closing .p5-reference { border-right:1px solid #bd461e; padding:8px 6px 3px 0; align-self:center; font-size:clamp(15px,calc(var(--p5-fluid-unit) * 4.45),19.1px); line-height:1.6; } .p5-page .p5-price-card--closing .p5-reference>span,.p5-page .p5-price-card--closing .p5-reference>s { display:block; } .p5-page .p5-price-card--closing .p5-price-current { grid-column:2; padding-left:7px; } .p5-page .p5-price-card--closing .p5-price-current>.p5-red-wash { margin-top:0; width:90%; } .p5-page .p5-price-card--closing .p5-money { font-size:clamp(40px,calc(var(--p5-fluid-unit) * 12.5),53.75px); } .p5-page .p5-price-card--closing .p5-team-note { grid-column:1/-1; font-size:clamp(14px,calc(var(--p5-fluid-unit) * 4.1),17.6px); padding-top:6px; } .p5-page .p5-price-card--closing:not(:has(.p5-reference)) { grid-template-columns:1fr; } .p5-page .p5-price-card--closing:not(:has(.p5-reference)) .p5-price-current { grid-column:1; } .p5-page .p5-trust { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; align-items:center; margin-top:9px; padding:9px 8px; } .p5-page .p5-trust>div { display:flex; align-items:center; gap:6px; min-width:0; padding:1px 8px; font-size:clamp(13px,calc(var(--p5-fluid-unit) * 3.65),15.7px); font-weight:800; line-height:1.26; } .p5-page .p5-trust>div+div { border-left:1px solid #b64a27; } .p5-page .p5-trust .p5-icon { color:var(--p5-red); width:25px; height:28px; } .p5-page .p5-methods { margin:9px 0 0; min-width:0; padding:6px 12px 9px; } .p5-page .p5-methods legend { max-width:100%; margin-inline:auto; padding:0 15px; border:1px solid var(--p5-gold); border-radius:20px; color:var(--p5-ink); background:#fff1d6; font-size:clamp(13px,calc(var(--p5-fluid-unit) * 3.8),16.3px); font-weight:700; text-align:center; } .p5-page .p5-method-grid { display:flex; align-items:center; justify-content:center; gap:28px; min-height:55px; } .p5-page .p5-method { display:flex; flex-direction:column-reverse; align-items:center; gap:4px; cursor:pointer; min-width:0; } .p5-page .p5-method-logo { width:100px; height:51px; object-fit:contain; } .p5-page .p5-method input { width:14px; height:14px; accent-color:var(--p5-red); margin:0; cursor:pointer; } .p5-page .p5-method:has(input:checked) img { filter:drop-shadow(0 1px 2px #9d53074d); } .p5-page .p5-method:has(input:focus-visible) { outline:2px solid var(--p5-focus); outline-offset:5px; border-radius:5px; } .p5-page .p5-paynow { font:800 24px/1.4 var(--p5-sans); color:#6d247e; } .p5-page .p5-method-empty { font:400 var(--p5-small)/1.5 var(--p5-sans); text-align:center; } .p5-page .p5-in-flow-hint { font-size:var(--p5-small); line-height:1.5; margin-top:12px; text-align:center; } .p5-page .p5-legal { display:flex; flex-wrap:wrap; justify-content:center; gap:4px; font-size:var(--p5-small); line-height:1.6; margin:9px 0 0; } .p5-page .p5-legal>span:not(.p5-legal-separator) { text-decoration:underline; text-underline-offset:3px; } .p5-page .p5-section--checkout .p5-ending { margin-top:6px; height:36px; } .p5-page .p5-dock-spacer { min-height:calc(var(--p5-dock-height) + env(safe-area-inset-bottom,0px) + 10px); } .p5-page .p5-dock { position:fixed; z-index:40; left:50%; bottom:0; transform:translateX(-50%); width:min(100%,var(--p5-shell)); padding:8px 19px calc(7px + env(safe-area-inset-bottom,0px)); background:linear-gradient(#fff0daed,#ffedce 70%); border-top:1px solid #eac17d; box-shadow:0 -3px 12px #8a3e071c; } .p5-page .p5-cta { display:block; width:100%; min-height:67px; border:0; border-radius:30px; padding:10px 20px; color:#fff0bd; background:#bf1005 url("/public/r4/approved/loadplan1/plan5s1/assets/cta-textless.webp") center/100% 100% no-repeat; font:800 clamp(17px,calc(var(--p5-fluid-unit) * 5.05),21.7px)/1.23 var(--p5-brush); text-shadow:0 1px 1px #6b200b; box-shadow:0 3px 6px #85400b40; text-align:center; } .p5-page .p5-cta>span { display:block; } .p5-page .p5-cta .p5-icon { width:15px; height:19px; stroke-width:3.5px; margin-left:4px; } .p5-page .p5-cta:disabled { filter:saturate(.64); } .p5-page .p5-cta:not(:disabled):active { transform:translateY(1px); } .p5-page .p5-dock-hint { font-size:var(--p5-small); line-height:1.45; text-align:center; padding-top:5px; } .p5-page .p5-feedback { margin-top:5px; border-radius:5px; padding:5px 8px; color:#52200a; background:#fff9ec; font:400 12px/1.5 var(--p5-sans); overflow-wrap:anywhere; } .p5-page .p5-order-status { position:relative; z-index:2; padding:12px 15px; border-bottom:1px solid #dfa74d; background:#fff9ee; font:400 13px/1.55 var(--p5-sans); } .p5-page .p5-order-status h2 { font:700 17px/1.4 var(--p5-sans); margin-bottom:4px; color:#851b0c; } .p5-page .p5-state-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:7px; } .p5-page .p5-state-button { padding:6px 10px; border:1px solid #bc8943; border-radius:6px; color:#5c280e; background:#fff4dd; font:600 12px/1.4 var(--p5-sans); } .p5-page .p5-state-button:disabled { opacity:.6; } .p5-page .p5-job-list { list-style:none; padding:0; margin:8px 0 0; } .p5-page .p5-job-list li { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px; padding:5px 0; border-top:1px solid #edd9b6; } @media (max-width:350px) { .p5-page .p5-section { padding-top:42px; } .p5-page .p5-section--approach { padding-top:31px; } .p5-page .p5-section--deliverables { padding-top:23px; } .p5-page .p5-section--checkout { padding-top:19px; } .p5-page .p5-plaque { width:79%; }.p5-page .p5-timer { width:73%; } .p5-page .p5-custom-composition { padding-left:31%; } .p5-page .p5-custom-copy { padding:10px 11px 12px; } .p5-page .p5-advisor-card { grid-template-columns:50% 50%; } .p5-page .p5-advisor-copy { padding-right:7px; } .p5-page .p5-credentials li { padding:3px 4px; gap:3px; } .p5-page .p5-approach-card { grid-template-columns:48% 52%; } .p5-page .p5-approach-copy { padding-right:8px; } .p5-page .p5-deliverable { grid-template-columns:39% 61%; } .p5-page .p5-deliverable-copy { padding-left:6px; padding-right:8px; } .p5-page .p5-deliverable-copy>p { padding-left:4px; } .p5-page .p5-medallion { width:20px; height:22px; } .p5-page .p5-deliverable-copy .p5-service-note { margin-left:0; } .p5-page .p5-report-price-composition { grid-template-columns:39% 61%; } .p5-page .p5-price-card { padding-inline:8px; } .p5-page .p5-trust { padding-inline:5px; }.p5-page .p5-trust>div { padding-inline:5px; gap:4px; } .p5-page .p5-trust .p5-icon { width:22px; height:25px; } .p5-page .p5-dock { padding-inline:12px; } .p5-page .p5-cta { padding-inline:14px; } } @media (min-width:431px) { .p5-page { box-shadow:0 0 0 1px #d6c4aa55,0 12px 40px #5233191c; } } @media (prefers-reduced-motion:reduce) { .p5-page *, .p5-page *::before, .p5-page *::after { animation:none; transition:none; scroll-behavior:auto; } } @media print { .p5-page { width:100%; max-width:430px; margin-inline:auto; box-shadow:none; } .p5-page .p5-dock,.p5-page .p5-dock-spacer,.p5-page .p5-state-actions { display:none; } .p5-page .p5-section { break-inside:auto; } .p5-page .p5-card { break-inside:avoid; } } /* public/r4/approved/loadplan1/loaddiag1/tokens.css */ /* LOADDIAG1: scoped tokens only. Four inherited WOFF2 binaries remain absent. System-local Chinese fonts are used without @font-face or remote font requests. */ .ld1-page { --ld1-shell: 430px; --ld1-unit: min(1vw, 4.3px); --ld1-paper: #fff0d9; --ld1-paper-soft: #fff7e8; --ld1-ink: #2e1b10; --ld1-brown: #6b2d0d; --ld1-red: #a70d04; --ld1-red-hot: #d9270c; --ld1-gold: #bf731c; --ld1-gold-light: #ffd990; --ld1-rule: #d39446; --ld1-focus: #165a91; --ld1-muted: #765c40; --ld1-serif: 'Noto Serif CJK SC', 'Songti SC', 'STSong', 'SimSun', serif; --ld1-sans: 'Noto Sans CJK SC', 'PingFang SC', 'Microsoft YaHei', sans-serif; --ld1-brush: 'Kaiti SC', 'STKaiti', 'KaiTi', var(--ld1-serif); --ld1-title-size: clamp(20px, calc(var(--ld1-unit) * 6.38), 27.45px); --ld1-body-size: clamp(14px, calc(var(--ld1-unit) * 3.72), 16px); --ld1-step-size: clamp(13.8px, calc(var(--ld1-unit) * 4.07), 17.5px); --ld1-small-size: clamp(11px, calc(var(--ld1-unit) * 2.67), 11.5px); --ld1-outer-period: 4.2s; --ld1-scan-period: 3.8s; --ld1-glow-period: 3.4s; color: var(--ld1-ink); font: 500 var(--ld1-body-size)/1.5 var(--ld1-serif); } /* public/r4/approved/loadplan1/loaddiag1/loading.css */ /* Native composition, no screenshot-backed controls. Only transform/opacity animate. */ .ld1-page, .ld1-page * { box-sizing: border-box; } .ld1-page { position: relative; isolation: isolate; width: 100%; max-width: var(--ld1-shell); min-width: 0; margin: 0 auto; padding: 0 0 clamp(32px, calc(var(--ld1-unit) * 10), 43px); background-color: var(--ld1-paper); background-image: var(--ld1-paper-image, none); background-size: 123px 88px; box-shadow: 0 8px 34px #6b2d0d16; overflow-wrap: anywhere; word-break: normal; } .ld1-page img { display: block; max-width: 100%; user-select: none; } .ld1-page p, .ld1-page h1, .ld1-page h2, .ld1-page ol, .ld1-page ul, .ld1-page figure { margin: 0; } .ld1-page button { font: inherit; touch-action: manipulation; } .ld1-page [hidden] { display: none !important; } .ld1-page [aria-hidden="true"] { pointer-events: none; } .ld1-top-decor { position: absolute; inset: 0 0 auto; height: calc(var(--ld1-unit) * 28); z-index: -1; pointer-events: none; } .ld1-cloud-top { position: absolute; top: calc(var(--ld1-unit) * 8.3); left: 0; width: 29.4%; height: auto; } .ld1-plum { position: absolute; top: 0; right: 0; width: 39.4%; height: auto; } .ld1-brand { position: relative; width: 48%; margin: 0 auto; padding-top: calc(var(--ld1-unit) * 1.9); text-align: center; } .ld1-brand-mark { width: 25.5%; height: auto; max-height: 48px; object-fit: contain; margin: 0 auto; } .ld1-brand-name { display: flex; align-items: center; justify-content: center; gap: 14%; margin-top: calc(var(--ld1-unit) * .4) !important; color: #171712; font: 700 clamp(14px, calc(var(--ld1-unit) * 3.7), 16px)/1.25 var(--ld1-brush); } .ld1-brand-name::before, .ld1-brand-name::after { content: ''; display: block; width: 20%; height: 1px; background: linear-gradient(90deg, transparent, #cf751b); } .ld1-brand-name::after { transform: rotate(180deg); } .ld1-success { position: relative; display: flex; align-items: center; justify-content: center; width: 76%; margin: calc(var(--ld1-unit) * 3.7) auto 0; min-height: calc(var(--ld1-unit) * 8.3); } .ld1-success-plaque { position: relative; width: 68%; min-height: calc(var(--ld1-unit) * 8.3); display: grid; place-items: center; padding: 1px 13px 2px; } .ld1-status-plaque { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; z-index: 0; } .ld1-success-plaque p { position: relative; z-index: 1; color: var(--ld1-red); font: 700 clamp(24px, calc(var(--ld1-unit) * 7.1), 30.5px)/1.15 var(--ld1-brush); letter-spacing: .1em; text-align: center; } .ld1-status-cloud { position: absolute; width: 15.5%; height: auto; } .ld1-status-cloud--left { left: 0; } .ld1-status-cloud--right { right: 0; transform: scaleX(-1); } .ld1-heading { position: relative; width: 95%; margin: calc(var(--ld1-unit) * 2.5) auto 0; text-align: center; } .ld1-heading h1 { font: 700 var(--ld1-title-size)/1.28 var(--ld1-brush); letter-spacing: -.045em; overflow-wrap: normal; word-break: normal; } .ld1-heading h1 strong { color: var(--ld1-red); font-weight: 700; } .ld1-title-stroke { width: 85%; height: auto; max-height: calc(var(--ld1-unit) * 3.8); margin: .2em auto 0; object-fit: fill; } .ld1-heading--safe { margin-top: 25px; } .ld1-heading--safe h1 { font-size: clamp(24px, calc(var(--ld1-unit) * 7), 30px); letter-spacing: 0; } .ld1-scene { position: relative; isolation: isolate; width: 91%; aspect-ratio: 1; margin: 0 auto !important; } .ld1-scene-layer { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; } .ld1-compass-fixed { z-index: 1; } .ld1-outer-wrap { position: absolute; inset: 0; width: 100%; aspect-ratio: 1; z-index: 2; } .ld1-compass-outer { display: block; width: 100%; height: 100%; transform-origin: 50% 50%; transform-box: view-box; animation: ld1-compass-rotate var(--ld1-outer-period) linear infinite; } .ld1-compass-glyph, .ld1-small-cardinals { font-family: 'Noto Serif CJK SC', 'Source Han Serif SC', 'Songti SC', 'STSong', 'SimSun', 'Microsoft YaHei', serif; font-weight: 600; fill: #653c18; stroke: #fff0bc; stroke-width: .45px; paint-order: stroke fill; letter-spacing: 0; } .ld1-compass-glyph { font-size: 30px; } .ld1-small-cardinals { font-size: 36px; } .ld1-floorplan { inset: 8.96% auto auto -9.31%; width: 100%; height: auto; aspect-ratio: 854 / 734; object-fit: contain; z-index: 3; } .ld1-small-compass { display: block; position: absolute; left: 13.8%; top: 46%; width: 18%; height: auto; aspect-ratio: 1; z-index: 4; } .ld1-scan-wrap { position: absolute; inset: 3.2%; z-index: 5; clip-path: circle(50% at 50% 50%); pointer-events: none; } .ld1-scan-glow { opacity: .65; animation: ld1-scan-pass var(--ld1-scan-period) ease-in-out infinite; } .ld1-centre-glow { position: absolute; left: 44%; top: 44%; width: 12%; aspect-ratio: 1; z-index: 5; background: radial-gradient(circle, #fff7cd85 0%, #ffd44c38 30%, transparent 72%); pointer-events: none; opacity: .35; animation: ld1-glow var(--ld1-glow-period) ease-in-out infinite; } .ld1-direction { position: absolute; z-index: 6; display: grid; place-items: center; width: 8.35%; aspect-ratio: 1; transform: translate(-50%, -50%); color: #ffe6a2; font: 700 clamp(16px, calc(var(--ld1-unit) * 4.3), 18.5px)/1 var(--ld1-brush); text-shadow: 0 1px 1px #792000; } .ld1-direction-badge { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; } .ld1-direction > span { position: relative; z-index: 1; padding-bottom: 1px; } .ld1-direction--north { left: 50%; top: 3%; } .ld1-direction--west { left: 3%; top: 50%; } .ld1-direction--east { left: 97%; top: 50%; } .ld1-direction--south { left: 50%; top: 97%; } .ld1-process { position: relative; z-index: 2; width: 83%; margin: clamp(8px, calc(var(--ld1-unit) * 2.2), 10px) auto 0; } .ld1-steps { padding: 0; list-style: none; display: grid; gap: clamp(9px, calc(var(--ld1-unit) * 2.5), 10.75px); } .ld1-step { position: relative; display: flex; align-items: center; min-height: clamp(42px, calc(var(--ld1-unit) * 11.25), 48.4px); padding: clamp(8px, calc(var(--ld1-unit) * 2), 8.6px) 3% clamp(8px, calc(var(--ld1-unit) * 2), 8.6px) 33%; isolation: isolate; border: 1px solid #de9d4d; border-radius: 24px; background: #fff3df77; box-shadow: inset 0 0 0 1px #fffcf0, 0 1px 3px #a34d1020; } .ld1-step-frame { position: absolute; inset: -2px; width: calc(100% + 4px); height: calc(100% + 4px); max-width: none !important; z-index: -1; object-fit: fill; } .ld1-step-illustration { position: absolute; display: grid; place-items: center; left: 7.8%; top: 50%; width: 17.2%; aspect-ratio: 1; transform: translateY(-50%); } .ld1-step-icon { width: 100%; height: 100%; object-fit: contain; } .ld1-step-node { position: absolute; left: 27.8%; top: 50%; width: 11px; height: 11px; transform: translate(-50%, -50%); border: 1.5px solid #a76016; border-radius: 50%; background: #fff6e8; z-index: 1; } .ld1-step:not(:last-child)::after { content: ''; position: absolute; left: 27.8%; top: calc(50% + 6px); width: 1px; height: calc(50% + clamp(9px, calc(var(--ld1-unit) * 2.5), 10.75px) + 1px); background: linear-gradient(#cf7c1d, #e4af63); box-shadow: 1px 0 #fff6df; z-index: 0; } .ld1-step-text { position: relative; z-index: 1; min-width: 0; color: var(--ld1-brown); font: 600 var(--ld1-step-size)/1.35 var(--ld1-brush); overflow-wrap: anywhere; word-break: normal; } .ld1-step.is-highlighted { background: linear-gradient(100deg, #fff2cce0, #ffe7a5bd 52%, #fff1d2cf); border-color: #e29a1b; box-shadow: 0 0 8px #ffc7338f, inset 0 0 0 1px #fffbe2; } .ld1-step.is-highlighted .ld1-step-text { color: var(--ld1-red); font-weight: 700; } .ld1-step.is-highlighted .ld1-step-node { border: 2px solid #d48109; background: #fff6ae; box-shadow: 0 0 0 2px #fff4cf, 0 0 7px 3px #ffc02a; } .ld1-process-note { margin: 10px 1px 0 !important; color: var(--ld1-muted); font: 400 var(--ld1-small-size)/1.5 var(--ld1-sans); text-align: center; } .ld1-waiting-line { display: flex; justify-content: center; align-items: center; gap: 5px; position: relative; width: 88%; margin: clamp(15px, calc(var(--ld1-unit) * 4.25), 18.3px) auto 0; text-align: center; } .ld1-waiting-line p { min-width: 0; color: var(--ld1-ink); font: 600 clamp(13px, calc(var(--ld1-unit) * 3.62), 15.56px)/1.5 var(--ld1-brush); } .ld1-footer-cloud { flex: 0 0 12%; width: 12%; height: auto; } .ld1-footer-cloud--right { transform: scaleX(-1); } .ld1-state-panel { position: relative; z-index: 2; width: 87%; margin: 18px auto 0; } .ld1-state-panel--notice { padding: 16px 14px; border: 1px solid var(--ld1-rule); border-radius: 18px; background: #fff7e8e8; box-shadow: inset 0 0 0 2px #fffdf34d, 0 2px 8px #a34d1014; } .ld1-state-copy h2 { color: var(--ld1-red); font: 700 clamp(18px, calc(var(--ld1-unit) * 4.8), 20.6px)/1.4 var(--ld1-brush); } .ld1-state-copy p { margin-top: 7px; color: var(--ld1-brown); font: 400 var(--ld1-body-size)/1.6 var(--ld1-sans); } .ld1-state-copy .ld1-state-detail { font-size: 13px; color: var(--ld1-muted); } .ld1-state-actions { display: flex; flex-wrap: wrap; gap: 8px; } .ld1-state-copy + .ld1-state-actions, .ld1-failed-jobs + .ld1-state-actions { margin-top: 13px; } .ld1-native-recovery { margin-top: 12px; padding-top: 12px; border-top: 1px solid #e0bc88; } .ld1-recovery-notice { margin-bottom: 8px !important; color: var(--ld1-brown); font: 400 13px/1.6 var(--ld1-sans); } .ld1-state-button { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 144px; min-width: 0; min-height: 44px; padding: 10px 13px; color: #fff4d5; background: linear-gradient(#ba2b10, #970c04); border: 1px solid #a44916; border-radius: 10px; box-shadow: inset 0 0 0 1px #f9c5786e, 0 2px 3px #6f2a0920; cursor: pointer; font: 600 14px/1.45 var(--ld1-sans) !important; text-align: center; overflow-wrap: anywhere; } .ld1-state-button--quiet { color: var(--ld1-brown); background: #fff0d2; border-color: #d4a064; box-shadow: inset 0 0 0 1px #fffdf4; } .ld1-state-button:hover:enabled { filter: brightness(1.06); } .ld1-state-button:active:enabled { transform: translateY(1px); } .ld1-state-button:focus-visible { outline: 3px solid var(--ld1-focus); outline-offset: 3px; } .ld1-state-button:disabled { color: #80674c; background: #e9dcc5; border-color: #c5b49b; box-shadow: none; cursor: default; } .ld1-failed-jobs { display: grid; gap: 10px; list-style: none; padding: 0; margin-top: 12px !important; } .ld1-failed-jobs li { min-width: 0; padding: 10px; border: 1px solid #dcc19b; border-radius: 10px; background: #fff8e9; } .ld1-failed-jobs p { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 8px; margin-bottom: 8px; font: 500 13px/1.5 var(--ld1-sans); } .ld1-failed-jobs p span { color: var(--ld1-red); } .ld1-failed-jobs .ld1-state-button { width: 100%; } .ld1-feedback { position: relative; z-index: 2; width: 86%; margin: 12px auto 0 !important; padding: 10px 12px; color: var(--ld1-red); background: #fff5e4; border: 1px solid #dfb984; border-radius: 9px; font: 500 13px/1.6 var(--ld1-sans); } .ld1-bottom-decor { position: absolute; z-index: -1; inset: auto 0 0; height: clamp(50px, calc(var(--ld1-unit) * 21), 90px); pointer-events: none; } .ld1-coral { position: absolute; bottom: 0; width: 44%; height: auto; max-height: 100%; } .ld1-coral--left { left: 0; object-position: bottom left; } .ld1-coral--right { right: 0; object-position: bottom right; } .ld1-demo-flag { position: relative; z-index: 8; width: 100%; padding: 7px 12px; color: #613e21; background: #fff6e7ed; border-bottom: 1px solid #c89a59; font: 600 12px/1.5 var(--ld1-sans); text-align: center; } .ld1-page--safe { min-height: 520px; padding-bottom: 80px; } .ld1-page--safe .ld1-brand { padding-top: 16px; } .ld1-page--safe .ld1-state-panel { margin-top: 20px; } @keyframes ld1-compass-rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes ld1-scan-pass { 0%, 100% { transform: translateY(-4%); opacity: .28; } 50% { transform: translateY(4%); opacity: .72; } } @keyframes ld1-glow { 0%, 100% { transform: scale(.86); opacity: .2; } 50% { transform: scale(1.12); opacity: .5; } } .ld1-page[data-visual-paused="true"] .ld1-compass-outer, .ld1-page[data-visual-paused="true"] .ld1-scan-glow, .ld1-page[data-visual-paused="true"] .ld1-centre-glow { animation-play-state: paused; } .ld1-page[data-reduced-motion="true"] .ld1-compass-outer, .ld1-page[data-reduced-motion="true"] .ld1-scan-glow, .ld1-page[data-reduced-motion="true"] .ld1-centre-glow { animation: none; transform: none; } .ld1-page[data-reduced-motion="true"] .ld1-scan-glow { opacity: .35; } @media (prefers-reduced-motion: reduce) { .ld1-page .ld1-compass-outer, .ld1-page .ld1-scan-glow, .ld1-page .ld1-centre-glow { animation: none; transform: none; } .ld1-page .ld1-scan-glow { opacity: .35; } .ld1-page .ld1-state-button:active:enabled { transform: none; } } @media (max-width: 350px) { .ld1-step { padding-left: 31%; padding-right: 2.5%; } .ld1-step-node { left: 26.7%; } .ld1-step:not(:last-child)::after { left: 26.7%; } .ld1-step-illustration { left: 6.8%; } .ld1-heading h1 { letter-spacing: -.055em; } .ld1-state-panel { width: 90%; } .ld1-footer-cloud { flex-basis: 10%; width: 10%; } } /* public/r4/approved/loadplan1/loadplan1/tokens.css */ /* LOADPLAN1 scoped tokens; no external fonts. Original four WOFF2 gaps are retained. */ .lp1-page { --lp1-shell: 430px; --lp1-unit: min(1vw, 4.3px); --lp1-paper: #fff0d9; --lp1-ink: #23130b; --lp1-brown: #623718; --lp1-red: #ad1008; --lp1-gold: #cb7f21; --lp1-gold-light: #ffdc8c; --lp1-rule: #e3a44e; --lp1-muted: #795b3d; --lp1-focus: #165a91; --lp1-serif: 'Noto Serif CJK SC', 'Songti SC', 'STSong', 'SimSun', serif; --lp1-sans: 'Noto Sans CJK SC', 'PingFang SC', 'Microsoft YaHei', sans-serif; --lp1-brush: 'Kaiti SC', 'STKaiti', 'KaiTi', var(--lp1-serif); --lp1-title-size: clamp(25.6px, calc(var(--lp1-unit) * 8.5), 36.55px); --lp1-step-size: clamp(13.2px, calc(var(--lp1-unit) * 4.25), 18.275px); --lp1-body-size: clamp(14px, calc(var(--lp1-unit) * 3.72), 16px); --lp1-small-size: clamp(10.5px, calc(var(--lp1-unit) * 2.6), 11.18px); --lp1-outer-period: 4.6s; --lp1-glow-period: 4s; color: var(--lp1-ink); font: 500 var(--lp1-body-size)/1.5 var(--lp1-serif); } /* public/r4/approved/loadplan1/loadplan1/loading.css */ /* Independently composed local layers + visible editable text. No screenshot background. */ .lp1-page, .lp1-page * { box-sizing: border-box; } .lp1-page { position: relative; isolation: isolate; width: 100%; max-width: var(--lp1-shell); min-width: 0; margin: 0 auto; padding: 0 0 42px; background-color: var(--lp1-paper); background-image: var(--lp1-paper-image, none); background-size: 123px 88px; overflow-wrap: anywhere; word-break: normal; box-shadow: 0 8px 34px #6b2d0d16; } .lp1-page img { display: block; max-width: 100%; user-select: none; } .lp1-page p, .lp1-page h1, .lp1-page h2, .lp1-page ol, .lp1-page ul, .lp1-page figure { margin: 0; } .lp1-page button { font: inherit; touch-action: manipulation; } .lp1-page [hidden] { display: none !important; } .lp1-page [aria-hidden="true"] { pointer-events: none; } .lp1-top-decor { position: absolute; inset: 0 0 auto; height: calc(var(--lp1-unit) * 29); z-index: -1; pointer-events: none; } .lp1-cloud-top { position: absolute; top: calc(var(--lp1-unit) * 8.3); left: 0; width: 29.4%; height: auto; } .lp1-plum { position: absolute; top: 0; right: 0; width: 39.4%; height: auto; } .lp1-brand { position: relative; width: 48%; margin: 0 auto; padding-top: calc(var(--lp1-unit) * 1.8); text-align: center; } .lp1-brand-mark { width: 24.3%; height: auto; max-height: 44px; object-fit: contain; margin: 0 auto; } .lp1-brand-name { display: flex; align-items: center; justify-content: center; gap: 14%; margin-top: calc(var(--lp1-unit) * .45) !important; color: #171712; font: 700 clamp(13px, calc(var(--lp1-unit) * 3.7), 16px)/1.25 var(--lp1-brush); } .lp1-brand-name::before, .lp1-brand-name::after { content: ''; display: block; width: 20%; height: 1px; background: linear-gradient(90deg, transparent, #cf751b); } .lp1-brand-name::after { transform: rotate(180deg); } .lp1-success { position: relative; display: flex; align-items: center; justify-content: center; width: 77%; margin: calc(var(--lp1-unit) * 3.7) auto 0; min-height: calc(var(--lp1-unit) * 8.8); } .lp1-success-plaque { position: relative; width: 68%; min-height: calc(var(--lp1-unit) * 8.8); display: grid; place-items: center; padding: 2px 13px 4px; } .lp1-status-plaque { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; z-index: 0; } .lp1-success-plaque p { position: relative; z-index: 1; color: var(--lp1-red); font: 700 clamp(19px, calc(var(--lp1-unit) * 5.9), 25.37px)/1.25 var(--lp1-brush); letter-spacing: .06em; text-align: center; } .lp1-status-cloud { position: absolute; width: 15.5%; height: auto; } .lp1-status-cloud--left { left: 0; } .lp1-status-cloud--right { right: 0; transform: scaleX(-1); } .lp1-heading { position: relative; width: 94%; margin: calc(var(--lp1-unit) * 1.7) auto 0; text-align: center; } .lp1-heading h1 { font: 700 var(--lp1-title-size)/1.24 var(--lp1-brush); letter-spacing: -.04em; overflow-wrap: normal; word-break: normal; } .lp1-heading h1 strong { color: var(--lp1-red); font-weight: 700; } .lp1-title-stroke { width: 88%; height: auto; max-height: calc(var(--lp1-unit) * 3.4); margin: .05em auto 0; object-fit: fill; } .lp1-heading--safe { margin-top: 25px; } .lp1-heading--safe h1 { font-size: clamp(24px, calc(var(--lp1-unit) * 7), 30px); letter-spacing: 0; } .lp1-scene { position: relative; isolation: isolate; width: 100%; aspect-ratio: 941 / 548; margin: 0 auto !important; } .lp1-scene-layer { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; } .lp1-landscape { z-index: 0; } .lp1-master-fixed { z-index: 2; } .lp1-outer-wrap { position: absolute; left: 17.003188%; top: -7.846715%; width: 65.887354%; aspect-ratio: 1; z-index: 1; } .lp1-outer-ticks { width: 100%; height: 100%; object-fit: contain; transform-origin: center; animation: lp1-outer-turn var(--lp1-outer-period) linear infinite; } .lp1-centre-glow { position: absolute; left: 18%; top: 6%; width: 64%; aspect-ratio: 1; z-index: 3; background: radial-gradient(circle, transparent 56%, #ffdf7b30 65%, transparent 71%); opacity: .35; animation: lp1-soft-glow var(--lp1-glow-period) ease-in-out infinite; pointer-events: none; } .lp1-process { position: relative; z-index: 3; width: 83%; margin: clamp(6px, calc(var(--lp1-unit) * 1.4), 7px) auto 0; } .lp1-steps { padding: 0; list-style: none; display: grid; gap: clamp(8px, calc(var(--lp1-unit) * 2.25), 9.7px); } .lp1-step { position: relative; display: flex; align-items: center; min-height: clamp(42px, calc(var(--lp1-unit) * 11.25), 48.4px); padding: 8px 3% 8px 33%; isolation: isolate; border: 1px solid #e1a85c; border-radius: 25px; background: #fff3df70; box-shadow: inset 0 0 0 1px #fffcf0, 0 1px 3px #a34d1020; } .lp1-step-frame { position: absolute; inset: -2px; width: calc(100% + 4px); height: calc(100% + 4px); max-width: none !important; z-index: -1; object-fit: fill; } .lp1-step-illustration { position: absolute; display: grid; place-items: center; left: 8.4%; top: 50%; width: 16.3%; aspect-ratio: 1; transform: translateY(-50%); } .lp1-step-icon { width: 100%; height: 100%; object-fit: contain; } .lp1-step-node { position: absolute; left: 28.2%; top: 50%; width: 11px; height: 11px; transform: translate(-50%, -50%); border: 1.5px solid #a76016; border-radius: 50%; background: #fff6e8; z-index: 1; } .lp1-step:not(:last-child)::after { content: ''; position: absolute; left: 28.2%; top: calc(50% + 6px); width: 1px; height: calc(50% + clamp(8px, calc(var(--lp1-unit) * 2.25), 9.7px) + 1px); background: linear-gradient(#c67b27,#e0b574); box-shadow: 1px 0 #fff6df; z-index: 0; } .lp1-step-text { position: relative; z-index: 1; min-width: 0; color: var(--lp1-brown); font: 600 var(--lp1-step-size)/1.35 var(--lp1-brush); overflow-wrap: anywhere; word-break: normal; } .lp1-step[data-step-id="suggestions"] .lp1-step-text { font-size: clamp(11.5px, calc(var(--lp1-unit) * 3.23), 13.9px); line-height: 1.55; } .lp1-step.is-highlighted { background: linear-gradient(100deg,#fff2cce0,#ffe7a5bd 52%,#fff1d2cf); border-color: #e29a1b; box-shadow: 0 0 8px #ffc7338f,inset 0 0 0 1px #fffbe2; } .lp1-step.is-highlighted .lp1-step-text { color: var(--lp1-red); font-weight: 700; } .lp1-step.is-highlighted .lp1-step-node { border: 2px solid #d48109; background: #fff6ae; box-shadow: 0 0 0 2px #fff4cf,0 0 7px 3px #ffc02a; } .lp1-footer { position: relative; z-index: 2; } .lp1-support { position: relative; display: flex; align-items: center; justify-content: center; width: 90%; margin: calc(var(--lp1-unit) * 4.5) auto 0; } .lp1-support-plaque { display: grid; place-items: center; position: relative; width: 69%; min-height: calc(var(--lp1-unit) * 9.5); padding: 6px 14px; text-align: center; } .lp1-support-border { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; } .lp1-support-plaque p { position: relative; color: var(--lp1-red); font: 700 clamp(16px, calc(var(--lp1-unit) * 4.6), 19.78px)/1.3 var(--lp1-brush); } .lp1-support-cloud { position: absolute; width: 14%; height: auto; } .lp1-support-cloud--left { left: 0; } .lp1-support-cloud--right { right: 0; transform: scaleX(-1); } .lp1-philosophy { display: flex; align-items: center; justify-content: center; gap: 5px; width: 89%; margin: calc(var(--lp1-unit) * 6) auto 0; } .lp1-philosophy p { min-width: 0; text-align: center; font: 700 clamp(12.8px, calc(var(--lp1-unit) * 4), 17.2px)/1.6 var(--lp1-brush); } .lp1-footer-cloud { flex: 0 0 10%; width: 10%; height: auto; } .lp1-footer-cloud--right { transform: scaleX(-1); } .lp1-process-note { width: 83%; margin: 11px auto 0 !important; color: var(--lp1-muted); font: 400 var(--lp1-small-size)/1.5 var(--lp1-sans); text-align: center; } .lp1-waiting-line { width: 86%; margin: 12px auto 0; text-align: center; color: var(--lp1-brown); font: 500 14px/1.6 var(--lp1-sans); } .lp1-state-panel { position: relative; z-index: 3; width: 87%; margin: 18px auto 0; } .lp1-state-panel--notice { padding: 16px 14px; border: 1px solid var(--lp1-rule); border-radius: 18px; background: #fff7e8ed; box-shadow: inset 0 0 0 2px #fffdf34d,0 2px 8px #a34d1014; } .lp1-state-copy h2 { color: var(--lp1-red); font: 700 clamp(18px, calc(var(--lp1-unit) * 4.8), 20.6px)/1.4 var(--lp1-brush); } .lp1-state-copy p { margin-top: 7px; color: var(--lp1-brown); font: 400 var(--lp1-body-size)/1.6 var(--lp1-sans); } .lp1-state-copy .lp1-state-detail { font-size: 13px; color: var(--lp1-muted); } .lp1-state-actions { display: flex; flex-wrap: wrap; gap: 8px; } .lp1-state-copy + .lp1-state-actions,.lp1-failed-jobs + .lp1-state-actions { margin-top: 13px; } .lp1-native-recovery { margin-top: 12px; padding-top: 12px; border-top: 1px solid #e0bc88; } .lp1-recovery-notice { margin-bottom: 8px !important; color: var(--lp1-brown); font: 400 13px/1.6 var(--lp1-sans); } .lp1-state-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; max-width: 100%; padding: 10px 16px; border: 1px solid #9e200e; border-radius: 12px; background: #ac1b0d; color: #fff4d9; font: 600 14px/1.45 var(--lp1-sans); text-align: center; cursor: pointer; } .lp1-state-button--quiet { color: #7c3517; border-color: #bf8b46; background: #fff3dce8; } .lp1-state-button:disabled { opacity: .58; cursor: default; } .lp1-state-button:focus-visible { outline: 3px solid var(--lp1-focus); outline-offset: 3px; } .lp1-failed-jobs { padding: 0; list-style: none; margin-top: 12px !important; display: grid; gap: 9px; } .lp1-failed-jobs li { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid #e8cda2; } .lp1-failed-jobs p { min-width: 0; flex: 1 1 90px; font: 500 14px/1.5 var(--lp1-sans); } .lp1-failed-jobs p span { display: block; color: #865238; font-size: 12px; } .lp1-feedback { position: relative; z-index: 3; width: 86%; margin: 14px auto 0 !important; color: #8b2915; font: 400 13px/1.6 var(--lp1-sans); } .lp1-demo-flag { position: relative; z-index: 2; width: 90%; margin: 14px auto 0 !important; color: #845a38; text-align: center; font: 400 11px/1.5 var(--lp1-sans); } .lp1-bottom-decor { position: absolute; inset: auto 0 0; height: calc(var(--lp1-unit) * 17); z-index: -1; pointer-events: none; } .lp1-coral { position: absolute; bottom: 0; width: 44%; height: auto; } .lp1-coral--left { left: 0; } .lp1-coral--right { right: 0; } .lp1-page--safe { min-height: 480px; padding-bottom: 80px; } @keyframes lp1-outer-turn { to { transform: rotate(360deg); } } @keyframes lp1-soft-glow { 0%,100% { opacity: .22; } 50% { opacity: .5; } } .lp1-page[data-visual-paused="true"] .lp1-outer-ticks,.lp1-page[data-visual-paused="true"] .lp1-centre-glow { animation-play-state: paused; } .lp1-page[data-reduced-motion="true"] .lp1-outer-ticks,.lp1-page[data-reduced-motion="true"] .lp1-centre-glow { animation: none; } @media (prefers-reduced-motion: reduce) { .lp1-outer-ticks,.lp1-centre-glow { animation: none; } } @media (max-width: 340px) { .lp1-step { padding-right: 4%; } .lp1-support-plaque { width: 73%; } } /* Host sizing and local candidate overrides; frozen delivery files remain intact. */ .phone[data-approved-view]{width:452px;max-width:100%;background:#fff0dc} .phone[data-approved-view] #page{padding:0!important;height:calc(100% - 76px)!important;max-height:none!important;overflow-y:auto;overflow-x:hidden} .phone[data-approved-view] #masthead{height:42px;padding:0!important} .phone[data-approved-view] #stickyAction{display:none!important} .phone[data-approved-view="home"] #masthead,.phone[data-approved-view="housing"] #masthead{display:none} .phone[data-approved-view="home"] #page,.phone[data-approved-view="housing"] #page{height:calc(100% - 34px)!important} .phone[data-approved-view] #cp02-app{--b1-serif:'Kaiti SC','STKaiti','KaiTi','Songti SC','SimSun',serif;--b1-sans:'PingFang SC','Microsoft YaHei',sans-serif;box-shadow:none} .phone[data-approved-view] .cp02-hero>svg{display:block;width:100%;height:auto;overflow:visible} .phone[data-approved-view] .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)} .phone[data-approved-view] #cp02-app .cw-tag,.phone[data-approved-view] #cp02-app .cw-region-mask{transition:opacity .25s ease} .phone[data-approved-view] .approved-top{display:flex;align-items:center;justify-content:space-between;width:100%;padding:3px 8px;font:13px/1.4 system-ui} .approved-top button{background:none;border:0;color:#8f2315;min-height:36px;padding:5px} .approved-top span{color:#674229} #modalRoot.approved-modal{position:static;inset:auto;display:block;padding:0;background:none;z-index:1200} #modalRoot.approved-modal:empty{display:none} .approved-modal .u1-upload .approved-local-review{width:100%;min-height:42px;padding:8px;border:1px solid #c7955b;border-radius:10px;background:#fff9ee;font-size:14px;color:#8a2417} #approvedNav{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:16px} #approvedNav button{min-height:42px;background:#fff3e1;border:1px solid #d9ad78;border-radius:9px;padding:8px;font-size:13px;color:#692d1f} #approvedNav button[aria-current]{background:#a91913;color:#fff5e3} #approvedNav a{grid-column:1/-1;font-size:12px;text-decoration:underline;color:#773a24;padding:4px} @media(max-width:800px){ .phone[data-approved-view]{width:100%;max-width:430px;margin:auto} .phone[data-approved-view] #page{height:calc(100% - 42px)!important} .phone[data-approved-view="home"] #page,.phone[data-approved-view="housing"] #page{height:100%!important} } @media(prefers-reduced-motion:reduce){.phone[data-approved-view] *{scroll-behavior:auto!important;transition:none!important}} /* User acceptance fixes apply to this local candidate entry only. */ #cp02-app[data-local-preview] .cc-message-track{animation:cc-message-top-to-bottom 8.6s linear infinite;transform-box:view-box;transform-origin:0 0;will-change:transform} @keyframes cc-message-top-to-bottom{from{transform:translateY(0)}to{transform:translateY(var(--cc-message-distance))}} #cp02-app[data-local-preview] .b1-review-avatar{top:12px;border:0} #cp02-app[data-local-preview] .b1-review-card header{min-height:94px} /* Exclude the baked red/gold sign and lower cloud remnant from the plum tile. */ #cp02-app[data-local-preview] .b1-review-left-plum{clip-path:polygon(0 0,100% 0,100% 52%,61% 52%,61% 81%,31% 81%,31% 91%,0 91%)} .approved-modal [data-preview-file-pick]{cursor:pointer;touch-action:manipulation} .approved-modal [data-preview-file-pick]:focus-visible{outline:3px solid #a6500d;outline-offset:3px} .approved-modal [data-preview-file-pick][aria-disabled="true"]{cursor:not-allowed} /* Confirmed original: remove the one complete duplicate inner frame layer. */ .approved-modal .u1-upload .u1-dialog::after{content:none} /* Local image and rendered-PDF previews follow their intrinsic ratio. */ .approved-modal .u1-upload .u1-demo-figure .u1-source-picture{display:block;aspect-ratio:auto;width:100%;height:auto;min-height:0;padding:6px 0;overflow:visible} .approved-modal .u1-upload .u1-demo-figure .u1-plan{display:block;width:auto;height:auto;max-width:100%;max-height:min(45vh,420px);max-height:min(45dvh,420px);margin:0 auto;object-fit:contain} @media(max-width:360px){#cp02-app[data-local-preview] .b1-review-card header{min-height:75px}} @media(prefers-reduced-motion:reduce){#cp02-app[data-local-preview] .cc-message-track{animation:none!important;will-change:auto}} /* User-requested persistent homepage CTA; original button art and copy. */ .phone[data-approved-view="home"] #stickyAction { display:block!important; position:absolute; left:0; right:0; bottom:0; z-index:50; padding:0; border:0; box-shadow:none; background:transparent; pointer-events:none; } .phone[data-approved-view="home"] #stickyAction .cc-floating-home-cta { display:block; width:100%; height:auto; overflow:visible; } .phone[data-approved-view="home"] #stickyAction a { pointer-events:auto; cursor:pointer; } .phone[data-approved-view="home"] .cp02-hero a[data-cw-act="open-upload"] { visibility:hidden; } .phone[data-approved-view="home"] #page { padding-bottom:130px!important; } /* Match the browser viewport when the desktop phone shell is taller. */ .phone[data-approved-view="home"] #stickyAction { position:fixed; right:auto; } /* Isolate source-image clipping from the ornamental frame and lock overlays. */ .d1-page .d1-plan-stage { margin:0 auto; } .d1-page .d1-plan-viewport { display:block; position:absolute; inset:0; overflow:hidden; border-radius:6px; } .d1-page .d1-plan-viewport > .d1-plan--host { max-width:none; } /* Decorative locked-preview animation; no backend or payment-state coupling. */ .d1-page .d1-preview-scan { position:absolute; inset:0; display:block; pointer-events:none; } .d1-page .d1-preview-scan[hidden] { display:none; } .d1-page .d1-scan-track { position:absolute; inset:0; animation:d1-preview-sweep 2s linear infinite; animation-play-state:paused; will-change:transform; } .d1-page .d1-scan-band { display:block; position:absolute; left:0; right:0; top:-23%; height:23%; box-sizing:border-box; border-bottom:1.5px solid #fff5bb; background:linear-gradient(transparent,#ffe9a07a 72%,#b982249e); } .d1-page .d1-scan-status { position:absolute; left:12%; right:12%; bottom:3.3%; min-height:28px; display:flex; align-items:center; justify-content:center; padding:3px 8px; box-sizing:border-box; border-radius:16px; background:#fff7dfe8; color:#9e2a18; font:400 clamp(11px,3.6cqi,14px)/1.4 var(--d1-sans); white-space:nowrap; } .d1-page .d1-scan-text { position:relative; display:inline-block; max-width:100%; } .d1-page .d1-scan-measure { visibility:hidden; } .d1-page .d1-scan-typed { position:absolute; top:0; left:0; white-space:nowrap; } @keyframes d1-preview-sweep { from { transform:translateY(0); } to { transform:translateY(123%); } } @media(prefers-reduced-motion:reduce){ .d1-page .d1-scan-track { display:none; animation:none; } } /* Price-layout candidate: keep the original grid for MY and SG quotes. */ .d1-page .d1-price-box { grid-template-columns:1fr 1.75fr 1fr; } .d1-page .d1-reference-space { min-width:0; } .d1-page .d1-price-main h2 { font-size:clamp(17px,4.8cqi,23px); white-space:nowrap; } .d1-page .d1-price-box .d1-money:not(.d1-money--pending) { font-size:clamp(32px,12.8cqi,59px); } .d1-page .d1-coffee span { font-size:clamp(11px,3.15cqi,14px); } /* Original MY reference column, scaled to its actual component width. */ .d1-page .d1-reference span { font-size:clamp(12px,3.6cqi,16px); } .d1-page .d1-reference s { font-size:clamp(16px,4.6cqi,21px); }