/*
Theme Name: Flomo Memo
Theme URI: https://example.com/flomo-memo
Author: Flomo Memo
Author URI: https://example.com
Description: A clean, fast and minimal note-taking WordPress theme inspired by FlowMemo. Provides a distraction-free writing experience with a GitHub-like activity heatmap, tag cloud and quick memo posting from the front-end.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flomo-memo
Domain Path: /languages
Tags: blog, custom-background, custom-logo, custom-menu, editor-style, featured-images, threaded-comments, translation-ready, responsive-layout
*/

/* 仅在此文件中提供主题元信息；样式由 css/base.css 与 css/styles.css 提供 */

.app-main{
	-ms-overflow-style:none;
	scrollbar-width:none;
}
.app-main::-webkit-scrollbar{
	width:0;
	height:0;
}

#site-preloader{
	position:fixed;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
	background:rgba(247,247,247,.78);
	-webkit-backdrop-filter:blur(12px);
	backdrop-filter:blur(12px);
	color:var(--color-foreground,#222);
	z-index:9999;
	transition:opacity .38s ease,visibility 0s linear .38s;
	opacity:1;
	visibility:visible;
}
#site-preloader.hidden{
	opacity:0;
	visibility:hidden;
	pointer-events:none;
}
#site-preloader[hidden]{
	display:none;
}
body.preloader-lock{
	overflow:hidden;
}
#site-preloader .preloader-content{
	text-align:center;
}
#site-preloader .preloader-text{
	font-size:.85rem;
	color:var(--color-foreground,#222);
}
#site-preloader .progress{
	height:2px;
	border-radius:999px;
	background:#dcdde1;
	overflow:hidden;
	margin:.65rem auto 0;
	width:min(160px,40vw);
}
#site-preloader .progress .bar{
	height:100%;
	width:0%;
	background:#000000;
	transition:width .2s ease;
}
#site-preloader .progress.indeterminate{
	position:relative;
}
#site-preloader .progress.indeterminate .bar{
	width:30%;
	background:#000000;
	animation:preloader-indeterminate 1.2s ease-in-out infinite;
}
@keyframes preloader-indeterminate{
	0%{transform:translateX(-40%)}
	50%{transform:translateX(30%)}
	100%{transform:translateX(110%)}
}
#site-preloader .skip-button{
	margin-top:.75rem;
	border:1px solid var(--color-border,#ddd);
	background:transparent;
	color:var(--color-foreground,#222);
	border-radius:10px;
	padding:.4rem .75rem;
	cursor:pointer;
}
#site-preloader .skip-button:hover{
	background:var(--color-hover,#f5f5f5);
}
@media (prefers-reduced-motion: reduce){
	#site-preloader{
		transition:none;
		animation:none;
		opacity:1;
	}
	#site-preloader .progress .bar{
		transition:none;
	}
}

