/* Actual finished artwork, complete captions, and a real video player. */
.hero-post.finished-hero{width:48%;top:50px}.hero-finished-art{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.finished-reel.hero-reel{padding:0;overflow:hidden;height:334px;top:53px;background:#493225}.finished-reel>img{width:100%;height:100%;object-fit:cover;display:block}.finished-reel .hero-video-label{position:absolute;top:11px;left:10px;right:10px;display:flex;align-items:center;gap:6px;background:#fffffff0;border-radius:30px;padding:7px 10px;font:600 9px var(--sans);color:#302436}.hero-video-label img{width:14px;height:14px}.finished-reel .play-symbol{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);background:#ffffffe0;border:1px solid #ffffffab;color:#34221d;width:46px;height:46px;margin:0}.actual-deliverables .format-tile>img{width:100%;height:214px;display:block;object-fit:cover;border-radius:5px;box-shadow:0 3px 8px #30243619}.actual-deliverables .reel-tile>img{object-fit:cover;object-position:center}.portfolio-section{background:#f5f2fa}.portfolio-disclaimer{display:flex;gap:18px;align-items:flex-start;margin:0 0 30px;color:#796b83;font-size:12px;line-height:1.9}.portfolio-disclaimer>strong{white-space:nowrap;font-size:12px;font-weight:600;background:#e7dcf1;color:#62487d;padding:4px 11px;border-radius:4px}.portfolio-disclaimer p{max-width:830px;margin:1px 0 0}.portfolio-studio{border:1px solid #dacee5;box-shadow:0 18px 60px #4030460a;overflow:hidden;border-radius:15px}.portfolio-studio .sample-tabs{padding:0;border-bottom:1px solid #e8dfee}.portfolio-studio .sample-tabs button{min-height:91px;gap:12px;border-left:1px solid #f0ebf4}.portfolio-studio .sample-tabs button:first-child{border-left:0}.portfolio-studio .tab-copy small{font-size:12px;font-weight:500;letter-spacing:.02em;line-height:1.6}.portfolio-studio .sample-tabs button .tab-copy{font-size:13px;line-height:1.7}.portfolio-panel.sample-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:58px;padding:45px 48px 50px;align-items:start;background:#fff}.real-display{width:100%;max-width:455px;margin:auto}.portfolio-account{display:flex;gap:11px;align-items:center;padding:0 0 17px;text-align:left}.case-avatar{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:50%;font:500 19px var(--serif)}.cafe-avatar{background:#efe3ce;color:#6c4633}.yohaku-avatar{background:#e7ede5;color:#485b4b}.portfolio-account>div{min-width:0}.portfolio-account strong{display:block;font-size:12px;font-weight:600;color:#36283f}.portfolio-account small{display:block;font-size:11px;color:#7f6f86;margin-top:4px}.portfolio-account>img{margin-left:auto;flex-shrink:0;width:22px;height:22px}.artwork-button{display:block;width:100%;border:0;padding:0;background:none;cursor:zoom-in;text-align:left;line-height:0;border-radius:2px;overflow:hidden;box-shadow:0 8px 28px #40392e14}.artwork-button>img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.artwork-button:hover{outline:2px solid #bda6d0;outline-offset:3px}.artwork-button:focus-visible{outline:3px solid #6943b3;outline-offset:4px}.artwork-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;line-height:1.8;margin-top:16px;color:#836d8a}.artwork-actions a{font-size:12px;color:#6d4989;border-bottom:1px solid #c3aecf;padding-bottom:2px;white-space:nowrap}.real-copy.sample-explanation{padding-top:2px}.real-copy .format-label{font-size:12px;letter-spacing:.05em;color:#886798}.real-copy.sample-explanation h3{font-size:27px;line-height:1.65;margin:20px 0 18px;font-weight:700;letter-spacing:-.035em}.real-copy .case-problem{font-size:12px;line-height:1.9;padding:16px 19px;background:#f8f4fc;border-left:3px solid #bfa2d4;color:#786285;margin:0 0 22px}.case-reason{margin:0 0 27px}.case-reason>div{display:grid;grid-template-columns:43px 1fr;gap:13px;border-bottom:1px solid #efe8f3;padding:13px 0}.case-reason dt{font-size:12px;font-weight:600;color:#855e9e;padding-top:1px}.case-reason dd{font-size:12px;line-height:1.9;color:#66546e;margin:0}.caption-details{border:1px solid #e5dbe9;background:#fff;border-radius:6px;margin-top:21px;overflow:hidden}.caption-details>summary{cursor:pointer;font-size:12px;font-weight:600;color:#685173;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;background:#fcfafd;list-style:none}.caption-details>summary::-webkit-details-marker{display:none}.caption-details>summary:after{content:'＋';font-size:16px;font-weight:400}.caption-details[open]>summary:after{content:'−'}.caption-details>summary>span{font:12px var(--latin);color:#846696;margin-left:auto;letter-spacing:.12em}.finished-caption{white-space:pre-line;font-size:12px;line-height:1.95;color:#635569;border-top:1px solid #e9dfee;padding:22px 23px;background:#fff}.portfolio-deliverable{display:flex;flex-wrap:wrap;gap:7px;margin-top:23px}.portfolio-deliverable span{font-size:12px;color:#7c5f8c;background:#f1ebf6;padding:5px 10px;border-radius:3px}.real-copy .fine{font-size:12px;line-height:1.9;margin-top:17px;color:#816e8a}.finished-carousel{width:100%}.finished-slide{margin:0}.finished-slide figcaption{font-size:12px;color:#8c8092;text-align:center;line-height:1.7;margin-top:14px}.real-display .carousel-controls{margin-top:15px}.portfolio-thumbnails{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-top:18px}.portfolio-thumbnails button{position:relative;border:2px solid transparent;padding:3px;border-radius:3px;background:#f3efe8;cursor:pointer;opacity:.65;transition:opacity .2s,border-color .2s}.portfolio-thumbnails button:hover{opacity:1}.portfolio-thumbnails button[aria-pressed="true"]{border-color:#8d6ba7;opacity:1;background:#fff}.portfolio-thumbnails img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block}.portfolio-thumbnails span{position:absolute;bottom:3px;right:3px;color:#fff;background:#4c3b55d9;padding:2px 4px;font:12px var(--latin)}.artwork-hint{font-size:12px;color:#816c8d;line-height:1.8;text-align:center;margin-top:16px}.editorial-sequence{list-style:none;padding:0;margin:8px 0 27px}.editorial-sequence>li{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid #eee6f3;font-size:12px;line-height:1.9;color:#826d8a}.editorial-sequence b{font:13px var(--latin);color:#88669d;padding-top:3px}.editorial-sequence strong{display:block;color:#4e3e58;font-weight:600;font-size:12px;margin-bottom:2px}#portfolio-video{display:block;width:100%;max-width:360px;aspect-ratio:9/16;height:auto;background:#382920;margin:0 auto;border-radius:7px;box-shadow:0 7px 30px #40372c22}.real-display .reel-play{width:100%;max-width:360px;margin:15px auto 0;min-height:44px;display:block;background:#f4edf8;border:1px solid #d5bedf;border-radius:5px;font-size:12px;color:#704686}.reel-timeline{display:flex;flex-direction:column;gap:0;margin:23px 0}.reel-timeline button{position:relative;cursor:pointer;border:0;border-bottom:1px solid #e8dded;padding:16px 17px 16px 92px;background:#fff;text-align:left}.reel-timeline button[aria-pressed="true"]{background:#f4edf9;border-left:3px solid #9d71bb;padding-left:89px}.reel-timeline button b{position:absolute;top:19px;left:16px;font-size:12px;color:#815e96;font-weight:500}.reel-timeline button strong{display:block;font-size:12px;font-weight:600;color:#625070}.reel-timeline button span{display:block;font-size:12px;color:#79608a;line-height:1.8;margin-top:5px}.x-purpose-tabs{display:flex;gap:4px;background:#f3eff6;border-radius:5px;padding:4px;margin-bottom:18px}.x-purpose-tabs button{flex:1;padding:10px 5px;cursor:pointer;font-size:12px;border:0;border-radius:3px;background:none;color:#8e7799}.x-purpose-tabs button[aria-pressed="true"]{background:#fff;box-shadow:0 1px 4px #2f203512;color:#4b3659;font-weight:600}.real-x-post{border:1px solid #ddd5e4;border-radius:12px;padding:24px;background:#fff;box-shadow:0 12px 32px #3d28440a;text-align:left}.real-x-post>header{display:flex;align-items:center;gap:10px}.real-x-post>header>div{min-width:0}.real-x-post>header strong{font-size:12px;display:block}.real-x-post>header small{display:block;font-size:11px;color:#846a8e;margin-top:3px}.real-x-post>header>.sns-logo{margin-left:auto;width:27px;height:27px;border-radius:5px}.real-x-post>header>.sns-logo img{width:16px;height:16px}.real-x-post>p{font-size:13px;line-height:2.05;color:#4c3d55;margin:21px 0 19px}.real-x-post .artwork-button{box-shadow:none;border-radius:5px;max-width:315px;margin:auto}.real-x-post footer{font-size:11px;color:#866992;border-top:1px solid #eee6f2;padding-top:14px;margin-top:19px}.text-only-post{min-height:408px}.x-editor-note{font-size:12px!important;line-height:2.05!important;border-top:1px solid #ece3f1;padding-top:23px;color:#826a8e!important}.portfolio-close{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:32px 0 0}.portfolio-close strong{font-size:18px;color:#5c416c}.portfolio-close p{font-size:12px;line-height:1.95;color:#7b6488;margin-top:8px}.portfolio-close>a{display:inline-block;white-space:nowrap;border:1px solid #b79ac9;background:#fff;color:#6f4b87;font-size:12px;font-weight:600;padding:16px 22px;border-radius:5px}.portfolio-close>a:hover{background:#6a4584;color:#fff}.artwork-dialog{border:0;padding:0;border-radius:10px;background:#f5f1e9;max-width:min(960px,94vw);width:94vw;max-height:94dvh;overflow:auto;box-shadow:0 20px 80px #16111955}.artwork-dialog::backdrop{background:#191321dc;backdrop-filter:blur(5px)}.artwork-dialog>img{display:block;width:100%;height:auto;object-fit:contain}.lightbox-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;position:sticky;top:0;z-index:2;padding:14px 21px;background:#fffcf8f5;border-bottom:1px solid #e2d6c6;backdrop-filter:blur(5px)}.lightbox-toolbar p{font-size:12px;color:#716356}.lightbox-toolbar>div{display:flex;gap:18px;align-items:center}.lightbox-toolbar a{font-size:12px;color:#78624d;text-decoration:underline;white-space:nowrap}.lightbox-toolbar button{cursor:pointer;border:1px solid #d0c0af;border-radius:4px;background:#fff;padding:9px 14px;white-space:nowrap;font:12px var(--sans);color:#5f4b39}body:has(.artwork-dialog[open]){overflow:hidden}
@media(max-width:1100px){.finished-reel.hero-reel{height:307px}.actual-deliverables .format-tile>img{height:205px}.portfolio-panel.sample-panel{padding:35px 32px;gap:35px}.real-copy.sample-explanation h3{font-size:24px}.portfolio-studio .sample-tabs button{gap:9px}.portfolio-studio .sample-tabs button .tab-copy{font-size:12px}.portfolio-studio .tab-copy small{font-size:12px}.portfolio-account strong{font-size:11px}.portfolio-account small{font-size:11px}.finished-caption{padding:20px;font-size:12px}}
@media(max-width:850px){.finished-reel.hero-reel{height:260px}.finished-reel .hero-video-label{top:9px;left:7px;right:7px;font-size:9px;padding:5px 6px;gap:4px}.hero-video-label img{width:12px;height:12px}.finished-reel .play-symbol{width:34px;height:34px;font-size:12px}.hero-post.finished-hero{width:53%}.actual-deliverables .format-tile>img{height:265px;object-fit:cover}.portfolio-panel.sample-panel{padding:28px 23px;gap:26px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.real-copy.sample-explanation h3{font-size:21px}.real-copy .case-problem{padding:13px;font-size:12px}.case-reason>div{gap:9px;grid-template-columns:32px 1fr}.case-reason dt{font-size:12px}.case-reason dd{font-size:12px}.portfolio-studio .sample-tabs button{gap:6px;padding:17px 7px}.portfolio-studio .sample-tabs button .tab-copy{font-size:12px}.portfolio-studio .tab-copy small{font-size:12px}.portfolio-account small{font-size:11px}.portfolio-account strong{font-size:11px}.case-avatar{width:29px;height:29px;font-size:16px}.portfolio-account{gap:8px}.finished-caption{font-size:12px;padding:16px}.caption-details>summary{font-size:12px;padding:14px}.real-copy .format-label{font-size:12px}.portfolio-deliverable span{font-size:12px}.editorial-sequence strong{font-size:12px}.editorial-sequence>li{font-size:12px;gap:9px}.real-x-post{padding:18px}.real-x-post>p{font-size:11px}.real-x-post>header strong{font-size:11px}.real-x-post>header small{font-size:11px}.reel-timeline button{padding-left:17px;padding-top:38px}.reel-timeline button[aria-pressed="true"]{padding-left:14px}.reel-timeline button b{top:15px}.portfolio-close strong{font-size:16px}.portfolio-close p{font-size:12px}.portfolio-close>a{font-size:12px;padding:15px}}
@media(max-width:640px){.hero-post.finished-hero{width:53%;top:50px}.finished-reel.hero-reel{height:264px;top:57px}.finished-reel .hero-video-label{font-size:9px}.actual-deliverables .format-tile>img{height:174px}.portfolio-disclaimer{display:block;font-size:12px;line-height:1.95;margin-bottom:24px}.portfolio-disclaimer>strong{display:inline-block;margin-bottom:10px}.portfolio-section .section-head h2{font-size:28px}.portfolio-studio{border-radius:9px}.portfolio-studio .sample-tabs button{min-height:78px;padding:13px 10px;gap:10px}.portfolio-studio .sample-tabs button .tab-copy{font-size:12px}.portfolio-studio .tab-copy small{font-size:12px}.portfolio-panel.sample-panel{display:flex;flex-direction:column;padding:24px 16px 29px;gap:32px}.portfolio-panel.sample-panel[hidden]{display:none}.real-display{max-width:420px}.portfolio-account{padding-bottom:15px;gap:9px}.portfolio-account strong{font-size:11px}.portfolio-account small{font-size:11px}.case-avatar{width:32px;height:32px;font-size:18px}.real-copy.sample-explanation{width:100%;padding:25px 0 0;border-top:1px solid #eadff1}.real-copy.sample-explanation h3{font-size:23px;line-height:1.7;margin:17px 0}.real-copy .format-label{font-size:12px}.real-copy .case-problem{font-size:12px;padding:14px 15px}.case-reason>div{grid-template-columns:36px 1fr;gap:10px;padding:12px 0}.case-reason dt{font-size:12px}.case-reason dd{font-size:12px}.finished-caption{font-size:12px;line-height:2;padding:17px}.caption-details>summary{font-size:12px;padding:15px}.portfolio-deliverable span{font-size:12px;padding:5px 8px}.artwork-actions{font-size:12px;gap:8px}.artwork-actions a{font-size:12px}.portfolio-thumbnails{gap:6px}.portfolio-thumbnails button{padding:2px}.editorial-sequence strong{font-size:12px}.editorial-sequence>li{font-size:12px;gap:11px}.reel-timeline button{padding:16px 15px 16px 86px}.reel-timeline button[aria-pressed="true"]{padding-left:83px}.reel-timeline button b{top:20px;left:12px;font-size:12px}.reel-timeline button strong{font-size:12px}.reel-timeline button span{font-size:12px}.real-x-post{padding:19px}.real-x-post>p{font-size:12px}.real-x-post>header strong{font-size:11px}.real-x-post>header small{font-size:11px}.x-purpose-tabs button{font-size:12px;padding-block:11px}.text-only-post{min-height:375px}.portfolio-close{display:block;padding-top:28px}.portfolio-close strong{font-size:17px}.portfolio-close p{font-size:12px}.portfolio-close>a{display:block;text-align:center;font-size:12px;margin-top:17px;padding:16px}.lightbox-toolbar{gap:8px;padding:11px 12px}.lightbox-toolbar p{font-size:12px}.lightbox-toolbar>div{gap:9px}.lightbox-toolbar a{font-size:12px}.lightbox-toolbar button{padding:9px 10px;font-size:12px}.artwork-dialog{max-width:96vw;width:96vw;max-height:92dvh}}
@media(max-width:370px){.finished-reel.hero-reel{height:226px}.finished-reel .hero-video-label{font-size:9px;padding:5px}.hero-video-label img{width:10px;height:10px}.actual-deliverables .format-tile>img{height:156px}.portfolio-studio .sample-tabs button{gap:7px;padding-inline:8px}.portfolio-studio .sample-tabs button .tab-copy{font-size:12px}.portfolio-studio .tab-copy small{font-size:12px}.portfolio-panel.sample-panel{padding:21px 13px 26px}.real-copy.sample-explanation h3{font-size:21px}.portfolio-account strong{font-size:11px}.portfolio-account small{font-size:11px}.real-x-post{padding:14px}.real-x-post>p{font-size:11px}}
/* Keep completed artwork aligned with its brief, even when captions are expanded. */
.portfolio-panel .real-display{margin:0 auto;align-self:start}.portfolio-account,.artwork-actions{width:100%}
@media(min-width:641px){.portfolio-panel .real-display{position:sticky;top:104px}}
