.ptt-clock{
	--ptt-bg:#071018;
	--ptt-bg2:#0b1722;
	--ptt-fg:#edf9ff;
	--ptt-muted:#7f9aaa;
	--ptt-line:rgba(154,211,236,.15);
	--ptt-line-strong:rgba(154,211,236,.28);
	--ptt-accent:#69f0ff;
	--ptt-accent2:#9d7dff;
	--ptt-card:rgba(7,16,24,.86);
	--ptt-border:rgba(181,231,255,.16);
	width:min(100%, 980px);
	margin:2rem auto;
	color:var(--ptt-fg);
	font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.ptt-clock *{box-sizing:border-box}
.ptt-shell{
	position:relative;
	overflow:hidden;
	border:1px solid var(--ptt-border);
	border-radius:32px;
	padding:clamp(18px,3vw,34px);
	background:
		linear-gradient(145deg,rgba(255,255,255,.045),transparent 30%),
		radial-gradient(circle at 50% 18%,rgba(105,240,255,.08),transparent 34%),
		radial-gradient(circle at 78% 76%,rgba(157,125,255,.08),transparent 28%),
		var(--ptt-bg);
	box-shadow:0 30px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
	isolation:isolate;
}
.ptt-shell:before{
	content:"";
	position:absolute;inset:0;pointer-events:none;opacity:.24;
	background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
	background-size:30px 30px;
	mask-image:linear-gradient(to bottom,black,transparent 84%);
}
.ptt-header{
	position:relative;z-index:2;
	display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
	margin-bottom:10px;
}
.ptt-kicker{
	font-size:clamp(12px,1.8vw,15px);
	letter-spacing:.28em;
	font-weight:800;
	color:var(--ptt-fg);
}
.ptt-subtitle{
	margin-top:6px;
	color:var(--ptt-muted);
	font-size:12px;
	letter-spacing:.08em;
}
.ptt-status{
	display:flex;align-items:center;gap:8px;
	font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.18em;color:var(--ptt-accent);
	padding:8px 10px;border:1px solid rgba(105,240,255,.16);border-radius:999px;
	background:rgba(105,240,255,.045);
}
.ptt-status-dot{
	width:7px;height:7px;border-radius:50%;background:var(--ptt-accent);
	box-shadow:0 0 14px var(--ptt-accent);
	animation:ptt-blink 1.6s ease-in-out infinite;
}
.ptt-stage{
	position:relative;
	width:min(100%, 760px);
	margin:0 auto;
}
.ptt-svg{display:block;width:100%;height:auto;overflow:visible}
.ptt-grid circle{
	fill:none;
	stroke:rgba(154,211,236,.075);
	stroke-width:1;
	stroke-dasharray:2 10;
}
.ptt-tree line{
	stroke:var(--ptt-line);
	stroke-width:1.15;
	vector-effect:non-scaling-stroke;
}
.ptt-tree line[data-level="0"]{stroke:var(--ptt-line-strong)}
.ptt-trails path{
	fill:none;
	stroke:var(--ptt-accent);
	stroke-width:1.7;
	stroke-linecap:round;
	stroke-linejoin:round;
	vector-effect:non-scaling-stroke;
}
.ptt-active-path path{
	fill:none;
	stroke:var(--ptt-accent);
	stroke-width:3;
	stroke-linecap:round;
	stroke-linejoin:round;
	vector-effect:non-scaling-stroke;
	opacity:.96;
}
.ptt-nodes circle{
	fill:var(--ptt-bg2);
	stroke:rgba(180,226,245,.23);
	stroke-width:1.1;
	vector-effect:non-scaling-stroke;
}
.ptt-nodes circle.is-active{
	fill:var(--ptt-accent);
	stroke:#dfffff;
	filter:drop-shadow(0 0 5px rgba(105,240,255,.8));
}
.ptt-now circle{
	fill:var(--ptt-accent);
	stroke:#dfffff;
	stroke-width:2;
	filter:drop-shadow(0 0 10px rgba(105,240,255,.9));
}
.ptt-now text{
	fill:#dfffff;
	font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.12em;
}
.ptt-center circle:first-child{
	fill:rgba(255,255,255,.08);
	stroke:rgba(255,255,255,.18);
	stroke-width:1.6;
}
.ptt-center-pulse{
	fill:none;stroke:rgba(255,255,255,.08);stroke-width:2;opacity:.55;
	transform-origin:400px 300px;
	animation:ptt-pulse 2.2s ease-out infinite;
}
.ptt-timebox{
	position:relative;z-index:2;
	text-align:center;
	margin-top:-10px;
}
.ptt-digital{
	display:flex;justify-content:center;align-items:baseline;
	font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
	font-size:clamp(42px,9vw,78px);
	font-weight:300;
	line-height:1;
	letter-spacing:.01em;
	font-variant-numeric:tabular-nums;
	text-shadow:0 0 22px rgba(105,240,255,.10);
}
.ptt-digital i{
	font-style:normal;color:var(--ptt-muted);
	margin:0 .08em;
	transform:translateY(-.04em);
}
.ptt-caption{
	margin-top:10px;
	font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.28em;color:var(--ptt-muted);
}
.ptt-padic-line{
	margin-top:12px;
	font:650 14px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;
	color:var(--ptt-accent);
	word-break:break-word;
}
.ptt-padic-line sub{font-size:.72em;color:var(--ptt-muted)}
.ptt-real-pendant{
	margin:16px auto 0;
	width:min(100%, 420px);
	padding:14px 16px 15px;
	border-radius:18px;
	border:1px solid rgba(105,240,255,.26);
	background:
		linear-gradient(180deg, rgba(105,240,255,.12), rgba(105,240,255,.05)),
		rgba(7,16,24,.72);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 0 0 1px rgba(105,240,255,.06);
}
.ptt-real-pendant-label{
	font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.24em;
	text-transform:uppercase;
	color:var(--ptt-muted);
}
.ptt-real-pendant-value{
	margin-top:8px;
	font:800 clamp(22px,4vw,34px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.02em;
	color:var(--ptt-accent);
	text-shadow:0 0 18px rgba(105,240,255,.14);
}
.ptt-real-pendant-time{
	margin-top:6px;
	font:650 13px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
	color:#dfffff;
}
.ptt-meta{
	position:relative;z-index:2;
	display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
	gap:1px;margin-top:26px;
	border:1px solid var(--ptt-border);
	border-radius:16px;overflow:hidden;
	background:var(--ptt-border);
}
.ptt-meta>div{
	min-width:0;
	background:rgba(6,15,22,.78);
	padding:13px 15px;
	display:flex;flex-direction:column;gap:7px;
}
.ptt-meta span{
	color:var(--ptt-muted);
	font-size:9px;text-transform:uppercase;letter-spacing:.14em;
}
.ptt-meta strong{
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
	font:650 12px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;
	color:var(--ptt-fg);
}
.ptt-profile-panel{
	position:relative;z-index:2;
	margin-top:22px;
	padding:16px 18px;
	border:1px solid rgba(255,255,255,.08);
	border-radius:18px;
	background:rgba(255,255,255,.03);
	text-align:center;
}
.ptt-profile-overline{
	font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.24em;
	color:var(--ptt-muted);
	text-transform:uppercase;
}
.ptt-profile-name{
	margin-top:8px;
	font-size:clamp(18px,3vw,24px);
	font-weight:700;
	letter-spacing:.02em;
	color:var(--ptt-fg);
}
.ptt-profile-note{
	margin-top:7px;
	color:var(--ptt-muted);
	font-size:12px;
	line-height:1.45;
}
.ptt-selector{
	position:relative;z-index:2;
	margin-top:16px;
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:10px;
}
.ptt-profile-btn{
	appearance:none;
	border:1px solid rgba(255,255,255,.12);
	border-radius:14px;
	background:rgba(255,255,255,.035);
	color:var(--ptt-fg);
	cursor:pointer;
	padding:12px 10px;
	font:700 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
	letter-spacing:.08em;
	transition:border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.ptt-profile-btn:hover{
	border-color:rgba(105,240,255,.3);
	background:rgba(105,240,255,.06);
}
.ptt-profile-btn:focus-visible{
	outline:2px solid rgba(105,240,255,.55);
	outline-offset:2px;
}
.ptt-profile-btn.is-active{
	color:#031217;
	background:linear-gradient(180deg,#b8fbff,#69f0ff);
	border-color:rgba(105,240,255,.55);
	box-shadow:0 8px 24px rgba(105,240,255,.18);
}
@keyframes ptt-pulse{0%{transform:scale(.72);opacity:.55}100%{transform:scale(1.72);opacity:0}}
@keyframes ptt-blink{0%,100%{opacity:1}50%{opacity:.35}}
@media(max-width:720px){
	.ptt-selector{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
	.ptt-clock{margin:1rem auto}
	.ptt-shell{border-radius:22px;padding:18px 14px 16px}
	.ptt-subtitle{display:none}
	.ptt-stage{margin-top:4px}
	.ptt-meta{grid-template-columns:1fr}
	.ptt-meta>div{flex-direction:row;justify-content:space-between;align-items:center}
	.ptt-profile-note{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
	.ptt-clock *{animation:none!important;transition:none!important}
}