@keyframes cg-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.circle-generator-shell{--cg-ease:cubic-bezier(.23, 1, .32, 1);--cg-card-bg:var(--primary-850);--cg-card-border:1px solid #ffffff0f;--cg-card-radius:12px;--cg-card-pad:28px;--cg-canvas-bg:linear-gradient(180deg, #12151ffa, #0d1018fa), var(--primary-1000);flex-direction:column;gap:20px;display:flex}.circle-generator-shell>*{animation:cg-rise .48s var(--cg-ease) backwards}.circle-generator-shell>:first-child{animation-delay:40ms}.circle-generator-shell>:nth-child(2){animation-delay:.12s}.circle-generator-shell .cg-workspace{grid-template-columns:minmax(0,340px) minmax(0,1fr);align-items:start;gap:20px;display:grid}@media (max-width:900px){.circle-generator-shell .cg-workspace{grid-template-columns:1fr}}.circle-generator-shell .cg-sidebar{flex-direction:column;gap:14px;display:flex}.circle-generator-shell .cg-eyebrow{color:var(--white-40);letter-spacing:.06em;text-transform:uppercase;font-size:12px;font-weight:700}.circle-generator-shell .cg-stats{flex-direction:column;gap:14px;display:flex}.circle-generator-shell .cg-stat{background:var(--cg-card-bg);border:var(--cg-card-border);border-radius:var(--cg-card-radius);align-items:center;gap:16px;padding:18px 22px;display:flex}.circle-generator-shell .cg-stat .cg-stat-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:inline-flex}.circle-generator-shell .cg-stat .cg-stat-icon svg{width:20px;height:20px}.circle-generator-shell .cg-stat.cg-stat-diameter .cg-stat-icon{color:var(--secondary-500);background:#ffa14b1f}.circle-generator-shell .cg-stat.cg-stat-blocks .cg-stat-icon{color:#4bc0c0;background:#4bc0c01f}.circle-generator-shell .cg-stat .cg-stat-text{flex-direction:column;gap:4px;min-width:0;display:flex}.circle-generator-shell .cg-stat .cg-stat-label{color:var(--white-50);letter-spacing:.06em;text-transform:uppercase;font-size:12px;font-weight:700}.circle-generator-shell .cg-stat .cg-stat-value{color:var(--white-100);font-size:24px;font-weight:var(--font-bold);font-variant-numeric:tabular-nums;align-items:baseline;gap:6px;line-height:1.1;display:inline-flex}.circle-generator-shell .cg-stat .cg-stat-unit{color:var(--white-40);font-size:13px;font-weight:var(--font-medium);letter-spacing:0}.circle-generator-shell .cg-stat .cg-stat-note{color:var(--white-40);font-variant-numeric:tabular-nums;font-size:12px;font-weight:var(--font-medium);padding-left:4px;line-height:1.2}.circle-generator-shell .cg-stat .cg-stat-note:before{color:var(--white-20);content:"·";margin-right:6px}.circle-generator-shell .cg-controls{background:var(--cg-card-bg);border:var(--cg-card-border);border-radius:var(--cg-card-radius);padding:var(--cg-card-pad);flex-direction:column;gap:18px;display:flex}.circle-generator-shell .cg-control-header{justify-content:space-between;align-items:center;display:flex}.circle-generator-shell .cg-thickness-control{flex-direction:column;gap:10px;display:flex}.circle-generator-shell .cg-control-readout{color:var(--white-100);font-variant-numeric:tabular-nums;font-size:22px;font-weight:var(--font-bold);line-height:1}.circle-generator-shell .cg-control-value{color:var(--white-100);font-variant-numeric:tabular-nums;font-family:inherit;font-size:22px;font-weight:var(--font-bold);text-align:right;min-width:0;height:24px;transition:color .16s var(--cg-ease);width:4ch;line-height:1;appearance:none!important;-moz-appearance:textfield!important;-webkit-appearance:none!important;box-shadow:none!important;background:0 0!important;border:0!important;border-radius:0!important;outline:0!important;margin:0!important;padding:0!important}.circle-generator-shell .cg-control-value::-webkit-inner-spin-button{appearance:none;margin:0}.circle-generator-shell .cg-control-value::-webkit-outer-spin-button{appearance:none;margin:0}.circle-generator-shell .cg-control-value:hover,.circle-generator-shell .cg-control-value:focus,.circle-generator-shell .cg-control-value:focus-visible,.circle-generator-shell .cg-control-value:active{box-shadow:none!important;background:0 0!important;border:0!important;outline:0!important}.circle-generator-shell .cg-control-value:focus,.circle-generator-shell .cg-control-value:focus-visible{color:var(--secondary-500)}.circle-generator-shell .cg-slider{--cg-fill:0%;appearance:none;cursor:pointer;background:0 0;width:100%;height:22px;margin:0;padding:0}.circle-generator-shell .cg-slider:focus{outline:none}.circle-generator-shell .cg-slider:focus-visible{outline:2px solid var(--secondary-500);outline-offset:6px;border-radius:4px}.circle-generator-shell .cg-slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--secondary-500) 0%, var(--secondary-500) var(--cg-fill), #ffffff0f var(--cg-fill), #ffffff0f 100%);border-radius:999px;height:6px}.circle-generator-shell .cg-slider::-moz-range-track{background:#ffffff0f;border-radius:999px;height:6px}.circle-generator-shell .cg-slider::-moz-range-progress{background:var(--secondary-500);border-radius:999px;height:6px}.circle-generator-shell .cg-slider::-webkit-slider-thumb{appearance:none;background:var(--white-100);cursor:pointer;height:18px;transition:box-shadow .16s var(--cg-ease), transform .16s var(--cg-ease);border:none;border-radius:999px;width:18px;margin-top:-6px;box-shadow:0 0 0 1px #0000002e}.circle-generator-shell .cg-slider::-moz-range-thumb{background:var(--white-100);cursor:pointer;height:18px;transition:box-shadow .16s var(--cg-ease), transform .16s var(--cg-ease);border:none;border-radius:999px;width:18px;box-shadow:0 0 0 1px #0000002e}@media (hover:hover) and (pointer:fine){.circle-generator-shell .cg-slider:hover::-webkit-slider-thumb{box-shadow:0 0 0 5px #ffa14b38}.circle-generator-shell .cg-slider:hover::-moz-range-thumb{box-shadow:0 0 0 5px #ffa14b38}}.circle-generator-shell .cg-slider:active::-webkit-slider-thumb{transform:scale(1.08)}.circle-generator-shell .cg-slider:active::-moz-range-thumb{transform:scale(1.08)}.circle-generator-shell .cg-preset-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.circle-generator-shell .cg-preset-label{color:var(--white-40)}.circle-generator-shell .cg-preset-chips{flex-wrap:wrap;gap:8px;display:flex}.circle-generator-shell .cg-chip{color:var(--white-77);cursor:pointer;font-variant-numeric:tabular-nums;font-size:13px;font-weight:var(--font-semibold);transition:background .16s var(--cg-ease), border-color .16s var(--cg-ease), color .16s var(--cg-ease), transform .16s var(--cg-ease);background:#ffffff0a;border:1px solid #ffffff14;border-radius:999px;padding:8px 14px;line-height:1}@media (hover:hover) and (pointer:fine){.circle-generator-shell .cg-chip:hover{color:var(--white-100);background:#ffffff12;border-color:#ffffff29}}.circle-generator-shell .cg-chip:active{transform:scale(.96)}.circle-generator-shell .cg-chip.is-active{color:var(--secondary-500);background:#ffa14b24;border-color:#ffa14b66}.circle-generator-shell .cg-coord-block{flex-direction:column;gap:10px;display:flex}.circle-generator-shell .cg-coord-heading{flex-direction:column;gap:4px;display:flex}.circle-generator-shell .cg-coord-hint{color:var(--white-40);font-size:12px;font-weight:var(--font-medium);line-height:1.4}.circle-generator-shell .cg-coord-inputs{gap:8px;display:flex}.circle-generator-shell .cg-coord-field{cursor:text;min-width:0;transition:background .16s var(--cg-ease), border-color .16s var(--cg-ease);background:#ffffff0a;border:1px solid #ffffff14;border-radius:8px;flex:1;align-items:center;gap:8px;padding:8px 12px;display:flex}.circle-generator-shell .cg-coord-field:focus-within{background:#ffffff0f;border-color:#ffa14b66}.circle-generator-shell .cg-coord-field>span{color:var(--white-40);letter-spacing:.06em;text-transform:uppercase;flex-shrink:0;font-size:12px;font-weight:700}.circle-generator-shell .cg-coord-field>input{color:var(--white-100);font-variant-numeric:tabular-nums;font-family:inherit;font-size:14px;font-weight:var(--font-semibold);flex:1;width:100%;min-width:0;height:18px;line-height:1;appearance:none!important;-moz-appearance:textfield!important;-webkit-appearance:none!important;box-shadow:none!important;background:0 0!important;border:0!important;border-radius:0!important;outline:0!important;margin:0!important;padding:0!important}.circle-generator-shell .cg-coord-field>input::-webkit-inner-spin-button{appearance:none;margin:0}.circle-generator-shell .cg-coord-field>input::-webkit-outer-spin-button{appearance:none;margin:0}.circle-generator-shell .cg-coord-field>input::placeholder{color:var(--white-20)}.circle-generator-shell .cg-coord-field>input:hover,.circle-generator-shell .cg-coord-field>input:focus,.circle-generator-shell .cg-coord-field>input:focus-visible,.circle-generator-shell .cg-coord-field>input:active{box-shadow:none!important;background:0 0!important;border:0!important;outline:0!important}.circle-generator-shell .cg-tap-readout{background:#ffa14b14;border:1px solid #ffa14b47;border-radius:8px;flex-direction:column;gap:6px;padding:10px 12px;display:flex}.circle-generator-shell .cg-tap-readout .cg-tap-readout-row{align-items:baseline;gap:14px;display:flex}.circle-generator-shell .cg-tap-readout .cg-tap-readout-axis{align-items:baseline;gap:6px;display:inline-flex}.circle-generator-shell .cg-tap-readout .cg-tap-readout-label{color:var(--secondary-500);letter-spacing:.08em;font-size:11px;font-weight:700}.circle-generator-shell .cg-tap-readout .cg-tap-readout-value{color:var(--white-100);font-variant-numeric:tabular-nums;font-size:18px;font-weight:var(--font-bold)}.circle-generator-shell .cg-tap-readout .cg-tap-readout-sep{background:#ffffff1f;align-self:stretch;width:1px}.circle-generator-shell .cg-hover-tip{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--white-100);font-variant-numeric:tabular-nums;pointer-events:none;z-index:50;background:#0b0e15f5;border:1px solid #ffffff24;border-radius:10px;align-items:center;gap:14px;padding:10px 14px;line-height:1;display:inline-flex;position:fixed;box-shadow:0 12px 32px -8px #0009,0 2px 4px #0006}.circle-generator-shell .cg-hover-tip .cg-hover-tip-axis{align-items:baseline;gap:6px;display:inline-flex}.circle-generator-shell .cg-hover-tip .cg-hover-tip-label{color:var(--secondary-500);letter-spacing:.08em;font-size:11px;font-weight:700}.circle-generator-shell .cg-hover-tip .cg-hover-tip-value{color:var(--white-100);font-size:16px;font-weight:var(--font-bold)}.circle-generator-shell .cg-hover-tip .cg-hover-tip-sep{background:#ffffff1f;align-self:stretch;width:1px}.circle-generator-shell .cg-canvas-card{background:var(--cg-card-bg);border:var(--cg-card-border);border-radius:var(--cg-card-radius);padding:var(--cg-card-pad);flex-direction:column;gap:16px;display:flex}.circle-generator-shell .cg-canvas-stage{position:relative}.circle-generator-shell .cg-zoom-toolbar{pointer-events:none;z-index:1;align-items:center;gap:6px;display:inline-flex;position:absolute;top:12px;right:12px}.circle-generator-shell .cg-zoom-toolbar>*{pointer-events:auto}.circle-generator-shell .cg-zoom-badge,.circle-generator-shell .cg-zoom-reset{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--white-77);font-variant-numeric:tabular-nums;font-family:inherit;font-size:12px;font-weight:var(--font-semibold);transition:background .16s var(--cg-ease), border-color .16s var(--cg-ease), color .16s var(--cg-ease);background:#0b0e15c7;border:1px solid #ffffff1a;border-radius:999px;padding:6px 12px;line-height:1}.circle-generator-shell .cg-zoom-reset{cursor:pointer;justify-content:center;align-items:center;width:26px;height:26px;padding:0;display:inline-flex}.circle-generator-shell .cg-zoom-reset svg{flex-shrink:0}@media (hover:hover) and (pointer:fine){.circle-generator-shell .cg-zoom-reset:hover{color:var(--white-100);background:#0b0e15eb;border-color:#ffffff38}}.circle-generator-shell .cg-zoom-reset:active{transform:scale(.95)}.circle-generator-shell .cg-canvas-frame{aspect-ratio:1;background:var(--cg-canvas-bg);overscroll-behavior:contain;scrollbar-color:#ffffff2e transparent;scrollbar-width:thin;-webkit-user-select:none;user-select:none;border:1px solid #ffffff0d;border-radius:10px;width:100%;margin:0 auto;padding:8px;position:relative;overflow:auto}.circle-generator-shell .cg-canvas-frame.is-pannable{cursor:grab}.circle-generator-shell .cg-canvas-frame.is-dragging{cursor:grabbing}.circle-generator-shell .cg-canvas-frame::-webkit-scrollbar{width:8px;height:8px}.circle-generator-shell .cg-canvas-frame::-webkit-scrollbar-track{background:0 0}.circle-generator-shell .cg-canvas-frame::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:999px}.circle-generator-shell .cg-canvas-frame::-webkit-scrollbar-thumb:hover{background:#ffffff52}.circle-generator-shell .cg-canvas-inner{aspect-ratio:1;position:relative}.circle-generator-shell .cg-canvas{aspect-ratio:1;width:100%;display:block}.circle-generator-shell .cg-hover-cell{pointer-events:none;z-index:2;background:#ffffff59;border:2px solid #fff;border-radius:2px;transition:left 60ms linear,top 60ms linear;position:absolute;box-shadow:0 0 0 1px #0000008c,0 0 14px 3px #ffa14b8c}.circle-generator-shell .cg-canvas-hint{color:var(--white-40);text-align:center;flex-wrap:wrap;justify-content:center;gap:6px;margin:0;font-size:12px;line-height:1.4;display:flex}.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-sep{color:var(--white-20)}.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-tap{display:none}@media (hover:none){.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-hover{display:none}.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-tap{display:inline}.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-sep,.circle-generator-shell .cg-canvas-hint .cg-canvas-hint-zoom{display:none}}@media screen and (max-width:640px){.circle-generator-shell{gap:16px}.circle-generator-shell .cg-stats{grid-template-columns:1fr}.circle-generator-shell .cg-controls,.circle-generator-shell .cg-canvas-card{padding:20px}.circle-generator-shell .cg-canvas-frame{padding:6px}}@media (prefers-reduced-motion:reduce){.circle-generator-shell>*{animation:none}.circle-generator-shell .cg-chip{transition:none}.circle-generator-shell .cg-slider::-webkit-slider-thumb{transition:none}.circle-generator-shell .cg-slider::-moz-range-thumb{transition:none}}
