/* =============================================================
   LOKLOK — Premium Glassmorphism Audio Editor
   Modern warm amber/gold palette with frosted glass surfaces.
   All .pk_* selectors preserved (used by JS).
   ============================================================= */

/* ---------- Design Tokens ---------- */
:root{
	--bg-deep:#0d0a07;
	--bg-0:rgba(14,10,7,.95);
	--bg-1:rgba(20,15,10,.80);
	--bg-2:rgba(28,20,13,.72);
	--bg-3:rgba(40,28,17,.65);
	--bg-4:rgba(52,36,22,.58);

	--fg-0:#f5ead6;
	--fg-1:#bfa06a;
	--fg-2:#7d6640;
	--fg-3:#4a3a24;

	--ac:#f0a030;
	--ac-h:#ffbe5c;
	--ac-2:#c8882a;
	--ac-soft:rgba(240,160,48,.10);
	--ac-glow:rgba(240,160,48,.40);
	--ac-glow2:rgba(240,160,48,.18);
	--ac-ink:#1c0f01;

	--rec:#e83050;
	--rec-glow:rgba(232,48,80,.40);
	--solo:#f0c020;
	--solo-glow:rgba(240,192,32,.40);
	--warn:#f09020;
	--ok:#e0c040;
	--pl:#ff7a1a;

	--bd:rgba(240,160,48,.09);
	--bd-s:rgba(240,160,48,.05);
	--bd-h:rgba(240,160,48,.35);
	--bd-glow:0 0 0 1px rgba(240,160,48,.30);

	--r:6px;
	--r-md:10px;
	--r-lg:14px;
	--r-xl:20px;

	--s1:4px;--s2:8px;--s3:12px;--s4:16px;

	--ease:cubic-bezier(.25,.8,.25,1);
	--ease-out:cubic-bezier(.0,.0,.2,1);
	--tr:180ms var(--ease);
	--tr-slow:320ms var(--ease);

	--glass-bg:rgba(18,13,8,.78);
	--glass-border:1px solid rgba(240,160,48,.10);
	--glass-blur:blur(24px) saturate(1.6);
	--glass-shadow:0 8px 32px rgba(0,0,0,.40),0 2px 8px rgba(0,0,0,.20);
	--glass-inset:inset 0 1px 0 rgba(255,220,140,.06),inset 0 -1px 0 rgba(0,0,0,.15);

	--glow-sm:0 0 8px var(--ac-glow);
	--glow-md:0 0 16px var(--ac-glow);
	--glow-lg:0 0 28px var(--ac-glow);

	--ff:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	--ff-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
}

@font-face{font-family:'icomoon';src:url('fonts/icomoon.woff') format('woff');font-weight:normal;font-style:normal}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
body,html{height:100%;overscroll-behavior:none}
body{
	margin:0;padding:0;
	font:13px/1.5 var(--ff);
	color:var(--fg-0);
	background:var(--bg-deep);
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	background-image:
		radial-gradient(ellipse 600px 400px at 20% 10%,rgba(240,160,48,.06) 0%,transparent 70%),
		radial-gradient(ellipse 500px 500px at 85% 80%,rgba(200,100,20,.04) 0%,transparent 70%);
	background-attachment:fixed;
}
button{
	font:inherit;color:var(--fg-0);background:transparent;
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;-webkit-user-select:none;user-select:none;
	-webkit-touch-callout:none;
}
a{
	color:var(--ac);cursor:pointer;text-decoration:none;
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;-webkit-touch-callout:none;
}
a:hover{color:var(--ac-h);text-shadow:0 0 12px var(--ac-glow)}

.pk_mob input,.pk_mob select,.pk_mob textarea,
.pk_mob .pk_modal .pk_txt,.pk_mob .pk_mt_track input{font-size:16px}
.pk_noselect{-webkit-touch-callout:none;user-select:none;touch-action:manipulation}
.pk_app{width:100%;height:100%}
.pk_inact,.pk_app .pk_inact,.pk_btn.pk_inact{opacity:.35;cursor:default;pointer-events:none}
.pk_grabbing,.pk_grabbing wave{cursor:grabbing!important;cursor:-webkit-grabbing!important}

