/* Project-specific illustrated stories; motion is progressive enhancement. */
#rj-experience .im-film {
  --im-accent:#bea1fb; --im-paper:#e2d3fb; --im-ink:#332543;
  --im-base:#24202e; --im-edge:#51425e;
  width:calc(100vw - 32px); position:relative; left:50%; transform:translateX(-50%);
  height:210svh; margin:36px 0 70px; isolation:isolate;
}
#rj-experience .im-corescribe-film {--im-accent:#f3d679;--im-paper:#f5e8b9;--im-ink:#483b2d;--im-base:#27241f;--im-edge:#655838;height:225svh}
#rj-experience .im-alloy-film {--im-accent:#aee3c2;--im-paper:#d3efde;--im-ink:#244c3a;--im-base:#1e2c27;--im-edge:#405c4c;height:215svh}
#rj-experience .im-daydream-film {--im-accent:#f1ac99;--im-paper:#f4d8c6;--im-ink:#613e40;--im-base:#342627;--im-edge:#755b50;height:200svh}
#rj-experience .im-ai-film {height:230svh}
#rj-experience .im-screen {position:sticky;top:16px;height:calc(100svh - 32px);min-height:610px;max-height:1040px;border-radius:32px;overflow:hidden;background:var(--im-base);border:1px solid var(--im-edge);isolation:isolate;perspective:1400px}
#rj-experience .im-heading {position:absolute;left:5%;top:5%;z-index:4;pointer-events:none}
#rj-experience .im-heading>span {display:block;font-size:10px;font-weight:800;letter-spacing:.13em;color:var(--im-accent);margin:0 0 19px}
#rj-experience .im-heading h2 {font-size:clamp(32px,4vw,61px);font-weight:800;line-height:1.04;letter-spacing:-.055em;margin:0;color:#f7f5ed}
#rj-experience .im-art {position:absolute;inset:22% 4% 20%;perspective:1400px;pointer-events:none}
#rj-experience .im-art>div {position:absolute;inset:0;perspective:1400px}
#rj-experience .im-art * {transition:none!important}
#rj-experience .im-caption {position:absolute;z-index:5;bottom:7%;left:5%;right:5%;display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
#rj-experience .im-caption>p {font-size:14px;line-height:1.8;max-width:420px;color:#ddd6de;margin:0}
#rj-experience .im-film-actions {display:flex;align-items:flex-end;flex-direction:column;gap:8px;flex-shrink:0}
#rj-experience .im-scroll-cue {font-size:10px;color:var(--im-accent);letter-spacing:.03em}
#rj-experience .im-film-actions button {min-height:44px;font-weight:800;font-size:12px;line-height:1.4;border:0;border-radius:14px;padding:11px 19px;background:var(--im-accent);color:var(--im-ink);box-shadow:0 4px var(--im-edge)}
#rj-experience .im-film-actions button:active {transform:translateY(3px);box-shadow:0 1px var(--im-edge)}
#rj-experience .im-film-actions .im-play {display:none}
#rj-experience .im-film-note {position:absolute;left:5%;bottom:2.7%;font-size:9px;letter-spacing:.03em;color:#bdb4c2;z-index:4}
#rj-experience .im-track {height:3px;position:absolute;bottom:0;left:0;right:0;background:#ffffff08}
#rj-experience .im-track i {display:block;height:100%;background:var(--im-accent);transform-origin:0 50%}
#rj-experience .im-window-bar {display:flex;justify-content:space-between;align-items:center;padding:15px 22px;border-bottom:1px solid #8a7e9b40;font-size:10px;letter-spacing:.04em;gap:8px}
#rj-experience .im-window-bar>span:first-child {font-size:8px;letter-spacing:3px;opacity:.6}
#rj-experience .im-window-bar b {font-weight:600}

/* Clouseau: the retained source and its own close-up, on a large inspection desk. */
#rj-experience .im-clinic-source {position:absolute;left:6%;top:3%;width:55%;height:91%;border:1px solid #6f6085;border-radius:22px;background:#19171f;box-shadow:0 14px 0 #151219,0 28px 65px #09060e55;transform:perspective(1100px) rotateY(7deg) rotateZ(-2deg);color:#d9c7ed}
#rj-experience .im-source-meta {display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;padding:17px 23px 0;color:#a99bb8}
#rj-experience .im-clinic-source .ww-retina {position:absolute;inset:18% 5% 7%;border:0;background:transparent;padding:0;margin:0;box-shadow:none}
#rj-experience .im-clinic-source .ww-retina svg {width:100%;height:100%;max-height:none;object-fit:contain}
#rj-experience .im-clinic .ww-image-tag {display:none}
#rj-experience .im-source-scale {display:flex;justify-content:space-between;position:absolute;bottom:15px;left:23px;right:23px;font-size:8px;color:#a99bb8}
#rj-experience .im-clinic-detail {position:absolute;right:6%;top:0;width:37%;height:89%;display:flex;flex-direction:column;align-items:center;gap:15px;filter:drop-shadow(0 22px 25px #100b1855)}
#rj-experience .im-detail-label {font-size:9px;letter-spacing:.1em;color:#d3c0e9;margin-top:8px}
#rj-experience .im-detail-lens {position:relative;width:min(100%,37vh);aspect-ratio:1;overflow:hidden;border-radius:50%;border:9px solid #ab8bd9;background:#1b1722;box-shadow:inset 0 0 0 3px #d5b8fb,0 9px #674a83,0 0 0 1px #d5b8fb}
#rj-experience .im-detail-lens .ww-retina {position:absolute;inset:-13% -52% -34% -5%;border:0;box-shadow:none;background:transparent;padding:0;margin:0;max-height:none}
#rj-experience .im-detail-lens svg {width:100%;height:100%;max-height:none;transform:scale(1.55);transform-origin:37% 46%}
#rj-experience .im-detail-lens svg text,#rj-experience .im-detail-lens svg g[stroke-width="3"] path {display:none}
#rj-experience .im-clinic-legend {display:flex;justify-content:center;gap:23px;font-size:10px;color:#e2d3fb}
#rj-experience .im-clinic-legend span {display:flex;align-items:center;gap:7px}
#rj-experience .im-clinic-legend i {width:8px;height:8px;border-radius:50%;background:#bfa6ff}
#rj-experience .im-clinic-legend span+span i {background:#91e6b7}
#rj-experience .im-pixel-swatch {position:absolute;right:7%;top:16%;width:27%;padding:22px;border-radius:18px;background:#392e48;border:1px solid #765c90;box-shadow:0 8px #211b2c;transform:rotate(5deg)}
#rj-experience .im-pixel-swatch>div {display:grid;grid-template-columns:repeat(8,1fr);gap:3px;margin-bottom:15px}
#rj-experience .im-pixel-swatch i {aspect-ratio:1;border-radius:2px;background:color-mix(in srgb,#ecad89 var(--pixel),#6f3347)}
#rj-experience .im-pixel-swatch>span {font-size:11px;line-height:1.6;color:#e2d3fb}
#rj-experience .im-review-strip {position:absolute;left:16%;right:8%;bottom:0;display:flex;align-items:center;gap:10px;padding:15px 18px;background:#372c44;border:1px solid #8e73ab;border-radius:18px;color:#e2d3fb;box-shadow:0 7px #18131f}
#rj-experience .im-review-strip>span {font-size:8px;letter-spacing:.08em;margin-right:10px}
#rj-experience .im-review-strip>b {background:#24212c;border:1px solid #756880;border-radius:10px;padding:10px 16px;font-size:11px;white-space:nowrap}
#rj-experience .im-review-strip .im-review-chosen {background:#d7c2f6;color:#432d5c}
#rj-experience .im-review-strip b i {font-style:normal;margin-left:9px}
#rj-experience .im-review-strip small {font-size:10px;line-height:1.5;margin-left:auto;max-width:155px}

