.tokki-profile{
    max-width:1320px;
    margin:0 auto;
    padding:24px;
}

.tokki-profile-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.tokki-profile-primary-column,
.tokki-profile-content-column {
	min-width: 0;
}

.tokki-profile-header{
	position: relative;
    background:#1A191D;
    border-radius:22px;
    padding:28px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    margin-bottom:18px;
}

.tokki-profile-avatar {
	width: 128px;
	height: 128px;
	min-width: 128px;
	border-radius: 50%;
	overflow: hidden;
}

.tokki-profile-avatar img {
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center;
	border-radius: 50% !important;
	display: block;
}

.tokki-profile-info h1{
    margin:0 0 6px;

    color:#E6E6E7;
}

.tokki-profile-info p{
    margin:0 0 8px;
    color:#cfcfd3;
}

.tokki-profile-info span{
    color:#aaa;
    font-size:14px;
}

.tokki-profile-info {
	width: 100%;
}

.tokki-profile-header-edit {
	position: absolute;
	top: 28px;
	right: 28px;
	z-index: 2;
}

.tokki-profile-header-edit .tokki-edit-profile-btn {
	margin: 0;
}

.tokki-profile-public-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 10px; }
.tokki-profile-public-meta .tokki-profile-handle { color:#AAA5B6; font-size:14px; }
.tokki-profile-public-meta .tokki-profile-role { display:inline-flex; min-height:24px; padding:4px 10px; align-items:center; border:1px solid rgba(185,139,221,.5); border-radius:999px; background:rgba(185,139,221,.12); color:#B98BDD; font-size:11px; font-weight:600; line-height:1.2; }
.tokki-profile-info .tokki-profile-public-bio { max-width:650px; margin:0 0 10px; color:#D2D1D5;  }
.tokki-profile-info .tokki-profile-private-email { margin:0 0 8px; color:#CFCFD3; }

.tokki-profile-section{
    background:#1A191D;
    border-radius:18px;
    padding:24px;
    margin-bottom:22px;
}

.tokki-profile-section h3{
    margin:0 0 12px;
    color:#E6E6E7;

}

.tokki-profile-section-heading {
	padding: 20px 24px 10px;
	margin: 0 !important;
}

.tokki-profile-tabs .tokki-profile-tab span {
	display: inline-flex;
	min-width: 22px;
	height: 22px;
	margin-left: 5px;
	padding: 0 6px;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: #222124;
	color: #b98bdd;
	font-size: 11px;
}

.tokki-profile-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(80px, 1fr));
	gap: 10px;
	margin: 0 0 18px;
}

.tokki-profile-stat {
	display: flex;
	min-height: 70px;
	padding: 10px 12px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 1px solid #313034;
	border-radius: 12px;
	background: #222124;
	text-align: center;
}

.tokki-profile-stat strong {
	color: #fff;
	font-size: 19px;
}

.tokki-profile-stat span {
	margin-top: 4px;
	font-size: 11px;
}

.tokki-profile-public-novels .tokki-staff-novels-grid,
.tokki-profile-public-articles .tokki-staff-recommendations-grid {
	margin-top: 18px;
}

.tokki-profile-section p{
    margin:0;
    color:#cfcfd3;
}

.tokki-profile .tokki-profile-empty {
	display: flex;
	width: 100%;
	min-height: 170px;
	margin: 18px 0 60px;
	box-sizing: border-box;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: #99979D;
	font-size: 17px;
	font-weight: 700;
	text-align: center;
}

.tokki-profile .tokki-profile-empty p {
	margin: 0;
	color: inherit;
	font: inherit;
}

.tokki-profile .tokki-profile-empty i {
	margin-top: 18px;
	color: inherit;
	font-size: 46px;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-empty {
		min-height: 140px;
		font-size: 15px;
	}

	.tokki-profile .tokki-profile-empty i {
		font-size: 40px;
	}
}

.tokki-profile-setting-row{
    display:flex;
    justify-content:space-between;
    gap:16px;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
    color:#75727A;
}

.tokki-profile-setting-row strong{
    color:#E6E6E7;
    font-weight:600;
}

.tokki-logout-btn,
.tokki-profile-btn{
    display:inline-flex;
    margin-top:20px;
    padding:11px 20px;
    border-radius:999px;
    background:#313034;
    color:#fff !important;
    text-decoration:none !important;
    font-weight:600;
}

.tokki-logout-btn:hover,
.tokki-profile-btn:hover{
    opacity:.88;
}

.tokki-profile-login-required{
    max-width:600px;
    margin:40px auto;
    background:#222124;
    border-radius:18px;
    padding:28px;
    text-align:center;
    color:#fff;
}








@media(max-width:768px){
    .tokki-profile{
		padding: 10px;
    }

	.tokki-profile-layout {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.tokki-profile-header,
	.tokki-profile-section {
		padding: 16px;
		border-radius: 14px;
	}

	.tokki-profile-avatar {
		width: 92px;
		height: 92px;
		min-width: 92px;
	}

	.tokki-profile-header-edit {
		top: 16px;
		right: 16px;
	}

	.tokki-profile-header-edit .tokki-edit-profile-btn {
		min-width: 0;
		padding: 9px 12px;
		font-size: 12px;
	}

	.tokki-profile-public-meta {
		gap: 5px;
	}

	.tokki-profile-stats {
		width: 100%;
		gap: 4px;
	}

	.tokki-profile-stat {
		min-width: 0;
		padding: 7px 3px;
	}

	.tokki-profile-stat strong {
		font-size: 16px;
	}

	.tokki-profile-stat span {
		font-size: 9px;
		overflow-wrap: anywhere;
	}

    .tokki-profile-info h1{

}

	.tokki-profile-info .tokki-profile-public-bio {
	
	}

	.tokki-profile-section h3 {

}

	.tokki-profile-section-heading {
		padding: 14px 12px 8px;
	}

	.tokki-profile-tabs {
		padding: 4px;
	}

	.tokki-profile-tab {
		padding: 9px 7px;
		font-size: 10px;
	}

	.tokki-profile-tabs .tokki-profile-tab span {
		display: none;
	}

	.tokki-profile-tab-content {
		padding: 12px 8px;
	}

	.tokki-profile .tkn-profile-library-grid,
	.tokki-profile-public-novels .tokki-staff-novels-grid,
	.tokki-profile-public-articles .tokki-staff-recommendations-grid {
		grid-template-columns: 1fr;
	}

    .tokki-profile-setting-row{
        flex-direction:column;
        gap:4px;
    }
}









/*novelas guardadas y terminadas*/

.tokki-profile-library-tabs{
    padding:0;
    overflow:hidden;
}

.tokki-profile-tabs{
    display:flex;
    gap:6px;
    background:#1A191D;
    padding:6px;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.tokki-profile-tab{
    border:0;
    background:transparent;
    color:#75727A;
    padding:14px 18px;
    border-radius:10px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
}

.tokki-profile-tab.is-active{
    background:#313034;
    color:#E6E6E7;
}

.tokki-profile-tab-content{
    display:none;
    padding:24px;
}

.tokki-profile-tab-content.is-active{
    display:block;
}

@media(max-width:768px){
    .tokki-profile-tabs{
        overflow-x:auto;
    }

    .tokki-profile-tab{
        white-space:nowrap;
        font-size:14px;
        padding:12px 14px;
    }
}















/* ========================================
   FAVORITOS / BIBLIOTECA
======================================== */

.tokki-profile .favorites-list{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
    gap:22px;
    list-style:none;
    margin:0;
    padding:0;
}

.tokki-profile .favorites-list li{
    margin:0;
}

.tokki-profile .favorites-list li::marker{
    display:none;
}

.tokki-profile .favorites-list a{
    text-decoration:none !important;
}

.tokki-profile .favorites-list img{
    width:100%;
    aspect-ratio:3/4.3;
    object-fit:cover;
    border-radius:16px;
    display:block;
    transition:transform .2s ease;
}

.tokki-profile .favorites-list img:hover{
    transform:scale(1.02);
}

.tokki-profile .favorites-list li a:last-child{
    display:block;
    margin-top:12px;
    color:#fff;
    font-size:17px;
    line-height:1.45;
    font-weight:600;
}

.tokki-profile .favorites-list li a:last-child:hover{
    opacity:.88;
}

.tokki-profile .favorites-list .simplefavorites-button{
    display:none !important;
}

/* VACÍO */

.tokki-profile .favorites-list:empty::after{
    content:"Tu biblioteca está vacía.";
    color:#aaa;
}

/* MOBILE */

@media(max-width:768px){

    .tokki-profile .favorites-list{
        grid-template-columns:repeat(3,1fr);
        gap:14px;
    }

    .tokki-profile .favorites-list li a:last-child{
        font-size:14px;
        line-height:1.35;
    }

}







/*para las novelas*/
.tkn-profile-library-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
    gap:22px;
}

.tkn-profile-library-card{
    min-width:0;
}

.tkn-profile-library-cover{
    display:block;
    text-decoration:none !important;
}

.tkn-profile-library-cover img{
    width:100%;
    aspect-ratio:3/4.3;
    object-fit:cover;
    border-radius:10px !important;
    display:block;
}

.tkn-profile-library-title{
    display:block;
    margin-top:5px;
    color:#fff !important;
    text-decoration:none !important;
    font-size:17px;
    line-height:1.45;
    font-weight:600;
}

.tkn-library-empty{
    color:#aaa;
    margin:0;
}

@media(max-width:768px){
    .tkn-profile-library-grid{
        grid-template-columns:repeat(3,1fr);
        gap:14px;
    }

    .tkn-profile-library-title{
        font-size:12px;
        line-height:1.3;
        
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
    }
}







.tokki-profile-stats{
    display:flex;
    gap:12px;
    margin-top:16px;
    flex-wrap:wrap;
}

.tokki-profile-stat{
    display:flex;
    flex-direction:column;
    justify-content:center;

    background:#222124;
    border:1px solid rgba(255,255,255,.07);
    border-radius:14px;
    box-sizing:border-box;

    padding:14px 18px;
    min-width:150px;
    min-height:90px;
}

.tokki-profile-stat strong{
    display:block;
    color:#E6E6E7;
    font-size:20px;
    line-height:1;
    margin-bottom:5px;
}

.tokki-profile-stat span{
	color:#AEADB2;
	font-size:13px;
	font-weight:500;
}

@media (max-width:768px){

	.tokki-profile-stats{
		display:grid;
		grid-template-columns:repeat(2,1fr);
		gap:10px;
	}

	.tokki-profile-stat{
		min-width:0;
		min-height:78px;
		padding:12px;
	}

	.tokki-profile-stat strong{
		font-size:18px;
	}

	.tokki-profile-stat span{
		font-size:12px;
	}
}


/* Vista previa del avatar en Editar perfil */
.tokki-profile-avatar-preview {
	width: 108px;
	height: 108px;
	min-width: 108px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	overflow: hidden;
	flex-shrink: 0;
}

.tokki-profile-avatar-preview img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	object-position: center;
	border-radius: 0 !important;
}








/* ===== TOKKINOVEL REGISTRO / LOGIN ===== */

.tokki-auth-page {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 18px;
}

.tokki-auth-card {
	width: 100%;
	max-width: 520px;
	background: #313034;
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 24px;
	padding: 42px 36px;
	text-align: center;
	box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.tokki-auth-card h1 {
	margin: 0 0 14px;
	color: #fff;

	line-height: 1.25;
	font-weight: 700;
}

.tokki-auth-text {
	max-width: 400px;
	margin: 0 auto 24px;
	color: #c9c4d0;
	font-size: 16px;
	line-height: 1.7;
}

.tokki-auth-benefits {
	display: grid;
	gap: 10px;
	margin: 0 0 28px;
}

.tokki-auth-benefits div {
	background: #424045;
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 14px;
	padding: 12px 14px;
	color: #99979D;
	font-size: 15px;
}


.tokki-auth-google {
	display: flex;
	justify-content: center;
	margin-bottom: 18px;
}

.tokki-auth-safe {
	margin: 0 0 12px;
	color: #aaa4b2;
	font-size: 14px;
	line-height: 1.6;
}

.tokki-auth-legal {
	margin: 0 auto 26px;
	max-width: 390px;
	color: #96909e;
	font-size: 13px;
	line-height: 1.6;
}

.tokki-auth-legal a {
	color: #b98bdd;
	text-decoration: none;
	font-weight: 600;
}

.tokki-auth-legal a:hover {
	text-decoration: underline;
}

.tokki-auth-main-btn,
.tokki-auth-back {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 24px;
	border-radius: 999px;
	background: #4b4850;
	color: #fff !important;
	text-decoration: none !important;
	font-size: 15px;
	font-weight: 500;
	transition: none;
}

.tokki-auth-main-btn {
	background: #b98bdd;
	margin-bottom: 14px;
}

.tokki-auth-main-btn:hover,
.tokki-auth-back:hover {
	background: #4b4850;
	color: #fff !important;
}

/* Móvil */
@media (max-width: 600px) {
	.tokki-auth-page {
		align-items: flex-start;
		padding-top: 52px;
	}

	.tokki-auth-card {
		padding: 34px 22px;
		border-radius: 22px;
	}

	.tokki-auth-card h1 {

}

	.tokki-auth-text {
		font-size: 14px;
	}

	.tokki-auth-benefits div {
		font-size: 14px;
	}
}





/** Artículos guardados del perfil propio. */
.tokki-profile-saved-recs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.tokki-profile-saved-rec-card {
	display: flex;
	min-width: 0;
	min-height: 172px;
	align-items: stretch;
	gap: 16px;
	padding: 18px;
	box-sizing: border-box;
	border: 1px solid #313034;
	border-radius: 16px;
	background: #1A191D;
}

.tokki-profile-saved-rec-card:nth-child(n+5) {
	display: none;
}

.tokki-profile-saved-rec-card.tokki-saved-article-visible {
	display: flex !important;
}

.tokki-profile-saved-rec-body {
	display: flex;
	min-width: 0;
	flex: 1 1 60%;
	flex-direction: column;
}

.tokki-profile-saved-rec-author {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 9px;
	margin-bottom: 15px;
}

.tokki-profile-saved-rec-avatar {
	display: block;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	overflow: hidden;
	border-radius: 50%;
}

.tokki-profile-saved-rec-avatar img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	border-radius: 50% !important;
}

.tokki-profile-saved-rec-author-name {
	min-width: 0;
	overflow: hidden;
	color: #BFBEC1 !important;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none !important;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tokki-profile-saved-rec-author-name:hover,
.tokki-profile-saved-rec-author-name:focus {
	color: #BFBEC1 !important;
	text-decoration: underline !important;
}

.tokki-profile-saved-rec-copy {
	display: block;
	min-width: 0;
	color: inherit;
	text-decoration: none !important;
}

.tokki-profile-saved-rec-copy h6 {
	display: -webkit-box;
	margin: 0 0 8px;
	overflow: hidden;
	color: #E6E6E7 !important;
	font-weight: 700;
	line-height: 1.35;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.tokki-profile-saved-rec-copy p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: #99979D;
	font-size: 13px;
	line-height: 1.5;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.tokki-profile-saved-rec-side {
	display: block;
	width: 38%;
	min-width: 118px;
	align-self: center;
	text-decoration: none !important;
}

.tokki-profile-saved-rec-image {
	display: flex;
	width: 100%;
	aspect-ratio: 16 / 9;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border: 1px solid #313034;
	border-radius: 12px;
	background: #222124;
	color: #75727A;
}

.tokki-profile-saved-rec-image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	border-radius: inherit !important;
}

.tokki-profile-saved-rec-placeholder i {
	font-size: 24px;
}

@media (hover: hover) and (pointer: fine) {
	.tokki-profile-saved-rec-card {
		transition: border-color .2s ease, transform .2s ease;
	}

	.tokki-profile-saved-rec-card:hover {
		border-color: #424045;
		transform: translateY(-2px);
	}
}

.tokki-load-more-recs {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 9px;
	width: auto !important;
	min-width: 0 !important;
	min-height: 30px !important;
	margin: 24px auto 0 !important;
	padding: 4px 10px !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	color: #AAA7AE !important;
	font-family: inherit;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	cursor: pointer;
	box-shadow: none !important;
	transform: none !important;
	transition: opacity .18s ease !important;
}

.tokki-load-more-recs.has-desktop-overflow {
	display: flex;
}

.tokki-load-more-recs::before,
.tokki-load-more-recs::after {
	content: "";
	display: block;
	width: 52px;
	height: 1px;
	background: #454247;
}

@media (max-width: 768px) {
	.tokki-load-more-recs {
		display: flex;
	}

	.tokki-load-more-recs::before,
	.tokki-load-more-recs::after {
		width: 34px;
	}

	.tokki-profile-saved-recs {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	.tokki-profile-saved-rec-card {
		min-height: 158px;
		gap: 12px;
		padding: 15px;
	}

	.tokki-profile-saved-rec-card:nth-child(n+4) {
		display: none;
	}

	.tokki-profile-saved-rec-body {
		flex-basis: 62%;
	}

	.tokki-profile-saved-rec-author {
		margin-bottom: 12px;
	}

	.tokki-profile-saved-rec-avatar {
		width: 30px;
		height: 30px;
		flex-basis: 30px;
	}

	.tokki-profile-saved-rec-copy h6 {
		margin-bottom: 6px;
	}

	.tokki-profile-saved-rec-copy p {
		font-size: 12px;
		-webkit-line-clamp: 2;
	}

	.tokki-profile-saved-rec-side {
		width: 36%;
		min-width: 105px;
	}
}

.tokki-load-more-recs:hover,
.tokki-load-more-recs:focus,
.tokki-load-more-recs:active {
	background: transparent !important;
	border: 0 !important;
	color: #D2D1D5 !important;
	outline: none !important;
	box-shadow: none !important;
	transform: none !important;
	opacity: .82;
}





/*editar perfil*/
.tokki-profile-actions {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 20px;
	flex-wrap: wrap;
}

.tokki-profile-edit-actions {
	margin: 0;
}

.tokki-profile-actions .tokki-edit-profile-btn,
.tokki-profile-actions .tokki-logout-btn {
	min-width: 170px;
	height: 48px;
	justify-content: center;
}


.tokki-edit-profile-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	padding: 11px 20px;
	border-radius: 999px;
	background: #1A191D;
	color: #524F56 !important;
	text-decoration: none !important;
	font-size: inherit;
	font-weight: 600;
	border: 1px solid #524F56;
	cursor: pointer;
	transition: none;
}

.tokki-edit-profile-btn:hover,
.tokki-edit-profile-btn:focus,
.tokki-edit-profile-btn:active {
	background: #1A191D;
	border-color: #524F56;
	color: #524F56 !important;
	box-shadow: none;
	outline: none;
	opacity: .88;
}

.tokki-profile-article-extra,.tokki-profile-reading-extra { display:none !important; }
.tokki-profile-load-more-articles { display:flex; }
.tokki-profile-load-more-reading { display:none; }
.tokki-profile-load-more-reading.has-desktop-overflow { display:flex; }
.tokki-profile-load-more-articles,.tokki-profile-load-more-reading { align-items:center; justify-content:center; gap:9px; width:auto!important; min-width:0!important; min-height:30px!important; margin:18px auto 0!important; padding:4px 10px!important; border:0!important; border-radius:0!important; background:transparent!important; color:#AAA7AE!important; font-family:inherit; font-size:13px!important; font-weight:600!important; line-height:1.3!important; cursor:pointer; box-shadow:none!important; transform:none!important; transition:opacity .18s ease!important; text-decoration:none!important; }
.tokki-profile-load-more-articles::before,.tokki-profile-load-more-articles::after,.tokki-profile-load-more-reading::before,.tokki-profile-load-more-reading::after { content:""; display:block; width:52px; height:1px; background:#454247; }
.tokki-profile-load-more-articles:hover,.tokki-profile-load-more-articles:focus,.tokki-profile-load-more-articles:active,.tokki-profile-load-more-reading:hover,.tokki-profile-load-more-reading:focus,.tokki-profile-load-more-reading:active { border:0!important; background:transparent!important; color:#D2D1D5!important; box-shadow:none!important; transform:none!important; outline:none; opacity:.82; text-decoration:none!important; }
.tokki-profile-activity-list { display:grid; gap:10px; }
.tokki-profile-activity-list a { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:12px; padding:14px 16px; border:1px solid #313034; border-radius:14px; background:#222124; color:#d2d1d5; text-decoration:none!important; }
.tokki-profile-activity-list a:hover strong { text-decoration:underline; }
.tokki-profile-activity-list i { color:#b98bdd; text-align:center; }
.tokki-profile-activity-list span { display:grid; min-width:0; }
.tokki-profile-activity-list small,.tokki-profile-activity-list time { color:#aaa6af; font-size:12px; }
.tokki-profile-activity-list strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tokki-profile-privacy-settings { display:grid; gap:9px; margin-top:8px; padding-top:22px; border-top:1px solid #313034; }
.tokki-profile-privacy-heading { display:block!important; margin:0 0 7px!important; color:#d2d1d5!important; font-family:inherit!important; font-size:13px!important; font-weight:600!important; line-height:1.4!important; }
.tokki-profile-privacy-option { position:relative; display:flex!important; width:100%; min-height:48px; padding:10px 13px; box-sizing:border-box; align-items:center; justify-content:flex-start; gap:12px; border-radius:10px; background:transparent; cursor:pointer; }
.tokki-profile-privacy-option:hover,.tokki-profile-privacy-option:focus-within,.tokki-profile-privacy-option:has(input:checked) { background:#2a292c; }
.tokki-profile-privacy-option input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.tokki-profile-privacy-option span { color:#bfbec1; font-size:13px; font-weight:500; line-height:1.35; }
.tokki-profile-privacy-option i { display:block; width:9px; height:9px; flex:0 0 9px; border:1px solid #68656d; border-radius:50%; }
.tokki-profile-privacy-option input:checked ~ span { color:#d8b5f3; }
.tokki-profile-privacy-option input:checked + i { border-color:#b98bdd; background:#b98bdd; box-shadow:0 0 0 3px rgba(185,139,221,.13); }
@media(max-width:600px){.tokki-profile-activity-list a{grid-template-columns:28px minmax(0,1fr)}.tokki-profile-activity-list time{grid-column:2}.tokki-profile-load-more-articles,.tokki-profile-load-more-reading{min-height:38px}.tokki-profile-load-more-articles::before,.tokki-profile-load-more-articles::after,.tokki-profile-load-more-reading::before,.tokki-profile-load-more-reading::after{width:34px}}

/* Portadas públicas con el mismo patrón visual de los carruseles de inicio. */
.tokki-profile-public-novels .tokki-staff-novels-grid { display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; gap:14px!important; width:100%!important; }
.tokki-profile-public-novels .tokki-staff-novel-card { position:relative; display:block; width:100%; aspect-ratio:2/3; overflow:hidden; box-sizing:border-box; border:1px solid #313034; border-radius:10px; background:#313034; }
.tokki-profile-public-novels .tokki-staff-novel-image,.tokki-profile-public-novels .tokki-staff-novel-card>img { position:absolute; inset:0; display:block; width:100%!important; max-width:none!important; height:100%!important; min-height:100%!important; object-fit:cover!important; object-position:center!important; border-radius:9px!important; }
.tokki-profile-public-novels .tokki-staff-novel-placeholder { position:absolute; inset:0; background:#222124; }
.tokki-profile-public-novels .tokki-staff-novel-gradient { position:absolute; z-index:1; inset:0; background:linear-gradient(to bottom,transparent 45%,rgba(26,25,29,.55) 68%,#1a191d 88%); pointer-events:none; }
.tokki-profile-public-novels h6.tokki-staff-novel-title { position:absolute; z-index:2; right:12px; bottom:12px; left:12px; display:-webkit-box; margin:0; overflow:hidden; color:#e6e6e7!important; font-family:"Lora",serif; font-size:14px!important; font-weight:500!important; line-height:1.35; text-align:center; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
@media(hover:hover) and (pointer:fine){.tokki-profile-public-novels .tokki-staff-novel-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.tokki-profile-public-novels .tokki-staff-novel-card:hover,.tokki-profile-public-novels .tokki-staff-novel-card:focus{transform:translateY(-5px);border-color:#424045;box-shadow:0 12px 26px rgba(0,0,0,.28)}}
.tokki-profile-content-column { display:flex; min-width:0; flex-direction:column; }
.tokki-profile-public-novels { order:1; }
.tokki-profile-public-reading { order:2; }
.tokki-profile-public-articles { order:3; }
.tokki-profile-public-activity { order:4; }
.tokki-profile-public-reading .tkn-profile-library-grid { width:100%!important; max-width:none!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; column-gap:10px!important; row-gap:22px!important; }
.tokki-profile-public-reading .tkn-profile-library-card:nth-child(n+19) { display:none!important; }
.tokki-profile-public-reading .tkn-profile-library-card.tokki-reading-visible { display:block!important; }
.tokki-profile-stat h6 { display:block; margin:0 0 5px; color:#e6e6e7; line-height:1; }
.tokki-profile-reading-heading { display:flex; align-items:baseline; gap:18px; }
.tokki-profile-reading-heading span { color:#524F56!important; font:inherit!important; }
@media(max-width:768px){.tokki-profile-public-novels .tokki-staff-novels-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.tokki-profile-public-novels h6.tokki-staff-novel-title{right:9px;bottom:10px;left:9px;font-size:12px!important}.tokki-profile-public-reading .tkn-profile-library-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;column-gap:6px!important;row-gap:18px!important}.tokki-profile-public-reading .tkn-profile-library-card:nth-child(n+9){display:none!important}.tokki-profile-public-reading .tkn-profile-library-card.tokki-reading-visible{display:block!important}.tokki-profile-load-more-reading{display:flex}}

/* En móvil se conserva el mismo recorrido vertical de la versión de PC. */
@media (max-width: 768px) {
	.tokki-profile .tokki-profile-layout {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.tokki-profile .tokki-profile-tabs {
		display: grid;
		grid-template-columns: 1fr;
		overflow: visible;
	}

	.tokki-profile .tokki-profile-tab {
		width: 100%;
		padding: 9px 6px;
		font-size: 10px;
		white-space: normal;
	}

	.tokki-profile .tkn-profile-library-grid,
	.tokki-profile .tokki-staff-novels-grid,
	.tokki-profile .tokki-staff-recommendations-grid {
		grid-template-columns: minmax(0, 1fr);
		justify-content: stretch;
	}
}



/* =========================================================
 * Popup para editar el perfil
 * ========================================================= */

.tokki-profile-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 999999;

	align-items: center;
	justify-content: center;

	padding: 20px;
	box-sizing: border-box;
}

.tokki-profile-modal.is-open {
	display: flex;
}

/* Evita desplazar el contenido detrás del popup */
html:has(.tokki-profile-modal.is-open),
body:has(.tokki-profile-modal.is-open) {
	overflow: hidden !important;
	overscroll-behavior: none;
}

.tokki-profile-modal-overlay {
	position: absolute;
	inset: 0;

	background: rgba(0, 0, 0, 0.78);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

.tokki-profile-modal-box {
	position: relative;
	z-index: 2;

	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 40px);
	overflow-y: auto;

	box-sizing: border-box;
	margin: 0;
	padding: 32px;

	background: #1A191D;
	border: 1px solid rgba(185, 139, 221, 0.32);
	border-radius: 22px;

	color: #E6E6E7;

	box-shadow:
		0 24px 70px rgba(0, 0, 0, 0.5);

	scrollbar-width: thin;
	scrollbar-color: #4A474E #222124;
}

.tokki-profile-modal-box h2 {
	margin: 0 42px 26px;
	color: #FFFFFF;

	font-weight: 700;
	line-height: 1.25;
	text-align: center;
}


/* =========================================================
 * Cerrar popup
 * ========================================================= */

.tokki-profile-modal-close {
	position: absolute !important;
	top: 18px !important;
	right: 18px !important;

	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 32px !important;
	min-width: 32px !important;
	height: 32px !important;
	min-height: 32px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 50% !important;

	color: #8E8B92 !important;
	font-family: Arial, sans-serif;
	font-size: 27px !important;
	font-weight: 300 !important;
	line-height: 1 !important;

	cursor: pointer;
	box-shadow: none !important;
	transform: none !important;
}

.tokki-profile-modal-close:hover,
.tokki-profile-modal-close:focus,
.tokki-profile-modal-close:active {
	background: transparent !important;
	border: 0 !important;
	color: #FFFFFF !important;
	box-shadow: none !important;
	transform: none !important;
	outline: none;
}


/* =========================================================
 * Formulario
 * ========================================================= */

.tokki-profile-settings-form {
	display: flex;
	flex-direction: column;
	gap: 9px;
	width: 100%;
	margin: 0;
}

.tokki-profile-settings-form > label,
.tokki-profile-bio-field > label,
.tokki-profile-avatar-input > label {
	display: block;
	margin: 0 0 7px;

	color: #D2D1D5;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}


/* Nombre y biografía */

.tokki-profile-settings-form input[type="text"],
.tokki-profile-settings-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;

	margin: 0 !important;
	padding: 13px 14px !important;

	background: #222124 !important;
	border: 1px solid #38363B !important;
	border-radius: 13px !important;

	color: #E6E6E7 !important;
	font-family: inherit;
	font-size: 14px !important;
	line-height: 1.5;

	outline: none;
	box-shadow: none !important;
}

.tokki-profile-settings-form input[type="text"] {
	min-height: 48px;
	margin-bottom: 15px !important;
}

.tokki-profile-settings-form textarea {
	min-height: 130px;
	resize: vertical;
}

.tokki-profile-settings-form input[type="text"]:focus,
.tokki-profile-settings-form textarea:focus {
	background: #222124 !important;
	border-color: #B98BDD !important;
	box-shadow:
		0 0 0 3px rgba(185, 139, 221, 0.12) !important;
}

.tokki-profile-settings-form textarea::placeholder {
	color: #77747B;
	opacity: 1;
}


/* Biografía del staff */

.tokki-profile-bio-field {
	margin-bottom: 14px;
}

.tokki-profile-bio-help,
.tokki-profile-avatar-help {
	margin: 7px 0 0 !important;
	color: #918E95 !important;
	font-size: 11px !important;
	line-height: 1.5 !important;
}


/* =========================================================
 * Avatar y selector de archivo
 * ========================================================= */

.tokki-profile-avatar-field {
	display: flex;
	align-items: center;
	gap: 18px;

	margin: 2px 0 20px;
	padding: 16px;

	background: #222124;
	border: 1px solid #313034;
	border-radius: 16px;
}

.tokki-profile-avatar-preview {
	flex: 0 0 88px;
	width: 88px;
	height: 88px;

	overflow: hidden;

	border-radius: 50%;

	background: #1A191D;
	box-sizing: border-box;
}

.tokki-profile-avatar-preview img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	border-radius: 50%;
}

.tokki-profile-avatar-input {
	flex: 1;
	min-width: 0;
}

.tokki-profile-settings-form input[type="file"] {
	display: block;
	width: 100%;
	box-sizing: border-box;

	margin: 0 !important;
	padding: 6px !important;

	background: #1A191D !important;
	border: 1px solid #38363B !important;
	border-radius: 12px !important;

	color: #AAA7AE !important;
	font-family: inherit;
	font-size: 12px !important;

	cursor: pointer;
	box-shadow: none !important;
}

.tokki-profile-settings-form
	input[type="file"]::file-selector-button {
	margin: 0 10px 0 0;
	padding: 8px 13px;

	background: #313034;
	border: 0;
	border-radius: 9px;

	color: #E6E6E7;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;

	cursor: pointer;
}

.tokki-profile-settings-form
	input[type="file"]::-webkit-file-upload-button {
	margin: 0 10px 0 0;
	padding: 8px 13px;

	background: #313034;
	border: 0;
	border-radius: 9px;

	color: #E6E6E7;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;

	cursor: pointer;
}


/* =========================================================
 * Botón Guardar cambios
 * ========================================================= */

.tokki-profile-settings-form .tokki-auth-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	align-self: flex-end;

	width: auto !important;
	min-width: 170px !important;
	min-height: 48px !important;

	margin: 0 !important;
	padding: 12px 23px !important;

	background: #B98BDD !important;
	border: 1px solid #B98BDD !important;
	border-radius: 999px !important;

	color: #1A191D !important;
	font-family: inherit;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;

	cursor: pointer;
	box-shadow: none !important;
	transform: none !important;
	transition: opacity 0.18s ease !important;
}

.tokki-profile-settings-form .tokki-auth-btn:hover,
.tokki-profile-settings-form .tokki-auth-btn:focus,
.tokki-profile-settings-form .tokki-auth-btn:active {
	background: #B98BDD !important;
	border-color: #B98BDD !important;
	color: #1A191D !important;

	box-shadow: none !important;
	transform: none !important;
	outline: none;
	opacity: 0.9;
}


/* =========================================================
 * Popup de perfil en móvil
 * ========================================================= */

@media (max-width: 600px) {
	.tokki-profile-modal {
		align-items: flex-end;
		padding: 12px;
	}

	.tokki-profile-modal-box {
		max-height: calc(100vh - 24px);
		padding: 26px 18px 18px;
		border-radius: 20px;
	}

	.tokki-profile-modal-box h2 {
		margin-bottom: 22px;

}

	.tokki-profile-modal-close {
		top: 14px !important;
		right: 14px !important;
	}

	.tokki-profile-avatar-field {
		align-items: center;
		gap: 13px;
		padding: 13px;
	}

	.tokki-profile-avatar-preview {
		flex-basis: 70px;
		width: 70px;
		height: 70px;
	}

	.tokki-profile-settings-form
		input[type="file"]::file-selector-button {
		display: block;
		width: 100%;
		margin: 0 0 6px;
	}

	.tokki-profile-settings-form
		input[type="file"]::-webkit-file-upload-button {
		display: block;
		width: 100%;
		margin: 0 0 6px;
	}

	.tokki-profile-settings-form .tokki-auth-btn {
		align-self: stretch;
		width: 100% !important;
	}
}


/* Corregir círculo del avatar en Editar perfil */

.tokki-profile-modal .tokki-profile-avatar-preview {
	flex: 0 0 88px !important;

	width: 88px !important;
	min-width: 88px !important;
	max-width: 88px !important;

	height: 88px !important;
	min-height: 88px !important;
	max-height: 88px !important;

	aspect-ratio: 1 / 1;


	border-radius: 50% !important;

	box-sizing: border-box;
	overflow: hidden;
}

.tokki-profile-modal .tokki-profile-avatar-preview img {
	width: 100% !important;
	height: 100% !important;
	min-width: 100% !important;
	max-width: 100% !important;

	aspect-ratio: 1 / 1;
	object-fit: cover !important;
	border-radius: 50% !important;
}
@media (max-width: 600px) {
	.tokki-profile-modal .tokki-profile-avatar-preview {
		flex-basis: 70px !important;

		width: 70px !important;
		min-width: 70px !important;
		max-width: 70px !important;

		height: 70px !important;
		min-height: 70px !important;
		max-height: 70px !important;
	}
}

/* Ajustes de identidad del perfil. */
.tokki-profile .tokki-profile-info h1 {

	line-height: 1.15;
}

.tokki-profile .tokki-profile-info h1 {
    font-size: 37px;
    line-height: 1.12;
}

@media (max-width: 768px) {
    .tokki-profile .tokki-profile-info h1 {
        font-size: 32px;
    }
}


.tokki-profile .tokki-profile-info .tokki-profile-public-bio {
	display: block;
	width: 100%;
	max-width: none;
	box-sizing: border-box;
}

.tokki-profile .tokki-profile-member-since {
	display: block;
	width: 100%;
	margin-top: 12px;
	text-align: right;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-avatar {
		width: 124px;
		height: 124px;
		min-width: 124px;
	}

	.tokki-profile .tokki-profile-info h1 {

}

	.tokki-profile .tokki-profile-info .tokki-profile-public-bio {
		width: 100%;
		max-width: none;
	}
}

/* Perfil: jerarquía, estadísticas y filtros definitivos. */
.tokki-profile .tokki-profile-info h1 {

	line-height: 1.12;
}

.tokki-profile .tokki-profile-info,
.tokki-profile .tokki-profile-public-bio {
	width: 100%;
	max-width: none;
}

.tokki-profile .tokki-profile-member-since {
	display: block;
	width: 100%;
	text-align: right;
}

.tokki-profile .tokki-profile-stats {
	width: 100%;
	max-width: 720px;
	margin: 0 auto 22px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tokki-profile .tokki-profile-stat {
	text-align: center;
}

.tokki-profile .tokki-profile-tabs {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	padding: 10px;
	border-bottom: 3px solid #424045;
}

.tokki-profile .tokki-profile-tab {
	border: 1px solid #313034;
	border-radius: 999px;
	background: #222124;
	color: #bfbec1;
}

.tokki-profile .tokki-profile-tab.is-active {
	border-color: rgba(185, 139, 221, .7);
	background: rgba(185, 139, 221, .16);
	color: #c98cf3;
}

@media (min-width: 769px) {
	.tokki-profile .tokki-profile-tabs .tokki-profile-tab span {
		display: none;
	}
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-avatar {
		width: 140px;
		height: 140px;
		min-width: 140px;
	}

	.tokki-profile .tokki-profile-info h1 {

}

	.tokki-profile .tokki-profile-stats {
		display: grid;
		width: 100%;
		max-width: none;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 6px;
	}

	.tokki-profile .tokki-profile-tabs {
		display: flex;
		justify-content: flex-start;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.tokki-profile .tokki-profile-tabs::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
	}

	.tokki-profile .tokki-profile-tab {
		flex: 0 0 auto;
		width: auto;
		padding: 10px 13px;
		font-size: 12px;
		white-space: nowrap;
	}

	.tokki-profile .tokki-profile-tabs .tokki-profile-tab span {
		display: inline-flex;
	}
}

/* Prioridad final: alineación solicitada en 1.4.56. */
.tokki-profile .tokki-profile-stats {
	display: flex;
	align-items: stretch;
	justify-content: center;
	width: 100%;
	max-width: none;
	margin: 0 auto 22px;
}

.tokki-profile .tokki-profile-stat {
	flex: 0 1 220px;
	width: min(220px, calc((100% - 20px) / 3));
}

.tokki-profile .tokki-profile-tabs {
	justify-content: flex-start;
	border-bottom-width: 2px;
}

.tokki-profile .tokki-profile-tabs .tokki-profile-tab span {
	display: none;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-stats {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 6px;
	}

	.tokki-profile .tokki-profile-stat {
		width: auto;
		min-width: 0;
	}

	.tokki-profile .tokki-profile-tabs {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: nowrap;
		overflow: visible;
		gap: 5px;
	}

	.tokki-profile .tokki-profile-tab {
		flex: 0 1 auto;
		min-width: 0;
		padding: 9px 10px;
		font-size: 11px;
		white-space: nowrap;
	}

	.tokki-profile .tokki-profile-tabs .tokki-profile-tab span {
		display: none;
	}
}

/* Biblioteca visual 1.4.57. */
.tokki-profile .tkn-profile-library-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	column-gap: 14px;
	row-gap: 30px;
}

.tokki-profile .tkn-profile-library-card {
	min-width: 0;
}

.tokki-profile .tkn-profile-library-cover {
	position: relative;
	isolation: isolate;
	display: block;
	width: 100%;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	border: 1px solid #313034;
	border-radius: 10px;
	background: #1a191d;
	box-sizing: border-box;
	color: inherit;
	text-decoration: none !important;
}

.tokki-profile .tkn-profile-library-image,
.tokki-profile .tkn-profile-library-cover img {
	position: relative;
	z-index: 0;
	display: block;
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	min-height: 100% !important;
	aspect-ratio: 2 / 3;
	object-fit: cover !important;
	object-position: center !important;
	border-radius: 9px !important;
}

.tokki-profile .tkn-profile-library-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: #222124;
}

.tokki-profile .tkn-profile-library-gradient {
	position: absolute;
	z-index: 1;
	inset: 0;
	background: linear-gradient(to bottom, transparent 38%, rgba(30, 29, 32, .72) 68%, #1a191d 92%);
	pointer-events: none;
}

.tokki-profile .tkn-profile-library-title {
	position: absolute;
	z-index: 2;
	right: 10px;
	bottom: 10px;
	left: 10px;
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	color: #e6e6e7 !important;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.35;
	text-align: center;
	text-decoration: none !important;
}

.tokki-profile .tkn-profile-reading-progress {
	position: relative;
	display: block;
	width: 100%;
	height: 6px;
	margin: 9px 0 0;
	overflow: hidden;
	border-radius: 999px;
	background: #46454a;
}

.tokki-profile .tkn-profile-reading-progress-fill {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: #b98bdd;
	transition: width .35s ease;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-tabs {
		justify-content: flex-start;
	}

	.tokki-profile .tokki-profile-tab {
		padding: 10px 12px;
		font-size: 13px;
	}

	.tokki-profile .tkn-profile-library-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 6px;
		row-gap: 22px;
	}

	.tokki-profile .tkn-profile-library-title {
		right: 7px;
		bottom: 8px;
		left: 7px;
		font-size: 11px;
	}

	.tokki-profile .tkn-profile-reading-progress {
		height: 4px;
		margin-top: 7px;
	}
	
	.tokki-profile-saved-rec-copy h6 {
        margin-bottom: 6px;
        font-size: 15px !important;
    }
}

/* La cuadrícula móvil aprovecha todo el ancho del panel. */
.tokki-profile .tokki-profile-library-tabs .tokki-profile-tab-content {
	padding-right: 0;
	padding-left: 0;
}

.tokki-profile .tkn-profile-library-grid {
	width: 100%;
	max-width: none;
}

.tokki-profile h6.tkn-profile-library-title {
	margin: 0;

	font-family: "Lora", serif;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-library-tabs .tokki-profile-tab-content {
		width: 100%;
		padding-right: 0;
		padding-left: 0;
	}

	.tokki-profile h6.tkn-profile-library-title {

}
}

/* Selector compacto de avatar al inicio de Editar perfil. */
.tokki-profile-settings-form .tokki-profile-avatar-field {
	display: flex;
	justify-content: center;
	margin: 0 0 18px;
	padding: 4px 0 8px;
	background: transparent;
	border: 0;
}

.tokki-profile-avatar-picker {
	position: relative;
	display: block !important;
	width: 96px;
	height: 96px;
	margin: 0 !important;
	border-radius: 50%;
	cursor: pointer;
}

.tokki-profile-modal .tokki-profile-avatar-picker .tokki-profile-avatar-preview {
	display: block;
	width: 96px !important;
	min-width: 96px !important;
	max-width: 96px !important;
	height: 96px !important;
	min-height: 96px !important;
	max-height: 96px !important;
	border: 1px solid #424045;
	border-radius: 50% !important;
	background: #1A191D;
	box-sizing: border-box;
	overflow: hidden;
}

.tokki-profile-avatar-edit-icon {
	position: absolute;
	right: -2px;
	bottom: 3px;
	display: inline-flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border: 2px solid #1A191D;
	border-radius: 50%;
	background: #313034;
	color: #E6E6E7;
	font-size: 12px;
	box-sizing: border-box;
}

.tokki-profile-avatar-picker:hover .tokki-profile-avatar-edit-icon,
.tokki-profile-avatar-picker:focus-within .tokki-profile-avatar-edit-icon {
	background: #424045;
	color: #FFFFFF;
}

.tokki-profile-settings-form input#tokki_profile_avatar {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	border: 0 !important;
	white-space: nowrap !important;
}

/* Las ayudas de Seudónimo y Sobre mí comparten la misma separación. */
.tokki-profile-slug-field,
.tokki-profile-bio-field {
	display: grid;
	gap: 7px;
}

.tokki-profile-slug-field > label,
.tokki-profile-bio-field > label {
	margin: 0;
	color: #D2D1D5;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}

.tokki-profile-slug-field input[type="text"] {
	margin-bottom: 0 !important;
}

.tokki-profile-slug-field .tokki-profile-bio-help,
.tokki-profile-bio-field .tokki-profile-bio-help {
	margin: 0 !important;
}


/* Biografía pública: nunca truncar visualmente antes del límite de 500 caracteres. */
.tokki-profile .tokki-profile-info .tokki-profile-public-bio {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
	text-overflow: clip !important;
	white-space: pre-line !important;
	-webkit-line-clamp: unset !important;
	line-clamp: unset !important;
	-webkit-box-orient: initial !important;
	font-size: 17px !important;
	line-height: 1.6em !important;
}

@media (max-width: 768px) {
	.tokki-profile .tokki-profile-info .tokki-profile-public-bio {
		font-size: 15px !important;
		line-height: 1.6em !important;
	}
}