.app-topbar{
	position:-webkit-sticky;
	position:sticky;
	top:0;
	z-index:60;
	padding-top:env(safe-area-inset-top);
}
.composer-emoji-popover{
	position:fixed !important;
	z-index:9500 !important;
}
.app-topbar > .min-w-0 > .floating-menu-root{
	display:flex;
	align-items:center;
	gap:8px;
	position:relative;
}
.title-sort-trigger{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:32px;
	width:32px;
	border:0;
	border-radius:8px;
	background:transparent;
	color:#9a9a9a;
	transition:background-color .15s ease,color .15s ease,transform .15s ease;
}
.topbar-login-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	align-self:center;
	width:38px;
	height:38px;
	padding:0;
	aspect-ratio:1 / 1;
	flex:0 0 38px;
	border:1px solid #e6e6e6;
	border-radius:10px;
	background:#fff;
	color:#3f3f3f;
	text-decoration:none;
	vertical-align:middle;
	transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;
}
.topbar-login-button img{
	width:18px;
	height:18px;
	display:block;
}
.topbar-login-button:has(.topbar-account-avatar){
	overflow:hidden;
	padding:0;
	background:transparent;
}
.topbar-account-avatar{
	width:100% !important;
	height:100% !important;
	min-width:100%;
	min-height:100%;
	border-radius:10px;
	display:block;
	object-fit:cover;
}
.topbar-account-menu{
	position:relative;
	display:flex;
	align-items:center;
}
.topbar-account-panel{
	position:absolute;
	top:calc(100% + 8px);
	right:0;
	min-width:120px;
	width:max-content;
	z-index:80;
}
.topbar-account-panel .floating-menu-item{
	display:flex;
	align-items:center;
	min-width:120px;
	padding:9px 12px;
	white-space:nowrap;
	text-decoration:none;
}
.topbar-account-panel .floating-menu-copy{
	display:block;
	flex:0 0 auto;
	min-width:max-content;
}
.topbar-account-panel .floating-menu-label{
	display:block;
	white-space:nowrap;
}
.topbar-login-button:hover,
.topbar-login-button:focus-visible{
	background:#f7f7f7;
	border-color:#dddddd;
	color:#222;
	outline:none;
}
.topbar-login-button:has(.topbar-account-avatar):hover,
.topbar-login-button:has(.topbar-account-avatar):focus-visible{
	background:transparent;
	border-color:#dddddd;
}
.topbar-login-button:active{
	transform:scale(.98);
}
.login-popover{
	position:fixed;
	inset:0;
	z-index:9800;
	pointer-events:none;
	opacity:0;
	transition:opacity .18s ease;
}
.login-popover[hidden]{
	display:none;
}
.login-popover[data-state]{
	pointer-events:auto;
}
.login-popover[data-state="open"]{
	opacity:1;
}
.login-popover-backdrop{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.08);
	backdrop-filter:blur(6px);
	-webkit-backdrop-filter:blur(6px);
}
.login-popover-panel{
	position:absolute;
	top:50%;
	left:50%;
	width:min(260px, calc(100vw - 32px));
	border:1px solid #e9e9e9;
	border-radius:12px;
	background:rgba(255,255,255,.94);
	box-shadow:0 20px 48px rgba(0,0,0,.12);
	padding:12px;
	transform:translate(-50%, -50%) scale(.94);
	opacity:0;
	transition:transform .18s ease,opacity .18s ease;
	backdrop-filter:blur(18px);
	-webkit-backdrop-filter:blur(18px);
}
.login-popover[data-state="open"] .login-popover-panel{
	transform:translate(-50%, -50%) scale(1);
	opacity:1;
}
.login-popover-close{
	position:absolute;
	top:10px;
	right:10px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	border:0;
	border-radius:8px;
	background:transparent;
	color:#8f8f8f;
	transition:background-color .15s ease,color .15s ease,transform .15s ease;
}
.login-popover-close:hover,
.login-popover-close:focus-visible{
	background:#f1f1f1;
	color:#3f3f3f;
	outline:none;
}
.login-popover-close:active{
	transform:scale(.98);
}
.login-popover-title{
	margin-bottom:12px;
	color:#2f2f2f;
	font-size:14px;
	font-weight:650;
}
.login-popover-panel .login-username,
.login-popover-panel .login-password{
	margin:0 0 10px;
}
.login-popover-panel label{
	display:block;
	margin-bottom:6px;
	color:#6f6f6f;
	font-size:12px;
}
.login-popover-form .login-username label,
.login-popover-form .login-password label{
	display:none;
}
.login-popover-panel input[type="text"],
.login-popover-panel input[type="password"]{
	width:100%;
	height:38px;
	border:1px solid #e6e6e6;
	border-radius:10px;
	background:#fff;
	padding:0 12px;
	color:#2f2f2f;
	font-size:14px;
	outline:none;
	transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease;
}
.login-popover-panel input[type="text"]:focus,
.login-popover-panel input[type="password"]:focus{
	border-color:#10b981;
	box-shadow:0 0 0 2px rgba(16,185,129,.12);
}
.login-popover-panel .login-remember{
	display:flex;
	align-items:center;
	margin:0 0 12px;
}
.login-popover-panel .login-remember label{
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin:0;
	padding:0;
	color:#5f5f5f;
	font-size:13px;
	line-height:1;
	cursor:pointer;
	user-select:none;
}
.login-popover-panel .login-remember input[type="checkbox"]{
	appearance:none;
	-webkit-appearance:none;
	width:15px;
	height:15px;
	margin:0;
	border:1px solid #d9d9d9;
	border-radius:4px;
	background:#fff;
	display:inline-grid;
	place-items:center;
	transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.login-popover-panel .login-remember input[type="checkbox"]::after{
	content:"";
	width:8px;
	height:8px;
	border-radius:2px;
	background:#fff;
	transform:scale(0);
	transition:transform .14s ease;
}
.login-popover-panel .login-remember input[type="checkbox"]:checked{
	border-color:#10b981;
	background:#10b981;
}
.login-popover-panel .login-remember input[type="checkbox"]:checked::after{
	transform:scale(1);
}
.login-popover-panel .login-remember input[type="checkbox"]:focus-visible{
	outline:none;
	box-shadow:0 0 0 2px rgba(16,185,129,.14);
}
.login-popover-panel .login-remember input[type="checkbox"]:active{
	transform:scale(.96);
}
.login-popover-panel .login-submit{
	margin:0;
}
.login-popover-panel .login-submit .button{
	width:100%;
	height:38px;
	border:0;
	border-radius:10px;
	background:#111;
	color:#fff;
	font-size:14px;
	font-weight:600;
	cursor:pointer;
	transition:opacity .15s ease,transform .15s ease;
}
.login-popover-panel .login-submit .button:hover,
.login-popover-panel .login-submit .button:focus-visible{
	opacity:.92;
	outline:none;
}
.login-popover-panel .login-submit .button:active{
	transform:scale(.99);
}
@media (max-width: 640px){
	.login-popover-panel{
		width:min(260px, calc(100vw - 24px));
	}
}
.title-sort-trigger:hover,
.title-sort-trigger:focus-visible,
.title-sort-trigger[aria-expanded="true"]{
	background:#f1f1f1;
	color:#3f3f3f;
	outline:none;
}
.title-sort-trigger:active{
	transform:scale(.96);
}
.title-sort-menu{
	position:fixed;
	top:0;
	left:0;
	right:auto;
	z-index:9999;
	min-width:210px;
	border:1px solid #e9e9e9;
	border-radius:10px;
	background:#fff;
	box-shadow:0 18px 44px rgba(0,0,0,.16);
	padding:6px;
	opacity:0;
	transform:translateY(-4px);
	pointer-events:none;
	transition:opacity .14s ease,transform .14s ease;
}
.title-sort-menu[data-open="true"]{
	opacity:1;
	transform:none;
	pointer-events:auto;
}
.title-sort-item{
	position:relative;
	display:flex;
	align-items:center;
	gap:10px;
	width:100%;
	height:34px;
	padding:0 10px;
	border-radius:8px;
	color:#2f2f2f;
	font-size:13px;
	font-weight:650;
	user-select:none;
}
.title-sort-item:hover{
	background:#f6f6f6;
}
.title-sort-caret{
	margin-left:auto;
	color:#8f8f8f;
}
.title-sort-submenu{
	position:absolute;
	top:-6px;
	left:calc(100% + 8px);
	min-width:240px;
	border:1px solid #e9e9e9;
	border-radius:10px;
	background:#fff;
	box-shadow:0 18px 44px rgba(0,0,0,.16);
	padding:6px;
	opacity:0;
	transform:translateX(-4px);
	pointer-events:none;
	transition:opacity .14s ease,transform .14s ease;
}
.title-sort-item-parent:hover .title-sort-submenu,
.title-sort-item-parent:focus-within .title-sort-submenu,
.title-sort-item-parent[data-sub-open="true"] .title-sort-submenu{
	opacity:1;
	transform:none;
	pointer-events:auto;
}
.title-sort-option{
	display:flex;
	align-items:center;
	gap:10px;
	width:100%;
	height:34px;
	padding:0 10px;
	border:0;
	border-radius:8px;
	background:transparent;
	color:#2f2f2f;
	font-size:13px;
	font-weight:600;
	text-align:left;
	cursor:pointer;
}
.title-sort-option:hover,
.title-sort-option:focus-visible{
	background:#f6f6f6;
	outline:none;
}
.title-sort-option[aria-checked="true"]{
	color:#1f7a4a;
}
.title-sort-option[aria-checked="true"]::after{
	content:"";
	margin-left:auto;
	width:16px;
	height:16px;
	background:currentColor;
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
	opacity:.9;
}

@media (max-width: 640px){
	.title-sort-submenu{
		top:calc(100% + 8px);
		left:auto;
		right:0;
		transform:translateY(-4px);
	}
	.title-sort-item-parent:hover .title-sort-submenu,
	.title-sort-item-parent:focus-within .title-sort-submenu{
		transform:none;
	}
}

@media (prefers-color-scheme: dark){
	.title-sort-trigger:hover,
	.title-sort-trigger:focus-visible,
	.title-sort-trigger[aria-expanded="true"]{
		background:rgba(255,255,255,.08);
		color:rgba(255,255,255,.9);
	}
	.title-sort-menu,
	.title-sort-submenu{
		background:#151515;
		border-color:rgba(255,255,255,.10);
		box-shadow:0 18px 44px rgba(0,0,0,.55);
	}
	.title-sort-item,
	.title-sort-option{
		color:rgba(255,255,255,.88);
	}
	.title-sort-item:hover,
	.title-sort-option:hover,
	.title-sort-option:focus-visible{
		background:rgba(255,255,255,.06);
	}
	.title-sort-caret{
		color:rgba(255,255,255,.45);
	}
}

@media (prefers-reduced-motion: reduce){
	.title-sort-trigger,
	.title-sort-menu,
	.title-sort-submenu{
		transition:none;
	}
}

@media (max-width: 640px){
	.app-main{
		padding-top:0 !important;
	}
	.app-topbar{
		display:grid;
		grid-template-columns:40px 1fr 40px;
		align-items:center;
		column-gap:6px;
		height:calc(env(safe-area-inset-top) + 58px);
		padding-top:env(safe-area-inset-top);
		padding-bottom:0;
		padding-left:8px;
		padding-right:8px;
		margin-top:0 !important;
	}
	.app-topbar > .min-w-0{
		min-width:0;
	}
	.app-topbar > button.lg\\:hidden{
		grid-column:1;
		justify-self:start;
		height:32px;
		width:32px;
	}
	.app-topbar > .min-w-0{
		grid-column:2;
		justify-self:start;
	}
	.app-topbar > .ml-auto{
		grid-column:3;
		justify-self:end;
		margin-left:0 !important;
	}
	.app-topbar > .min-w-0 > .floating-menu-root{
		margin-left:0;
		margin-right:auto;
		gap:4px;
	}
	.app-topbar .title-menu-trigger{
		height:30px;
		padding:0 6px;
		border-radius:10px;
		max-width:min(260px,70vw);
	}
	.app-topbar .title-menu-trigger .truncate{
		font-size:14px;
		line-height:1.15;
	}
	.app-topbar .title-sort-trigger{
		height:28px;
		width:28px;
		border-radius:9px;
	}
}

@media (max-width: 1023px){
	.mobile-sidebar-backdrop{
		z-index:170 !important;
	}
	.mobile-sidebar{
		z-index:180 !important;
	}
}
.desktop-sidebar .app-sidebar{
	padding-left:16px !important;
	padding-right:16px !important;
}
.mobile-sidebar .app-sidebar{
	padding-left:20px !important;
	padding-right:20px !important;
}
.profile-panel .profile-menu{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	width:100%;
}
.profile-panel .profile-menu-trigger{
	flex:1;
	min-width:0;
}
.profile-panel .profile-stats{
	padding-left:4px;
	padding-right:4px;
}
.profile-panel-tools{
	display:flex;
	align-items:center;
	gap:6px;
	margin-left:auto;
}
.profile-panel-tools{
	opacity:1;
	transform:translateY(0);
	transition:opacity .16s ease,transform .16s ease;
}
@media (hover: hover){
	.profile-panel-tools{
		opacity:0;
		pointer-events:none;
		transform:translateY(2px);
	}
	.profile-panel:hover .profile-panel-tools,
	.profile-panel:focus-within .profile-panel-tools{
		opacity:1;
		pointer-events:auto;
		transform:translateY(0);
	}
}
@media (max-width: 1023px){
	.profile-panel-tools{
		display:none !important;
	}
}
.topbar-icon-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:32px;
	width:32px;
	border:0;
	border-radius:8px;
	background:transparent;
	color:#9a9a9a;
	transition:background-color .15s ease,color .15s ease,transform .15s ease;
}
.topbar-icon-button:hover,
.topbar-icon-button:focus-visible{
	background:#f1f1f1;
	color:#3f3f3f;
	outline:none;
}
.topbar-icon-button:active{
	transform:scale(.96);
}
@media (min-width: 1024px){
	body.is-sidebar-collapsed .app-shell{
		justify-content:center;
	}
	body.is-sidebar-collapsed .app-main{
		margin-left:auto !important;
		margin-right:auto !important;
	}
}