/* CoreScribe: the signal occupies the room, then makes space for writing. */
#rj-experience .im-signal-label {position:absolute;top:5%;left:6%;font-size:9px;letter-spacing:.12em;color:#d5bd76;display:flex;gap:8px;align-items:center}
#rj-experience .im-record-dot {display:block;width:7px;height:7px;background:#f3d679;border-radius:50%}
#rj-experience .im-wide-wave {position:absolute;left:5%;right:5%;top:18%;height:62%;display:flex;gap:clamp(4px,.65vw,11px);align-items:center;justify-content:center}
#rj-experience .im-wide-wave i {flex:1;height:var(--level);max-width:11px;border-radius:15px;background:#f3d679;box-shadow:0 5px #8e742f;transform-origin:center}
#rj-experience .im-spoken {position:absolute;left:6%;top:25%;font-size:clamp(27px,3.8vw,61px);font-weight:800;line-height:1.26;letter-spacing:-.05em;color:#f5e8b9}
#rj-experience .im-word-choice {position:relative;display:inline-block;min-width:1.6em}
#rj-experience .im-word-choice>i {font-style:normal;text-decoration:underline;text-decoration-style:wavy;text-decoration-color:#e9a892;text-decoration-thickness:2px;text-underline-offset:7px}
#rj-experience .im-word-choice>b {position:absolute;left:0;top:0;font-weight:800;color:#ade0b8;border-bottom:2px solid #80b78d}
#rj-experience .im-scribe-destination {position:absolute;top:0;right:5%;width:40%;height:97%;background:#f5eddb;border:1px solid #e7d6ad;border-radius:20px;color:#514635;box-shadow:0 10px #a2926d,0 25px 45px #08060040;transform:rotate(3deg);overflow:hidden}
#rj-experience .im-note-body {padding:24px 28px}
#rj-experience .im-note-body>span {font-size:8px;letter-spacing:.12em;color:#968469}
#rj-experience .im-note-body h3 {font-size:clamp(24px,2.5vw,38px);letter-spacing:-.05em;line-height:1.16;margin:15px 0 23px;color:#4f4130}
#rj-experience .im-note-body p {font-size:clamp(14px,1.2vw,18px);line-height:1.9;color:#6e5b3e;margin:0}
#rj-experience .im-caret {display:inline-block;width:2px;height:1em;background:#b6924b;margin-left:3px;vertical-align:middle}
#rj-experience .im-note-lines {display:grid;gap:18px;margin-top:26px}
#rj-experience .im-note-lines i {height:1px;background:#d7c9ae}
#rj-experience .im-note-lines i:last-child {width:70%}
#rj-experience .im-inserted {position:absolute;bottom:17px;left:22px;right:22px;padding:12px;background:#d9e3c3;border-radius:10px;font-size:10px;font-weight:700;color:#4c643e}
#rj-experience .im-correction {position:absolute;left:6%;bottom:0;border-left:2px solid #8a7542;padding-left:17px;display:grid;gap:9px;color:#daca9e}
#rj-experience .im-correction>span {font-size:8px;letter-spacing:.13em}
#rj-experience .im-correction>b {font-size:23px;letter-spacing:-.035em;color:#f3d679}
#rj-experience .im-correction b i {font-style:normal;font-weight:400;color:#a08f62;margin:0 10px}
#rj-experience .im-correction small {font-size:10px;color:#c0b496}

/* Alloy: a workspace opens sideways; the conversation never disappears. */
#rj-experience .im-discord-window {position:absolute;top:4%;left:2%;width:69%;height:87%;border:1px solid #587260;border-radius:18px;background:#252730;box-shadow:0 12px #101b17,0 22px 50px #0d151e66;overflow:hidden;color:#bcd1c4;transform:perspective(1400px) rotateY(4deg) rotateZ(-1deg)}
#rj-experience .im-discord-window>.im-window-bar {background:#191d24;font-size:9px}
#rj-experience .im-discord-shell {display:flex;height:calc(100% - 43px)}
#rj-experience .im-channel-list {position:relative;width:30%;flex-shrink:0;background:#20232b;padding:22px 16px;font-size:11px;color:#9da8a4;display:flex;flex-direction:column;gap:13px}
#rj-experience .im-channel-list>strong {font-size:9px;color:#d9e3dc;margin-bottom:13px}
#rj-experience .im-channel-list>span {font-size:7px;letter-spacing:.08em;color:#89918c}
#rj-experience .im-channel-list>b {font-size:10px;font-weight:600;white-space:nowrap}
#rj-experience .im-channel-list>b:first-of-type {color:#e5f4ea}
#rj-experience .im-channel-list small {position:absolute;bottom:17px;left:16px;font-size:8px;color:#acd8b9}
#rj-experience .im-channel-list .im-new-channel {color:#b5f2c9;background:#35523f;border-radius:6px;padding:8px;margin-left:-7px}
#rj-experience .im-new-channel i {font-size:6px;font-style:normal;display:block;margin:4px 0 0 13px}
#rj-experience .im-discord-shell .ww-discord {border:0;border-radius:0;box-shadow:none;min-height:0;flex:1}
#rj-experience .im-discord-shell .ww-server-rail {display:none}
#rj-experience .im-discord-shell .ww-discord-main {padding:0 20px 20px}
#rj-experience .im-discord-shell .ww-channel {font-size:14px;padding:17px 0}
#rj-experience .im-discord-shell .ww-channel>span {display:none}
#rj-experience .im-discord-shell .ww-message {margin:21px 0;gap:11px}
#rj-experience .im-discord-shell .ww-message p {font-size:13px;line-height:1.6}
#rj-experience .im-discord-shell .ww-message b {font-size:11px}
#rj-experience .im-discord-shell .ww-message>i {width:30px;height:30px;font-size:11px}
#rj-experience .im-tool-drawer {position:absolute;right:2%;top:0;width:31%;min-height:89%;padding:23px;background:#d3efde;color:#244c3a;border:1px solid #b1d4be;border-radius:19px;box-shadow:0 9px #67997b,0 16px 35px #0a191b60;transform:rotate(3deg)}
#rj-experience .im-tool-title>span {font-size:8px;letter-spacing:.1em;display:block}
#rj-experience .im-tool-title>b {font-size:clamp(23px,2.2vw,34px);line-height:1.15;letter-spacing:-.05em;display:block;margin:13px 0 20px}
#rj-experience .im-tool-drawer dl {margin:0;display:grid;gap:0}
#rj-experience .im-tool-drawer dl div {display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-top:1px solid #8db5a044;font-size:10px}
#rj-experience .im-tool-drawer dt {color:#517560}
#rj-experience .im-tool-drawer dd {margin:0;text-align:right;font-weight:700}
#rj-experience .im-access {display:flex;flex-wrap:wrap;gap:6px;margin:15px 0;font-size:8px;font-weight:700;color:#3c6b50}
#rj-experience .im-access span {padding:6px;background:#b9dfc8;border-radius:6px}
#rj-experience .im-action-receipt {padding:15px;border:1px solid #7aac90;border-radius:11px;background:#244c3a;color:#d3efde}
#rj-experience .im-action-receipt>span {font-size:7px;letter-spacing:.1em;display:block}
#rj-experience .im-action-receipt strong {font-size:21px;letter-spacing:-.04em;display:block;margin:8px 0}
#rj-experience .im-action-receipt p {font-size:11px;line-height:1.6;margin:0}
#rj-experience .im-alloy-message {position:absolute;left:18%;bottom:-3%;padding:18px 24px;display:flex;gap:15px;align-items:center;background:#323c35;border:1px solid #6d927b;border-radius:15px;box-shadow:0 7px #101b17;transform:rotate(-2deg);color:#d3efde}
#rj-experience .im-alloy-message>span {background:#aee3c2;color:#244c3a;width:35px;height:35px;border-radius:11px;display:grid;place-items:center;font-size:14px;font-weight:800}
#rj-experience .im-alloy-message p {font-size:12px;line-height:1.7;margin:0}
#rj-experience .im-alloy-message b {display:block;font-size:10px}
#rj-experience .im-alloy-message small {font-size:7px;margin-left:6px;background:#aee3c2;color:#244c3a;border-radius:3px;padding:2px 4px}

