diff --git a/locales/cs-CZ.yml b/locales/cs-CZ.yml
index f7df0629fedb..9feb93e90fb5 100644
--- a/locales/cs-CZ.yml
+++ b/locales/cs-CZ.yml
@@ -172,8 +172,6 @@ common:
     deck-column-width-normal: "Normální"
     deck-column-width-wider: "Poněkud široké"
     deck-column-width-wide: "Široké"
-    use-shadow: "Používat v rozhraní stíny"
-    rounded-corners: "Zakulatit rohy v rozhraní"
     circle-icons: "Používat kulaté ikony"
     contrasted-acct: "Přidat uživatelskému účtu kontrast"
     wallpaper: "Obrázek na pozadí"
diff --git a/locales/en-US.yml b/locales/en-US.yml
index 86612bcac1a5..d958b3ef1011 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -217,8 +217,6 @@ common:
     deck-column-width-normal: "Regular"
     deck-column-width-wider: "Slightly wide"
     deck-column-width-wide: "Wide"
-    use-shadow: "Use shadows in the UI"
-    rounded-corners: "Round the corners of the UI"
     circle-icons: "Use circular icons"
     contrasted-acct: "Add contrast to user account"
     wallpaper: "Background image"
diff --git a/locales/es-ES.yml b/locales/es-ES.yml
index c2352ea332c5..1cd0db93d295 100644
--- a/locales/es-ES.yml
+++ b/locales/es-ES.yml
@@ -121,8 +121,6 @@ common:
     deck-column-width-normal: "Normal"
     deck-column-width-wider: "Un poco ancho"
     deck-column-width-wide: "Ancho"
-    use-shadow: "Usar sombras en la Interfaz de Usuario"
-    rounded-corners: "Esquinas redondeadas en la Interfaz de Usuario"
     circle-icons: "Usar iconos circulares"
     contrasted-acct: "Añadir contraste al nombre de usuario"
     wallpaper: "Fondo de pantalla"
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 8e4e185ae0d7..0484c84214a7 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -228,8 +228,6 @@ common:
     deck-column-width-normal: "普通"
     deck-column-width-wider: "やや広"
     deck-column-width-wide: "広"
-    use-shadow: "UIに影を使用"
-    rounded-corners: "UIの角を丸める"
     circle-icons: "円形のアイコンを使用"
     contrasted-acct: "ユーザー名にコントラストを付ける"
     wallpaper: "壁紙"
diff --git a/locales/ko-KR.yml b/locales/ko-KR.yml
index 58ad77190aba..335763cd29b2 100644
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@@ -172,8 +172,6 @@ common:
     deck-column-width-normal: "보통"
     deck-column-width-wider: "조금 넓음"
     deck-column-width-wide: "넓음"
-    use-shadow: "UI에 그림자 효과 적용"
-    rounded-corners: "UI의 모서리를 둥글게 설정"
     circle-icons: "원형 아이콘 사용"
     contrasted-acct: "사용자명에 대비 추가"
     wallpaper: "배경"
diff --git a/locales/zh-CN.yml b/locales/zh-CN.yml
index ff794fc782ab..72f60454e249 100644
--- a/locales/zh-CN.yml
+++ b/locales/zh-CN.yml
@@ -172,8 +172,6 @@ common:
     deck-column-width-normal: "普通"
     deck-column-width-wider: "很宽"
     deck-column-width-wide: "宽"
-    use-shadow: "在UI中使用阴影效果"
-    rounded-corners: "UI界面圆角效果"
     circle-icons: "使用圆形图标"
     contrasted-acct: "增加用户名的对比度"
     wallpaper: "壁纸"
diff --git a/src/client/app/common/views/components/page/page.vue b/src/client/app/common/views/components/page/page.vue
index 015def071763..4b07aceb14de 100644
--- a/src/client/app/common/views/components/page/page.vue
+++ b/src/client/app/common/views/components/page/page.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="iroscrza" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners, center: page.alignCenter, serif: page.font === 'serif' }">
+<div class="iroscrza" :class="{ center: page.alignCenter, serif: page.font === 'serif' }">
 	<header v-if="showTitle">
 		<div class="title">{{ page.title }}</div>
 	</header>
