/* Apple's layout rhythm. iOS screen margin is 16pt at compact width, 20pt at regular. Control spacing matters as much as control size — 8pt is the minimum gutter between two adjacent tap targets. */ :root { --space-025: 2px; --space-05: 4px; --space-075: 6px; --space-1: 8px; --space-125: 10px; --space-15: 12px; --space-2: 16px; --space-25: 20px; --space-3: 24px; --space-4: 32px; --space-5: 40px; --space-6: 48px; --space-8: 64px; --space-10: 80px; /* ---- Semantic layout ---- */ --margin-screen-compact: 16px; --margin-screen-regular: 20px; --margin-window-macos: 20px; --gutter-control: 8px; --inset-list-row: 16px; --inset-card: 16px; /* ---- Hit targets (HIG minimums) ---- */ --target-ios-default: 44px; --target-ios-min: 28px; --target-macos-default: 28px; --target-macos-min: 20px; /* ---- Bar heights ---- */ --height-status-bar: 54px; --height-nav-bar: 44px; --height-nav-bar-large: 96px; --height-tab-bar: 49px; --height-home-indicator: 34px; --height-toolbar-macos: 52px; --height-titlebar-macos: 28px; --height-list-row: 44px; --height-list-row-detail: 60px; /* ---- Hairline ---- */ --hairline: 0.5px; } /* Minimum and default hit targets, per platform (accessibility.md > Mobility). The system previously carried only the iOS and macOS pair. */ :root { --target-tvos-default: 66px; /* @kind other */ --target-tvos-min: 56px; /* @kind other */ --target-visionos-default: 60px; /* @kind other */ --target-visionos-min: 28px; /* @kind other */ --target-watchos-default: 44px; /* @kind other */ --target-watchos-min: 28px; /* @kind other */ } /* ---- tvOS safe area and grids (layout.md > tvOS) ---- Apple publishes exact numbers here and they were missing from the system. Primary content must be inset 60pt top/bottom and 80pt left/right so nothing is lost to overscan cropping or a TV's own compatibility settings — this is not a style choice, it is the difference between visible and clipped on a real television. The grid table is Apple's, verbatim: every column count shares 40pt of horizontal spacing and a 100pt MINIMUM vertical gap, and only the unfocused tile width changes. The vertical gap is large because a tvOS tile GROWS when focused; the gap is sized so a focused tile never overlaps the row above it. */ :root { --safe-area-tvos-vertical: 60px; /* @kind other */ --safe-area-tvos-horizontal: 80px; /* @kind other */ --grid-tvos-gap-x: 40px; /* @kind other */ --grid-tvos-gap-y: 100px; /* minimum @kind other */ --grid-tvos-col-2: 860px; /* @kind other */ --grid-tvos-col-3: 560px; /* @kind other */ --grid-tvos-col-4: 410px; /* @kind other */ --grid-tvos-col-5: 320px; /* @kind other */ --grid-tvos-col-6: 260px; /* @kind other */ --grid-tvos-col-7: 217px; /* @kind other */ --grid-tvos-col-8: 184px; /* @kind other */ --grid-tvos-col-9: 160px; /* @kind other */ /* ---- visionOS control spacing (buttons.md + layout.md > visionOS) ---- Eye targeting is coarser than touch, so visionOS sizes by CENTRE DISTANCE rather than by edge padding: keep button centres at least 60pt apart. A button already 60pt or larger additionally needs 4pt of padding around it, otherwise the system hover effect of one button bleeds over its neighbour. */ --spacing-visionos-button-centers: 60px; /* @kind other */ --spacing-visionos-button-padding: 4px; /* for buttons >= 60pt @kind other */ /* The centre rule has a companion edge rule (spatial-layout.md > Best practices): 60pt between centres AND at least 16pt of clear space between the buttons themselves. Both must hold — two small buttons can satisfy the centre distance while still sitting close enough that one's hover effect crowds the other. */ --spacing-visionos-button-gap: 16px; /* @kind other */ /* visionOS button heights (buttons.md > visionOS). Circular supports all five; capsule with text and icon is regular/large only; rounded rect skips mini and XL. */ --size-visionos-button-mini: 28px; /* @kind other */ --size-visionos-button-small: 32px; /* @kind other */ --size-visionos-button-regular: 44px; /* @kind other */ --size-visionos-button-large: 52px; /* @kind other */ --size-visionos-button-xlarge: 64px; /* @kind other */ /* macOS image button: ~10px of padding between artwork and the button's edge, so a click just outside the image still registers (buttons.md > macOS > Image buttons). */ --padding-macos-image-button: 10px; /* @kind other */ /* tvOS tab bar (tab-bars.md > tvOS). Both numbers are FIXED by the system and cannot be changed: the bar is 68pt tall and its top edge sits 46pt below the top of the screen. Note 46pt is less than the 60pt tvOS content safe area — the tab bar is chrome, so it is allowed inside the margin that body content must respect. */ /* macOS menu bar is 24pt tall (the-menu-bar.md > macOS > Menu bar extras). Fixed. */ --height-menu-bar-macos: 24px; /* @kind other */ /* Toolbar limits (toolbars.md) — VERIFIED September 2026. Window/view title: keep under 15 characters so controls still have room. Group count: aim for a maximum of THREE groups, even on iPad and Mac where the extra width tempts you otherwise. */ --toolbar-title-max-chars: 15; /* @kind other */ --toolbar-max-groups: 3; /* @kind other */ /* macOS split-view divider: the THIN style is 1pt and is the one to use — it gives content the most room and is still easy to grab. Reach for a thicker style only when both sides carry strong horizontal rules that would swallow a 1pt line (split-views.md > macOS). Set min and max pane sizes that keep the divider visible; a pane squeezed to nothing takes the divider with it. */ --divider-split-view-macos: 1px; /* @kind other */ /* tvOS split view defaults to one third primary, two thirds secondary; a half-and-half layout is the sanctioned alternative (split-views.md > tvOS). */ --split-tvos-primary: 33.333%; /* @kind other */ --split-tvos-secondary: 66.667%; /* @kind other */ --height-tab-bar-tvos: 68px; /* @kind other */ --offset-tab-bar-tvos-top: 46px; /* @kind other */ /* ---- Sheet detents (sheets.md > iOS, iPadOS) ---- A sheet rests at named heights called detents. The system defines two: LARGE, the fully expanded sheet, and MEDIUM, about half that. Large is always available; adding medium lets the sheet rest at both, and specifying ONLY medium locks the sheet out of full height — which is the right call when the content is a short menu of choices, and the wrong one for a compose view. */ --sheet-detent-medium: 50%; /* @kind other */ --sheet-detent-large: 100%; /* @kind other */ /* ⚠️ Grabber dimensions are OURS, not Apple's — sheets.md describes the grabber ("a small horizontal indicator at the top edge") and its behaviour but publishes no size. Verified September 2026. */ --sheet-grabber-width: 36px; /* ours @kind other */ --sheet-grabber-height: 5px; /* ours @kind other */ /* visionOS alert accessory view: max 154pt tall, 16pt radius (alerts.md > visionOS). Alerts everywhere cap at THREE buttons. */ --size-visionos-alert-accessory-max-height: 154px; /* @kind other */ --radius-visionos-alert-accessory: 16px; /* @kind other */ /* ---- App icon layout sizes (app-icons.md > Specifications) ---- The canvas you design on, before the system masks it. Shapes differ per platform: iOS/iPadOS/macOS mask to a rounded square whose curvature matches the device bezel, tvOS to a rounded rectangle, visionOS and watchOS to a CIRCLE — so centre the primary content or those two will crop it. Never ship a pre-masked layer; it wrecks the system's specular highlights and leaves jagged edges. */ --icon-app-canvas-ios: 1024px; /* also iPadOS, macOS, visionOS @kind other */ --icon-app-canvas-tvos-w: 800px; /* @kind other */ --icon-app-canvas-tvos-h: 480px; /* @kind other */ --icon-app-canvas-watchos: 1088px; /* @kind other */ /* ---- watchOS autoscaling PDF scale factors (images.md > watchOS) ---- VERIFIED September 2026. Supply ONE autoscaling PDF drawn for the 40mm/42mm screen at @2x and WatchKit scales it per device by these exact percentages. Note 40mm and 42mm are both 100% (they are the design baseline) and 45mm and 49mm share 119%. */ --scale-watchos-38mm: 0.90; /* @kind other */ --scale-watchos-40mm: 1.00; /* @kind other */ /* design baseline */ --scale-watchos-41mm: 1.06; /* @kind other */ --scale-watchos-42mm: 1.00; /* @kind other */ /* design baseline */ --scale-watchos-44mm: 1.10; /* @kind other */ --scale-watchos-45mm: 1.19; /* @kind other */ --scale-watchos-49mm: 1.19; /* @kind other */ /* ---- Widgets (widgets.md) ---- The standard widget margin is 16pt. Tighter 11pt margins are sanctioned, but only for content groupings inside the widget — graphics, buttons, background shapes — never for the widget's own outer edge. Mac desktop and Lock Screen widgets (including StandBy) use smaller margins than these; the system sets those. Widget content radius must be CONCENTRIC with the widget's own corner, same rule as toolbars — see tokens/radius.css. Text floor is 11pt, same as iOS generally. Sizes below are the 393×852 / 390×844 iPhone class, the modern default. The full per-screen table is in widgets.md > Specifications; these are the ones to design against, and the system scales them for other screens. */ --widget-margin: 16px; /* @kind other */ --widget-margin-tight: 11px; /* inner groupings only @kind other */ --widget-small: 158px; /* @kind other */ --widget-medium-w: 338px; /* @kind other */ --widget-medium-h: 158px; /* @kind other */ --widget-large-w: 338px; /* @kind other */ --widget-large-h: 354px; /* @kind other */ --widget-accessory-circular: 72px; /* @kind other */ --widget-accessory-rect-w: 160px; /* @kind other */ --widget-accessory-rect-h: 72px; /* @kind other */ --widget-accessory-inline-w: 234px; /* @kind other */ --widget-accessory-inline-h: 26px; /* @kind other */ /* visionOS default window: 1280x720 pt (windows.md > visionOS). The system places it about two metres in front of the wearer, giving an apparent width near three metres — so an over-large default window does not just look empty, it blocks the room. Always set a min and max size; without them a window can be shrunk until controls overlap or grown until the app is unusable. */ --size-visionos-window-default-w: 1280px; /* @kind other */ --size-visionos-window-default-h: 720px; /* @kind other */ /* ---- Live Activities (live-activities.md > Specifications) ---- VERIFIED against Apple's Markdown, September 2026. The Dynamic Island corner radius is 44pt and its corner shape matches the TrueDepth camera. That radius is what every inner shape must be concentric WITH: Apple states the rule here in the same terms as toolbars — match a child's radius to the outer radius minus the margin, so nothing pokes into the rounded shape. Two device classes only. The "Max / Plus / Air" bodies give a 250pt island and a 408pt expanded width; the "Pro / standard" bodies give 230pt and 371pt. Every iPhone from 14 Pro through 17 Pro Max falls into one of those two. */ --dynamic-island-radius: 44px; /* @kind other */ --dynamic-island-width-wide: 250px; /* 17 Pro Max, Air, 16 Plus, 15 Plus… @kind other */ --dynamic-island-width-narrow: 230px; /* 17 Pro, 17, 16 Pro, 15 Pro… @kind other */ --live-activity-compact-w-wide: 62.33px; /* 430x932 screens @kind other */ --live-activity-compact-w-narrow: 52.33px; /* 393x852 screens @kind other */ --live-activity-compact-h: 36.67px; /* @kind other */ --live-activity-minimal-w-min: 36.67px; /* @kind other */ --live-activity-minimal-w-max: 45px; /* @kind other */ --live-activity-minimal-h: 36.67px; /* @kind other */ /* Expanded and Lock Screen share a width and a height RANGE — the height is meant to flex with how much content there is, not sit at a fixed value. */ --live-activity-expanded-w-wide: 408px; /* @kind other */ --live-activity-expanded-w-narrow: 371px; /* @kind other */ --live-activity-expanded-h-min: 84px; /* @kind other */ --live-activity-expanded-h-max: 160px; /* @kind other */ /* iPadOS Lock Screen: 500pt wide on 1366x1024, 425pt on every other listed size. */ --live-activity-ipad-w-large: 500px; /* @kind other */ --live-activity-ipad-w-regular: 425px; /* @kind other */ /* Apple's stated standard layout margin for a Lock Screen Live Activity. Tighter is allowed for graphics and buttons, but not for the general content edge. */ --live-activity-lock-screen-margin: 14px; /* @kind other */ /* CarPlay Live Activity sizes — the system picks one to fit the vehicle screen. */ --live-activity-carplay-240x78-w: 240px; /* @kind other */ --live-activity-carplay-240x78-h: 78px; /* @kind other */ --live-activity-carplay-240x100-h: 100px; /* @kind other */ --live-activity-carplay-170x78-w: 170px; /* @kind other */ /* ---- Apple Pay button (apple-pay.md > Button size and position) ---- VERIFIED against Apple's Markdown, September 2026. Two minimum widths, and which one applies depends on the button's wording: the plain "Apple Pay" button clears 100pt, every labelled variant (Buy with, Check Out with, Donate with, Subscribe with, Book with, Set Up) needs 140pt. Height floor is 30pt for all of them. Margins are RELATIVE — one tenth of the button's height — so they scale with the button rather than sitting at a fixed value. Undersize a labelled button and the system silently swaps in the plain Apple Pay button when the localized title will not fit. There is no such fallback for Set Up Apple Pay, which simply breaks. Test at your longest locale. Corner radius is yours to set: square through default through capsule, matched to the other buttons in the flow. That is the one customization Apple sanctions — never redraw the button itself. */ --apple-pay-button-min-width: 100px; /* plain button @kind other */ --apple-pay-button-min-width-labeled: 140px; /* Buy with / Check Out with / etc @kind other */ --apple-pay-button-min-height: 30px; /* @kind other */ --apple-pay-button-margin-ratio: 0.1; /* x button height @kind other */ --apple-pay-mark-clear-space-ratio: 0.1; /* x mark height @kind other */ --apple-pay-web-icon: 60px; /* 120px @2x, 180px @3x @kind other */ /* ---- Sign in with Apple button (sign-in-with-apple.md > Displaying buttons) ---- VERIFIED against Apple's Markdown, September 2026. Same floors as the Apple Pay labelled button — 140pt wide, 30pt tall, margin at 1/10 of height — but this page also publishes the TYPE RATIO, which nothing else in the HIG does: the title's font size is 43% of the button's height, or put the other way, the button is 233% of the title's font size, rounded to the nearest integer. A custom Sign in with Apple button must hold that proportion whatever font it uses; App Review checks custom buttons. 44pt is the default and recommended iOS height, and the only height at which the PNG logo artwork may be used — any other height needs the SVG or PDF. Logo-only buttons are always 1:1 and PNG-only at 44x44. Trailing margin between title and right edge: at least 8% of the button's WIDTH (note: width, not height — the one margin on this page measured the other way). */ --siwa-button-min-width: 140px; /* @kind other */ --siwa-button-min-height: 30px; /* @kind other */ --siwa-button-height-default: 44px; /* iOS default; PNG artwork valid only here @kind other */ --siwa-button-margin-ratio: 0.1; /* x button height @kind other */ --siwa-title-size-ratio: 0.43; /* font size = 43% of button height @kind other */ --siwa-title-trailing-margin-ratio: 0.08; /* x button WIDTH @kind other */ /* ---- tvOS Top Shelf (top-shelf.md) ---- VERIFIED against Apple's Markdown, September 2026. Every Top Shelf image has THREE sizes, not one, and they are not interchangeable: the actual asset size, the safe zone (which is also the focused size), and the smaller unfocused size. A tvOS tile grows on focus, so the asset is drawn at the actual size, displayed unfocused at the smallest, and expands into the safe zone when focused. Design the important content inside the safe zone. Watch for the scaling trap Apple calls out: mixing aspect ratios in one row scales every image up to the tallest, so a 16:9 image placed beside a poster or square ends up 500pt high rather than its own 440. */ --tvos-topshelf-static-w: 2320px; /* fallback static image @kind other */ --tvos-topshelf-static-h: 720px; /* @kind other */ --tvos-poster-actual-w: 404px; --tvos-poster-actual-h: 608px; /* @kind other */ --tvos-poster-safe-w: 380px; --tvos-poster-safe-h: 570px; /* = focused @kind other */ --tvos-poster-unfocused-w: 333px;--tvos-poster-unfocused-h: 570px; /* @kind other */ --tvos-square-actual: 608px; /* @kind other */ --tvos-square-safe: 570px; /* = focused @kind other */ --tvos-square-unfocused: 500px; /* @kind other */ --tvos-16x9-actual-w: 908px; --tvos-16x9-actual-h: 512px; /* @kind other */ --tvos-16x9-safe-w: 852px; --tvos-16x9-safe-h: 479px; /* = focused @kind other */ --tvos-16x9-unfocused-w: 782px; --tvos-16x9-unfocused-h: 440px; /* @kind other */ --tvos-banner-actual-w: 1940px; --tvos-banner-actual-h: 692px; /* @kind other */ --tvos-banner-safe-w: 1740px; --tvos-banner-safe-h: 620px; /* @kind other */ --tvos-banner-unfocused-w: 1740px; --tvos-banner-unfocused-h: 560px; /* @kind other */ /* ---- visionOS eye targeting (eyes.md + spatial-layout.md) — VERIFIED ---- ⚠️ CORRECTED September 2026. An earlier pass read these two numbers as ALTERNATIVES. They are not. spatial-layout.md states them conjunctively, in one sentence: place regular-size buttons "so their centers are at least 60 points apart, leaving 16 points or more of space between them." So BOTH must hold — 60pt centre-to-centre AND a 16pt clear gap. Satisfying only the centre distance is possible with two small buttons that still sit close enough for one hover effect to crowd the other, which is the failure the edge rule exists to prevent. Also: never let controls overlap other interactive elements or views. The reason rounded shapes are mandated: eyes are drawn toward corners, so a square target is genuinely harder to hold a gaze on than a circular one. Not a style preference — a targeting constraint. */ --spacing-visionos-item-margin: 16px; /* @kind other */ /* ---- watchOS complications (complications.md) — VERIFIED, September 2026 ---- Apple publishes a size per layout PER CASE SIZE (38/40/41/44/45/49mm). Carrying all of them as tokens would add ~80 variables, so the 45mm/49mm column is tokenized here — the modern default — and the full table lives in guidelines/patterns/complications.md. Two rules that are not sizes and matter more than any of them: - Minimum line width 2pt. Thinner disappears at a glance, especially in motion. - Never let colour alone carry information: in TINTED MODE the system desaturates everything to greyscale and applies one wearer-chosen colour. Both large rectangular image layouts get an automatic 4pt corner radius. */ --complication-circular-image: 50px; /* 45/49mm @kind other */ --complication-circular-gauge-closed: 32px; /* @kind other */ --complication-circular-gauge-open: 13px; /* @kind other */ --complication-xl-circular-image: 143px; /* @kind other */ --complication-xl-circular-gauge-closed: 91.5px; /* @kind other */ --complication-corner-circular: 38px; /* @kind other */ --complication-corner-gauge: 24px; /* @kind other */ --complication-rect-image-with-title-w: 178.5px; --complication-rect-image-with-title-h: 56px; /* @kind other */ --complication-rect-image-no-title-w: 193px; --complication-rect-image-no-title-h: 82px; /* @kind other */ --complication-rect-body-icon: 14.5px; /* @kind other */ --complication-line-width-min: 2px; /* @kind other */ --complication-rect-image-radius: 4px; /* applied automatically @kind other */ /* ---- iPadOS pointer hit regions (pointing-devices.md) — VERIFIED, Sept 2026 ---- Distinct from the 44x44 touch target and additive to it. The pointer transforms as soon as it enters an element's HIT region, not its visible bounds, and that gap is what produces the magnetism effect — the element appears to pull the pointer in. Too small and people feel they must be precise; too large and the pointer feels stuck to the element. Two values, and which applies depends on whether the element has a bezel: bezelled (a filled or outlined button) ~12pt of padding unbezelled (a bare glyph or label) ~24pt of padding Bare glyphs need double because they have no visible edge to aim at. Adjacent bar buttons need CONTIGUOUS hit regions — any gap makes the pointer snap back to its default circle between them, which reads as a flicker. */ --pointer-hit-padding-bezeled: 12px; /* @kind other */ --pointer-hit-padding-unbezeled: 24px; /* @kind other */ /* accessibility.md states the SAME two numbers as general control spacing, not just pointer hit regions — "about 12 points of padding around elements that include a bezel… for elements without a bezel, about 24 points". Two pages agreeing puts these beyond doubt, and it means the values apply to touch layout as well as pointer targeting. Aliased so intent is readable at the call site. */ --spacing-control-padding-bezeled: var(--pointer-hit-padding-bezeled); --spacing-control-padding-unbezeled: var(--pointer-hit-padding-unbezeled); /* ---- visionOS immersion (immersive-experiences.md) — VERIFIED ---- The progressive and full styles define a boundary ~1.5m from the starting head position. Approach it and the scene fades up into passthrough; cross it and the experience is replaced by the app icon. So an experience that expects people to walk must use `mixed`, which sets no boundary. Digital Crown immersion range for progressive: 120-360 degrees by default. */ --visionos-immersion-boundary: 1.5m; /* @kind other */ --visionos-immersion-min-deg: 120; /* @kind other */ --visionos-immersion-max-deg: 360; /* @kind other */ /* ---- Video (playing-video.md) — VERIFIED, September 2026 ---- Default playback mode is chosen from the ASPECT RATIO, and the mapping is not monotonic — ultrawide behaves like standard, not like wide: standard 4:3 up to 2:1 fit-to-screen (letterbox/pillarbox as needed) wide 2:1 to 2.40:1 full-screen (aspect-fill, may crop edges) ultrawide above 2.40:1 fit-to-screen Never bake letterbox or pillarbox padding into the frame — the system then cannot scale correctly, and the video shrinks in both modes and breaks Picture in Picture. visionOS scrub thumbnails are 160 px wide. tvOS interactive overlays need a 0.5s minimum delay before pausing playback. Loading screens only past ~2 seconds, and then black with a centred spinner. */ --video-thumbnail-visionos-width: 160px; /* @kind other */ --delay-tvos-overlay-pause: 500ms; /* @kind other */ --video-loading-screen-threshold: 2000ms; /* @kind other */ /* watchOS video assets — scaling costs performance, so author at these exactly. */ --video-watchos-fullscreen-w: 208px; --video-watchos-fullscreen-h: 260px; /* @kind other */ --video-watchos-16x9-w: 320px; --video-watchos-16x9-h: 180px; /* @kind other */ /* ---- SharePlay spatial templates (shareplay.md) — VERIFIED, revised Sept 9 2026 ---- Apple Vision Pro supports up to FIVE spatial Personas in one activity, and seats must sit at least a metre apart. Closer than that and a Persona is replaced by a contact photo, which is exactly the loss of presence the template exists to create. Define all five seats up front and keep a seat after someone leaves — adding and removing seats mid-activity is disorienting. */ --shareplay-max-spatial-personas: 5; /* @kind other */ --shareplay-seat-min-distance: 1m; /* @kind other */ /* ---- Virtual game controls (game-controls.md) — VERIFIED, September 2026 ---- Games get a SECOND, smaller target tier that no other context allows: frequently used virtual controls hold the usual 44x44 floor, but less important ones such as menus may go down to 28x28. Do not generalise the 28pt figure outside game overlays — it exists because a game's secondary controls are deliberately de-emphasised and rarely hit mid-play. Layout convention players already expect: movement on the LEFT half, camera on the RIGHT half, each using as large an input area as possible. Prefer a thumbstick that appears wherever the thumb lands over a fixed one, and direct-touch panning over a camera thumbstick. Keep buttons clear of the Home indicator and Dynamic Island, and clear of the circular regions reserved for movement and camera. */ --target-game-control-primary: 44px; /* @kind other */ --target-game-control-secondary: 28px; /* menus and similar @kind other */ /* ---- Per-platform button size ladder (designing-for-games.md) — VERIFIED ---- Apple publishes a DEFAULT and a MINIMUM per platform here, and the pair is more useful than the single 44x44 figure quoted elsewhere. Two things to notice: macOS defaults to 28x28 — smaller than the iOS MINIMUM — because a pointer is precise in a way a fingertip is not. And tvOS has by far the highest floor (56pt) despite nobody touching the screen: focus-driven targets must be legible and distinguishable from ten feet. The minimum is a floor for secondary controls, not a licence to shrink primary ones. Primary actions should sit at the default. */ --target-default-ios: 44px; --target-min-ios: 28px; /* @kind other */ --target-default-macos: 28px; --target-min-macos: 20px; /* @kind other */ --target-default-tvos: 66px; --target-min-tvos: 56px; /* @kind other */ --target-default-visionos: 60px; --target-min-visionos: 28px; /* @kind other */ --target-default-watchos: 44px; --target-min-watchos-button: 28px; /* @kind other */ }