.profile-panel .profile-insights{
	overflow:hidden;
	max-height:560px;
	opacity:1;
	transform:translateY(0);
	transition:max-height .22s ease,opacity .18s ease,transform .18s ease;
	will-change:max-height,opacity,transform;
}
.profile-panel .activity-panel{
	overflow-x:auto;
	overflow-y:hidden;
}
.profile-panel .activity-grid,
.profile-panel .activity-months{
	width:100%;
	justify-content:end;
}
body.is-heatmap-hidden .profile-panel .profile-insights{
	max-height:0;
	opacity:0;
	transform:translateY(-6px);
	pointer-events:none;
}

@media (min-width: 1024px){
	.desktop-sidebar{
		overflow:hidden;
		max-width:420px;
		opacity:1;
		transform:translateX(0);
		transition:max-width .22s ease,opacity .18s ease,transform .22s ease;
		will-change:max-width,opacity,transform;
	}
	body.is-sidebar-collapsed .desktop-sidebar{
		max-width:0;
		opacity:0;
		transform:translateX(-10px);
		pointer-events:none;
	}
}

@media (prefers-reduced-motion: reduce){
	.profile-panel .profile-insights,
	.desktop-sidebar{
		transition:none !important;
	}
}

#root > .app-shell > .app-main > .mx-auto.w-full.max-w-\[720px\].px-4.pt-2.pb-10{
	padding-top:0;
	padding-bottom:0;
}

