anentrypoint-design 0.0.16 → 0.0.17

package/dist/247420.css

@@ -439,9 +439,33 @@
 }
 
 /* ============================================================
-   Primitives — rules, stamps, buttons
+   Primitives — rails, rules, stamps, buttons
+
+   Rail = a 4px tonal stripe on the inline-start edge of any block.
+   Used to separate concerns by hue without ever drawing a border.
    ============================================================ */
 
+.ds-247420 .rail        { box-shadow: inset 4px 0 0 var(--panel-text-3); }
+.ds-247420 .rail-green  { box-shadow: inset 4px 0 0 var(--green); }
+.ds-247420 .rail-purple { box-shadow: inset 4px 0 0 var(--purple); }
+.ds-247420 .rail-mascot { box-shadow: inset 4px 0 0 var(--mascot); }
+.ds-247420 .rail-sun    { box-shadow: inset 4px 0 0 var(--sun); }
+.ds-247420 .rail-flame  { box-shadow: inset 4px 0 0 var(--flame); }
+.ds-247420 .rail-sky    { box-shadow: inset 4px 0 0 var(--sky); }
+.ds-247420 .rail-live   { box-shadow: inset 4px 0 0 var(--live); }
+.ds-247420 .rail-warn   { box-shadow: inset 4px 0 0 var(--warn); }
+
+/* Dot — 8px tonal status pip. Use for "live", "draft", "shipped" indicators. */
+.ds-247420 .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--panel-text-3); vertical-align: middle; margin-right: 8px; }
+.ds-247420 .dot.green  { background: var(--green); }
+.ds-247420 .dot.purple { background: var(--purple); }
+.ds-247420 .dot.mascot { background: var(--mascot); }
+.ds-247420 .dot.sun    { background: var(--sun); }
+.ds-247420 .dot.flame  { background: var(--flame); }
+.ds-247420 .dot.sky    { background: var(--sky); }
+.ds-247420 .dot.live   { background: var(--live); }
+.ds-247420 .dot.warn   { background: var(--warn); }
+
 .ds-247420 .rule       {   margin: 0; }
 .ds-247420 .rule-double{    height: var(--bw-rule); margin: 0; }
 .ds-247420 .rule-dotted{   margin: 0; }
@@ -483,17 +507,16 @@
   color: var(--bg);
 
   border-radius: var(--r-pill);
-  box-shadow: 0 2px 0 rgba(0,0,0,0.08);
   font-family: var(--ff-ui);
   font-weight: 600;
   font-size: var(--fs-sm);
   letter-spacing: 0.01em;
   text-decoration: none;
   cursor: pointer;
-  transition: transform var(--dur-snap) var(--ease), box-shadow var(--dur-snap) var(--ease), filter var(--dur-snap) var(--ease);
+  transition: filter var(--dur-base) var(--ease), background var(--dur-base) var(--ease);
 }
-.ds-247420 .btn-stamp:hover  { transform: translateY(-1px); box-shadow: 0 4px 0 rgba(0,0,0,0.10); filter: brightness(1.04); }
-.ds-247420 .btn-stamp:active { transform: translateY(1px); box-shadow: 0 1px 0 rgba(0,0,0,0.10); }
+.ds-247420 .btn-stamp:hover  { filter: brightness(1.05); }
+.ds-247420 .btn-stamp:active { filter: brightness(0.96); }
 
 .ds-247420 .btn-stamp.green  { background: var(--green);  color: var(--green-fg); }
 .ds-247420 .btn-stamp.purple { background: var(--purple); color: var(--purple-fg); }
@@ -606,7 +629,6 @@
   border-radius: var(--r-3);
   background: var(--bg);
   padding: var(--space-5);
-  box-shadow: var(--panel-shadow, none);
 }
 .ds-247420 .card.chunk { }
 
@@ -633,7 +655,7 @@
   --panel-accent:    var(--green);
   --panel-accent-2:  var(--green-deep);
   --panel-accent-fg: #ffffff;
-  --panel-shadow:  0 1px 2px rgba(31,27,22,0.04);
+  --panel-shadow: none;
   --panel-shadow-top: none;
 }
 
@@ -651,7 +673,7 @@
     --panel-accent:    var(--green-2);
     --panel-accent-2:  var(--green-2);
     --panel-accent-fg: var(--ink);
-    --panel-shadow:  none;
+    --panel-shadow: none;
     --panel-shadow-top: none;
   }
 }
@@ -669,7 +691,7 @@
   --panel-accent:    var(--green-2);
   --panel-accent-2:  var(--green-2);
   --panel-accent-fg: var(--ink);
-  --panel-shadow:  none;
+  --panel-shadow: none;
   --panel-shadow-top: none;
 }
 
@@ -686,7 +708,7 @@
   --panel-accent:    var(--green);
   --panel-accent-2:  var(--green-deep);
   --panel-accent-fg: #ffffff;
-  --panel-shadow:  none;
+  --panel-shadow: none;
 }
 
 /* Foreground / background aliases derived from panel tokens */
@@ -916,11 +938,12 @@
 /* Main content area */
 .ds-247420 .app-main {
     background: var(--panel-0);
-    padding: 12px 16px 64px 16px;
+    padding: 16px 20px 72px 20px;
     overflow-y: auto;
 }
 .ds-247420 .app-main.narrow { max-width: 820px; }
 .ds-247420 .app-main.centered { margin: 0 auto; }
+.ds-247420 .app-main.stage  { background: var(--panel-1); border-radius: 18px; margin: 8px; padding: 24px 28px 56px 28px; }
 
 .ds-247420 .app-main h1 {
     font-size: 28px;
@@ -993,7 +1016,6 @@
     border-radius: 20px;
     overflow: hidden;
     margin: 16px 0;
-    box-shadow: var(--panel-shadow, none);
 }
 .ds-247420 .panel-head {
     padding: 14px 22px;
@@ -1044,7 +1066,6 @@
     border-radius: 20px;
     overflow: hidden;
     margin: 8px 0;
-    box-shadow: var(--panel-shadow, none);
 }
 .ds-247420 .list-row {
     display: grid;
@@ -1423,10 +1444,9 @@
     text-decoration: none;
     align-items: baseline;
     border-radius: 20px;
-    box-shadow: var(--panel-shadow, none);
-    transition: background 220ms ease, transform 220ms ease, box-shadow 220ms ease;
+    transition: background var(--dur-base, 160ms) ease;
 }
-.ds-247420 .card-item:hover { background: var(--panel-hover); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(31,27,22,0.06); }
+.ds-247420 .card-item:hover { background: var(--panel-hover); }
 .ds-247420 .card-item .code {
     font-family: var(--ff-ui);
     font-size: 11px;