/* ---------- Header ---------- */
.pk_hdr{
	z-index:7;position:relative;
	height:32px;padding:0 6px;
	background:var(--glass-bg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-bottom:var(--glass-border);
	box-shadow:0 1px 0 rgba(240,160,48,.04);
	display:flex;align-items:center;
}

.pk_hdr .pk_btn{
	float:none;position:relative;
	margin:0 4px;min-width:42px;
	border-radius:var(--r);text-align:center;
	transition:background var(--tr),color var(--tr);
}
.pk_btn button{
	padding:4px 10px;
	border:0;outline:0;background:transparent;color:inherit;
	cursor:pointer;text-decoration:inherit;white-space:nowrap;
	font:inherit;letter-spacing:.3px;
}
.pk_hdr .pk_btn>button{
	border-radius:var(--r);
	transition:background var(--tr),color var(--tr),box-shadow var(--tr);
}

.pk_hdr .pk_btn:hover{background:transparent;color:var(--ac-h)}
.pk_hdr .pk_btn:hover>button{background:var(--ac-soft);color:var(--ac-h)}
.pk_hdr .pk_btn.pk_act{background:transparent;color:var(--ac-ink);text-shadow:none;box-shadow:none}
.pk_hdr .pk_btn.pk_act>button{
	background:linear-gradient(135deg,var(--ac) 0%,#e89020 100%);
	color:var(--ac-ink);
	box-shadow:var(--glow-md);
}

.pk_hdr .pk_btn .pk_menu{
	position:absolute;top:30px;left:-2px;
	min-width:210px;min-height:20px;
	max-height:calc(100vh - 44px);overflow-x:hidden;overflow-y:auto;
	padding:6px 0;
	background:rgba(16,12,8,.94);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border:var(--glass-border);border-radius:var(--r-md);
	box-shadow:var(--glass-shadow),var(--glass-inset);
	opacity:0;z-index:-1;visibility:hidden;display:none;
	transition:opacity var(--tr);
}
.pk_hdr .pk_btn.pk_vis .pk_menu{display:block}
.pk_hdr .pk_btn.pk_act .pk_menu{z-index:5;opacity:1;visibility:visible;display:block}
.pk_hdr .pk_btn .pk_menu_el .pk_act{background:var(--ac-soft);color:var(--ac-h)}
.pk_sloop{display:block;width:100%;height:96px;background:#000;cursor:ew-resize;margin:0 0 4px}
.pk_sloop_meta{color:var(--fg-2);font-size:12px;margin-bottom:4px}

.pk_hdr .pk_btn .pk_shrtct{
	color:var(--fg-2);margin-left:var(--s4);
	font-size:.88em;text-align:right;font-family:var(--ff-mono);
}

.pk_hdr .pk_btn .pk_menu_el button{
	display:flex;justify-content:space-between;
	width:100%;margin:0;padding:6px 14px;
	text-align:left;color:var(--fg-0);border-radius:4px;margin:1px 4px;
	width:calc(100% - 8px);
}
.pk_hdr .pk_btn .pk_menu_el:hover button{
	background:var(--ac-soft);color:var(--ac-h);
	box-shadow:inset 0 0 12px rgba(240,160,48,.06);
}

/* ---------- Toolbar ---------- */
.pk_tbc{
	position:relative;overflow:visible;
	-webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.pk_tbc::-webkit-scrollbar{width:0;height:0}
.pk_tbhint{
	position:fixed;right:8px;z-index:8;width:24px;height:24px;
	border-radius:20px;background:rgba(0,0,0,.55);color:var(--ac);
	font:28px/22px var(--ff);text-align:center;pointer-events:none;
	animation:pk_tbh 3s ease forwards;
}
@keyframes pk_tbh{
	0%,100%{opacity:0;transform:translateX(0)}
	15%,65%{opacity:1}
	35%{transform:translateX(-8px)}
}

.pk_tb{
	position:relative;z-index:6;
	min-width:560px;height:52px;
	padding:6px 0 6px 14px;
	background:var(--glass-bg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-bottom:var(--glass-border);
	white-space:nowrap;
}
.pk_mt_on .pk_tbc{
	overflow-x:scroll;overflow-y:hidden;
	background:var(--glass-bg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-bottom:var(--glass-border);
}
.pk_mt_on .pk_tb{display:inline-block;min-width:max-content;border-bottom:none}

.pk_total_dur,.pk_hover_dur{
	position:absolute;right:10px;top:6px;
	color:var(--fg-1);font-size:12px;
	font-variant-numeric:tabular-nums;
}
.pk_hover_dur{top:28px;color:var(--fg-2)}

.pk_inpfile{position:absolute;width:1px;height:1px;visibility:hidden;overflow:hidden;z-index:-1}

/* Empty state / loading */
.pk_tmpMsg{
	position:absolute;left:50%;top:50%;
	width:340px;margin:-40px 0 0 -170px;
	height:100px;z-index:6;
	font-size:16px;color:var(--fg-1);text-align:center;line-height:32px;
	letter-spacing:.5px;
}
.pk_tmpMsg2{
	position:fixed;inset:0;z-index:10;
	display:none;flex-direction:column;justify-content:center;
	background:rgba(13,10,7,.82);
	backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
	font-size:16px;text-align:center;cursor:progress!important;
}
.pk_tmpMsg2.pk_act{display:flex}

.pk_mload{
	width:220px;height:3px;margin:25px auto 0;
	position:relative;background:rgba(240,160,48,.08);
	border-radius:4px;overflow:hidden;
}
.pk_mload>div:before{
	content:" ";position:absolute;left:0;
	height:100%;width:100%;
	background:linear-gradient(90deg,transparent,var(--ac),var(--ac-h),var(--ac),transparent);
	box-shadow:0 0 14px var(--ac-glow);
	transform:scaleX(0) translate3d(0,0,0);
	transform-origin:0 0;will-change:transform;z-index:1;
	border-radius:4px;
}
.pk_act .pk_mload>div:before{animation:pk_loader_anim 2s ease-in-out infinite}

.pk_prc{margin-top:20px;padding-bottom:7px;font-size:14px;text-align:center}
.pk_prc span{margin-right:10px}
.pk_prc button{
	padding:5px 14px;
	background:var(--ac-soft);color:var(--ac);
	border:1px solid var(--bd-h);border-radius:var(--r-xl);outline:0;
	font-weight:500;
	transition:all var(--tr);
}
.pk_prc button:hover{
	background:var(--ac);color:var(--ac-ink);
	box-shadow:var(--glow-md);
}

/* Time display */
.pk_timecontainer{
	float:left;width:236px;height:50px;margin-right:var(--s3);
	position:relative;contain:strict;
	background:rgba(10,7,4,.6);
	backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
	border:1px solid rgba(240,160,48,.08);border-radius:var(--r-md);
	box-shadow:var(--glass-inset),inset 0 0 24px rgba(240,160,48,.04);
	color:var(--fg-0);
}
.pk_mob .pk_timecontainer{cursor:pointer}
.pk_mob .pk_timing{font-size:18px;letter-spacing:0;padding:15px 0 0 10px}
.pk_timing{
	display:block;position:absolute;z-index:2;
	padding:10px 0 0 14px;
	font:30px/1 var(--ff);
	font-weight:300;
	font-variant-numeric:tabular-nums;
	letter-spacing:2px;text-align:left;
	color:var(--fg-0);
}
.pk_timingcnv{display:block;position:absolute;z-index:2;left:6px}

/* Toolbar groups */
.pk_btngroup{float:left}
.pk_mt_on .pk_timecontainer,.pk_mt_on .pk_btngroup,
.pk_mt_on .pk_selection,.pk_mt_on .pk_ctns,.pk_mt_on .pk_transport{
	float:none;display:inline-block;vertical-align:top;
}
.pk_selection,.pk_ctns,.pk_transport{
	float:left;height:50px;padding:0 4px;margin-right:var(--s3);
	min-width:340px;
	border:1px solid rgba(240,160,48,.07);border-radius:var(--r-md);
	background:linear-gradient(180deg,rgba(20,15,10,.5) 0%,rgba(14,10,7,.4) 100%);
	backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
	box-shadow:var(--glass-inset);
}
.pk_selection{margin-right:0}
.pk_ctns{min-width:40px}

.pk_mtbeat{
	display:none;float:left;grid-template-columns:34px 42px auto 34px;
	grid-template-rows:19px 19px;gap:0 4px;align-items:center;height:50px;
	padding:3px 8px;margin-right:var(--s3);
	border:1px solid rgba(240,160,48,.07);border-radius:var(--r-md);
	background:linear-gradient(180deg,rgba(20,15,10,.5) 0%,rgba(14,10,7,.4) 100%);
	backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
	box-shadow:var(--glass-inset);
}
.pk_mt_on .pk_mtbeat{float:none;display:inline-grid;vertical-align:top}
.pk_tb .pk_mtbeat .pk_mtbeat_btn{
	grid-column:1;grid-row:1;width:34px;height:18px;margin:0;
	font:8px/18px var(--ff-mono);
	letter-spacing:.4px;color:var(--ac);
	box-shadow:inset 0 0 0 1px rgba(240,160,48,.18);border-radius:var(--r);
}
.pk_tb .pk_mtbeat .pk_mtbeat_btn.pk_act{
	background:linear-gradient(135deg,var(--ac),#e89020);
	color:var(--ac-ink);box-shadow:var(--glow-sm);
}
.pk_tb .pk_mtbeat .pk_mtbeat_snap{grid-row:2;margin-top:2px;color:var(--fg-1)}
.pk_tb .pk_mtbeat .pk_mtbeat_sig{
	grid-column:4;grid-row:1/3;width:34px;height:28px;margin:0;
	font:10px/28px var(--ff-mono);color:var(--fg-1);
}
.pk_tb .pk_mtbeat .pk_mtbeat_sig:hover{color:var(--ac-h)}
.pk_mtbeat_bpm{
	grid-column:2;grid-row:1/3;width:42px;height:28px;margin:0;padding:0 4px;
	background:rgba(10,7,4,.6);color:var(--fg-0);
	border:1px solid var(--bd-s);border-radius:var(--r);outline:0;
	-moz-appearance:textfield;
	font:12px/28px var(--ff-mono);text-align:center;
}
.pk_mtbeat_bpm:focus{border-color:var(--ac);box-shadow:var(--glow-sm)}
.pk_mtbeat_bpm::-webkit-outer-spin-button,
.pk_mtbeat_bpm::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pk_mtbeat b{grid-column:3;grid-row:1/3;font:9px/28px var(--ff-mono);color:var(--fg-2)}
.pk_mtbeat_rng{z-index:16}

/* Toolbar buttons */
.pk_tb .pk_btn{
	font-family:'icomoon';
	display:inline-block;position:relative;
	width:40px;height:40px;margin:4px 3px;padding:0;
	font-size:1.3em;line-height:25px;text-align:center;
	border:0;border-radius:var(--r);outline:0;
	color:var(--fg-1);background:transparent;
	transition:all var(--tr);
}
.pk_tb .pk_btn:not(.pk_act):hover{
	background:var(--ac-soft);color:var(--ac-h);
	box-shadow:var(--bd-glow),var(--glow-sm);
}
.pk_tb .pk_btn:active{
	background:rgba(240,160,48,.06);
	box-shadow:inset 0 2px 6px rgba(0,0,0,.3);
}

/* Tooltips */
.pk_ftr .pk_btn span,
.pk_tb .pk_btn span,
.pk_mt_head button span,
.pk_mt_track button span,
.pk_mt_knob span{
	position:absolute;left:50%;bottom:-31px;
	display:block;padding:0 8px;
	transform:translate(-50%,0);
	background:rgba(10,7,4,.92);color:var(--fg-0);
	font:11px/26px var(--ff);letter-spacing:normal;font-weight:400;
	white-space:nowrap;border-radius:var(--r);
	box-shadow:0 4px 12px rgba(0,0,0,.4);
	visibility:hidden;opacity:0;pointer-events:none;
	user-select:none;transition:opacity 200ms 180ms;z-index:6;
}
.pk_ftr .pk_btn:hover span,
.pk_tb .pk_btn:hover span,
.pk_mt_head button:hover span,
.pk_mt_track button:hover span,
.pk_mt_knob:hover span{visibility:visible;opacity:1}

.pk_ftr .pk_btn.pk_inact:hover span,
.pk_tb .pk_btn.pk_inact:hover span,
.pk_mt_head button.pk_inact:hover span{visibility:hidden;opacity:0}
.pk_mt_head .pk_mt_add span{left:0;transform:none}
.pk_tb .pk_btn span{display:none}

.pk_ttip{
	position:fixed;z-index:20;
	padding:0 8px;background:rgba(10,7,4,.92);color:var(--fg-0);
	font:11px/26px var(--ff);letter-spacing:normal;font-weight:400;
	white-space:nowrap;border-radius:var(--r);
	box-shadow:0 4px 12px rgba(0,0,0,.4);
	visibility:hidden;opacity:0;pointer-events:none;user-select:none;
	transition:opacity 200ms 180ms;
}
.pk_ttip.pk_act{visibility:visible;opacity:1}
.pk_mob .pk_ftr .pk_btn span,.pk_mob .pk_tb .pk_btn span{visibility:hidden;display:none}
.pk_mob .pk_tb .pk_btn:not(.pk_act):hover{box-shadow:none}

/* Selection panel */
.pk_selection .pk_sellist{margin:5px;width:346px;color:var(--fg-0)}
.pk_sellist .pk_title{float:left;line-height:38px;color:var(--fg-1)}
.pk_selection .pk_sellist div{float:left;width:40px;margin:0 10px;text-align:center}
.pk_selection .title{display:block;line-height:18px;color:var(--fg-2);font-size:11px}
.pk_selection .pk_dat{
	display:inline-block;min-width:14px;padding:3px 6px;
	background:rgba(10,7,4,.5);color:var(--ac-h);
	border-radius:var(--r);font-family:var(--ff-mono);
	font-size:11px;line-height:16px;font-weight:500;
	font-variant-numeric:tabular-nums;
}

.pk_btn.icon-clearsel{
	font-family:var(--ff);
	width:92px;min-height:30px;margin:0 0 0 var(--s3);padding:4px 6px;
	font-size:11px;line-height:1.15;
	border:1px solid var(--bd);border-radius:var(--r);
	white-space:normal;word-break:normal;overflow-wrap:normal;
	display:inline-flex;align-items:center;justify-content:center;text-align:center;
}
.pk_btn.icon-clearsel:hover{
	background:var(--ac-soft);color:var(--ac-h);
	border-color:var(--bd-h);box-shadow:var(--glow-sm);
}

/* ---------- Waveform ---------- */
.pk_av_cont{position:relative;touch-action:none;overscroll-behavior:none}
.pk_av{
	clear:both;width:calc(100% - 64px);margin:0 0 0 48px;
	position:relative;overflow:hidden;contain:content;
	background:rgba(8,5,3,.5);
	backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
	border:1px solid rgba(240,160,48,.05);
	box-shadow:inset 0 0 40px rgba(240,160,48,.02),inset 0 1px 0 rgba(255,220,140,.03);
	overscroll-behavior:none;
	border-radius:var(--r);
}
.pk_av wave{cursor:text}
.pk_av canvas{opacity:0;transition:opacity 500ms}

#pk_prgwv{
	position:absolute;left:0;top:0;bottom:0;
	width:2px;background:var(--pl);
	box-shadow:0 0 10px rgba(255,122,26,.8),0 0 3px rgba(255,122,26,.4);
	transform:translate3d(0,0,0);
	z-index:3;display:none;pointer-events:none;
	border-radius:1px;
}

.pk_wave_cursor{
	position:absolute;left:0;top:0;bottom:0;
	width:1px;margin-left:-2px;z-index:5;
	border-right:1px dashed var(--warn);
	transform:translate3d(0,0,0);pointer-events:none;
}

.pk_wavepoint{
	position:absolute;top:0;width:2px;height:100%;
	background:var(--ac-h);
	box-shadow:0 0 6px var(--ac-glow);
	transform:translate3d(0,0,0);
	pointer-events:none;display:none;
	border-radius:1px;
}

.pk_mrkrl{
	position:absolute;left:0;right:0;top:0;bottom:0;
	z-index:7;overflow:visible;pointer-events:none;
}
.pk_mrkr{
	position:absolute;left:0;top:0;width:9px;height:24px;
	color:var(--solo);transform:translate3d(0,0,0);
	pointer-events:auto;cursor:pointer;
}
.pk_mrkr:before,.pk_mrkr:after{content:"";position:absolute;pointer-events:none}
.pk_mrkr:before{
	left:-4px;top:16px;
	width:0;height:0;border-left:4px solid transparent;
	border-right:4px solid transparent;border-top:7px solid currentColor;
}
.pk_mrkr:after{left:0;top:24px;width:1px;height:var(--m);background:currentColor;opacity:.5}
.pk_mrkr b{
	display:none;position:absolute;left:7px;top:2px;
	max-width:116px;height:15px;padding:0 4px;
	overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
	background:rgba(10,7,4,.9);color:var(--fg-0);
	border:1px solid var(--bd);border-radius:var(--r);font:10px/13px var(--ff);
	font-weight:400;pointer-events:none;
}
.pk_mrkr:hover b,.pk_mrkr.pk_act b{display:block}

/* ---------- Multitrack ---------- */
.pk_mt{
	display:none;position:relative;z-index:0;
	height:0;min-height:0;
	background:var(--glass-bg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-bottom:var(--glass-border);
	box-sizing:border-box;overflow:hidden;overscroll-behavior:none;
}
.pk_mt_on .pk_av_cont{display:none}
.pk_mt_on .pk_mt{display:flex}
.pk_mt_on .pk_zoombtn .pk_zoom_out_v,
.pk_mt_on .pk_zoombtn .pk_zoom_in_v{display:block!important;z-index:12}
.pk_mob.pk_mt_on .pk_zoombtn .pk_zoom_out_v,
.pk_mob.pk_mt_on .pk_zoombtn .pk_zoom_in_v{display:none!important}
.pk_mt_on .pk_ftr{position:relative;z-index:6}

.pk_mt_side{
	flex:0 0 178px;width:178px;position:relative;z-index:6;
	background:rgba(16,12,8,.85);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-right:var(--glass-border);
}
.pk_mt_tracks_wrap{
	position:absolute;top:24px;left:0;right:0;bottom:0;
	overflow-x:hidden;overflow-y:auto;scrollbar-width:none;padding-bottom:64px;
}
.pk_mt_tracks_wrap::-webkit-scrollbar{display:none}

.pk_mt_head,.pk_mt_ruler{
	height:24px;line-height:24px;
	background:rgba(20,15,10,.75);
	backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
	border-bottom:1px solid rgba(240,160,48,.08);
	color:var(--ac);font-size:11px;font-family:var(--ff-mono);
}
.pk_mt_head{display:flex;align-items:center;gap:4px;padding:0 6px}
.pk_mt_head>span{
	flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
	letter-spacing:.8px;text-transform:uppercase;font-size:10px;font-weight:600;
}

.pk_mt_head button{
	width:22px;height:18px;margin:0;padding:0;
	background:rgba(10,7,4,.5);color:var(--ac);
	border:1px solid var(--bd-s);border-radius:4px;outline:0;
	font-size:11px;line-height:18px;text-align:center;
	cursor:pointer;position:relative;overflow:visible;
	transition:all var(--tr);
}
.pk_mt_head .pk_mt_add{width:28px;font-size:15px;line-height:16px;margin-right:1px}
.pk_mt_head .pk_mt_clear{
	background:rgba(10,7,4,.5);color:var(--fg-2);
	border:1px solid var(--bd-s);
}
.pk_mt_head button:hover{
	box-shadow:var(--bd-glow),var(--glow-sm);
	border-color:var(--bd-h);
}
.pk_mt_head button.pk_inact{cursor:default;opacity:.35;pointer-events:none}
.pk_mt_head button.pk_inact:hover{box-shadow:none}
.pk_mt_head button.pk_mt_mute.pk_act{
	background:rgba(232,48,80,.15);color:var(--rec);
	border-color:rgba(232,48,80,.4);box-shadow:0 0 10px var(--rec-glow);
}
.pk_mt_head button.pk_mt_solo.pk_act{
	background:rgba(240,192,32,.15);color:var(--solo);
	border-color:rgba(240,192,32,.4);box-shadow:0 0 10px var(--solo-glow);
}

/* Track sidebar entries */
.pk_mt_tracks{position:relative;will-change:transform}
.pk_mt_track{
	position:relative;height:88px;padding:7px 6px;box-sizing:border-box;
	background:rgba(18,13,8,.55);
	backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
	border-bottom:1px solid rgba(240,160,48,.06);
}
.pk_mt_track.pk_mt_sel{background:rgba(240,160,48,.05)}

.pk_mt_track input{
	display:block;box-sizing:border-box;
	width:calc(100% - 31px);height:24px;
	margin:0 0 10px;padding:0 6px;
	background:rgba(10,7,4,.5);color:var(--fg-0);
	border:1px solid var(--bd-s);border-radius:var(--r);outline:0;
	font:12px var(--ff);cursor:text;
	-webkit-user-select:text;user-select:text;
	transition:all var(--tr);
}
.pk_mt_track input:focus{border-color:var(--ac);box-shadow:var(--glow-sm)}

.pk_mt_track button{
	background:rgba(10,7,4,.5);color:var(--fg-0);
	border:1px solid var(--bd-s);border-radius:4px;
	cursor:pointer;position:relative;overflow:visible;
	transition:all var(--tr);
}
.pk_mt_track button{width:25px;height:24px;margin-right:5px;font-size:11px}
.pk_mt_track button:hover{box-shadow:var(--bd-glow),var(--glow-sm)}
.pk_mt_track button:active{box-shadow:inset 0 2px 6px rgba(0,0,0,.4)}
.pk_mt_track button.pk_act{
	background:linear-gradient(135deg,var(--ac),#e89020);
	color:var(--ac-ink);border-color:var(--ac);
}
.pk_mt_track button.pk_mt_mute.pk_act{
	background:rgba(232,48,80,.15);color:var(--rec);
	border-color:rgba(232,48,80,.4);
}
.pk_mt_track button.pk_mt_solo.pk_act{
	background:rgba(240,192,32,.15);color:var(--solo);
	border-color:rgba(240,192,32,.4);
}
.pk_mt_track button.pk_mt_rec.pk_act{
	background:rgba(232,48,80,.2);color:var(--rec);
	border-color:var(--rec);box-shadow:0 0 8px var(--rec-glow);
}

.pk_mt_track .pk_mt_rec{position:absolute;right:6px;top:41px;margin:0}
.pk_mt_track .pk_mt_del{position:absolute;right:4px;top:7px;margin:0;color:var(--fg-2)}
.pk_mt_track .pk_mt_rec span,.pk_mt_track .pk_mt_del span{left:auto;right:0;transform:none}

.pk_mt_track.pk_mt_compact input{height:22px;margin-bottom:7px}
.pk_mt_track.pk_mt_compact .pk_mt_rec{top:36px}
.pk_mt_track.pk_mt_compact .pk_mt_knob:after{display:none}
.pk_mt_track.pk_mt_tiny input{height:20px;margin-bottom:5px}
.pk_mt_track.pk_mt_tiny .pk_mt_mute,.pk_mt_track.pk_mt_tiny .pk_mt_solo{height:20px}
.pk_mt_track.pk_mt_tiny .pk_mt_knob,.pk_mt_track.pk_mt_tiny .pk_mt_rec{display:none}

/* Knobs */
.pk_mt_knob{
	display:inline-block;position:relative;
	width:24px;height:24px;margin-right:5px;
	background:rgba(10,7,4,.6);
	border:1px solid var(--bd-s);border-radius:50%;
	box-shadow:var(--glass-inset),0 2px 6px rgba(0,0,0,.3);
	cursor:move;vertical-align:bottom;
	transition:all var(--tr);
}
.pk_mt_knob:hover{border-color:var(--bd-h);box-shadow:var(--glass-inset),var(--glow-sm)}
.pk_mt_knob:before{
	position:absolute;left:0;right:0;bottom:3px;
	font-size:6px;line-height:6px;text-align:center;
	pointer-events:none;letter-spacing:.5px;
}
.pk_mt_track .pk_mt_knob:before{top:-9px;bottom:auto;font-size:7px;line-height:7px}
.pk_mt_pan:before{content:"L/R";color:var(--ac-2)}
.pk_mt_vol:before{content:"VOL";color:var(--fg-2)}
.pk_mt_knob:after{
	content:attr(data-val);
	position:absolute;left:-9px;top:25px;width:42px;
	color:var(--fg-2);font:9px var(--ff-mono);
	font-variant-numeric:tabular-nums;text-align:center;
}
.pk_mt_knob i{
	position:absolute;left:10px;top:3px;
	width:2px;height:9px;
	background:var(--ac);box-shadow:0 0 4px var(--ac-glow);
	transform-origin:1px 9px;border-radius:1px;
}
.pk_mt_vol i{background:var(--fg-1);box-shadow:0 0 4px rgba(191,160,106,.3)}

.pk_mt_resize{position:absolute;left:0;right:0;bottom:0;height:9px;cursor:ns-resize;z-index:3}

/* Main multitrack canvas */
.pk_mt_main{
	flex:1 1 auto;position:relative;
	overflow-x:hidden;overflow-y:auto;
	background:rgba(8,5,3,.4);outline:0;
	overscroll-behavior:none;padding-bottom:64px;
}

.pk_mt_empty{z-index:2;pointer-events:none}
.pk_mt_empty a{
	margin-left:5px;padding:6px 20px;
	white-space:nowrap;font-size:.94em;
	border:1px solid var(--ac);border-radius:var(--r-xl);
	pointer-events:auto;
	box-shadow:var(--glow-md),inset 0 0 16px rgba(240,160,48,.06);
	transition:all var(--tr);
}
.pk_mt_empty a:hover{
	background:linear-gradient(135deg,var(--ac),#e89020);
	color:var(--ac-ink);text-shadow:none;
	box-shadow:var(--glow-lg);
}

.pk_mt_ruler{position:sticky;top:0;z-index:9}
.pk_mt_timeline{position:absolute;top:0;pointer-events:none}
.pk_mt_tick{
	position:absolute;top:0;height:24px;min-width:54px;
	box-sizing:border-box;text-align:center;
	color:var(--fg-2);font:10px/12px var(--ff-mono);
	font-variant-numeric:tabular-nums;
	transform:translateX(-50%);pointer-events:none;
}
.pk_mt_tick:after{
	content:"";position:absolute;left:50%;top:16px;
	height:8px;border-left:1px solid rgba(240,160,48,.12);
}
.pk_mt_ruler,.pk_mt_lanes,.pk_mt_lane{cursor:text}
.pk_mt_lanes{
	position:relative;
	background:repeating-linear-gradient(to right,rgba(240,160,48,.03) 0,rgba(240,160,48,.03) 1px,transparent 1px,transparent 86px);
}
.pk_mt_lanes.pk_mt_beats{background:rgba(8,5,3,.4)}
.pk_mt_beatgrid{position:absolute;left:0;top:0;z-index:1;pointer-events:none}

.pk_mt_region{display:none;position:absolute;top:24px;cursor:move;z-index:2}
.pk_mt_region .wavesurfer-handle{position:absolute;left:0;top:0;width:1%;max-width:4px;height:100%;cursor:col-resize}
.pk_mt_region .wavesurfer-handle-end{left:100%}

.pk_mt_lane{
	position:absolute;left:0;right:0;height:88px;box-sizing:border-box;
	border-bottom:1px solid rgba(240,160,48,.05);
}
.pk_mt_lane.pk_mt_sel{background:rgba(240,160,48,.03)}

.pk_mt_clip{
	position:absolute;top:8px;height:60px;min-width:36px;
	background:rgba(240,160,48,.08);
	border:1px solid rgba(200,136,42,.35);border-radius:var(--r-md);
	box-shadow:inset 0 1px 0 rgba(255,220,140,.06),0 2px 6px rgba(0,0,0,.2);
	overflow:hidden;contain:content;cursor:default;z-index:2;
}
.pk_mt_clip.pk_mt_clip_sel{
	border-color:var(--ac-h);
	box-shadow:inset 0 0 0 1px rgba(240,160,48,.3),var(--glow-sm),0 4px 12px rgba(0,0,0,.3);
	cursor:grab;z-index:7;
}
.pk_mt_clip.pk_drag{
	cursor:grabbing;z-index:8;
	box-shadow:var(--glow-md),0 8px 24px rgba(0,0,0,.4);
}
.pk_mt_clip.pk_mt_clip_muted{opacity:.45}
.pk_mt_clip canvas{display:block;width:100%;height:calc(100% - 8px)}

.pk_mt_trim{position:absolute;top:0;bottom:0;width:8px;z-index:2;cursor:ew-resize}
.pk_mt_trim_l{left:0}
.pk_mt_trim_r{right:0}
.pk_mt_fade{position:absolute;top:0;width:10px;height:12px;z-index:3;cursor:ew-resize}
.pk_mt_fade:before{content:"";position:absolute;top:0;width:0;height:0;border-top:9px solid var(--ac-h)}
.pk_mt_fade_l:before{left:0;border-right:9px solid transparent}
.pk_mt_fade_r:before{right:0;border-left:9px solid transparent}
.pk_mt_trim:after{
	content:"";position:absolute;top:8px;bottom:10px;left:3px;
	border-left:1px solid rgba(240,160,48,.5);
	opacity:0;transition:opacity var(--tr);
}
.pk_mt_clip:hover .pk_mt_trim:after,
.pk_mt_clip.pk_mt_clip_sel .pk_mt_trim:after{opacity:1}

.pk_mt_clip span{
	position:absolute;left:5px;right:5px;bottom:1px;
	overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
	color:var(--fg-0);font:10px/11px var(--ff);
	text-shadow:0 1px 3px rgba(0,0,0,.6);
}
.pk_mt_clip em{
	position:absolute;top:2px;right:3px;
	padding:0 3px;
	background:var(--warn);color:var(--ac-ink);
	border-radius:3px;
	font:9px/12px var(--ff);font-style:normal;font-weight:600;
}
.pk_mt_clip.pk_mt_clip_xf{border-color:var(--ac)}
.pk_mt_clip.pk_mt_rec_clip{
	z-index:9;background:rgba(232,48,80,.08);
	border-color:var(--rec);
	box-shadow:0 0 8px var(--rec-glow);
	pointer-events:none;
}

.pk_mt_playhead,.pk_mt_marker{
	position:absolute;left:0;top:24px;width:1px;
	pointer-events:none;will-change:transform;
}
.pk_mt_playhead{background:var(--pl);box-shadow:0 0 8px rgba(255,122,26,.7);z-index:11;border-radius:1px}
.pk_mt_marker{margin-left:-2px;border-right:1px dashed var(--warn);z-index:12}

/* Multitrack toggle button */
.pk_mt_topbtn{
	margin-left:auto;margin-right:6px;
	height:22px;padding:0 14px;
	background:var(--ac-soft);
	color:var(--ac);
	border:1px solid rgba(240,160,48,.2);border-radius:var(--r-xl);
	box-shadow:var(--glass-inset);
	font:bold 11px/20px var(--ff);letter-spacing:.5px;
	white-space:nowrap;cursor:pointer;outline:0;
	transition:all var(--tr);
}
.pk_mt_topbtn:hover{
	color:var(--ac-h);border-color:var(--ac);
	box-shadow:var(--glow-md),inset 0 0 12px var(--ac-soft);
}
.pk_mt_topbtn:active{transform:translateY(1px)}
.pk_mt_topbtn.pk_act{
	color:var(--ac-ink);border-color:var(--ac);
	background:linear-gradient(135deg,var(--ac),#e89020);
	box-shadow:var(--glow-lg),inset 0 1px 0 rgba(255,255,255,.25);
}
.pk_mt_topbtn em{
	display:inline-block;margin-left:8px;padding:1px 5px 0;
	background:var(--ac);color:var(--ac-ink);
	border-radius:3px;
	font:bold 8px/11px var(--ff);font-style:normal;
	letter-spacing:1px;text-transform:uppercase;vertical-align:1px;
}
.pk_mt_topbtn.pk_act em{background:var(--ac-ink);color:var(--ac)}

/* ---------- Footer ---------- */
.pk_ftr{
	padding:8px 14px var(--s2);
	background:var(--glass-bg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border-top:var(--glass-border);
	box-shadow:inset 0 1px 0 rgba(240,160,48,.04);
}

.pk_volpar{
	position:relative;width:100%;height:5px;
	background:linear-gradient(to right,var(--ok) 0%,var(--ac) 40%,var(--warn) 75%,var(--rec) 100%);
	border-radius:3px;overflow:hidden;
}
.pk_volpar:last-child{margin-top:2px}
.pk_vol{
	position:absolute;right:0;top:0;bottom:0;width:100%;
	background:rgba(13,10,7,.88);
	z-index:1;pointer-events:none;
	transform:translate3d(0,0,0);
}
.pk_peaker{
	position:absolute;right:0;top:0;height:100%;width:12px;
	background:rgba(13,10,7,.88);border-left:2px solid var(--bd);
	z-index:2;border-radius:0 3px 3px 0;
}
.pk_peaker.pk_act{
	background:var(--rec);border-color:var(--rec);
	box-shadow:0 0 10px var(--rec-glow);
}

.pk_markers{
	position:relative;width:100%;margin-top:4px;
	border-right:12px solid transparent;
	box-sizing:border-box;text-align:left;
	color:var(--fg-2);font:10px var(--ff-mono);
	font-variant-numeric:tabular-nums;letter-spacing:.5px;
}
.pk_mark1{display:inline-block;width:2.777%}
.pk_mark1:last-child{position:absolute;right:0;text-align:right}

/* Zoom */
.pk_zoombtn{float:left;padding-right:4px;position:relative}
.pk_zoombtn button{
	width:26px;height:18px;margin-right:6px;padding:0;
	background:rgba(10,7,4,.5);color:var(--ac);
	border:1px solid var(--bd-s);border-radius:var(--r);outline:0;
	font:bold 12px/16px var(--ff-mono);cursor:pointer;
	transition:all var(--tr);
}
.pk_zoombtn button:hover{border-color:var(--ac);box-shadow:var(--glow-sm)}
.pk_zoombtn .pk_zoom_out_v,.pk_zoombtn .pk_zoom_in_v{position:absolute;left:0;top:-50px}
.pk_zoombtn .pk_zoom_in_v span,.pk_zoombtn .pk_zoom_out_v span{margin-left:40px}
.pk_zoombtn .pk_zoom_out_v{top:-26px}
.pk_mob .pk_zoom_in_v,.pk_mob .pk_zoom_out_v{display:none}

/* Pan toggle */
.pk_panner{position:absolute;left:0;top:0;width:48px;height:100%}
.pk_mono .pk_panner{display:none!important}
.pk_pan_left{position:absolute;left:14px;top:0;height:50%}
.pk_pan_right{position:absolute;left:14px;top:50%;height:50%}
.pk_pan_btn{
	position:absolute;left:20%;top:30%;
	width:24px;height:40%;padding:0;margin:0;
	background:rgba(10,7,4,.5);color:var(--ac-2);
	border:1px solid var(--bd-s);border-radius:var(--r);
	font-size:10px;text-align:center;white-space:nowrap;word-break:break-all;outline:0;
	transition:all var(--tr);
}
.pk_pan_btn strong{display:block;font-size:12px}
.pk_pan_btn:active{background:var(--ac-soft);color:var(--ac-h)}

/* ---------- Context menu ---------- */
.pk_contextMenu{
	position:absolute;z-index:99999;
	min-width:170px;margin:1px 0 0;padding:5px 0;
	background:rgba(16,12,8,.95);color:var(--fg-0);
	border:1px solid rgba(240,160,48,.12);border-radius:var(--r-md);
	box-shadow:var(--glass-shadow),0 0 20px rgba(240,160,48,.06);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	background-clip:padding-box;font:13px var(--ff);
}
.pk_contextMenu div{position:relative}
.pk_contextMenu a,.pk_contextMenu a:hover{
	display:block;clear:both;
	margin:1px 4px;padding:6px 12px;
	color:var(--fg-0);font:13px/18px var(--ff);font-weight:normal;
	white-space:nowrap;cursor:pointer;
	border-radius:4px;
	transition:background 100ms var(--ease),color 100ms var(--ease);
}
.pk_contextMenu a:hover{background:var(--ac-soft);color:var(--ac-h);text-decoration:none}

/* ---------- Wave scrollbar ---------- */
.pk_wavescroll{
	position:relative;height:14px;margin-bottom:10px;
	background:rgba(10,7,4,.5);
	border:1px solid rgba(240,160,48,.06);border-radius:var(--r);
	overflow:hidden;contain:strict;overscroll-behavior:none;
	-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;
}
.pk_wavedrag{cursor:grab;border-radius:var(--r);transform:translate3d(0,0,0)}
.pk_wavedrag.pk_drag{cursor:grabbing}
.pk_wavedrag.pk_inact{cursor:default;border-radius:0}
.pk_wavescroll .pk_wavedrag{
	display:block;position:absolute;
	width:100%;min-width:50px;height:100%;
	background:linear-gradient(180deg,rgba(240,160,48,.2) 0%,rgba(200,120,20,.15) 100%);
	box-shadow:var(--glass-inset);
}
.pk_wavescroll .pk_wavedrag_l,.pk_wavescroll .pk_wavedrag_r{width:12px;height:100%;cursor:col-resize}
.pk_wavescroll .pk_wavedrag_l{float:left}
.pk_wavescroll .pk_wavedrag_r{float:right}

/* Play/loop active */
.pk_play.pk_act{
	background:linear-gradient(135deg,var(--rec),#c02040);
	color:#fff;box-shadow:0 0 12px var(--rec-glow);
}
.pk_loop.pk_act{
	background:linear-gradient(135deg,var(--warn),#d08010);
	color:var(--ac-ink);box-shadow:0 0 10px rgba(240,144,32,.35);
}

/* WaveSurfer regions */
.wavesurfer-region{
	background:linear-gradient(120deg,rgba(240,160,48,.22),rgba(255,122,26,.18))!important;
	mix-blend-mode:screen;
	box-shadow:inset 0 0 0 1px rgba(255,220,140,.12);
}

/* ---------- Icon glyphs ---------- */
.icon-silence:before{content:"S";height:1px;display:inline-block;font-family:var(--ff)}
.icon-clearsel:before{content:"clear selection"}
.icon-files-empty:before{content:"\e925"}
.icon-file-text2:before{content:"\e926"}
.icon-play3:before{content:"\ea1c"}
.icon-pause2:before{content:"\ea1d"}
.icon-stop2:before{content:"\ea1e"}
.icon-backward2:before{content:"\ea1f"}
.icon-forward3:before{content:"\ea20"}
.icon-previous2:before{content:"\ea23"}
.icon-next2:before{content:"\ea24"}
.icon-loop:before{content:"\ea2d"}
.icon-scissors:before{content:"\ea5a"}

.icon-rec:before{
	content:".";display:inline-block;width:33%;height:33%;
	margin-top:-2px;
	background:rgba(232,48,80,.3);color:transparent;border-radius:50%;
	font-size:0;vertical-align:middle;
}
.icon-rec.pk_act{
	background:var(--rec);
	box-shadow:0 0 12px var(--rec-glow);
	animation:fade_anim .6s steps(6,start) infinite alternate;
}
.icon-rec.pk_act:before{background:var(--bg-0)}
.pk_mob .icon-rec.pk_act{box-shadow:none}

/* ---------- 1up notification ---------- */
.pk_oneup{
	position:fixed;left:50%;top:49%;z-index:15;
	margin:0;padding:12px 18px;
	background:rgba(16,12,8,.92);
	color:var(--fg-0);
	border:1px solid var(--bd-h);border-radius:var(--r-md);
	box-shadow:var(--glow-lg);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	font-size:15px;font-weight:500;letter-spacing:.3px;
	transform:translate(-50%,-50%);
	transition:opacity 300ms var(--ease),margin-top 300ms var(--ease);
	user-select:none;pointer-events:none;
}

/* ---------- Modal ---------- */
.pk_modal_back{
	position:absolute;left:0;top:0;right:0;
	z-index:14;height:100%;display:block;
	background:rgba(8,5,3,.6);
	backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
	overflow:auto;touch-action:manipulation;-webkit-overflow-scrolling:touch;
}
.pk_modal_cnt{
	position:absolute;top:0;
	min-height:100%;min-width:100%;padding:40px 20px;
	box-sizing:border-box;
	display:flex;justify-content:center;align-items:center;
}
.pk_modal{
	position:relative;display:block;
	min-width:360px;min-height:168px;margin:0 auto;
	background:rgba(18,13,8,.96);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border:1px solid rgba(240,160,48,.12);border-radius:var(--r-lg);
	box-shadow:var(--glass-shadow),0 0 40px rgba(240,160,48,.06),var(--glass-inset);
	animation:pk_shw .25s var(--ease-out) 0ms 1;
}
.pk_modal.pk_bigger{min-width:420px}

.pk_modal_title{
	padding:10px 16px;margin-bottom:10px;
	border-bottom:1px solid rgba(240,160,48,.08);
	font:13px var(--ff);letter-spacing:.3px;text-transform:none;
	color:var(--ac-h);font-weight:600;
	text-shadow:0 0 12px var(--ac-glow);
}
.pk_modal_main{position:relative;clear:both;padding:0 16px 52px}
.pk_modal_bottom{
	position:absolute;left:0;right:0;bottom:0;
	height:22px;padding:12px 16px;
	background:rgba(16,12,8,.9);
	border-top:1px solid rgba(240,160,48,.08);
	border-radius:0 0 var(--r-lg) var(--r-lg);
}

.pk_modal_a_bottom{
	display:block;float:right;box-sizing:border-box;
	margin-left:var(--s3);padding:5px 14px;
	color:var(--fg-0);
	border:1px solid var(--bd);border-radius:var(--r-xl);
	font:12px/16px var(--ff);text-align:center;font-weight:500;
	background:transparent;
	transition:all var(--tr);
	-webkit-user-select:none;user-select:none;cursor:pointer;
}
.pk_modal_a_bottom:hover{
	border-color:var(--ac);color:var(--ac-h);
	box-shadow:var(--glow-sm);
}
.pk_modal_a_red{
	float:left;margin-left:2px;
	background:linear-gradient(135deg,var(--rec),#c02040);
	border-color:var(--rec);color:#fff;
}
.pk_modal_a_red:hover{box-shadow:0 0 12px var(--rec-glow);color:#fff}
.pk_modal_cancel{
	border-color:rgba(200,122,122,.35);color:var(--fg-2);
	background:rgba(60,12,16,.3);
}
.pk_modal_cancel:hover{
	border-color:var(--rec);color:#fff;
	background:rgba(110,20,28,.5);box-shadow:0 0 8px var(--rec-glow);
}
.pk_modal_a_accpt{border-color:var(--ac);color:var(--ac)}
.pk_modal_a_accpt:hover{
	color:var(--ac-ink);background:linear-gradient(135deg,var(--ac),#e89020);
	box-shadow:var(--glow-md);
}

.pk_modal_a_bottom.pk_act{background:var(--ac);color:var(--ac-ink);border-color:var(--ac)}
.pk_modal_a_bottom.pk_inact{pointer-events:none}

.pk_modal .pk_txt{
	display:block;margin-top:6px;padding:6px 10px;
	background:rgba(10,7,4,.5);color:var(--fg-0);
	border:1px solid var(--bd-s);border-radius:var(--r);
	outline:0;font:13px var(--ff);
	transition:all var(--tr);
}
.pk_modal .pk_txt:focus{border-color:var(--ac);box-shadow:var(--glow-sm)}

.pk_modal_a_top{
	float:right;display:block;position:relative;
	padding:2px var(--s1);
	color:var(--ac-2);font-size:11px;
}
.pk_modal_a_top.pk_act{color:var(--ac-h);text-decoration:underline}

.pk_modal_a_top span{
	position:absolute;left:50%;top:24px;
	display:block;padding:0 8px;
	transform:translate(-50%,0);
	background:rgba(10,7,4,.92);color:var(--fg-0);
	font:11px/22px var(--ff);letter-spacing:normal;font-weight:400;
	white-space:nowrap;border-radius:var(--r);
	box-shadow:0 4px 12px rgba(0,0,0,.4);
	visibility:hidden;opacity:0;pointer-events:none;
	user-select:none;transition:opacity 200ms 180ms;z-index:6;
}
.pk_modal_a_top:hover span{visibility:visible;opacity:1}
.pk_mob .pk_modal_a_top span{visibility:hidden;display:none}

/* Compressor gain meter */
.pk_grmtr{
	float:left;position:relative;
	width:200px;max-width:60%;height:14px;margin:9px 0;
	background:rgba(10,7,4,.5);
	border:1px solid var(--bd-s);border-radius:var(--r);
	overflow:hidden;
}
.pk_grmtr_f{
	position:absolute;right:0;top:0;bottom:0;
	width:0%;
	background:linear-gradient(to left,var(--ac),var(--warn),var(--rec));
	transition:width 50ms linear;border-radius:var(--r);
}
.pk_grmtr_v{min-width:60px;text-align:right}

.pk_modal_anim{animation:pk_ppr .22s var(--ease) 0ms 1}

/* Modal layout */
.pk_col{float:left;margin-top:8px;text-align:center;position:relative}
.pk_h200 .pk_col{height:220px;width:10%;min-width:38px;max-width:60px}
.pk_dens .pk_h200 .pk_col{max-width:54px;overflow:hidden}
.pk_dens .pk_h200 .pk_val{padding:2px 6px;font-size:11px}
.pk_h200 .pk_col .pk_vert{
	display:inline-block;width:160px;
	margin-left:50%;margin-top:12px;
	transform-origin:80px 80px;
}
.pk_h200 .pk_btm{bottom:10px;font-size:12px}
.pk_h200 .pk_val{margin:0;padding:2px var(--s2);background:rgba(18,13,8,.7)}

.pk_btm{position:absolute;left:0;right:0;bottom:0;user-select:none}
.pk_val{
	min-width:30px;padding:4px 10px;
	background:rgba(18,13,8,.7);
	border-top:1px solid var(--bd-s);border-bottom:1px solid var(--bd);
	border-radius:var(--r-xl);
	font:12px var(--ff-mono);font-variant-numeric:tabular-nums;text-align:center;
	user-select:none;
}
.pk_row .pk_val{float:right;margin:4px 0}
.pk_sel{float:left;max-width:92px}
.pk_sel_edt{
	display:flex;align-items:center;justify-content:center;float:left;
	box-sizing:border-box;
	width:25px;height:25px;margin-left:6px;
	color:var(--fg-2);background:rgba(10,7,4,.5);
	border:1px solid var(--bd-s);border-radius:var(--r);
	font-weight:bold;text-align:center;cursor:pointer;line-height:1;
	visibility:hidden;opacity:0;position:relative;
	transition:opacity 620ms;
}
.pk_sel_edt>span{
	display:block;position:absolute;left:50%;bottom:-30px;
	padding:0 6px;
	background:rgba(10,7,4,.9);color:var(--fg-0);
	border:1px solid var(--bd);border-radius:var(--r);
	font:11px/18px var(--ff);
	white-space:nowrap;letter-spacing:normal;
	transform:translate(-50%,0);
	visibility:hidden;opacity:0;pointer-events:none;
	transition:opacity 200ms 180ms;z-index:6;
}
.pk_sel_edt:hover>span{visibility:visible;opacity:1}

.pk_row{
	clear:both;overflow:hidden;
	margin-bottom:4px;padding:6px 0 12px;
	border-bottom:1px solid rgba(240,160,48,.06);
}
.pk_row:last-child{border:none}
.pk_row input{float:left}
.pk_row label{display:block;margin:0 24px 4px 0}
.pk_row label.pk_line{
	display:block;float:left;
	width:80px;padding-right:6px;margin:8px 0;text-align:center;
}
.pk_lufs_out{display:block;color:var(--fg-0)}
.pk_lufs_note{color:var(--fg-1)}
.pk_lufs_warn{color:var(--warn)}
.pk_norm_rng .pk_horiz,.pk_lufs_rng .pk_horiz{max-width:180px}
.pk_norm_modes .pk_check+label{margin-right:14px;font-size:12px;white-space:nowrap}

/* ---------- Form controls ---------- */
select{
	display:block;height:25px;padding:0 var(--s3);margin:0;
	background:rgba(18,13,8,.7);color:var(--fg-0);
	border:1px solid var(--bd-s);border-radius:var(--r);outline:0;
	font:12px/24px var(--ff);font-weight:normal;
	transition:all var(--tr);
}
select:hover,select:focus{border-color:var(--ac);box-shadow:var(--glow-sm)}
select option{background:rgba(16,12,8,.95);padding:2px 0;margin:2px 0}

/* Range sliders */
.pk_vert,.pk_horiz{
	-webkit-appearance:none;appearance:none;
	-webkit-tap-highlight-color:transparent;
	width:100%;max-width:235px;height:10px;
	margin:10px 0;padding:1px 2px;
	background:rgba(10,7,4,.5);
	border:none;border-radius:14px;
	box-shadow:inset 0 1px 0 0 rgba(0,0,0,.3),inset 0 -1px 0 0 rgba(255,220,140,.04);
	outline:none;
}
.pk_vert{transform:rotate(270deg) translate(0,-5px)}
input.pk_horiz.pk_w180{max-width:200px}
.pk_bigger .pk_horiz{max-width:180px}

.pk_vert::-moz-range-track,.pk_horiz::-moz-range-track{border:inherit;background:transparent}

.pk_vert::-webkit-slider-thumb,.pk_horiz::-webkit-slider-thumb{
	-webkit-appearance:none;
	width:38px;height:18px;
	border:1px solid rgba(240,160,48,.3);border-radius:12px;
	background:linear-gradient(180deg,rgba(240,160,48,.3) 0%,rgba(200,120,20,.5) 100%);
	cursor:pointer;
	box-shadow:0 2px 6px rgba(0,0,0,.3);
}
.pk_vert::-moz-range-thumb,.pk_horiz::-moz-range-thumb{
	width:38px;height:18px;
	border:1px solid rgba(240,160,48,.3);border-radius:12px;
	background:linear-gradient(180deg,rgba(240,160,48,.3) 0%,rgba(200,120,20,.5) 100%);
}

/* Checkbox */
.pk_check:not(:checked),.pk_check:checked{position:absolute;left:-9999px}
.pk_check:not(:checked)+label,.pk_check:checked+label{
	position:relative;display:inline-block;
	height:24px;line-height:24px;padding-left:30px;cursor:pointer;
}
.pk_check:not(:checked)+label:before,.pk_check:checked+label:before{
	content:'';position:absolute;left:0;top:0;
	width:20px;height:20px;
	background:rgba(10,7,4,.5);
	border:1px solid var(--bd-s);border-radius:20px;
	box-shadow:inset 0 1px 0 0 rgba(0,0,0,.2);
	outline:0;
}
.pk_check:not(:checked)+label:after,.pk_check:checked+label:after{
	content:' ';position:absolute;left:3px;top:3px;
	width:16px;height:16px;
	background:var(--ac);border-radius:20px;
	outline:0;transition:opacity .1s,transform .1s;
	box-shadow:0 0 6px var(--ac-glow);
}
.pk_check:checked+label:before{border-color:var(--ac)}
.pk_check:not(:checked)+label:after{opacity:0;transform:scale(0)}
.pk_check:checked+label:after{opacity:1;transform:scale(1)}
.pk_check:disabled:not(:checked)+label:before,
.pk_check:disabled:checked+label:before{box-shadow:none;border-color:var(--fg-3);background:rgba(10,7,4,.3)}
.pk_check:disabled+label{color:var(--fg-2)}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* ---------- EQ / FX ---------- */
.pk_dck{position:relative;display:none;width:100%;box-sizing:border-box;overflow-x:auto;overflow-y:hidden}
.pk_dck.pk_drag{overflow:visible;z-index:16}

.pk_frqan{
	position:absolute;z-index:13;
	width:380px;height:110px;margin:15px;
	background:rgba(16,12,8,.92);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border:1px solid rgba(240,160,48,.10);border-radius:var(--r-md);
	box-shadow:var(--glass-shadow);
}
.pk_mixwin{width:620px;height:280px;max-width:calc(100vw - 32px)}

.pk_peq{position:relative;width:450px;height:225px;z-index:3}
.pk_peq2{
	position:absolute;left:14px;
	width:225px;height:112px;z-index:2;
	transform:scale(2);transform-origin:0 0;
}
.pk_peq3{position:relative;z-index:1;color:var(--fg-2);font:10px var(--ff-mono)}
.pk_peq3 span span{
	position:absolute;top:-229px;left:50%;
	width:1px;height:225px;
	display:block;border-left:1px dashed rgba(240,160,48,.10);
}
.pk_peq4{
	position:absolute;left:0;top:0;height:225px;
	color:var(--fg-2);font:9px var(--ff-mono);
}
.pk_peq4:before{
	content:' ';position:absolute;left:15px;top:5px;
	display:block;width:450px;height:225px;
	background:rgba(18,13,8,.6);
	backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.pk_peq4 span span{
	position:absolute;left:18px;top:5px;
	display:block;width:446px;height:1px;
	border-top:1px solid rgba(240,160,48,.10);
}
.pk_peq4 span{position:absolute;left:0;top:50%;width:15px;text-align:center}

.pk_pgeq_els{
	padding:6px 0;border-bottom:1px solid rgba(240,160,48,.06);
	transition:background 100ms var(--ease);
}
.pk_pgeq_els:hover{background:rgba(240,160,48,.04)}
.pk_pgeq_els.pk_act{background:linear-gradient(90deg,var(--ac-soft),transparent)}
.pk_pgeq_els>span{display:inline-block;width:18%;color:var(--fg-0);font:12px var(--ff);text-align:center}
.pk_pgeq_els .pk_txlft{width:20%;text-align:left}
.pk_pgeq_els .pk_del{width:8%;font-size:8px;text-align:left;overflow:hidden}
.pk_pgeq_els>div{display:inline-block;width:18%;position:relative;text-align:center}
.pk_pgeq_els .pk_val{
	float:none;margin:0;
	min-width:32px;max-width:44px;color:var(--fg-0);
	border-left:none;border-right:none;outline:0;
}
.pk_pgeq_els select{margin:0 auto;padding:0 0 0 var(--s3)}

.pk_pgeq_freq{
	position:absolute;left:-100px;top:30px;z-index:9;
	width:220px;padding:3px 20px;
	background:rgba(16,12,8,.94);
	backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
	border:1px solid rgba(240,160,48,.12);border-radius:var(--r-xl);
	box-shadow:var(--glass-shadow),var(--glow-sm);
}
.pk_pgeq_freq .pk_arr{
	position:absolute;left:50%;top:-8px;
	width:0;height:0;
	border-left:8px solid transparent;border-right:8px solid transparent;
	border-bottom:8px solid rgba(16,12,8,.94);
	pointer-events:none;
}

.pk_pgeq_els .pk_check:not(:checked)+label,
.pk_pgeq_els .pk_check:checked+label{
	position:relative;display:inline-block;
	height:24px;line-height:20px;
	padding-left:25px;margin:0;
	font-size:10px;cursor:pointer;
}
.pk_pgeq_els i{display:inline-block;padding:0 var(--s2);margin-right:var(--s2)}

label.pk_dis,.pk_pgeq_els.pk_dis .pk_gain{pointer-events:none;opacity:.5}

.pk_pglst{max-height:160px;padding-bottom:20px;overflow-y:scroll}
.pk_pglst::-webkit-scrollbar{width:0}

/* ---------- Tabs ---------- */
.pk_tbs{margin:-10px -14px 0;text-align:center}
.pk_tbsa{
	display:inline-block;width:33.333%;padding:10px 0;
	background:rgba(18,13,8,.7);color:var(--fg-2);
	border-right:1px solid rgba(240,160,48,.05);
	border-bottom:1px solid rgba(240,160,48,.05);
	box-sizing:border-box;
	transition:all var(--tr);
}
.pk_tbsa:hover{box-shadow:inset 0 -2px 8px rgba(240,160,48,.05)}
.pk_tbsa.pk_act{
	background:transparent;border-bottom:none;box-shadow:none;
	color:var(--ac-h);text-shadow:0 0 10px var(--ac-glow);
}

#pk_tmp_tap{
	position:relative;width:100%;min-width:500px;height:30px;
	margin-bottom:10px;clear:both;overflow:hidden;
	background:rgba(20,15,10,.6);
	border:1px solid rgba(240,160,48,.06);border-top:0;
	box-sizing:border-box;
}
#pk_tmp_tap2 .pk_obj,#pk_tmp_tap .pk_obj{
	position:absolute;top:0;left:-4px;z-index:2;
	width:100%;height:100%;
	background:linear-gradient(to right,rgba(232,48,80,.4) 0%,transparent 25%,transparent 100%);
	border-left:2px solid var(--rec);
	transform:translate3d(100%,0,0);
	will-change:transform;overflow:hidden;
	transition:transform 3.3s linear;
}
#pk_tmp_tap2 .pk_obj{transform:translate3d(50%,0,0);transition:transform 1770ms linear}
#pk_tmp_tap .pk_obj2{
	position:absolute;left:50%;
	display:block;width:100px;margin-left:-50px;
	font-size:16px;line-height:30px;text-align:center;opacity:.6;
	transition:opacity var(--tr);
}

#pk_tmp_tap3{
	position:relative;width:100%;min-width:500px;min-height:200px;
	margin-top:10px;overflow:hidden;
	background:rgba(20,15,10,.6);
	backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
	border:1px solid rgba(240,160,48,.06);box-sizing:border-box;
	transition:background 80ms var(--ease);
}
#pk_tmp_tap3:hover{background:rgba(28,20,13,.6)}
#pk_tmp_tap3.pk_act{background:rgba(36,26,16,.6)}

/* ---------- ID3 / Local files ---------- */
.pk_id3ttl{display:inline-block;min-width:64px;padding:2px var(--s3);font-weight:bold}

.pk_lcldrf{
	position:relative;overflow:hidden;
	margin:10px -5px 0;padding:6px 5px 14px;
	border-bottom:1px solid rgba(240,160,48,.06);
	transition:background var(--tr);
}
.pk_lcldrf:hover{background:rgba(240,160,48,.04)}
.pk_lcldrf .pk_i{
	display:inline-block;min-width:20px;padding-right:5px;
	color:var(--fg-1);font:11px var(--ff-mono);line-height:16px;
	vertical-align:middle;
}
.pk_lcla{margin:0 10px 0 15px;vertical-align:middle}
.pk_lcla2{
	position:absolute;left:7px;bottom:16px;
	display:block;padding:1px var(--s2);
	background:rgba(0,0,0,.6);border:1px solid var(--bd);
	border-radius:var(--r);font-size:9px;
}
.pk_lcla2.pk_act{background:var(--ac);color:var(--ac-ink)}
.pk_lcli{
	display:inline-block;width:120px;max-width:120px;height:48px;
	background:rgba(10,7,4,.5);border:1px solid var(--bd-s);
	vertical-align:middle;
}
.pk_lcls{
	display:inline-block;width:25%;min-width:74px;
	margin-bottom:6px;line-height:16px;white-space:nowrap;
	vertical-align:top;
}

.pk_aut_act,.pk_aut{
	box-shadow:var(--glow-md),inset 0 0 6px rgba(240,160,48,.15);
}

/* ---------- Standalone ---------- */
body.pk_stndln{padding-bottom:600px;overflow:hidden}
.pk_stndln .pk_fxd{position:fixed;left:0;top:0;width:100%;height:100%;height:100dvh}
.pk_stndln .pk_modal_back{position:fixed}
.pk_fnt10 .pk_modal_a_bottom{font-size:10px}

/* ---------- Animations ---------- */
@keyframes pk_ppr{
	0%{transform:scale(.95);opacity:0}
	100%{transform:scale(1);opacity:1}
}
@keyframes pk_shw{
	0%{opacity:0;transform:translateY(6px)}
	100%{opacity:1;transform:translateY(0)}
}
@keyframes pk_loader_anim{
	0%{transform:scaleX(0) translate3d(0,0,0)}
	25%{transform:scaleX(.5) translate3d(0,0,0)}
	50%{transform:scaleX(.35) translate3d(70%,0,0)}
	75%{transform:scaleX(.55) translate3d(50%,0,0)}
	100%{transform:scaleX(1) translate3d(100%,0,0)}
}
@keyframes fade_anim{to{opacity:.78}}

/* ---------- Custom scrollbars ---------- */
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:rgba(14,10,7,.4)}
*::-webkit-scrollbar-thumb{
	background:rgba(240,160,48,.12);border:2px solid rgba(14,10,7,.4);border-radius:var(--r-md);
}
*::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:active{background:rgba(240,160,48,.25);box-shadow:none}

/* ---------- Responsive ---------- */
@media only screen and (max-height:438px){
	.pk_zoombtn .pk_zoom_out_v,.pk_zoombtn .pk_zoom_in_v{display:none!important}
}

@media only screen and (max-width:1250px){
	.pk_tbc{
		overflow-x:scroll;overflow-y:hidden;
		background:var(--glass-bg);
		backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
		border-bottom:var(--glass-border);
		-webkit-overflow-scrolling:touch;scrollbar-width:none;
	}
	.pk_tbc::-webkit-scrollbar{width:0;height:0}
	.pk_tb{border-bottom:none;white-space:nowrap;display:inline-block;min-width:max-content}
	.pk_ctns,.pk_transport,.pk_mtbeat{
		float:none;display:block;height:28px;
		min-width:auto;margin:0 14px 0 0;
		border:0;background:transparent;box-shadow:none;
	}
	.pk_mt_on .pk_transport,.pk_mt_on .pk_ctns{display:block}
	.pk_mtbeat{
		display:none;grid-template-columns:40px 36px;grid-template-rows:22px 16px;
		gap:1px 4px;align-items:center;height:42px;padding:1px 6px 0;
		background:transparent;box-shadow:none;vertical-align:top;
	}
	.pk_mt_on .pk_mtbeat{display:inline-grid}
	.pk_tb .pk_mtbeat .pk_mtbeat_btn{
		grid-column:1;grid-row:2;width:40px;height:16px;
		margin:0;font-size:8px;line-height:16px;
	}
	.pk_tb .pk_mtbeat .pk_mtbeat_snap{grid-column:2;width:36px}
	.pk_tb .pk_mtbeat .pk_mtbeat_sig{
		grid-column:2;grid-row:1;width:36px;height:22px;
		margin:0;font-size:10px;line-height:22px;
	}
	.pk_mtbeat_bpm{grid-column:1;grid-row:1;width:40px;height:22px;margin:0;font-size:11px;line-height:22px}
	.pk_mtbeat b{display:none}
	.pk_selection{min-width:auto}
	.pk_tb .pk_btn{width:26px;height:25px;margin:0 3px;font-size:12px;line-height:24px}
	.pk_sellist .pk_title{font-size:10px}
	.pk_selection .pk_sellist{width:296px}
	.pk_tb .pk_selection .pk_btn{
		width:60px;height:32px;margin:3px 0 0 10px;
		font-size:11px;line-height:10px;
	}
	.pk_mark1{width:5.554%}
	.pk_mark1.pk_odd{display:none}
}

@media only screen and (max-width:864px){
	.pk_selection .pk_sellist div{margin:0 16px 0 0}
	.pk_sellist .pk_title{display:none}
	.pk_tb .pk_selection .pk_btn{width:34px}
	.pk_selection .pk_sellist{width:212px}
	.icon-clearsel:before{content:"clear"}
	.pk_mark1{font-size:9px;letter-spacing:0}
}

@media only screen and (max-width:779px){
	.pk_selection{display:none!important}
	.pk_mob .pk_selection{
		float:none;display:inline-flex!important;align-items:center;min-width:0;height:36px;
		margin:0 8px 0 4px;padding:0;border:0;background:transparent;box-shadow:none;
		vertical-align:middle;
	}
	.pk_mob .pk_selection .pk_sellist{display:none}
	.pk_mob .pk_selection .icon-clearsel{
		width:64px;height:32px;min-height:32px;
		margin:0 4px;padding:0 6px;
		font-size:11px;line-height:1;
	}
	.pk_btn button{padding:2px var(--s3)}
	.pk_timecontainer{width:200px;margin-right:10px}
	.pk_timing{padding:12px 0 0 8px;font-size:24px}
	.pk_total_dur,.pk_hover_dur{font-size:12px}
	.pk_mt_topbtn em{display:none}
	.pk_hdr .pk_btn{margin:2px 8px 0}
	.pk_tbc{
		overflow-x:scroll;overflow-y:hidden;
		background:var(--glass-bg);
		backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
		border-bottom:var(--glass-border);
		-webkit-overflow-scrolling:touch;scrollbar-width:none;
	}
	.pk_tbc::-webkit-scrollbar{width:0;height:0}
	.pk_tb{padding:6px 0 6px 14px;border-bottom:none;white-space:nowrap;display:inline-block;min-width:max-content}
	.pk_mob .pk_ctns,.pk_mob .pk_transport{height:36px}
	.pk_mark1{font-size:8px}
	.pk_tmpMsg{width:240px;margin-left:-120px;font-size:14px;line-height:28px}
	.pk_mob .pk_hdr{padding:20px 5px 0}
	.pk_mob .pk_transport,.pk_mob .pk_ctns,.pk_mob .pk_btngroup{float:none;display:inline-block;vertical-align:baseline}
	.pk_mob .pk_mtbeat{float:none}
	.pk_mob.pk_mt_on .pk_mtbeat{display:inline-grid}
	.pk_mob .pk_selection{display:inline-flex!important}
	.pk_mob .pk_btngroup{padding-top:8px}
	.pk_mob .pk_tb .pk_btn{width:32px;height:32px;margin:0 4px;font-size:16px;line-height:24px}
	.pk_mob .pk_tb .pk_mtbeat .pk_mtbeat_btn{width:40px;height:16px;margin:0;font-size:8px;line-height:16px}
	.pk_mob .pk_tb .pk_mtbeat .pk_mtbeat_snap{width:36px}
	.pk_mob .pk_tb .pk_mtbeat .pk_mtbeat_sig{width:36px;height:22px;margin:0;font-size:10px;line-height:22px}
	.pk_mob .pk_tb .pk_selection .icon-clearsel{
		width:auto;min-width:54px;height:32px;
		margin:0 8px 0 5px;padding:0 10px;
		font-size:11px;line-height:1;
	}
	.pk_h200 .pk_col{width:20%;overflow:hidden}
	.pk_zoombtn button{height:19px}
	.pk_wavescroll{height:16px;margin-bottom:8px}
	.pk_markers{margin-top:3px}
	.pk_mob .pk_ftr{
		padding-bottom:var(--s2);
		padding-bottom:max(var(--s2),calc(var(--s2) + env(safe-area-inset-bottom,0px) - 4px));
	}
	.pk_lcldrf .pk_lcla{margin-left:14px;font-size:12px}
}

@media only screen and (max-width:400px){
	.pk_hdr .pk_btn{margin:2px 4px 0}
	.pk_timecontainer{width:160px}
	.pk_timing{font-size:15px;letter-spacing:0;padding:14px 0 0 6px}
	.pk_timingcnv{top:11px;transform:scale(.6);transform-origin:0 0}
	.pk_total_dur,.pk_hover_dur{font-size:10px}
	.pk_total_dur{top:8px}
	.pk_hover_dur{top:24px}
	.pk_hdr .pk_btn .pk_menu{min-width:160px}
}

/* ---------- Touch primitives ---------- */
@media (hover:none){
	a:hover,.pk_hdr .pk_btn:hover,.pk_hdr .pk_btn:hover>button,
	.pk_hdr .pk_btn .pk_menu_el:hover button,
	.pk_prc button:hover,.pk_tb .pk_btn:not(.pk_act):hover,
	.pk_mt_head button:not(.pk_act):hover,.pk_mt_head button.pk_inact:hover,
	.pk_mt_track button:not(.pk_act):hover,.pk_mt_knob:hover,
	.pk_mt_topbtn:hover,.pk_zoombtn button:hover,
	.pk_modal_a_bottom:hover,.pk_modal_a_red:hover,.pk_modal_cancel:hover,
	.pk_modal_a_accpt:hover,.pk_pgeq_els:hover,.pk_tbsa:hover,.pk_lcldrf:hover{
		background:inherit;color:inherit;border-color:inherit;
		box-shadow:none;text-shadow:none;
	}
	.pk_mt_clip:hover .pk_mt_trim:after{opacity:0}
	*::-webkit-scrollbar-thumb:hover{background:transparent;box-shadow:none}
	.pk_btn:hover span,.pk_mt_head button:hover span,
	.pk_mt_track button:hover span,.pk_mt_knob:hover span{visibility:hidden;opacity:0}

	.pk_mt_topbtn.pk_act,.pk_mt_topbtn.pk_act:hover{
		color:var(--ac-ink);border-color:var(--ac);
		background:linear-gradient(135deg,var(--ac),#e89020);
		box-shadow:var(--glow-lg),inset 0 1px 0 rgba(255,255,255,.25);
	}
	.pk_hdr .pk_btn.pk_act,.pk_hdr .pk_btn.pk_act:hover{
		background:transparent;color:var(--ac-ink);text-shadow:none;box-shadow:none;
	}
	.pk_hdr .pk_btn.pk_act>button,.pk_hdr .pk_btn.pk_act:hover>button{
		background:linear-gradient(135deg,var(--ac),#e89020);
		color:var(--ac-ink);box-shadow:var(--glow-md);
	}
}

.pk_btn,.pk_mt_head button,.pk_mt_track button,.pk_mt_knob,
.pk_mt_clip,.pk_mt_trim,.pk_mt_fade,.pk_mt_region,
.pk_mt_ruler,.pk_zoombtn button,.pk_mt_topbtn,
.pk_modal_a_bottom,.pk_pan_btn,.pk_peaker,.pk_volpar{
	touch-action:manipulation;
	-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;
}
input,textarea{-webkit-touch-callout:none}
.pk_mt_tracks_wrap,.pk_mt_main{-webkit-overflow-scrolling:touch;overscroll-behavior:none}
.pk_mt_tracks_wrap,.pk_mt_main,.pk_mt_lanes,.pk_mt_lane{touch-action:pan-y}
.pk_mt_clip.pk_mt_clip_sel .pk_mt_trim,.pk_mt_clip.pk_mt_clip_sel .pk_mt_fade,
.pk_mt_region,.pk_mt_knob,.pk_mt_resize{touch-action:none}

/* ---------- Mobile sizing ---------- */
.pk_mob .pk_mt_head button span,.pk_mob .pk_mt_track button span,
.pk_mob .pk_mt_knob span{visibility:hidden;display:none}
.pk_mob .pk_mt_tracks_wrap{overflow-y:scroll}
.pk_mob .pk_mt_main{overflow-x:auto;overflow-y:scroll;scrollbar-width:none}
.pk_mob .pk_mt_main::-webkit-scrollbar{width:0;height:0}
.pk_mob .pk_mt_clip{min-width:24px;touch-action:pan-y}

.pk_mob .pk_mt_side{flex:0 0 154px;width:154px}
.pk_mob .pk_mt_track{padding:6px 5px}
.pk_mob .pk_mt_track input{height:26px;margin-bottom:8px;padding:0 5px}
.pk_mob .pk_mt_head{gap:2px}
.pk_mob .pk_mt_head button{width:30px;height:24px;font-size:13px}
.pk_mob .pk_mt_track button{width:28px;height:28px;margin-right:3px;font-size:13px}
.pk_mob .pk_mt_knob{width:32px;height:32px}
.pk_mob .pk_mt_knob i{left:14px;top:5px}
.pk_mob .pk_mt_track .pk_mt_rec{position:absolute;right:5px;top:40px;margin:0}
.pk_mob .pk_mt_track .pk_mt_del{right:5px;top:6px;margin:0}
.pk_mob .pk_mt_track .pk_mt_knob{width:34px;height:34px;margin:15px 14px 0 0;vertical-align:top}
.pk_mob .pk_mt_track .pk_mt_knob:before{top:-8px;font-size:6px}
.pk_mob .pk_mt_track .pk_mt_knob:after{display:block;left:-7px;top:37px;width:48px;font-size:9px}
.pk_mob .pk_mt_track.pk_mt_compact .pk_mt_knob:after{display:none}
.pk_mob .pk_mt_track .pk_mt_knob i{left:16px;top:5px;height:12px;transform-origin:1px 11px}
.pk_mob .pk_mt_resize{display:none}
.pk_mob .pk_mt_trim{width:18px}
.pk_mob .pk_mt_region{touch-action:pan-y}
.pk_mob .pk_mt_region .wavesurfer-handle{width:18px;max-width:none}
.pk_mob .pk_mt_region .wavesurfer-handle-start{left:-9px}
.pk_mob .pk_mt_region .wavesurfer-handle-end{left:auto;right:-9px}
.pk_mob .pk_mt_region .wavesurfer-handle{touch-action:none}

@media only screen and (max-width:480px){
	.pk_modal{min-width:auto;width:calc(100vw - 24px);max-width:100%}
	.pk_modal.pk_bigger{min-width:auto;width:calc(100vw - 24px)}
	.pk_modal_cnt{padding:20px 10px}
	.pk_modal_main{padding:0 10px 48px}
	.pk_modal.pk_bigger .pk_row label.pk_line{width:70px}
	.pk_modal.pk_bigger .pk_horiz,.pk_modal.pk_bigger .pk_grmtr{max-width:145px}
	.pk_modal.pk_bigger .pk_val{padding:4px 8px}
	.pk_frqan,.pk_peq{width:calc(100vw - 32px);max-width:380px}
	.pk_mixwin{max-width:calc(100vw - 32px)}
	.pk_peq{height:auto}
	.pk_peq2{width:50%}
	.pk_selection .pk_sellist{width:auto;max-width:calc(100vw - 24px)}
	.pk_mt_side{flex:0 0 132px;width:132px}
}

/* =============================================================
   LOKLOK Collaboration Panel — Multi-User Recording Session
   ============================================================= */

.pk_collab_toggle{
	font-size:11px;
	letter-spacing:.5px;
	text-transform:uppercase;
}

.pk_collab_panel{
	position:absolute;
	top:0;right:0;
	width:280px;
	max-height:100%;
	overflow-y:auto;
	z-index:50;
	background:var(--bg-1);
	backdrop-filter:blur(24px);
	-webkit-backdrop-filter:blur(24px);
	border-left:1px solid var(--ac-soft);
	box-shadow:-8px 0 32px rgba(0,0,0,.4);
	display:flex;
	flex-direction:column;
	font-family:inherit;
	font-size:12px;
	color:var(--fg-0);
}
.pk_collab_panel *,
.pk_collab_panel *::before,
.pk_collab_panel *::after{box-sizing:border-box}

.pk_collab_head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:12px 14px 10px;
	border-bottom:1px solid var(--ac-soft);
}
.pk_collab_title{
	font-size:13px;
	font-weight:600;
	letter-spacing:.8px;
	text-transform:uppercase;
	color:var(--ac);
}

.pk_collab_body{
	padding:12px 14px 16px;
	flex:1;
}

.pk_collab_connect{
	display:flex;
	flex-direction:column;
	gap:8px;
}
.pk_collab_connect input{
	background:var(--bg-2);
	border:1px solid var(--fg-3);
	border-radius:6px;
	padding:8px 10px;
	color:var(--fg-0);
	font-size:12px;
	font-family:inherit;
	outline:none;
	transition:border-color .2s, box-shadow .2s;
}
.pk_collab_connect input:focus{
	border-color:var(--ac);
	box-shadow:0 0 0 2px var(--ac-soft);
}
.pk_collab_connect input::placeholder{color:var(--fg-2)}

.pk_collab_btn{
	background:var(--ac);
	color:var(--ac-ink);
	border:none;
	border-radius:6px;
	padding:8px 14px;
	font-size:11px;
	font-weight:700;
	letter-spacing:.6px;
	text-transform:uppercase;
	cursor:pointer;
	transition:background .15s, transform .1s;
}
.pk_collab_btn:hover{background:var(--ac-h)}
.pk_collab_btn:active{transform:scale(.97)}

.pk_collab_status{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:8px;
	padding-bottom:12px;
	border-bottom:1px solid var(--ac-soft);
	margin-bottom:12px;
}
.pk_collab_roomname{
	font-size:12px;
	font-weight:600;
	color:var(--ac);
	background:var(--ac-soft);
	padding:4px 10px;
	border-radius:4px;
	max-width:160px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.pk_collab_peers{
	display:flex;
	flex-direction:column;
	gap:6px;
}
.pk_collab_empty{
	text-align:center;
	color:var(--fg-2);
	padding:16px 0;
	font-style:italic;
	font-size:11px;
}

.pk_collab_peer{
	display:flex;
	align-items:center;
	gap:8px;
	padding:8px 10px;
	background:var(--bg-2);
	border:1px solid var(--fg-3);
	border-radius:6px;
	transition:border-color .2s;
}
.pk_collab_peer.pk_collab_stream{
	border-color:rgba(80,200,120,.3);
}
.pk_collab_peer.pk_collab_rec_active{
	border-color:var(--rec);
	box-shadow:0 0 8px var(--rec-glow);
	animation:pk_collab_rec_pulse 1.2s ease-in-out infinite;
}
@keyframes pk_collab_rec_pulse{
	0%,100%{box-shadow:0 0 8px var(--rec-glow)}
	50%{box-shadow:0 0 16px var(--rec-glow)}
}

.pk_collab_peer_name{
	flex:1;
	font-weight:600;
	font-size:12px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.pk_collab_peer_status{
	font-size:10px;
	letter-spacing:.5px;
	text-transform:uppercase;
	color:var(--fg-2);
	min-width:42px;
	text-align:center;
}
.pk_collab_stream .pk_collab_peer_status{color:rgba(80,200,120,.8)}
.pk_collab_rec_active .pk_collab_peer_status{
	color:var(--rec);
	font-weight:700;
	animation:pk_collab_rec_blink .8s steps(1) infinite;
}
@keyframes pk_collab_rec_blink{
	0%,100%{opacity:1}50%{opacity:.4}
}

.pk_collab_rec_btn{
	padding:4px 10px;
	font-size:10px;
	border-radius:4px;
	background:var(--bg-3);
	color:var(--fg-0);
	border:1px solid var(--fg-3);
	cursor:pointer;
	transition:background .15s;
}
.pk_collab_rec_btn:hover{
	background:var(--rec);
	color:#fff;
	border-color:var(--rec);
}

/* Collab panel scrollbar */
.pk_collab_panel::-webkit-scrollbar{width:4px}
.pk_collab_panel::-webkit-scrollbar-track{background:transparent}
.pk_collab_panel::-webkit-scrollbar-thumb{background:var(--fg-3);border-radius:2px}