.composer:focus-within .composer-textarea:not(.is-expanded):not(.is-force-expanded){
	height:132px;
}

.composer-modal{
	position:fixed;
	inset:0;
	z-index:200;
	display:grid;
	place-items:center;
	padding:16px;
	opacity:0;
	pointer-events:none;
	transition:opacity .18s ease;
}
.composer-modal[hidden]{
	display:none;
}
.composer-modal[data-state]{
	pointer-events:auto;
}
.composer-modal[data-state="open"]{
	opacity:1;
}
.composer-modal-backdrop{
	position:absolute;
	inset:0;
	border:0;
	background:rgb(0 0 0 / .32);
	padding:0;
	opacity:0;
	transition:opacity .18s ease;
}
.composer-modal[data-state="open"] .composer-modal-backdrop{
	opacity:1;
}
.composer-modal-panel{
	position:relative;
	z-index:1;
	width:min(720px,100%);
	border:1px solid #e9e9e9;
	border-radius:12px;
	background:#fff;
	box-shadow:0 24px 60px rgba(0,0,0,.18);
	padding:14px;
	max-height:calc(100vh - 32px);
	overflow:auto;
	transform:translateY(10px) scale(.98);
	opacity:0;
	transition:transform .18s ease,opacity .18s ease;
	will-change:transform,opacity;
}
.composer-modal[data-state="open"] .composer-modal-panel{
	transform:none;
	opacity:1;
}
.composer-modal-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	margin-bottom:10px;
}
.composer-modal-title{
	color:#2f2f2f;
	font-size:14px;
	font-weight:650;
}
.composer-modal-close{
	display:inline-flex;
	height:32px;
	width:32px;
	align-items:center;
	justify-content:center;
	border:0;
	border-radius:8px;
	background:transparent;
	color:#8f8f8f;
	transition:background-color .15s ease,color .15s ease,transform .15s ease;
}
.composer-modal-close:hover,
.composer-modal-close:focus-visible{
	background:#f1f1f1;
	color:#3f3f3f;
	outline:none;
}
.composer-modal-close:active{
	transform:scale(.98);
}
.composer-modal .composer-expand-button{
	display:none;
}

