Merge pull request #16 from plotflow/claude/artwork-sales-website-01JWP9tY4m4hfX8WyoEQZ1kU

fix: Workspace responsive + journal transparency + artwork position

Author: ddyson1

styles/console.css

@@ -74,9 +74,11 @@
 .pf-stage{position:relative;padding:16px;min-height:0;overflow:hidden;
   background:radial-gradient(1100px 640px at 55% 42%,#474a41 0%,#31342c 72%)}
 .pf-stage .bed{position:absolute;inset:16px;width:auto;max-height:none;aspect-ratio:auto}
-/* leave paper margins for the labels + caption; canvas & svg share the same
-   box so the pen crosshair stays aligned with the ink */
-.pf-stage #pcanvas,.pf-stage #stage{inset:46px 40px 92px}
+/* leave paper margins for the labels + caption, and reserve the right side
+   for the LIVE PLOT card + journal so the artwork sits clear of them —
+   canvas & svg share the same box so the pen crosshair stays aligned */
+.pf-stage #pcanvas,.pf-stage #stage{inset:46px 350px 92px 44px}
+@media(max-width:1280px){.pf-stage #pcanvas,.pf-stage #stage{inset:46px 310px 92px 40px}}
 .pf-stage .bed .bl{left:16px;transform:none}
 .pf-view{position:absolute;top:8px;right:16px;z-index:3;font-weight:700;font-size:8px;
   letter-spacing:.16em;text-transform:uppercase;color:#a99a76}
@@ -118,10 +120,15 @@
 /* responsive: stack sidebar under the stage; card goes static */
 @media(max-width:940px){
   .pf-ws{grid-template-columns:1fr;height:auto}
-  .pf-stage{order:1;height:72vh;min-height:420px}
+  .pf-stage{order:1;height:70vh;min-height:420px}
   .pf-side{order:2;border-right:none;border-top:1px solid var(--line)}
   .pf-machine{margin-top:0}
-  .pf-card{width:auto;left:34px}
+  .pf-card{left:auto;top:16px;right:16px;width:230px}
+  .pf-card .big b{font-size:19px}
+  .pf-card .grid{gap:8px 12px;padding:11px 14px}
+  .pf-card .grid b{font-size:11.5px}
+  .pf-card .ft{display:none}
+  .pf-stage #pcanvas,.pf-stage #stage{inset:44px 30px 60px}
   .pf-cap{display:none}
 }
 @media(max-width:560px){
@@ -136,12 +143,13 @@
 
 /* command journal — PlotGrid's translucent terminal, bottom-right of the sheet */
 .pf-term{position:absolute;right:34px;bottom:30px;z-index:8;width:470px;
-  background:rgba(8,18,10,.62);border:1px solid rgba(123,224,138,.30);
-  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
-  color:#7be08a;font-family:'Liberation Mono','Courier New',monospace}
+  background:rgba(8,18,10,.38);border:1px solid rgba(123,224,138,.30);
+  color:#7be08a;font-family:'Liberation Mono','Courier New',monospace;
+  transition:background .25s ease}
+.pf-term:hover{background:rgba(8,18,10,.9)}
 .pf-term .hd{display:flex;gap:10px;padding:8px 12px;border-bottom:1px solid rgba(123,224,138,.24);
   font-size:9.5px;font-weight:700;letter-spacing:.12em}
 .pf-term .hd .sp{flex:1}
 .pf-term pre{margin:0;padding:9px 12px;font-size:10.5px;line-height:1.75;min-height:212px;
-  white-space:pre-wrap;text-shadow:0 1px 2px rgba(0,0,0,.55)}
+  white-space:pre-wrap;text-shadow:0 1px 3px rgba(0,0,0,.8)}
 @media(max-width:940px){.pf-term{display:none}}