/* Full-page HTML previews; wheel input remains with the parent LP. */
.luxury-studio #works .portfolio-item{height:128svh;min-height:980px}.luxury-studio #works .work-scene{top:94px}.luxury-studio #works .portfolio-stage{height:auto;min-height:0;max-height:none;padding:20px 0 0;display:block}.luxury-studio #works .live-browser{width:85%;max-width:710px;margin:0 auto;background:#171717;border:1px solid #ffffff30;border-radius:7px;overflow:hidden;box-shadow:0 30px 70px #0008;transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0) rotateY(var(--scene-tilt,0deg)) rotateZ(var(--scene-rotate,0deg)) scale(var(--scene-scale,1));transform-origin:center 70%;transition:border-color .7s}.luxury-studio #works .live-browser:hover{border-color:#ffffff65}.live-toolbar{height:30px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#222;color:#aba69b;font-size:9px;letter-spacing:.02em}.live-toolbar small{font-size:7px;margin-left:10px;color:#dbd5c9}.live-dots{font-size:9px;letter-spacing:3px;color:#80786d}.live-viewport{position:relative;height:clamp(420px,calc(100svh - 400px),680px);overflow:hidden;background:#eeede7;isolation:isolate}.live-viewport iframe{position:absolute;left:0;top:0;transform-origin:0 0;transform:scale(var(--preview-scale,1));border:0;pointer-events:none;opacity:0;transition:opacity .7s}.live-viewport.loaded iframe{opacity:1}.preview-placeholder{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#292822;gap:20px}.preview-placeholder>span{font-size:80px;font-weight:400;line-height:1}.preview-placeholder>p{font-size:18px}.preview-placeholder small{font-size:11px;color:#6d6b64}.live-viewport.loaded .preview-placeholder{visibility:hidden}.preview-foot{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;gap:15px;font-size:8px;color:#b0aa9e}.preview-instruction{font-size:9px}.luxury-studio #works .portfolio-caption{padding-top:20px}.luxury-studio #works .site-structure{font-size:11px;line-height:1.9;color:#aaa69e;margin-top:9px}.project-actions{display:flex;align-items:center;justify-content:flex-end;gap:35px;margin-top:18px}.luxury-studio #works .project-actions .project-open{position:static;inset:auto;display:flex;align-items:center;gap:25px;padding:10px 0;min-height:44px;background:transparent;border-bottom:1px solid #ffffff30;border-radius:0;color:#ccc6b9;font-size:13px;cursor:pointer;z-index:auto}.luxury-studio #works .project-actions .project-open>span{display:inline;opacity:1;font-size:18px;min-height:0;padding:0;background:none;line-height:1}.demo-link{display:flex;align-items:center;justify-content:space-between;min-width:180px;min-height:46px;border-bottom:1px solid #b6afa1;font-size:16px;color:#f2f0eb;gap:30px}.demo-link>span{font-size:24px;transition:transform .5s}.demo-link:hover>span{transform:translate(4px,-3px)}.demo-link:hover{background:#f2f0eb;color:#151515;padding:0 12px}.luxury-studio #works .portfolio-caption-bottom{margin-top:16px}.luxury-studio #works .fullsite-dialog{width:95vw;max-width:1500px;height:94svh;max-height:94svh;margin:auto;padding:0;border:1px solid #ffffff35;background:#111;overflow:hidden}.fullsite-dialog[open]{display:flex;flex-direction:column}.fullsite-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 24px;flex-shrink:0}.fullsite-head>div>span{font-size:9px;color:#aaa399}.luxury-studio #works .fullsite-head h2{font-size:19px;font-weight:450;line-height:1.5;margin-top:3px}.luxury-studio #works .fullsite-head .project-close{position:static;border-radius:0;width:auto;height:auto;padding:10px 16px;font-size:13px;background:#222;min-height:44px}.fullsite-dialog>iframe{width:100%;flex:1;min-height:0;border:0;background:#eeede7}.fullsite-foot{display:flex;align-items:center;justify-content:space-between;padding:17px 24px;gap:20px;font-size:12px;flex-shrink:0}.fullsite-foot>span{color:#aaa399}.fullsite-link{border-bottom:1px solid #aaa399;padding:6px 0;font-size:14px}.fullsite-dialog::backdrop{background:#000d}
@keyframes page-tour{0%,8%{transform:translateY(0) scale(var(--preview-scale,1))}80%,88%{transform:translateY(var(--preview-travel,0px)) scale(var(--preview-scale,1))}100%{transform:translateY(0) scale(var(--preview-scale,1))}}
@media(min-width:901px) and (hover:hover) and (pointer:fine){.live-viewport.loaded:is(:hover,:focus-visible) iframe{animation:page-tour var(--preview-duration,60s) linear infinite}.luxury-studio #works .project-recruiting .live-browser{margin-left:auto;margin-right:0}.luxury-studio #works .project-restaurant .live-browser{margin-left:0}.luxury-studio #works .project-realestate .live-browser{width:95%}}
@media(max-width:900px){.luxury-studio #works .portfolio-item{height:auto;min-height:0;margin-bottom:90px!important}.luxury-studio #works .work-scene{top:auto}.luxury-studio #works .portfolio-stage{padding:20px 0 0;overflow:visible}.luxury-studio #works .live-browser{width:100%;max-width:650px;transform:none}.live-viewport{height:620px}.preview-instruction{display:none}.luxury-studio #works .portfolio-caption{padding-top:24px}.luxury-studio #works .site-structure{font-size:13px}.fullsite-foot>span{display:none}.fullsite-foot{justify-content:flex-end}}
@media(max-width:600px){.live-viewport{height:490px}.live-toolbar{height:25px;font-size:8px;padding:0 9px}.live-toolbar small{font-size:6px;margin-left:5px}.live-dots{font-size:7px;letter-spacing:1px}.preview-foot{height:27px;font-size:7px}.luxury-studio #works .live-browser{border-radius:4px}.luxury-studio #works .portfolio-title h3{font-size:20px}.luxury-studio #works .portfolio-title .portfolio-category{font-size:11px}.luxury-studio #works .portfolio-caption>p{font-size:16px}.luxury-studio #works .portfolio-caption .site-structure{font-size:12px;line-height:2}.project-actions{justify-content:space-between;gap:25px;margin-top:20px}.demo-link{min-width:165px;font-size:16px;min-height:50px}.luxury-studio #works .project-actions .project-open{font-size:14px;gap:15px;min-height:50px}.luxury-studio #works .portfolio-caption-bottom{font-size:10px;gap:20px}.luxury-studio #works .portfolio-caption-bottom>span:last-child{font-size:9px;max-width:140px;text-align:right}.luxury-studio #works .fullsite-dialog{width:100%;height:100svh;max-height:100svh;max-width:100%;border:0}.fullsite-head{padding:10px 14px;gap:10px}.luxury-studio #works .fullsite-head h2{font-size:15px}.fullsite-head>div{min-width:0}.luxury-studio #works .fullsite-head .project-close{font-size:12px;white-space:nowrap;padding:10px}.fullsite-foot{padding:10px 15px}.fullsite-link{font-size:13px;min-height:44px;display:flex;align-items:center}}
@media(prefers-reduced-motion:reduce){.live-viewport iframe{animation:none!important}.luxury-studio #works .live-browser{transform:none!important;transition:none}}
.motion-paused .live-viewport iframe{animation:none!important}.motion-paused #works .live-browser{transform:none!important}
@media(min-width:901px){.luxury-studio #works .live-browser{max-width:600px;width:78%}.luxury-studio #works .project-realestate .live-browser{max-width:680px;width:88%}}
.luxury-studio #works .portfolio-item .portfolio-stage{padding:20px 0 0}
.fullsite-content{flex:1;min-height:0;background:#eeede7}.fullsite-content>iframe{display:block;width:100%;height:100%;border:0}

@media(max-width:600px){.project-actions{flex-direction:column;align-items:stretch;gap:10px}.luxury-studio #works .project-actions .project-open,.project-actions .demo-link{width:100%;justify-content:space-between;font-size:15px;min-height:50px}}

/* One consistent presentation axis for all six website previews. */
.luxury-studio #works .portfolio-item .live-browser{margin-inline:auto;transform:none}
@media(min-width:901px){.luxury-studio #works .portfolio-item .live-browser{width:78%;max-width:600px}}

.feeling-tag{display:block;font-size:10px;font-weight:400;letter-spacing:.08em;color:#b0b5a6;margin-top:12px;line-height:1.7}
/* Browser chrome echoes each brand; live pages keep their original colors. */
.project-corporate{--preview-paper:#0A0A0A;--preview-ink:#F5F5F5;--preview-accent:#2457FF}.project-recruiting{--preview-paper:#FF5A36;--preview-ink:#1B1B1B;--preview-accent:#FFD84A}.project-restaurant{--preview-paper:#F7F4ED;--preview-ink:#1E1D1A;--preview-accent:#2F4738}.project-beauty{--preview-paper:#EFEAFF;--preview-ink:#111111;--preview-accent:#B5A6FF}.project-realestate{--preview-paper:#111A2A;--preview-ink:#F6F2EA;--preview-accent:#C9A86A}.project-medical{--preview-paper:#EAF8F2;--preview-ink:#31413C;--preview-accent:#64C7B0}
#works .live-toolbar{background:var(--preview-paper);color:var(--preview-ink);border-bottom:1px solid var(--preview-accent)}#works .live-toolbar small,#works .live-dots{color:var(--preview-ink)}
.work-social-note{font-size:12px!important;line-height:1.8;color:#b5bdac;letter-spacing:.03em;margin-top:18px}
.project-recruiting .live-toolbar{background:#eef5fb;color:#1565c0;border-bottom-color:#dcecf8}
.project-corporate .live-toolbar{background:#f6f6f6;color:#c8102e;border-bottom-color:#ddd}

#works a.live-viewport{display:block;cursor:pointer;text-decoration:none;color:inherit}#works a.live-viewport iframe{pointer-events:none}#works a.live-viewport:focus-visible{outline:2px solid #c7ff3d;outline-offset:-3px}

/* Keep the Japanese outline heading as one normally shaped text run. */
.kuro-studio #works .section-heading h2 .outline-word{
 display:inline-block;
 font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
 font-weight:500;
 font-style:normal;
 font-stretch:normal;
 font-feature-settings:normal;
 letter-spacing:0;
 line-height:1.45;
 white-space:nowrap;
 vertical-align:baseline;
 transform:none;
 color:transparent;
 -webkit-text-fill-color:transparent;
 -webkit-text-stroke:.8px #f3f0e8;
}

/* Lightweight static top-page previews. */
#works a.live-viewport{height:auto;aspect-ratio:8/5;}
#works .work-top-image{display:block;width:100%;height:100%;object-fit:contain;object-position:top;margin:0;transform:none;}