.memo-pin-badge{
	display:none;
}
.memo-item.is-pinned .memo-time{
	display:flex;
	align-items:center;
	gap:8px;
}
.memo-item .memo-time{
	margin-bottom:2px;
}
.memo-item.is-pinned .memo-time:before{
	content:"置顶";
	display:inline-flex;
	align-items:center;
	height:18px;
	padding:0 6px;
	border-radius:6px;
	background:#e9f7ef;
	color:#258f55;
	font-size:11px;
	font-weight:650;
	line-height:18px;
}
.memo-time .memo-category-sep{
	display:inline-block;
	width:1px;
	height:10px;
	margin:0 3px;
	background:rgba(0,0,0,.12);
	vertical-align:middle;
}
.memo-time .memo-category-name{
	color:inherit;
	font-size:inherit;
	font-weight:inherit;
	opacity:1;
}

.memo-text-wrap{
	position:relative;
}
.memo-text-wrap[data-collapsible="true"]{
	padding-bottom:22px;
}
.memo-text{
	overflow:hidden;
	transition:max-height .3s ease;
	will-change:max-height;
}
.memo-text > *:first-child{
	margin-top:0;
}
.memo-text > *:last-child{
	margin-bottom:0;
}
.memo-item .memo-markdown p{
	margin:.35em 0;
}
.memo-item .memo-text p{
	text-align:justify;
	text-align-last:left;
	text-justify:inter-word;
	hyphens:auto;
}