/* Daydream: a panoramic composition gains depth and opens into its choices. */
#rj-experience .im-daydream-film .im-art {inset:28% 3% 22%}
#rj-experience .im-landscape-frame {position:absolute;left:9%;top:3%;width:77%;height:90%;border-radius:20px;background:#efdcc8;padding:10px;box-shadow:0 12px #916858,0 26px 60px #160c084d;transform-style:preserve-3d}
#rj-experience .im-landscape-frame .ww-landscape {height:100%;width:100%;margin:0;max-width:none;border:0;border-radius:12px;background:#eac98d;box-shadow:none}
#rj-experience .im-landscape-frame .ww-art-sun {width:clamp(65px,9vw,150px);height:auto;aspect-ratio:1;right:20%;top:14%;background:#fff0ae;box-shadow:0 0 0 19px #fff0ae29}
#rj-experience .im-landscape-frame .ww-mountain-back {background:#8aa38a;bottom:-22%;height:73%;border-radius:70px 90px 0 0}
#rj-experience .im-landscape-frame .ww-mountain-front {background:#3e6f58;height:71%;bottom:-33%;border-radius:75px 110px 0 0}
#rj-experience .im-landscape-frame .ww-art-water {background:#93c4ae;top:70%;height:55%}
#rj-experience .im-landscape-frame .ww-landscape>span {bottom:20px;left:23px;font-size:12px;font-weight:700;color:#254f3c}
#rj-experience .im-frame-label {position:absolute;right:23px;bottom:22px;font-size:8px;letter-spacing:.11em;color:#254f3c}
#rj-experience .im-crop-corners {position:absolute;inset:28px;pointer-events:none}
#rj-experience .im-crop-corners i {position:absolute;width:28px;height:28px;border-color:#fff4d4;border-style:solid;border-width:0}
#rj-experience .im-crop-corners i:nth-child(1) {top:0;left:0;border-left-width:2px;border-top-width:2px}
#rj-experience .im-crop-corners i:nth-child(2) {top:0;right:0;border-right-width:2px;border-top-width:2px}
#rj-experience .im-crop-corners i:nth-child(3) {bottom:0;left:0;border-left-width:2px;border-bottom-width:2px}
#rj-experience .im-crop-corners i:nth-child(4) {bottom:0;right:0;border-right-width:2px;border-bottom-width:2px}
#rj-experience .im-dream-brief {position:absolute;left:5%;top:-1%;padding:18px 23px;background:#f4d8c6;border-radius:14px;border:1px solid #e9c4b6;color:#613e40;box-shadow:0 7px #96655b;transform:rotate(-4deg)}
#rj-experience .im-dream-brief>span {display:block;font-size:8px;letter-spacing:.13em;margin-bottom:9px}
#rj-experience .im-dream-brief strong {font-size:21px;letter-spacing:-.05em}
#rj-experience .im-dream-brief p {font-size:10px;margin:8px 0 0}
#rj-experience .im-layer-selector {position:absolute;right:2%;top:15%;width:22%;border:1px solid #c99683;background:#efd5c2;padding:22px;border-radius:18px;box-shadow:0 8px #97675b;transform:rotate(4deg);color:#613e40}
#rj-experience .im-layer-selector>span {font-size:8px;letter-spacing:.12em;display:block;margin-bottom:13px}
#rj-experience .im-layer-selector>b {font-size:12px;display:flex;align-items:center;gap:12px;border-top:1px solid #c9968360;padding:16px 0}
#rj-experience .im-layer-selector i {width:35px;height:27px;border-radius:5px;background:#ebc886;border:2px solid #f9e8d5;box-shadow:0 3px #b49a7b;transform:rotate(-8deg)}
#rj-experience .im-layer-selector b:nth-of-type(2) i {background:#64886e}
#rj-experience .im-layer-selector b:nth-of-type(3) i {background:transparent;border-color:#906751}
#rj-experience .im-layer-selector>small {display:block;font-size:9px;line-height:1.7;padding-top:9px;color:#926758}
#rj-experience .im-revision-mark {position:absolute;right:7%;bottom:0;background:#7d574b;padding:16px 22px;border:1px solid #c89477;border-radius:13px;transform:rotate(-3deg);color:#fbe2cb;box-shadow:0 6px #412b26}
#rj-experience .im-revision-mark>span {font-size:7px;letter-spacing:.13em;display:block;margin-bottom:8px;color:#eab8a3}
#rj-experience .im-revision-mark>b {font-size:17px;line-height:1.3;letter-spacing:-.03em}

/* Open the application: a legible assembly, with each piece doing its own job. */
#rj-experience .im-ai-film .im-heading {top:4%}
#rj-experience .im-ai-app {position:absolute;left:3%;top:4%;width:36%;height:73%;padding:0 23px;background:#f3ead3;border:1px solid #eee0bb;border-radius:21px;color:#493852;box-shadow:0 10px #aaa089,0 24px 45px #0e081745;transform:rotate(-5deg)}
#rj-experience .im-ai-app .im-window-bar {padding:15px 0}
#rj-experience .im-app-label {display:block;font-size:8px;letter-spacing:.07em;color:#8b7790;margin:19px 0 13px}
#rj-experience .im-ai-app h3 {font-size:clamp(20px,2.15vw,33px);font-weight:800;letter-spacing:-.05em;line-height:1.25;margin:0}
#rj-experience .im-app-input {display:flex;justify-content:space-between;align-items:center;gap:8px;position:absolute;bottom:21px;left:22px;right:22px;background:#e2d6bf;border-radius:10px;padding:10px 12px;font-size:10px;color:#7c6886}
#rj-experience .im-app-input>b {display:grid;place-items:center;width:25px;height:25px;background:#b498d8;color:#4e3863;border-radius:8px;font-size:16px}
#rj-experience .im-ai-context {position:absolute;left:38%;top:-4%;width:29%;padding:22px;background:#d3efde;color:#244c3a;border:1px solid #bfdaca;border-radius:18px;transform:rotate(4deg);box-shadow:0 8px #699782}
#rj-experience .im-ai-context>span,#rj-experience .im-ai-model span,#rj-experience .im-ai-tool>span,#rj-experience .im-ai-result>span {display:block;font-size:8px;letter-spacing:.075em;line-height:1.5;font-weight:800}
#rj-experience .im-ai-context>strong {display:block;font-size:26px;letter-spacing:-.04em;line-height:1.15;margin:13px 0}
#rj-experience .im-ai-context>div {display:flex;gap:7px;font-size:9px}
#rj-experience .im-ai-context div b {padding:8px;border:1px solid #8cb6a0;border-radius:8px;font-weight:600}
#rj-experience .im-ai-context>p {font-size:10px;line-height:1.5;margin:14px 0 0}
#rj-experience .im-ai-model {position:absolute;left:36%;bottom:2%;width:34%;padding:20px;background:#aa86da;color:#35224e;border-radius:20px;border:1px solid #c6a4f0;box-shadow:0 10px #684490;transform:rotate(-3deg)}
#rj-experience .im-ai-model>div:first-child {display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
#rj-experience .im-ai-model b {font-size:16px;line-height:1.25;letter-spacing:-.035em}
#rj-experience .im-model-cells {display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin:18px 0}
#rj-experience .im-model-cells i {display:grid;place-items:center;font-style:normal;font-family:monospace;font-size:8px;aspect-ratio:1.3;border-radius:5px;background:color-mix(in srgb,#ead8ff var(--shade),#8055b5);box-shadow:0 3px #6e439655;color:#3e265a}
#rj-experience .im-ai-model>small {font-size:8px;line-height:1.5}
#rj-experience .im-ai-tool {position:absolute;right:2%;top:16%;width:25%;padding:23px;background:#f3d679;color:#594525;border-radius:18px;border:1px solid #e1c162;box-shadow:0 8px #a38a46;transform:rotate(5deg)}
#rj-experience .im-ai-tool>b {display:block;font-size:21px;letter-spacing:-.05em;margin:18px 0 6px}
#rj-experience .im-ai-tool>strong {font-size:60px;font-weight:800;line-height:1;letter-spacing:-.07em;display:block}
#rj-experience .im-ai-tool>p {font-size:10px;line-height:1.6;margin:14px 0 0}
#rj-experience .im-ai-result {position:absolute;left:6%;bottom:-3%;width:29%;padding:22px;background:#f6efe0;color:#524238;transform:rotate(3deg);border:1px solid #d8c6af;border-radius:17px;box-shadow:0 9px #948577}
#rj-experience .im-ai-result>span {color:#916f51}
#rj-experience .im-ai-result strong {display:block;font-size:23px;line-height:1.2;letter-spacing:-.04em;margin:15px 0}
#rj-experience .im-ai-result p {font-size:11px;margin:0 0 15px}
#rj-experience .im-ai-result>b {font-size:10px;color:#79628e}

