theme: YoRHa dark — NieR:Automata interface on the space-1 wallpaper

Replaces the Persona x Mocha rice. NieR's menu language is kept whole —
plain rectangles, hairline rules, letter-spaced upright capitals, a square
marker on the current row, corner ticks round panels, and selection shown
by inverting the row — but the colours come from ~/.wallpapers/space-1.jpg
rather than from the game's beige: the grey-green void as the ground, the
suit's sage grey as text, the planet's white as the one accent, and the
hull's red indicator lights as the alarm.

The Persona geometry is switched off rather than ripped out: Theme.skew
and Theme.cut are 0, so P5Panel, Skew and Geom collapse to rectangles.
Overshoot easing, italics and black weights are gone shell-wide.

New, borrowed from caelestia's screen border: bar/Frame.qml draws the bar,
the rail and a thin left/bottom band as one hull on the bottom layer, with
the desktop as a rounded opening cut out of it. Frame also owns all four
exclusive zones, so the bar and rail are placed from the screen edge.

Hyprland moves to 1px borders lit from the planet white into grey, a soft
wide shadow and gaps measured from the opening. Alacritty, fish and dunst
get matching YoRHa palettes. Neovim, GTK/Qt and btop are still Mocha.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

quickshell/components/ChromeSurface.qml

@@ -3,7 +3,7 @@ import "root:/config"
 import "root:/components"
 
 // Calm, permanent-chrome preset. It is deliberately flat and opaque: one
-// neutral keyline, no texture, no offset copy, and no accent unless active.
+// neutral hairline, no texture, no ticks, and no accent unless active.
 P5Panel {
     property bool active: false
     property color tone: Theme.treatmentActiveMark
@@ -12,16 +12,10 @@ P5Panel {
     fillOpacity: 1.0
     border: Theme.treatmentRestMark
     borderWidth: 1
-    // Keep the hard ink contour. Removing both texture and keyline made the
-    // permanent slabs read as generic broadcast HUD chrome.
-    keyline: true
-    drop: false
     halftone: false
     sheen: false
     slash: active
     slashColor: tone
-    slashWidth: 4
-    lean: 0.06
-    chop: Theme.cut
+    slashWidth: 2
     padding: Theme.padS
 }

quickshell/components/Geom.qml

@@ -3,7 +3,10 @@ pragma Singleton
 import QtQuick
 import Quickshell
 
-// Polygon maths for the Persona 5 panel language: everything leans, and corners
+// Polygon maths for panel shapes. Under the YoRHa theme nothing leans and
+// nothing is chopped (Theme.skew and Theme.cut are 0), so these collapse to
+// plain rectangles; they are kept so a shape can be brought back on purpose.
+// Originally the Persona 5 panel language: everything leans, and corners
 // get chopped rather than rounded.
 Singleton {
     id: root

quickshell/components/Icon.qml

@@ -39,7 +39,7 @@ Text {
         }
         NumberAnimation {
             target: root; property: "scale"
-            to: 1.0; duration: Theme.durSlow; easing.type: Easing.OutBack
+            to: 1.0; duration: Theme.durSlow; easing.type: Easing.OutCubic
         }
     }
 }

quickshell/components/ListRow.qml

@@ -7,8 +7,8 @@ import "root:/config"
 // came out as a faint milky film. This is the one row they share now.
 //
 // Rest is bare. Hover lifts the row onto the surface tone. The current item —