.tag-section .sidebar-button{
	color:hsl(var(--foreground)) !important;
	font-size:14px !important;
	line-height:1.75 !important;
	font-weight:400 !important;
	text-decoration:none !important;
}
.memo-item .memo-text a{
	color:inherit;
	font-size:inherit;
	line-height:inherit;
	font-weight:inherit;
	text-decoration:none;
}
.memo-item .memo-markdown a.memo-hashtag,
.memo-item .memo-text a.memo-hashtag{
	display:inline-flex;
	align-items:center;
	min-height:22px;
	max-width:100%;
	border-radius:6px;
	border:1px solid rgba(37,99,235,.22);
	background:rgba(37,99,235,.10);
	padding:0 7px;
	color:rgb(37 99 235 / 1);
	font-size:13px;
	line-height:1.45;
	vertical-align:baseline;
	text-decoration:none !important;
	transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;
}
.memo-item .memo-markdown a.memo-hashtag:hover,
.memo-item .memo-text a.memo-hashtag:hover{
	background:rgba(37,99,235,.16);
	border-color:rgba(37,99,235,.28);
	color:rgb(29 78 216 / 1);
}
.memo-item .memo-markdown a.memo-hashtag:active,
.memo-item .memo-text a.memo-hashtag:active{
	transform:scale(.98);
}
@media (prefers-color-scheme: dark){
	.memo-item .memo-markdown a.memo-hashtag,
	.memo-item .memo-text a.memo-hashtag{
		border-color:rgba(147,197,253,.35);
		background:rgba(59,130,246,.22);
		color:rgb(147 197 253 / 1);
	}
	.memo-item .memo-markdown a.memo-hashtag:hover,
	.memo-item .memo-text a.memo-hashtag:hover{
		background:rgba(59,130,246,.28);
		border-color:rgba(147,197,253,.45);
		color:rgb(191 219 254 / 1);
	}
}
.memo-text[data-state="collapsed"]{
	max-height:var(--memo-collapsed);
}
.memo-text[data-state="expanded"]{
	max-height:var(--memo-expanded);
}
.memo-text-wrap[data-collapsible="true"][data-state="collapsed"] .memo-text:after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:44px;
	background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 72%);
	pointer-events:none;
}
.memo-toggle{
	position:absolute;
	left:0;
	bottom:0;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:22px;
	padding:0;
	border-radius:0;
	border:0;
	background:transparent;
	color:#8f8f8f;
	font-size:12px;
	font-weight:650;
	transition:background-color .15s ease,color .15s ease,transform .15s ease;
}
.memo-toggle:hover{
	color:#3f3f3f;
}
.memo-toggle:active{
	transform:scale(.96);
}
.memo-toggle[hidden]{
	display:none !important;
}