@@ -137,7 +137,9 @@ export default Vue.extend({
 .iroscrza
 	overflow hidden
 	background var(--face)
-	
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+
 	&.serif
 		> div
 			font-family serif
@@ -145,12 +147,6 @@ export default Vue.extend({
 	&.center
 		text-align center
 
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
-
 	> header
 		> .title
 			z-index 1
diff --git a/src/client/app/common/views/components/settings/settings.vue b/src/client/app/common/views/components/settings/settings.vue
index 8d521235bfc9..eeb44eb24fa7 100644
--- a/src/client/app/common/views/components/settings/settings.vue
+++ b/src/client/app/common/views/components/settings/settings.vue
@@ -32,8 +32,6 @@
 				<ui-radio v-model="navbar" value="right">{{ $t('@._settings.navbar-position-right') }}</ui-radio>
 			</section>
 			<section>
-				<ui-switch v-model="useShadow" v-if="isAdvanced">{{ $t('@._settings.use-shadow') }}</ui-switch>
-				<ui-switch v-model="roundedCorners" v-if="isAdvanced">{{ $t('@._settings.rounded-corners') }}</ui-switch>
 				<ui-switch v-model="circleIcons">{{ $t('@._settings.circle-icons') }}</ui-switch>
 				<ui-switch v-model="reduceMotion">{{ $t('@._settings.reduce-motion') }}</ui-switch>
 				<ui-switch v-model="contrastedAcct" v-if="isAdvanced">{{ $t('@._settings.contrasted-acct') }}</ui-switch>
@@ -474,16 +472,6 @@ export default Vue.extend({
 			set(value) { this.$store.dispatch('settings/set', { key: 'disableViaMobile', value }); }
 		},
 
-		useShadow: {
-			get() { return this.$store.state.device.useShadow; },
-			set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); }
-		},
-
-		roundedCorners: {
-			get() { return this.$store.state.device.roundedCorners; },
-			set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); }
-		},
-
 		lineWidth: {
 			get() { return this.$store.state.device.lineWidth; },
 			set(value) { this.$store.commit('device/set', { key: 'lineWidth', value }); }
diff --git a/src/client/app/common/views/components/ui/card.vue b/src/client/app/common/views/components/ui/card.vue
index a83013f5d010..770fa6fa360d 100644
--- a/src/client/app/common/views/components/ui/card.vue
+++ b/src/client/app/common/views/components/ui/card.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="ui-card" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="ui-card">
 	<header>
 		<slot name="title"></slot>
 	</header>
@@ -25,12 +25,8 @@ export default Vue.extend({
 	max-width 850px
 	color var(--faceText)
 	background var(--face)
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
+	border-radius 6px
+	box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
 
 	> header
 		padding 16px
diff --git a/src/client/app/common/views/deck/deck.column.vue b/src/client/app/common/views/deck/deck.column.vue
index ffa16753ea6e..2c3b0519fb48 100644
--- a/src/client/app/common/views/deck/deck.column.vue
+++ b/src/client/app/common/views/deck/deck.column.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="dnpfarvgbnfmyzbdquhhzyxcmstpdqzs" :class="{ naked, narrow, active, isStacked, draghover, dragging, dropready, isMobile: $root.isMobile, shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }"
+<div class="dnpfarvgbnfmyzbdquhhzyxcmstpdqzs" :class="{ naked, narrow, active, isStacked, draghover, dragging, dropready, isMobile: $root.isMobile }"
 		@dragover.prevent.stop="onDragover"
 		@dragleave="onDragleave"
 		@drop.prevent.stop="onDrop"
@@ -323,12 +323,8 @@ export default Vue.extend({
 	height 100%
 	background var(--face)
 	overflow hidden
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	&.draghover
 		box-shadow 0 0 0 2px var(--primaryAlpha08)
diff --git a/src/client/app/common/views/pages/page-editor/page-editor.vue b/src/client/app/common/views/pages/page-editor/page-editor.vue
index 695690be4ff3..9d974047c6d0 100644
--- a/src/client/app/common/views/pages/page-editor/page-editor.vue
+++ b/src/client/app/common/views/pages/page-editor/page-editor.vue
@@ -1,6 +1,6 @@
 <template>
 <div>
-	<div class="gwbmwxkm" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+	<div class="gwbmwxkm">
 		<header>
 			<div class="title"><fa :icon="faStickyNote"/> {{ readonly ? $t('read-page') : pageId ? $t('edit-page') : $t('new-page') }}</div>
 			<div class="buttons">
@@ -429,12 +429,8 @@ export default Vue.extend({
 	overflow hidden
 	background var(--face)
 	margin-bottom 16px
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	> header
 		background var(--faceHeader)
diff --git a/src/client/app/desktop/views/components/calendar.vue b/src/client/app/desktop/views/components/calendar.vue
index cdeac51638d6..b0a4cfaa25eb 100644
--- a/src/client/app/desktop/views/components/calendar.vue
+++ b/src/client/app/desktop/views/components/calendar.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="mk-calendar" :data-melt="design == 4 || design == 5" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="mk-calendar" :data-melt="design == 4 || design == 5">
 	<template v-if="design == 0 || design == 1">
 		<button @click="prev" :title="$t('prev')"><fa icon="chevron-circle-left"/></button>
 		<p class="title">{{ $t('title', { year, month }) }}</p>
@@ -134,12 +134,8 @@ export default Vue.extend({
 	color var(--calendarDay)
 	background var(--face)
 	overflow hidden
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	&[data-melt]
 		background transparent !important
diff --git a/src/client/app/desktop/views/components/note-detail.vue b/src/client/app/desktop/views/components/note-detail.vue
index 3ec41f236ab0..436ca9f16a39 100644
--- a/src/client/app/desktop/views/components/note-detail.vue
+++ b/src/client/app/desktop/views/components/note-detail.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="mk-note-detail" :title="title" tabindex="-1" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="mk-note-detail" :title="title" tabindex="-1">
 	<button
 		class="read-more"
 		v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
@@ -162,15 +162,8 @@ export default Vue.extend({
 	overflow hidden
 	text-align left
 	background var(--face)
-
-	&.round
-		border-radius 6px
-
-		> .read-more
-			border-radius 6px 6px 0 0
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	> .read-more
 		display block
@@ -185,6 +178,7 @@ export default Vue.extend({
 		outline none
 		border none
 		border-bottom solid 1px var(--faceDivider)
+		border-radius 6px 6px 0 0
 
 		&:hover
 			box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.05)
diff --git a/src/client/app/desktop/views/components/notes.vue b/src/client/app/desktop/views/components/notes.vue
index 7f24a5945a8e..ba24006abaff 100644
--- a/src/client/app/desktop/views/components/notes.vue
+++ b/src/client/app/desktop/views/components/notes.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="mk-notes" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="mk-notes">
 	<slot name="header"></slot>
 
 	<div class="newer-indicator" :style="{ top: $store.state.uiHeaderHeight + 'px' }" v-show="queue.length > 0"></div>
@@ -230,12 +230,8 @@ export default Vue.extend({
 .mk-notes
 	background var(--face)
 	overflow hidden
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	.transition
 		.mk-notes-enter
diff --git a/src/client/app/desktop/views/components/ui-container.vue b/src/client/app/desktop/views/components/ui-container.vue
index 1fbe09951042..294f7707a967 100644
--- a/src/client/app/desktop/views/components/ui-container.vue
+++ b/src/client/app/desktop/views/components/ui-container.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="kedshtep" :class="{ naked, inNakedDeckColumn, shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="kedshtep" :class="{ naked, inNakedDeckColumn }">
 	<header v-if="showHeader" :class="{ bodyTogglable }" @click="toggleContent(!showBody)">
 		<div class="title"><slot name="header"></slot></div>
 		<slot name="func"></slot>
@@ -61,12 +61,8 @@ export default Vue.extend({
 
 	&:not(.inNakedDeckColumn)
 		background var(--face)
-
-		&.round
-			border-radius 6px
-
-		&.shadow
-			box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+		border-radius 6px
+		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 		& + .kedshtep
 			margin-top 16px
diff --git a/src/client/app/desktop/views/components/ui.header.vue b/src/client/app/desktop/views/components/ui.header.vue
index 14a732155224..017984538ede 100644
--- a/src/client/app/desktop/views/components/ui.header.vue
+++ b/src/client/app/desktop/views/components/ui.header.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="header" :style="style">
+<div class="header" :style="{'box-shadow': '0 0px 8px rgba(0, 0, 0, 0.2)'}">
 	<p class="warn" v-if="env != 'production'">{{ $t('@.do-not-use-in-production') }} <a href="/assets/flush.html?force">Flush</a></p>
 	<div class="main" ref="main">
 		<div class="backdrop"></div>
@@ -58,14 +58,6 @@ export default Vue.extend({
 		};
 	},
 
-	computed: {
-		style(): any {
-			return {
-				'box-shadow': this.$store.state.device.useShadow ? '0 0px 8px rgba(0, 0, 0, 0.2)' : 'none'
-			};
-		}
-	},
-
 	mounted() {
 		this.$store.commit('setUiHeaderHeight', this.$el.offsetHeight);
 	},
diff --git a/src/client/app/desktop/views/components/ui.sidebar.vue b/src/client/app/desktop/views/components/ui.sidebar.vue
index 6ad83261ad42..f8f0813d3066 100644
--- a/src/client/app/desktop/views/components/ui.sidebar.vue
+++ b/src/client/app/desktop/views/components/ui.sidebar.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="header" :class="navbar" :data-shadow="$store.state.device.useShadow">
+<div class="header" :class="navbar">
 	<div class="body">
 		<div class="post">
 			<button @click="post" :title="$t('title')"><fa icon="pencil-alt"/></button>
@@ -62,7 +62,7 @@
 	</div>
 
 	<transition :name="`slide-${navbar}`">
-		<div class="notifications" v-if="showNotifications" ref="notifications" :class="navbar" :data-shadow="$store.state.device.useShadow">
+		<div class="notifications" v-if="showNotifications" ref="notifications" :class="navbar">
 			<mk-notifications/>
 		</div>
 	</transition>
@@ -223,15 +223,11 @@ export default Vue.extend({
 
 	&.left
 		left 0
-
-		&[data-shadow]
-			box-shadow 4px 0 4px rgba(0, 0, 0, 0.1)
+		box-shadow 4px 0 4px rgba(0, 0, 0, 0.1)
 
 	&.right
 		right 0
-
-		&[data-shadow]
-			box-shadow -4px 0 4px rgba(0, 0, 0, 0.1)
+		box-shadow -4px 0 4px rgba(0, 0, 0, 0.1)
 
 	> .body
 		position fixed
@@ -303,15 +299,11 @@ export default Vue.extend({
 
 		&.left
 			left $width
-
-			&[data-shadow]
-				box-shadow 4px 0 4px rgba(0, 0, 0, 0.1)
+			box-shadow 4px 0 4px rgba(0, 0, 0, 0.1)
 
 		&.right
 			right $width
-
-			&[data-shadow]
-				box-shadow -4px 0 4px rgba(0, 0, 0, 0.1)
+			box-shadow -4px 0 4px rgba(0, 0, 0, 0.1)
 
 	.nav
 		> *
diff --git a/src/client/app/desktop/views/home/timeline.vue b/src/client/app/desktop/views/home/timeline.vue
index b1cc497e3883..be033d6d8a9c 100644
--- a/src/client/app/desktop/views/home/timeline.vue
+++ b/src/client/app/desktop/views/home/timeline.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="pwbzawku">
-	<mk-post-form class="form" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }" v-if="$store.state.settings.showPostFormOnTopOfTl"/>
+	<mk-post-form class="form" v-if="$store.state.settings.showPostFormOnTopOfTl"/>
 	<div class="main">
 		<component :is="src == 'list' ? 'mk-user-list-timeline' : 'x-core'" ref="tl" v-bind="options">
 			<header class="zahtxcqi">
@@ -195,12 +195,8 @@ export default Vue.extend({
 .pwbzawku
 	> .form
 		margin-bottom 16px
-
-		&.round
-			border-radius 6px
-
-		&.shadow
-			box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+		border-radius 6px
+		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	.zahtxcqi
 		display flex
diff --git a/src/client/app/desktop/views/home/user/index.vue b/src/client/app/desktop/views/home/user/index.vue
index e9c4db5a5c81..5a228c00a6c2 100644
--- a/src/client/app/desktop/views/home/user/index.vue
+++ b/src/client/app/desktop/views/home/user/index.vue
@@ -1,12 +1,12 @@
 <template>
 <div class="omechnps" v-if="!fetching && user">
-	<div class="is-suspended" v-if="user.isSuspended" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+	<div class="is-suspended" v-if="user.isSuspended">
 		<fa icon="exclamation-triangle"/> {{ $t('@.user-suspended') }}
 	</div>
-	<div class="is-remote" v-if="user.host != null" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+	<div class="is-remote" v-if="user.host != null">
 		<fa icon="exclamation-triangle"/> {{ $t('@.is-remote-user') }}<a :href="user.url || user.uri" rel="nofollow noopener" target="_blank">{{ $t('@.view-on-remote') }}</a>
 	</div>
-	<div class="no-federation" v-if="user.noFederation" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+	<div class="no-federation" v-if="user.noFederation">
 		<fa icon="exclamation-triangle"/> {{ $t('@.user-no-federation') }}
 	</div>
 	<div class="main">
@@ -72,12 +72,8 @@ export default Vue.extend({
 		margin-bottom 16px
 		padding 14px 16px
 		font-size 14px
-
-		&.round
-			border-radius 6px
-
-		&.shadow
-			box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+		border-radius 6px
+		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 		&.is-suspended
 			color var(--suspendedInfoFg)
diff --git a/src/client/app/desktop/views/home/user/user.header.vue b/src/client/app/desktop/views/home/user/user.header.vue
index 1d03c7a64bb4..f20503fb6b57 100644
--- a/src/client/app/desktop/views/home/user/user.header.vue
+++ b/src/client/app/desktop/views/home/user/user.header.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="header" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="header">
 	<div class="banner-container" :style="style">
 		<div class="banner" ref="banner" :style="style"></div>
 		<div class="fade"></div>
@@ -136,12 +136,8 @@ export default Vue.extend({
 .header
 	background var(--face)
 	overflow hidden
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+	border-radius 6px
+	box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
 
 	> .banner-container
 		height 250px
diff --git a/src/client/app/mobile/views/components/note-detail.vue b/src/client/app/mobile/views/components/note-detail.vue
index b0c02309005e..14264e2c3448 100644
--- a/src/client/app/mobile/views/components/note-detail.vue
+++ b/src/client/app/mobile/views/components/note-detail.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="mk-note-detail" tabindex="-1" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="mk-note-detail" tabindex="-1">
 	<button
 		class="more"
 		v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
@@ -168,12 +168,8 @@ export default Vue.extend({
 	width 100%
 	text-align left
 	background var(--face)
-
-	&.round
-		border-radius 8px
-
-	&.shadow
-		box-shadow 0 4px 16px rgba(#000, 0.1)
+	border-radius 8px
+	box-shadow 0 4px 16px rgba(#000, 0.1)
 
 		@media (min-width 500px)
 			box-shadow 0 8px 32px rgba(#000, 0.1)
diff --git a/src/client/app/mobile/views/components/notes.vue b/src/client/app/mobile/views/components/notes.vue
index f0c8b25a9f54..69d18933799d 100644
--- a/src/client/app/mobile/views/components/notes.vue
+++ b/src/client/app/mobile/views/components/notes.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="ivaojijs" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="ivaojijs">
 	<div class="empty" v-if="notes.length == 0 && !fetching && inited">{{ $t('@.no-notes') }}</div>
 
 	<mk-error v-if="!fetching && !inited" @retry="init()"/>
@@ -253,12 +253,8 @@ export default Vue.extend({
 .ivaojijs
 	overflow hidden
 	background var(--face)
-
-	&.round
-		border-radius 8px
-
-	&.shadow
-		box-shadow 0 4px 16px rgba(#000, 0.1)
+	border-radius 8px
+	box-shadow 0 4px 16px rgba(#000, 0.1)
 
 		@media (min-width 500px)
 			box-shadow 0 8px 32px rgba(#000, 0.1)
diff --git a/src/client/app/mobile/views/components/ui-container.vue b/src/client/app/mobile/views/components/ui-container.vue
index 08af7035f9e3..5bd74a340475 100644
--- a/src/client/app/mobile/views/components/ui-container.vue
+++ b/src/client/app/mobile/views/components/ui-container.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="ukygtjoj" :class="{ naked, inNakedDeckColumn, hideHeader: !showHeader, shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+<div class="ukygtjoj" :class="{ naked, inNakedDeckColumn, hideHeader: !showHeader }">
 	<header v-if="showHeader" @click="() => showBody = !showBody">
 		<div class="title"><slot name="header"></slot></div>
 		<slot name="func"></slot>
@@ -60,12 +60,8 @@ export default Vue.extend({
 
 	&:not(.inNakedDeckColumn)
 		background var(--face)
-
-		&.round
-			border-radius 8px
-
-		&.shadow
-			box-shadow 0 4px 16px rgba(#000, 0.1)
+		border-radius 8px
+		box-shadow 0 4px 16px rgba(#000, 0.1)
 
 		& + .ukygtjoj
 			margin-top 16px
diff --git a/src/client/app/mobile/views/components/ui.header.vue b/src/client/app/mobile/views/components/ui.header.vue
index cbe43ff3aa02..cdc8aa844a3f 100644
--- a/src/client/app/mobile/views/components/ui.header.vue
+++ b/src/client/app/mobile/views/components/ui.header.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="header" ref="root" :class="{ shadow: $store.state.device.useShadow }">
+<div class="header" ref="root">
 	<div class="main" ref="main">
 		<div class="backdrop"></div>
 		<div class="content" ref="mainContainer">
@@ -46,9 +46,7 @@ export default Vue.extend({
 	z-index 1024
 	width calc(100% + 16px)
 	padding 0 8px
-
-	&.shadow
-		box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
+	box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
 
 	&, *
 		user-select none
diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue
index 5010c7802007..3e58c7612374 100644
--- a/src/client/app/mobile/views/pages/settings.vue
+++ b/src/client/app/mobile/views/pages/settings.vue
@@ -2,13 +2,13 @@
 <mk-ui>
 	<template #header><span style="margin-right:4px;"><fa icon="cog"/></span>{{ $t('@.settings') }}</template>
 	<main>
-		<div class="signed-in-as" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }">
+		<div class="signed-in-as">
 			<mfm :text="$t('signed-in-as').replace('{}', name)" :plain="true" :custom-emojis="$store.state.i.emojis"/>
 		</div>
 
 		<x-settings/>
 
-		<div class="signout" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners }" @click="signout">{{ $t('@.signout') }}</div>
+		<div class="signout" @click="signout">{{ $t('@.signout') }}</div>
 
 		<footer>
 			<small>ver {{ version }} ({{ codename }})</small>
@@ -60,12 +60,8 @@ main
 		color var(--mobileSignedInAsFg)
 		background var(--mobileSignedInAsBg)
 		font-weight bold
-
-		&.round
-			border-radius 6px
-
-		&.shadow
-			box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
+		border-radius 6px
+		box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
 
 	> .signout
 		margin 16px
@@ -73,12 +69,8 @@ main
 		text-align center
 		color var(--mobileSignedInAsFg)
 		background var(--mobileSignedInAsBg)
-
-		&.round
-			border-radius 6px
-
-		&.shadow
-			box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
+		border-radius 6px
+		box-shadow 0 3px 1px -2px rgba(#000, 0.2), 0 2px 2px 0 rgba(#000, 0.14), 0 1px 5px 0 rgba(#000, 0.12)
 
 	> footer
 		margin 16px
diff --git a/src/client/app/mobile/views/pages/user/index.vue b/src/client/app/mobile/views/pages/user/index.vue
index 7dd819a90237..1b6455415b86 100644
--- a/src/client/app/mobile/views/pages/user/index.vue
+++ b/src/client/app/mobile/views/pages/user/index.vue
@@ -61,7 +61,7 @@
 				</div>
 			</div>
 		</header>
-		<nav v-if="$route.name == 'user'" :class="{ shadow: $store.state.device.useShadow }">
+		<nav v-if="$route.name == 'user'">
 			<div class="nav-container">
 				<a :data-active="page == 'home'" @click="page = 'home'"><fa icon="home"/> {{ $t('overview') }}</a>
 				<a :data-active="page == 'notes'" @click="page = 'notes'"><fa :icon="['far', 'comment-alt']"/> {{ $t('timeline') }}</a>
@@ -323,9 +323,7 @@ export default Vue.extend({
 		top 47px
 		background-color $bg
 		z-index 2
-
-		&.shadow
-			box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
+		box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
 
 		> .nav-container
 			display flex
diff --git a/src/client/app/store.ts b/src/client/app/store.ts
index 8119032bf5d6..9ed0d69cdd4f 100644
--- a/src/client/app/store.ts
+++ b/src/client/app/store.ts
@@ -50,7 +50,6 @@ const defaultDeviceSettings = Object.assign({
 	deckMode: false,
 	deckColumnAlign: 'center',
 	deckColumnWidth: 'normal',
-	useShadow: false,
 	roundedCorners: true,
 	reduceMotion: false,
 	darkmode: false,