/* Preserve the chapters, with more room for their original objects to breathe. */
@media (min-width:1100px) and (min-height:700px) {
  #rj-experience .rj-narrative {width:calc(100vw - 112px);left:50%;transform:translateX(-50%);grid-template-columns:minmax(340px,.76fr) minmax(0,1.24fr);gap:6vw}
  #rj-experience .rj-narrative-copy {padding-left:max(0px,calc((100vw - 1400px)/2))}
  #rj-experience .rj-narrative-copy article {max-width:470px}
  #rj-experience .rj-scene,#rj-experience .rj-meaning-scene {border-radius:30px}
  #rj-experience .im-film + .ww-world {margin-top:50px}
}
@media (min-width:801px) and (max-height:780px) and (min-height:651px) {
  #rj-experience .im-heading h2 {font-size:39px}
  #rj-experience .im-heading>span {margin-bottom:11px}
  #rj-experience .im-caption>p {font-size:12px;max-width:400px}
  #rj-experience .im-art {inset:24% 5% 23%}
  #rj-experience .im-tool-title>b {font-size:23px;margin-bottom:12px}
  #rj-experience .im-tool-drawer {padding:17px}
  #rj-experience .im-tool-drawer dl div {padding:5px 0}
  #rj-experience .im-action-receipt {padding:10px}
  #rj-experience .im-action-receipt strong {font-size:18px;margin:5px 0}
  #rj-experience .im-access {margin:8px 0}
  #rj-experience .im-note-body {padding:15px 23px}
  #rj-experience .im-note-body h3 {font-size:26px;margin:10px 0 15px}
  #rj-experience .im-ai-context {padding:15px 20px}
  #rj-experience .im-ai-context>strong {font-size:21px;margin:9px 0}
  #rj-experience .im-ai-model {padding:15px 20px}
  #rj-experience .im-model-cells {margin:10px 0}
  #rj-experience .im-ai-tool {padding:20px;top:9%}
  #rj-experience .im-ai-tool>strong {font-size:44px}
  #rj-experience .im-ai-result {padding:16px 20px}
  #rj-experience .im-ai-result strong {font-size:20px;margin:10px 0}
  #rj-experience .im-layer-selector {top:4%;padding:16px}
  #rj-experience .im-layer-selector>b {padding:10px 0}
  #rj-experience .im-layer-selector>small {display:none}
  #rj-experience .im-revision-mark {bottom:-3%}
}