.memo-edit-textarea{
	width:100%;
	min-height:50vh;
	resize:vertical;
	border:1px solid #e5e7eb;
	border-radius:10px;
	padding:10px 12px;
	font-size:14px;
	line-height:1.6;
	outline:none;
}
.memo-edit-textarea:focus{
	border-color:rgb(16 185 129 / 1);
	box-shadow:0 0 0 3px rgb(16 185 129 / .15);
}
.memo-edit-actions{
	display:flex;
	justify-content:flex-end;
	gap:10px;
	margin-top:10px;
}
.memo-edit-actions button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:34px;
	padding:0 12px;
	border-radius:10px;
	border:1px solid #e5e7eb;
	background:#fff;
	color:#2f2f2f;
	font-size:13px;
	font-weight:650;
	transition:background-color .15s ease,transform .15s ease;
}
.memo-edit-actions button:hover{
	background:#f3f4f6;
}
.memo-edit-actions button:active{
	transform:scale(.98);
}
.memo-edit-actions .memo-edit-save{
	border-color:rgb(16 185 129 / .35);
	background:rgb(16 185 129 / 1);
	color:#fff;
}
.memo-edit-actions .memo-edit-save:hover{
	background:rgb(4 120 87 / 1);
}

.memo-link-panel .composer-modal-body{
	display:grid;
	gap:10px;
}
.composer-modal-panel.memo-link-panel{
	width:min(420px,100%);
}
.memo-link-input{
	width:100%;
	height:40px;
	border:1px solid #e5e7eb;
	border-radius:10px;
	padding:0 12px;
	font-size:13px;
	color:#2f2f2f;
	background:#fff;
	outline:none;
}
.memo-link-input:focus{
	border-color:rgb(16 185 129 / 1);
	box-shadow:0 0 0 3px rgb(16 185 129 / .15);
}
.memo-link-actions{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
}
.memo-link-actions button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:36px;
	border-radius:10px;
	border:1px solid #e5e7eb;
	background:#fff;
	color:#2f2f2f;
	font-size:13px;
	font-weight:650;
	transition:background-color .15s ease,transform .15s ease;
}
.memo-link-actions button:hover{
	background:#f3f4f6;
}
.memo-link-actions button:active{
	transform:scale(.98);
}
.memo-link-actions .memo-link-copy{
	border-color:rgb(16 185 129 / .35);
	background:rgb(16 185 129 / 1);
	color:#fff;
}
.memo-link-actions .memo-link-copy:hover{
	background:rgb(4 120 87 / 1);
}