-// connected, in use — carries an accent tick down its leading edge and an
-// accent glyph, and its label goes to full weight.
+// connected, in use — carries the NieR square marker at its leading edge and
+// an accent glyph, and its label goes to full weight.
 Item {
     id: root
 
@@ -40,12 +40,13 @@ Item {
     Rectangle {
         anchors.left: parent.left
         anchors.verticalCenter: parent.verticalCenter
-        width: 3
-        height: root.current ? root.height - 10 : 0
+        anchors.leftMargin: 2
+        width: root.current ? Theme.marker : 0
+        height: width
         color: Theme.accent
 
-        Behavior on height {
-            NumberAnimation { duration: Theme.durBase; easing.type: Easing.OutBack }
+        Behavior on width {
+            NumberAnimation { duration: Theme.durBase; easing.type: Easing.OutCubic }
         }
     }
 
@@ -76,8 +77,7 @@ Item {
             color: root.current || root.hovered ? Theme.text : Theme.subtext
             font.family: Theme.fontDisplay
             font.pixelSize: Theme.fsSmall
-            font.italic: true
-            font.weight: root.current ? Font.Black : Font.Medium
+            font.weight: root.current ? Font.DemiBold : Font.Medium
             renderType: Text.NativeRendering
         }
 

quickshell/components/MeterBar.qml

@@ -2,7 +2,7 @@ import QtQuick
 import "root:/config"
 import "root:/components"
 
-// A segmented load meter — slanted ticks that light up left to right. Reads as
+// A segmented load meter — upright ticks that light up left to right. Reads as
 // a gauge at a glance and keeps the panel language consistent.
 Item {
     id: root

quickshell/components/NotifCard.qml

@@ -21,8 +21,8 @@ Item {
     // The card's own geometry, published so anything drawn along its edges —
     // the toast countdown rule — can stay inside the chopped corners instead of
     // running out past them.
-    readonly property real lean: 0.05
-    readonly property real chop: 12
+    readonly property real lean: Theme.skew
+    readonly property real chop: Theme.cut
 
     implicitHeight: panel.height
 
@@ -84,8 +84,7 @@ Item {
                 wrapMode: Text.WordWrap
                 font.family: Theme.fontDisplay
                 font.pixelSize: Theme.fsBody
-                font.weight: Font.Black
-                font.italic: true
+                font.weight: Font.DemiBold
                 renderType: Text.NativeRendering
             }
 
@@ -141,7 +140,6 @@ Item {
                             color: actionHover.hovered ? Theme.ink : Theme.text
                             font.family: Theme.fontDisplay
                             font.pixelSize: Theme.fsMicro
-                            font.italic: true
                             font.weight: Font.DemiBold
                             renderType: Text.NativeRendering
                         }

quickshell/components/P5Backdrop.qml

@@ -1,54 +1,46 @@
 import QtQuick
-import QtQuick.Shapes
 import "root:/config"
 import "root:/components"
 
-// The shared ground for the two full-screen surfaces: an accent wedge leaning
-// at the house angle, a tiled stripe field that sweeps in from the left, and a
-// halftone dot wash over the top.
+// The shared ground for the two full-screen surfaces, in the NieR menu
+// pattern: a hairline grid that sweeps in from the left, a darker column down
+// the left-hand side for the menu or the clock to stand in, and a dot wash
+// over the top.
 //
-// The lock screen and the power menu each used to draw their own version of
-// this. They disagreed — the power menu had a wedge and a full stripe field,
-// the lock had a 42px stripe band and no wedge, and the wedge leaned at 0.32
-// where every panel in the shell leans at Theme.skew. Building both on one
-// component is what makes them read as the same object seen twice rather than
-// as two guesses at the same brief.
+// The lock screen and the power menu both stand on this one component, which
+// is what makes them read as the same object seen twice rather than as two
+// guesses at the same brief.
 Item {
     id: root
 
-    // 0 = withdrawn, 1 = fully present. Drives the stripe slide, the stripe
-    // opacity and the wedge together, so a caller animates one number instead
+    // 0 = withdrawn, 1 = fully present. Drives the grid slide, the grid
+    // opacity and the column together, so a caller animates one number instead
     // of keeping three in sync. The power menu runs it both ways on open and
     // close; the lock runs it once on entry.
     property real reveal: 1
 
     property color tone: Theme.accent
 
+    // The column: a band of the void, edged by a hairline of the light.
+    // `wedge*` names are kept from the Persona layout so callers did not have
+    // to move; there is nothing wedge-shaped left.
     property bool wedge: true
     property real wedgeOpacity: 0.35
-    // Bottom-left corner of the wedge and its span, as fractions of width. The
-    // wedge leans right going up, like every other edge in the shell, so its
-    // top edge sits `leanOffset` further right than its bottom.
     property real wedgeLeft: 0
     property real wedgeSpan: 0.34
 
     property bool stripes: true
-    // Tuned down from 0.10 for Mocha. Crust stripes on the blue-grey base read
-    // far heavier than they did on black, and buzzed against the text.
-    property real stripeOpacity: 0.07
+    property real stripeOpacity: 0.05
 
     property bool halftone: true
     property real halftoneOpacity: 0.05
     property color halftoneColor: Theme.primary
 
-    // ONE angle, everywhere — the same rule the panels follow.
-    readonly property real leanOffset: root.height * Theme.skew
-
-    // Diagonal stripe field, sliding in from off-screen left.
+    // Hairline grid, sliding in from off-screen left.
     Image {
         anchors.fill: parent
         visible: root.stripes && root.reveal > 0
-        source: Theme.texStripes
+        source: Theme.texGrid
         fillMode: Image.Tile
         opacity: root.stripeOpacity * root.reveal
         smooth: false
@@ -63,39 +55,33 @@ Item {
         }
     }
 
-    // The wedge. Drawn after the stripes so it reads as a slab laid over them.
-    Shape {
-        anchors.fill: parent
+    // The column. Drawn after the grid so it reads as a panel laid over it.
+    Item {
+        x: root.wedgeLeft * root.width
+        width: root.wedgeSpan * root.width
+        height: root.height
         visible: root.wedge && root.reveal > 0
         opacity: root.reveal
-        preferredRendererType: Shape.CurveRenderer
 
-        ShapePath {
-            fillColor: Theme.alpha(Theme.accentDim, root.wedgeOpacity)
-            strokeColor: "transparent"
-            joinStyle: ShapePath.MiterJoin
+        Rectangle {
+            anchors.fill: parent
+            color: Theme.alpha(Theme.ink, root.wedgeOpacity)
+        }
 
-            PathPolyline {
-                path: {
-                    const x = root.wedgeLeft * root.width;
-                    const span = root.wedgeSpan * root.width;
-                    const off = root.leanOffset;
-                    return Geom.closed([
-                        Qt.point(x + off, 0),
-                        Qt.point(x + off + span, 0),
-                        Qt.point(x + span, root.height),
-                        Qt.point(x, root.height)
-                    ]);
-                }
-            }
+        // Its edge, drawn top-down as the column arrives.
+        Rectangle {
+            anchors.right: parent.right
+            width: 1
+            height: parent.height * root.reveal
+            color: Theme.alpha(root.tone, 0.35)
         }
     }
 
-    // Screen-printed dot wash over the whole thing.
+    // Dot wash over the whole thing.
     Image {
         anchors.fill: parent
         visible: root.halftone
-        source: Theme.texHalftone
+        source: Theme.texDots
         fillMode: Image.Tile
         opacity: root.halftoneOpacity
         smooth: false

quickshell/components/P5Button.qml

@@ -1,7 +1,8 @@
 import QtQuick
 import "root:/config"
 
-// Chopped, leaning button with one activation path for pointer and keyboard.
+// NieR menu button: a hairline box with a square marker that lights when the
+// button is pointed at or chosen. One activation path for pointer and keyboard.
 FocusScope {
     id: root
 
@@ -11,7 +12,7 @@ FocusScope {
     property bool destructive: false
     property bool selected: false
     property real lean: Theme.skew
-    property real lunge: 6
+    property real lunge: 4
     property bool wide: false
 
     signal clicked()
@@ -24,7 +25,7 @@ FocusScope {
     // Keyboard focus and roving selection invert the slab to solid accent.
     // Pointer hover stays a keyline change, so the two never look alike and a
     // mouse user never sees the "selected" treatment by accident. Destructive
-    // buttons keep their own mauve inversion for both.
+    // buttons keep their own red inversion for both.
     readonly property bool inverted: root.enabled && !root.destructive && root.focusedOrSelected
 
     // Pointer activation must not turn a transient action into the black/white
@@ -70,8 +71,6 @@ FocusScope {
             return Theme.alpha(root.accent, 0.55);
         }
         borderWidth: Theme.stroke
-        slash: !root.highlighted
-        slashColor: root.destructive ? Theme.alarm : root.accent
 
         Behavior on fillOpacity {
             NumberAnimation { duration: Theme.durFast }
@@ -83,6 +82,20 @@ FocusScope {
             anchors.left: parent.left
             spacing: Theme.padM
 
+            // The marker. Dim at rest, full strength under the pointer or the
+            // cursor, in whatever colour the label is wearing.
+            Rectangle {
+                anchors.verticalCenter: parent.verticalCenter
+                width: Theme.marker
+                height: Theme.marker
+                color: label.color
+                opacity: root.highlighted ? 1.0 : 0.35
+
+                Behavior on opacity {
+                    NumberAnimation { duration: Theme.durFast }
+                }
+            }
+
             Icon {
                 anchors.verticalCenter: parent.verticalCenter
                 visible: root.icon !== ""
@@ -100,6 +113,7 @@ FocusScope {
             }
 
             Text {
+                id: label
                 anchors.verticalCenter: parent.verticalCenter
                 text: root.text
                 color: {
@@ -114,8 +128,7 @@ FocusScope {
                 font.family: Theme.fontDisplay
                 font.pixelSize: Theme.fsBody
                 font.weight: Theme.weightDisplay
-                font.italic: true
-                font.letterSpacing: 1.5
+                font.letterSpacing: Theme.tracking
                 font.capitalization: Font.AllUppercase
                 renderType: Text.NativeRendering
 
@@ -132,7 +145,7 @@ FocusScope {
         Behavior on x {
             NumberAnimation {
                 duration: Theme.durBase
-                easing.type: Easing.OutBack
+                easing.type: Easing.OutCubic
             }
         }
     }

quickshell/components/P5Panel.qml

@@ -4,8 +4,13 @@ import QtQuick.Effects
 import "root:/config"
 import "root:/components"
 
-// The base surface for everything in this shell: a leaning, corner-chopped slab
-// with an optional halftone wash and a accent slash along its leading edge.
+// The base surface for everything in this shell. Under the YoRHa theme it is a
+// plain rectangle with a hairline border, an optional dot wash, an optional
+// accent bar down its leading edge, and optional corner ticks — the brackets
+// NieR frames its panels with.
+//
+// The lean and chop knobs still exist and still work, so a caller can bring a
+// shape back on purpose, but Theme.skew and Theme.cut are both zero.
 Item {
     id: root
 
@@ -29,12 +34,12 @@ Item {
     property real chop: Theme.cut
     property var chopCorners: [1, 3]
 
-    // Tone slash down the leading edge — the Persona 5 tell.
+    // Accent bar down the leading edge.
     property bool slash: false
     property color slashColor: Theme.accent
     property real slashWidth: 4
 
-    // Screen-printed dot wash.
+    // Dot-grid wash.
     property bool halftone: false
     property color halftoneColor: Theme.primary
     property real halftoneOpacity: 0.07
@@ -45,16 +50,20 @@ Item {
     // call sites that still set it don't have to be chased down.
     property bool sheen: false
 
-    // The screen-print stack. A pure-black copy of the silhouette sits behind
-    // the fill, offset down-and-right, and the fill carries a black keyline
-    // outside its coloured border. Together these are what stop the panel from
-    // reading as a flat clip-path.
-    property bool drop: true
+    // Optional print stack: an ink copy of the silhouette offset behind the
+    // fill, and an ink keyline outside the border. Both off by default — on a
+    // dark ground they only thicken the edge.
+    property bool drop: false
     property real dropOffset: Theme.dropOffset
     property color dropColor: Theme.ink
-    property bool keyline: true
+    property bool keyline: false
     property real keylineWidth: Theme.keylineWidth
 
+    // Corner ticks: a short L at each corner, just outside the border.
+    property bool ticks: false
+    property color tickColor: Theme.outline
+    property real tickLength: Theme.tick
+
     readonly property real leanInset:
         (vertical ? width : height) * Math.abs(lean)
 
@@ -165,7 +174,7 @@ Item {
         asynchronous: true
         sourceComponent: Image {
             anchors.fill: parent
-            source: Theme.texHalftone
+            source: Theme.texDots
             fillMode: Image.Tile
             opacity: root.halftoneOpacity
             smooth: false
@@ -237,6 +246,44 @@ Item {
         }
     }
 
+    // Corner ticks. Two hairlines per corner, sitting 3px outside the panel so
+    // they read as a frame around it rather than as part of its border.
+    Loader {
+        anchors.fill: parent
+        anchors.margins: -3
+        active: root.ticks
+        sourceComponent: Item {
+            Repeater {
+                model: 4
+
+                Item {
+                    required property int index
+                    readonly property bool atRight: index === 1 || index === 2
+                    readonly property bool atBottom: index >= 2
+
+                    x: atRight ? parent.width - width : 0
+                    y: atBottom ? parent.height - height : 0
+                    width: root.tickLength
+                    height: root.tickLength
+
+                    Rectangle {
+                        y: parent.atBottom ? parent.height - 1 : 0
+                        width: parent.width
+                        height: 1
+                        color: root.tickColor
+                    }
+
+                    Rectangle {
+                        x: parent.atRight ? parent.width - 1 : 0
+                        width: 1
+                        height: parent.height
+                        color: root.tickColor
+                    }
+                }
+            }
+        }
+    }
+
     Item {
         id: contentHolder
         anchors.fill: parent

quickshell/components/P5Slider.qml

@@ -2,7 +2,8 @@ import QtQuick
 import "root:/config"
 import "root:/components"
 
-// Leaning slider with a chopped handle. Drag or click anywhere on the rail.
+// Hairline slider with a square handle, the NieR settings-menu slider. Drag or
+// click anywhere on the rail.
 Item {
     id: root
 
@@ -30,7 +31,7 @@ Item {
         anchors.verticalCenter: parent.verticalCenter
         anchors.left: parent.left
         anchors.right: parent.right
-        height: root.activeFocus ? 10 : 6
+        height: root.activeFocus ? 4 : 2
         // Focus widens the rail and rings it in the accent rather than filling
         // it: the level fill is often the accent itself, and a solid accent
         // rail swallowed it.
@@ -50,7 +51,7 @@ Item {
         anchors.verticalCenter: parent.verticalCenter
         anchors.left: parent.left
         width: Math.max(0, Math.min(1, root.value)) * root.width
-        height: 6
+        height: root.activeFocus ? 4 : 2
         color: root.enabled ? root.accent : Theme.treatmentDisabledText
 
         Behavior on width {
@@ -66,14 +67,14 @@ Item {
     // Handle
     Skew {
         id: handle
-        width: 6
-        height: root.activeFocus || hover.hovered || drag.active ? 18 : 14
+        width: height
+        height: root.activeFocus || hover.hovered || drag.active ? 12 : 10
         color: root.enabled ? Theme.text : Theme.treatmentDisabledText
         anchors.verticalCenter: parent.verticalCenter
         x: Math.max(0, Math.min(1, root.value)) * root.width - width / 2
 
         Behavior on height {
-            NumberAnimation { duration: Theme.durFast; easing.type: Easing.OutBack }
+            NumberAnimation { duration: Theme.durFast; easing.type: Easing.OutCubic }
         }
         Behavior on x {
             enabled: !drag.active

quickshell/components/P5Tooltip.qml

@@ -69,7 +69,6 @@ PopupWindow {
     ChromeSurface {
         anchors.fill: parent
         padding: root.pad
-        lean: 0.06
 
         Column {
             id: textColumn
@@ -84,7 +83,6 @@ PopupWindow {
                 font.family: Theme.fontDisplay
                 font.pixelSize: Theme.fsSmall
                 font.weight: Theme.weightDisplay
-                font.italic: true
                 renderType: Text.NativeRendering
             }
 

quickshell/components/Popout.qml

@@ -226,12 +226,12 @@ PopupWindow {
         }
         NumberAnimation {
             target: contentHolder; property: "scale"
-            to: 1.0; duration: Theme.durSlow; easing.type: Easing.OutBack
+            to: 1.0; duration: Theme.durSlow; easing.type: Easing.OutCubic
         }
         NumberAnimation {
             target: contentHolder; property: root.slideProperty
             from: root.slideOrigin; to: root.bleed
-            duration: Theme.durSlow; easing.type: Easing.OutBack
+            duration: Theme.durSlow; easing.type: Easing.OutCubic
         }
     }
 

quickshell/components/Porthole.qml

@@ -0,0 +1,43 @@
+import QtQuick
+import "root:/config"
+
+// The house mark: a porthole with a planet low in it — the wallpaper's one
+// composition, drawn in a hairline ring and a disc. The bar's sigil and the
+// lock screen both draw it, so the two are the same mark at two sizes.
+Item {
+    id: root
+
+    property real size: 18
+    property bool lit: false
+
+    implicitWidth: root.size
+    implicitHeight: root.size
+
+    Rectangle {
+        anchors.fill: parent
+        radius: width / 2
+        color: "transparent"
+        border.width: Math.max(1, Math.round(root.size / 18))
+        border.color: root.lit ? Theme.accent : Theme.primaryDim
+
+        Behavior on border.color {
+            ColorAnimation { duration: Theme.durFast }
+        }
+    }
+
+    // The planet's limb, sitting on the ring's lower edge. Always the planet
+    // white; `lit` only lets it rise a little.
+    Rectangle {
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: root.size / 6
+        width: root.size * (root.lit ? 0.44 : 0.34)
+        height: width
+        radius: width / 2
+        color: Theme.accent
+
+        Behavior on width {
+            NumberAnimation { duration: Theme.durBase; easing.type: Easing.OutCubic }
+        }
+    }
+}

quickshell/components/SplitText.qml

@@ -1,14 +1,13 @@
 import QtQuick
 import "root:/config"
 
-// Display text, screen-printed: the body sits on a hard crust copy knocked a
-// pixel and a half down-right — the same offset `P5Panel` puts behind every
-// slab. Drives most headings in the shell.
+// Display text: upright, widely tracked, sitting on a soft ink copy a pixel
+// down-right — the faint drop NieR puts under every line of its interface.
+// Drives most headings in the shell.
 //
-// This used to carry a permanent RGB split, a blue and a mauve ghost either
-// side of the body. On crimson-and-black that read as misregistered print; on
-// Mocha's pastels it read as blur, and it turned every heading in the shell
-// soft. The two ghosts still exist, but only for the moment `glitch()` runs.
+// The two ghosts either side of the body are the data-corruption flicker NieR
+// uses when something changes under you. They are invisible at rest and only
+// appear for the moment `glitch()` runs.
 Item {
     id: root
 
@@ -16,16 +15,16 @@ Item {
     property int pixelSize: Theme.fsLarge
     property int weight: Theme.weightDisplay
     property string family: Theme.fontDisplay
-    property bool italic: true
+    property bool italic: false
     property color color: Theme.text
     property int elide: Text.ElideNone
     property int horizontalAlignment: Text.AlignLeft
-    property real letterSpacing: 0.5
+    property real letterSpacing: Theme.tracking
 
-    // Print shadow. Scales gently with size so a 34px heading does not sit on
+    // Drop shadow. Scales gently with size so a 34px heading does not sit on
     // the same hairline offset as an 11px label.
-    property real shadowOffset: Math.max(1, Math.round(root.pixelSize / 10))
-    property color shadowColor: Theme.ink
+    property real shadowOffset: Math.max(1, Math.round(root.pixelSize / 16))
+    property color shadowColor: Theme.alpha(Theme.ink, 0.85)
 
     // Ghost offset and resting strength. Resting strength is zero, so the
     // ghosts are invisible until `glitch()` kicks them out. A caller that sets