/* Phone scenes play once in the reading flow. No pinned canvas can cover the text. */
@media (max-width:800px), (max-height:650px) {
  #rj-experience .im-film {width:calc(100vw - 24px);height:auto;margin:24px 0 45px}
  #rj-experience .im-screen {position:relative;top:auto;height:auto;max-height:none;min-height:0;border-radius:25px;display:flex;flex-direction:column}
  #rj-experience .im-heading {position:relative;inset:auto;padding:28px 25px 8px}
  #rj-experience .im-heading>span {font-size:8px;margin-bottom:15px}
  #rj-experience .im-heading h2 {font-size:clamp(29px,7.6vw,49px);line-height:1.1}
  #rj-experience .im-art,#rj-experience .im-daydream-film .im-art {position:relative;inset:auto;flex:none;height:clamp(275px,71vw,450px);margin:18px 10px 10px}
  #rj-experience .im-caption {position:relative;inset:auto;display:block;padding:16px 25px 20px}
  #rj-experience .im-caption>p {font-size:13px;line-height:1.8;max-width:540px}
  #rj-experience .im-film-actions {margin-top:20px;display:flex;flex-direction:row;align-items:center;gap:9px;flex-wrap:wrap}
  #rj-experience .im-scroll-cue {display:none}
  #rj-experience .im-film-actions button {font-size:11px;padding:12px 14px}
  #rj-experience .im-film-actions .im-play {display:block;background:transparent;border:1px solid var(--im-edge);color:var(--im-accent);box-shadow:none}
  #rj-experience .im-film-note {position:relative;inset:auto;padding:0 25px 23px;font-size:8px;line-height:1.6;max-width:460px}
  #rj-experience .im-window-bar {font-size:7px;padding:10px 12px;gap:3px}
  #rj-experience .im-window-bar>span:first-child {font-size:5px;letter-spacing:1px}
  #rj-experience .im-clinic-source {left:2%;top:8%;width:67%;height:78%;border-radius:13px}
  #rj-experience .im-source-meta {padding:12px 12px 0;font-size:6px}
  #rj-experience .im-source-scale {left:12px;right:12px;font-size:6px;bottom:10px}
  #rj-experience .im-clinic-detail {right:0;top:11%;width:44%;height:67%;gap:10px}
  #rj-experience .im-detail-label {font-size:6px;text-align:center}
  #rj-experience .im-detail-lens {border-width:5px;width:100%}
  #rj-experience .im-clinic-legend {gap:7px;font-size:6px;flex-wrap:wrap}
  #rj-experience .im-clinic-legend span {gap:3px}
  #rj-experience .im-clinic-legend i {width:5px;height:5px}
  #rj-experience .im-pixel-swatch {padding:12px;right:3%;top:20%;width:39%;border-radius:12px}
  #rj-experience .im-pixel-swatch>span {font-size:8px}
  #rj-experience .im-review-strip {left:3%;right:3%;bottom:2%;gap:5px;padding:10px;border-radius:11px;flex-wrap:wrap}
  #rj-experience .im-review-strip>span {font-size:6px;margin-right:2px}
  #rj-experience .im-review-strip>b {font-size:8px;padding:7px 10px;border-radius:7px}
  #rj-experience .im-review-strip b i {margin-left:3px}
  #rj-experience .im-review-strip small {flex-basis:100%;max-width:none;margin:1px 0 0;font-size:7px}
  #rj-experience .im-signal-label {font-size:7px;left:3%;top:6%}
  #rj-experience .im-wide-wave {gap:3px;left:2%;right:2%;height:42%;top:18%}
  #rj-experience .im-wide-wave i {box-shadow:0 2px #8e742f}
  #rj-experience .im-spoken {font-size:clamp(18px,5.1vw,32px);left:2%;top:24%;width:44%;z-index:1;line-height:1.35}
  #rj-experience .im-scribe-destination {width:47%;right:2%;height:84%;top:9%;border-radius:13px;transform:rotate(4deg)}
  #rj-experience .im-note-body {padding:15px 13px}
  #rj-experience .im-note-body>span {font-size:6px}
  #rj-experience .im-note-body h3 {font-size:18px;margin:13px 0 17px}
  #rj-experience .im-note-body p {font-size:9px;line-height:1.8}
  #rj-experience .im-note-lines {gap:11px;margin-top:17px}
  #rj-experience .im-inserted {left:12px;right:12px;bottom:13px;font-size:7px;padding:8px 6px;border-radius:6px}
  #rj-experience .im-correction {left:3%;bottom:5%;padding-left:9px;gap:5px;max-width:43%}
  #rj-experience .im-correction>span {font-size:6px}
  #rj-experience .im-correction>b {font-size:18px}
  #rj-experience .im-correction small {font-size:7px;line-height:1.6}
  #rj-experience .im-discord-window {left:0;top:2%;width:80%;height:87%;border-radius:12px}
  #rj-experience .im-channel-list {display:none}
  #rj-experience .im-discord-window>.im-window-bar {font-size:7px}
  #rj-experience .im-discord-shell .ww-discord-main {padding:0 12px 15px}
  #rj-experience .im-discord-shell .ww-channel {font-size:10px;padding:13px 0;margin-bottom:10px}
  #rj-experience .im-discord-shell .ww-message {gap:7px;margin:16px 0}
  #rj-experience .im-discord-shell .ww-message p {font-size:9px;line-height:1.5;max-width:140px}
  #rj-experience .im-discord-shell .ww-message b {font-size:8px}
  #rj-experience .im-discord-shell .ww-message>i {width:22px;height:22px;font-size:8px}
  #rj-experience .im-tool-drawer {width:43%;right:0;top:11%;padding:12px;border-radius:12px;min-height:75%}
  #rj-experience .im-tool-title>span {font-size:6px}
  #rj-experience .im-tool-title>b {font-size:20px;margin:9px 0 13px}
  #rj-experience .im-tool-drawer dl div {font-size:7px;padding:6px 0}
  #rj-experience .im-tool-drawer dl div:first-child {display:none}
  #rj-experience .im-access {font-size:6px;gap:3px;margin:10px 0}
  #rj-experience .im-access span {padding:4px}
  #rj-experience .im-action-receipt {padding:10px;border-radius:8px}
  #rj-experience .im-action-receipt>span {font-size:5px}
  #rj-experience .im-action-receipt strong {font-size:15px;margin:6px 0}
  #rj-experience .im-action-receipt p {font-size:8px}
  #rj-experience .im-alloy-message {left:2%;bottom:0;padding:10px 13px;gap:8px;border-radius:10px}
  #rj-experience .im-alloy-message>span {width:25px;height:25px;border-radius:8px;font-size:10px}
  #rj-experience .im-alloy-message p {font-size:9px}
  #rj-experience .im-alloy-message b {font-size:8px}
  #rj-experience .im-alloy-message small {font-size:5px}
  #rj-experience .im-landscape-frame {left:4%;top:15%;width:86%;height:72%;padding:7px;border-radius:15px}
  #rj-experience .im-landscape-frame .ww-art-sun {width:53px}
  #rj-experience .im-landscape-frame .ww-landscape>span {font-size:8px;bottom:13px;left:13px}
  #rj-experience .im-frame-label {font-size:5px;bottom:19px;right:17px}
  #rj-experience .im-crop-corners {inset:17px}
  #rj-experience .im-crop-corners i {width:15px;height:15px}
  #rj-experience .im-dream-brief {top:2%;left:3%;padding:12px 14px;border-radius:10px}
  #rj-experience .im-dream-brief>span {font-size:6px;margin-bottom:7px}
  #rj-experience .im-dream-brief strong {font-size:16px}
  #rj-experience .im-dream-brief p {font-size:7px;margin-top:5px}
  #rj-experience .im-layer-selector {right:0;top:23%;width:34%;padding:13px;border-radius:12px}
  #rj-experience .im-layer-selector>span {font-size:6px;margin-bottom:7px}
  #rj-experience .im-layer-selector>b {font-size:8px;gap:7px;padding:10px 0}
  #rj-experience .im-layer-selector i {width:22px;height:17px;border-width:1px;border-radius:3px}
  #rj-experience .im-layer-selector>small {font-size:6px;padding-top:6px}
  #rj-experience .im-revision-mark {right:6%;bottom:0;padding:12px 15px;border-radius:9px}
  #rj-experience .im-revision-mark>span {font-size:5px;margin-bottom:5px}
  #rj-experience .im-revision-mark>b {font-size:12px}
  #rj-experience .im-ai-film .im-art {height:clamp(500px,128vw,650px);margin-top:25px;margin-bottom:35px}
  #rj-experience .im-ai-app {left:0;top:0;width:48%;height:35%;padding:0 12px;border-radius:13px}
  #rj-experience .im-ai-app .im-window-bar {padding:11px 0;font-size:6px}
  #rj-experience .im-app-label {font-size:5px;line-height:1.6;margin:12px 0 8px}
  #rj-experience .im-ai-app h3 {font-size:clamp(14px,3.7vw,21px)}
  #rj-experience .im-app-input {left:12px;right:12px;bottom:13px;padding:7px;font-size:6px;border-radius:7px}
  #rj-experience .im-app-input>b {width:18px;height:18px;font-size:12px;border-radius:5px}
  #rj-experience .im-ai-context {left:auto;right:0;top:1%;width:47%;padding:14px;border-radius:12px}
  #rj-experience .im-ai-context>span,#rj-experience .im-ai-model span,#rj-experience .im-ai-tool>span,#rj-experience .im-ai-result>span {font-size:5px;line-height:1.5}
  #rj-experience .im-ai-context>strong {font-size:clamp(15px,4vw,22px);margin:9px 0}
  #rj-experience .im-ai-context>div {font-size:6px;gap:4px}
  #rj-experience .im-ai-context div b {padding:5px;border-radius:5px}
  #rj-experience .im-ai-context>p {font-size:7px;margin-top:9px}
  #rj-experience .im-ai-model {left:10%;top:39%;bottom:auto;width:78%;padding:13px;border-radius:14px}
  #rj-experience .im-ai-model b {font-size:12px}
  #rj-experience .im-model-cells {gap:3px;margin:12px 0}
  #rj-experience .im-model-cells i {font-size:6px;border-radius:3px}
  #rj-experience .im-ai-model>small {font-size:6px;line-height:1.5;display:block}
  #rj-experience .im-ai-tool {left:0;right:auto;top:72%;width:46%;padding:14px;border-radius:13px}
  #rj-experience .im-ai-tool>b {font-size:clamp(12px,3.4vw,18px);margin:10px 0 6px;white-space:nowrap}
  #rj-experience .im-ai-tool>strong {font-size:36px}
  #rj-experience .im-ai-tool>p {font-size:7px;line-height:1.6;margin:9px 0 0}
  #rj-experience .im-ai-result {left:auto;right:0;top:73%;bottom:auto;width:49%;padding:13px;border-radius:11px}
  #rj-experience .im-ai-result strong {font-size:clamp(14px,3.7vw,21px);margin:9px 0}
  #rj-experience .im-ai-result p {font-size:8px;margin:0 0 10px}
  #rj-experience .im-ai-result>b {font-size:7px}
}
@media (prefers-reduced-motion:reduce) {
  #rj-experience .im-film {height:auto}
  #rj-experience .im-screen {position:relative;top:0}
  #rj-experience .im-film-actions .im-play,#rj-experience .im-scroll-cue {display:none}
  #rj-experience .im-art * {transition:none!important;animation:none!important}
}