.composer-modal-panel.memo-category-panel{
	width:min(420px,100%);
	overflow:visible;
}
.memo-category-panel .composer-modal-body{
	display:grid;
	gap:12px;
}
.memo-category-select{
	display:none;
}
.memo-category-picker{
	position:relative;
}
.memo-category-trigger{
	display:flex;
	align-items:center;
	justify-content:flex-start;
	width:100%;
	height:40px;
	border:1px solid #e5e7eb;
	border-radius:10px;
	padding:0 34px 0 12px;
	font-size:13px;
	color:#2f2f2f;
	background-color:#fff;
	background-image:linear-gradient(45deg,transparent 50%,rgba(0,0,0,.42) 50%),linear-gradient(135deg,rgba(0,0,0,.42) 50%,transparent 50%);
	background-position:calc(100% - 14px) 16px,calc(100% - 9px) 16px;
	background-size:5px 5px,5px 5px;
	background-repeat:no-repeat;
	outline:none;
}
.memo-category-trigger:focus{
	border-color:rgb(16 185 129 / 1);
	box-shadow:0 0 0 3px rgb(16 185 129 / .15);
}
.memo-category-list{
	position:absolute;
	left:0;
	right:0;
	top:calc(100% + 8px);
	padding:6px;
	border:1px solid #e5e7eb;
	border-radius:12px;
	background:#fff;
	box-shadow:0 18px 40px rgba(0,0,0,.12);
	max-height:260px;
	overflow:auto;
	z-index:2;
}
.memo-category-option{
	position:relative;
	display:flex;
	align-items:center;
	width:100%;
	height:36px;
	padding:0 10px;
	border:0;
	border-radius:10px;
	background:transparent;
	color:#2f2f2f;
	font-size:13px;
	text-align:left;
	cursor:pointer;
	outline:none;
}
.memo-category-option:hover{
	background:#f3f4f6;
}
.memo-category-option:focus{
	box-shadow:0 0 0 3px rgb(16 185 129 / .15);
}
.memo-category-option[data-selected="true"]{
	background:rgb(16 185 129 / .10);
}
.memo-category-option[data-selected="true"]::after{
	content:"✓";
	position:absolute;
	right:10px;
	top:50%;
	transform:translateY(-50%);
	color:rgb(16 185 129 / 1);
}
.memo-category-actions{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
}
.memo-category-actions button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:36px;
	border-radius:10px;
	border:1px solid #e5e7eb;
	background:#fff;
	color:#2f2f2f;
	font-size:13px;
	font-weight:650;
	transition:background-color .15s ease,transform .15s ease;
}
.memo-category-actions button:hover{
	background:#f3f4f6;
}
.memo-category-actions button:active{
	transform:scale(.98);
}
.memo-category-actions .memo-category-save{
	border-color:rgb(16 185 129 / .35);
	background:rgb(16 185 129 / 1);
	color:#fff;
}
.memo-category-actions .memo-category-save:hover{
	background:rgb(4 120 87 / 1);
}

@media (prefers-reduced-motion: reduce){
	.composer-modal,
	.composer-modal-backdrop,
	.composer-modal-panel{transition:none}
	.composer-modal-panel{transform:none}
}

.memo-attachments{
	display:grid;
	grid-template-columns:repeat(5,minmax(0,1fr));
	gap:10px;
	margin-top:10px;
}

.memo-attachment{
	aspect-ratio:1/1;
	overflow:hidden;
	border-radius:10px;
	overflow:hidden;
	background:#f3f4f6;
	box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}
.memo-attachment > a,
.memo-attachment > img{
	display:block;
	width:100%;
	height:100%;
}
.memo-attachment img{
	display:block;
	width:100%;
	height:100%;
	margin:0;
	border:0;
	max-width:100%;
	max-height:none;
	box-shadow:none;
	object-fit:cover;
	background:#f3f4f6;
}

@media (max-width:640px){
	.memo-attachments{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:420px){
	.memo-attachments{grid-template-columns:repeat(2,minmax(0,1fr))}
}
