.ws-moon { font-size: 1.3rem; }

        .ws-title {
            font-family: 'Amiri', serif;
            font-size: 1.5rem;
            color: #453405;
            line-height: 1.2;
        }

        .ws-clock {
            font-size: 1.2rem;
            font-weight: bold;
            color: #453405;
            text-align: center;
            letter-spacing: 0.05em;
            margin-bottom: 4px;
        }

        .ws-date {
            font-family: 'Amiri', serif;
            font-size: 0.72rem;
            color: #405545;
            text-align: center;
            margin-bottom: 8px;
            line-height: 1.5;
        }

        .ws-date .day { color: #453405; font-size: 0.78rem; }

        .ws-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 3px 5px;
            border-radius: 5px;
            margin-bottom: 2px;
            transition: background 0.2s;
        }

        .ws-row.active {
            background: rgba(201,168,76,0.15);
            border: 1px solid rgba(201,168,76,0.3);
        }

        .ws-name {
            font-size: 0.68rem;
            letter-spacing: 0.04em;
            color: #364d36;
        }

        .ws-row.active .ws-name { color: #453405; }

        .ws-time {
            font-size: 0.72rem;
            font-weight: bold;
            color: #8a9e8e;
        }

        .ws-row.active .ws-time { color: #453405; }

        .ws-dot {
            width: 4px; height: 4px;
            border-radius: 50%;
            background: transparent;
            margin-right: 2px;
        }

        .ws-row.active .ws-dot { background: #c79c25; box-shadow: 0 0 4px #ca9a17; }

        .ws-loading {
            font-size: 0.65rem;
            color: #8a9e8e;
            text-align: center;
            padding: 8px 0;
        }

        /* responsive */
        @media (max-width: 600px) {
            .ws-widget { width: 100%; margin-left: 0; }
            .ws-title { font-size: 1.2rem; }
            .ws-clock { font-size: 1rem; }
            .ws-date { font-size: 0.6rem; }
            .ws-name { font-size: 0.6rem; }
            .ws-time { font-size: 0.6rem; }
            .ws-loading { font-size: 0.6rem; }
            .ws-dot { width: 3px; height: 3px; }
        }

        @media (max-width: 400px) {
            .ws-widget { width: 100%; margin-left: 0; }
            .ws-title { font-size: 1rem; }
            .ws-clock { font-size: 0.8rem; }
            .ws-date { font-size: 0.5rem; }
            .ws-name { font-size: 0.5rem; }
            .ws-time { font-size: 0.5rem; }
            .ws-loading { font-size: 0.5rem; }
            .ws-dot { width: 2px; height: 2px; }
        }