/* Four distinct motifs, held in the portfolio's existing tactile visual language. */
#rj-experience .pm-about {display:grid;grid-template-columns:1fr 1.1fr;gap:70px;padding:90px 0 50px;border-top:1px solid var(--rj-line);margin-top:60px}
#rj-experience .pm-about h2 {font-size:clamp(34px,4.5vw,59px);letter-spacing:-.055em;line-height:1.08;margin:20px 0}
#rj-experience .pm-about h2 span {color:#bfa6ff}
#rj-experience .pm-about p:not(.rj-eyebrow) {font-size:16px;line-height:1.85;color:var(--rj-muted);margin:0 0 20px}
#rj-experience .pm-film {height:400svh;margin:30px 0 22px;max-width:1800px}
#rj-experience .pm-film .im-screen {height:calc(100svh - 32px);max-height:1000px;min-height:0;overflow:clip;position:sticky;top:16px;display:block}
#rj-experience .pm-film .im-heading {position:absolute;inset:5% auto auto 5%;padding:0}
#rj-experience .pm-film .im-heading h2 {font-size:clamp(30px,4.3vw,62px);line-height:1.04}
#rj-experience .pm-film .im-heading>span {margin-bottom:12px}
#rj-experience .pm-film .im-art {position:absolute;inset:24% 4% 28%;height:auto;margin:0;flex:none}
#rj-experience .pm-film-bottom {position:absolute;left:5%;right:5%;bottom:7%;display:grid;grid-template-columns:1fr 270px;gap:70px;align-items:end;z-index:4}
#rj-experience .pm-captions {min-height:108px;max-width:730px}
#rj-experience .pm-caption>span {font-size:9px;letter-spacing:.1em;font-weight:800;color:var(--im-accent);display:block;margin-bottom:9px}
#rj-experience .pm-caption h3 {font-size:clamp(20px,2.1vw,30px);line-height:1.15;letter-spacing:-.04em;margin:0 0 10px;color:#f7f5ed}
#rj-experience .pm-caption p {font-size:14px;line-height:1.75;color:#d0c8d4;margin:0;max-width:660px}
#rj-experience .pm-film-navigation {display:grid;gap:12px;align-self:end}
#rj-experience .pm-dots {display:flex;gap:8px}
#rj-experience .pm-dots button {background:transparent;color:var(--im-accent);border:0;padding:8px 3px;min-width:44px;min-height:44px;flex:1;cursor:pointer}
#rj-experience .pm-dots span {display:block;font-size:10px;font-weight:800;padding-bottom:10px;opacity:.55}
#rj-experience .pm-dots i {display:block;height:3px;border-radius:9px;background:var(--im-accent);opacity:.25}
#rj-experience .pm-dots [aria-current] :is(span,i) {opacity:1}
#rj-experience .pm-skip {background:none;border:1px solid var(--im-edge);border-radius:12px;color:var(--im-accent);font:inherit;font-size:11px;font-weight:800;padding:12px;min-height:44px;cursor:pointer}
#rj-experience .pm-film :is(button,a):focus-visible,#rj-experience .pm-reading summary:focus-visible {outline:3px solid var(--im-accent,#bfa6ff);outline-offset:4px}
#rj-experience .pm-film .im-film-note {position:absolute;inset:auto 5% 2.6%;padding:0;max-width:none;font-size:9px}
#rj-experience .pm-reading {border-bottom:1px solid var(--rj-line);margin:0 0 85px;color:var(--rj-muted)}
#rj-experience .pm-reading summary {cursor:pointer;min-height:56px;padding:14px 0;display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;list-style:none;gap:20px}
#rj-experience .pm-reading summary::-webkit-details-marker {display:none}
#rj-experience .pm-reading[open] summary>span {transform:rotate(45deg)}
#rj-experience .pm-reading>div {display:grid;grid-template-columns:1fr 1fr;gap:32px 70px;padding:30px 0 40px}
#rj-experience .pm-reading article>span {font-size:10px;color:#bfa6ff;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
#rj-experience .pm-reading h3 {font-size:22px;letter-spacing:-.035em;color:#f7f5ed;line-height:1.3;margin:14px 0}
#rj-experience .pm-reading p {font-size:14px;line-height:1.9;margin:0}
/* Perception: a retained image unfolds into numbers, review and physical feedback. */
#rj-experience .pm-pixel-reading {position:absolute!important;inset:66% 6% auto auto!important;width:30%;display:grid;gap:8px;color:#e2d3fb}
#rj-experience .pm-pixel-reading strong {font-size:clamp(22px,2.8vw,42px);letter-spacing:-.06em}
#rj-experience .pm-pixel-reading span {font-size:15px;color:#bfa6ff}
#rj-experience .pm-pixel-reading small {font-size:9px;color:#b7a7c8}
#rj-experience .pm-companions {perspective:1200px}
#rj-experience .pm-depth-field {position:absolute;left:2%;top:10%;width:45%;height:75%;perspective:700px;transform:rotateY(15deg) rotateZ(-8deg)}
#rj-experience .pm-depth-field>i {position:absolute;left:var(--x);top:var(--y);width:6px;height:6px;border-radius:50%;background:#bfa6ff;transform:translateZ(var(--z));box-shadow:0 0 14px #bfa6ff55}
#rj-experience .pm-depth-field>span {position:absolute;left:8%;bottom:-6%;font-size:9px;color:#baa8d4;letter-spacing:.12em;transform:rotate(8deg)}
#rj-experience .pm-depth-object {position:absolute;inset:25% 24% 3% 26%;border:1px solid #a17ccb88;background:linear-gradient(150deg,#bfa6ff22,#5e408116);border-radius:20px;transform:rotateY(-18deg);box-shadow:20px -20px #7956a22b}
#rj-experience .pm-phone {position:absolute;left:37%;top:0;width:25%;height:100%;border-radius:36px;background:#17131c;border:5px solid #8d72ad;color:#ddcbf5;padding:38px 24px 20px;text-align:center;box-shadow:8px 12px #34273f,25px 30px 60px #100c1755;transform:rotate(5deg);display:flex;flex-direction:column;align-items:center;justify-content:space-around}
#rj-experience .pm-phone-notch {position:absolute;top:13px;left:37%;right:37%;height:5px;border-radius:9px;background:#6a567c}
#rj-experience .pm-phone>span {font-size:8px;letter-spacing:.1em}
#rj-experience .pm-phone>strong {font-size:clamp(19px,2.4vw,35px);line-height:1.08;letter-spacing:-.05em}
#rj-experience .pm-phone>small {font-size:9px;color:#aa96bf}
#rj-experience .pm-sonar {width:70%;aspect-ratio:1;position:relative;display:grid;place-items:center;margin:10px 0}
#rj-experience .pm-sonar i {position:absolute;inset:0;border:1px solid #bfa6ff66;border-radius:50%}
#rj-experience .pm-sonar i:nth-child(2) {inset:22%;border-color:#bfa6ff}
#rj-experience .pm-sonar b {width:16%;aspect-ratio:1;background:#bfa6ff;border-radius:50%;box-shadow:0 0 25px #bfa6ff44}
#rj-experience .pm-haptics {display:flex;gap:7px;align-items:center;height:32px;margin:5px 0}
#rj-experience .pm-haptics i {width:6px;height:40%;background:#bfa6ff;border-radius:6px}
#rj-experience .pm-haptics i:nth-child(2n) {height:70%}
#rj-experience .pm-haptics i:nth-child(3) {height:100%}
#rj-experience .pm-pd {position:absolute;right:0;top:25%;width:30%;background:#ded0f5;border:1px solid #f2e8ff;border-radius:22px;padding:25px;color:#38264e;box-shadow:0 8px #8d72ad;transform:rotate(-4deg)}
#rj-experience .pm-pd>span {font-size:8px;letter-spacing:.06em;font-weight:800}
#rj-experience .pm-eyes {display:flex;align-items:center;gap:15px;margin:30px 0;justify-content:center}
#rj-experience .pm-eyes i {width:46px;height:32px;border:2px solid #684c8a;border-radius:75% 15%;transform:rotate(45deg);display:grid;place-items:center}
#rj-experience .pm-eyes i:after {content:'';width:15px;height:15px;border-radius:50%;background:#8d68bb;border:3px solid #b69bd9}
#rj-experience .pm-eyes b {font-size:28px;font-weight:400;color:#8d68bb}
#rj-experience .pm-pd strong {font-size:clamp(16px,1.7vw,26px);letter-spacing:-.04em;display:block}
#rj-experience .pm-pd p {font-size:11px;line-height:1.8;color:#6f578b;margin-bottom:0}
/* Imagination: real alpha layers from Daydream's current art direction. */
#rj-experience .im-daydream-film {--im-base:#172022;--im-edge:#435251;--im-accent:#f1b5a1;--im-ink:#49392e}
#rj-experience .pm-film.im-daydream-film .im-art {inset:23% 3% 28%}
#rj-experience .pm-dream-world {isolation:isolate}
#rj-experience .pm-dream-grid {position:absolute;inset:-8%;opacity:0;background-image:radial-gradient(#abc6c43b 1px,transparent 1px);background-size:22px 22px;mask-image:radial-gradient(ellipse,#000 25%,transparent 70%)}
#rj-experience .pm-dream-original {position:absolute;inset:0 12%;border-radius:24px;overflow:hidden;box-shadow:0 15px 40px #0b111a70;border:1px solid #b1cec137;transform-origin:50% 50%;z-index:1}
#rj-experience .pm-dream-original img {width:100%;height:100%;object-fit:cover}
#rj-experience .pm-dream-original>span,#rj-experience .pm-dream-setting>span,#rj-experience .pm-dream-subject>span,#rj-experience .pm-dream-composition>span {position:absolute;left:14px;bottom:12px;font-size:8px;letter-spacing:.1em;background:#121b22ce;color:#dbeae5;padding:8px 11px;border-radius:8px;z-index:2;white-space:nowrap}
#rj-experience .pm-dream-setting {position:absolute;left:8%;top:15%;width:51%;height:72%;border:1px solid #95c6b066;border-radius:18px;box-shadow:0 10px #20362f,0 25px 35px #0b111955;overflow:hidden;z-index:2}
#rj-experience .pm-dream-setting>img {width:100%;height:100%;object-fit:cover}
#rj-experience .pm-dream-subject {position:absolute;right:6%;top:2%;width:42%;height:96%;border-radius:20px;border:1px solid #c9aa9344;background:repeating-conic-gradient(#cdbba50a 0% 25%,transparent 0% 50%) 50%/24px 24px;z-index:3}
#rj-experience .pm-dream-subject>img {width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 20px #0a0f16aa)}
#rj-experience .pm-dream-composition {position:absolute;right:1%;top:10%;width:54%;height:80%;border:1px solid #d9e4ce66;border-radius:18px;box-shadow:0 9px #23382f,0 20px 40px #0b111977;overflow:hidden;z-index:4}
#rj-experience .pm-composite-bg {width:100%;height:100%;object-fit:cover}
#rj-experience .pm-composite-cat {position:absolute;width:65%;height:88%;object-fit:contain;left:27%;top:-8%;filter:drop-shadow(0 7px 8px #0c1114aa)}
#rj-experience .pm-dream-thread {position:absolute;left:30%;top:40%;width:37%;height:25%;border:1px solid #f1b5a1;border-left:0;border-bottom:0;border-radius:0 55% 0 0;z-index:0}
#rj-experience .thread-b {transform:scaleY(-1);top:50%}
#rj-experience .pm-dream-direct {position:absolute;left:4%;top:20%;width:31%;padding:24px;border-radius:19px;background:#f3d9bf;color:#503d31;box-shadow:0 8px #927356;z-index:5;transform:rotate(-4deg)}
#rj-experience .pm-dream-direct>span {font-size:8px;letter-spacing:.1em;font-weight:800;display:block;margin-bottom:15px}
#rj-experience .pm-dream-direct>strong {font-size:clamp(20px,2.8vw,39px);line-height:1.12;letter-spacing:-.055em;display:block;margin-bottom:20px}
#rj-experience .pm-dream-direct>div {display:flex;flex-wrap:wrap;gap:6px;margin-bottom:15px}
#rj-experience .pm-dream-direct i {font-size:10px;font-style:normal;border:1px solid #b18b663f;padding:7px;border-radius:6px}
#rj-experience .pm-dream-direct>small {font-size:9px;color:#886b53}
#rj-experience .pm-dream-retained {position:absolute;bottom:-2%;right:7%;background:#253e34;color:#b8dec9;padding:12px 16px;border:1px solid #719b8177;border-radius:12px;font-size:10px;z-index:7;transform:rotate(3deg)}
/* Real project views, with room to read rather than squeezing screenshots into phones. */
#rj-experience .pm-proof {margin:0 0 105px}
#rj-experience .pm-proof-lead {max-width:770px;margin:0 0 40px}
#rj-experience .pm-proof h2 {font-size:clamp(34px,4.2vw,57px);line-height:1.1;letter-spacing:-.06em;margin:18px 0 25px}
#rj-experience .pm-proof-lead p:not(.rj-eyebrow) {font-size:16px;line-height:1.9;color:var(--rj-muted)}
#rj-experience .pm-native {margin:30px 0 70px;padding:12px;border-radius:24px;border:1px solid #4c4457;background:#23212b}
#rj-experience .pm-native>a {display:block;border-radius:15px;overflow:hidden}
#rj-experience .pm-native img {width:100%;height:auto;display:block}
#rj-experience .pm-native figcaption {display:flex;flex-wrap:wrap;gap:12px 20px;justify-content:space-between;font-size:11px;line-height:1.8;color:#b9afc4;padding:20px 13px 10px}
#rj-experience .pm-native a,#rj-experience .pm-research a {color:#bfa6ff;text-underline-offset:5px}
#rj-experience .pm-research {display:grid;grid-template-columns:1fr 1fr;gap:50px 70px}
#rj-experience .pm-research article {padding-top:25px;border-top:1px solid #423b4b}
#rj-experience .pm-research article>span {font-size:9px;font-weight:800;letter-spacing:.11em;color:#bfa6ff}
#rj-experience .pm-research h3 {font-size:26px;line-height:1.25;letter-spacing:-.04em;margin:15px 0}
#rj-experience .pm-research p {font-size:14px;color:var(--rj-muted);line-height:1.85;margin:0 0 18px}
#rj-experience .pm-research :is(small,a) {font-size:11px;line-height:1.7;color:#b5a5c6}
#rj-experience .pm-dream-coda {display:grid;grid-template-columns:1.1fr 1fr;gap:55px;align-items:center}
#rj-experience .pm-pearl {position:relative;aspect-ratio:1;border-radius:25px;overflow:hidden;border:1px solid #635854}
#rj-experience .pm-pearl img:first-child {width:100%;height:100%;object-fit:cover}
#rj-experience .pm-pearl img+img {position:absolute;width:83%;height:91%;left:13%;top:7%;object-fit:contain;filter:drop-shadow(0 20px 22px #41405630)}
#rj-experience .pm-dream-coda h3 {font-size:clamp(35px,4.4vw,61px);letter-spacing:-.055em;line-height:1.07;margin:20px 0}
#rj-experience .pm-dream-coda p {font-size:14px;line-height:1.8;color:var(--rj-muted)}
#rj-experience .pm-dream-coda .pm-source-note {font-size:11px;color:#a69d99;margin-top:25px}
/* Daydream's working example manipulates the same independent source assets. */
#rj-experience .pm-edit-scene {position:relative;aspect-ratio:1.3;border:1px solid #758e8260;border-radius:16px;overflow:hidden;background:#14211c;margin:12px 0 18px}
#rj-experience .pm-edit-scene>.pm-edit-setting {width:100%;height:100%;object-fit:cover;display:block}
#rj-experience .pm-edit-scene>.pm-edit-subject {position:absolute;left:27%;top:-4%;width:67%;height:85%;object-fit:contain;transform:translateX(var(--subject-x,0));transition:transform .5s ease!important}
#rj-experience .pm-edit-scene.is-separate>.pm-edit-subject {left:46%;width:50%;outline:1px dashed #f2c6aa;outline-offset:-20px}
#rj-experience .pm-edit-scene.is-separate>.pm-edit-setting {width:53%;height:65%;object-fit:cover;position:absolute;top:18%;left:3%;border-radius:12px;transform:rotate(-5deg);border:1px solid #a9d6b8}
#rj-experience .pm-edit-scene>span {position:absolute;left:12px;bottom:12px;background:#13231dec;color:#c7e5d4;font-size:9px;padding:9px 11px;border-radius:9px}
#rj-experience .pm-edit-scene.is-shifted {--subject-x:13%}
#rj-experience .pm-edit-scene.is-original {--subject-x:0}
#rj-experience .pm-edit-scene.is-original:after {content:'ORIGINAL';position:absolute;right:12px;top:12px;background:#19231e;color:#dcf1e1;padding:7px;font-size:8px;border-radius:7px}
@media(min-width:801px) and (max-height:760px) {
  #rj-experience .pm-film .im-art {inset:25% 9% 32%}
  #rj-experience .pm-film .im-heading h2 {font-size:38px}
  #rj-experience .pm-film-bottom {bottom:8%;gap:30px}
  #rj-experience .pm-caption p {font-size:12px}
  #rj-experience .pm-caption h3 {font-size:22px}
}
@media(max-width:800px) {
  #rj-experience .pm-about {grid-template-columns:1fr;gap:15px;padding:45px 0 25px;margin-top:35px}
  #rj-experience .pm-about p:not(.rj-eyebrow) {font-size:15px}
  #rj-experience .pm-film {width:calc(100vw - 16px);height:370svh;margin:24px 0 12px}
  #rj-experience .pm-film .im-screen {top:8px;height:calc(100svh - 82px - env(safe-area-inset-bottom));min-height:0;border-radius:22px}
  #rj-experience .pm-film .im-heading {inset:4% 6% auto;z-index:4}
  #rj-experience .pm-film .im-heading h2 {font-size:clamp(27px,7.3vw,43px);line-height:1.06}
  #rj-experience .pm-film .im-heading>span {font-size:8px;margin-bottom:12px}
  #rj-experience .pm-film .im-art,#rj-experience .pm-film.im-daydream-film .im-art {inset:24% 3% 39%;height:auto;min-height:0;margin:0}
  #rj-experience .pm-film-bottom {left:6%;right:6%;bottom:5.8%;grid-template-columns:1fr;gap:10px}
  #rj-experience .pm-captions {min-height:134px;max-width:none}
  #rj-experience .pm-caption>span {font-size:8px;margin-bottom:8px}
  #rj-experience .pm-caption h3 {font-size:20px;margin-bottom:9px;line-height:1.18}
  #rj-experience .pm-caption p {font-size:12px;line-height:1.65}
  #rj-experience .pm-film-navigation {display:grid;grid-template-columns:1fr auto;align-items:center;gap:15px}
  #rj-experience .pm-dots {gap:4px}
  #rj-experience .pm-dots button {min-width:36px;min-height:44px;padding:7px 2px}
  #rj-experience .pm-dots span {font-size:8px;padding-bottom:8px}
  #rj-experience .pm-skip {font-size:9px;padding:10px;min-height:44px}
  #rj-experience .pm-film .im-film-note {inset:auto 6% 1.8%;font-size:6.5px;line-height:1.5}
  #rj-experience .pm-pixel-reading {inset:67% 0 auto auto!important;width:39%;gap:5px}
  #rj-experience .pm-pixel-reading strong {font-size:18px}
  #rj-experience .pm-pixel-reading span {font-size:9px}
  #rj-experience .pm-pixel-reading small {font-size:6px;line-height:1.5}
  #rj-experience .pm-phone {left:29%;width:37%;border-width:3px;border-radius:25px;padding:25px 12px 13px;height:98%;top:0}
  #rj-experience .pm-phone-notch {top:10px;height:3px}
  #rj-experience .pm-phone>span {font-size:5px}
  #rj-experience .pm-phone>strong {font-size:20px}
  #rj-experience .pm-phone>small {font-size:6px}
  #rj-experience .pm-sonar {width:62%;margin:4px 0}
  #rj-experience .pm-depth-field {width:39%;left:0;top:13%;height:60%}
  #rj-experience .pm-depth-field>i {width:3px;height:3px}
  #rj-experience .pm-depth-field>span {font-size:5px;bottom:-12%}
  #rj-experience .pm-haptics {height:20px;gap:5px;margin:2px 0}
  #rj-experience .pm-haptics i {width:4px}
  #rj-experience .pm-pd {width:34%;right:-1%;top:25%;padding:12px 9px;border-radius:12px}
  #rj-experience .pm-pd>span {font-size:5px}
  #rj-experience .pm-eyes {gap:7px;margin:19px 0}
  #rj-experience .pm-eyes i {width:24px;height:18px;border-width:1px}
  #rj-experience .pm-eyes i:after {width:8px;height:8px;border-width:1px}
  #rj-experience .pm-eyes b {font-size:18px}
  #rj-experience .pm-pd strong {font-size:13px}
  #rj-experience .pm-pd p {font-size:7px;line-height:1.6}
  #rj-experience .pm-dream-original {inset:0 1%;border-radius:16px}
  #rj-experience .pm-dream-setting {left:2%;width:57%;height:76%;border-radius:12px}
  #rj-experience .pm-dream-subject {right:0;width:50%;border-radius:12px}
  #rj-experience .pm-dream-original>span,#rj-experience .pm-dream-setting>span,#rj-experience .pm-dream-subject>span,#rj-experience .pm-dream-composition>span {left:8px;bottom:8px;font-size:5px;padding:6px;border-radius:5px}
  #rj-experience .pm-dream-composition {width:61%;right:0;border-radius:12px}
  #rj-experience .pm-dream-direct {left:0;top:22%;width:40%;padding:14px 12px;border-radius:12px}
  #rj-experience .pm-dream-direct>span {font-size:5px;margin-bottom:9px}
  #rj-experience .pm-dream-direct>strong {font-size:18px;margin-bottom:12px}
  #rj-experience .pm-dream-direct>div {gap:3px;margin-bottom:7px}
  #rj-experience .pm-dream-direct i {font-size:6px;padding:5px}
  #rj-experience .pm-dream-direct>small {font-size:6px}
  #rj-experience .pm-dream-retained {font-size:7px;padding:8px;bottom:-2%}
  #rj-experience .pm-reading {margin-bottom:55px}
  #rj-experience .pm-reading summary {font-size:11px}
  #rj-experience .pm-reading>div {grid-template-columns:1fr;gap:28px;padding:20px 0 32px}
  #rj-experience .pm-proof {margin-bottom:65px}
  #rj-experience .pm-proof-lead p:not(.rj-eyebrow) {font-size:15px;line-height:1.8}
  #rj-experience .pm-native {padding:6px;border-radius:16px;margin:25px 0 42px}
  #rj-experience .pm-native>a {border-radius:10px}
  #rj-experience .pm-native figcaption {font-size:10px;padding:14px 9px 9px;gap:9px}
  #rj-experience .pm-research {grid-template-columns:1fr;gap:30px}
  #rj-experience .pm-research h3 {font-size:24px}
  #rj-experience .pm-dream-coda {grid-template-columns:1fr;gap:25px}
  #rj-experience .pm-dream-coda h3 {font-size:41px}
}
@media(max-width:800px) and (max-height:700px) {
  #rj-experience .pm-film .im-heading h2 {font-size:27px}
  #rj-experience .pm-film .im-heading>span {margin-bottom:8px}
  #rj-experience .pm-film .im-art,#rj-experience .pm-film.im-daydream-film .im-art {inset:23% 5% 44%}
  #rj-experience .pm-film-bottom {gap:4px;bottom:6%}
  #rj-experience .pm-captions {min-height:132px}
  #rj-experience .pm-caption h3 {font-size:18px;margin-bottom:6px}
  #rj-experience .pm-caption p {font-size:11px;line-height:1.6}
}
@media(prefers-reduced-motion:reduce),(max-height:500px) {
  #rj-experience .pm-film {height:auto}
  #rj-experience .pm-film .im-screen {position:relative;top:0;height:720px}
  #rj-experience .pm-film .im-art * {animation:none!important;transition:none!important}
}
@media(prefers-reduced-motion:reduce) and (max-width:800px) {
  #rj-experience .pm-film .im-screen {height:680px}
}
/* Keep the numerical explanation clear of the swatch at every scene size. */
#rj-experience .pm-film .im-pixel-swatch {top:8%;height:60%;padding:18px}
#rj-experience .pm-film .im-pixel-swatch>div {height:100%;grid-template-rows:repeat(6,minmax(0,1fr));margin:0}
#rj-experience .pm-film .im-pixel-swatch i {aspect-ratio:auto;min-height:0}
#rj-experience .pm-film .im-pixel-swatch>span {display:none}
#rj-experience .pm-film .pm-pixel-reading {inset:74% 7% auto auto!important;width:27%}
@media(max-width:800px) {
  #rj-experience .pm-film .im-pixel-swatch {height:53%;top:13%;padding:12px}
  #rj-experience .pm-film .pm-pixel-reading {inset:74% 2% auto auto!important;width:39%}
  #rj-experience .pm-film.im-alloy-film .im-tool-drawer {min-height:0;padding:10px;top:3%}
  #rj-experience .pm-film.im-alloy-film .im-tool-title>b {font-size:18px;margin:7px 0 10px}
  #rj-experience .pm-film.im-alloy-film .im-action-receipt strong {font-size:13px;white-space:nowrap}
  #rj-experience .pm-film.im-alloy-film .im-action-receipt p {font-size:7px}
}
#rj-experience .pm-art-board>div {position:absolute;inset:0}
@media(max-width:800px) {
  #rj-experience .pm-film .pm-art-board {inset:auto!important;left:50%!important;top:50%!important;width:400px;height:350px;transform:translate(-50%,-50%) scale(var(--pm-art-scale,1));transform-origin:center}
}
@media(max-width:360px) {
  #rj-experience .pm-film .im-heading h2 {font-size:22px}
}
@media(max-width:800px) and (max-height:700px) {
  #rj-experience .pm-film .pm-pixel-reading {inset:70% 2% auto auto!important}
  #rj-experience .pm-film .pm-pixel-reading small {display:none}
  #rj-experience .pm-film .pm-pixel-reading strong {font-size:16px}
}
#rj-experience .pm-phone>span,#rj-experience .pm-phone>small,#rj-experience .pm-pd>span {line-height:1.5}
#rj-experience .pm-pd>span {display:block}